@charset "utf-8";
/* CSS Document */

.topBarWrap{
width: 100%;
height: 90px;
position: relative;
z-index: 999;
}

#topBar{
position: fixed;
width: 100%;
height: 90px;
background: rgba(255, 255, 255, 0.95);
left: 0;
top: 0;
padding: 0 40px;
color: #203469;


box-sizing: border-box;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;


-webkit-box-shadow: rgba(0,0,0,0.4) 0 0 5px;
-moz-box-shadow: rgba(0,0,0,0.4) 0 0 5px;
box-shadow: rgba(0,0,0,0.4) 0 0 5px;
}

#topBar .logo{
height: 100%;
display: block;
float: left;
width: 330px;
}

#topBar .logo img{
height: 100%;
width: auto;
}

#topBar .nav{
float: right;
position: relative;
right: 0px;
top: 0;
z-index: 999;
}

#topBar .btnMenu{
font-size: 24px;
color: #203469;
width: 40px;
height: 40px;
line-height: 40px;
text-align: center;
cursor: pointer;
position: absolute;
z-index: 3;

left: 5px;
top: 5px;
}

.nav .btnClose{
font-size: 24px;
color: #fff;
width: 40px;
height: 40px;
line-height: 40px;
text-align: center;
cursor: pointer;
position: absolute;
z-index: 3;

right: 5px;
top: 5px;
}

.iHide{
display: none;
}

.expand .iShow{
display: none;
}

.expand .iHide{
display: block;
}

#topBar .nav{
text-transform: uppercase;
font-size: 16px;
float: right;
font-weight: bold;
}

.nav .line{
display: block;
position: absolute;
height: 10px;
background: #203469;
-webkit-transition: all 0.4s;
-moz-transition: all 0.4s;
-o-transition: all 0.4s;
transition: all 0.4s;
}

.nav .line.active{
background: #ee364c;
}

.nav ul{
margin: 0;
padding: 0;
list-style: none;
}

.nav ul:before,
.nav ul:after {
content: " ";
display: table;
clear:both;
}

.nav > ul > li{
float: left;
position: relative;
}

.nav a{
color: #203469;
}

.nav > ul > li > a{
padding: 45px 15px 25px 15px;
line-height: 20px;
display: inline-block;
}

.nav li.active > a{
color: #ee364c;
}

.nav ul ul{
position: absolute;
background: #b9c7d4;
width: 290px;
padding: 10px 0;
left: -60px;
display: none;
}
.nav > ul > li:hover ul{
display: block;
}

.nav ul ul a{
margin: 0;
padding: 8px 15px;
display: block;
color: #fff;

-webkit-transition: all 0.2s;
-moz-transition: all 0.2s;
-o-transition: all 0.2s;
transition: all 0.2s;
}

.nav ul ul a:hover{
color: #203469;
background: #d5dde5;
}

#topSearchWrap{
position: relative;
width: 40px;
height: 40px;
float: right;
padding: 35px 0px 15px 0px;
margin-left: 15px;
}

#topSearchWrap .btnShowSearch{
position: relative;
width: 40px;
height: 40px;
text-align: center;
line-height: 40px;
cursor: pointer;
}

#topSearchWrap .btnShowSearch i{
position: absolute;
width: 100%;
height: 100%;
line-height: 40px;
left: 0;
top: 0;

font-size: 26px;
}

#topSearchWrap .searchPanel{
width: 290px;
height: 58px;

background: #b9c7d4;
color: #b9c7d4;
overflow: hidden;
position: absolute;
right: -15px;
top: 90px;

display: none;
}

#topSearchWrap .searchPanel .inner{
height: 34px;
margin: 12px 15px;
background: #fff;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
}

#topSearchWrap .searchPanel input{
line-height: 34px;
padding: 0 10px;
width: 200px;
float: left;
}

#topSearchWrap .searchPanel .btnSearch{
width: 40px;
height: 34px;
text-align: center;
line-height: 34px;
float: right;

cursor: pointer;

-webkit-transition: color 0.3s;
-moz-transition: color 0.3s;
-o-transition: color 0.3s;
transition: color 0.3s;
}

#topSearchWrap .searchPanel .btnSearch:hover{
color: #203469;
}

#topSearchWrap.expand .searchPanel{
display: block;
}

.topBarWrap.shortNav {
height: 70px;
}

.shortNav #topBar{
height: 70px;
padding: 0 20px;
}

.shortNav #topBar .logo{
height: 56px;
margin-top: 10px;
}

.shortNav .nav > ul > li > a {
padding: 35px 15px 15px 15px;
}

.shortNav .nav .line {
height: 6px;
}

.shortNav #topSearchWrap{
padding: 25px 0 5px 0;
}

.shortNav #topSearchWrap .btnShowSearch i{
font-size: 20px;
}

.shortNav #topSearchWrap .searchPanel{
top: 70px;
}

#navBg{
display: none;
position: fixed;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.4);
z-index: 88888;
}

.navMobile{
position: fixed;
height: 100%;
background: #b9c7d4;
color: #203469;

width: 50%;
left: -50%;
z-index: 99999;

-webkit-transition: all 0.3s;
-moz-transition: all 0.3s;
-o-transition: all 0.3s;
transition: all 0.3s;
}

.navMobile.move{
left: 0%;

-webkit-box-shadow: rgba(0,0,0,0.6) 0 0 10px;
-moz-box-shadow: rgba(0,0,0,0.6)0 0 10px;
box-shadow: rgba(0,0,0,0.6) 0 0 10px;
}

.navMobile .btnClose{
font-size: 24px;
width: 40px;
height: 40px;
line-height: 40px;
text-align: center;
cursor: pointer;
position: absolute;

right: 5px;
top: 5px;
}

.navMobile ul{
list-style: none;
padding: 0;
margin: 0;
font-size: 16px;
}
.navMobile > ul{
overflow-y: auto;
width: 100%;
margin-top: 40px;
}

.navMobile ul ul{
background: #d5dde5;
}
.navMobile > ul > li{
display: block;
border-bottom: 1px #dde5ed solid;
}

.navMobile ul ul{
display: none;
}

.navMobile ul ul li{
 border-top: 1px #dde5ed solid;
}

.navMobile ul a,
.navMobile ul span{
display: block;
padding: 10px 40px 10px 20px;
}
.navMobile ul span{
position: relative;
}
.navMobile ul span i{
position: absolute;
right: 20px;
}

.navMobile .mobileFooter{
padding: 40px 20px 20px 20px;
}
.navMobile .footerLinks{
margin-bottom: 10px;
}
.navMobile .footerLinks a{
display: block;
padding: 4px 0;
text-transform: uppercase;
}

.navMobile .footerMedia .iconSocialMedia{
width: 30px;
height: 30px;
text-align: center;
line-height: 30px;

border-radius: 30px;
background: #dde5ed;
font-size: 16px;
margin-right: 5px;
display: inline-block;
}

@media (max-width:1240px) {

.topBarWrap{
height: 70px;
}

#topBar{
height: 70px;
padding: 0 20px;
}

/*#topBar .btnMenu, .nav .btnClose{*/
/*display: block;*/
/*}*/


#topBar .logo{
height: 56px;
margin-top: 10px;
width: 210px;
}

.nav > ul > li > a {
padding: 35px 10px 15px 10px;
}

.nav .line {
height: 6px;
}

#topSearchWrap{
padding: 25px 0 5px 0;
}

#topSearchWrap .btnShowSearch i{
font-size: 20px;
}
#topSearchWrap .searchPanel{
top: 70px;
}



}


@media (max-width:1026px) {


.topBarWrap{
height: 50px;
}

#topBar {
height: 50px;
}

#topBar .logo{
height: 40px;
}

#topBar .nav{
display: none;
position: fixed;
width: 50%;
top: 0;
bottom: 0;
left: 50%;
right: 0;
background: rgba(32, 52, 105, 0.95);

padding: 40px 0 40px 0;
box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;

overflow-y: auto;
}


.nav a{
padding: 8px 20px!important;
display: block!important;
color: #fff;
}
.nav a:hover{
background: #d5dde5;
}

.nav .line{
display: none
}

.nav > ul > li{
display: block;
float: none;
}
.nav ul ul{
position: static;
display: block;
background: none;
padding: 0;
width: auto;
margin-left: 10px;

font-size: 14px;
}

.nav ul ul a{
background: none;
line-height: normal;
height: auto;
}

.nav ul ul a span{
margin-right: 0;
width: 40px;
}


#topSearchWrap {
position: absolute;
width: 40px;
height: 40px;
padding: 0px;
margin: 0;
right: 5px;
top: 5px;
}



#topBar .nav{
width: 100%;
left: 00%;
}

#topBar .logo {
margin-top: 5px;
margin-left: auto;
margin-right: auto;

width: 150px;
float: none;
}

#topSearchWrap .searchPanel {
top: 45px;
}


}


@media (max-width: 641px) {

.navMobile{
width: 86%;
left: -86%;
}


}