  header {
    width: 100%;
    min-height: 4vw;
    z-index: 100;
  }

  html:not([data-scroll='0']) body {
    padding-top: 4vw;
    background-color: #fff;
  }

  html:not([data-scroll='0']) header {
    position: fixed;
    top: 0;
    background-color: #fff;
    box-shadow: 0 0 0.6vw rgba(0, 0, 0, 0.5);
  }

  header {
    box-sizing: border-box;
    padding: 0.9vw 3.8vw;
    -webkit-transition: background-color .25s;
    transition: background-color .25s;
  }

  main {
    padding: 0.9vw 3.8vw;
    position : relative;
  }

  .menu_body {
    color            : #000;
    background-color : #fff;
    height           : 100%;
    font-size        : 24px;
    font-family      : arial, helvetica;
    margin           : 0px;
    padding          : 0px;
  }

  .div_logo{
    box-sizing       : border-box;
    float            : right;
    width            : 20%;
  }
  
  .img_logo{
    height           : 3.5vw;
    width            : auto;
    border           : 0;
  }

  .div_menu_icon{
    display          : none;
  }
  
  .top_menu{
    display          : block;
    box-sizing       : border-box;
    float            : right;
    width            : 60%;
    border           : 0px solid #000;
    font-size        : 1.2vw;
    text-align       : center;
    height           : 3.4vw;
    position         : relative;
  }
  
  .top_menu_buttons{
    display          : block;
    box-sizing       : border-box;
    float            : right;
    width            : 20%;
    height           : 3.8vw;
    position         : relative;
  }
  
  .top_menu_button_url{
    text-decoration  : none;
  }

  .top_menu_button_url:hover{
    text-decoration  : underline;
  }

  .big_title {
    width            : 100%;
    height           : auto;
    padding          : 2vw 0;
  }  

  .big_picture {
    display          : inline;
    float            : right;
    width            : 60%;
  }

  .big_intro {
    display          : inline;
    float            : right;
    width            : 40%;
    margin           : 0;
    font-size        : 1.34vw;
  }

  .div_big_buttons{
    margin-top       : 4vw;
    font-size        : 1.6vw;
  }

  .big_buttons{
    text-decoration  : none;
    box-sizing       : border-box;
    padding          : 1.5vw 3vw;
    border-radius    : 3vw;
  }

  .big_buttons:hover{
    text-decoration  : underline;
  }

  .big_buttons_space{
    font-size        : 2vw;
  }

  .color_sep_line{
    width            : 100%;
    border-spacing   : 0;
    height           : 0.5vw;
  }

  .info_boxes{
    width            : 100%;
    /*display          : flex;*/
    justify-content  : center;
    padding          : 3vw 0;
  }

  .info_box{
    /*float            : right;*/
    max-width        : 27vw;
    display          : inline-flex;
    position         : relative;
    padding          : 1.3vw;
  }

  .info_box_image{
    width            : 100%;
    height           : auto;
    /*float            : right;*/
    opacity          : 0.4;
  }

  .info_box_text{
    width            : 75%;
    float            : left;
    margin-right     : 1.2vw;
    font-size        : 0.9vw;      
  }

  .info_box_title{
    font-size        : 1.4vw;
    font-weight      : bold;
  }

  .footer_div{
    text-align       : center;
    color            : #fff;
    font-size        : 0.9vw;
    padding          : 4vw 0;
    width            : 100%;
    background-color : #311;
    min-height       : 20vh;
  }
  
  .footer_header{
    font-size        : 1.8vw;
    font-weight      : bold;    
  }

  .footer_url:hover{
    text-decoration  : underline;
  }
  
  .footer_url{
    text-decoration  : none;
    font-size        : 1.4vw;
    color            : #ddd;
  }
  
  .social_icons_div{
    padding-top      : 2vw;
  }
  
  .youtube_icon:hover{
    background-color : #ff0000;
  }

  .facebook_icon:hover{
    background-color : #4267b2;
  }

  .social_icon{
    padding          : 16px;
    display          : inline-block;
    border-radius    : 48px;
    background-color : #333;
    margin           : 12px;
  }
  
  .q_and_a_div{
    width            : 100%;
    font-weight      : bold;
    padding-top      : 3vw;
  }
  
  .about_div{
    width            : 100%;
    display          : inline-block;
    padding-bottom   : 2vw;
  }

  .about_image{
    float            : right;
    width            : 6vw;
    height           : auto;
    padding-left     : 2vw;
  }

  @media all and (orientation:landscape)
  {
    .portrait_menu{
      display          : none;
    }  
  }

  @media all and (orientation:portrait)
  {
    header {
      padding          : 2.9vw 6vw;
    }

    .div_logo{
      float            : left;
      width            : 60%;
      text-align       : left;
    }
  
    .img_logo{
      height           : 12vw;  
    }

    .div_menu_icon{
      display          : block;
      float            : right;
    }

    .img_menu_icon{
      height           : 11.4vw;
      cursor           : pointer;
      z-index          : 101;
      position         : relative;
      padding-right    : 2vw;
    }   

    .top_menu{
      display          : none;  
    }    

    .top_menu_buttons{
      display          : none;
    }  

    .big_title {
      padding          : 12vw 0 6vw 0;
    }  

    .big_picture {
      display          : none;
    }
    
    .big_intro {
      width            : 90%;
      float            : none;
      text-align       : center;
      display          : block;
      margin           : 0 auto;
      font-size        : 4vw;
    }

    .div_big_buttons{
      margin-top       : 10vw;
      margin-bottom    : 14vw;
      font-size        : 5vw;
    }

    .big_buttons{
      border-radius    : 12vw;
      padding          : 4vw 3vw;
    }
    
    .big_buttons_space{
      font-size        : 2.5vw;
    }

    .color_sep_line{
      height           : 1.4vw;
    }

    .info_boxes{
      padding-top      : 4vw;
    }

    .info_box{
      max-width        : 100%;
      padding          : 4vw;
    }

    .info_box_text{
      margin-right     : 5vw;
      font-size        : 3.8vw;      
    }

    .info_box_title{
      font-size        : 5.8vw;
    }

    .portrait_menu{
      position         : fixed;
      top              : 14.6vw;
      left             : 0;
      display          : none;
      width            : 100%;
      margin-top       : 3vw;
      font-size        : 6vw;
      text-align       : center;
      box-shadow       : 0 0.8vw 1vw rgba(0, 0, 0, 0.4);
      z-index          : 101;
    }

    .portrait_menu_item{
      width            : 100%;
      background-color : #fa9900;
      color            : #fff;
      padding          : 1vw 0;
      border-bottom    : 0.2vw solid rgba(0,0,0,0.20);
    }  

    .footer_div{
      font-size        : 4vw;
      padding          : 8vw 0;
    }

    .footer_header{
      font-size        : 6.4vw;
    }

    .footer_url{
      font-size        : 4.6vw;
    }

    .social_icons_div{
      padding-top      : 14vw;
    }

    .q_and_a_div{
      padding-top      : 16vw;
    }

    .about_div{
      padding-bottom   : 7vw;
    }

    .about_image{
      width            : 22vw;
      padding-left     : 7vw;
    }
  }
