/*--------------------------- fonts ----------------------------------*/
@font-face {
  font-family: 'SegoeUI-Light';
  src: url('../fonts/SegoeUI-Light.eot?#iefix') format('embedded-opentype'),
      url('../fonts/SegoeUI-Light.woff') format('woff'),
      url('../fonts/SegoeUI-Light.ttf')  format('truetype'),
      url('../fonts/SegoeUI-Light.svg#SegoeUI-Light') format('svg');
  font-weight: normal;
  font-style: normal;
}


/*------------------------ Common Styles---------------------------------*/

root { 
    display: block;
}
html, body {
    height: 100%;
}

body{
    padding-top: 115px;
    background-color: white;
    color: #131313;
}

a:link{outline: 0 !important;}

img{max-width: 100%;}

.bold{font-weight: bold;}

.no-margin{margin: 0 !important;}
.no-padding{padding: 0 !important;}

.spacer-xs{margin: 12px 0; height:2px;}
.spacer-sm{margin: 20px 0; height:2px;}
.spacer-lg{margin: 40px 0; height:2px;}


.jquery-css3media{
    width: 2px;
}

/*======================================================================================================================*/
/*-========================================== Layout-admin page -==================================================-*/

/*---------------------- notification bar ----------------- */
.row-noti{
    position: fixed;
    top: 0; left: 0; right: 0;
    width: 100%;
    height: 50px;
    background-color: #3D4748; color: white;
    z-index: 1100;
}
.ul-noti{
    float: right;
    margin: 0; padding: 0; margin-top: 5px;
}
.row-noti .ul-noti > li{
    margin: 0; padding: 0;
    margin-left: 20px;
    height: 36px;
}
.row-noti .ul-noti > li > a{
    margin: 0; padding: 0;
    display: block;
    color: white;
    text-decoration: none;
}
.row-noti .ul-noti > li > a:hover{opacity: 0.4;}

.row-noti .ul-noti > li > ul.dropdown-menu{
    border-radius: 0;
    background-color: #068CD5; color: white;
    width: 320px;   
}
.noti-scroll{
    max-height: 250px; overflow-y: auto;
    padding: 0 5px;
}


.row-noti .ul-noti > li > ul.dropdown-menu > li{padding: 5px 10px;}
.row-noti .ul-noti > li > ul.dropdown-menu > li:last-child{border: 0;}
.row-noti .ul-noti > li > ul.dropdown-menu > li.divider{padding: 0; border-bottom: 1px solid white;}
.row-noti .ul-noti > li > ul.dropdown-menu > li > ul.noti-scroll li{border-color: #47BDFA; padding: 6px;}
.row-noti .ul-noti > li > ul.dropdown-menu > li > ul.noti-scroll li:hover{cursor: pointer; background-color: #49BCFB;}
.row-noti .ul-noti > li > ul.dropdown-menu > li.nohover{border: 0;}
.row-noti .ul-noti > li > ul.dropdown-menu > li.nohover:hover{background-color: transparent; cursor: auto;}
.row-noti .ul-noti > li > ul.dropdown-menu > li > a{
    border-radius: 0;
    background-color: #068CD5; color: white;
}
.row-noti .ul-noti > li > ul.dropdown-menu > li > ul > li{padding: 0 5px; border-color: #47BDFA;}
.row-noti .ul-noti > li > ul.dropdown-menu > li > ul > li > p{
    padding-right: 50px;
    width: 250px;
    padding-bottom: 5px; padding-top: 5px;
    
}
.notification-box{position: relative;}
.notification-count{
    position: absolute; top: -10px; left: -13px;
    font-size: 12px; font-weight: normal;
    background-color: #068CD5; color: white;
}
.row-noti ul.dropdown-menu li{border-bottom: 1px solid #646E6F;}
/*------- avatar ------------ */
.row-noti .ul-noti > li.avatarlist{
    margin-left: 30px;
    height: 42px;
}

.row-noti .ul-noti > li.avatarlist > ul.dropdown-menu{
    background-color: #3D4748; color: white;
    width: 180px;
    box-shadow: none; border: 0;
}
.row-noti .ul-noti > li.avatarlist > ul.dropdown-menu > li{padding: 0; border-bottom: 1px solid #646E6F;}
.row-noti .ul-noti > li.avatarlist > ul.dropdown-menu > li:last-child{border-bottom: 0;}
.row-noti .ul-noti > li.avatarlist > ul.dropdown-menu > li:hover{cursor: pointer; background-color: transparent;}
.row-noti .ul-noti > li.avatarlist > ul.dropdown-menu > li > a{
    display: block;
    padding-top: 10px; padding-bottom: 10px;
    background-color: #3D4748; color: white;
}
.row-noti .ul-noti > li.avatarlist > ul.dropdown-menu > li > a:hover{background-color: #646E6F;}
.row-noti .ul-noti > li.avatarlist > a > img{
    max-height: 40px;
    margin: 0; padding: 0; margin-top: 0px;
}

/*----------------------------------- menu bar ------------------------------------ */
.nav-row{
    width: 100%; 
    background-color: white; color: black;
    position: fixed;
    top: 50px; left: 0;
    z-index: 999;
}

.nav-row .navbar {
    margin-bottom: 0px;
    border: 0;  border-bottom: 1px solid #646E6F;
    border-radius: 0;
}
.navbar-default{background-color: transparent;}

.navbar .navbar-nav > li > a {
    color: black; font-size: 16px; 
    padding-top: 22px;
    padding-bottom: 22px;
}
.navbar-nav > li:last-child > a {padding-right: 0;}

.navbar .navbar-nav > li > a:visited {color: black;}
.navbar .navbar-nav > li > a:focus {color: black;}
.navbar .navbar-nav > li > a:hover {background-color: transparent; color: black; color: #068CD5;}
.navbar-default .navbar-nav > .open > a, .navbar-default .navbar-nav > .open > a:hover, .navbar-default .navbar-nav > .open > a:focus {
    background-color: transparent;
    color: black; opacity: 0.7;
}
.nav-row ul.double-column{width: 400px;}
.nav-row ul.dropdown-menu{background-color: #3D4748;}
.nav-row ul.dropdown-menu li{border-bottom: 1px solid #646E6F;}
.nav-row ul.dropdown-menu.double-column li{border-bottom: 1px solid #646E6F; padding: 0; padding-right: 15px; width: 200px;}
.nav-row ul.multi-clm-ul li:first-child{padding: 10px; padding-left: 20px;}
.nav-row ul.rightdropmenu li{padding-right: 0 !important;}
.nav-row ul.dropdown-menu li:last-child{border-bottom: 0;}
.nav-row ul.dropdown-menu li a{padding: 10px; padding-left: 20px; color: white; display: block;}
.nav-row ul.dropdown-menu li a:hover{
    background-color: #646E6F !important;
    color: white !important;
}
.nav-row  ul.dropdown-menu li.nbsp{visibility: hidden;}

/*----- navbar dropdown arrow -----------*/
.navbar-nav > li .dropdown-menu, ul.dropdown-menu {top: 95%; border: 0; border-radius: 0;}
.navbar-nav > li .dropdown-menu:after {
    position: absolute;
    top: -9px;
    right: 25px;
    display: inline-block;
    border-right: 12px solid transparent;
    border-bottom: 11px solid #3D4748;
    border-left: 12px solid transparent;
    content: '';
}
.navbar-nav > li .dropdown-menu.pull-left:after {left: 25px; right: auto;}
/*------------------*/

.multi-clm-ul li{padding: 10px 10px; color: white;}
li.divider{padding: 0 !important;}
ul.multi-clm-ul li.divider{border-color: white; margin: 0; padding: 0;}
ul.multi-clm-ul li:first-child{border: 0; font-weight: bold;}
ul.multi-clm-ul li:first-child a:hover{cursor: default !important;}
.multi-clm-ul li a:hover{background-color: transparent !important; text-decoration: none; opacity: 0.8;}
.dropdown-menu > li > ul.rightdropmenu{float:right; position:absolute; top:5px; right:0px;}
.navbar-right .dropdown-menu.pull-left {left: 0; right: auto;}
.navbar-brand { margin: 0; padding: 0;}
.navbar-brand img{height: 55px; padding-left: 15px; padding-top: 5px;}


/*=================================================================================================================
================================== start main content styles ================================================== */
.panel-default{margin: 0; border-radius: 0;}
.panel-default .panel-heading{background-color: #ECF6FF; font-size: 20px; color: #068CD3;}
.cog-dropdown > i{color: #3D4746; margin: 0; padding: 0;}

.counter-block{
    height: 80px; margin-bottom: 10px;
    text-align: center;
    background-color: #EEEEEE; color: gray;
    background: url('../img/cb1.jpg') top left no-repeat,
        url('../img/cb3.jpg') top right no-repeat,
        url('../img/cb2.jpg') top center repeat-x #eee;
    padding-top: 12px;
}
.counter-block span{color: #068CD3; font-size: 20px;}
span.red{color: #B80000;}
i.red{color: #B80000;}

.cog-dropdown{cursor: pointer;}
.cog-dropdown ul.dropdown-menu {right: -12px; top: 35px;}
.cog-dropdown ul.dropdown-menu:after {
    position: absolute;
    top: -9px;
    right: 8px;
    display: inline-block;
    border-right: 12px solid transparent;
    border-bottom: 11px solid #3D4748;
    border-left: 12px solid transparent;
    content: '';
}
ul.dropdown-menu{background-color: #3D4748;}

.dropdown-menu > li {border-bottom: 1px solid #646E6F;}
.dropdown-menu > li:last-child {border-bottom: 0;}
.dropdown-menu > li > a {color: white; padding: 10px;}
.dropdown-menu > li > a:visited{ color: white;}
.dropdown-menu > li > a:hover{background-color: #646E6F; color: white;}
.panel-blue .panel-heading .cog-dropdown a{margin-right: 0;}
/*--------------------------*/
.panel-filled .panel-body{margin: 0; padding: 0;}

.panel-filled .table{
    margin: 0; padding: 0;
}

.panel-filled .table th,
.panel-filled .table td {border: 1px solid #DDDDDD;}
.panel-filled .table th {border-top: 0}
.panel-filled .table tr:last-child td {border-bottom: 0;}
.panel-filled .table td:first-child ,
.panel-filled .table th:first-child {border-left: 0;}
.panel-filled .table td:last-child ,
.panel-filled .table th:last-child {border-right: 0;}

.table-c-summary th,
.table-c-summary td{text-align: center;}
.table-c-summary td:first-child{text-align: left;}
.table-c-summary td:last-child{color: #068CD3;}
.table-c-summary > tbody > tr > th{
    padding: 3px;
    font-size: 12px;
    font-weight: normal;
    color: gray;
    background: url('../img/cb2.jpg') 0 -1px repeat-x !important;
}
/*-------------------*/
.panel-blue{background-color: #068CD5; color: white;}
.panel-blue .panel-heading{background-color: #068CD5; color: white;}
.panel-blue .cog-dropdown > i{color: white;}
.panel-blue .panel-heading a{color: white; font-size: 14px; margin-right: 7px;}

.panel-blueHead .panel-heading{background-color: #068CD5; color: white; border-radius: 0;}
.panel-blueHead .cog-dropdown > i{color: white;}
.panel-blueHead .panel-heading a{color: white; font-size: 14px;}
/*---------------*/
select,
input[type='text'],
input[type='number'],
input[type='email']
{
    height: 28px;
    margin-top: 0px;
    border: 1px solid #CCCCCC;
    background-color: white;
    border-radius: 5px;
}
.btn-form{margin-top: 12px !important; display: block; float: left; height: 30px; padding-top: 5px;}
.btn-MTM{background-color: #068CD3; color :white;}
.btn-MTM:hover{background-color: #057bba; color :white;}

/*-------------- News slider -----------------*/

.slider-news{background-color: transparent;}
.slider-news .carousel{padding-bottom: 30px;}
.slider-news .pr-img, .slider-news .item img{
    margin: 5px 0 5px 0; 
    width: auto; max-width: 160px; height: 120px;
    float:left;
}
.slider-news .slider-caption{
    color: white;
    margin: 15px 0 0 0px;
    float: right;
}
.slider-news .slider-caption h2{font-size:15px; margin: 0; color: #56BBF3; font-weight: bold; padding-left: 15px;}
.slider-news .slider-caption p{font-size: 15px; padding-left: 15px;}
.slider-news .slider-caption p a{color: white; margin-top: 10px;}
.slider-news .carousel-indicators{top: auto; bottom: -20px; left: 50%;}

/*------ footer ------------- */
.row-footer{
    height: 50px;
    border-top: 1px solid darkgray;
    text-align: right;
    padding-top: 10px;
    z-index: 999;
    background-color: white;
}

/*------------------*/
.order-graph #canvas{width: 100%; height: 287px !important;}

.panel-collapsed-default .panel-body{display: none;}
.panel-collapsed-default .panel-footer{display: none;}

/*------------------ fullscreen styles ------------- */
.fullsc{
    width: 90%; margin-left: 5%;
    max-height: 90%; overflow-y: auto;
    position: absolute; top: 5%;
    left: 0;
    z-index: 2000;
    border :0;
}
.overlay{
    position: fixed;
    top: 0; left: 0;
    width: 100%; height: 100%;
    background-color: rgba(0,0,0,0.93);
    z-index: 1500;
}
.ph{position: fixed; width: 90%;}
.panel .pb{padding-top: 70px !important;}
.panel-filled .pb{padding-top: 51px !important;}


/* ----------------- additional styles ----------------------- */
.block-heading{
    padding: 20px;
    text-align: center;
    color: #EE7812;
}

/*----------- tabs --------------*/
.panel-heading{min-height: 50px;}
.mtm-tabpanel .tab-pane{padding: 10px 0;}
.mtm-tabpanel .nav-tabs{border-bottom: 0; margin-top: -60px;}
.tabheader{display: none;}

/*------------------------- accordion ------------------*/
.accordion-mtm{margin: 0;}
.accordion-mtm .panel-heading{
    margin: 0; padding:0;
    border-radius: 0;
    min-height: 2px;
}
.accordion-mtm .panel-heading a{
    font-size: 15px;
    display: block;
    padding: 10px 15px;
    text-decoration: none;
}
.accordion-mtm .panel-body{padding: 15px 10px;}
.accordion-mtm .panel-heading:hover{ background-color: #057bba}
.accordion-mtm .panel.panel-default{border: 0; border-radius: 0; margin: 0; border-top: 1px solid white;}

/*------------ input with tooltip ----------*/
.input-tooltip .input-group-btn > .btn {
    border-left: 0;
    height: 28px;
    margin-top: 10px;    
    outline: 0;
}
.input-tooltip .input-group-btn > .btn:hover { background-color: transparent; border-color: #CCCCCC; }
.input-tooltip .input-group-btn > .btn:focus { background-color: transparent; border-color: #CCCCCC; box-shadow: none;}
.input-tooltip .input-group-btn > .btn > .fa{font-size: 20px; margin-top: -12px; opacity: 0.5;}
.input-tooltip .input-group-btn > .btn:hover > .fa{ opacity: 1;}
.input-group.input-tooltip .form-control {
    border-right: 0;
    box-shadow: none;
    border-color: #CCCCCC;
    padding: 1px 15px;
}
.tooltip-inner {
    padding: 3px 8px;
    border-radius: 0;
    max-width: 500px !important;
}
/*------ panel footer style --------------*/
.panel-footer{
    height: 40px;
    padding: 5px 15px 5px 15px;   
    background-color: #ECF6FF;
}
.panel-blue .panel-footer{background-color: #068CD5; border-top-color: white;}
.btn-footer{
    padding: 3px 12px;
    margin-top: 1px;
}

/*----------- form tooltip -----------------*/
.butt-tooltip{
    width: 35px; height: 28px;
    background: url('../img/question.png') 7px 3px no-repeat white;
    margin: 0; padding: 0; border: 0; margin-top: 10px;
    border-top-right-radius: 5px; border-bottom-right-radius: 5px;
    padding-right: 5px;
    border: 1px solid #CCCCCC; border-left: 0;
}
.butt-tooltip.butt-tooltip-active{
    background: url('../img/question-hover.png') 7px 3px no-repeat !important;
}
.tooltip-bzx{
    background-color: #2B2B2B; color: white;
    padding: 7px 10px; margin: 10px 0 0 0; font-size: 13px;
    position: relative;
    border-radius: 5px;
    display: none;
}
.tooltip-bzx-wrap .input-group input{border-right: 0; box-shadow: none;}
.tooltip-bzx-wrap .input-group input:focus{border-color: #CCCCCC; box-shadow: none;}
/* tooltip arrow */
.tooltip-bzx:after {
    position: absolute;
    top: -9px;
    right: 8px;
    display: inline-block;
    border-right: 10px solid transparent;
    border-bottom: 9px solid #2B2B2B;
    border-left: 10px solid transparent;
    content: '';
}

/*============================================== Login page ========================================*/
body.loginpage{padding-top: 0;}
.loginpage .container.container-alert{margin-top: 50px; max-width: 800px !important;}
.loginpage .container{max-width: 800px !important;}
.loginboxwrap{margin-top: 50px; border: 1px solid #DBDBDB;}
.loginlogo{
    background: url('../img/loginbox-bg.jpg') top center no-repeat;
    height: 400px;
    text-align: center;
    position: relative;
}
.loginlogo img{
    position: absolute; top: 50%; left: 50%;
    margin-left: -100px; margin-top: -100px;
    width: 200px; height: 200px;
    border: 1px solid white; background-color: white;
}
.loginform{
    background-color: #ECF6FF; height: 400px;
    padding: 30px;
}
.lgnheading{font-size: 30px; color: #068CD5; font-family: 'SegoeUI-Light';}
.loginform table{
    margin: 15px 0 10px 0;
}
.loginform table tr td{vertical-align: middle;}
.loginform table tr td:first-child{padding-right: 15px;}
.loginpage input[type='password']
{
    margin-top: 10px;
    border: 1px solid #CCCCCC;
    border-radius: 5px;
}
.loginform input[type="text"],
.loginform input[type="password"],
.loginform select{
    width: 220px;
    height: 30px;
}
.loginform input[type="text"],
.loginform input[type="password"] {padding: 2px 8px;}

.btn-login{
    width: 100%;
    background-color: #3793C6; color: white;
    border-radius: 3px;
    border: 0; border-bottom: 2px solid #989898; border-right: 2px solid #989898;
    padding: 6px 0; font-size: 13px;
    margin-top: 15px;
}
.btn-login:hover{
    border-bottom: 2px solid #3793C6; border-right: 2px solid #3793C6;
    padding: 6px 0; font-size: 13px;
}
.loginbox-footer{
    font-size: 13px;
    color: #068CD5;
    position: absolute; bottom: 20px; left: 20px;
}