
/* ===============
   IE Fixes
   =============== */
.ie7 .title {
    padding-top: 20px;
}

*, *:before, *:after {
    -webkit-box-sizing:border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
* img {
    max-width:100%;
    height:auto;
}


/* ==========================================================================
   HOB 25YRr ANNIVERSARY  Pages
   ========================================================================== */
@font-face {
 font-family:'Brandon Grotesque Black';
    src:url('http://maven-prod.azurewebsites.net/Themes/HOB/fonts/brandon-blk-webfont.eot');
    src:url('http://maven-prod.azurewebsites.net/Themes/HOB/fonts/brandon-blk-webfont.ttf') format('truetype'),
        url('http://maven-prod.azurewebsites.net/Themes/HOB/fonts/brandon-blk-webfont.svg') format('svg'),
        url('http://maven-prod.azurewebsites.net/Themes/HOB/fonts/brandon-blk-webfont.woff2') format('woff2'),
        url('http://maven-prod.azurewebsites.net/Themes/HOB/fonts/brandon-blk-webfont.woff') format('woff');
    font-weight:normal;
    font-style: normal;
}
@font-face {
 font-family:"Brandon Grotesque Bold";
    src:url('http://maven-prod.azurewebsites.net/Themes/HOB/fonts/brandon_bld-webfont.eot');
    src:url('http://maven-prod.azurewebsites.net/Themes/HOB/fonts/brandon_bld-webfont.ttf') format('truetype'),
        url('http://maven-prod.azurewebsites.net/Themes/HOB/fonts/brandon_bld-webfont.svg') format('svg'),
        url('http://maven-prod.azurewebsites.net/Themes/HOB/fonts/brandon_bld-webfont.woff2') format('woff2'),
        url('http://maven-prod.azurewebsites.net/Themes/HOB/fonts/brandon_bld-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
 font-family:'Brandon Grotesque Medium';
    src:url('http://maven-prod.azurewebsites.net/Themes/HOB/fonts/brandon-med-webfont.eot');
    src:url('http://maven-prod.azurewebsites.net/Themes/HOB/fonts/brandon-med-webfont.ttf') format('truetype'),
        url('http://maven-prod.azurewebsites.net/Themes/HOB/fonts/brandon-med-webfont.svg') format('svg'),
        url('http://maven-prod.azurewebsites.net/Themes/HOB/fonts/brandon-med-webfont.woff2') format('woff2'),
        url('http://maven-prod.azurewebsites.net/Themes/HOB/fonts/brandon-med-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
#hob25-blue-top {
    margin:0 auto;
    text-align:center;
    background:url('../img/blue-top_blgrey.jpg') no-repeat center top;
    height:auto;
    max-width:1902px;
    height:375px;
    padding:30px 5px;
}
#hob25 {
    margin:0 auto;
    text-align:center;
    background:url('../img/hob25-bg.jpg') no-repeat center top;
    background-color:#111;
    height:auto;
    max-width:1902px;
    height:1311px;
    padding-top:30px;
    padding-bottom:30px;
}
section.hob25-inner {
    max-width:1100px;
    margin:0 auto;
    text-align:center;
    background-color:rgba(0,0,0,.3);
    padding:0px 25px;
    border:2px solid #ededed;
    overflow:auto;
}
img.logo-25hob {
    padding-top:3px;
    margin-bottom:0px;
}
h1.hob25 {
    margin:0 auto;
    padding:0px 5px;
    color:#fff;
    font-family: 'Brandon Grotesque Black', Arial, sans-serif;
    font-weight:400;
    text-transform:uppercase;
    font-size:42px;
    line-height:42px;
    letter-spacing:3px;
    text-shadow: 1px 2px 2px #111;
    margin-top:10px;
}
h2.smaller {
    margin:0 auto;
    font-family: 'Brandon Grotesque Black', Arial, sans-serif;
    font-size:30px;
    line-height:32px;
    font-weight:400;
    text-transform:uppercase;
    color:#fff;
    text-shadow: 1px 2px 2px #111;
    letter-spacing:2.5px;
    margin-bottom:20px;
}
.hob25-text {
    font-family: 'Brandon Grotesque Medium', Arial, sans-serif;
    font-size:16px;
    line-height:19px;
    letter-spacing:1.5px;
    margin-top:15px;
    margin-bottom:20px;
    color:#fff;
}
button.celebrate {
    font-family: 'Brandon Grotesque Medium', Arial, sans-serif;
    background-color:#791519;
    text-transform:uppercase;
    letter-spacing:2px;
    font-size:28px;
    padding:7px 20px 5px;
    color:#fff;
    border:none;
    margin-top:30px;
    margin-bottom:20px;
    width:36%;
}
h2.off-subtit {
    margin: 0 auto;
    padding:15px;
    font-family: 'Brandon Grotesque Black', Arial, sans-serif;
    font-weight:400;
    font-size:32px;
    line-height:34px;
    color:#fff;
    text-shadow: 1px 2px 2px #111;
    letter-spacing:2.8px;
    text-transform:uppercase;
    -webkit-margin-before: 0em;
    -webkit-margin-after: 0em;
    margin-top:20px;
}
#offerings {
    margin: 0 auto;
    text-align:center; 
    width:60%;
}
#offerings ul { 
    list-style:none;
    margin: 0 auto;
    padding: 0 30px;
    text-align:left;
    margin-left:45px;
    margin-bottom:30px;
}
#offerings .left {
    width:50%;
    float:left;
    margin: 0 0;
}
#offerings .right{
    width:50%;
    float:right;
    margin: 0 0;
}
#offerings ul li {
    padding:4px;
    font-family: 'Brandon Grotesque Black', Arial, sans-serif;
    font-weight:400;
    font-size:24px;
    line-height:28px;
    color:#fff;
    text-shadow: 1px 2px 2px #111;
    letter-spacing:.9px;
    text-transform:uppercase;
}
#offerings li a {
    color:#fff;
    text-decoration:none;
}
/* PAGE two */
h3.hob25 {
    font-family: 'Brandon Grotesque Medium', Arial, sans-serif;
    font-size:20px;
    text-align:left;
    line-height:21px;
    letter-spacing:1.5px;
    margin-top:35px;
    margin-bottom:15px;
    color:#fff;
}
div.hob25-two-text {
    font-family: 'Brandon Grotesque Medium', Arial, sans-serif;
    font-size:14px;
    line-height:18px;
    letter-spacing:1.3px;
    margin-top:5px;
    margin-bottom:5px;
    color:#fff;
    text-align:left;
}
#near-you {
    border-top:1px solid #fff;
    border-bottom:1px solid #fff;
    padding:15px;
    overflow:auto;
}
.col {
    width:25%;
    float:left;
    margin: 0 0;
}
#near-you ul {
    list-style:none;
    margin: 0 auto;
    padding: 0 30px;
    text-align:left;
}
 #near-you ul li {
    padding:3px;
    font-family: 'Brandon Grotesque Medium', Arial, sans-serif;
    font-weight:600;
    font-size:18px;
    line-height:20px;
    color:#fff;
    letter-spacing:.9px;
    text-transform:uppercase;
}
#near-you li a {
    color:#fff;
    text-decoration:none;
}
.col-btm {
    margin: 0 auto;
    text-align:center;
}
.col-btm img {
    margin-left:25px;
    margin-right:25px;
    border:1px solid #fff;
    margin-top:10px;
    margin-bottom:10px;
}
.text-container {
    position:relative;
    width:49%;
    float:left;
    padding:0px 7px;
}
.img-text {
    margin: 0 auto;
    position:absolute;
    top:43%;
     width:60%;
     left:23%;
     right:23%;
    font-family: 'Brandon Grotesque Bold', Arial, sans-serif;
    font-size:26px;
    line-height:26px;
    letter-spacing:1.5px;
    text-shadow: 1px 2px 2px #111;
    color:#fff;
    text-transform:uppercase;
}
/* ==========================================================================
   Media Queries
   ========================================================================== */
@media screen and (max-width: 1130px) {
   #offerings {
    width:70%;
   }
}
@media screen and (max-width: 1040px) {
   #offerings {
        width:75%;
   }
   button.celebrate {
        width:53%;
   }
   .col-btm img {
        margin-left:10px;
        margin-right:10px;
    }
}
@media screen and (max-width: 915px) {
   #offerings {
        width:80%;
   }
}
@media screen and (max-width: 857px) {
   #offerings {
        width:90%;
   }
   .img-text {
     font-size:22px;
     margin:0 auto;
     width:70%;
     left:20%;
     right:20%;
   }
}
@media screen and (max-width: 771px) {
   button.celebrate {
        letter-spacing:2px;
        font-size:28px;
   }
   #offerings {
        width:98%;
    }
    #offerings ul {
        margin-left:30px;
   }
}
@media screen and (max-width: 683px) {
    #offerings ul {
        margin-left:25px;
   }
   h2.off-subtit {
    font-size:32px;
   }
   button.celebrate {
        width:85%;
   }
    .col {
        width:50%;
    }
    .text-container {
        width:98%;
    }
    #hob25 {
        height:1700px;
        background-color:#111;
    }
    .img-text {
     font-size:24px;
     letter-spacing:1.2px;
     width:60%;
     left:20%;
     right:20%;
   }
}
@media screen and (max-width: 628px) {
    #offerings ul {
        padding: 0 5px;
        margin-left: 15px;
   }
   button.celebrate {
        margin-top:10px;
        margin-bottom:0px;
   }
   h2.off-subtit {
        margin-top:10px;
   }
   img.logo-25hob {
        width:48%;
   }
   #near-you ul {
    padding: 0px 15px;
   }
}

@media screen and (max-width: 528px) {
   #offerings ul li {
        font-size:18px;
        line-height:22px;
   }
    #hob25-blue-top {
        height:345px;
        padding:10px 5px;
   }
   .img-text {
     margin:0 auto;
     width:70%;
     left:20%;
     right:20%;
   }
   h1.hob25 {
        margin-top:5px;
   }
   h2.off-subtit {
        font-size:30px;
        line-height:33px;
   }
}

@media screen and (max-width:490px) {
    #hob25-blue-top {
        height:295px;
   }
   #offerings ul {
        padding: 0 5px;
        margin-left: 5px;
   }
}
@media screen and (max-width:480px) {
    #hob25-blue-top {
        height:295px;
   }
   #near-you ul {
    padding: 0px 7px;
   }
}
@media screen and (max-width: 460px) {
   #offerings ul li {
        font-size:20px;
        line-height:22px;
   }
   button.celebrate {
        width:95%;
        font-size:24px;
   }
}
@media screen and (max-width: 424px) {
   
   h2.off-subtit {
        font-size:28px;
        line-height:32px;
   }
}
