﻿::-webkit-scrollbar {width: 8px; height:8px; }
::-webkit-scrollbar-track {background: #FFFFFF; /*-webkit-box-shadow: inset 1px 1px 2px #E0E0E0;border: 1px solid #D8D8D8;*/}
::-webkit-scrollbar-thumb {background: #bbb; border-radius: 4px;-webkit-box-shadow: inset 1px 1px 2px rgba(155, 155, 155, 0.4);}
::-webkit-scrollbar-thumb:hover {-webkit-box-shadow: inset 1px 1px 10px rgba(0,0,0,0.3);}
::-webkit-scrollbar-thumb:active {background: #888;-webkit-box-shadow: inset 1px 1px 2px rgba(0,0,0,0.3);}
input, select{font-size: 14px; padding:3px;    color: #555;    background-color: #fff;    background-image: none;    border: 1px solid #ccc;    border-radius: 4px;    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075);    box-shadow: inset 0 1px 1px rgba(0,0,0,.075);    -webkit-transition: border-color ease-in-out .15s,-webkit-box-shadow ease-in-out .15s;    -o-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;    transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;}
input:focus, select:focus { border-color: #66afe9;    outline: 0;    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102,175,233,.6);    box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102,175,233,.6);}
.wrapbd {
    min-height: 650px;
    padding: 0 8px 0px 0px; /* background-image: url(/images/bg.jpg); background-size: cover;background-position: center;*/
    background: #ddd;
}
.container {width:100% !important; max-width:1500px}
.bdleft{background-color:rgba(222,222,222,.5)}
.bdright{text-align:center}
.tdcenter{text-align:center !important}
.clear{width:100%; clear:both}
.headertop {padding: 3px 0px 0px 0px}
.menubt {position:absolute; right:15px; top:15px;}
.menubt div{width: 33px; height: 33px;}
.menubt span {display: block;  background: #fff;  height: 3px;  margin: 5px 0;}
.topmem {display:none}
.ui-datepicker-title {color:#333}
.ui-datepicker .ui-datepicker-title select{font-size:13px}

.popmap {padding:0 0 0 1px}
.popmap .fa{font-size:25px; }
.datetxt, .hasDatepicker, .maxdate, .binddate {font-size:14px; padding-left:8px !important; padding-right:8px !important}
.formbg{padding: 0px 10px 20px; background: #eee;}
/* menu slide */
/* The side navigation menu */
.sidenav {
    height: 100%; /* 100% Full-height */
    width: 0; /* 0 width - change this with JavaScript */
    position: fixed; /* Stay in place */
    z-index: 200; /* Stay on top */
    top: 68px; display:none;
    left: 0; background:#ccc;
   /* overflow-x: hidden;*/ /* Disable horizontal scroll */
    transition: 0.5s; /* 0.5 second transition effect to slide in the sidenav */
}

/* The navigation menu links */
.sidenav a {
    text-decoration: none;
    display: block;
    transition: 0.3s
}

/* Position and style the close button (top right corner) */
.sidenav .closebtn { position: absolute;  top: -20px;  z-index:999; right: 0;  font-size: 50px;  margin-left: 50px;  color: #005fa4;}

/* Style page content - use this if you want to push the page content to the right when you open the side navigation */
#content {
    transition: margin-left .5s;
}

/* On smaller screens, where height is less than 450px, change the style of the sidenav (less padding and a smaller font size) */
@media screen and (max-height: 450px) {
}

@media screen and (max-width: 991px) 
{
    .sidenav {padding: 30px 0 0;}
}


@media screen and (min-width: 991px) 
{
    .sidenav {display:none}
}

/* form responsive */
.formcom{padding:10px 0; margin: 0px; background:#f1f2ee; border: 1px solid #e7e9e2; text-align:left}
.formcom .item, .formcom .items{overflow:hidden; clear:both; padding-top:5px; padding-bottom:5px; border-bottom:1px solid #e7e9e2;}
.formcom .item .colsp{display:inline-block; padding-left:10px}
.formcom .item:last-child{border-bottom:0px}
.formcom .item .divlable, .formcom .items .divlable{width:28%; text-align:right; float:left; padding-right: 10px;}
.formcom .item .divinput, .formcom .items .divinput{width:72%; float:right; text-align:left}
.formcom .item .divbutton{text-align:center; padding:5px}



.divinput input[type=text], .divinput input[type=email], .divinput input[type=url], .divinput input[type=password], .divinput textarea, .divinput select { max-width: 98%; border-top: 1px solid #ccc;  border-left: 1px solid #ccc; border-right: 1px solid #eee; border-bottom: 1px solid #eee;}
.divinput input[type=text], .divinput input[type=email], .divinput input[type=url], .divinput input[type=password] {width: 50%;}
.multiselect-search {width:80% !important}
.btform {display:inline-block;  color: #fff!important;   padding: 8px 30px 5px;  font-weight: normal;  border: none;  border-radius: 5px;  text-transform: uppercase;}

    
@media(max-width:767px){
    .hdfield {display:none}
    .divinline {width: 100% !important; min-width:auto;}
}

@media(max-width:500px) {
    .divinline {width: 100% !important;}
    .container { padding-right: 8px;  padding-left: 8px;}
    .row { margin-right: -8px; margin-left: -8px;}
    .formcom .item{padding:5px}
    .formcom .item .divlable{text-align:left; padding-bottom:5px}
    .formcom .item .divlable, .formcom .item .divinput{width:100%}
    .divinput input[type=text], .divinput input[type=email], .divinput input[type=url], .divinput input[type=password] {width: 80%;}
    
    .bdright {padding-left: 8px;  padding-right: 8px;}
}
@media(max-width:500px)
{
    .divinput input[type=text], .divinput input[type=email], .divinput input[type=url], .divinput input[type=password] {width: 100%;}
    .hdfieldx, .hdfield {display:none}
}
.ui-autocomplete {max-height:300px; overflow-y:scroll;}
/* logined */
.logined {float:left; padding: 0 10px 0 0}
.logined .togglelogin{cursor:pointer}
.logined .togglelogin .fa{font-size:22px; color:#005fa4}
.logined .dropdown-login {position: absolute; background: #005fa4;    min-width: 250px; right: 50px;    list-style: none;    padding: 5px 20px;    display: none;    margin: 0px;z-index:99; box-shadow: 1px 2px rgba(0,0,0,.1)}
.logined .dropdown-login li { color: #fff;  cursor: pointer; font-size: 14px;  padding: 3px 0; text-align:left;}
.logined .dropdown-login li a {color: #fff; font-size: 14px;}

/*---notitfi---*/
.myNotice {padding: 7px 12px 10px 3px; width: 30px; float: right; background: url('/images/temp/bell.png') no-repeat 8px 5px;  height: 30px;}/**padding-bottom:10px; */
.relNotice {padding:0px !important; left:-999em; position:absolute; z-index:9999999; width:260px; box-shadow: 0 2px 4px #888;}
.relNotice ul{padding:0px; margin:0px; list-style:none}
.relNotice ul li{padding:8px 10px 8px 15px;text-align:left}
.relNotice ul li:hover{background:#fbfbf1}
.relNotice ul li a{color:#679811}
.relNotice_ {background: none repeat scroll 0 0 #fff;padding:10px 0px;color:#333; box-shadow: 1px 2px rgba(0,0,0,.1)}
.myNotice:hover .relNotice{left:-220px !important;width:273px;}
.mnote {cursor:pointer}

.relNotice ul li.lixz a{color:#777; font-size:12px}
.relNotice ul li.lix a{color:#333; font-size:12px}
.relNotice ul li span{font-weight:bold;}
.relNotice ul li div.noticedate{text-align:right; font-size:12px; padding:5px 0px 0px}


.topNotices {cursor:pointer; float: right; margin: -8px 0 0 10px; padding:0; position:relative} 
.topNotices .inotice{background: none repeat scroll 0 0 #f1f1f1; border-radius: 50%; -moz-border-radius:50%; -webkit-border-radius:50%; color: red;  display: block;  font-size: 12px; font-weight: bold; height: 20px;  width: 20px;   margin: 0px 0 0 20px; padding:2px 2px; text-align: center;}
.topNotices .inoticex {display:none; background: none repeat scroll 0 0 #777; border-radius: 50%; -moz-border-radius:50%; -webkit-border-radius:50%; color: #fff; font-size: 11px; font-weight: bold; height: 12px;  width: 12px;   margin: 3px 0 0 3px; padding:2px 2px; text-align: center;}
/*comment*/
.Wrapcommentbox{display:inline-block; min-width:600px; margin:auto; background:#f1f1f1} 
.commentbox {padding:10px;width:100%} 
.commentbox #txtContent{width:100%;}
.commentbox .breakSubmit{padding:10px 0 0; text-align:right}

#div_nextpage {width:80%; padding:10px; margin:10px auto 0; background:#888;  overflow:hidden; }
#div_nextpage .paggingInfo{width: 80%; float: left; text-align: center; color:#fff;}
#viewnext {width: 19%; float: right;}
#viewnext img{height:15px}

.div_break {padding:5px; border-bottom: 1px solid #ccc;clear: both; overflow: hidden;}
.cmtAvatar {float:left; width:15%; padding:5px}
.cmtAvatar img{width:100%}
.cmtdesc { text-align:left; padding:5px}
.cmtdesc .breakname {font-weight:bold}
.cmtdesc .breakcmt {padding:5px 0}
.cmtdesc .breaklike {text-align:right;}
.cmtdesc .breaklike .likecmt{padding:0px 5px; cursor:pointer}
.cmtdesc .breaklike .likecmtcount {cursor:pointer}
.cmtdesc .breaklike .fa{font-size:20px}
.cmtdesc .breakdate {font-size:12px; font-style:italic}
.cmttools {padding:5px; text-align:right; clear:both; overflow:hidden}
.cmttools div{display:inline-block; padding:0 5px}
.cmttools .fa{font-size:20px}

@media(max-width:600px){
    .Wrapcommentbox, #div_nextpage {width:100% !important; min-width:unset}
}

/*--modal--*/
#simplemodal-overlay {background-color:#000; cursor:wait;}
#simplemodal-container {height:auto; width:auto; color:#333; background-color:#f6f5f0; border:5px solid #003053; padding:12px; -moz-border-radius:15px; -webkit-border-radius:15px;border-radius:15px;}
#simplemodal-container .simplemodal-data { }
#simplemodal-container a.modalCloseImg {background:url('/images/temp/x.png') no-repeat; width:25px; height:29px; display:inline; z-index:3200; position:absolute; top:-15px; right:-16px; cursor:pointer;}
#simplemodal-container h3 {color:#e96c11; font-size:large; text-align: center; padding-top:20px; padding-bottom:20px}
/* paging*/
.paging {    padding: 5px 25px;    text-align: right;}
.paging a {    color: #333;    font-weight: bold;    text-decoration: none;}
.paging a:hover, .paging a.activea {    color: #da691e;}
.clbold {    font-weight: bold;}
.csspaging {    font-size: 14px;    padding: 5px;}
.gpchar {    font-size: 20px;}
.csspaging a {    color: Black;}
.pagefocus {    background-color: transparent !important;    border: 1px solid #eee;    color: #da691e !important;    padding: 1px 5px;}

/* menu left*/
.dropdown-submenu{position:relative}
.dropdown-submenu>.dropdown-menu{top:0;left:100%;margin-top:-6px;margin-left:0}
.dropdown-submenu>a:after{display:block;content:" ";float:right;width:0;height:0;border-color:transparent;border-style:solid;border-width:5px 0 5px 5px;border-left-color:#ccc;margin-top:5px;margin-right:-10px}
.dropdown-submenu:hover>a:after{border-left-color:#555}
.dropdown-submenu.pull-left{float:none}
.dropdown-submenu.pull-left>.dropdown-menu{left:-100%;margin-left:10px;-webkit-border-radius:6px 0 6px 6px;-moz-border-radius:6px 0 6px 6px;border-radius:6px 0 6px 6px}
.barbottom{z-index:999}
ul.slidebreak{margin:0;padding:20px 0 0;height:100%;width:200%;list-style-type:none;height:40px}
ul.slidebreak li{float:left;list-style-type:none;width:50%;text-align:center;height:40px}
ul.slidebreak li a{color:#42a5f5}
@media(max-width:768px) {
ul.slidebreak li{width:50%}
}

 /* ticker boottom*/
.wraptickertop{padding-top:10px;padding-bottom:5px;}
.tikertop .fa{color:#0d5192;padding-right:5px}
.tikertop ul{list-style:none}
.tikertop a{color: #aa253b;    font-size: 16px;    font-weight: bold;}
.lineborder{border:0;height:1px;width:150px;margin-top:0px;padding-top:0px;background-image:-webkit-linear-gradient(left, #f0f0f0, #8c8b8b, #f0f0f0);background-image:-moz-linear-gradient(left, #f0f0f0, #8c8b8b, #f0f0f0);background-image:-ms-linear-gradient(left, #f0f0f0, #8c8b8b, #f0f0f0);background-image:-o-linear-gradient(left, #f0f0f0, #8c8b8b, #f0f0f0);}

/* modal bootrap */
.modal-header { padding-top:5px;padding-left:5px;padding-right:5px;padding-bottom:3px;    background: #aa253b;    border-bottom:none;    color: #fff; font-weight:900;}
.modal-header .modal-title {    font-weight: 800;    padding: 5px 10px;    font-size: 16px;}
.modal-header .close {    margin-top: -10px !important;    color: #fff !important;    opacity: 1;    font-size: 40px;    padding: 0 5px;}
.modal-body { position: relative;    padding: 0 4px 4px;    background: #fff;}
.modal-body .formcom{background:#fff}
.modal-dialog {margin: 30px auto;}
.modal-title { color: white;}

/*--modal--*/
#simplemodal-overlay {background-color:#000; cursor:wait;}
#simplemodal-container {height:auto; width:auto; color:#333; background-color:#aa253b; border:5px solid #003053; padding:12px; -moz-border-radius:15px; -webkit-border-radius:15px;border-radius:15px;}
#simplemodal-container .simplemodal-data { }
#simplemodal-container a.modalCloseImg {background:url('/images/temp/x.png') no-repeat; width:25px; height:29px; display:inline; z-index:3200; position:absolute; top:-15px; right:-16px; cursor:pointer;}
#simplemodal-container h3 {color:#e96c11; font-size:large; text-align: center; padding-top:20px; padding-bottom:20px}


/* bootstrap form */
.form-row{display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;margin-right:-5px;margin-left:-5px;text-align:left}
.form-row>.col,.form-row>[class*=col-]{padding-right:5px;padding-left:5px}
.form-group{margin-bottom:.5rem;text-align:left;margin-top:.5rem}
@media (min-width: 768px) {
.col-md-6{-ms-flex:0 0 50%;flex:0 0 50%;max-width:50%}
}
label{display:inline-block;margin-bottom:.5rem;font-weight:500}
.input-group{position:relative;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-ms-flex-align:stretch;align-items:stretch;width:100%}
.input-group-prepend{margin-right:-1px}
.input-group-append,.input-group-prepend{display:-ms-flexbox;display:flex}
.input-group-text{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;padding:.375rem .75rem;margin-bottom:0;font-size:1rem;font-weight:400;line-height:1.5;color:#495057;text-align:center;white-space:nowrap;background-color:#e9ecef;border:1px solid #ced4da;border-radius:.25rem}
.input-group>.custom-file,.input-group>.custom-select,.input-group>.form-control,.input-group>.form-control-plaintext{position:relative;-ms-flex:1 1 auto;flex:1 1 auto;width:1%;min-width:0;margin-bottom:0}
.ml-2,.mx-2{margin-left:.5rem!important}
.pl-2,.px-2{margin-left:.5rem!important}
.pl-2{padding-left:12px; }
.px-2{padding-left:12px; padding-right:12px}
.py-2{padding-top:12px; padding-bottom:12px}
.input-group-addon,.input-group-btn{width:unset!important}
.multiselect-filter .input-group{width:unset!important}
.form-group .multiselect,.form-group .multiselect-native-select,.form-group .btn-group,.form-group .btn-group-vertical{text-align:left;width:100%}

.d-inline-block { display: inline-block!important;}
.modal-xlmd {width: 90% !important; max-width:1250px;}
/*------*/
.divFQuest{position: fixed; cursor:pointer; bottom: 0px; left: 10%; border:1px solid #f1f1f1; height: 40px; line-height: 30px; background-color: #0090cd; font-weight: bold; font-size: large; opacity: 0.8; border-radius: 5px 5px 0px 0px; color: white; padding: 6px 22px 4px 20px;}
.FQueststicky{color:#fff}


div.divstickyz {  position: -webkit-sticky;    position: sticky;    top: 0;    z-index: 9;}
/* left menu*/


.wrapsubref {text-align:left}
.wrapsubref .capheader{}
.wrapsubref .capheader{}
.wrapsubref .linkcaplevel1{font-weight:bold}
.wrapsubref .linkcaplevel2{}
.wrapsubref .linkcaplevel3{}
.wrapsubref .spfa{padding:0 6px}