/* 
- Name: megamenu.js - style.css
- Version: 1.0
- Latest update: 29.01.2016.
- Author: Mario Loncarek
- Author web site: http://marioloncarek.com
*/


/* ––––––––––––––––––––––––––––––––––––––––––––––––––
Body - not related to megamenu
–––––––––––––––––––––––––––––––––––––––––––––––––– */


/*.description { 
 position: absolute; 
 top: 50%; 
 left: 50%; 
 -webkit-transform: translateY(-50%); 
 -ms-transform: translateY(-50%); 
 transform: translateY(-50%); 
 -webkit-transform: translateX(-50%); 
 -ms-transform: translateX(-50%); 
 transform: translateX(-50%); 
 } */


/* ––––––––––––––––––––––––––––––––––––––––––––––––––
megamenu.js STYLE STARTS HERE
–––––––––––––––––––––––––––––––––––––––––––––––––– */


/* ––––––––––––––––––––––––––––––––––––––––––––––––––
Screen style's
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.menu-top{background: linear-gradient(275deg, rgba(18, 46, 104, 1) 0%, rgba(24, 67, 153, 1) 35%);}
.menu-top *{font-family: 'Segoe UI';font-size: 18px;}
.menu-container { 
 /* width: 80%; */
 margin: 0 auto; 
 
 padding: 0; 
 } 

.menu-mobile { 
 display: none; 
 padding: 20px; 
 } 

.menu-mobile:after { 
 content: "\f0c9"; 
 font: normal normal normal 14px/1 FontAwesome; 
 font-size: 2.5rem; 
 padding: 0; 
 float: left; 
 position: relative; 
 top: 50%; 
 -webkit-transform: translateY(-6%); 
 -ms-transform: translateY(-6%); 
 transform: translateY(-6%); 
 margin-right: 15px;
 } 

.menu-dropdown-icon:before { 
 content: "\f055"; 
 font: normal normal normal 18px/52px FontAwesome; 
 height: 43px; 
 display: none; 
 cursor: pointer; 
 float: right; 
 /* padding: 1.5em 2em; */
 padding-right: 1.5em; 
 background: #fff; 
 color: #333; 
 } 

.menu > ul { 
 margin: 0 auto; 
 width: 100%; 
 list-style: none; 
 padding: 0; 
 position: relative; 
 box-sizing: border-box; 
 display: -ms-flexbox;
 display:flex;
 -ms-flex-pack: justify;
 justify-content: space-between;
 } 


.menu > ul > li {
 float: left;
 padding: 0;
 margin: 0;
 height: 60px;
 line-height: 60px;
 } 
.menu > ul > li+li {/* margin-left: 83px; */} 
.menu > ul > li>a {
 text-decoration: none;
 height: 60px;
 line-height: 60px;
 font-size: 18px;
 color: #fff;
 font-weight: 400;
 display: block;
 }
.menu > ul > li>a>span{
display: inline-block; width: 13px; height: 8px; background-size: 13px 8px; margin-left: 6px; position: relative; top: -3px;
background: url("../images/custom/nav-arrow1.png") no-repeat center center;
}
.menu > ul > li > ul { 
 display: none; 
 width: 100%; 
 top: 60px;
 background: rgba(0,0,0,.8); 
 padding: 40px 80px; 
 position: absolute; 
 z-index: 99; 
 left: 0; 
 margin: 0; 
 list-style: none; 
 box-sizing: border-box; 
 justify-content: flex-start; 
 flex-wrap: wrap;
 } 
.menu > ul > li > ul.flex-ul { display: flex!important; } 
/* .menu > ul > li > ul:before,
.menu > ul > li > ul:after { 
 content: ""; 
 display: table; 
 } 

.menu > ul > li > ul:after { 
 clear: both; 
 } */

.menu > ul > li > ul > li {
 margin: 0;
 padding-bottom: 0;
 list-style: none;
 width: 33.33%;
 background: none;
 float: none;
 min-width: 170px;
 } 
.menu > ul > li[type="Resources"] > ul > li:nth-of-type(4){
width:100%!important;
}
.menu > ul > li > ul > li>a { 
 color: #fff; 
 /* padding: .2em 0; */
 width: 95%; 
 display: block; 
 /* border-bottom: 1px solid #ccc; */
 font-size: 16px; 
 font-weight: 700; margin-bottom: 15px; line-height: 33px; white-space: nowrap; 
 } 

.menu > ul > li > ul > li > ul { 
 display: block; 
 padding: 0; 
 margin: 10px 0 0; 
 list-style: none; 
 box-sizing: border-box; 
 } 

.menu > ul > li > ul > li > ul:before,
.menu > ul > li > ul > li > ul:after { 
 content: ""; 
 display: table; 
 } 

.menu > ul > li > ul > li > ul:after { 
 clear: both; 
 } 

.menu > ul > li > ul > li > ul > li { 
 /* float: left; */
 width: 100%; 
 /* padding: 10px 0; */
 margin: 0; 
 font-size: 16px; 
 font-weight: 400; line-height: 22px; 
 color: #fff; 
 } 
 .menu > ul > li > ul>li+li {/* margin-left: 170px; */}
  .menu > ul > li > ul > li:nth-of-type(4){margin-left:0!important;}
 .menu > ul > li[type="Resources"] > ul > li:nth-of-type(4){
flex-basis: 100%;
margin-top: 35px;
padding-top: 20px;
border-top: 1px solid #fff;
}

.menu > ul > li > ul > li > ul > li a { 
 border: 0; color: #fff; 
 } 

.menu > ul > li > ul.normal-sub { 
 width: 300px; 
 left: auto; 
 padding: 10px 20px; 
 } 

.menu > ul > li > ul.normal-sub > li { 
 width: 100%; 
 } 

.menu > ul > li > ul.normal-sub > li a { 
 border: 0; 
 padding: 1em 0; 
 } 

 /* 自定义 */
 .menu-mobile.logo img { max-width: 170px; max-height: 34px; } 

/* ––––––––––––––––––––––––––––––––––––––––––––––––––
Mobile style's
–––––––––––––––––––––––––––––––––––––––––––––––––– */

@media only screen and (max-width: 1200px) { 
 .menu-container { 
 width: 100%; 
 } 
 .menu-mobile { 
 display: block; 
 position: relative; 
 } 
 .menu-dropdown-icon:before { 
 display: block; 
 } 
 .show-on-mobile  .menu-dropdown-icon:nth-of-type(1):before{
 display:none;} 
 .menu > ul { 
 display: none; 
 } 
 .menu > ul > li { 
 width: 100%; 
 float: none; 
 display: block; 
 height: unset; 

 } 
 .menu > ul > li+li { margin-left: 0; } 
 .menu > ul > li>a { 
 /* padding: 1.5em; */
 width: 100%; 
 display: block; 
 padding-left: 1.5em; 
 } 
 .menu > ul > li.active>a ,.menu > ul > li:hover>a { border-bottom: none; color: #0f69a2; } 
 .menu > ul > li > ul { 
 position: relative; 
 padding: 20px; 
 top:4px;
 } 
 .menu > ul > li > ul.normal-sub { 
 width: 100%; 
 } 
 .menu > ul > li > ul > li:nth-of-type(4){
 margin-top:20px;
 padding-top:0;
 border-top:none;
 }
 .menu > ul > li > ul > li { 
 float: none; 
 width: 100%; 
 margin-top: 20px; 
 } 
 .menu > ul > li > ul > li>a { margin-bottom: 5px; } 

 .menu > ul > li > ul>li+li { margin-left: 0; } 
 .menu > ul > li > ul > li:first-child { 
 margin: 0; 
 } 
 .menu > ul > li > ul > li > ul { 
 position: relative; 
 } 
 .menu > ul > li > ul > li > ul > li { 
 float: none; 
 } 
 .menu .show-on-mobile { 
 display: block; 
 } 
 }