/* Main style sheet */
@import "../fonts/fonts.css";

*::-moz-selection {background:#576e7a; color:#fff;}

html{overflow-y:scroll; height:100%;}
body{ -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; background:#fafafa; color:#333; margin:0px; padding:0px; letter-spacing:0; font-family:"Poppins", "Source Sans Pro", Arial, sans-serif; font-size:12px; height:100%;}
input, select, textarea{font-family:"Poppins", "Source Sans Pro", Arial, sans-serif; font-size:12px;}
a{color:#4293f3; text-decoration:none;}
a:hover{color:#3083e5;}

.clear {clear:both;}
.none  {display:none !important;}

.compensate-for-scrollbar{margin-right:0 !important;}

/* == ICONS == */
.main-header [class^="icon-"], .main-header [class*=" icon-"] { speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1em; min-width: 1em; display: inline-block; text-align: center; font-size: 16px; vertical-align: middle; position: relative; top: -1px;}

/*
.icon-home:before { content: url(../images/icons/new/icon_home_gray.png); }
.icon-gear:before { content: url(../images/icons/new/icon_gear_gray.png); }
.icon-file:before { content: url(../images/icons/new/icon_file_gray.png); }
.icon-file2:before { content: url(../images/icons/new/icon_file2_gray.png); }
.icon-check:before { content: url(../images/icons/new/icon_check_gray.png); }
.icon-settings:before { content: url(../images/icons/new/icon_settings_gray.png); }
.icon-pulse:before { content: url(../images/icons/new/icon_pulse_gray.png); }
.icon-exit:before { content: url(../images/icons/new/icon_exit_white.png); }
.icon-gate:before { content: url(../images/icons/new/icon_gate_gray.png); }

.icon-statistics{width:20px; height:20px; background: url(../images/icons/bar-chart-v2-x64-grayblue.png) center center no-repeat; background-size: cover; }
.icon-train { width:20px; height:20px; background: url(../images/icons/icon-train-gray.png) center center no-repeat; background-size: cover; }
*/

/* Main */
.main-wrapper{width:100%; min-height:100%; min-width:768px; padding-bottom: 20px; }

/* Footer */
.main-footer{display: block; background:#fff; border-top:1px solid #c7c8cc; box-shadow:0px -1px 3px rgba(0, 0, 0, 0.15);}
.main-footer > .label{display: block; height:35px; line-height:35px; font-size:12px; color:#444; font-weight: bold; text-align: center;}

/* Header */
.main-header{display: table; left:0px; top:0px; width:100%; z-index:9; background:#282b31; padding:0px 20px; }
.main-header > .inner { max-width: 1240px; width: 100%; min-width:700px; display: table; margin: 0 auto; padding:0px 20px;}
.main-header > .inner > .cell-side{display: table-cell; width:140px; vertical-align: middle; transition:0.2s;}
.main-header > .inner > .cell-side:hover{opacity:0.8;}
.main-header > .inner > .cell-side > img{ max-height:23px; display:block; float:left; max-width: 80%; height: 80%; margin-top: -5px; }
.main-header > .inner > .cell-central{display: table-cell;}
.main-header > .inner > .cell-central > .central{display: block; position: relative; font-size:0px;}
.main-header > .inner > .cell-central > .central > .filler{display: inline-block; vertical-align: top; width:1px; height:46px;}

.main-sidebar > .menu > .section > li.inactive > a > span{color:#fff;}


.main-menu{display: flex; flex-flow: row nowrap; align-items: center;}
.main-menu > li{display: block; flex: 0 0 auto; text-transform: uppercase; }
.main-menu > li > .item{display: block; position: relative; height:46px; padding:1px 15px 0 48px; line-height:46px; cursor: pointer; transition: all 0.15s ease-out;}
.main-menu > li > .item > .title{display: block; font-size:12px; line-height:46px; color:#f3f3f3; font-weight: 400;}
.main-menu > li > .item > i{position: absolute; left:12px; top:50%; width:18px; height:18px; transform: translateY(-50%); background-position: center center; background-repeat: no-repeat; background-size: contain; margin-left: 4px; }

.main-menu > li > .item > i.icon-home { background-image: url(../images/icons/new/icon_home_white.svg); }
.main-menu > li > .item > i.icon-gear { background-image: url(../images/icons/new/icon_gear_white.svg); }
.main-menu > li > .item > i.icon-file { background-image: url(../images/icons/new/icon_file_gray.png); }
.main-menu > li > .item > i.icon-file2 { background-image: url(../images/icons/new/icon_reports_white.svg); }
.main-menu > li > .item > i.icon-check { background-image: url(../images/icons/new/icon_check_gray.png); }
.main-menu > li > .item > i.icon-settings { background-image: url(../images/icons/new/icon_settings_white.svg); }
.main-menu > li > .item > i.icon-pulse { background-image: url(../images/icons/new/icon_pulse_gray.png); }
.main-menu > li > .item > i.icon-exit { background-image: url(../images/icons/new/icon_exit_white.png); }
.main-menu > li > .item > i.icon-gate { background-image: url(../images/icons/new/icon_gate_gray.png); }
.main-menu > li > .item > i.icon-statistics { background-image: url(../images/icons/new/icon_statistics_white.svg); }
.main-menu > li > .item > i.icon-train { background-image: url(../images/icons/icon-train-gray.png); }

.main-menu > li > .item > .dropdown{display: none; position: absolute; z-index:99; left:-15px; top:46px; padding:0 15px 15px 15px;}
.main-menu > li > .item > .dropdown > .inner{min-width:150px; max-width:220px; background: #fff; box-shadow: 0 1px 4px rgba(0, 0, 0, 0.25)}
.main-menu > li > .item > .dropdown > .inner > .item{display: block; padding:7px 14px; font-size:14px; line-height:18px; color:#111;}
.main-menu > li > .item > .dropdown > .inner > .item:hover{background: #f4f4f4;}
.main-menu > li > .item > .dropdown > .inner > .item.active{color:#000;}

.main-menu > li > .item:hover{background: #212328;}
.main-menu > li > .item:hover > .dropdown{display: block;}
.main-menu > li > .item.active{background: #212328; box-shadow: inset 0 4px 0 #7ecc2b;}

.header-controls{display: block; position: absolute; right:0px; top:0px; font-size:0px;}
.header-controls > li{display:inline-block; vertical-align: top; position: relative;}
.header-controls > li.first{margin-left:0px;}
.header-controls > li .icon{display: inline-block; vertical-align: top; width:46px; line-height:46px; font-size:16px; text-align: center; color:#fff; cursor: pointer;}
.header-controls > li .icon:hover{ background:#212328; }
.header-controls > li .icon i { top:1px; }

.header-controls .quick-icon{display: block; position: relative; padding:0px 10px 0px 10px; line-height: 46px; cursor:pointer;}
.header-controls .quick-icon > img{width:24px; height:24px;}
.header-controls .quick-icon.system > img{width:20px; height:20px;}
.header-controls .quick-icon > .attention{display: block; position: absolute; top:35px; left:50%; transform: translateX(-50%); font-size:10px;line-height:10px; text-transform: uppercase; color:#94df44; font-weight: bold;}
.header-controls .quick-icon:hover{background:#212328;}

.header-controls .profile { display: block; padding:0px 12px; line-height:44px; font-size:14px; color:#f3f3f3; font-weight: 400; cursor:pointer; height: 46px; padding-top: 1px; }
.header-controls .profile > img { border-radius: 15px; }
.header-controls .profile > .name{ display: inline-block; vertical-align: middle; padding:0 0 0 10px; height: 46px; padding-top: 1px; }
.header-controls .profile:hover { background:#212328; }

/* Profile/Password Form */

.profile-form,
.password-form { width:100%; display:table; padding:10px; }
.profile-form > div,
.password-form > div { display:table-row;}
.profile-form > div > label,
.profile-form > div > div,
.password-form > div > label,
.password-form > div > div { display:table-cell; padding:6px; }
.profile-form .form-input,
.password-form .form-input { width:100%; }
.profile-form > .buttons > div,
.password-form > .buttons > div { text-align: right;}

.profile-form > div > div.no-field { padding-left:13px; }


/* Main content */
.wrapper { width:100%; padding:0; margin:0; }
.container { width:100%; max-width:1240px; margin:0px auto; padding:0px 20px; position:relative; }



/* SIDEBAR NOT USED */
.main-sidebar > .menu{display: block; padding:17px 0px;}
.main-sidebar > .menu > .items > .section{margin:10px 0px 10px 0px;}
.main-sidebar > .menu > .items > .section.first{margin-top:0px;}
.main-sidebar > .menu > .items > .section > .name{display: block; margin:0px 0px 8px 0px; padding:0px 20px; font-size:10px; font-weight: bold; line-height:15px; color:#888; text-transform: uppercase; cursor:default;}
.main-sidebar > .menu > .items > .item > a{display: block; padding:10px 20px;}
.main-sidebar > .menu > .items > .item > a > i {display: block; float:left; top:0px; width:16px; line-height: 16px; margin-right:15px; font-size:16px; color:#c9c9c9;}
.main-sidebar > .menu > .items > .item > a > span{display: block; line-height:16px; min-height:16px; font-size:13px; color:#c9c9c9; font-weight: bold;}
.main-sidebar > .menu > .items > .item:hover{background-color:#222d32;}
.main-sidebar > .menu > .items > .item > a:hover > i, .main-sidebar > .menu > .section > li > a:hover > span{color:#fff;}
.main-sidebar > .menu > .items > .item.inactive > a > i, .main-sidebar > .menu > .section > li.inactive > a > span{color:#4f575a;}
.main-sidebar > .menu > .items > .item.active{background-color:#455a64;}
.main-sidebar > .menu > .items > .item.active > a > i{color:#fff;}
.main-sidebar > .menu > .items > .item.active > a > span{color:#fff;}


/* Module */
.module-header{position: relative; padding:0px 40px; background:#fff; border-bottom:1px solid #ddd; font-size:0px;}
.module-header > .module-title{display:block; overflow:hidden; height:70px; line-height:70px; font-size:18px; font-weight: bold; color:#263238; cursor:default;}
.module-header > .module-actions{position: absolute; right:20px; top:17px; text-align: right;}

.general-no-records{display: block; font-size:13px; line-height:22px; color:#666; font-style: italic;}

.shadowed { -webkit-box-shadow: 0px 6px 10px 0px rgba(57,63,79,0.1);
            -moz-box-shadow: 0px 6px 10px 0px rgba(57,63,79,0.1);
            box-shadow: 0px 6px 10px 0px rgba(57,63,79,0.1); }

/* POPUP */
.imperial-popup.default { border:1px solid #dee2e5; border-radius:0px; max-height: 90%; overflow: auto; }
.imperial-popup > .ui-inner > .ui-close { right: 9px; top: 9px;}
.imperial-popup.default > .ui-inner > .ui-content { min-height:200px; min-width:400px; padding:0px; background:#f6f6f6; }
.imperial-popup.default > .ui-inner > .ui-content > div > header{ width:100%; background: #f0f2ef; min-height:40px; line-height:40px; font-weight: 600; font-size:1.2em; padding-left:15px;}
.imperial-popup.default > .ui-inner > .ui-content > div > header b { color: #90c141; }

/* JQPLOT OVERRIDE */
.jqplot-target { font-family:"Source Sans Pro", Arial, sans-serif; }

/* LOADING */
#custom-loading-overlay { position: fixed; left: 0; top: 0; bottom: 0; right: 0; background: #000; opacity: 0.4; filter: alpha(opacity=40); z-index: 1000; }
#custom-loading { width: 50px; height: 57px; position: absolute; top: 50%; left: 50%; margin: -28px 0 0 -25px; }

/* FORM INPUTS */
.form-button, .form-input, .form-select, .form-button, .form-checkbox,
.imperial-select.default .ui-selected { cursor:pointer;  border-radius:4px; border:1px solid transparent; box-shadow:none; color:#282b31; transition:0.2s;}

/* RETHEME ALL ELEMENTS */

.form-input:hover, .form-select:hover, .form-textarea:hover, .form-button:hover, .form-checkbox:hover,
.form-input:focus, .form-select:focus, .form-textarea:focus, .form-button:focus, .form-checkbox:focus,
select.imperial:hover, select.imperial:focus,
.imperial-select.default:hover .ui-selected, .imperial-select.default.opened .ui-selected,
.imperial-select.default .ui-selected:focus { border-color: #7ecc2b; }
.imperial-select.default .ui-inner .ui-items .ui-item { transition:0.2s; }
.imperial-select.default .ui-inner .ui-items .ui-item.selected { background:#7ecc2b; }


.imperial-datepicker.default > .ui-inner > .ui-months > .ui-month > .ui-header { background:#7ecc2b; }
.imperial-datepicker.default > .ui-inner > .ui-months > .ui-month > .ui-weeks > .ui-week > .ui-day.selected, .imperial-datepicker.default > .ui-inner > .ui-months > .ui-month > .ui-weeks > .ui-week > .ui-day.selected:hover { background:#7ecc2b; border-radius:50%; }
.imperial-datepicker.default > .ui-inner > .ui-months > .ui-month > .ui-weeks > .ui-week > .ui-day.active:hover, .imperial-datepicker.default > .ui-inner > .ui-months > .ui-month > .ui-weeks > .ui-week > .ui-day.today, .imperial-datepicker.default > .ui-inner > .ui-months > .ui-month > .ui-weeks > .ui-week > .ui-day.today:hover { border-radius:50%; }
.imperial-select.default .ui-inner .ui-search .ui-search-field:focus{border:1px solid #7ecc2b;}

/* BUTTONS */
.form-button.blue,
button.blue,
.form-button.green,
button.green,
.form-button.red,
button.red {
    color:#fff;
    border-radius: 5px;
    background: #4293f3;
}

.form-button.green,
button.green {
    background: #7ecc2b;
}

.form-button.red,button.red {background: #bb1a1a;}

/* IM kit */
.im-table tr.head > th, .im-table tr.row > td{font-size:12px;}

/* Module layout with/without sidebar */
.module-layout{display: flex; flex-flow: row nowrap; align-items: stretch;}
.module-layout.fixed{width:1240px; margin:0px auto;}
.module-layout > .sidebar{display: block; flex:0 0 auto; width:260px; padding:20px 10px; background: #f1f2f4; border-right: 1px solid #e2e9f1;}
.module-layout > .sidebar > .menu > li > a{display: block; position: relative; padding:8px 10px; color: #222; border-bottom: 1px solid #e5e5e5;}
.module-layout > .sidebar > .menu > li:hover > a{background:#e8e8e8; color:#000;}

.module-layout > .content{display: block; flex:1 1 auto; padding:20px 15px 50px 15px; background:#fcfcfc; box-shadow:1px 0px 3px rgba(0, 0, 0, 0.10), -1px 0px 3px rgba(0, 0, 0, 0.10);}
.module-layout > .content > .head{display: flex; flex-flow: row nowrap; align-items: center;}
.module-layout > .content > .head .title{display: block; flex:1 1 auto; font-size:28px; line-height:36px; color:#b7b7b7; cursor:default;}
.module-layout > .content > .head .side{display: flex; flex:1 1 auto; padding:0px 2px; align-items: center; justify-content: flex-end;}
.module-layout > .content > .head .side > .cell{display: block; flex:0 0 auto; padding:0px 2px;}
.module-layout > .content > .head .side > .cell:last-child{padding-right:0px;}
.module-layout > .content > .head .side > .cell > .im-button{margin:0px 0px;}

.module-layout > .content > .controls{}