html {
    background-color: #AAAAAA;
}

.content-width {
    max-width: 1200px;
    margin: auto;
}

.page-wrapper {
    background-color: white;
}
   
.navbar li.active{
    color: white;
}

hr {
    background-color: white;
    color: white;
}

.image-strip img{
    height:150px;
}

/*Theme*/
.theme-header-background {
    background-image: url('Images/Landing/Copper_Roof.jpg');
    background-repeat: no-repeat;
    background-size: 100% 100%;
    height: 300px;
}

.theme-text-primary {
    color: black;
}

.theme-text-secondary, .theme-btn-secondary {
    color: white;
}

.theme-text-tertiary {
    color: black;
}

.theme-btn-secondary {
    background-color: #4c5d78;
}

.theme-background-primary {
    background-color:rgba(21,25,29,.85) ;
}

.theme-header-row, .theme-row, .theme-img-top-bar-label{
    background-color: rgba(62,53,53,0.67);
}

.theme-row {
    position: relative;
    margin: 0 0 -33px 0;
    float: right;
}

.theme-row-primary, .theme-row-primary-rounded {
    background-color: #5D89D9;
    width: inherit;
    margin: auto;
}

.theme-row-primary-rounded {
    border-radius: 6px;
    padding: 5px;
}

.theme-row-accent, .theme-row-secondary {
    background-color: #343a40;
    color: white;
}

.theme-row-secondary {
    width: inherit;
    margin: auto;
}


.theme-img-top-bar-label {
    position: relative;
    margin: 0 0 -32px 0;
    width: auto;
}

/*Nav Icon*/
.navIcon {
    background-color: #5D89D9;
    min-width: 100%;
    padding: 0px;
    margin: 0px;
    height: 100%;
}


/*Footer*/
.footer {
    background-color: #313136;
    color: white;
}

.footer-background {
    background-image: url('Images/Landing/Black_Roof.jpg');
    background-repeat: no-repeat;
    background-size: cover;
    background-position-y: -0px;
}

.carousel {
    overflow: hidden;
    height:220px;
}

/*Content*/
.social-media {
    max-height: 40px;
    max-width: 40px;
}

.vertical-logo {
    height: 40px;
    margin-top: -15px;
}

/*Social Media FA Icons*/
.fa {
    padding: 10px;
    font-size: 10px;
    width: 30px;
    text-align: center;
    text-decoration: none;
    border-radius: 80%;
}


/* Facebook */
.fa-facebook {
    background: #3B5998;
    color: white;
}


/* Twitter */
.fa-twitter {
    background: #55ACEE;
    color: white;
}


/* Twitter */
.fa-pinterest {
    background: #c8232c;
    color: white;
}

.fa-large {
    font-size: 20px;
}

a:hover {
    text-decoration: none;
}

.line-div {
    margin-bottom: 20px;
    margin-top: 20px;
    border-top-width: 1px;
    border-top-color: #000000;
    border-top-style: solid;
}

.request-box {
    margin: 0 auto;
    margin-top: 20px;
    height: 90px;
    border-color: #44687d;
    background-color: #44687d;
    border-style: solid;
    border-width: 1px;
    width: 300px;
}

.request-img {
    margin-top: 25px;
}

.request-text {
    color: #FFFFFF;
    font-size: 20px;
}

.form-submit .group {
    min-width: 310px;
    margin-bottom: 10px;
    display: inline-block;
}
.form-submit .group div div.radio-selections {
    display: inline-block;
    text-align: center;
}

.radio-selections input[type='radio'] {
    display: block;
}

.radio-selections label {
    background-size: contain;
    width: 150px;
    background-position-y: 20px;
    background-repeat: no-repeat;
}

.radio-selections.building-styles label {
    height: 170px;
}

.form-submit .group .gable-selection {
    display: none;
}

.form-submit .group .slope-selection {
    display: none;
}

.building-pitches label {
    background-size: contain;
    width: 150px;
    height: 50px;
}

.building-pitches label {
    background-size: contain;
    width: 150px;
    height: 50px;
}

.building-pitches label.pitch_0_12 {
    background-image: url("../Content/Images/pitch_0_12.png");
}

.building-pitches label.pitch_1_12 {
    background-image: url("../Content/Images/pitch_1_12.png");
}

.building-pitches label.pitch_2_12 {
    background-image: url("../Content/Images/pitch_2_12.png");
}

.building-pitches label.pitch_3_12 {
    background-image: url("../Content/Images/pitch_3_12.png");
}

.building-pitches label.pitch_4_12 {
    background-image: url("../Content/Images/pitch_4_12.png");
}

.building-pitches label.pitch_5_12 {
    background-image: url("../Content/Images/pitch_5_12.png");
}


/* color Sections */
.polar-white {
    background-color: #EAEBE2;
}

.high-gloss-white {
    background-color: #F3F3F4;
}

.gallery-blue {
    background-color: #1E4B6D;
}

.rustic-red {
    background-color: #8d3e2f;
}

.ivy-green {
    background-color: #004736;
}

.fern-green {
    background-color: #223c2f;
}

.hawaiian-blue {
    background-color: #44748e;
}

.light-stone {
    background-color: #daccac;
}

.burnished-slate {
    background-color: #594d45;
}

.saddle-tan {
    background-color: #c5b39a;
}

.silhouette-gray {
    background-color: #aaa8a3;
}

.evergreen {
    background-color: #153527;
}

.koko-brown {
    background-color: #5a4136;
}

.crimson-red {
    background-color: #ba2f2d;
}

.sunset-orange {
    background-color: #ee6326;
}

.marine-green {
    background-color: #50ab9e;
}

.safety-yellow {
    background-color: #fff000;
}

.teal {
    background-color: #11a6ab;
}

.tangerine {
    background-color: #eb4c36;
}

.dark-teal {
    background-color: #208083;
}

.maroon {
    background-color: #922631;
}

.patriot-red {
    background-color: #ba131b;
}

.colony-green {
    background-color: #788981;
}

.wasabi-green {
    background-color: #9db86e;
}

/* small size for header image only -- NOT A BOOSTRAP SIZE */
@media (min-width: 420px) {

    .footer-background {
        background-position-y: 0px;
    }
}


/* Small devices (landscape phones, 576px and up)*/
@media (min-width: 576px) {
    .vait-link {
        position: relative;
        margin: 10px;
    }

    .footer-background {
        background-position-y: -30px;
    }
}

/* Medium devices (tablets, 768px and up)*/
@media (min-width: 768px) {
    .vait-link {
        position: relative;
        top: -60px;
    }

    .footer-background {
        background-position-y: -70px;
    }
}

/* Large devices (desktops, 992px and up)*/
@media (min-width: 992px) {
    .vait-link {
        position: relative;
        top: -19px;
    }

    .footer-background {
        background-position-y: -110px;
    }

    .carousel {
        height: 180px;
    }
}

/* Extra large devices (large desktops, 1200px and up)*/
@media (min-width: 1200px) {
    .footer-background {
        background-position-y: -200px;
    }
}