@import "https://fonts.googleapis.com/css?family=Cairo|Roboto";
@import url('https://fonts.googleapis.com/css?family=Quicksand');
/*************************
*******Typography******
**************************/
body {
	direction: ltr;
	unicode-bidi: embed;
	padding: 0 !important;
	/*background: #f2f3f8;*/
	background: #f2f4f8;
	line-height: 26px;
}
*{
	font-weight: normal !important;
	/*font-family: 'Cairo', sans-serif !important;*/
	font-family: 'Quicksand', sans-serif !important;
	text-transform: capitalize;
}
.fa {font-family: 'FontAwesome' !important;}
.glyphicon {font-family: 'Glyphicons Halflings' !important;}
.mdi {font: normal normal normal 24px/1 "Material Design Icons" !important;}
.icon-user,
.icon-people,
.icon-user-female,
.icon-user-follow,
.icon-user-following,
.icon-user-unfollow,
.icon-login,
.icon-logout,
.icon-emotsmile,
.icon-phone,
.icon-call-end,
.icon-call-in,
.icon-call-out,
.icon-map,
.icon-location-pin,
.icon-direction,
.icon-directions,
.icon-compass,
.icon-layers,
.icon-menu,
.icon-list,
.icon-options-vertical,
.icon-options,
.icon-arrow-down,
.icon-arrow-left,
.icon-arrow-right,
.icon-arrow-up,
.icon-arrow-up-circle,
.icon-arrow-left-circle,
.icon-arrow-right-circle,
.icon-arrow-down-circle,
.icon-check,
.icon-clock,
.icon-plus,
.icon-minus,
.icon-close,
.icon-event,
.icon-exclamation,
.icon-organization,
.icon-trophy,
.icon-screen-smartphone,
.icon-screen-desktop,
.icon-plane,
.icon-notebook,
.icon-mustache,
.icon-mouse,
.icon-magnet,
.icon-energy,
.icon-disc,
.icon-cursor,
.icon-cursor-move,
.icon-crop,
.icon-chemistry,
.icon-speedometer,
.icon-shield,
.icon-screen-tablet,
.icon-magic-wand,
.icon-hourglass,
.icon-graduation,
.icon-ghost,
.icon-game-controller,
.icon-fire,
.icon-eyeglass,
.icon-envelope-open,
.icon-envelope-letter,
.icon-bell,
.icon-badge,
.icon-anchor,
.icon-wallet,
.icon-vector,
.icon-speech,
.icon-puzzle,
.icon-printer,
.icon-present,
.icon-playlist,
.icon-pin,
.icon-picture,
.icon-handbag,
.icon-globe-alt,
.icon-globe,
.icon-folder-alt,
.icon-folder,
.icon-film,
.icon-feed,
.icon-drop,
.icon-drawer,
.icon-docs,
.icon-doc,
.icon-diamond,
.icon-cup,
.icon-calculator,
.icon-bubbles,
.icon-briefcase,
.icon-book-open,
.icon-basket-loaded,
.icon-basket,
.icon-bag,
.icon-action-undo,
.icon-action-redo,
.icon-wrench,
.icon-umbrella,
.icon-trash,
.icon-tag,
.icon-support,
.icon-frame,
.icon-size-fullscreen,
.icon-size-actual,
.icon-shuffle,
.icon-share-alt,
.icon-share,
.icon-rocket,
.icon-question,
.icon-pie-chart,
.icon-pencil,
.icon-note,
.icon-loop,
.icon-home,
.icon-grid,
.icon-graph,
.icon-microphone,
.icon-music-tone-alt,
.icon-music-tone,
.icon-earphones-alt,
.icon-earphones,
.icon-equalizer,
.icon-like,
.icon-dislike,
.icon-control-start,
.icon-control-rewind,
.icon-control-play,
.icon-control-pause,
.icon-control-forward,
.icon-control-end,
.icon-volume-1,
.icon-volume-2,
.icon-volume-off,
.icon-calendar,
.icon-bulb,
.icon-chart,
.icon-ban,
.icon-bubble,
.icon-camrecorder,
.icon-camera,
.icon-cloud-download,
.icon-cloud-upload,
.icon-envelope,
.icon-eye,
.icon-flag,
.icon-heart,
.icon-info,
.icon-key,
.icon-link,
.icon-lock,
.icon-lock-open,
.icon-magnifier,
.icon-magnifier-add,
.icon-magnifier-remove,
.icon-paper-clip,
.icon-paper-plane,
.icon-power,
.icon-refresh,
.icon-reload,
.icon-settings,
.icon-star,
.icon-symbol-female,
.icon-symbol-male,
.icon-target,
.icon-credit-card,
.icon-paypal,
.icon-social-tumblr,
.icon-social-twitter,
.icon-social-facebook,
.icon-social-instagram,
.icon-social-linkedin,
.icon-social-pinterest,
.icon-social-github,
.icon-social-google,
.icon-social-reddit,
.icon-social-skype,
.icon-social-dribbble,
.icon-social-behance,
.icon-social-foursqare,
.icon-social-soundcloud,
.icon-social-spotify,
.icon-social-stumbleupon,
.icon-social-youtube,
.icon-social-dropbox,
.icon-social-vkontakte,
.icon-social-steam {
	font-family: 'simple-line-icons' !important;
	speak: none;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	line-height: 1;
	/* Better Font Rendering =========== */
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}
h1, h2, h3, h4, h5, h6 {
	font-weight: 600;
	font-family: 'Cairo', sans-serif;
	color: #272727;
}
a {
	color: #64686d;
	-webkit-transition: color 400ms, background-color 400ms;
	-moz-transition: color 400ms, background-color 400ms;
	-o-transition: color 400ms, background-color 400ms;
	transition: color 400ms, background-color 400ms;
}
p {
	word-spacing: 3px;
}
a:hover,
a:focus {
	text-decoration: none;
	color: #64686d;
}
hr {
	border-top: 1px solid #e5e5e5;
	border-bottom: 1px solid #fff;
}
.sys-hidden{
	display: none !important;
}
/*************************
******* ACF CSS ******
**************************/
.chosen-container{
	width: 95% !important;
}
.chosen-search input{
	width: 80% !important;
}
.acf-table > thead > tr > th {
	border-color: #E1E1E1;
	border-width: 0 0 1px 1px;
	text-align: right;
}
.acf-field select {
	padding: 2px;
	color: #64686d !important;
}
textarea{
	padding: 5px !important;
}
.sys-home-menu {
	display: inline-block;
	color: #ffffff;
	margin-right: 10px;
}
.sys-home-menu i{
	display: inline-block;
	color: #ffffff;
}
#sys-page-content{
	padding: 10px;
}
h5{
	color: darkred;
	font-weight: bold !important;
}
label{
	color: #777777;
	font-weight: bold !important;
	border-radius: 5px;
}
span.not-available{
	display: block;
	padding: 5px;
	width: 90%;
	background-color: darkred;
	color: #ffffff;
	border-radius: 5px;
}
span.available{
	display: block;
	padding: 5px;
	width: 90%;
	background-color: green;
	color: #ffffff;
}
/*thead{*/
	/*display: none !important;*/
/*}*/
/*table.table-condensed thead{*/
	/*display: block !important;*/
/*}*/
td{
	background-color: #eeeeee;
	text-align: center;
}
td.table-head{
	background-color: #a1a1a1;
	color: #ffffff;
	text-align: center;
	text-transform: uppercase;
}
div.table-head{
	background-color: #a1a1a1;
	color: #ffffff;
	text-align: center;
	text-transform: uppercase;
	padding: 10px;
	display: table-row;
}
input,select{
	text-align: center !important;
}
#platform-menu{
	/*display: none;*/
}
a#platform-switch{
	cursor: pointer;
}
.loader {
	position: fixed;
	left: 0px;
	top: 0px;
	width: 100%;
	height: 100%;
	z-index: 9999;
	background: url('inc/media/page-loader.gif') 50% 50% no-repeat rgb(249, 249, 249);
}
span.sys-count{
	display: inline-block;
	padding: 5px;
	padding-right: 10px;
	padding-left: 10px;
	background-color: #a1a1a1 ;
	color: #FFFFFF;
	border-radius: 3px;
	font-size: 16px;
}
span.sys-count-registred{
	display: inline-block;
	margin-left: 5px;
	padding: 5px;
	padding-right: 10px;
	padding-left: 10px;
	background-color: #ffffff ;
	color: navy;
	border-radius: 3px;
}
#cboxTitle{
	display: none !important;
}
header.navbar .navbar-brand{
	color: #FFFFFF;
	font-size: 20px;
	display: block;
	text-align: center;
	line-height: 45px;
}
#back_to_top a{
	bottom: 60px;
	right: 15px;
}
. sys-padding5px{
	padding: 5px;
}
.aside-menu-fixed.aside-menu-hidden .main, .aside-menu-fixed.aside-menu-hidden .app-footer {
	margin-right: 0;
	padding-top: 25px;
}
.acf-button{
	cursor: pointer;
	padding: 5px;
}
.acf-button:hover{
	background-color: #121212;
	color: #FFFFFF;
}
button.collapse{
	display: none !important;
}
.chosen-container-single .chosen-single {
	position: relative;
	display: block;
	overflow: hidden;
	padding: 3px 5px;
	height: auto;
	border: 1px solid #eee;
	border-radius: 0;
	background-clip: padding-box;
	box-shadow: 0 0 3px #fff inset,0 1px 1px rgba(0,0,0,.1);
	color: #444;
	text-decoration: none;
	white-space: nowrap;
	line-height: 24px;
	background: transparent !important;
}

.sidebar .nav .nav-item.nav-dropdown.open > ul, .sidebar .nav .nav-item.nav-dropdown.open > ol {
	max-height: 1000px;
	padding-left: 10px;
	padding-right: 10px;
}
option[disabled=disabled]{
	color: #eee;
}

.sidr.right {
	left: auto;
	right: -85%;
}
.sidr.left {
	left: auto;
	left: -85%;
}
.sidr {
	display: block;
	position: fixed;
	top: 25px;
	height: 90%;
	z-index: 999999;
	width: 85%;
	overflow-x: auto;
	overflow-y: auto;
	font-family: "lucida grande",tahoma,verdana,arial,sans-serif;
	font-size: 15px;
	background: #f8f8f8;
	color: #333;
	box-shadow: 0 0 5px 5px #ebebeb inset;
	border: 2px solid #121212;
	padding: 15px;
	border-radius: 15px;
}
a#fetch_now:hover{
	background-color: darkred;
	color: #FFFFFF;
	border-radius: 10px;
}
header.navbar .navbar-brand {
	display: inline-block;
	width: 250px;
	height: 60px;
	padding: 0.5rem 1rem;
	margin-right: 0;
	background-color: darkred;
	background-repeat: no-repeat;
	background-position: center center;
	background-size: 90px auto;
	border-bottom: 1px solid darkred;
}
.nav-tabs .nav-link.active, .nav-tabs .navbar .active.dropdown-toggle, .navbar .nav-tabs .active.dropdown-toggle {
	font-weight: bold !important;
}

/*FOR SCROLLABLE TABLE CSS*/

.table-head{
	font-size: 16px !important;
}
table,
thead {
	width: 100%;
	text-align: left;
}

@media only screen and (min-width: 360px) and (max-width: 497px) {


	#scrolltable {
		height: 100%;
		overflow: auto;
		width: 340px;
	}


	#scrolltable table {
		border-collapse: collapse;
	}
	/* Overflow scroll gradient */
	.overflow-scroll-gradient {
		position: relative;
	}


}
@media only screen and (min-width: 768px) and (max-width: 992px) {


	#scrolltable {
		height: 100%;
		overflow: auto;
		width: 700px;
	}
	.refreshDriver{
		margin-left: 40px !important;
	}

	#scrolltable table {
		border-collapse: collapse;
	}
	/* Overflow scroll gradient */
	.overflow-scroll-gradient {
		position: relative;
	}


}
.my-pagination{
	margin-left: 30%;
	display: inline-block;
}
.my-pagination a {
	border: 1px solid #ddd; /* Gray */
	transition: background-color .3s;
	border-radius: 7px;
	color: black;
	padding: 8px 16px;

}
.my-pagination span.page-numbers.current  {
	border: 1px solid #4CAF50;
	border-radius: 7px;
	color: black;
	padding: 8px 16px;
	background-color: #4CAF50;

}
.my-pagination span.page-numbers.dots  {
	padding: 10px 10px;

}

.my-pagination a:hover:not(.current) {background-color: #ddd;}


.scrollingtable {
	box-sizing: border-box;
	display: inline-block;
	vertical-align: middle;
	overflow: hidden;
	width: auto; /*if you want a fixed width, set it here, else set to auto*/
	min-width: 1000px/*100%*/; /*if you want a % width, set it here, else set to 0*/
	height: 600px/*100%*/; /*set table height here; can be fixed value or %*/
	min-height: 0/*104px*/; /*if using % height, make this large enough to fit scrollbar arrows + caption + thead*/
	line-height: 20px;
	padding: 20px 0 20px 0; /*need enough padding to make room for caption*/
	text-align: left;
	font-size: 14px;
}
.scrollingtable * {box-sizing: border-box;}
.scrollingtable > div {
	position: relative;
	border-top: 1px solid black;
	height: 100%;
	padding-top: 34px; /*this determines column header height*/
	/*background-color: #a1a1a1;*/
}
.scrollingtable > div:before {
	top: 0;
	background: cornflowerblue; /*header row background color*/
}
.scrollingtable > div:before,
.scrollingtable > div > div:after {
	content: "";
	position: absolute;
	z-index: -1;
	width: 100%;
	height: 100%;
	left: 0;
}
.scrollingtable > div > div {
	min-height: 0/*43px*/; /*if using % height, make this large enough to fit scrollbar arrows*/
	max-height: 100%;
	overflow: scroll/*auto*/; /*set to auto if using fixed or % width; else scroll*/
	overflow-x: hidden;
	border: 1px solid black; /*border around table body*/
}
.scrollingtable > div > div:after {background: white;} /*match page background color*/
.scrollingtable > div > div > table {
	width: 100%;
	border-spacing: 0;
	margin-top: -20px; /*inverse of column header height*/
	/*margin-right: 17px;*/ /*uncomment if using % width*/
}
.scrollingtable > div > div > table > caption {
	position: absolute;
	top: -20px; /*inverse of caption height*/
	margin-top: -1px; /*inverse of border-width*/
	width: 100%;
	font-weight: bold;
	text-align: center;
}
.scrollingtable > div > div > table > * > tr > * {padding: 0;}
.scrollingtable > div > div > table > thead {
	vertical-align: bottom;
	white-space: nowrap;
	text-align: center;
}
.scrollingtable > div > div > table > thead > tr > * > div {
	display: inline-block;
	padding: 0 6px 0 6px; /*header cell padding*/
}
.scrollingtable > div > div > table > thead > tr > :first-child:before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	height: 34px; /*match column header height*/
	border-left: 1px solid black; /*leftmost header border*/
}
.scrollingtable > div > div > table > thead > tr > * > div[label]:before,
.scrollingtable > div > div > table > thead > tr > * > div > div:first-child,
.scrollingtable > div > div > table > thead > tr > * + :before {
	position: absolute;
	top: 0;
	white-space: pre-wrap;
	color: dimgrey; /*header row font color*/
	font-weight: bolder !important;

}
.scrollingtable > div > div > table > thead > tr > * > div[label]:before,
.scrollingtable > div > div > table > thead > tr > * > div[label]:after {content: attr(label);}
.scrollingtable > div > div > table > thead > tr > * + :before {
	content: "";
	display: block;
	min-height: 34px; /*match column header height*/
	padding-top: 1px;
	border-left: 1px solid black; /*borders between header cells*/
}
.scrollingtable .scrollbarhead {float: right;}
.scrollingtable .scrollbarhead:before {
	position: absolute;
	width: 100px;
	top: -1px; /*inverse border-width*/
	background: white; /*match page background color*/
}
.scrollingtable > div > div > table > tbody > tr:after {
	content: "";
	display: table-cell;
	position: relative;
	padding: 0;
	border-top: 1px solid black;
	top: -1px; /*inverse of border width*/
}
.scrollingtable > div > div > table > tbody {vertical-align: top;}
.scrollingtable > div > div > table > tbody > tr {background: white;}
.scrollingtable > div > div > table > tbody > tr > * {
	border-bottom: 1px solid black;
	padding: 0 6px 0 6px;
	height: 34px; /*match column header height*/
}
.scrollingtable > div > div > table > tbody:last-of-type > tr:last-child > * {border-bottom: none;}
.scrollingtable > div > div > table > tbody > tr:nth-child(even) {background: gainsboro;} /*alternate row color*/
.scrollingtable > div > div > table > tbody > tr > * + * {border-left: 1px solid black;} /*borders between body cells*/