@media only screen and (max-width: 1024px) {

      .col-s-1 {grid-column-end: span 1;}
      .col-s-2 {grid-column-end: span 2;}
      .col-s-3 {grid-column-end: span 3;}
      .col-s-4 {grid-column-end: span 4;}
      .col-s-5 {grid-column-end: span 5;}
      .col-s-6 {grid-column-end: span 6;}
      .col-s-7 {grid-column-end: span 7;}
      .col-s-8 {grid-column-end: span 8;}
      .col-s-9 {grid-column-end: span 9;}
      .col-s-10 {grid-column-end: span 10;}
      .col-s-11 {grid-column-end: span 11;}
      .col-s-12 {grid-column-end: span 12;}

      .off-s-0{grid-column-start: 1;}
      .off-s-1{grid-column-start: 2;}
      .off-s-2{grid-column-start: 3;} 
      .off-s-3{grid-column-start: 4;}
      .off-s-4{grid-column-start: 5;}
      .off-s-5{grid-column-start: 6;}
      .off-s-6{grid-column-start: 7;}
      .off-s-7{grid-column-start: 8;}
      .off-s-8{grid-column-start: 9;}
      .off-s-9{grid-column-start: 10;}
      .off-s-10{grid-column-start: 11;}
      .off-s-11{grid-column-start: 12;}
      .off-s-12{grid-column-start: 13;}



      html, body {
        font-size: 10px;
      }



      #menu-btn{
            left: inherit;
            right: 3%;
      }


      .logo{
            left: 3%;
            transform: translateX(0);
            font-size: 1.4em;
      }

      .mob{
            display: inline-block;
      }

      .desk{
            display: none;
      }


      #header-subtitle,
      #header-dates{
            right: 0;
            bottom: 0;
            top: inherit;
            text-align: center;
            font-size: .8em;
            width: 100%;
            margin-left: 3vw;
            height: 4vh;
            display: flex;
            padding-top: 0px;
            line-height: 1;
            padding-bottom: 0px;
      }

      
      #header-subtitle .right,
      #header-page{
          display: none;

      }

      #header-subtitle{
            margin-right: auto;
            justify-content: flex-start;
      }

       #header-dates{
            padding-top: 0px;
            transform: initial;
            transform-origin: center;
            align-content: center;
            align-items: center;
              margin-right: auto;
              margin-left: auto;
                margin-right: 3vw;
              justify-content: flex-end;
            
      }     



 





/*      #header-dates{
            position: fixed;
            right: 0;
            bottom: 0;
            top: inherit;
            text-align: right;
            font-size: .8em;
            width: 100%;
            transform: initial;
            padding-right: 3vw;
            transform: translateY(-50%);
            
            
      }      */






      .logo{
            line-height: inherit;
display: flex;
  align-items: center;      }

}