@charset "gb2312";

.nav-logo img{width:160px;margin-top:20px;margin-left:5%;}
.app_nav{z-index:90000;display:none;}

.header h1 span,.header p{color: #202a38;}

.icon{color: #de5350;}
.cd-primary-nav li a,.cd-primary-nav li{color:#fff}
.cd-primary-nav>li .small_Anav{text-indent:1em;}
/* -------------------------------- 



Main Components 



-------------------------------- */

main {

  position: relative;

  z-index: 2;

  /* fix bug on iOS */

  height: 100vh;

  overflow-y: auto;

  -webkit-overflow-scrolling: touch;

  padding: 200px 5%;

  background-color: #9cb3a8;

  /* Force Hardware Acceleration in WebKit */

  -webkit-transform: translateZ(0);

  -moz-transform: translateZ(0);

  -ms-transform: translateZ(0);

  -o-transform: translateZ(0);

  transform: translateZ(0);

  -webkit-backface-visibility: hidden;

  backface-visibility: hidden;

  -webkit-transition: -webkit-transform 0.7s;

  -moz-transition: -moz-transform 0.7s;

  transition: transform 0.7s;

  -webkit-transition-timing-function: cubic-bezier(0.91, 0.01, 0.6, 0.99);

  -moz-transition-timing-function: cubic-bezier(0.91, 0.01, 0.6, 0.99);

  transition-timing-function: cubic-bezier(0.91, 0.01, 0.6, 0.99);

}

main h1, main p {text-align: center;}

.navigation-is-open main {

  -webkit-transform: translateX(100%);

  -moz-transform: translateX(100%);

  -ms-transform: translateX(100%);

  -o-transform: translateX(100%);

  transform: translateX(100%);

}

@media only screen and (min-width: 768px) {

  main {padding: 250px 10%;}
}



.cd-nav-trigger {position: absolute;z-index: 3;right: 5%;top: 15px;height: 54px;width: 54px; background-color: #61c250;border-radius: 50%;overflow: hidden;text-indent: 100%; white-space: nowrap;-webkit-transition: -webkit-transform 0.5s;-moz-transition: -moz-transform 0.5s;transition: transform 0.5s;}

.cd-nav-trigger .cd-nav-icon {position: absolute;left: 50%;top: 50%; bottom: auto;right: auto;-webkit-transform: translateX(-50%) translateY(-50%);-moz-transform: translateX(-50%) translateY(-50%);-ms-transform: translateX(-50%) translateY(-50%); -o-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); width: 22px; height: 2px; background-color: #ffffff}

.cd-nav-trigger .cd-nav-icon::before, .cd-nav-trigger .cd-nav-icon:after {content: ''; position: absolute;top: 0;right: 0;
width: 100%;height: 100%;background-color: inherit;-webkit-transform: translateZ(0);-moz-transform: translateZ(0); -ms-transform: translateZ(0); -o-transform: translateZ(0); transform: translateZ(0); -webkit-backface-visibility: hidden; backface-visibility: hidden; -webkit-transition: -webkit-transform 0.5s, width 0.5s, top 0.3s;
 -moz-transition: -moz-transform 0.5s, width 0.5s, top 0.3s; transition: transform 0.5s, width 0.5s, top 0.3s;}

.cd-nav-trigger .cd-nav-icon::before {  -webkit-transform-origin: right top; -moz-transform-origin: right top; -ms-transform-origin: right top; -o-transform-origin: right top; transform-origin: right top; -webkit-transform: translateY(-6px);-moz-transform: translateY(-6px); -ms-transform: translateY(-6px); -o-transform: translateY(-6px); transform: translateY(-6px);}

.cd-nav-trigger .cd-nav-icon::after { -webkit-transform-origin: right bottom; -moz-transform-origin: right bottom; -ms-transform-origin: right bottom; -o-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: translateY(6px); -moz-transform: translateY(6px); -ms-transform: translateY(6px); -o-transform: translateY(6px); transform: translateY(6px);}
.no-touch .cd-nav-trigger:hover .cd-nav-icon::after { top: 2px;}
.no-touch .cd-nav-trigger:hover .cd-nav-icon::before { top: -2px;}

.cd-nav-trigger svg { position: absolute; top: 0; left: 0;}

.cd-nav-trigger circle { -webkit-transition: stroke-dashoffset 0.4s 0s; -moz-transition: stroke-dashoffset 0.4s 0s; transition: stroke-dashoffset 0.4s 0s;}

.navigation-is-open .cd-nav-trigger {-webkit-transform: rotate(180deg); -moz-transform: rotate(180deg); -ms-transform: rotate(180deg);-o-transform: rotate(180deg);transform: rotate(180deg);}

.navigation-is-open .cd-nav-trigger .cd-nav-icon::after,

.navigation-is-open .cd-nav-trigger .cd-nav-icon::before { width: 50%; -webkit-transition: -webkit-transform 0.5s, width 0.5s; -moz-transition: -moz-transform 0.5s, width 0.5s; transition: transform 0.5s, width 0.5s;}

.navigation-is-open .cd-nav-trigger .cd-nav-icon::before {

  -webkit-transform: rotate(45deg);

  -moz-transform: rotate(45deg);

  -ms-transform: rotate(45deg);

  -o-transform: rotate(45deg);

  transform: rotate(45deg);

}

.navigation-is-open .cd-nav-trigger .cd-nav-icon::after {

  -webkit-transform: rotate(-45deg);

  -moz-transform: rotate(-45deg);

  -ms-transform: rotate(-45deg);

  -o-transform: rotate(-45deg);

  transform: rotate(-45deg);

}

.no-touch .navigation-is-open .cd-nav-trigger:hover .cd-nav-icon::after, .no-touch .navigation-is-open .cd-nav-trigger:hover .cd-nav-icon::before {

  top: 0;

}

.navigation-is-open .cd-nav-trigger circle {

  stroke-dashoffset: 0;

  -webkit-transition: stroke-dashoffset 0.4s 0.3s;

  -moz-transition: stroke-dashoffset 0.4s 0.3s;

  transition: stroke-dashoffset 0.4s 0.3s;

}

@media only screen and (min-width: 1170px) {

  .cd-nav-trigger {top: 40px;}

}



.cd-nav {position: fixed;z-index: 1;top: 0;left: 0; height: 100%; width: 100%;background-color: #61c250;visibility: hidden;-webkit-transition: visibility 0s 0.7s;-moz-transition: visibility 0s 0.7s; transition: visibility 0s 0.7s;}

.cd-nav .cd-navigation-wrapper {height: 100%;overflow-y: auto; -webkit-overflow-scrolling: touch;padding: 40px 5% 40px calc(5% + 80px); -webkit-transform: translateZ(0);  -moz-transform: translateZ(0);-ms-transform: translateZ(0);-o-transform: translateZ(0);
 transform: translateZ(0);-webkit-backface-visibility: hidden; backface-visibility: hidden;-webkit-transform: translateX(-50%);-moz-transform: translateX(-50%);-ms-transform: translateX(-50%); -o-transform: translateX(-50%);transform: translateX(-50%); -webkit-transition: -webkit-transform 0.7s; -moz-transition: -moz-transform 0.7s; transition: transform 0.7s; -webkit-transition-timing-function: cubic-bezier(0.86, 0.01, 0.77, 0.78); -moz-transition-timing-function: cubic-bezier(0.86, 0.01, 0.77, 0.78);transition-timing-function: cubic-bezier(0.86, 0.01, 0.77, 0.78);}

.navigation-is-open .cd-nav {visibility: visible;-webkit-transition: visibility 0s 0s; -moz-transition: visibility 0s 0s; transition: visibility 0s 0s;}

.navigation-is-open .cd-nav .cd-navigation-wrapper {

  -webkit-transform: translateX(0);

  -moz-transform: translateX(0);

  -ms-transform: translateX(0);

  -o-transform: translateX(0);

  transform: translateX(0);

  -webkit-transition: -webkit-transform 0.5s;

  -moz-transition: -moz-transform 0.5s;

  transition: transform 0.5s;

  -webkit-transition-timing-function: cubic-bezier(0.82, 0.01, 0.77, 0.78);

  -moz-transition-timing-function: cubic-bezier(0.82, 0.01, 0.77, 0.78);

  transition-timing-function: cubic-bezier(0.82, 0.01, 0.77, 0.78);
  z-index:90000;
}

.cd-nav h2 {position: relative; color: #080b0f;text-transform: uppercase;}
.cd-nav h2::after {content: '';position: absolute;left: 0;bottom: -20px; height: 1px;width: 60px;background-color: currentColor;}
.cd-nav .cd-primary-nav {margin-top: 60px;}
.cd-nav .cd-primary-nav li {margin: 1.6em 0;}
.cd-nav .cd-primary-nav a { display: inline-block;}
.cd-nav .cd-primary-nav a.selected {color: #ffffff;}
.no-touch .cd-nav .cd-primary-nav a:hover {color: #ffffff;}
.cd-nav .cd-contact-info { margin-top: 80px;}
.cd-nav .cd-contact-info li {margin-bottom: 1.5em;color: rgba(255, 255, 255, 0.3);}
.cd-nav .cd-contact-info a {color: #ffffff;}
.cd-nav .cd-contact-info span {display: block;}


@media only screen and (min-width: 1170px) {

  .cd-nav .cd-navigation-wrapper {padding: 62px 20%;}

  .cd-nav .cd-navigation-wrapper::after {clear: both;content: "";display: table; }

  .cd-nav .cd-half-block {width: 50%; float: left;}

  .cd-nav .cd-primary-nav {margin-top: 0;}

  .cd-nav h2 { margin-bottom: 5.6em;}

  .cd-nav .cd-primary-nav li { margin: 2em 0;}
  .cd-nav .cd-contact-info { margin-top: 120px; text-align: right; }

  .cd-nav .cd-contact-info li {margin-bottom: 2.4em;}

}



.no-js main { height: auto; overflow: visible;}
.no-js .cd-nav { position: static;visibility: visible;}
.no-js .cd-nav .cd-navigation-wrapper {

  height: auto;

  overflow: visible;

  padding: 100px 5%;

  -webkit-transform: translateX(0);

  -moz-transform: translateX(0);

  -ms-transform: translateX(0);

  -o-transform: translateX(0);

  transform: translateX(0);

}

