﻿/* #Media Queries
================================================== */

@media only screen and (max-width: 959px) and (min-width:550px){
    #promotions .center {
        margin: 0 2%;
        top: -3px;
    }
}

/* Smaller than standard 960 (devices and browsers) */
@media only screen and (max-width: 959px)
{
    /*AV Styles*/
    #av_container
    {
        padding-left: 0;
        left: -40px;
    }

    #av-form
    {
        bottom: 76px;
    }

    #av_fail
    {
        width: 400px;
    }

    #AVSubmit
    {
        background-image: url("../img/av-submit-mobile.png");
    }

    /*Navigation Styles*/
    #main-nav
    {
        display: none;
    }

    .js .selectnav
    {
        display: block;
        float: right;
        position: relative;
        top: 31px;
        width: 240px;
        font-family: Hollandse Bold, Times New Roman, Serif;
        font-weight: bold;
        color: #174f83;
        font-size: 16px;
        background-color: #f2efe5;
        border-color: #154d80;
        margin-right: 20px;
    }

    #locator
    {
        display: none;
    }

    #social
    {
        display: none;
    }

    .pencil-mark-right-up
    {
        display: none;
    }
    .pencil-mark-right-med
    {
        display: none;
    }
    .pencil-mark-med
    {
        display: none;
    }
    .pencil-mark-left-med
    {
        display: none;
    }
    .pencil-mark-left-low
    {
        display: none;
    }

    #nav-logo
    {
        margin-left: 20px;
    }

    #nav-content
    {
        top: 6px;
    }

    #footer-nav ul
    {
        margin-left: 5px;
    }

    /* #Index Styles
                    ====================== */
    body.grass 
    {
        width:100%;
    }
                  
    #slidebox-wrap
    {
        width: 100%;
    }

    #slidebox-wrap ul img
    {
        width: 100%;
    }

    #slidebox
    {
        width: 100%;
    }

    /* #Our Beers
                    ====================== */

    .paper-separator, .beer-separator
    {
        margin-left: -20px;
        background-size:73%;
    }

    #our-beers-logo
    {
        display: none;
    }

    .v-divide
    {
        background-image: none;
    }

    .beer img
    {
        width: 94%;
        max-width: 136px;
    }

    .beer-nav li div
    {
        font-size: 16px;
        padding: 7px 7px 16px;
        position: relative;
        z-index: 20;
    }

    .container .four.columns.beer-like, .container .four.columns.twitter
    {
        width: 400px;
    }

    .twitter
    {
        padding: 5px 0px;
    }

    /* #Brewers
                    ====================== */

    .brewers-info
    {
        margin-left: 168px;
    }

    /* #Events
                    ====================== */
    #events-features
    {
        display: none;
    }

    #events-main-divide
    {
        display: none;
    }

    .events-list-container
    {
        margin-left: 0px;
        margin-top: 60px;
    }

    #events-sort
    {
        padding-top: 60px;
    }

    #events-sort select
    {
        width: 178px;
        min-width: 178px;
    }

    .events-sort-title
    {
        text-align: left;
    }

    .event-info
    {
        float: left;
        left: 55px;
        position: relative;
        width: 340px;
        margin-top: 10px;
    }

    /* #Recipes
                    ====================== */
    #featured-recipes
    {
        display: none;
    }

    #recipes-listing
    {
        margin-top: 60px;
    }

    #chef-section
    {
        display: none;
    }

    #recipes-listing-content
    {
        width: 84%;
        margin: 8%;
    }

    .recipe-listing
    {
        width: 100%;
    }

    .recipe-thumb
    {
        width: 30%;
    }

    .recipe-thumb img
    {
        width: 87%;
    }

    .recipe-listing-info
    {
        width: 60%;
    }

    .recipe-listing-title
    {
        width: 100%;
    }

    .recipe-listing-actions
    {
        width: 100%;
    }

    #recipes-listing div.recipe-listing-like
    {
        clear: both;
        float: none;
        width: 100%;
    }

    #recipes-listing div.recipe-listing-link
    {
        clear: both;
        float: none;
        margin-left: 0px;
        padding-top: 12px;
        width: 127px;
    }

    .recipe-list-divide
    {
        width: 100%;
    }

    .recipe-list-divide img
    {
        width: 100%;
    }

    #sort-recipes
    {
        margin-top: 60px;
    }

    #recipe-list-left-divide
    {
        display: none;
    }

    .full-recipe-divide, .full-recipe-divide img
    {
        width: 100%;
    }

    .recipe-image, .recipe-image img
    {
        width: 100%;
        max-width: 306px;
    }

    .recipe-divide-left, .recipe-divide-left img
    {
        width: 100%;
        max-width: 303px;
    }

    /* #The next blue moon - caramel apple
                    ====================== */

    .ca-facebook-like
    {
        background-image: none;
        height: 30px;
        bottom: 50px;
    }

    /* #Video
                    ====================== */

    .container .four.columns.video-navigation
    {
        width: 279px;
    }

    #video-border
    {
        display: none;
    }

    .video-info
    {
        top: 0px;
    }

    .video-like
    {
        top: 0px;
    }

    video
    {
        width: 92%;
    }

    /* #Lumineers
                    ====================== */
    #lumineers-arrow
    {
        display: none;
    }

    /* #Our Story
                    ====================== */
    #story-wrap img
    {
        display: none;
    }

    .video_box, .video_box video
    {
        width: 382px;
        height: 227px;
        margin: 0px auto 10px auto;
    }

    /* #Home
                    ====================== */
    .promo
    {
        width: 32%;
        margin: 5px 2%;
    }
    
    /* #Videos
                    ====================== */
    #flash_fallback_1
    {
        width: 500px;
        height: 293px;
    }

    /*Lumineers
                    ====================== */
    #lumineers-sound-cloud
    {
        margin-left: 0px;
    }
    #lumineers-sound-cloud .player
    {
        display: none;
    }

    /*TVSPOT
                    =====================*/
    #mobile
    {
        display:block;
        /*width: 595px;*/
    }
    .mobile img
    {
        width: 100%;
    }
    .container
    {
        width: 86%;

    }
    #OurBeers .container
    {
        overflow-x:hidden;
    }
    .visible-mobile
    {
        display: block;
    }
    .hidden-mobile
    {
        display: none !important;
    }
    body
    {
       background-image: url("../img/tvspot/background.jpg");
    } 
    .textBeer
    {
        /*position:absolute;*/
        padding-left: 213px;
    }
    .tv-mob
    {
        text-align: center;
        background-repeat: no-repeat;
        display: block;
        position: relative;
        z-index: 10;
    }


    img
    {
        border: 0 none;
        height: auto;
        max-width: 100%;
        vertical-align: middle;
    }
    .brand
    {
        margin-top: 7%; /*float:left;*/
    }

    .subtitle
    {
        font-family: 'Hollandse Bold' ,Times New Roman,Serif;
        font-size: 45px;
    }
    .beersBrand
    {
        text-align: left;
        padding-top: 7%;
    }
    .brandTitle
    {
        margin-top: 7%;
    }
    .beerTag
    {
        float: left;
        margin-right: 4%;
        width: 46%;
    }
    .beerTagR
    {
        float: right;
        width: 46%;
    }
    .contentBeers
    {
        width: 100%;
        margin-top: 7%;
        float: left;
    }
    .divider
    {
        margin-top: 7%;
    }

    .ddbeers select
    {
        background: transparent;
        width: 268px;
        padding: 5px;
        font-size: 22px;
        line-height: 1;
        border: 0;
        border-radius: 0;
        height: 34px;
        -webkit-appearance: none;
        color: #174f83;
        font-family: 'Hollandse Bold' ,Times New Roman,Serif;
        font-weight: bold;
    }

    .ddbeers
    {
        width: 240px;
        height: 34px;
        overflow: hidden;
        background: url(../img/tvspot/arrow-btn.png) no-repeat right #dfdedb;
        border: 1px solid #003e77;
        margin-bottom: 7%;
        margin-top: 7%;
    }
    .menu
    {
        width: 100%;
    }

    .tv-mob video
    {
        width: 100%;
    }
    .tongue
    {
        margin-top: 6%;
    }

    .tv-mob .video-container-inner
    {
        position: static;
    }
    
    .legal
    {
        width: 70%;
    }
}
/* Tablet Portrait size to standard 960 (devices and browsers) */
@media only screen and (min-width: 761px) and (max-width: 959px)
{

    .promo
    {
        margin-bottom:10px;
    }
    .promo.center
    {
        top:0 !important;
    }


    /* #Our Story
                    ====================== */
    #story-wrap
    {
        width: 768px;
    }

    #window
    {
        width: 653px;
        margin-left: auto;
        margin-right: auto;
    }

    #slide-nav
    {
        width: 605px;
    }

    #slideshow li
    {
        overflow: hidden;
    }

    #slide-nav-window
    {
        width: 535px;
    }

    #our-story-tabs
    {
        width: 100%;
    }

    #our-story-tabs li, #our-story-tabs li img
    {
        width: 100%;
    }

    #tablet
    {
        display: block;
    }

    #our-story-tabs li img
    {
        width: 90%;
        top: 11px;
    }

    #our-story-tabs li.selected-tab
    {
        background-image: url("/img/our-story/selected-mobile.png");
    }

    #our-story-tabs li
    {
        height: 62px;
    }
    .hidemobile
    {
        display: none !important;
    }
    .showmobile
    {
        display: block;
    }

      /*TVSPOT
                    =====================*/
    #mobile
    {
        display:block;
        /*width: 595px;*/
    }
    .mobile img
    {
        width: 100%;
    }
    .container
    {
        width: 86%;
    }
    .visible-mobile
    {
        display: block;
    }
    .hidden-mobile
    {
        display: none !important;
    }
    body
    {
       background-image: url("../img/tvspot/background.jpg");
    } 
    .textBeer
    {
        /*position:absolute;*/
        padding-left: 213px;
    }
    .tv-mob
    {
        text-align: center;
        background-repeat: no-repeat;
        display: block;
        position: relative;
        z-index: 10;
    }


    img
    {
        border: 0 none;
        height: auto;
        max-width: 100%;
        vertical-align: middle;
    }
    .brand
    {
        margin-top: 7%; /*float:left;*/
    }

    .subtitle
    {
        font-family: 'Hollandse Bold' ,Times New Roman,Serif;
        font-size: 30px;
    }
    .beersBrand
    {
        text-align: left;
        padding-top: 7%;
    }
    .brandTitle
    {
        margin-top: 7%;
    }
    .beerTag
    {
        float: left;
        margin-right: 4%;
        width: 46%;
    }
    .beerTagR
    {
        float: right;
        width: 46%;
    }
    .contentBeers
    {
        width: 100%;
        margin-top: 7%;
        float: left;
    }
    .divider
    {
        margin-top: 7%;
    }

    .ddbeers select
    {
        background: transparent;
        width: 268px;
        padding: 5px;
        font-size: 22px;
        line-height: 1;
        border: 0;
        border-radius: 0;
        height: 34px;
        -webkit-appearance: none;
        color: #174f83;
        font-family: 'Hollandse Bold' ,Times New Roman,Serif;
        font-weight: bold;
    }

    .ddbeers
    {
        width: 240px;
        height: 34px;
        overflow: hidden;
        background: url(../img/tvspot/arrow-btn.png) no-repeat right #dfdedb;
        border: 1px solid #003e77;
        margin-bottom: 7%;
        margin-top: 7%;
    }
    .menu
    {
        width: 100%;
    }

    .tv-mob video
    {
        width: 100%;
    }
    .tongue
    {
        margin-top: 6%;
    }

    .tv-mob .video-container-inner
    {
        position: static;
    }
    
    .av_form
    {
        width: 520px;
        margin-top: 16px;
    }
}

@media only screen and (min-width: 550px) and (max-width: 959px)
{
    #countdown
    {
        font-size: 1.5em;
        left: 50%;
        top: 5%;
    }        
    
   
}

/* All Mobile Sizes (devices and browser) */
@media only screen and (max-width: 760px)
{


    .fb-desktop
    {
        display: none;
    }

    .fb-mobile
    {
        display: block;
    }

    /*AV styles*/
    #av_submit
    {
        bottom: 6px;
    }

    #av-form
    {
        height: 440px;
    }

    #nav-background
    {
        height: 55px;
    }

    #nav-logo
    {
        top: -6px;
    }

    .js .selectnav
    {
        top: 13px;
    }

    /*Nav styles*/
    #like
    {
        top: 27px;
    }

    #nav-container, #nav-content
    {
        height: 45px;
    }

    /* #Footer Styles
                    ====================== */

    #footer-nav
    {
        display: none;
    }

    .legal
    {
        margin-bottom: 10px;
    }

    /* #Our Beers Styles
                    ====================== */
                    
                    
    .paper-separator, .beer-separator
    {
        margin-left: -20px;
        width:160%;
    }
                    
    #the-beer-image
    {
        display: none;
    }

    .beers-nav
    {
        display: none;
    }

    .beers-nav-mobile
    {
        display: block;
        margin-top: 15px;
        width: 100%;
        text-align: center;
    }

    .beers-nav-mobile-container
    {
        width: 300px;
        margin: 0 auto;
    }

    .prev-beer-mobile
    {
        float: left;
        width: 150px;
    }

    .next-beer-mobile
    {
        float: left;
        width: 150px;
    }

    .view-all-beers-mobile
    {
        width: 300px;
        text-align: center;
    }

    .view-all-beers-mobile img
    {
    }

    .beer-social div
    {
        margin-top: 5px;
    }

    .beer-nav
    {
        display: none;
    }

    #mobile-beer-nav
    {
        display: block;
        background-color: #F2EFE5;
        border-color: #154D80;
        color: #174F83;
        font-family: Hollandse Bold,Times New Roman,Serif;
        font-size: 16px;
        font-weight: bold;
        width: 100%;
    }

    #the-beer-image
    {
        display: none;
    }

    #the-beer-image-mobile
    {
        display: block;
        width: 100%;
        max-width: 150px;
        margin: 0px auto;
        max-height: 250px;
    }

    .container .four.columns.beer-like, .container .four.columns.twitter
    {
        width: 290px;
    }

    /* #Brewers
                    ====================== */
    .brewer-image
    {
        left: 0px;
        position: relative;
        top: 0px;
        padding-top: 40px;
    }

    .brewers-info
    {
        margin-left: 0px;
    }

    .brewer-bio
    {
        margin-left: 0px;
        padding: 25px 40px 40px 40px;
    }

    .recipe-title
    {
        display: none;
    }

    /* #Recipes
                    ====================== */

    .mobile-recipe-title
    {
        display: block;
    }

    .recipe-print
    {
        display: none;
    }

    /* #The next blue moon - caramel apple
                    ====================== */

    #apple-left
    {
        margin-bottom: 10px;
    }

    .ca-sampler-beers
    {
        margin-top: 68px;
    }

    /* #Lumineers
                    ====================== */

    #lumineers-side-image
    {
        display: none;
    }

    #lumineers-divide
    {
        display: none;
        clear: both;
    }

    #lumineers-sound-cloud
    {
        margin-top: 50px;
    }

    /* #Our Story
                    ====================== */

    #mobile-story-tab-nav
    {
        display: block;
        background-color: #F2EFE5;
        border-color: #154D80;
        color: #174F83;
        font-family: Hollandse Bold,Times New Roman,Serif;
        font-size: 16px;
        font-weight: bold;
        width: 100%;
        margin-top: 10px;
    }

    #our-story-tabs
    {
        display: none;
    }

    #slide-nav-window
    {
        width: 179px;
    }

    #slide-nav
    {
        width: 247px;
    }

    #window
    {
        margin-left: auto;
        margin-right: auto;
        width: 280px;
        height: 345px;
    }

    #story-wrap
    {
        width: 300px;
        height: 397px;
    }

    #mobile
    {
        display: block;
    }

    .slide-link
    {
        width: 200px;
        height: 200px;
        left: 200px;
    }

    #slide-link-1
    {
        left: 297px;
        top: 100px;
    }

    #slide-link-2
    {
        left: 352px;
        top: 100px;
    }

    #slide-link-3
    {
        left: 373px;
        top: 100px;
    }

    #slide-link-4
    {
        left: 355px;
        top: 33px;
    }

    #slide-link-5
    {
        left: 305px;
        top: 68px;
    }

    #slide-link-6
    {
        left: 295px;
        top: 30px;
    }

    #slide-link-7
    {
        left: 326px;
        top: 30px;
    }

    #slide-link-8
    {
        left: 278px;
        top: 94px;
    }

    .overlay-content
    {
        margin: 80px auto 0 auto;
        padding: 9px;
        width: 80%;
    }

    .overlay-divide img
    {
        width: 100%;
    }

    .overlay-content p
    {
        width: 100%;
    }

    .overlay-title
    {
        width: 100%;
    }

    .hidemobile
    {
        display: none !important;
    }
    .showmobile
    {
        display: block;
 
    }
    
      #BirthDay, #BirthMonth
    {
        min-width: 60px;
    }
    
    #BirthYear
    {
        min-width: 90px;
    }

    #promotions .center
    {
    margin:5px 2%;
    top:0 !important;
    }
}



/* Mobile Landscape Size to Tablet Portrait (devices and browsers) */
@media only screen and (min-width: 550px) and (max-width: 767px)
{
    /*AV styles*/

    #av_container
    {
        bottom: 28%;
    }

    #av_container input
    {
        font-size: 20px;
    }
    .subtitle
    {
        font-size: 24px;
    }
    
    .av_form
    {
        width: 370px;
        margin-top: 16px;
        }
}


/* Locator break point */
@media only screen and (max-width: 714px)
{
    #responsive-locator
    {
        max-width: 700px;
        width: 95%;
        height: auto;
    }

    #is-mobile
    {
        display: block;
        width: 1px;
        height: 1px;
    }

    /* #Brewers
                    ====================== */

    .brewer-image
    {
        left: 0px;
    }
}

/* iPads (portrait and landscape) ----------- */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px)
{
    #responsive-locator
    {
        max-width: 700px;
        width: 95%;
        height: auto;
    }
    
    
    
}


/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
@media only screen and (max-width: 549px)
{
    body
    {
        background-color: #E1D0B2;
        background-image: url("../img/seventy-two-ways/mobile/mobile-background.jpg");
        background-repeat: repeat;
        color: #4C4C4C;
        font-family: "Times New Roman" ,serif;
        text-align: center;
        width: 100%;
    }

    .footer
    {
        background-image: url("/img/footer-repeat.jpg");
        background-repeat: repeat;
        color:#dacec3;
        width:100%;
    }

    .top-padding
    {
        margin-top: 95px;
    }

    /*AV styles*/

    #av-mobile-text
    {
        display: block;
    }

    .av-form-background
    {
        display: none;
    }

    #av-form
    {
        background-color: #ffffff;
        height: 300px;
        width: 90%;
        margin: 0 auto;
        background-image: url("/img/paper.jpg");
        background-repeat: repeat;
        position: relative;
        top: -41px;
        max-width: 320px;
    }

    #av_container
    {
        bottom: 0;
        top: 0;
        margin: 0 auto;
        left: 0;
        width: 220px;
    }

    #av_container input
    {
        font-size: 18px;
        width: 52px;
        margin-right: 10px;
        padding: 7px;
    }

    #av_container table
    {
        float: none;
        clear: both;
        width: 80%;
    }

    #av_container table td
    {
        width: auto;
        width: 100px;
    }

    #AVSubmit
    {
        float: none;
        width: 130px;
        margin: 0px auto;
        bottom: 0px;
    }

    #av-mobile-text
    {
        font-family: 'Hollandse Bold' , Times New Roman, Serif;
        font-weight: bold;
        font-size: 22px;
        text-align: left;
        padding: 15px;
        line-height: 24px;
        width: 220px;
        margin: 0 auto;
    }

    #av_footer
    {
        bottom: 40px;
    }

    .av-footer-content
    {
        width: 60%;
    }

    #av_fail
    {
        width: 220px;
    }

    /*Navigation Styles*/
    .js .selectnav
    {
        top: 42px;
        display: block;
        width: 80%;
        margin: 0px auto;
        float: none;
        clear: both;
    }

    #like
    {
        display: block;
        top: 35px;
    }

    .like-inner
    {
        height: 77px;
        width: 300px;
        position: relative;
        margin: 0px auto;
    }

    .like-inner .fb-like
    {
        left: 90px;
        bottom: 40px;
    }

    .footer-right
    {
        margin-left: 00px;
    }


    /* #Index Styles
                    ====================== */

    .lights
    {
        display: none;
    }

    /* #Our Beers Styles
                    ====================== */
    .category
    {
        margin-left: -25px;
    }

    .beer
    {
        margin-bottom: 5px;
    }


    /* #events
                    ====================== */

    #events-sort
    {
        padding-top: 93px;
    }

    .events-list-container
    {
        margin-left: 0px;
        margin-top: 10px;
    }

    #events-sort select
    {
        width: 100%;
    }

    .event-info
    {
        float: left;
        left: 55px;
        position: relative;
        width: 80%;
        margin-top: 10px;
    }

    .event-date
    {
        left: 0px;
    }

    /* #Recipes
                    ====================== */

    #sort-recipes
    {
        margin-top: 93px;
    }

    #recipes-listing
    {
        margin-top: 15px;
    }

    #sort-recipes select
    {
        width: 100%;
    }

    .beer-paring-image
    {
        width: 130px;
    }

    .beer-paring-image img
    {
        width: 120px;
    }

    .recipe-beer-pairing
    {
        width: 300px;
    }

    /* #The next blue moon - caramel apple
                    ====================== */
    #caramel-header
    {
        display: none;
    }

    .ca-sampler-beers
    {
        margin-top: 28px;
    }

    .apple-left-padding
    {
        padding: 37px 23px 33px 23px;
    }

    /* #Our Story
                    ====================== */

    .story-tab-container
    {
        padding: 15px;
    }

    .story-brewer-image img
    {
        width: 99%;
        max-width: 274px;
    }

    .video_box, .video_box video
    {
        width: 270px;
        height: 155px;
        margin: 0px auto 10px auto;
    }

    /* #Home
                    ====================== */
    .flexslider
    {
        margin-top: 72px;
    }
    
    .promo
    {
        float: none;
        /*width: 302px;*/
        width: 100%;
        /*margin: 10px auto 0;*/
    }

    #promotions .center
    {
        /*margin-top:10px;*/
    }

    .flex-direction-nav
    {
        display: none;
    }

    /* #Videos
                    ====================== */
    #flash_fallback_1
    {
        width: 270px;
        height: 160px;
    }

    /*Lumineers
                    ====================== */
    #lumineers-sound-cloud
    {
        margin-left: 0px;
    }


    .subtitle
    {
        font-size: 16px;
    }


}


@media only screen and (max-width: 549px)
{
    iframe
    {
        width: 100% !important;
    }
    #lumineers-bio div.fb-like
    {
        display: block !important;
        margin: 10px;
        position: static !important;
    }
    #lumineers-bio div.title
    {
        font-size: 35px !important;
    }
}
