/*footer*/
footer { width: 100%; display: block; background: #4C5363; margin: 0px auto; clear: both; }
/*--- footer event ---*/
.footerWrap { width: 1100px; margin: 0px auto; overflow: hidden; }
.footer-link { margin: 30px auto auto auto; width: 100%; }
.footer-row { padding: 5px 0px; width: 100%; display: block; color: #fff!important; font-size:.8em; text-align: center; border-bottom: 1px solid rgba(60%,60%,60%,.2); border-top: 1px solid rgba(60%,60%,60%,.2); }
footer p.small { width: 100%; padding: 2px!important; display: inline-block; font-size: 12px; color: rgba(201,214,223,.6) !important; }
.right { float: right; }
/* common and top level styles */
#nav span { display: none; }
#nav, #nav ul { margin: 0 auto; padding: 0; width: 98%; list-style: none outside none; }
#nav li { margin: auto; padding:2px 5px; width:auto; display: inline-block; font-size:.9em; font-weight: 300; line-height: 1.5em; vertical-align: top; text-align: left; color: #FFF; }
#nav li:last-child { padding-right: 0px !important; }
#nav li a { text-decoration: none; color: rgba(82,97,107,1); }
#nav > li > a { color: #fff; font-weight: 400; }
#nav > li:hover > a, #nav > a:hover { color:rgba(255,51,0,1); }
#nav li.active > a { color: rgba(204,0,0,.5); font-weight: bold; }

#nav li strong{display: inline-block; padding-right:4px;  }
/*add*/
#nav li.active { width: 40%; margin-left: 10%; padding-right: 0px !important; border-left: solid 1px rgba(201,214,223,.4); }
/*go to top*/
.cd-top { display: inline-block; position: fixed; z-index: 9999; bottom: 40px; right: 10px; height: 40px; width: 40px; overflow: hidden; text-indent: 100%; white-space: nowrap; background: #BB0000 url(../images/arrow-up-b.png) no-repeat center 50%; visibility: hidden; background-size: 70%; opacity: 0; box-shadow: 0 0 10px rgba(0, 0, 0, 0.05); -moz-border-radius: 50%; -webkit-border-radius: 50%; border-radius: 50%; -webkit-transition: opacity .3s 0s, visibility 0s .3s; -moz-transition: opacity .3s 0s, visibility 0s .3s; transition: opacity .3s 0s, visibility 0s .3s; }
.cd-top.cd-is-visible, .cd-top.cd-fade-out, .no-touch .cd-top:hover { -webkit-transition: opacity .3s 0s, visibility 0s 0s; -moz-transition: opacity .3s 0s, visibility 0s 0s; transition: opacity .3s 0s, visibility 0s 0s; }
.cd-top.cd-is-visible { visibility: visible; opacity: 1; }
.cd-top.cd-fade-out { opacity: .8; }
.no-touch .cd-top:hover { background-color: #e86256; opacity: 1; }
@media only screen and (min-width: 768px) {
.cd-top { right: 20px; bottom: 20px; }
}
@media only screen and (max-width: 1024px) {
footer { width: 100%; }
.footerWrap { width: 98%; margin: 0px 1%; }
.footer-link { width: 100%; margin: 0px auto; }
#nav { margin: 2% auto; width: 100%; }
#nav ul.subs { display: inline-block; padding: 2%; width: 96%; margin-top: 2%; color: #333333; }
#nav li { display: inline-block; width: 20%; }
/*add*/
#nav li.active { width: 35%; margin-left: 2%; padding-right: 0px !important; border-left: solid 1px rgba(201,214,223,.4); }
/* submenu */
#nav li:hover ul.subs { display: block; }
#nav ul.subs > li { display: inline-block; float: none; padding: 5px 0px; vertical-align: top; width: 96%; border: none; }
#nav ul.subs > li a { color: rgba(201,214,223,.6); }
#nav ul li a:hover { color: #fff; }
#nav ul.subs > li > a { font-size: .7em; margin-bottom: 5px; }
.small { font-size: .9em !important; padding: 0.5em 1em; }
}
 @media all and (max-width : 980px) {
/*footer*/
#nav > li { float: none; padding: 1% 0px; border-bottom: 0; margin-bottom: 0; width: 100%; border-bottom: solid 1px rgba(255,255,255,.3); }
#nav li:first-of-type { width: 100%; padding-left: 2%; border-bottom: solid 1px rgba(255,255,255,.3); }
#nav ul.subs { position: relative; top: 0; display: none; }
#nav li:hover ul.subs { display: block; width: 100%; height: auto; }
#nav li #s1:target + ul.subs, #nav li #s2:target + ul.subs, #nav li #s3:target + ul.subs, #nav li #s4:target + ul.subs { display: table; width: 100%; }
#nav ul.subs > li { display: block; width: auto; }
#nav li:nth-child(2) { width: 100%!important; }
#nav li.active { margin-left: 0; border-left: none; }
.footer-row { border-top: none; }
}
 @media only screen and (max-width: 768px) {
/*footer*/
#nav > li { float: none; border-bottom: 0; margin-bottom: 0; width: 100%; border-bottom: solid 1px rgba(255,255,255,.3); }
#nav li:first-of-type { width: 100% !important; padding-left: 2%; border-bottom: solid 1px rgba(255,255,255,.3); }
#nav li:nth-last-of-type(2), #nav li:nth-last-of-type(3) { width: 100% !important; padding-left: 2%; border-bottom: solid 1px rgba(255,255,255,.3); }
#nav li:last-of-type { width: 100%; padding-left: 2%; }
#nav ul.subs { position: relative; top: 0; display: none; }
#nav li:hover ul.subs { display: block; width: 100%; height: auto; }
#nav li #s1:target + ul.subs, #nav li #s2:target + ul.subs, #nav li #s3:target + ul.subs, #nav li #s4:target + ul.subs { display: table; width: 100%; }
#nav ul.subs > li { display: block; width: auto; }
#nav li.active { width: 100%; margin-left: 0px !important; }
#nav ul.subs.wrap-half > li  { display: block;  width:96%!important;  }

}
