@media only screen and (max-width: 700px) {
     .logo, .headlineContainer h3, .sublineContainer h3{
          margin-left: 5vw !important;
     }
     .logoContainer{
          width: 100% !important;
          padding: 0 !important;
     }
     .headlineContainer{
          font-size: 3rem !important;
     }
     .sublineContainer h3, .cardsContainer h2{
          position: relative !important;
          top: 0 !important;
     }
     .cardsContainer{
          max-width: 75vw !important;
          padding: 5vh 0;
     }
     .sublineContainer{
          padding-bottom: 3vh !important;
     }
     .sublineContainer h3{
          font-size: 2rem !important;
          margin-bottom: 0 !important;
     }
     .footerLinksContainer{
          padding: 0 !important;
          margin: 0 5vw !important;
     }
     .hmgbrd-logo{
          max-width: 125px !important;
     }
     .smg-logo{
          max-width: 25px !important;
     }
}
body{
     margin: 0;
     background: #fafafa;
}
.pageWrap{
     display: flex;
     flex-flow: column nowrap;
     align-items: center;
}
.logoContainer{
     width: 98%;
     background: #141414;
     padding: .86vh 1vw;
     border-bottom: 5px solid #1e91d6;
}
.logo{
     margin-left: 1vw;
}
.logo a{
     max-width: 150px;
     display: block;
     cursor: pointer;
}
.logoImg{
     width: 100%;
     height: auto;
     transition: all .2s ease-in-out;
}
.logoImg:hover{
     opacity: .75;
}
.headlineContainer{
     font-size: 5rem;
     padding: 3vh 0 0 0;
}
.sublineContainer{
     padding-bottom: 6vh;
     position: relative;
}
.headlineContainer, .sublineContainer{
     display: block;
     width: 100%;
}
.headlineContainer h3, .sublineContainer h3{
     line-height: .8;
     margin-left: 2vw;
     font-family: 'futura-pt', sans-serif;
     font-weight: 700;
     text-align: left;
     text-transform: uppercase;
}
.sublineContainer h3{
     font-size: 3rem;
     text-align: left;
     position: absolute;
     top: -10vh;
     margin-bottom: 3vh;
}
.cardsContainer{
     max-width: 25vw;
     margin: 0 auto;
     position: relative;
     display: flex;
     flex-flow: column nowrap;
     align-items: center;
}
h3, h2{
     color: #313131;
     margin: 0;
}
a{
     cursor: pointer;
}
.mainContentContainer{
     width: 100%;
}
.cardsContainer{
     width: 100%;
}
.cardsContainer h2{
     font-family: 'futura-pt', sans-serif;
     font-weight: 400;
     text-align: center;
     position: absolute;
     top: -5vh;
     line-height: .8;
}
.cardsContainer img{
     width: 100%;
     height: auto;
}
.footerContainer{
     display: flex;
     width: 100%;
     background: #141414;
     height: 15vh;
     border-top: 5px solid #1e91d6;
     flex-flow: column nowrap;
     justify-content: center;
}
.footerLinksContainer{
     padding: 0 2vw;
     display: flex;
     flex-flow: row nowrap;
     justify-content: space-between;
     align-items: center;
}
.footerLinksContainer a{
     max-width: 200px;
     display: block;
}
.footerLinksContainer img{
     width: 100%;
     height: auto;
}
.footerLinksContainer .smg-logo{
     max-width: 50px;
}
.hmgbrd-logo, .smg-logo, .cardsContainer img{
     transition: all .2s ease-in-out;
}
.hmgbrd-logo:hover, .smg-logo:hover, .cardsContainer img:hover{
     transition: all .2s ease-in-out;
     opacity: .8;
}