body {
			width: 100%;
			height: 100%;
			margin: auto;
			background-color: lavender;
			background-repeat: no-repeat;
			background-attachment: fixed;

		}

		.header {
			padding: 10px;
			font-family: Arial;
			text-align: center;
		}

		.header .title {
			font-size: 14pt;
		}

		.header .connection_status {
			font-size: 11pt;
		}

		.ip_address {
			font-family: Arial;
		}

		.header .ip_address {
			color: #ccccff;
			font-size: 10pt;
		}

		.connection_status {
			color: white;
			text-align: center;
			display: inline-block;
			margin-left: auto;
			margin-right: auto;
			border: 1px solid black;
			padding: 5px 20px 5px 20px;
			margin-bottom: 5px;
			box-shadow: 1px 1px 3px rgba(130,130,130,1);
			min-width: 300px;
		}
		
		.top-round {
			border-radius: 10px 10px 0px 0px;
		}
		
		.bottom-round {
			border-radius: 0px 0px 10px 10px;
		}
		
		.devices {
			display: flex;
			flex-wrap: wrap;
			justify-content: center;
			max-width: 100%;
		}


		.device {
			border: 1px solid black;
			border-radius: 0px 8px 20px 8px;
			box-shadow: 1px 1px 3px rgba(130,130,130,1);
			height: 78px;
			padding: 3px;
			margin-bottom: 10px;
			margin-left: 10px;
			margin-right: 10px;
			min-width: 300px;
		}
		
		.device-header {
			margin-left: -15px;
			padding-left: 15px;
			margin-right: -15px;
			padding-right: 15px;
			margin-top: -15px;
			padding-top: 15px;
			padding-bottom: 3px;
			background-color: rgb(0,0,0,0.5);
			border-radius: 5px, 0px, 5px, 0px;
		}
		
		.flex-break {
			flex-basis: 100%;
			height: 0;
		}


/*		@media only screen and (min-width:520px) { 
			.device, .connection_status {
				width: 480px;
				margin-left: auto;
				margin-right: auto;
			}
		}*/

		.device_name {
			font-family: Arial;
			font-weight: bold;
			text-decoration: underline;
			font-size: 12pt;
			color: #9999FF;
		}

		.device .ip_address {
			color: #999999;
			font-size: 10pt;
		}

		
		.device_status {
			font-family: Arial;
			font-size: 10pt;
		}
		
		.notes {
			font-family: Arial;
			color: #999999;
			font-size: 10pt;
			font-style: italic;
		}

		.icon {
			display: inline-block;
			float: left;
			padding-right: 7px;
			padding-left: 7px;
			width: 64px;
			height: 64px;
		}

		.go_button {
			display: inline-block;
			float: right;
			padding-right: 7px;
			padding-left: 7px;
			vertical-align: middle;
			height: 100%;
			visibility: hidden;
		}
		
		.go_button img {
			cursor: pointer;
 	}

		.full_screen {
			position: fixed;
			top:0;
			bottom:0;
			right:0;
			left:0;
			overflow:hidden;
			z-index: -999;
		}


		.bg_main {
			/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#45484d+0,000000+100;Black+3D+%231 */
			background: rgb(69,72,77); /* Old browsers */
/*			background: -moz-linear-gradient(top,  rgba(69,72,77,1) 0%, rgba(20,20,20,1) 100%); */ /* FF3.6-15 */
			background: -moz-linear-gradient(-70deg,  #484888 0%, #040414 100% 100%); /* FF3.6-15 */
/*			background: -webkit-linear-gradient(top,  rgba(69,72,77,1) 0%,rgba(20,20,20,1) 100%); */ /* Chrome10-25,Safari5.1-6 */
			background: -webkit-linear-gradient(-70deg, #484888 0%, #040414 100%); /* Chrome10-25,Safari5.1-6 */
/*			background: linear-gradient(to bottom,  rgba(69,72,77,1) 0%,rgba(20,20,20,1) 100%); */ /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
			background: linear-gradient(-70deg, #484888 0%, #040414 100%, #484848 200%, #040404 300%);
			filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#45484d', endColorstr='#0F0F0F',GradientType=0 ); /* IE6-9 */
			
			background-size: 400% 400%;
			animation: gradient 15s ease infinite;

		}
		@keyframes gradient {
			0% {
				background-position: 0% 50%;
			}
			50% {
				background-position: 100% 50%;
			}
			100% {
				background-position: 0% 50%;
			}
		}


		.bg_overlay {
			/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#000000+0,000000+100&0.65+0,0+100;Neutral+Density */
			background: -moz-linear-gradient(-45deg,  rgba(0,0,0,0.65) 0%, rgba(0,0,0,0) 100%); /* FF3.6-15 */
			background: -webkit-linear-gradient(-45deg,  rgba(0,0,0,0.65) 0%,rgba(0,0,0,0) 100%); /* Chrome10-25,Safari5.1-6 */
			background: linear-gradient(135deg,  rgba(0,0,0,0.65) 0%,rgba(0,0,0,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
			filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a6000000', endColorstr='#00000000',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
		}

		.dark_grad {
			/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#000000+0,000000+100&0.65+0,0+100;Neutral+Density */
			background: -moz-linear-gradient(-45deg,  rgba(0,0,0,0.65) 0%, rgba(0,0,0,0) 100%); /* FF3.6-15 */
			background: -webkit-linear-gradient(-45deg,  rgba(0,0,0,0.65) 0%,rgba(0,0,0,0) 100%); /* Chrome10-25,Safari5.1-6 */
			background: linear-gradient(135deg,  rgba(0,0,0,0.65) 0%,rgba(0,0,0,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
			filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a6000000', endColorstr='#00000000',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
		}
		
		.red {
			color: red;
		}
		
		.green {
			color: green;
		}