/*****************************
UNIVERSAL STYLES
*****************************/
* {
    margin: 0;
    padding: 0;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    font-family: 'Arial', sans-serif;
}

/*****************************
lAYOUT STYLES
*****************************/
.nav-containers {
    float: left;
    width: 33.33%;
    height: 75px;
    background-color: rgb(120, 131, 165);
}
.main-containers {
    width: 100%;
}
.top-section {
    clear: both;
    height: 400px;
    background-color: rgb(120, 131, 165);
    padding: 6% 10% !important;
}
.why-section {
    height: 400px;
    padding: 6% 10% !important;
}
.visit-section {
    height: 600px;
    background-color: lightgray
}
.volunteer-section {
    clear: both;
    height: 400px;
    padding: 6% 10% !important;
}
footer {
    height: 250px;
    background-color: rgb(26, 35, 44);
    overflow: hidden;
}
/* Styles for visit article elements within .visit-section */
.visit-us-container, .visit-you-container {
    float: left;
    width: 50%;
    height: 100%;
}
/* Footer layout styles */
.footer-container {
    float: left;
    height: 180px;
    padding-top: 30px;
}
.footer-links, .footer-address {
    width: 20%;
}
.blank-space {
    width: 60%;
}
.footer-top {
    margin-bottom: 190px;
}
.footer-bottom {
    clear: both;
    border-top: 1px solid white;
}

/*****************************
DISPLAY STYLES
*****************************/
.nav-options {
    padding: 23px 0 0 5%;
}
.donate-button {
    padding-right: 5%;
}
.main-containers {
    padding: 0 5%;
}
/* Shared styles for nav and header */
.nav-option, h3 {
    color: white;
    text-transform: uppercase;
    font-family: "Roboto Condensed", sans-serif;
}
/* Specific av option stypes */
.nav-option {
    font-size: 1.2rem;
    padding-right: 3%;
}
/* Top h3 styles for logo */
h3 {
    font-size: 2.3rem;
    text-align: center;
    font-style: italic;
    padding-top: 14px;
}
/* Donate button styles */
.donate-btn {
    float: right;
    margin-top: 16px;
    width: 110px;
    height: 35px;
    font-family: "Roboto Condensed", sans-serif;
    font-size: 1.2rem;
    color: rgb(120, 131, 165);
    border-radius: 10px;
    border: none;
}
/* Top section styles */
h1, p {
    text-align: center;
    color: white;
    font-family: "Roboto Condensed", sans-serif;
}
h1 {
    font-size:4.0rem;
}
p {
    font-size: 1.4rem;
    padding-top: 3%;
}
a {
    text-decoration: none;
    color: rgb(210, 210, 210);
}
a:hover {
    color: white;
}
/* Why section styles */
h2, .why-paragraph {
    text-align: center;
    font-family: "Roboto Condensed", sans-serif;
    color: black;
}
h2 {
    font-size: 2.7rem;
    padding-left: 10%;
    padding-right: 10%;
}
/* Visit section styles */
.visit-header, .visit-paragraph {
    color: rgb(26, 35, 44);
    text-align: center;
}
.blue-square {
    width: 300px;
    height: 200px;
    background-color: rgb(120, 131, 165);
    margin: 85px auto 30px auto;
}
.visit-header {
    font-size: 1.7rem;
}
.visit-paragraph {
    font-size: 1.2rem;
    padding: 20px 8% 0 8%;
}
.cta-btn {
    width: 150px;
    height: 40px;
    font-family: "Roboto Condensed", sans-serif;
    font-weight: 500;
    border: 1px solid darkgray;
    display: block;
    margin: 20px auto;
}
.cta-btn:hover {
    background-color: rgb(233, 233, 233);
}
.volunteer-btn {
    margin-top: 40px;
}
/* Footer display styles */
.footer-text {
    color: white;
    font-family: "Roboto Condensed", sans-serif;
    text-align: left;
    font-size: 1.0rem;
    padding: 20px 0 0 0;
}
.footer-bold, .footer-normal, .footer-email {
    font-size: 1.0rem;
    color: white;
    text-align: left;
    padding: 0;
    font-style: normal;
}
.footer-bold {
    padding-top: 10px;
}
.footer-normal {
    font-weight: 300;
    font-style: normal;
}
.social-squares {
    width: 30px;
    height: 30px;
    background-color: white;
    margin: 10px 15px 10px 0;
}
.footer-header, .footer-span {
    color: white;
    font-family: "Roboto Condensed", sans-serif;
}
.footer-header {
    color: gray;
}
.footer-span {
    margin-right: 15px;
}
.site-map {
    margin-bottom: 10px;
}