/* HTML5 Boilerplate  */
article, aside, details, figcaption, figure, footer, header, hgroup, nav, section { display: block; }
audio, canvas, video { display: inline-block; *display: inline; *zoom: 1; }
audio:not([controls]) { display: none; }
[hidden] { display: none; }

html { }
html, button, input, select, textarea {  color: #222; }
body { margin: 0; font-size: 1em;   font-family:Arial, Helvetica, sans-serif;}

::-moz-selection { background: #fe57a1; color: #fff; text-shadow: none; }
::selection { background: #fe57a1; color: #fff; text-shadow: none; }

a {  }
a:visited {  }
a:hover {  }
a:focus { outline:none; }
a:hover, a:active { outline: 0; }
abbr[title] { }
b, strong { font-weight: bold; }
blockquote { margin: 1em 40px; }
dfn { font-style: italic; }
hr { display: block; height: 1px; border: 0; margin: 1em 0; padding: 0; }
ins { background: #ff9; color: #000; text-decoration: none; }
mark { background: #ff0; color: #000; font-style: italic; font-weight: bold; }
pre, code, kbd, samp {  }
pre { white-space: pre; white-space: pre-wrap; word-wrap: break-word; }

q { quotes: none; }
q:before, q:after { content: ""; content: none; }
small { font-size: 85%; }
sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }
sup { top: -0.5em; }
sub { bottom: -0.25em; }


dd { margin: 0 0 0 40px; }
nav ul, nav ol { list-style: none; list-style-image: none; margin: 0; padding: 0; }

img { border: 0; -ms-interpolation-mode: bicubic; vertical-align: middle; }
svg:not(:root) { overflow: hidden; }
figure { margin: 0; }

form { margin: 0; }
fieldset { border: 0; margin: 0; padding: 0; }

label { cursor: pointer; }
legend { border: 0; *margin-left: -7px; padding: 0; white-space: normal; }
button, input, select, textarea { font-size: 100%; margin: 0; vertical-align: baseline; *vertical-align: middle; }
button, input { line-height: 31px; }
button, input[type="button"], input[type="reset"], input[type="submit"] { cursor: pointer; -webkit-appearance: button; *overflow: visible; }
button[disabled], input[disabled] { cursor: default; }
input[type="checkbox"], input[type="radio"] { box-sizing: border-box; padding: 0; *width: 13px; *height: 13px; }
input[type="search"] { -webkit-appearance: textfield; -moz-box-sizing: content-box; -webkit-box-sizing: content-box; box-sizing: content-box; }
input[type="search"]::-webkit-search-decoration, input[type="search"]::-webkit-search-cancel-button { -webkit-appearance: none; }
button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; }
textarea { overflow: auto; vertical-align: top; resize: vertical; }
input:valid, textarea:valid {  }
input:invalid, textarea:invalid { background-color: #f0dddd; }

table { border-collapse: collapse; border-spacing: 0; }
td { vertical-align: top; }

.chromeframe { margin: 0.2em 0; background: #ccc; color: black; padding: 0.2em 0; }



/*===============font====================**/

@font-face {
    font-family: 'co_headline_corpregular';
    src: url('coheadline-webfont.eot');
    src: url('coheadline-webfont.eot?#iefix') format('embedded-opentype'),
         url('coheadline-webfont.woff2') format('woff2'),
         url('coheadline-webfont.woff') format('woff'),
         url('coheadline-webfont.ttf') format('truetype'),
         url('coheadline-webfont.svg#co_headline_corpregular') format('svg');
    font-weight: normal;
    font-style: normal;

}




@font-face {
    font-family: 'co_headline_corpbold';
    src: url('coheadline_corp-webfont.eot');
    src: url('coheadline_corp-webfont.eot?#iefix') format('embedded-opentype'),
         url('coheadline_corp-webfont.woff2') format('woff2'),
         url('coheadline_corp-webfont.woff') format('woff'),
         url('coheadline_corp-webfont.ttf') format('truetype'),
         url('coheadline_corp-webfont.svg#co_headline_corpbold') format('svg');
    font-weight: normal;
    font-style: normal;

}




@font-face {
    font-family: 'co_headline_corplight';
    src: url('coheadline_corp_lt-webfont.eot');
    src: url('coheadline_corp_lt-webfont.eot?#iefix') format('embedded-opentype'),
         url('coheadline_corp_lt-webfont.woff2') format('woff2'),
         url('coheadline_corp_lt-webfont.woff') format('woff'),
         url('coheadline_corp_lt-webfont.ttf') format('truetype'),
         url('coheadline_corp_lt-webfont.svg#co_headline_corplight') format('svg');
    font-weight: normal;
    font-style: normal;

}





/* =============================================================================
   Author Style Start
   ========================================================================== */
*{padding:0; margin:0}
body{background:#ffe013 url(../images/bg-1.jpg) top center no-repeat;  font-family: 'Open Sans', sans-serif; font-weight:400; }
h1, h2{font-family: 'co_headline_corpregular'; font-weight:normal}
a{text-decoration:none}
li{list-style-type:none}
.trans{transition: all 0.3s ease-out 0s;-moz-transition: all 0.3s ease-out 0s;-webkit-transition: all 0.3s ease-out 0s;-o-transition: all 0.3s ease-out 0s;}
header{width:100%; height:170px;  text-align:center; }
header .logo{width:140px; height:90px; display:inline-block; background:url(../images/logo.png) 0 0; background-size:100% 100%; margin-top:40px; position:relative; z-index:1000000}
.main-banner{width:100%; max-width:1170px; height:953px; background:url(../images/bg-1.png) right 0 no-repeat;  clear:both; margin:70px auto 0 auto; transition: all 0.3s ease-out 0s;-moz-transition: all 0.3s ease-out 0s;-webkit-transition: all 0.3s ease-out 0s;-o-transition: all 0.3s ease-out 0s; }
.home-container{width:100%; max-width:1237px; margin:auto; height:auto; position:relative}
.main-wrapper{width:100%; height:3730px; }

.home-container .tag1{width:100%; height:auto; background:url(../images/bg-2.png) 0 0 no-repeat;  position:absolute; right:0; top:-325px; z-index:10; }
.home-container .tag1 .sec1{width:100%; height:3435px; position:relative; font-size:17px; line-height:26px; color:#8f8f8f}
.home-container .tag1 .sec1 .bottom-bg{width:367px; height:1999px; position:absolute; bottom:-137px; left:-367px; z-index:10; background:url(../images/bg-3.png) no-repeat; }
.home-container .tag1 .sec1 .t1{width:533px; height:300px;  float:right; margin-top:40px; margin-right:55px;}
.home-container .tag1 .sec1 .t1 p{width:100%; clear:both; margin-bottom:20px}
.home-container .tag1 .sec1 .t2{width:230px; height:620px; float:right; margin-right:45px; margin-top:10px; clear:both}

.home-container .tag1 .sec1 .t2 li h2{font-size:23px; line-height:25px; color:#23a8c9; margin:40px 0 15px 0; display:block}
.home-container .tag1 .sec1 .t2 li .award{width:178px; display:block; margin:auto}
.home-container .tag1 .sec1 .t2 li .txt{width:100%; clear:both; display:block}

.home-container .tag1 .sec1 .t2 .bx-wrapper .bx-prev {left: 0; background:url(../images/bx-arow.png) 0 0}
.home-container .tag1 .sec1 .t2 .bx-wrapper .bx-next {left: 30px; background:url(../images/bx-arow.png) -29px 0}
.home-container .tag1 .sec1 .t2 .bx-wrapper .bx-prev:hover{ background-position:0 -29px}
.home-container .tag1 .sec1 .t2 .bx-wrapper .bx-next:hover {background-position:-29px -29px}
.home-container .tag1 .sec1 .t2 .bx-wrapper .bx-controls-direction a {position: absolute; bottom:-50px;  outline: 0; width:24px; height:24px;  text-indent: -9999px; z-index: 10;  transition: all 0.3s ease-out 0s;-moz-transition: all 0.3s ease-out 0s;-webkit-transition: all 0.3s ease-out 0s;-o-transition: all 0.3s ease-out 0s}



.home-container .tag1 .sec2{width:1015px; height:1003px; background:url(../images/bg-4.png) no-repeat; background-size:100% 100%; color:#FFF; position:absolute; z-index:1000; top:63px; left:-115px}

.home-container .tag1 .sec2 .top{width:480px; height:310px; margin-top:320px; margin-left:255px}
.home-container .tag1 .sec2 .top .name{font-size:28px; line-height:30px; font-family: 'co_headline_corpregular'; font-weight:normal}
.home-container .tag1 .sec2 .top h1{font-size:132px; line-height:132px}
.home-container .tag1 .sec2 .top h2{font-size:66px; line-height:66px}
.home-container .tag1 .sec2 .top p{font-size:20px; line-height:26px; font-variant:300; margin-top:25px}
.home-container .tag1 .sec2 .video{width:403px; height:265px; float:right; background:url(../images/video-icon.jpg); background-size:100% 100%; clear:both; margin-top:70px; margin-right:165px}

.home-container .tag1 .sec3{width:100%; height:auto; clear:both; position:relative; z-index:100; top:170px}

.home-container .tag1 .sec3 .t01{width:100%; height:auto; clear:both; overflow-x :hidden}
.home-container .tag1 .sec3 .t01 .left{width:698px; height:530px; float:left; background:url(../images/pic-1.png) top right no-repeat; margin-left:125px; position:relative; z-index:50}
.home-container .tag1 .sec3 .t01 .right{width:260px; height:auto;  float:right; margin-right:115px; padding-bottom:50px; padding-top:20px; border-bottom:solid 1px #dfdfdf}
.home-container .tag1 .sec3 .t01 .right h1{font-size:67px; line-height:67px; color:#23a8c9; margin-top:55px}
.home-container .tag1 .sec3 .t01 .right p{font-size:17px; line-height:27px; color:#8f8f8f; width:100%; clear:both; margin-top:30px}
.home-container .tag1 .sec3 .t02{ width:100%; height:auto; clear:both;}
.home-container .tag1 .sec3 .t02 .left{width:555px; height:555px; float:left; margin-left:155px; position:relative}
.home-container .tag1 .sec3 .t02 .right{width:260px; height:auto;  float:right; margin-right:115px}
.home-container .tag1 .sec3 .t02 .product{width:100%; height:110px; margin-top:10px; font-size:17px; line-height:19px; color:#23a8c9; font-weight:600; transition: all 0.3s ease-out 0s;-moz-transition: all 0.3s ease-out 0s;-webkit-transition: all 0.3s ease-out 0s;-o-transition: all 0.3s ease-out 0s}
.home-container .tag1 .sec3 .t02 .product .capt{width:auto; height:auto; float:left; padding-top:35px}
.home-container .tag1 .sec3 .t02 .product:hover{color:#c2403a; width:90%; margin-left:10%}
.home-container .tag1 .sec3 .t02 .product .pic{width:130px; height:110px; float:left}
.home-container .tag1 .sec3 .t02 .product .pic img{width:100%}
.home-container .tag1 .sec3 .t02 .left .label1{width:360px; height:360px; background:url(../images/bg5.png); background-size:100% 100%; position:absolute; z-index:10; right:0; top:0; font-size:17px; line-height:24px; color:#FFF; text-transform:uppercase; text-align:center; transition: all 0.3s ease-out 0s;-moz-transition: all 0.3s ease-out 0s;-webkit-transition: all 0.3s ease-out 0s;-o-transition: all 0.3s ease-out 0s}

.home-container .tag1 .sec3 .t02 .left .label1:hover{  z-index:60; 

}

.home-container .tag1 .sec3 .t02 .left .label2{width:360px; height:360px; background:url(../images/bg6.png); background-size:100% 100%; position:absolute; z-index:10; left:0; bottom:0; text-align:center; transition: all 0.3s ease-out 0s;-moz-transition: all 0.3s ease-out 0s;-webkit-transition: all 0.3s ease-out 0s;-o-transition: all 0.3s ease-out 0s}

.home-container .tag1 .sec3 .t02 .left .label1 h2{font-size:67px; line-height:67px; margin-top:135px}
.home-container .tag1 .sec3 .t02 .left .label2 .btn{width:153px; height:36px; background:#23a8c9; display:inline-block; font-size:17px; line-height:36px; color:#FFF; text-transform:uppercase; text-align:center; font-weight:600; -webkit-border-radius: 100px;
-moz-border-radius: 100px;
border-radius: 100px; margin-top:165px; transition: all 0.3s ease-out 0s;-moz-transition: all 0.3s ease-out 0s;-webkit-transition: all 0.3s ease-out 0s;-o-transition: all 0.3s ease-out 0s}
.home-container .tag1 .sec3 .t02 .left .label2 .btn:hover{background:#2fc0e4;}
.home-container .tag1 .sec4{width:100%; max-width:1140px; margin:auto; height:auto; clear:both; position:relative; z-index:100; top:165px;  padding-bottom:50px}
.home-container .tag1 .sec4 .c-says{width:340px; height:auto;  float:left; margin-left:155px;  margin-top:90px; background:url(../images/bg-5.png) top center no-repeat; font-size:20px; line-height:29px; color:#8f8f8f; font-family:Georgia, "Times New Roman", Times, serif; font-style:italic; text-align:center; font-weight:normal}
.home-container .tag1 .sec4 .serve{width:357px; float:right; margin-right:197px} 
.home-container .tag1 .sec4 h2{font-size:30px; line-height:30px; color:#23a8c9; margin-top:125px; margin-bottom:10px; font-style:normal}
.home-container .tag1 .sec4 .clint{width:100%; clear:both; display:block; margin-top:10px}

.home-container .tag1 .sec4 .bx-wrapper .bx-prev {left: 42%; background:url(../images/bx-arow.png) 0 0}
.home-container .tag1 .sec4 .bx-wrapper .bx-next {left: 51%; background:url(../images/bx-arow.png) -29px 0}
.home-container .tag1 .sec4 .bx-wrapper .bx-prev:hover{ background-position:0 -29px}
.home-container .tag1 .sec4 .bx-wrapper .bx-next:hover {background-position:-29px -29px}
.home-container .tag1 .sec4 .bx-wrapper .bx-controls-direction a {position: absolute; bottom:-50px;  outline: 0; width:24px; height:24px;  text-indent: -9999px; z-index: 10;  transition: all 0.3s ease-out 0s;-moz-transition: all 0.3s ease-out 0s;-webkit-transition: all 0.3s ease-out 0s;-o-transition: all 0.3s ease-out 0s}

.home-container .tag1 .sec5{width:100%; max-width:1140px; margin:auto; height:auto; clear:both; position:relative; z-index:100; top:260px; }
.home-container .tag1 .sec5 .news{width:375px; height:auto;  float:left}
.home-container .tag1 .sec5 .news h2{font-size:67px; line-height:67px; color:#23a8c9; margin-bottom:10px}
.home-container .tag1 .sec5 .news li{width:100%; height:auto; clear:both; margin-top:35px; font-size:17px; line-height:25px; color:#927707}
.home-container .tag1 .sec5 .news .date{width:100%; height:auto; clear:both; font-size:13px; line-height:13px; color:#927707; display:block; margin-bottom:5px}
.home-container .tag1 .sec5 .news .title{color:#23a8c9; font-weight:600; margin-bottom:10px; display:block}
.home-container .tag1 .sec5 .news .txt{width:100%; height:auto; clear:both; display:block}
.home-container .tag1 .sec5 .btn{width:151px; height:36px; background:#23a8c9; font-size:17px; line-height:36px; display:block; color:#FFF; text-transform:uppercase; -webkit-border-radius: 100px;
-moz-border-radius: 100px;
border-radius: 100px; text-align:center}
.home-container .tag1 .sec5 .btn:hover{background:#2fc0e4;}
.home-container .tag1 .sec5 .right-sec{width:545px; height:auto;  float:right}
.home-container .tag1 .sec5 .right-sec .logo{width:100%; max-width:446px; margin-bottom:20px}
.home-container .tag1 .sec5 .right-sec p{width:95%; padding-left:5%; clear:both; font-size:17px; line-height:27px; color:#927707; margin-top:22px}
.home-container .tag1 .sec5 .right-sec h2{font-size:30px; line-height:30px; color:#23a8c9; width:95%; margin-left:4%}

.home-container .tag1 .sec6{width:100%; clear:both; position:relative; z-index:100; top:330px}
footer{width:100%; max-width:1140px; margin:auto}
footer .top-sec{width:100%; height:auto; padding:70px 0; background:#ffec71}
footer .top-sec .cnt-tag{width:100%; max-width:875px; margin-left:70px}
footer .top-sec ul{width:33%; height:auto; float:left}
footer .top-sec li{width:100%; height:auto; clear:both; font-size:14px; line-height:18px; color:#927707; margin-top:15px}
footer .top-sec li a{color:#927707; transition: all 0.3s ease-out 0s;-moz-transition: all 0.3s ease-out 0s;-webkit-transition: all 0.3s ease-out 0s;-o-transition: all 0.3s ease-out 0s}
footer .top-sec li a:hover{color:#4a3c01}
footer .top-sec .hd1{font-size:14px; line-height:14px; color:#453800; text-transform:uppercase; margin-bottom:30px; font-weight:600}
footer .top-sec .hd2{font-size:14px; line-height:14px; color:#927707;  margin-top:40px; font-weight:600}
footer .top-sec .number{font-size:34px; line-height:34px; color:#927707; font-variant:600; display:block; margin-top:0}
footer .top-sec .sub{margin-top:2px; line-height:26px}
footer .top-sec .social{width:auto; height:27px; display:block}
footer .top-sec .logo{width:140px; display:block}
footer .top-sec .icon{width:25px; height:27px;  float:left; display:block; margin:0 10px; transition: all 0.3s ease-out 0s;-moz-transition: all 0.3s ease-out 0s;-webkit-transition: all 0.3s ease-out 0s;-o-transition: all 0.3s ease-out 0s}
footer .top-sec .fb{background:url(../images/social.jpg) 0 0}
footer .top-sec .tw{background:url(../images/social.jpg) 0 -34px}
footer .top-sec .go{background:url(../images/social.jpg) 0 -71px}
footer .top-sec .fb:hover{background-position:-33px 0}
footer .top-sec .tw:hover{background-position:-33px -34px}
footer .top-sec .go:hover{background-position:-33px -71px}
.btn{transition: all 0.3s ease-out 0s;-moz-transition: all 0.3s ease-out 0s;-webkit-transition: all 0.3s ease-out 0s;-o-transition: all 0.3s ease-out 0s}
footer .bottom{width:100%; height:auto; clear:both; padding:45px 0 60px 0; clear:both; font-size:14px; line-height:14px; color:#927707}
footer .bottom .l1{width:100%; max-width:315px; float:left}
footer .bottom .r1{width:100%; max-width:100px; float:right; text-align:right}
footer .bottom a{color:#927707; transition: all 0.3s ease-out 0s;-moz-transition: all 0.3s ease-out 0s;-webkit-transition: all 0.3s ease-out 0s;-o-transition: all 0.3s ease-out 0s}
footer .bottom a:hover{color:#4a3c01}
footer .bottom .l1 li{width:100%; height:auto; clear:both; margin-bottom:5px}
footer .bottom .l1 li span{font-size:13px}
footer .bottom .l1 li a{margin-left:20px}

.home-container .tag1 .sec1 .bg01{width:625px; height:1404px; position:absolute; z-index:2; background:url(../images/bg8.png) 0 0 no-repeat; top:-280px; left:-145px; transition: all 0.3s ease-out 0s;-moz-transition: all 0.3s ease-out 0s;-webkit-transition: all 0.3s ease-out 0s;-o-transition: all 0.3s ease-out 0:}


/***=preloader==========**/
#preloader {position:fixed; top:0; left:0; right:0; bottom:0; background-color:#ffe013; /* change if the mask should have another color then white */ z-index:999999999; /* makes sure it stays on top */}

#status {width:74px; height:80px; position:absolute; left:50%; margin-left:-35px; /* centers the loading animation horizontally one the screen */ top:45%; /* centers the loading animation vertically one the screen */ background-image:url(../images/loading-1.gif);/* path to your loading animation */ background-repeat:no-repeat; background-position:center; z-index:999999999  /* is width and height divided by two */}

/* ==========================================================================
Navigation
========================================================================== */
.nav-toggle {
    position:fixed;
    top: 70px;
    right: 15px;
    z-index: 9999999;
    padding: 15px 7px;
    cursor: pointer;
	background:#ff4521;
	width:20px; height:5px;
	-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
transition: all 0.3s ease-out 0s;-moz-transition: all 0.3s ease-out 0s;-webkit-transition: all 0.3s ease-out 0s;-o-transition: all 0.3s ease-out 0s
}
.nav-toggle:hover{background:#c74e47}
.nav-toggle:focus {
    outline: none;
}
.nav-toggle span, .nav-toggle span:before, .nav-toggle span:after {
    content: '';
    position: absolute;
    display: block;
    width: 20px;
    height: 3px;
    border-radius: 1px;
    background: #fff;
    cursor: pointer;
}
.nav-toggle span:before {
    top: -7px
}
.nav-toggle span:after {
    bottom: -7px
}
.nav-toggle span, .nav-toggle span:before, .nav-toggle span:after {
    -webkit-transition: all 300ms ease-in-out;
    transition: all 300ms ease-in-out;
}
.nav-toggle.active span {
    background-color: transparent
}
.nav-toggle.active span:before, .nav-toggle.active span:after {
    top: 0
}
.nav-toggle.active span:before {
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}
.nav-toggle.active span:after {
    top: 10px;
    -webkit-transform: translateY(-10px) rotate(-45deg);
    -ms-transform: translateY(-10px) rotate(-45deg);
    transform: translateY(-10px) rotate(-45deg);
}
.navicon {
    position: relative;
    height: 26px;
}
.navicon p {
    margin: 1px 50px 0 0
}
.navicon-fixed {
    position: fixed;
    top: 59px;
    right: 143px;
}


/* Menu style */
.overlay nav {
    position: relative;
    top: 50%;
    height: 50%;
    text-align: center;
    font-size: 54px;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
	width:100%; max-width:1140px;  margin:auto
}
.overlay ul {
    position: relative;
    display: inline-block;
    margin: 0;
    padding: 0;
    list-style: none;
	width:100%
}
.overlay ul li {
    display: block;
    float: left;
	width:25%;
	font-family: 'co_headline_corpregular';
	font-weight:normal;
	font-size:17px; line-height:17px;
	text-align:left !important
}
.overlay ul li .icon{width:28px !important; height:21px !important; background:url(../images/icon-1.png) 0 2px no-repeat; display:block; float:left; transition: all 0.3s ease-out 0s;-moz-transition: all 0.3s ease-out 0s;-webkit-transition: all 0.3s ease-out 0s;-o-transition: all 0.3s ease-out 0s}
.overlay ul li h2:hover .icon{background-position:0 -19px}
.overlay ul li span{width:100%; height:auto; }
.overlay ul li h2{font-size:23px; line-height:26px; font-weight:normal; color:#23a8c9; text-transform:uppercase; width:100%; clear:both; margin-bottom:25px}
.overlay ul li h2 a{color:#23a8c9}
.overlay ul li:last-child {
    margin-right: 0px
}
.overlay ul li i {
    display: block;
}
.overlay ul li a {
    display: block;
    -webkit-transition: all 300ms ease-in-out;
    transition: all 300ms ease-in-out;
   color:#442621;
   margin-bottom:17px;
   transition: all 0.3s ease-out 0s;-moz-transition: all 0.3s ease-out 0s;-webkit-transition: all 0.3s ease-out 0s;-o-transition: all 0.3s ease-out 0s
}
.overlay ul li .mr{ padding-top:20px}
.overlay ul li a:hover, .overlay ul li a:focus {
	color:#bf3732
}

/* Effects */

.overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
	z-index:999999;
    height: 100%;
    background:#ffe013 url(../images/bg-2.jpg) top center no-repeat;
	transition: all 0.3s ease-out 0s;-moz-transition: all 0.3s ease-out 0s;-webkit-transition: all 0.3s ease-out 0s;-o-transition: all 0.3s ease-out 0s
}
.overlay-boxify {
    visibility: hidden;
    opacity: 0;
    -webkit-transition: opacity 0.5s, visibility 0s 0.5s;
    transition: opacity 0.5s, visibility 0s 0.5s;
}
.overlay-boxify.open {
    visibility: visible;
    opacity: 1;
    -webkit-transition: opacity 0.5s;
    transition: opacity 0.5s;
}
.overlay-boxify nav ul li {
    opacity: 0;
    -webkit-transform: translate3d(0, -80px, 0);
    transform: translate3d(0, -80px, 0);
    -webkit-transition: -webkit-transform 0.5s, opacity 0.5s;
    transition: transform 0.5s, opacity 0.5s;
}
.overlay-boxify.open nav ul:first-child li:first-child {
    -webkit-transition-delay: 0.05s;
    transition-delay: 0.05s;
}
.overlay-boxify.open nav ul:first-child li:nth-child(2) {
    -webkit-transition-delay: 0.1s;
    transition-delay: 0.1s;
}
.overlay-boxify.open nav ul:nth-child(2) li:first-child {
    -webkit-transition-delay: 0.15s;
    transition-delay: 0.15s;
}
.overlay-boxify.open nav ul:nth-child(2) li:nth-child(2) {
    -webkit-transition-delay: 0.2s;
    transition-delay: 0.2s;
}
.overlay-boxify.open nav ul li {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
}




/* =============================================================================
   Author Style End
   ========================================================================== */
 
@-webkit-keyframes moveUpAndShow {
    0% {
        -webkit-transform:translateY(80px);
        opacity:0
    }
    100% {
        -webkit-transform:translateY(0px);
        opacity:1
    }
}
@-moz-keyframes moveUpAndShow {
    0% {
        -moz-transform:translateY(80px);
        opacity:0
    }
    100% {
        -moz-transform:translateY(0px);
        opacity:1
    }
}
@-o-keyframes moveUpAndShow {
    0% {
        -o-transform:translateY(80px);
        opacity:0
    }
    100% {
        -o-transform:translateY(0px);
        opacity:1
    }
}
@-ms-keyframes moveUpAndShow {
    0% {
        -ms-transform:translateY(80px);
        opacity:0
    }
    100% {
        -ms-transform:translateY(0px);
        opacity:1
    }
}
@keyframes moveUpAndShow {
    0% {
        transform:translateY(80px);
        opacity:0
    }
    100% {
        transform:translateY(0px);
        opacity:1
    }
}


/* ==========================================================================
   Helper classes
   ========================================================================== */

.ir {
    background-color: transparent;
    border: 0;
    overflow: hidden;
    *text-indent: -9999px;
}

.ir:before {
    content: "";
    display: block;
    width: 0;
    height: 100%;
}

.hidden {
    display: none !important;
    visibility: hidden;
}

.visuallyhidden {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
}

.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus {
    clip: auto;
    height: auto;
    margin: 0;
    overflow: visible;
    position: static;
    width: auto;
}

.invisible {
    visibility: hidden;
}

.clearfix:before,
.clearfix:after {
    content: " ";
    display: table;
}

.clearfix:after {
    clear: both;
}

.clearfix {
    *zoom: 1;
}

/* ==========================================================================
   Print styles
   ========================================================================== */

@media print {
    * {
        background: transparent !important;
        box-shadow: none !important;
        text-shadow: none !important;
    }

    a,
    a:visited {
        text-decoration: underline;
    }

    a[href]:after {
        content: " (" attr(href) ")";
    }

    abbr[title]:after {
        content: " (" attr(title) ")";
    }

    /*
     * Don't show links for images, or javascript/internal links
     */

    .ir a:after,
    a[href^="javascript:"]:after,
    a[href^="#"]:after {
        content: "";
    }

    pre,
    blockquote {
        border: 1px solid #999;
        page-break-inside: avoid;
    }

    thead {
        display: table-header-group; /* h5bp.com/t */
    }

    tr,
    img {
        page-break-inside: avoid;
    }

    img {
        max-width: 100% !important;
    }

    @page {
        margin: 0.5cm;
    }

    p,
    h2,
    h3 {
        orphans: 3;
        widows: 3;
    }

    h2,
    h3 {
        page-break-after: avoid;
    }
}