body { font-family: 'Roboto', Helvetica, Arial, sans-serif; }
.row { max-width: 1600px; margin: auto; }
.header { padding: 3em 1% 2em 1%; }
.header #logo { width: 496px; height: 55px; background: url(images/andreas-hope-logo2.png) top left no-repeat; background-size: 100% auto; float: left; }
.header h1 { display: none; }
ul#nav { float: right; font-family: 'Open Sans Condensed', sans-serif; font-weight: bold; margin-top: 10px; padding-left: 0; }
ul#nav li { display: inline-block; text-transform: uppercase; font-size: 15px; padding-left: 26px; }
ul#nav li a { color: #009ca3; /*#30c0c7;*/  }
ul#nav li a:hover { color: #1c8489; text-decoration: none; }

#homepage { background: url(images/homepage2.jpg) top right no-repeat; border-top: 6px solid #80babe; border-bottom: 1px solid #edecb4;  color: #1b8488; }
#homepage .row { padding: 3% 0 2% 5%; }
h2 { margin-top: 0; padding-top: 0;  text-transform: uppercase; font-size: 1.5em; color: #1b8488; }
#homepage p { font-size: 1.4em; line-height: 1.8em; }
.threeboxes { padding: 3% 0; }
.footer { text-align: center; padding-bottom: 2em; }

.main { margin-bottom: 1em; padding: 1% 3% 3% 5%; border-top: 6px solid #80babe; border-bottom: 6px solid #80babe; color: #333; font-size: 1.3em; line-height: 1.7em; }
.main .panel { font-size: 1em; }

.ah-button, ul#nav li a.ah-button { font-family: 'Open Sans Condensed', sans-serif; font-weight: bold; text-transform: uppercase; background-color: #1c8489; border-radius: 2px; color: #edecb4; padding: 2px 10px; }
.ah-button:hover, ul#nav li a.ah-button:hover { background-color: #30c0c7; color: #fff; }

#donatebutton { font-size: 1.5em; padding: .6em; width: 80%; margin: auto; }
.side #donatebutton { font-size: .80em; }

iframe { height: 30px; }

.sh { font-size: .75em; }

.fa-facebook-square { font-size: 3em; color: #1c8489; }
ul#nav .fa-facebook-square { font-size: 1.7em; }


.panel { border-radius: 0; background-color: #92c4c7; position: relative; color: #fff; font-size: 1.3em; min-height: 417px; }
.panel-heading { background-color: #80babe; }
.panel-body { padding: 2em 1.2em; }
h3.panel-title { text-transform: uppercase; font-family: 'Open Sans Condensed'; font-weight: bold; font-size: 1.1em; text-align: center; }
.panel-body label { font-size: .85em; }

/*.panel img { width: 100%; position: absolute; height: auto; bottom: 25%; border-radius: 0; }*/
.panel a img { opacity: .85; filter: alpha(opacity=85); }
.panel a:hover img { opacity: 1; filter: alpha(opacity=100); }

label.large { font-size: 1.8em; line-height: 2em; }
.req { color: #f00; }
p.specialMessage { font-weight: bold; color: #f00; padding: 6px; border: 1px dashed #eee; }

h2.partone { padding-top: 6em; padding-bottom: 1em; }

.img-check { opacity: .5; color: #996; }
.check { /*opacity:0.5; color:#996;*/ opacity: 1; }


/* create 5 columns */
.col-xs-5ths,
.col-sm-5ths,
.col-md-5ths,
.col-lg-5ths {
    position: relative;
    min-height: 1px;
    padding-right: 15px;
    padding-left: 15px;
}

.col-xs-5ths {
    width: 20%;
    float: left;
}

@media (min-width: 768px) {
    .col-sm-5ths {
        width: 20%;
        float: left;
    }
}

@media (min-width: 992px) {
    .col-md-5ths {
        width: 20%;
        float: left;
    }
}

@media (min-width: 1200px) {
    .col-lg-5ths {
        width: 20%;
        float: left;
    }
}



@media (min-width:1901px) {
   #homepage { background-size: 100% 100%; }
}
@media (max-width:1699px) {
   #homepage { padding-right: 10%; background-size: auto 100%; }
}
@media (max-width:1599px) {
   #homepage p { font-size: 1.3em; line-height: 1.6em; }
}
@media (max-width:1299px) {
   #donatebutton { font-size: 1em; padding: .6em; width: 90%; margin: auto; }
   label.large { line-height: 1.2em; }
   h2.partone { padding-top: 1em; padding-bottom: 1em; }
}
@media (max-width:1199px) {
   .header #logo { width: 80%; height: 80px; float: none; background-size: 100%; margin: auto; }
   ul#nav { float: none; text-align: center; }
   #homepage { background-position: top left; }
   .panel-body { font-size: .90em; }
}
@media (max-width:999px) {
   /*.header { padding: 3em 1% 2em 1%; }*/
   audio { margin-top: 2em; }
   .panel { min-height: 0; }
   .panel img { position: relative; }
}
@media (max-width:899px) {
   ul#nav { padding-left: 0; }
   ul#nav li { display: block; font-size: 22px; padding-left: 0; border-top: 1px solid #eee;  }
   ul#nav li a { display: block; width: 100%; background-color: #c2d9db; padding: .4em; }
   ul#nav li a:hover { background-color: #1c8489; color: #fff; }
   ul#nav li a.ah-button { background-color: #c2d9db; border-radius: 0; color: #009ca3; padding: .4em; }
   .ah-button:hover, ul#nav li a.ah-button:hover { background-color: #1c8489; color: #fff; }
}
@media (max-width:699px) {
   #siteseal { display:none; }
}
@media (max-width:599px) {
   .header #logo { width: 99%; height: 55px; }
}