body{background-color: #233b53;}
*{font-family: 'Oswald', sans-serif; letter-spacing: .16em;}
nav{position: absolute; top: 0; left: 0; right: 0; z-index: 2;}
section{border-bottom: 1px solid #4c6170; padding-top: 200px; position: relative;}
h2{max-width: 600px; color: #fff; margin: 0 auto; font-family: "Times New Roman", serif !important; padding-bottom: 1.5em; font-size: 3em; letter-spacing: 0; font-weight: 300;}
h3{text-transform: uppercase; font-weight: 700; color: #fff;}
article{max-width: 600px; color: #b0b0b0; margin: 0 auto; line-height: 1.8em; font-weight: 300; font-size: 1.3em;}
strong{font-weight: 400; color: #fff;}
p{padding-bottom: 1.5em;}
a{color: #fff;}
.more ul{padding-left: 1.2em;}
.more li{padding-bottom: .75em;}
iframe{max-width: 100%;}

.logo-head{max-width: 80%;}

#main{text-align: center; background: url(/csr/images/bg-main.jpg) no-repeat center top; min-height: 581px; padding-top: 0;}
#main blockquote{font-weight: 300; letter-spacing: .16em; color: #fff; text-align: left; font-size: 1.6em; line-height: 1.8em;}
#main blockquote.first-quote{background: url(/csr/images/quote-left.png) no-repeat left top; width: 330px; min-height: 233px; float: left; display: block; margin-top: 111px; padding-top: 111px;}
#main blockquote.second-quote{background: url(/csr/images/quote-right.png) no-repeat right bottom; width: 330px; min-height: 233px; float: right; display: block; margin-top: 111px; padding-top: 60px;}
.wrapper{max-width: 1280px; margin: 0 auto; padding: 1em 1em 3em;}

.menu-button{float: right; cursor: pointer; z-index: 10;}
.menu-container, .download-modal{display: none; position: fixed; top: 0; bottom: 0; left: 0; right: 0; background: rgba(0,0,0,.8); z-index: 5; list-style: none;}
.menu-container a{padding: .70em 0; font-size: 2em; display: block; text-transform: uppercase; max-width: 800px; margin: 0 auto; border-bottom: 1px solid #2f5881; color: #fff; text-align: center; font-family: 'Oswald', sans-serif;}

.download-button{background: #2f5881; position: fixed; right: 0; top: 50%; width: 115px; padding: 1.5em; box-sizing: border-box; border-radius: 8px 0 0 8px; color: #a9bacb; font-size: 1em; font-family: 'Oswald', sans-serif; text-decoration: underline; text-align: center; cursor: pointer;}
#mc_embed_signup{max-width: 35em; margin: 120px auto 0; border-radius: 8px;}
#mc_embed_signup h2{color: #233b53; font-family: 'Oswald', sans-serif !important;}
.download-close, .menu-close{text-align: right; padding: 1em; font-weight: 700; cursor: pointer; display: block;}

.menu-close{font-size: 1.5em; color: #fff; font-family: 'Oswald', sans-serif;}

.more{display: none;}
#main .more{text-align: left; margin-top: 1em;}
.more a, .footer a{text-decoration: underline;}

.expand-button{display: block; margin-left: -150px; text-transform: uppercase; color: #fff; background: #4c6170; padding: 1em; border-radius: 8px 8px 0 0; width: 300px; text-align: center; cursor: pointer; position: absolute; bottom: 0; left: 50%; box-sizing: border-box;}
.expand-button span{font-size: .8em; display: block;}
.first-button:before, .first-button:after{content: url(/csr/images/arrow-down.png); margin: 0.5em;}
.more-button:before, .more-button:after{content: url(/csr/images/arrow-up.png); margin: 0.5em;}
.expand-button span.more-button{display: none;}

#section-1{background: url(/csr/images/bg1.jpg) no-repeat center top;}
#section-2{background: url(/csr/images/bg2.jpg) no-repeat center top;}
#section-3{background: url(/csr/images/bg3.jpg) no-repeat center top;}
#video{padding-top: 1em;}

.footer .sidebar{width: 33%; float: left; padding: 1em; box-sizing: border-box; font-weight: 300; font-size: .8em;}
.footer ul{list-style: none;}
.row{padding: 1em; text-align: center; color: #fff;}
.row:after{display: block; content: ''; clear: both;}

@media only screen and (max-width:970px) {
  #main blockquote.first-quote, #main blockquote.second-quote{float: none; width: 80%; margin: 0 auto; min-height: 158; padding: 1em; box-sizing: border-box;}
  #main blockquote.first-quote{background-position: center left; margin-top: 112px;}
  #main blockquote.second-quote{background-position: center right;}
  h2{font-size: 2em;}
  .footer .sidebar{width: 100%; float: none;}
}

@media only screen and (max-width:600px) {
  .menu-container a{font-size: 1em;}
}
