@charset "utf-8";
/* CSS Document */
body{ background:#fff; font:normal 14px/20px 'Lato', sans-serif; color:#666;}
#wpadminbar ul:after{ clear:inherit;}
a{ color:#7ac142;}
ul li{ list-style-type:none;}
#navbtn{ display:none;}
.nav-menu{}
.nav-menu li{ position:relative; float:left;}
.nav-menu li .menuarrow{ display:none;}
.nav-menu li > a{ font:normal 15px/50px 'Lato', sans-serif; color:#fff;  white-space:nowrap; display:block; padding:0 22px;}
.nav-menu li:hover > a, .nav-menu li.active > a,.nav-menu li.current_page_item > a, .nav-menu li > a:focus{ background:#fff; color:#027eb2;}
.nav-menu .sub-menu{ position:absolute; left:0; top:100%; background:#0089cf; min-width:220px; box-shadow:0 0 5px #02496d; transition: all 300ms ease-out 0s; display:none; z-index:999;}
.nav-menu .sub-menu .sub-menu{ left:100%; top:0;}
.nav-menu li:hover > .sub-menu{ display:block;}
.nav-menu .sub-menu li{ float:none;}
.nav-menu .sub-menu a{ font:normal 14px/40px 'Lato', sans-serif; padding:0 10px; white-space:nowrap;}
.nav-menu .sub-menu li+li{ border-top:1px solid #035e8d;}

header{ background:#027eb2; padding:5px 0; margin:20px 0 0;}
#navigation{ margin:20px 0 0; display:table; margin:0 auto;}
#banner{ text-align:center; margin:0 auto;}
#logo{ padding:0 0 20px;}
#content{ padding:30px 0;}
#content p{ font:400 14px/20px 'Lato', sans-serif; padding:15px 0 0;}
#content h1{ font:400 20px/22px 'Lato', sans-serif; padding:15px 0 0;}
.teft-content{ width:50%; float:left;}
.right-content{ width:49%; float:right;}

.border{ position: relative;}
.border:after{ position:absolute; top:0; left:50%; transform: translateY(-50%); right:0; height:1px; background:#666;}


.work-sec{ position:relative;  width:100%; text-align:center;}
.creator{  margin:40px 0 0;}
.creator{ width:100%; overflow:hidden; display:block;}
.creator ul{ width: 20000em;  position: relative;    list-style: none;    margin: 0;    padding: 0 15px;}
.creator li{ width:200px;float:left; font:400 25px/30px 'Lato', sans-serif; color:#fff; padding:0 10px;}
.creator li a{ color:#000;}
.creator-control-prev{ left:0; position:absolute; top:18%; bottom:0; width:17px; height:20px; border:0; cursor:pointer; font-size:0; background:url(images/prev.png) no-repeat 50% 50%;}
.creator-control-next{ right:0; position:absolute; top:18%; bottom:0; width:17px; height:20px; border:0; cursor:pointer; font-size:0; background:url(images/next.png) no-repeat 50% 50%;}


.img-box{ background:url(images/thumbbg.gif) no-repeat 50% 50%; text-align:center; padding:17px;}
.gap-small{ padding:20px 0 0;}

.linetxt-block { margin: 0 auto 8px; background: url(images/line1.gif) 0 3px repeat-x; display: block; line-height: 1.1em;text-align: center; clear: both; font:normal 14px/20px 'Lato', sans-serif; color:#666;}
.linetxt-block span{ background:#fff; padding:3px;}
.gray-text{ color:#666;}

.icon ul{ display:table; margin:10px auto 0;}
.icon ul li{ float:left; margin:0 5px;}
.gap-top{ padding-top:28px;}

footer{ background:#000; font:normal 14px/20px 'Lato', sans-serif; color:#fff; padding:15px 0;}
@media only screen and (max-width: 1198px) {
}
@media only screen and (max-width: 990px) {
.nav-menu li > a{ font-size:12px; padding:0 12px;}
.teft-content{ width:100%; float:none;}
.right-content{ width:100%; float:none;}
}
@media only screen and (max-width: 740px) {
#navigation{ position:relative; display:block;}
header{ padding:0 0 5px;}
#navbtn{ display:block; background:url(images/navigation.png) no-repeat 0 50%; height:30px; font-size:0; cursor:pointer; font-size:15px; text-align:right; color:#fff; text-transform:capitalize; line-height:30px;}
.nav-menu{ display:none;}
.nav-menu li{ float:none;}
.nav-menu li+li{ border-top:1px solid #ccc;}
.nav-menu li > a{ font:normal 16px/40px 'Lato', sans-serif; background:none;}
.nav-menu li .menuarrow{ position:absolute; right:2px; top:2px; width:36px; height:36px; z-index:99; background:url(images/nav-arrow.png) no-repeat 50% 50%; display:block; cursor:pointer; border-radius:3px;}
.nav-menu li:hover > .menuarrow, .nav-menu li.active > .menuarrow,.nav-menu li.current_page_item > .menuarrow{ background:none;}
.nav-menu .sub-menu{ position:relative; margin:0 3px;}
.nav-menu .sub-menu .sub-menu{ left:0; margin:0 5px;}
.nav-menu .sub-menu li{ float:none;}
.nav-menu li:hover > .sub-menu{ display:none;}
}
@media only screen and (min-width: 740px) {
.nav-menu{ display:block !important;}
}
@media only screen and (max-width: 450px) {

}