@media (max-width: 1200px)
{
    .video2
    {
        height: 700px;
        width: 900px;
    }
}

@media (max-width: 900px)
{
    .banner-title
    {
        height: 200px;
    }
    .banner-title h1
    {
        margin-left: 40px;
        margin-right: 40px;
        font-size: 55;
    }
    .nav-links ul a
    {
        font-size: 16;
    }
    .nav-logo .btn
    {
        margin-left: -13px;
        margin-top: 40px;
        height: 100px;
        width: 180px;
    }
    .media-icons 
    {
        top: 500px;
    }
    #container1
    {
        height: 1050px;
    }
    .main1
    {
        height: 250px;
    }
    #container4
    {
        height: 770px;
    }
    .main2
    {
        height: 750px;
    }
    .container12
    {
        margin-left: 90px;
        margin-right: 90px;
    }
    .media-icons 

    {

        top: 200px;

    }
    .video2
    {
        height: 670px;
        width: 700px;
    }
}

@media (max-width: 800px)
{

    .banner-title
    {
        position: relative;
        height: 250px;
    }
    .banner-title h1
    {
        font-size: 55px;
        margin-left: 0px;
        margin-right: 40px;
    }
    .media-icons
    {
        top: 200px;
    }
    .nav-bar
    {
        padding: 10px 20px;
    }
    .fa-bars
    {
        position: absolute;
        right: 20px;
        top: 10px;
    }
    .nav-bar .fas
    {
        display: block;
        margin: 12px 10px;
        font-size: 22px;
        cursor: pointer;
    }
    .nav-links
    {
        height: 100vh;
        width: 200px;
        background: black;
        border-radius: 10px;
        top: 0;
        right: -200px;
        position: absolute;
        text-align: left;
        z-index: 2;
        transition: 0.5s;
    }
    .nav-links ul a
    {
        display: block;
        font-size: 18;
    }
    .nav-links ul li
    {
        display: block;
    }
    
    #container1
    {
        height: 850px;
    }
    .main1
    {
        
        height: 250px;
    }
    .main2
    {
        
        height: 750px;
    }
    #container4
    {
        margin-left: 0px;
        margin-right: 0px;
        height: 600px;
        
    }
    .container3
    {
        background-color: white;
    }

    .container12
    {
        margin-left: 50px;
        margin-right: 50px;
    }
    .container13
    {
        height: 500px;
        background-color: rgb(184, 219, 241);
        margin-top: -50px;
    }
    .container13a
    {
        height: 450px;
        margin-top: 20px;
    }
    .container13b
    {
        height: 400px;
        margin-top: 20px;
    }
    .container13a h4
    {
        padding-top: 320px;
    }
    .container13b h4
    {
        padding-top: 280px;
    }
    
}

@media (max-width: 700px)
{ .container1
    {
        height: 800px;
    }
  .container1 h1
  {
    margin-left: 10px;
  }  
  .footer
  {
      height: 200px;
  }
  .wrapper .button

    {

        display: inline-block;

        margin-left: 10px;

    }
  .media-icons
    {
        top: 450px;
    }
    .video2
    {
        height: 650px;
        width: 600px;
    }
}

@media (max-width: 600px)
{
    #container1
    {
        height: 1300px;
    }
    .main1
    {
        height: 250px;
    }
    #container4
    {
        height: 620px;
    }
    .main2
    {
        height: 350px;
    }
    .container12
    {
        margin-left: 30px;
        margin-right: 30px;
    }
    .container13
    {
        height: 1000px;
        display: block;
    }
    .container13a
    {
        margin-left: 50px;
        width: 80%;
        height: 600px;
    }
    .container13b
    {
        margin-left: 50px;
        width: 80%;
    }
    .container13a h4
    {
        padding-top: 510px;
        font-size: 21;
    }
    .container13b h4
    {
        padding-top: 270px;
        font-size: 21;
    }
    .video2
    {
        height: 300px;
        width: 300px;
    }
    .container4 p
    {
        margin-left: 0px;
        margin-right: 0px;
    }
    .container2 p
    {
        margin-left: 0px;
        margin-right: 0px;
    }
}

@media (max-width: 420px)
{
    .banner-title h1
    {
        font-size: 40px;
        margin-left: -10px;
        margin-right: 10px;
    }
    .banner-title
    {
        height: 250px;
    }
    .media-icons
    {
        top: 450px;
    }
    #container1
    {
        height: 1280px;
    }
    .container2
    {
        height: 280px;
    }
    .container3
    {
        height: 500px;
    }
    #container4
    {
        height: 550px;
    }
    #container4 h1
    {
        margin-left: 70px;
    } 
    .main2
    {
        height: 500px;
    }
}

@media (max-width: 400px)
{
    .banner-title
    {
        height: 250px;
    }
    .media-icons
    {
        top: 460px;
    }
    #container1
    {
        height: 1370px;
    }
    .container2
    {
        height: 330px;
    }
    .container3
    {
        height: 500px;
    }
    #container4
    {
        height: 650px;
    }
    .container12
    {
        margin-left: 10px;
        margin-right: 10px;
    }
    .container13
    {
        height: 900px;
    }
    .container13a
    {
        margin-left: 30px;
        margin-top: -20px;
        height: 500px;
    }
    .container13b
    {
        margin-left: 30px;
        height: 300px;
    }
    .container13a h4
    {
        padding-top: 380px;
        font-size: 20;
    }
    .container13b h4
    {
        padding-top: 220px;
        font-size: 20;
    }
    .main2
    {
        height: 350px;
    }
}

@media (max-width: 350px)
{
    .banner-title
    {
        height: 350px;
    }
    .media-icons 
    {
        top: 540px;
    }
    #container1
    {
        height: 1400px;
    }
    
    .container2
    {
        height: 370px;
    }
    .container3
    {
        height: 500px;
    }
    #container4
    {
        height: 770px;
    }
   
}
