:root {
	--primary-font-color: #9daaf2;
	--seconday-font-color: #ff6a3d;
	--header-gb-color: #1C2238;
}

html,body{height:100%;margin:0;padding:0;}
#layout_outer_wrapper{min-height:100%;}
#layout_inner_wrapper{overflow:visible;padding-bottom:100px;}
#layout_footer{position:relative;margin-top:-100px;height:100px;clear:both;}
body:before{content:"";height:100%;float:left;width:0;margin-top:-32767px;}

.chosen-container-single .chosen-single span {
    margin-right:       12px;
}
body{
	font-size	: 12px;
	font-family	: "trebuchet ms", sans-serif;
	color			: #000;
}
table{
	border-spacing:0;
    border-collapse:collapse;
	border: none;
}
img{
	border: none;
}
form{
	display		: inline;
}
a, a:link, a:visited, a:hover, a:active{ color: var(--primary-font-color); text-decoration: none; }

.clear{
	display		: block;
	height		: 0;
	width		: 100%;
	clear		: both;
}
.layout_center{
	position	: relative;
	margin		: 0 auto;
	width		: 1200px;
}
.layout_center_wide{
	position	: relative;
	margin		: 0 auto;
	width		: 1300px;
}

#layout_header{
	background: var(--header-gb-color) none no-repeat 0 0;
	height: 50px;
}

#layout_primary_menu{
	margin-left: 25px;
	display:inline-block;
	vertical-align: top;
}

#layout_secondary_menu{
	position	: absolute;
	right		: 0;
	top			: 0;
	bottom		: 0;
}
#layout_header .chosen-container li {
	display: list-item;
	padding: 5px 6px;
	position: relative;
	font-weight: 700;
}
#layout_header ul{
	padding		: 0;
	margin		: 0;
	list-style	: none inside none;
	display		: inline-block;
	text-align	: left;
}
#layout_header li{
	position	: relative;
	list-style	: none inside none;
	display		: inline-block;
	padding		: 0;
	margin		: 0;
}

#layout_header li > a{
	text-decoration	: none;
	color			: var(--primary-font-color);
	height			: 50px;
	line-height		: 50px;
	padding			: 0 10px;
	display			: block;
	vertical-align	: middle;
	font-size		: 14px;
	white-space		: nowrap;
	display			: block;
}
#layout_header li > a > img{
	max-width 		: 16px;
	max-height 		: 16px;
	margin-right	: 12px;
	vertical-align	: middle;
}
#layout_header a:hover{
	color			: #d4e7f4;
}
#layout_header a.active{
	color			: #d4e7f4;
	border-top		: 5px solid #d4e7f4;
	height			: 45px;
	line-height		: 40px;
}
#layout_header ul > li > ul{
	display		: none;
	position	: absolute;
	left		: 0;
	top			: 100%;
	z-index		: 10;
	background	: #FFF none no-repeat 0 0;
	border		: 1px outset #d4e7f4;
}
#layout_header ul > li:hover > ul{
	display		: block;
}
#layout_header ul > li > ul > li {
	display		: block;
}
#layout_header ul > li > ul > li > a{
	border-left	: 5px solid #FFF;
}
#layout_header ul > li > ul > li:hover > a{
	border-left	: 5px solid #d4e7f4;
	color		: #4297d7;
}

#layout_header .layout_center a img {
	height: 50px;
}

#layout_header .layout_center_wide a img {
	height: 50px;
}

img{ border: none; }

.cursor{
	cursor	: hand;
	cursor	: pointer;
}

#loadingOverlay{
	position			: fixed;
	left					: 0;
	top					: 0;
	right					: 0;
	bottom				: 0;
	z-index				: 999999;
	cursor				: wait;
	background		: transparent url( ../img/semiTransparentWhitePixel.png ) repeat 0 0;
}
#loadingOverlay img{
	position			: absolute;
	top					: 50%;
	left					: 50%;
	margin-top		: -50px;
	margin-left		: -50px;
}
fieldset{
	border				: none;
	border-top			: 1px solid #000;
}
fieldset legend{
	margin-left			: 20px;
	font-size			: 16px;
	font-weight			: bold;
	padding				: 10px;
}
fieldset label{
	width				: 150px;
	display				: inline-block;
	vertical-align		: middle;
	padding				: .4em 1em .4em 1em;
}
h1{
	color				: var(--primary-font-color);
	margin-bottom		: 20px;
}
.dataTables_filter{ display: none; }
.dataTable td{ height: 37px; }
.dataTable{
	border-bottom: 1px solid #000;
	margin-bottom: 4px !important;
}
.dataTable tr.inactive{ color: #999; }
.dataTable tr.odd.inactive{ background-color: #DDD; }
.dataTable tr.odd.inactive .sorting_1{ background-color: #D3D3D3; }
.dataTable tr.even.inactive{ background-color: #EEE; }
.dataTable tr.even.inactive .sorting_1{ background-color: #E4E4E4; }
.dataTables_processing{ display: none !important; }

.toolbar.simple {
	background: #4297d7;
}

.ui-button{
	padding: 			.5em;
}
.ui-toolbar{
	padding				: 4px;
	margin-bottom		: 1em;
}
.ui-toolbar .separator{
	display						: inline-block;
	margin-left				: 10px;
	margin-right				: 10px;
	width						: 1px;
	height						: 27px;
	vertical-align				: middle;
	border-left				: 1px solid #FFF;
	opacity						: 0.5;
}
.input{
	border-bottom-right-radius	: 5px;
	border-bottom-left-radius	: 5px;
	border-top-right-radius		: 5px;
	border-top-left-radius		: 5px;
	font-family			: 'trebuchet ms', sans-serif;
	font-size			: 12px;
	padding				: 5px 12px 5px 12px;
	vertical-align				: middle;
	border						: 1px inset #999;
	display						: inline-block;
	width						: 150px;
	background-color		: #FFF;
	outline						: none;
	color							: #000;
}
.input.extralong{
	width						: 900px;
}
.input.long{
	width						: 300px;
}
.input.medium{
	width						: 200px;
}
.input.short{
	width						: 75px;
}
.input.hasError{
	border						: 1px inset red;
	color							: red;
}
textarea.input{
	width						: 450px;
	height						: 250px;
}
.input:focus{
	background-color			: #FFFFE0;
	border						: 1px inset #000;
}
.input[disabled], .input[readonly]{
	background-color			: #CCC;
	color						: #999;
}
.tooltip{
	border						: 1px solid #FFF !important;
    background					: rgba(20, 20, 20, 1) !important;
    color						: white !important;
}
.chosen-container{
	min-width				: 176px;
}
.chosen-single{
	color						: #000 !important;
	outline					: none !important;
	border					: 1px inset #999 !important;
	border-bottom		: none !important;
	font-family			: 'trebuchet ms', sans-serif;
	font-size				: 12px;
	padding				: 5px 12px 5px 12px !important;
	line-height			: inherit !important;
	height					: inherit !important;
}
.chosen-drop{
	color						: #000 !important;
	outline					: none !important;
	border					: 1px inset #999 !important;
	border-top			: none !important;
	font-family			: 'trebuchet ms', sans-serif;
	font-size				: 12px;
}
.button input[type=file]{
	position: 			absolute;
	top: 				0;
	left: 				0;
	width: 				100%;
	height:				100%;
	opacity: 			0;
	cursor: 			pointer;
}
.img-fit {
    max-width:          100%;
    max-height:         100%;
    position:           absolute;
    margin:             auto;
    top:                0;
    bottom:             0;
    left:               0;
    right:              0;
}
.carousel-content-img {
    width:              20%;
    height:             100%;
    display:            inline-block;
    position:           relative;
}
.carousel-content-title {
    width:              100%;
    max-height:         60px;
    overflow:           hidden;
    font-weight:        bold;
    word-wrap:          break-word;
}

a.paginate_button, a.paginate_active{
	font-size	: 15px;
}
ul.devicesSelector, ul.devicesSelector ul{
	list-style	: none inside none;
	padding	: 0;
	margin		: 0;
}
ul.devicesSelector li label{
	white-space: nowrap;
}

#displayLayout{
	width			: 360px;
	height			: 640px;
	border			: 1px solid #BBB;
	padding			: 0;
	margin			: 0;
	border-collapse	: separate;
}
#displayLayout tr, #displayLayout td{
	padding			: 0;
	margin			: 0;

}
#displayLayout td{
	font-weight		: bold;
	vertical-align	: middle;
	text-align		: center;
	border			: 1px solid #2e6e9e;
	color			: #2e6e9e;
	background		: #dfeffc none no-repeat 0 0;
	cursor			: pointer;
	cursor			: hand;
}
#displayLayout td.active{
	color			: #e17009;
	background		: #FFF none no-repeat 0 0;
	border-color	: #e17009;
}
.kill-switch-info{
	color: #f40;
	font-weight: bold;
	font-size: 1.4em;
	margin-left: 20px;
}

table.campaign {
	width: 100%;
	border-top: 1px solid #000;
	border-bottom: 1px solid #000;
}

table.campaign tbody tr:nth-child(odd) {
	background-color: #e8f2f9;
}

table.campaign tbody tr:nth-child(even) {
	background-color: #fff;
}

table.campaign td, table.campaign th {
	padding: 8px;
	text-align: left;
}

.message {
	height: 15px;
    margin-bottom: 15px;
}

.success::before {
    content: "\2713"; /* Unicode character for checkmark (✓) */
    display: inline-block;
    margin-right: 5px; /* Add some spacing between the checkmark and the content */
  }

.success {
    color: green;
}

.error::before {
    content: "\274C"; /* Unicode character for the cross symbol (✌) */
    display: inline-block;
    margin-right: 5px; /* Add some spacing between the cross and the content */
}

.error {
    color: red;
}

.chip {
    display: inline-flex;
    align-items: center;
    background-color: #f0f0f0;
    border: 1px solid #ccc;
    border-radius: 20px;
	color: #000;
	font-weight: normal;
    padding: 5px 10px;
    margin-right: 5px;
    margin-bottom: 5px;
    font-size: 14px;
}

/* Close button */
.chip .close {
    cursor: pointer;
    margin-left: 8px;
    color: #888;
}

.denylist {
	width: 25%;
	text-align: center;
}

.denylist tr:nth-child(even) {
	background-color: rgb(231, 231, 231);
}

.denylist td {
	padding: .2em;
}

input:invalid {
	box-shadow: 0 0 5px 1px red;
}
  
input:focus:invalid {
	box-shadow: none;
}

.address_input {
	margin-bottom: 15px;
}

.flash {
	margin-top: 15px;
}

/* DataTables v2 */

table tr td.dt-type-numeric.dt-center {
	text-align: center;
}