@media screen and (max-width: 767px) {
    /*GLOBAL - MENU - Secondary links not positioned properly per design*/
    .menu li {
        padding-bottom: 18px;
    }
    
    /*GLOBAL - MENU - X not aligned with the text like design*/
    .hidden_menu_button {
        margin-left: 10px;
    }
    

    
    /** I adjusted the padding of the menu in the web based on the image guide*/
  
    div#desktop-header .container-fluid {
    height: 100%;
    padding: 7em 10% 9% 10%;
    position: relative;
}
    
    
    /*GLOBAL - HEADER - Logo too small, match design*/
    .custom-logo {
        min-width: 95px;
    }
    
    /*GLOBAL - FOOTER - Final text wrong size and line height, match design*/
    .copyright p {
         margin-bottom: 6px;
    }
    
    /** I adjusted the padding of the footer in the web based on the image guide*/
    .row_footer {
        padding-left: 8%;
        padding-right: 8%;
        padding-top: 50px;
    }
    
    /*HOME - HERO - Hero logo too small, match design*/
    #feralspin {
        height: 30% !important;
        left: 5%;
        top: 6%;
    }
    
    
    /*HOME - ROW 2 - Adjust letter spacing for font*/
    .content h2 {
        letter-spacing: 2px;
        font-size: 55px !important;
        font-weight: 500;
    }
    
    /*HOME - ROW 2 - Table looks completely wrong, wrong size, wrong padding, wrong font sizes, match design*/
    #core-range {
        padding: 60px 8% 0px 8%;
        
    }
    
    .text {
        padding-bottom: 5px;
    }
    
    .text p {
        margin-bottom: 15px;
    }
   #core-range .row.mobile .bottom .col-sm-8 {
       width: 75%;
   }
   
   #core-range .row.mobile .bottom .col-sm-4 {
        width: 25%;}
        
   #core-range .row.mobile .bottom .col-sm-4.abv {
        padding-left: 31px;
    }


    /*HOME - ROW 3 - adjusted 'VIEW ALL' padding*/
    
    body .fcb-btn.white a {
        padding: 5px 20px;
    }
    
    /*HOME - ROW 4 - Text too far from bottom of image, match design*/
    #news-and-events .row-center .news-events .news-events-item h3 {
       margin-top: 0; 
       margin-bottom: 50px;
    }
    
  
    
    
    /*CORE RANGE - ROW 1 - Filter labels should be central, not left aligned, match design*/
    .core-range-archive .heading .searchandfilter > ul li.sf-field-taxonomy-core-range-category > ul li .sf-label-radio {
    width: 100%;
    }
    
    
    /*CORE RANGE - ROW 2 - Too much padding above images, match design*/
    .core-range-archive .beer-list {
    padding: 0;
    }
    
    
    /*CORE RANGE - ROW 2 - "DISCOVER" button much too large, match design*/
    .core-range-archive .beer-list .beer-item .fcb-btn a {
    font-size: clamp(12px, 2.5vw, 12px) !important;
    padding: 3px 15px;
   
    }
    
     /*HOME - ROW 2 - adjusted 'VIEW ALL' padding*/
    body .fcb-btn a {
        padding: 5px 20px;
   }
  
    
    /*HOME - ROW 3 - adjusted padding*/
     #brewer-series .col-sm-4.text {
    padding: 0px 6%; 
    }
    
    
     /*CORE RANGE - adjust padding to look like the design*/
     .core-range-archive {
        padding: 50px 6% 0% 7%;
     }
 
     /*CORE RANGE - ROW 1 - Initial heading too large and too much padding underneath, match design*/

    .core-range-archive .col-sm-9 h3 {
        font-weight: 900;
        font-size: 1.7em;
        line-height: 1.1;
        margin-bottom: 50px;
    }
    
    .core-range-archive .heading h1 {
        font-size: clamp(35px, 3.5vw, 65px);
        margin-bottom: 0.8em;
        
    }
         
    .core-range-archive .col-sm-6 h4 p {
         font-size: 1.3em;
    }
         
         .fcb-btn {
             margin-top: 10px !important;
         }
      
     .core-range-archive .col-sm-4 .text {
        margin-bottom: 0.5em;
    }
     
     
     #brewer-series .text h2{
       margin-bottom: 0.5em;
    }
    
    /*SHOP - adjust padding to look like the design*/
    .shop-page {
        padding: 50px 6% 0% 7%;
    }
   
   .shop-page .heading h1 {
        font-size: clamp(35px, 3.5vw, 65px);
    }
    
   .shop-page .heading h3 {
        font-size: 1.3em;
        line-height: 1.2;
    }
   
   .shop-page .heading .searchandfilter > ul li.sf-field-taxonomy-product_cat > ul li .sf-label-radio {
         min-width: 105px;
    }
    
    header#mobile-header {
         height: 80px;
    }
    
    /*Shop – adjust image size*/
    .shop-page .slick-list .slick-track {
        width: auto !important;
        transform: none !important;
    }
    
    .shop-page .slick-track {
        flex-direction: column;
    }
    

    /*Shop – Row 1 adjust paragraph margin.*/
    .wp-container-core-columns-is-layout-1.wp-container-core-columns-is-layout-1 {
        flex-wrap: nowrap;
        margin-bottom: 10px;
    }
    
    /*Shop – Row 2 adjust the padding.*/
    .shop-page ul.products {
         padding: 20px 5px;
    }
    
    
    .shop-page ul.products li.product h2.woocommerce-loop-product__title {
      font-size: clamp(22px, 3.5vw, 23px) !important;
    }
    
    /*About – adjust top padding*/
    body .page-content {
        padding-top: 50px;
    }
    
    .page-content .container {
        padding: 0px 15px;
    }
    
    /*ABOUT - ROW 5 - Heading text wrong size, match design*/
  
    /*About – adjust heading bottom margin*/
    .page-content #block-text h3 {
        margin-bottom: 1.2em;
        margin-top: 0.4em;
        font-size: clamp(35px, 3.5vw, 60px) !important;
    }
    
    .page-content .col-sm-7 h2 p {
        font-size: clamp(25px, 2.3vw, 45px);
    }
    
    /*About – adjust button top margin*/
    .slide-read-more-button {
       margin: 20px 0;
    }
    
    /*About – Row 1 adjust bottom padding*/
    #block-text {
        padding: 0 0 30px 0;
    }
    
    .page-content #full-image .full-image .items img {
       max-height: 280px;
    }
    
   .read-more-button .fcb-btn a {
       padding: 5px 15px;
    }
    
    /*.page-content .col-sm-11 {*/
    /*    padding-top: 30px;*/
    /*}*/
    
    .col-sm-11 .font-impactlabel {
        margin-bottom: 10px;
    }
    
    /*Shop – Hide Previous and Next Button*/
    .products .slick-prev {
        display: none !important;
    }
    
    .products .slick-next {
         display: none !important;
    }
    
    /*Footer – adjust list size column*/
    .row.mobile #desktop-navigation-bottom .menu {
        width: 300px;
    }
   
   /*Home – Change Brewer Series Carousel*/
   @keyframes scroll-x {
        0% { transform: translateX(100%); }
        100% { transform: translateX(-100%); }
    }
   
    #brewer-series .marquee__content {
        flex-shrink: 0;
        display: flex;
        justify-content: center;
        align-items: center;
        min-width: 100%;
        gap: var(--gap);
        flex-direction: row;
        aspect-ratio: 1;
        animation: scroll-x 20s linear infinite;
        padding: 0;
    }
    
    #brewer-series img {
        height: 350px;
        max-width: none;
        width: auto !important;
    }
    
    #brewer-series .marquee {
       overflow: unset;
    }
    
    /*Brewer Series – Adjust padding*/
    .brewer-series-archive .page-content{
        padding: 0px 4% 50px 5%;
    }
    
     .brewer-series-archive .page-content .container{
        padding: 0px 5% 0% 5%;
    }
    
     .brewer-series-archive .container{
        padding: 60px 4% 0% 5%;
    }
    
    /*Brewer Series – adjust heading bottom margin*/
    .brewer-series-archive h3 {
        font-size: 1.3em;
        margin-bottom: 20px;
    }
    
    
    /*Brewer Series – Row 1 adjust font size*/
    .brewer-series-archive .heading h1 {
        margin-bottom: 0px; 
        font-size: clamp(37px, 3.5vw, 65px);
    }
    
    
    .brewer-series-archive .heading #search-filter-form-396 > ul li.sf-field-taxonomy-brewer-series-category > ul li {
        margin-right: 6px;
        margin-bottom: 5px;
        border: 1px solid #000;
        font-size: clamp(12px, 2.5vw, 15px) !important;
    }
    
    .searchandfilter ul li li {
        padding: 4px 0;
    }
    
    .brewer-series-archive .heading #search-filter-form-396 > ul li.sf-field-taxonomy-brewer-series-category > ul {
    text-align: left;
    }
    
    .brewer-series-archive .heading #search-filter-form-396 > ul li.sf-field-sort_order {
        height: 30px;
        padding-left: 20px;
    }
    
    .brewer-series-archive .heading #search-filter-form-396 > ul li.sf-field-sort_order h4 {
        padding: 0px 5px 0 0;
        font-size: 15px;
      
    }
 
     .brewer-series-archive .page-content {
        padding-top: 35px;
    }
    
    .brewer-series-archive .beer-item {
        padding: 0px !important;
    }
    
    .row .beer-list {
        gap: 15px 3.5%;
        padding-bottom: 15px;
    }
    
    .brewer-series-archive .beer-list .beer-item .post_thumbnail {
        margin: 0 0 0;
    }
    
    .brewer-series-archive .beer-list .beer-item {
        flex-basis: 31%;
    }
    
    #brewer-series-footer {
        padding: 0px; 
    }
    
    #brewer-series-footer .col-sm-8 img {
        padding-bottom: 40px;
    }
    
    #brewer-series-footer .text h2 {
        text-shadow: 3px 1px 1px #fff;
        letter-spacing: 1px;
        font-weight: normal;
    }
    
    .marquee > .marquee__content:nth-of-type(2) {
      display: none;
    }
    
    
    .row.mobile .newsletter h3 {
       font-size: clamp(20px, 3.5vw, 25px) !important;
    }
    
    
   .post-229 p {
        font-size: clamp(20px, 2.3vw, 45px) !important;
    }
    
    .post-229 #block-text .content p {
        font-size: clamp(16px, 2.5vw, 25px) !important;
    }
    
     .post-229 #block-text.contact-page {
        background-size: 300px;
    }
    
    .post-229 .page-content #block-text h3 {
        margin-bottom: 1em;
    }
    
    .officelist h1 {
         font-size: clamp(35px, 3.5vw, 44px) !important;
         margin-top: -1.7em;
         margin-bottom: 1.2em;
    }
    
    .officelist #mainOfficeLists > div .radio-btn:checked + label {
        padding: 3px;
        margin-right: 7px;
        width: 130px;
    }
    
    .officelist #mainOfficeLists > div label {
        padding: 3px 0px;
        margin-right: 7px;
        width: 130px;
    }
    
   .officelist #OfficeLists tr {
        display: flex;
        flex-direction: column;
        padding: 20px 30px;
        border-top: 0px;
    }
    
    .officelist #OfficeLists td {
        padding: 0px; 
        position: initial;
        line-height: 1.5;
    }
  
    
    .officelist .row {
        padding: 3% 0;
    }
    
    .officelist #OfficeLists tr:last-child {
        border-bottom: 0px;
    }
    
    .standard_posts .col-sm-11 {
        padding: 10px 5% 0px 5%;
    }
    
    .standard_posts .heading h1 {
        font-size: clamp(30px, 3.5vw, 65px) !important;
    }
    
    .standard_posts h2 {
       font-size: clamp(25px, 3.5vw, 65px) !important;
          }
    
    .standard_posts .slick-track {
        opacity: 1;
        transform: none !important;
        width: auto !important;
    }
    
    .standard_posts .slick-track {
       flex-direction: column;
       
    }
    
    .standard_posts .news-events > .slick-list > .slick-track > .slick-slide > div {
        height: auto !important;
        
    }
    
    .standard_posts .news-events > .slick-list > .slick-track > .slick-slide {
        width: 300px !important;
    }
    
    
    select[name="_sf_sort_order[]"] option {
    
        font-size: 16px;
        color: #333;
        background-color: #fff;
        padding: 5px 20px;
        width: 500px;
        text-align: center;
    
    }
    
    .marquee__content:nth-child(2) {
        display: none !important;
    }
    
    .marquee--reverse {
        display: none !important;
    }
    
   #brewer-series .wrapper {
        height: auto;
        /*  height: 400px; */
    }
    
    #brewer-series .wrap-container {
       
         min-height: auto; 
      
    }
       
    .brewer-series-archive .heading #search-filter-form-396 > ul li.sf-field-taxonomy-brewer-series-category > ul li .sf-label-radio {
        padding: 0;
        width: 100px;
        text-align: center;
    }
    
    .brewer-series-archive .heading #search-filter-form-396 > ul li.sf-field-taxonomy-brewer-series-category > ul li {
        margin-bottom: 10px;
    }
    
    
   .core-range .container section .row-related .related.brewer > [class*=col-] {
       min-width: 300px;
    }
    
    
    @media screen and (max-width: 1024px) {
        .core-range .container section .row-related .related .beer-item {
        padding: 0px;
        }
    }
/* fix for adroid font display */
@media screen and (max-width: 768px) and (-webkit-min-device-pixel-ratio: 2) and (hover: none) and (pointer: coarse) {
    body h2, body a, body h2 p span {
        font-family: "TeXGyreHeros" !important;
        font-weight: 800 !important;
    }