/* -------------------------------- 

Primary style

-------------------------------- */
*, *:after, *:before { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }


img { max-width: 100%; }


/* -------------------------------- 

Modules - reusable parts of our design

-------------------------------- */
.cd-container { /* this class is used to give a max-width to the element it is applied to, and center it horizontally when it reaches that max-width */ margin: 0 auto; }
.cd-container:after { content: ""; display: table; clear: both; }

.has-top-margin { /* this class is given - using jQuery - to the .cd-main-content following the .cd-secondary-nav when it becomes fixed */ }

@media only screen and (min-width: 1170px) {
    .has-top-margin { -webkit-animation: animate-margin-top 0.3s; -moz-animation: animate-margin-top 0.3s; animation: animate-margin-top 0.3s; margin-top: 70px; }
}

@-webkit-keyframes animate-margin-top {
    0% { margin-top: 100px; }

    100% { margin-top: 70px; }
}

@-moz-keyframes animate-margin-top {
    0% { margin-top: 100px; }

    100% { margin-top: 70px; }
}

@keyframes animate-margin-top {
    0% { margin-top: 100px; }

    100% { margin-top: 70px; }
}
/* -------------------------------- 

Navigation

-------------------------------- */
.cd-header { position: absolute; top: 0; left: 0; width: 100%; height: 50px; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2); background-color: #030d18; z-index: 3; }

@media only screen and (min-width: 768px) {
    .cd-header { height: 70px; background-color: transparent; box-shadow: none; }
}

#cd-logo { float: left; margin: 13px 0 0 5%; }
#cd-logo img { display: block; }

@media only screen and (min-width: 768px) {
    #cd-logo { margin: 23px 0 0 5%; }
}

@media only screen and (min-width: 1170px) {
    #cd-logo.is-hidden { /* assign a position fixed and move outside the viewport (on the left) */ opacity: 0; position: fixed; left: -20%; margin-left: 0; -webkit-transition: left 0.3s, opacity 0.3s; -moz-transition: left 0.3s, opacity 0.3s; transition: left 0.3s, opacity 0.3s; }
    #cd-logo.is-hidden.slide-in { /* slide in when the secondary navigation gets fixed */ left: 5%; opacity: 1; }
}

.cd-primary-nav { /* mobile first - navigation hidden by default, triggered by tap/click on navigation icon */ float: right; margin-right: 5%; width: 44px; height: 100%; background: url("../img/cd-icon-menu.html") no-repeat center center; background-size: 44px 44px; }
.cd-primary-nav ul { position: absolute; top: 0; left: 0; width: 100%; -webkit-transform: translateY(-100%); -moz-transform: translateY(-100%); -ms-transform: translateY(-100%); -o-transform: translateY(-100%); transform: translateY(-100%); }
.cd-primary-nav ul.is-visible { -webkit-transform: translateY(50px); -moz-transform: translateY(50px); -ms-transform: translateY(50px); -o-transform: translateY(50px); transform: translateY(50px); }
.cd-primary-nav a { display: block; height: 50px; line-height: 50px; padding-left: 5%; background: #000101; border-top: 1px solid #051426; color: #a5a5a5; }

@media only screen and (min-width: 768px) {
    .cd-primary-nav { /* reset navigation values */ width: auto; height: auto; background: none; }
    .cd-primary-nav ul { position: static; width: auto; -webkit-transform: translateY(0); -moz-transform: translateY(0); -ms-transform: translateY(0); -o-transform: translateY(0); transform: translateY(0); line-height: 70px; }
    .cd-primary-nav ul.is-visible { -webkit-transform: translateY(0); -moz-transform: translateY(0); -ms-transform: translateY(0); -o-transform: translateY(0); transform: translateY(0); }
    .cd-primary-nav li { display: inline-block; margin-left: 1em; }
    .cd-primary-nav a { display: inline-block; height: auto; line-height: normal; background: transparent; padding: .6em 1em; border-top: none; color: #030d18; }
}

/* -------------------------------- 

Intro

-------------------------------- */
#cd-intro { position: relative; background: url(../img/intro-background.html) no-repeat center center; background-size: cover; z-index: 2; }
#cd-intro #cd-intro-tagline { margin: 0 auto; text-align: center; }
#cd-intro h1 { font-size: 24px; font-size: 1.5rem; font-weight: 300; color: #030d18; text-shadow: 0 1px 3px rgba(0, 0, 0, 0.1); }

.cd-btn { display: inline-block; padding: 1em 1.8em; background-color: rgba(245, 72, 74, 0.9); margin-top: 1em; border-radius: 20em; -webkit-backface-visibility: hidden; backface-visibility: hidden; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; color: white; }
.no-touch .cd-btn:hover { background-color: #f5484a; }

@media only screen and (min-width: 768px) {
    .cd-btn.is-hidden { /* assign a position fixed and move outside the viewport (on the right) */ opacity: 0; position: fixed; right: -20%; top: 0; padding: .8em 1.2em; margin: 14px 0 0; -webkit-transition: right 0.3s, opacity 0.3s; -moz-transition: right 0.3s, opacity 0.3s; transition: right 0.3s, opacity 0.3s; }
    .cd-btn.is-hidden.slide-in { /* slide in when the secondary nav gets fixed */ right: 5%; opacity: 1; }
}

/* -------------------------------- 

Secondary Fixed Navigation

-------------------------------- */
.cd-secondary-nav { position: relative; z-index: 3; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
.cd-secondary-nav ul {
	 /* mobile first - secondary navigation hidden by default, triggered by tap/click on .cd-secondary-nav-trigger*/
}
.cd-secondary-nav ul li.mob {
}
.cd-secondary-nav ul.is-visible { 
background-color: #F0B504; }

.cd-secondary-nav ul.is-visible > li a { color: #fff; }

.cd-secondary-nav li a { display: block; padding: 1.6em 1.6em 1.29em 1.6em; border-bottom: 1px solid #092645; color: #a5a5a5; }
.cd-secondary-nav li:last-child a { border-bottom: none; }
.cd-secondary-nav ul li.mob { 
	display: none; 
}
.cd-secondary-nav nav ul {width:100%;text-align:center;}
.cd-secondary-nav nav ul li {display:inline-block;}
.cd-secondary-nav {background-color:#D9D9D9;-webkit-transition: height 0.3s; -moz-transition: height 0.3s; transition: height 0.3s; }
.cd-secondary-nav li a {border:none; text-align: center; display: block;}
.cd-secondary-nav li a b { font-family: "open sans"; padding: 0 0 5px; font-weight: normal !important; /*text-transform: uppercase;*/ font-size: 16px; font-weight: 700; color: #a5a5a5; border-bottom: 5px solid transparent; 
transition: border-color .5s ease-in-out;
-webkit-transition: border-color .5s ease-in-out;
-moz-transition: border-color .5s ease-in-out;
}
.cd-secondary-nav li a:hover { text-decoration: none; }
.cd-secondary-nav li a:hover b, .cd-secondary-nav li a.active b { color: #a5a5a5; border-bottom: 5px solid #5c8a3e; text-decoration: none; }
@media only screen and (min-width: 768px) {
	.cd-secondary-nav-trigger { display: none; }
    .cd-secondary-nav { z-index: 1; background-color: #D9D9D9; -webkit-transition: height 0.3s; -moz-transition: height 0.3s; transition: height 0.3s; }
    .cd-secondary-nav nav, .cd-secondary-nav ul, .cd-secondary-nav li, .cd-secondary-nav a { height: 100%; }
    .cd-secondary-nav ul { /* reset navigation values */ position: static; width: auto; max-width: 100%; visibility: visible; -webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); transform: scale(1); text-align: center; background-color: transparent; }
    .cd-secondary-nav li { display: inline-block; /*margin-left: -4px;*/ }
    .cd-secondary-nav li a { position: relative; text-align: center; display: block; /*padding: 58px 40px 0 40px;*/ border-bottom: none; -webkit-transition: padding 0.2s; -moz-transition: padding 0.2s; transition: padding 0.2s; }

    .cd-secondary-nav li a:hover { text-decoration: none; }

    .cd-secondary-nav li a span { position: absolute; display: inline-block; width: 40px; height: 40px; top: 18px; left: 50%; right: auto; -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -ms-transform: translateX(-50%); -o-transform: translateX(-50%); transform: translateX(-50%); background-repeat: no-repeat; /*background-image: url(../img/cd-nav-icons.svg);*/ -webkit-transition: opacity 0.2s; -moz-transition: opacity 0.2s; transition: opacity 0.2s; }
    .cd-secondary-nav li a:hover b, .cd-secondary-nav li a.active b { color: #a5a5a5; border-bottom: 5px solid #5c8a3e; text-decoration: none; }
    .cd-secondary-nav li:nth-child(1) a span { background-position: 0 0; }
    .cd-secondary-nav li:nth-child(2) a span { background-position: -40px 0; }
    .cd-secondary-nav li:nth-child(3) a span { background-position: -80px 0; }
    .cd-secondary-nav li:nth-child(4) a span { background-position: -120px 0; }
    .cd-secondary-nav li:nth-child(5) a span { background-position: -160px 0; }
    .cd-secondary-nav.is-fixed { /* on Firefox CSS transition/animation fails when parent element changes position attribute*/ /* so we defined to diffent classes: .is-fixed to change the position value and .is-animated to change childrens' attributes (padding and opacity)*/ position: fixed; left: 0; top: 0; height: 70px; width: 100%; }
    .cd-secondary-nav.animate-children { /* on Firefox CSS transition/animation fails when parent element changes position attribute*/ /* so we defined to diffent classes: .is-fixed to change the position value and .is-animated to change childrens' attributes (padding and opacity)*/ box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2); }
    .cd-secondary-nav.animate-children li a { padding: 26px 30px 0 30px; }
    .cd-secondary-nav.animate-children li a span { opacity: 0; }
}

.cd-secondary-nav-trigger { position: fixed; bottom: 20px; right: 5%; width: 44px; height: 44px; background: #D9D9D9; border-radius: 0.25em; /* image replacement */ overflow: hidden; text-indent: 100%; white-space: nowrap; z-index: 2; }
.cd-secondary-nav-trigger span { /* the span element is used to create the menu icon */ position: absolute; display: block; width: 4px; height: 4px; border-radius: 50%; background: #a5a5a5; 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%); -webkit-transition: background 0.3s; -moz-transition: background 0.3s; transition: background 0.3s; }
.cd-secondary-nav-trigger span::before, .cd-secondary-nav-trigger span::after { content: ''; position: absolute; background: inherit; width: 100%; height: 100%; border-radius: 50%; }
.cd-secondary-nav-trigger span::before { right: -10px; -webkit-transform: rotate(0); -moz-transform: rotate(0); -ms-transform: rotate(0); -o-transform: rotate(0); transform: rotate(0); }
.cd-secondary-nav-trigger span::after { left: -10px; -webkit-transform: rotate(0); -moz-transform: rotate(0); -ms-transform: rotate(0); -o-transform: rotate(0); transform: rotate(0); }
.cd-secondary-nav-trigger.menu-is-open { background: transparent; }
.cd-secondary-nav-trigger.menu-is-open span { background: rgba(240, 238, 225, 0); width: 20px; height: 2px; }
.cd-secondary-nav-trigger.menu-is-open span::before, .cd-secondary-nav-trigger.menu-is-open span::after { background: #a5a5a5; width: 100%; height: 100%; border-radius: 0; top: 0; left: 0; }
.cd-secondary-nav-trigger.menu-is-open span::before { -webkit-transform: rotate(135deg); -moz-transform: rotate(135deg); -ms-transform: rotate(135deg); -o-transform: rotate(135deg); transform: rotate(135deg); }
.cd-secondary-nav-trigger.menu-is-open span::after { -webkit-transform: rotate(225deg); -moz-transform: rotate(225deg); -ms-transform: rotate(225deg); -o-transform: rotate(225deg); transform: rotate(225deg); }

.cd-secondary-nav-trigger { display: none; }

/* -------------------------------- 

Placeholder Sections

-------------------------------- */
.cd-section { margin: 0 auto; }
.cd-section h2 { font-size: 20px; font-size: 1.25rem; margin-bottom: .6em; font-weight: 700; }
.cd-section p { line-height: 1.6; }

@media only screen and (min-width: 768px) {
    .cd-section { margin: 0 auto; }
    .cd-section h2 { font-size: 30px; font-size: 1.875rem; }
    .cd-section p { font-size: 20px; font-size: 1.25rem; }
}

@media only screen and (max-width: 767px) {
.cd-secondary-nav li a { color:#a77d00;text-align: left;border-bottom:1px solid #a77d00;padding:1.6em;}
.cd-secondary-nav li a b {font-weight: 700 !important; color: #a77d00;transition: none;
-webkit-transition:none;
-moz-transition:none;}
.cd-secondary-nav li a:hover b, .cd-secondary-nav li a.active b {  border-bottom: 0; color:#FFF;
transition: none;
-webkit-transition:none;
-moz-transition:none;}
.cd-secondary-nav li.mob a:hover b,.cd-secondary-nav li.mob a b{color:#FFF !important;}
.cd-secondary-nav li.mob a {border:none;}
.cd-secondary-nav li.visible a {border-bottom:1px solid #a77d00;}
.cd-secondary-nav nav {
	position:relative;
	min-height:65px;
}
.cd-secondary-nav nav ul{
	position:absolute;
	width:100%;
}
.cd-secondary-nav ul {
	background-color: #F0B504; 
}
.cd-secondary-nav ul li a {
	color:#a77d00;
}
.cd-secondary-nav ul li a:hover {
	color:#FFF;
}
.cd-secondary-nav ul li { 
	z-index: 2;
	text-align:left; 
}
.cd-secondary-nav ul li:not(.mob) { 
	display: none; 
}
.cd-secondary-nav ul li:not(.mob):hover a, ul li.selected:not(.mob) a{ 
color: #a77d00;
}
.cd-secondary-nav ul li:first-child{
	display:block;
}
.cd-secondary-nav li.mob { 
cursor: pointer; 
}
li.mob i {
    float: right;
	font-size:30px;
	color:#FFF;
	position: absolute;
    right: 14px;
    top: 16px;
    z-index: 99;
}
li.mob i.fa-chevron-up,li.visible i.fa-chevron-down{
	display:none;
}
li.visible i.fa-chevron-up{
	display:block;
}
.mpt30{
	padding-top:20px;
}
.mob a span {
	display:none;
}
}

@media only screen and (max-width: 1170px) {
	.cd-secondary-nav li a{padding:1.6em 1em 1.29em 1em;}
}