.key{
	cursor:pointer !important;
	opacity:0.01 !important;
	fill:#000000 !important;
	stroke:#000000 !important;
	stroke-opacity:1 !important;
}
.key:hover{
	opacity: 0.5 !important;
}
.greend,.redd,.grayd,.yellowd,.graybigd ,.greenbigd,.yellowbigd,.redbigd,.graybiggerd ,.greenbiggerd,.redbiggerd,.yellowbiggerd
{
	background-position: 0% 0%;
    border-radius:99px;
    -moz-border-radius:99px;
    -webkit-border-radius:99px;
    color:#fff;
    border:1px #fff solid;
    /*background-color: #e7676d;*/
  /* Saf4+, Chrome */
  /* Chrome 10+, Saf5.1+, iOS 5+ */
  /* FF3.6 */
  /* IE10 */
  /* Opera 11.10+ */
    -webkit-box-shadow: 0px 1px 2px #000000;
    -moz-box-shadow: 0px 1px 2px #000000;
    box-shadow: 0px 1px 2px #000000;
    display: inline-block;
    padding: 3px;
    margin:2px;
    font-family: arial;
    font-weight: bold;
    background-image: linear-gradient(top, #e7676d, #b7070a);
/* Saf3-4 */
 /* FF3.5 - 3.6 */
  /* Opera 10.5, IE9, FF4+, Chrome 10+ */
    background-repeat: repeat;
    background-attachment: scroll;
    float:left;
}

.graybigd ,.greenbigd,.redbigd,.yellowbigd{ border:1px #fff solid;padding: 6px; margin-top: 3px; margin-right: 5px;}
.graybiggerd ,.greenbiggerd,.redbiggerd,.yellowbiggerd{ border:1px #fff solid;padding:  5px;margin-top: 4px; margin-left: 6px; margin-right: 10px;}

.greend,.greenbigd,.greenbiggerd{background:#00a300;}
.yellowd,.yellowbigd,.yellowbiggerd{background:#ffa300;}
.redd,.redbigd,.redbiggerd{background:#ff0000;}
.grayd,.graybigd,.graybiggerd{background:#DDDDDD;}

.device_dot{ float: none;margin: 0px;margin-right: 4px;padding: 5px;}

.flex_container{display: flex; justify-content: stretch; flex-flow: row wrap;}
.test_settings_left{float:left;margin-left:5px;}
.test_pad_right,.test_pad_right_hidden{display: block;float: right;width: 154px;}
.test_add_new{float:right;cursor:pointer;margin-right:5px;}
.test_pad_right_hidden{visibility:hidden;}
.test_pad_left {float:left;cursor:pointer;margin-left:5px;font-weight:normal;width:140px;}
.test_splitter,.device_splitter{border: 1px solid #000000; height:18px; width:100%; text-align:center; font-size: 12px; background-color: #A1C1FF; clear: both; margin:2px; color: #000000; font-weight: bold;font-family: verdana,arial,helvetica,sans-serif;float:left; }
.device_splitter{border: 1px solid #000; background-color: #4A77E8;  color: #fff; height: 22px;font-size: 14px;}
.test_main,.test_main_current,.test_main_gray {min-width: 246px;min-height: 56px; border: thin #000000 solid;margin: 2px;float: left;color: #000000;background-color: #FFF5F5;font: 0.7em verdana,arial, helvetica, sans-serif;flex:1;}
/*.test_main_current {background-color: #FFFFFF;}*/
.test_main_gray {background-color: #F0F0F0;}
/*.test_title{width: 96px; height: 56px; line-height: 13px; margin-left: 0px; float: left; text-align:center; font-weight:bold;  display: block;overflow: hidden;white-space: nowrap;text-overflow: ellipsis;}*/
.test_dots{width: 128px;/*height: 56px;*/margin-top: 2px;float: left; padding-bottom: 3px; height: 80%;}
.test_config,.device_config{width: 16px;height: 16px;float:right;margin-top: 3px;margin-right: 2px;background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABGdBTUEAANkE3LLaAgAAAgVJREFUeJyFkUtoU0EYhb87N0iQ20hRiGSThQtX7pJAsFoRl6UquLDWGElrcaMguJAobqyiWKxCFwUJQkHrK0Wy8AESKtaERtM0VC1GVKgLLQSq0BiazL3jKpfmpQd+mMc55//PjAaQTCbXLMuq0gJCCH15eTnb19d3CPgJEOnt7TjlqZ7tHn92C8MwDkopVbsql8uqUCioWCyWAVwAEyPDxysT0d/+LcZuB6BadV6PUqlEOBz2VyqV56bSk3v395x/eP1c+fOvVc3xP7HD4UBKSbFYZMf2zcGd2+aCY/fvmGfGH1+UktcYhnHgXxGklCqVSqnJiRGlvgZV+pJTuTudjwAdQNQ6KaXalvzzjcN7EuTjWfKdV2DDpmnArDNoh7dvnrDLe5OFyRSzG68xePI0uq5bdsTawrKsJnE2nSC49QbzU3leaRcYDJ9ofqN2Bu9mHtDlHWU+/pHZjqsMhIdQqvnDWhrkMk/p8oyyEH9PkiiR/gimaSKEaOLaBtVqFSEEc6l7dHvHyE4VmHEOEwoN2I/ZKqZtIKVkaek73d4ffEgsMq1FCR2NIIRoKbQNTNO0J1j7kuF26hOrnsscCR0DoHZfg1Kq7syeIJfL8eJlmn09/fh8PpvciMZpbINAIIDf78flctWRGgW6rtftNcDrdruHrHXMdpkty9IAVlZW7gKLAH8BdF05E3mheIkAAAAASUVORK5CYII=);}
.test_delete { clear:right; }
.test_delete,.test_delete_icon,.device_delete{width: 16px;height: 16px;float:right;margin-top: 3px;margin-right: 3px;background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAXUlEQVR42u2SwQoAIAhD88vVLy8KBlaS0i1oJwP3piGVg0Skmpq8HjqZrWl9uwCbGAmwKYGZs/6iqgMyAdJuM8W2QmYKpLt/0AG9ASCv/oAnANd3AEjmAlFT1BypAV+PnRH5YehvAAAAAElFTkSuQmCC);}
.test_fa_icon,.test_fa_archive {font-size: 17px;color: gray;float: right;margin-top: 1px;margin-right: 5px;clear: right;}
.test_fa_archive {margin-right: 3px;}
.test_add{float:right;width:16px; height: 16px;background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAEnQAABJ0BfDRroQAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAAFfSURBVDiNpZNBbhNBFETf/z09C+IAE48dZ4vIDiGx4Agoi1wACYnbsUAcIYsoB2CBFFA4QRJbHotYWeHuysJhBM6M5Ii/alV3P6lK9U0S/zNFl2hmDow35KmkvBUAGH/+8ulyWNfkLGazKR/efzwArrYFsD+Z8PLFIR4CFz9/9Frw3gt3zAwEwUMvoIBOz8MQwhpgwoMDDM3s779TSdkkYWaT07OTy2fVc3JK5JzZq4bsPNlBwO3tktl8jpvhZiwWC47eHR9IumozqMcj9kdjJCGBAAMQDAZPGQx2W60o478W1jbEKv9mtUqktCKljHKm7YkZ7k4IjnJ6CLj5tQSMlBI5JaqqgiIgiZwzTdNgOO7OzXLZAv5k8CDEb9+/no/qGiGm1zPevH77CphvhlgA3DesLYmZUcZILCMSxLIAmEvavkgeAjGuw4qx7HvWD1g0Ted5c6xrGx+zTJ2Ax8wdnWaaoI0VFm8AAAAASUVORK5CYII=)}
.test_settings{float:right;width:16px; height: 16px;background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAbklEQVR42rWTUQ7AIAhD5eTAybfwgWkaki2g/UJDH6goayi5BjCzB2L5BUhTGCJW1eXue13BBM1pCEWcwr0ElgA2shJUArALTEYoV98Arh6JfAQGJ0i48heAOznTwfgOjrzCeA6wi9Ykslp/oaMXKWKJEVTRC+IAAAAASUVORK5CYII=);}
.test_splitter_span{float:right;font-weight:normal;font-size:11px;}
.device_splitter_span{float:right;font-weight:normal;font-size:13px;margin-top: 2px;color: white;padding-right: 4px;}
.test_service_dots{width:192px;height:15px;margin-left:0px; margin-top:-1px; float:left;}
.test_dummy {min-width: 246px;visibility:hidden;height: 0px; padding: 0px;/*margin: 0px;*/}
.test_title,.test_status {font-weight: bold;text-align: left;padding-left: 5px;overflow: hidden;white-space: nowrap;text-overflow: ellipsis;}
.test_title {line-height:22px; font-size: 14px; width:calc(100% - 25px);}
.test_status {line-height:22px; font-size: 12px;}
.test_link_config {
    width: calc( 100% - 25px);
    float: left;
}
.test_main_active {
   background-color:#F5F5FF;
}
.test_disabled {
 background-color: lightgray;
}

.timer {
	position:relative;
	font-size: 20px;
	width:1em;
	height:1em;
	float:right;
	margin-right:2px;
	margin-top:2px;
}
.timer > .percent {
	position: absolute;
	top: 1.05em;
	left: 0;
	width: 3.33em;
	font-size: 0.3em;
	text-align:center;
}
.timer > #slice {
	position:absolute;
	width:1em;
	height:1em;
	clip:rect(0px,1em,1em,0.5em);
}
.timer > #slice.gt50 {
	clip:rect(auto, auto, auto, auto);
}
.timer > #slice > .pie {
	border: 0.1em solid blue;/*#c0c0c0;*/
	position:absolute;
	width:0.8em; /* 1 - (2 * border width) */
	height:0.8em; /* 1 - (2 * border width) */
	clip:rect(0em,0.5em,1em,0em);
	-moz-border-radius:0.5em;
	-webkit-border-radius:0.5em;
	border-radius:0.5em;
}
.timer > #slice > .pie.fill {
	-moz-transform:rotate(180deg) !important;
	-webkit-transform:rotate(180deg) !important;
	-o-transform:rotate(180deg) !important;
	transform:rotate(180deg) !important;
}
.timer.fill > .percent {
	display: none;
}
.timer.fill > #slice > .pie {
	border: transparent;
	background-color: #A1C1FF;
	width:1em;
	height:1em;
}

div.details-overflow{
    max-height: 170px;
    overflow: auto;	
}

div.details-overflow::-webkit-scrollbar {
    width: 5px;
}

div.details-overflow::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
}
 
 .details-overflow-color-success::-webkit-scrollbar-thumb 
 {
	background-color: #00a65a ;
 }
 
  .details-overflow-color-warning::-webkit-scrollbar-thumb
 {
	background-color: #f39c12;
 }
 
 .details-overflow-color-danger::-webkit-scrollbar-thumb
 {
	background-color: #ff0000;
 }
 
 .details-overflow-color-primary::-webkit-scrollbar-thumb{
 	background-color:#3c8dbc;
}

 .details-overflow-color-info::-webkit-scrollbar-thumb{
 	background-color:#00c0ef; 
}
 


.details-overflow-color-success::-webkit-scrollbar-thumb:hover,
.details-overflow-color-warning::-webkit-scrollbar-thumb:hover,
.details-overflow-color-danger::-webkit-scrollbar-thumb:hover,
.details-overflow-color-primary::-webkit-scrollbar-thumb:hover,
.details-overflow-color-info::-webkit-scrollbar-thumb:hover
{
	background: rgba(255,255,255,0.6);
}


.mosaic-status-success{
 /*   success */
 	background-color:rgba(0,166,90,0.6);
}

.mosaic-status-default{
 	background-color:rgba(210,214,222,0.6);	
}


.mosaic-status-primary{
 /*   primary */
 	background-color:rgba(60,141,188,0.6);
}

.mosaic-status-info{
 	background-color:rgba(0,192,239,0.6);
}

.mosaic-status-warning{
 /*   warning */	
 	background-color:rgba(243,156,18,0.6);
}

.mosaic-status-danger{
 /*   danger */		
 	background-color:rgba(221,75,57,0.6);
}

/*
.mosaic-default{
 	background-color:rgba(60,141,188,0.6);
}
*/


/*.mosaic_dummy {min-width: 303px; max-width: 303px;  visibility:hidden;height: 0px; padding: 0px; margin-right: 15px;  } *//*356px*/

 .mosaic_carrier{
    position:relative;
    /*height:405px;*/ /*200px*/
    float:left;
	transition: all 1s ease-in-out;	
    background-position:center;
	background-repeat: no-repeat;	
    transition:1.5s;
    overflow:hidden;
	/*min-width: 303px;
	max-width: 303px;*/ 
    margin-bottom: 16px;
    margin-right: 16px;
	/*margin: 8px;*/
    /*flex: 1;*/
    box-shadow: 5px 5px 10px rgba(0,0,0,0.3);	
	background-size: contain; /*background-size: 303px 170px;*/
	aspect-ratio: 16 / 9;
}


i.mosaic-icon{
    font-size: 95px; /*120px;*/
    display: flex;
    justify-content: center;
    align-items: center;
    /*margin-top: 30px; /*45px;	*/
    height: 100%;
}

div.item-title-info{
	float:right;
	margin-right:5px;	
}

div.item-title-align{
	float:left;
}

a.mosaic-item{
	position: absolute;
	bottom: 0;
	left: 0;
	color: #fff;
	text-decoration:none;
	width: 100%;
	height: 30px;
	font-size: 20px;
	line-height: 30px;
	font-weight: bold;
	transition: 1s ease;
	text-align: center;	
}

div.item-title{
    color: white;
    line-height: -10px;
    margin-top: -3px;
    display: block;	
}

div.item-title span{
	margin-left: 5px;
}

span.title-text{
/*	display: inline-block;*/
    /* width: 150px; */
    /* white-space: nowrap; */
    overflow: hidden !important;
    text-overflow: ellipsis;
    vertical-align: middle;	
}

div.status-led{
    float: none;
    height: 14px;
    width: 14px;
    vertical-align: middle;
    margin-top: -2px;
}

span.label-audio{
	clear:none !important;
}

span.label-details{
	display: inline-block;
	margin-left: 5px;
	border: 1px solid white;	
	float: left;
    clear: left;
    margin-top: 5px;
	white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: calc(100% - 20px);
}
span.label-same-line{
	clear: none;
}

span.label-details:last-of-type {
    margin-bottom:5px;
}

.stb-right-div{
	border: 1px solid lightgray;
    padding: 5px;
}

.mosaic_carrier:hover{
	
 -o-transition:0.3s;
  -ms-transition:0.3s;
  -moz-transition:0.3s;
  -webkit-transition:0.3s;
  transition:0.3s;	
  box-shadow: 5px 5px 10px rgba(0,0,0,4);	
/*  overflow-y:scroll; */
}

 div.mosaic_carrier:hover>a{
	height: 100%;
 }
 
 .mosaic-success{
 	background-color:rgba(0,166,90,0.6);
}

.stb_restart_0,.stb_restart_1,.stb_restart_2,.stb_restart_3,.stb_restart_4{
	display:none;
}
@media(max-width:460px) {
	.hide-mobile{
		display:none;
	}
	.stb-right-div{
		border: none;
	    margin-top: 10px;
	    padding: 0px;
	}
	.carrier_pad_left,.carrier_pad_right 
	{
		width: auto;
	}
	.carrier_splitter {
	    text-align:left;
	    padding-left:10px;
	}
}
@media(max-width:400px) {
	.carrier_pad_left {
		display:none;
	}
	.carrier_settings_left {
		display:none;
	}
}
@media(max-width: 756px) {
	.mosaic_carrier{
		max-width: none;
		height: 250px;
	}
}
@media(max-width: 468px) {
	.mosaic_carrier{
		max-width: none;
		height: 150px;
	}
}
 .hls_link_right {
    color: white;
    float: right;
    line-height: 24px;
    margin-top: 4px;
    margin-right:5px;
    margin-left:5px;
 }
 .hls_link_right:hover {
 	color:white;
 }
 .download_video_link {
    font-size: 16px;
    float: left;
    margin-bottom: 10px;
    margin-top: -10px;
 }
 
 .download_video_link  a{
	color: white;
 }
 .download_video_link  a:hover{
	color: white;
 }
 .record_button {
  /*   margin: -1px 4px -4px -3px;*/
  	   border-radius: 0px;
 }
 .top_label_small{
 	display:none;
 }

 .hdmi_select_button{
 	width: 100%;
 	text-align: left;
 	border: 0px;
 	border-radius:0px;
 }
 @media(max-width: 1700px) { 
 .top_label{
  display:none;
 }
  .top_label_small{
  display:unset;
 }
@media(max-width: 756px) {
	#stats-box {
	clear:left;
	}
}
@media(max-width: 468px) {
	.video-status-live{
		display:none;
	}
}