.carbon-poweredby{ font-style: italic }
.c-button, .c-menu__close { -moz-appearance: none; appearance: none; border-radius: none; -webkit-appearance: none; font-size: 14px; box-shadow: none }
.c-button:focus, .c-menu__close:focus { outline: 0 }
#carbonads, .c-mask, .c-menu { position: fixed }
.o-wrapper { transition: transform .3s }
.c-menu, .o-wrapper { -webkit-transition: -webkit-transform .3s }
.o-container { margin: 0 auto; padding: 0 12px; max-width: 960px }
@media all and (min-width:480px) {
.o-container { padding: 0 24px }
}
@media all and (min-width:720px) {
.o-container { padding: 0 48px }
}
.o-header { margin: 0; padding: 0 }
.o-header-nav { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; background-color: #67b5d1 }
.o-header-nav__link { padding: 12px; color: #fff }
.o-header-nav__link:hover { color: #fff; background-color: #3184a1 }
.o-header__title { margin: 24px; padding: 0; color: #818181; font-size: 28px; font-weight: 300; text-align: center }
@media all and (min-width:480px) {
.o-header__title { margin: 36px; font-size: 42px }
}
.o-sub-nav { margin: 0 0 24px; padding: 0 }
.o-sub-nav__items { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-flow: row wrap; -ms-flex-flow: row wrap; flex-flow: row wrap; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; list-style: none; margin: 0; padding: 0 }
.o-sub-nav__item { margin: 0; padding: 4px }
.o-sub-nav__link { display: block; margin: 0; padding: 4px 24px; border: 2px solid #67b5d1 }
.o-sub-nav__item.active .o-sub-nav__link, .o-sub-nav__link:hover { color: #fff; background-color: #67b5d1 }
.o-footer { padding: 12px 0; text-align: center }
@media all and (min-width:480px) {
.o-footer { padding: 24px 0 }
}
@media all and (min-width:720px) {
.o-sub-nav { margin: 0 0 48px }
.o-footer { padding: 48px 0 }
}
.c-menu { z-index: 200; background-color: #00adef; transition: transform .3s }
.c-menu__items { list-style: none; margin: 0; padding: 0 }
.c-menu--push-left, .c-menu--push-right, .c-menu--slide-left, .c-menu--slide-right { width: 100%; height: 100vh; overflow-y: scroll }
@media all and (min-width:320px) {
.c-menu--push-left, .c-menu--push-right, .c-menu--slide-left, .c-menu--slide-right { width: 100% }
}
.c-menu--push-left .c-menu__item, .c-menu--push-right .c-menu__item, .c-menu--slide-left .c-menu__item, .c-menu--slide-right .c-menu__item { display: block; text-align: center; border-top: solid 1px #b5dbe9; border-bottom: solid 1px #3184a1 }
.c-menu--push-left .c-menu__item:first-child, .c-menu--push-right .c-menu__item:first-child, .c-menu--slide-left .c-menu__item:first-child, .c-menu--slide-right .c-menu__item:first-child { border-top: none }
.c-menu--push-left .c-menu__item:last-child, .c-menu--push-right .c-menu__item:last-child, .c-menu--slide-left .c-menu__item:last-child, .c-menu--slide-right .c-menu__item:last-child { border-bottom: none }
.c-menu--push-left .c-menu__link, .c-menu--push-right .c-menu__link, .c-menu--slide-left .c-menu__link, .c-menu--slide-right .c-menu__link { display: block; padding: 12px 24px; color: #fff }
.c-menu--push-left .c-menu__close, .c-menu--push-right .c-menu__close, .c-menu--slide-left .c-menu__close, .c-menu--slide-right .c-menu__close { display: block; padding: 15px 24px; width: 100% }
.c-menu--push-left, .c-menu--slide-left { top: 0; left: 0; -webkit-transform: translateX(-100%); -ms-transform: translateX(-100%); transform: translateX(-100%) }
@media all and (min-width:320px) {
.c-menu--push-left, .c-menu--slide-left { -webkit-transform: translateX(-100%); -ms-transform: translateX(-100%); transform: translateX(-100%) }
}
.c-menu--push-left.is-active, .c-menu--slide-left.is-active { -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0) }
.c-menu--push-right, .c-menu--slide-right { top: 0; right: 0; -webkit-transform: translateX(100%); -ms-transform: translateX(100%); transform: translateX(100%) }
@media all and (min-width:320px) {
.c-menu--push-right, .c-menu--slide-right { -webkit-transform: translateX(100%); -ms-transform: translateX(100%); transform: translateX(100%) }
}
.c-menu--push-right.is-active, .c-menu--slide-right.is-active { -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0) }
.c-menu--push-bottom, .c-menu--push-top, .c-menu--slide-bottom, .c-menu--slide-top { vertical-align: middle; width: 100%; height: 60px; text-align: center; overflow-x: scroll }
.c-mask, body.has-active-menu { overflow: hidden }
.c-menu--push-bottom .c-menu__items, .c-menu--push-top .c-menu__items, .c-menu--slide-bottom .c-menu__items, .c-menu--slide-top .c-menu__items { display: inline-block; text-align: center }
.c-menu--push-bottom .c-menu__item, .c-menu--push-top .c-menu__item, .c-menu--slide-bottom .c-menu__item, .c-menu--slide-top .c-menu__item { display: inline-block; line-height: 60px }
.c-menu--push-bottom .c-menu__link, .c-menu--push-top .c-menu__link, .c-menu--slide-bottom .c-menu__link, .c-menu--slide-top .c-menu__link { display: block; padding: 0 4px; color: #fff }
.c-menu--push-bottom .c-menu__close, .c-menu--push-top .c-menu__close, .c-menu--slide-bottom .c-menu__close, .c-menu--slide-top .c-menu__close { display: inline-block; margin-right: 12px; padding: 0 24px; height: 60px; line-height: 60px }
.c-menu--push-top, .c-menu--slide-top { top: 0; left: 0; -webkit-transform: translateY(-60px); -ms-transform: translateY(-60px); transform: translateY(-60px) }
.c-menu--push-top.is-active, .c-menu--slide-top.is-active { -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0) }
.c-menu--push-bottom, .c-menu--slide-bottom { bottom: 0; left: 0; -webkit-transform: translateY(60px); -ms-transform: translateY(60px); transform: translateY(60px) }
.c-menu--push-bottom.is-active, .c-menu--slide-bottom.is-active { -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0) }
.o-wrapper.has-push-left { -webkit-transform: translateX(100%); -ms-transform: translateX(100%); transform: translateX(100%) }
@media all and (min-width:320px) {
.o-wrapper.has-push-left { -webkit-transform: translateX(300px); -ms-transform: translateX(300px); transform: translateX(300px) }
}
.o-wrapper.has-push-right { -webkit-transform: translateX(-100%); -ms-transform: translateX(-100%); transform: translateX(-100%) }
@media all and (min-width:320px) {
.o-wrapper.has-push-right { -webkit-transform: translateX(-300px); -ms-transform: translateX(-300px); transform: translateX(-300px) }
}
.o-wrapper.has-push-top { -webkit-transform: translateY(60px); -ms-transform: translateY(60px); transform: translateY(60px) }
.o-wrapper.has-push-bottom { -webkit-transform: translateY(-60px); -ms-transform: translateY(-60px); transform: translateY(-60px) }
.c-menu__close { color: #fff; background-color: #212121 !important; border: none; cursor: pointer }
.c-mask { top: 0; left: 0; width: 0; height: 0; background-color: #000; opacity: 0; -webkit-transition: opacity .3s, width 0s .3s, height 0s .3s; transition: opacity .3s, width 0s .3s, height 0s .3s ; z-index:999;}
.c-mask.is-active { width: 100%; height: 100%; opacity: .7; -webkit-transition: opacity .3s; transition: opacity .3s }
.c-buttons { margin-bottom: 48px; text-align: center }
.c-button { display: inline-block;z-index: 99; border:none; background:url(../images/menu-icon.png) no-repeat center center #00adef; color: #fff; position:absolute; width:32px; height:32px; padding:0; margin:0; -webkit-transform:translateY(-50%); transform:translateY(-50%); right:20px; top:50%; cursor: pointer; transition: all .3s ease-in-out; -webkit-transition: all .3s ease-in-out; -webkit-border-radius: 2px; border-radius: 2px; }
.has-active-menu .c-button{ z-index:9;}
.c-button img{ width:100%;}
.carbon-img, .carbon-wrap { display: block; margin: 0 0 4px; }
.c-button:disabled { opacity: 0; }
#carbonads { bottom: 12px; right: 12px; z-index: 1000; padding: 24px 12px 12px; width: 154px; background-color: #fff; line-height: 1.1; border: 1px solid #e7e7e7 }
.carbon-img { padding: 0; width: 130px; height: 100px }
.carbon-text { color: #818181; font-size: 12px }
.carbon-poweredby { font-size: 10px }
.carbonad__close { display: block; position: absolute; top: 0; left: 12px; height: 24px; font-size: 11px; line-height: 24px }
@media all and (max-width:660px) {
#carbonads { display: none }
}