body{
    background-color: #BF3B46;
}                

@media (min-width: 640px) {
    .video{
        width: 100%;
    }

    .video-cont{
        position: fixed;
        width: 100%;
        height: 100%;
       
   }

   .logo-row{
       margin-top: 2%;
   }

   .first-row{
       margin-top: 3%;
   }

   .second-row{
       margin-top: 5%;
   }

   .logo-size{
       width: 15%;

   }

   .videos-first-row{
       width: 60%;
       margin-left: 20%;
   }

   .videos-second-row{
       width: 60%;
       margin-left: 20%;
   }

   .video-container{
        padding: 0%;
        background: #000;
        border-radius: 10px;
        width: auto;
        margin: 0 auto;
        overflow: hidden;
   }

   .text-center{
    font-size: 1.5rem;
    color: #ffffff;
   }

   a{
    color: #ffffff;
   }

   a:hover{
        color: #000;
       text-decoration: none;
   }

   .pdf-container{
    width: 57%;
    margin-left: 22%;
   }

}

@media (max-width: 414px) {
   .video-cont-mobile{
        position: fixed;
        width: 100%;
        height: 100%;
        
   }

   .video{
        transform: rotateZ(90deg);
        margin-top: 42%;
        width: 195%;
        margin-left: -45%;
   }

   .logo-size{
        width: 50%;
    }

    .logo-row{
       margin-top: 5%;
   }


  .row{
      display: flow-root;
  }

  .first-row{
      margin-top: 5%;
  }

  .second-row{
      margin-top: 5%;
  }

  .text-center{
      font-size: 2rem;
      margin-top: 2%;
      margin-bottom: 2%;
  }

  a{
    color: #ffffff;
   }

   a:hover{
       color: #000;
       text-decoration: none;

   }
}


@media(orientation: landscape) {

    
    .video{
        width: 100%;
    }

   
}


@media only screen and (max-width: 900px) and (min-width: 414px)  {
    .video-cont-mobile{
        position: fixed;
        width: 100%;
        height: 100%;
        
   }

   .video{
        transform: rotateZ(90deg);
        margin-top: 42%;
        width: 195%;
        margin-left: -45%;
   }

   .logo-size{
        width: 50%;
    }

    .logo-row{
       margin-top: 5%;
   }


  .row{
      display: flow-root;
  }

  .first-row{
      margin-top: 5%;
  }

  .second-row{
      margin-top: 5%;
  }

  .text-center{
      font-size: 2rem;
      margin-top: 2%;
      margin-bottom: 2%;
  }

  a{
    color: #ffffff;
   }

   a:hover{
       color: #000;
       text-decoration: none;

   }

}