/*body{font-family: 'Poppins', sans-serif; font-weight: 400; color: #fff; background: #042859;}
*{ transition: all ease-in-out 0.2s; outline: 0px;}
img{ max-width: 100%;}
.navbar-brand { position: relative;  z-index: 6;}
.navbar-brand img{ max-height:40px;}
header{ background:#fff; padding:8px 0 0 0;}
.container-fluid{ max-width: 1300px;}
.user-info .dropdown-menu{ left: inherit; right: 0px;}

*/
body{/*color: #fff; background: #042859;*/}
.navbar{ box-shadow: 0 0 15px rgba(0,0,0,.5);  background: rgb(4,22,46);
    background: -moz-linear-gradient(259deg, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 1) 48%, rgba(0, 0, 0, 1) 100%);
    background: -webkit-linear-gradient(259deg, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 1) 48%, rgba(0, 0, 0, 1) 100%);
    background: linear-gradient(259deg, rgba(0, 0, 1, 1) 0%, rgba(0, 0, 1, 1) 48%, rgba(0, 0, 0, 1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#000000",endColorstr="#000000",GradientType=1);}

.user-info img{ border-radius: 100%;}

.other-info{ display: inline-block; margin-left: 30px; color: #22f4e8; font-size: 14px; vertical-align: middle; font-weight: 400;}
.other-info span{ display: inline-block; color:#fcff00}

.body-content{ /*padding:15px;*/}
.custom-accordian .card-header{ padding: 0px; background: #23508b;position: relative;}
.custom-accordian .btn-link{ color: #fff; font-weight: 600;  text-decoration: none;}
.custom-accordian .card-header .fa{ /*position: absolute; right: 15px; top: 50%; transform: translateY(-50%); font-size:28px; font-weight:bold;*/}

.custom-accordian .card-header .zone_buttons{ position: absolute; right: 15px; top: 50%; transform: translateY(-50%); font-size:28px; font-weight:bold;}

.custom-accordian .card-header .btn[aria-expanded="false"] .fa-angle-up::before{ content:"\f107";font-family: "FontAwesome";}


.custom-accordian .card{ background: #133460;}
.list-controler{ margin: 0px; padding: 0px; list-style: none;}
.list-controler li {color:#000000!important}
.list-controler li {padding:10px 10px 10px 30px; display: block; color: #fff; position: relative; border: 2px solid #efefef;
    border-radius: 1.1;
    margin-bottom: 6px;
    border-radius: 10px;
} 
.list-controler li::before{ content: "\f101"; font-family: "FontAwesome"; color: #000000; position: absolute; left:15px; top: 50%; transform: translateY(-50%); } 
.list-controler.search-box{ padding-top: 10px;}
.list-controler.search-box li{ padding: 5px 0;}
.list-controler.search-box li::before{  display: none;} 


.list-controler li a{padding:0 5px; display: inline-block; color: #000000;} 
.list-controler li a span{ display:block; color: #22c8f4;}

.list-controler li .setting{ position: absolute; right:15px; top: 50%; transform: translateY(-50%); } 

.title-section{ text-align: center; color: #fff; font-size: 24px; margin: 15px 0;}

.control-detail{ margin: 0px -10px; padding: 10px; list-style: none; background: #041f43; }
.control-detail li{ display: inline-block; width: 49%; font-size: 12px;  padding: 5px 0; color: #fff;} 
.tab-custom .nav-tabs{ flex-wrap: nowrap;}
.tab-custom{ margin-top:10px;} 
.tab-custom  .nav-tabs .nav-item {
	margin-bottom: -1px;
	text-align: center;
}
.tab-custom  .nav-tabs{ border: 0px;justify-content: space-around;} 
.tab-custom  .nav-tabs .nav-item  .nav-link{ font-size: 11px; padding: 0 2px; margin: 0 2px; color: #000000; border:0px; border-bottom: 5px solid #124994;} 
.tab-custom  .nav-tabs .nav-item  .nav-link span{ display: block;}
.tab-custom  .nav-tabs{ margin: 0 -15px;} 
.tab-custom  .nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active {
	/*color: #ffff !important;*/
	background-color:transparent;
	/*border-color: transparent transparent #fff !important;*/
	background: #f6f7f7;
    color: #000000!important;
}

.tab-content{ /*margin: 0px -10px;*/ padding: 10px; list-style: none; background: #041f43; }
.control-detail .form-control{ background: #ffffff; border: 1px solid #0d57b4; color: #000; max-width:96%; margin-top: 5px; font-size: 12px; padding: 3px; display: inline-block;}
.control-detail li span{ display: block;} 
.btm-border{ border-bottom: 2px solid #06326f;}
.control-detail li.heading{ width: 100%; text-align: center; font-size: 16px; font-weight: 600;}
.customtable{ background: #fff; font-size: 12px;}

.mobile-card{ color: #000; font-size: 12px} 

.mobile-card .card{background: #23508b; color: #fff;} 
.mobile-card .card-header{ font-size: 16px; font-weight: 600; position: relative;}
.mobile-card .card-header .fa{ right:15px; top: 50%; /*transform: translateY(-50%); position: absolute;*/}
.navbar{ z-index: 5;}
.btn-float{ position: fixed; right: 30px; z-index: 5; bottom: 30%; border-radius: 15px; padding:10px; background:#000000; /*opacity:0.6;*/}
.float-section{position: fixed; right: 30px; z-index: 5; bottom: 50%; background: #efefef; padding: 10px;}
.float-section h3{font-size: 16px; text-align: center; color: #0d57b4;}
.float-section a{ background: #dfe5ec; font-size: 12px; text-align: left; padding:5px;}
.float-section .list-group-item{ position: relative;}
.float-section .list-group-item:after{content:"\f105" ; font-family:"FontAwesome" ; position: absolute; right: 8px; top: 50%; transform: translateY(-50%);}
.overlay-bg{ position: fixed; background: rgba(0,0,0,.5); top: 0px; bottom: 0px; left: 0; right: 0; z-index: 4; height: 100%; width: 100%;}

.form-control {
    /* background: #042859; */
    /* border: 1px solid #0d57b4; */
    max-width: 96%;
   /* margin-top: 5px;*/
    font-size: 12px;
    padding: 3px;
    display: inline-block;
}

.card-header{padding:7px;}

.dropdown-menu {left:-34px!important;}

.Blink {
    animation: blinker .30s cubic-bezier(.5, 0, 1, 1) infinite alternate;  
}

@keyframes blinker {  
  from { opacity: 1; }
  to { opacity: 0; }
}



/*start 16 june*/
/*list detail*/
.btn-float {
	background: rgba(0,0,0,.5);
}


.customtable tr th,.customtable tr td{ padding: 5px;}

.list-container{
	margin: 0px -10px;
	padding: 10px;
	list-style: none;
	background: #041f43;
}

.table-dark-custom{ background: #042859; color: #fff;}
.table-dark-custom tr th,.table-dark-custom tr td{ padding:8px; font-size: 13px; }
.table.table-dark-custom  td, .table.table-dark-custom  th {border-top: 1px solid #0d57b4;}

/*.login-graphic{ opacity:0.5;}*/

.full-form-area{ min-height: 90vh;  display: flex; align-items: center; justify-content: center;}
.form-login-signup-box{ width: 100%;} 
.form-login-signup-box h2{ font-size:50px; margin:30px 0 }
.form-login-signup-box h2 span{ color: #0d57b4; font-size: 80px;}
.form-login-signup-box p{ margin: 30px 0; font-size: 18px;}
.form-login-signup-box .bottom{ opacity: 0.8;}

.login-form-control .form-control{ height: 50px; background: #afcdf4; border: 0px;}
.login-form-control .form-group{ margin-bottom:20px;}

.login-inner{border-radius: 5px; padding:15px 50px; margin: 15px 0; border:2px solid #000000 }

.dropdown-item {
	padding: 1px 10px;
	font-size: 13px;
}
/*end 16 june*/



table.default tr{background:none!important;}
table.default tr:hover td{background:none!important;}



.onoffswitch {
    position: relative; width: 110px;
    -webkit-user-select:none; -moz-user-select:none; -ms-user-select: none;
}
.onoffswitch-checkbox {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}
.onoffswitch-label {
    display: block; overflow: hidden; cursor: pointer;border-radius: 20px;
}
.onoffswitch-inner {
    display: block; width: 200%; margin-left: -100%;
    transition: margin 0.3s ease-in 0s;
}
.onoffswitch-inner:before, .onoffswitch-inner:after {
    display: block; float: left; width: 50%; height: 30px; padding: 0; line-height: 30px;
    font-size: 14px; color: white; font-family: Trebuchet, Arial, sans-serif; font-weight: bold;
    box-sizing: border-box;
}
.onoffswitch-inner:before {
    content: "ON";
    padding-left: 10px;
    background-color: #34A7C1; color: #FFFFFF;
}
.onoffswitch-inner:after {
    content: "OFF";
    padding-right: 10px;
    background-color: #EEEEEE; color: #999999;
    text-align: right;
}

.play_pause:before {
    content: "Pause";
    padding-left: 10px;
    background-color:red; color: #fff;
	text-align: left;
	/*font-size:13px;*/
}
.play_pause:after {
    content: "Active";
    padding-right: 10px;
    background-color:green; color: #fff;
    text-align: right;
	/*font-size:13px;*/
}
.activate_deactivate:before {
    content: "On";
    padding-left: 10px;
    background-color:green; color: #fff;
	text-align: left;
}
.activate_deactivate:after {
    content: "Off";
    padding-right: 10px;
    background-color:red; color: #fff;
    text-align: right;
}

.enable_disable:before {
    content: "Active";
    padding-left: 10px;
    background-color:green; color: #fff;
	text-align: left;
}
.enable_disable:after {
    content: "InActive";
    padding-right: 10px;
    background-color:red; color: #fff;
    text-align: right;
}

.onoffswitch-switch {
    display: block; width: 18px; margin: 6px;
    background: #FFFFFF;
    position: absolute; top: 0; bottom: 0;
    right: 85px;
    border: 2px solid #999999; border-radius: 20px;
    transition: all 0.3s ease-in 0s; 
}
.onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-inner {
    margin-left: 0;
}
.onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-switch {
    right: 0px; 
}

	.pagination li{padding:5px;}
	.pagination li.active a{font-weight:bold; color:#0000FF!important;}
	.pagination li.previous {border:1px solid #efefef; background:none}
	.pagination li.next {border:1px solid #efefef;background:none}
	
	table.dataTable {border-bottom:1px solid #00bcd4}
	.table.dataTable thead > tr > th {
		background: #23508b;
		color: #fff;
		font-size: 13px;
	}


	.dataTables_info, .dataTables_paginate {padding:0px;}
	.dataTables_length { float:left; color:#000000!important; }
	.dataTables_paginate{float:right;}
	.table.dataTable thead > tr > th{padding-right:2px;padding-left:0px;}
	/*table.dataTable thead .sorting:after {
		opacity: '';
		content: "";
	}*/
	


table.dataTable thead .sorting_asc:after{content: "\2193"!important;}
table.dataTable thead .sorting_desc:after{content: "\2191"!important;}

.dtw{border-radius: 30%; padding: 4px; font-size:11px; margin-left:2px;}
.dtw_on{background:green; color:white; }
.dtw_off{background:#efefef; color:#928f8f; }

.program_odd{background:#e9ecb7; border: 1px solid #e9ecb7;padding:10px 0px; margin:10px;   border-radius: 15px;}
.program_even{background:#ffffff; border: 1px solid #ffffff;padding:10px 0px; margin:10px;   border-radius: 15px;}
.program_active{background:#bff1bf; border: 2px solid #bff1bf; padding:10px 0px; margin:10px;   border-radius: 15px;}
.program_inactive{background:#f9caca; border: 2px solid #f9caca; padding:10px 0px; margin:10px;   border-radius: 15px;}
.program_selected{background:#4dd14d; border: 2px solid #4dd14d; padding:10px 0px; margin:10px;   border-radius: 15px;}
.program_grayout{background:gray; border: 2px solid gray;padding:10px 0px; margin:10px;   border-radius: 15px;}

.contoller_detail_info{font-size:15px!important; margin-left:5px; vertical-align:middle}

.zone_btn{padding:0px; display: flex; align-items: center; font-size:22px;}

.pause_active_toggle{right:50px;}