body{
    font-family:"Helvetica Neue", Helvetica, sans-serif;
    color: #6F6F6F;
    margin:0;
}

a{
    text-decoration: none;
}

img.general-logo{
    width:100%;
}

div#header-logo-container{
    width:200px;
    padding:14px 0 10px 20px;
    display:inline-block;
    vertical-align: middle;
}

div#contact{
    display:inline-block;
}

div.header-contact{
    position:absolute;
    right:20px;
    margin-top:18px;
}

div.contact-item{
    display:inline-block;
}

svg.icon{
    vertical-align: middle;
}

svg.icon-email{
    width:22px;
}

svg.icon-phone{
    width:16px;
}

svg.icon-linkedin{
    width:20px;
    margin-left:30px;
    margin-right:2px;
}

footer svg.general-icon{
    margin-left:30px;
}

svg.icon-about-link{
    width:20px;
    margin-left:2px;
}

svg.header-icon{
    margin-left:20px;
    margin-right:4px;
    fill:#233773;
}

svg.footer-icon{
    fill:#6F6F6F;
}

span.contact-text{
    display:none;
}

div#header-banner{
    width:100%;
    height:350px;
    background-image: url("assets/banner-background.jpg");
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    overflow:hidden;
    text-align:center;
}

div#master-logo-container{
    max-width:500px;
    margin:110px auto 20px auto;
}

img#master-logo{
    width:80%;
}

div#header-banner-paragraph-container{
    color:white;
    font-weight:bold;
    font-size:16px;
    max-width:480px;
    margin:0 auto;
}

p#header-banner-paragraph{
    margin:0 20px 0 20px;
}

section#page-heading{
    margin-top:60px;
}

h1{
    font-weight:200;
    font-size:32px;
    margin-top:0;
    margin-bottom:7px;
}

div.heading-footer-text-container{
    text-align:right;
}

div.heading-text-container{
    width:200px;
    border-bottom: 1px solid #6F6F6F;
}

section#brands{
    width:100%;
    text-align:center;
    margin-top:40px;
}

div.single-brand-container{
    text-align:center;
    margin:0 20px 70px 20px;
    vertical-align:text-top;
}

div.single-brand-logo-container{
    width:200px;
    margin:0 auto;
}

.general-paragraph{
    font-size:16px;
    font-weight:300;
    color: #6F6F6F;
    margin:0 0 7px 0;
}

h4.visit-site-link{
    font-size:16px;
    font-weight:bold;
    color: #05AA80;
    display:inline-block;
    margin:0;
    vertical-align:middle;
}

svg.arrow{
    fill: #05aa80;
    width:6px;
    margin-left:2px;
    display:inline-block;
    vertical-align:middle;
}

div.blank-placeholder{
    display:none;
}

footer{
    margin-top:100px;
    margin-bottom:90px;
}

section#footer-section{
    border-top: 1px solid #6F6F6F;
    width:80vw;
    text-align:right;
}

div.footer-text-container{
    display:inline-block;
    margin-top:50px;
    margin-bottom:30px;
}

div#footer-contact{
    margin-bottom:25px;
    margin-left:50px;
}

div#footer-about-container{
    margin-bottom:30px;
}

span.footer-about-text{
    font-weight:bold;
    font-size:16px;
    color:#6F6F6F;
    vertical-align:middle;
}

div#footer-logos-container{
    display:inline-block;
    width:180px;
    margin-left:50px;
    margin-bottom:30px;
}

div.copyright-info{
    display:inline-block;
    width:100%;
}

span.copyright-text{
    display:block;
    white-space:nowrap;
}

div.contact-item:hover svg.icon{
    fill:#05AA80;
    transition-duration: 0.5s;
}

div.contact-item:hover span.contact-text{
    color:#05AA80;
    transition-duration: 0.5s;
}

div#footer-about-container:hover span.footer-about-text{
    color:#05AA80;
    transition-duration: 0.5s;
}

div#footer-about-container:hover svg.icon{
    fill:#05AA80;
    transition-duration: 0.5s;
}

div.single-brand-container:hover div.single-brand-logo-container{
    filter: grayscale(1);
    transition-duration: 0.5s;
}

div.single-brand-container:hover div.hover-opacity-60{
    opacity:0.6;
    transition-duration: 0.5s;
}

div.single-brand-container:hover div.hover-opacity-80{
    opacity:0.8;
    transition-duration: 0.5s;
}

div.single-brand-container:hover h4.visit-site-link{
    color:#233773;
    transition-duration: 0.5s;
}

div.single-brand-container:hover svg.arrow{
    fill:#233773;
    transition-duration: 0.5s;
}





@media only screen and (min-width: 450px){
    span.copyright-text{
        display:inline-block;
    }
}


  

@media only screen and (min-width: 760px) {
    div#header-logo-container{
        padding-top:32px;
        padding-bottom:27px;
    }

    div.header-contact{
        margin-top:34px;
    }

    svg.general-icon{
        margin-left:45px;
        margin-right:2px;
    }

    span.header-contact-text{
        display:inline-block;
        font-size:21px;
        vertical-align: middle;
    }

    span.header-contact-text{
        font-weight:bold;
        color:#233773;
    }

    span.footer-contact-text{
        font-weight:400;
        color:#6F6F6F;
    }

    div#header-logo-container{
        padding-left:32px;
    }
    
    div.header-contact{
        right:32px;
    }

    div#header-banner{
        height:475px;
    }

    div#master-logo-container{
        margin:170px auto 30px auto;
    }

    section#page-heading{
        margin-top:5.7vw;
    }
    
    h1{
        font-size:3.2vw;
        margin-bottom:0.8vw;
    }
    
    div.heading-text-container{
        width:30.8vw;
    }

    section#brands{
        width:90%;
        margin-top:3.7vw;
        margin-left:auto;
        margin-right:auto;
    }

    div.single-brand-container{
        width:22vw;
        display:inline-block;
        margin:0 2vw 6.5vw 2vw;
    }

    div.single-brand-logo-container{
        width:18vw;
        margin-bottom:1vw;
    }

    footer{
        margin-top:50px;
        margin-bottom:100px;
    }

    div.footer-text-container{
        margin-bottom:40px;
    }
    
    div#footer-contact{
        display:inline-block;
        margin-bottom:0;
    }

    div#footer-about-container{
        display:inline-block;
        vertical-align:middle;
        margin-bottom:0;
        margin-left:60px;
    }

    span.footer-about-text{
        font-size:21px;
    }

    div#footer-logos-container{
        vertical-align:-20px;
        margin-bottom:30px;
    }
}


  @media only screen and (min-width: 1200px) {
    div#master-logo-container{
        max-width:590px;
        display:inline-block;
        margin-top:205px;
    }

    div#header-banner-paragraph-container{
        display:inline-block;
    }

    p#header-banner-paragraph{
        text-align:left;
        margin-left:-20px;
    }

    footer{
        margin-top:40px;
    }

    div#footer-contact{
        margin-left:0;
    }

    span.footer-text-linkedin{
        margin-left:35px;
    }

    div#footer-about-container{
        margin-left:90px;
    }

    section#footer-section{
        width:85vw;
    }

    span.footer-contact-text{
        display:inline-block;
        font-size:21px;
        vertical-align: middle;
    }

    svg.icon-linkedin{
        margin-left:2px;
    }

    div#footer-logos-container{
        width:17vw;
        margin-left:50vw;
    }
  }


  @media only screen and (min-width: 1430px){
    section#footer-section{
        width:1350px;
    }

    div#footer-logos-container{
        width:260px;
        margin-left:50px;
        margin-top:50px;
        float:right;
    }

    div.copyright-info{
        width:500px;
        margin-top:0;
    }
  }


  @media only screen and (min-width: 1580px){
    section#footer-section{
        width:1470px;
    }
    div#footer-logos-container{
        width:300px;
  }


  @media only screen and (min-width: 1800px) {
    section#page-heading{
        margin-top:100px;
    }

    h1{
        font-size:56px;
    }

    div.heading-text-container{
        width:555px;
    }

    div.single-brand-logo-container{
        width:325px;
    }
  }