@import url('https://fonts.googleapis.com/css2?family=Uncial+Antiqua&display=swap');

* { 
    margin: 0;
    padding: 0;
    font-family: 'Uncial Antiqua', sans-serif;
    box-sizing: border-box;
    overflow-x: hidden;
}

html,body
{
    width: 100%;
    margin: 0px;
    padding: 0px;
}

p{
    font-size: 50px;
}

audio{
    position: relative;
    top: 100px;
}

.copyright{
    margin: 0 auto;
    display: block;
    position: relative;
    bottom: 100px;
    left: 500px;
}

.containerA, .containerB, .containerC, .containerD, .containerE, .containerF, .containerG, 
.containerH, .containerI, .containerJ, .containerK, .containerL, .containerM, .containerN,
.containerO, .containerP, .containerQ, .containerR, .containerS, .containerT, .containerU,
.containerV, .containerW, .containerX, .containerY, .containerZ, .containerAA, .containerAB,
.containerAC, .containerAD, .containerAE, .containerAF, .containerAG, .container1, .container2{
    height: 1080px;
    width:auto;
    background-size:cover;
    background-repeat: no-repeat;
}

.container1{
    background-image: url(Images/Page00.png);
}

.container2{
    background-image: url(Images/Page34.png);
}

.containerA{
    background-image: url(Images/Page01.png);
}

.containerB{
    background-image: url(Images/Page02.png);
}

.containerC{
    background-image: url(Images/Page03.png);
}

.containerD{
    background-image: url(Images/Page04.png);
}

.containerE{
    background-image: url(Images/Page05.png);
}

.containerF{
    background-image: url(Images/Page06.png);
}

.containerG{
    background-image: url(Images/Page07.png);
}

.containerH{
    background-image: url(Images/Page08.png);
}

.containerI{
    background-image: url(Images/Page09.png);
}

.containerJ{
    background-image: url(Images/Page10.png);
}

.containerK{
    background-image: url(Images/Page11.png);
}

.containerL{
    background-image: url(Images/Page12.png);
}

.containerM{
    background-image: url(Images/Page13.png);
}

.containerN{
    background-image: url(Images/Page14.png);
}

.containerO{
    background-image: url(Images/Page15.png);
}

.containerP{
    background-image: url(Images/Page16.png);
}

.containerQ{
    background-image: url(Images/Page17.png);
}

.containerR{
    background-image: url(Images/Page18.png);
}

.containerS{
    background-image: url(Images/Page19.png);
}

.containerT{
    background-image: url(Images/Page20.png);
}

.containerU{
    background-image: url(Images/Page21.png);
}

.containerV{
    background-image: url(Images/Page22.png);
}

.containerW{
    background-image: url(Images/Page23.png);
}

.containerX{
    background-image: url(Images/Page24.png);
}

.containerY{
    background-image: url(Images/Page25.png);
}

.containerZ{
    background-image: url(Images/Page26.png);
}

.containerAA{
    background-image: url(Images/Page27.png);
}

.containerAB{
    background-image: url(Images/Page28.png);
}

.containerAC{
    background-image: url(Images/Page29.png);
}

.containerAD{
    background-image: url(Images/Page30.png);
}

.containerAE{
    background-image: url(Images/Page31.png);
}

.containerAF{
    background-image: url(Images/Page32.png);
}

.containerAG{
    background-image: url(Images/Page33.png);
}

.box-right{
    margin-left: 70%;
    position: relative;
    top: 450px;
    right: 100px;
    width: 30%;
    height: auto;
    text-align: center;
}

.box-left{
    margin-left: 5%;
    position: relative;
    bottom: 500px;
    width: 30%;
    height:auto;
    text-align: center;
}

.box{
    margin-left: 5%;
    position: relative;
    top: 450px;
    width: 30%;
    height:auto;
    text-align: center;
}

.box-center{
    margin: 5%;
    padding: 0;
    display: flex;
    text-align: center;
    align-items: center;
    justify-content: center;
}

.box-leftA{
    margin-left: 2%;
    position: relative;
    top: 400px;
    width: 20%;
    height:auto;
    text-align: center;
}

.box-rightA{
    margin-left: 70%;
    position: relative;
    top: 250px;
    right: 100px;
    width: 30%;
    height: auto;
    text-align: center;
}

.box-leftB{
    margin-left: 2%;
    position: relative;
    top: 200px;
    left: 200px;
    width: 20%;
    height:auto;
    text-align: center;
}

.box-leftC{
    color: white;
    margin-left: 2%;
    position: relative;
    top: 300px;
    left: 150px;
    width: 20%;
    height:auto;
    text-align: center;
}

#myBtn {
    display: none; /* Hidden by default */
    position: fixed; /* Fixed/sticky position */
    bottom: 20px; /* Place the button at the bottom of the page */
    right: 30px; /* Place the button 30px from the right */
    z-index: 99; /* Make sure it does not overlap */
    border: none; /* Remove borders */
    outline: none; /* Remove outline */
    background-color: black; /* Set a background color */
    color: white; /* Text color */
    cursor: pointer; /* Add a mouse pointer on hover */
    padding: 15px; /* Some padding */
    border-radius: 10px; /* Rounded corners */
    font-size: 18px; /* Increase font size */
  }
  
  #myBtn:hover {
    background-color: #555; /* Add a dark-grey background on hover */
  }

  /*---------------------------Desktop Sizes-------------------*/
  @media only screen and (max-width: 1600px){
    html,body{
        width: 100%;
        margin: 0px;
        padding: 0px;
    }

    p{
        font-size: 38px;
    }

    .containerA, .containerB, .containerC, .containerD, .containerE, .containerF, .containerG, 
    .containerH, .containerI, .containerJ, .containerK, .containerL, .containerM, .containerN,
    .containerO, .containerP, .containerQ, .containerR, .containerS, .containerT, .containerU,
    .containerV, .containerW, .containerX, .containerY, .containerZ, .containerAA, .containerAB,
    .containerAC, .containerAD, .containerAE, .containerAF, .containerAG, .container1, .container2{
        height: 900px;
        width:auto;
        background-size:cover;
        background-repeat: no-repeat;
        background-size: 100%;
    }
  }

  @media only screen and (max-width: 1536px){
    html,body{
        width: 100%;
        margin: 0px;
        padding: 0px;
    }

    p{
        font-size: 40px;
    }

    .containerA, .containerB, .containerC, .containerD, .containerE, .containerF, .containerG, 
    .containerH, .containerI, .containerJ, .containerK, .containerL, .containerM, .containerN,
    .containerO, .containerP, .containerQ, .containerR, .containerS, .containerT, .containerU,
    .containerV, .containerW, .containerX, .containerY, .containerZ, .containerAA, .containerAB,
    .containerAC, .containerAD, .containerAE, .containerAF, .containerAG, .container1, .container2{
        height: 864px;
        width:auto;
        background-size:cover;
        background-repeat: no-repeat;
        background-size: 100%;
    }
  }

  @media only screen and (max-width: 1440px){
    html,body{
        width: 100%;
        margin: 0px;
        padding: 0px;
    }

    p{
        font-size: 35px;
    }

    .containerA, .containerB, .containerC, .containerD, .containerE, .containerF, .containerG, 
    .containerH, .containerI, .containerJ, .containerK, .containerL, .containerM, .containerN,
    .containerO, .containerP, .containerQ, .containerR, .containerS, .containerT, .containerU,
    .containerV, .containerW, .containerX, .containerY, .containerZ, .containerAA, .containerAB,
    .containerAC, .containerAD, .containerAE, .containerAF, .containerAG, .container1, .container2{
        height: 900px;
        width:auto;
        background-size:cover;
        background-repeat: no-repeat;
        background-size: 100%;
    }
  }

  @media only screen and (max-width: 1366px){
    html,body{
        width: 100%;
        margin: 0px;
        padding: 0px;
    }

    p{
        font-size: 32px;
    }

    .containerA, .containerB, .containerC, .containerD, .containerE, .containerF, .containerG, 
    .containerH, .containerI, .containerJ, .containerK, .containerL, .containerM, .containerN,
    .containerO, .containerP, .containerQ, .containerR, .containerS, .containerT, .containerU,
    .containerV, .containerW, .containerX, .containerY, .containerZ, .containerAA, .containerAB,
    .containerAC, .containerAD, .containerAE, .containerAF, .containerAG, .container1, .container2{
        height: 768px;
        width:auto;
        background-size:cover;
        background-repeat: no-repeat;
        background-size: 100%;
    }

    .box-rightA{
        margin-left: 70%;
        position: relative;
        top: 150px;
        right: 100px;
        width: 30%;
        height: auto;
        text-align: center;
    }

    .box{
        margin-left: 5%;
        position: relative;
        top: 350px;
        width: 30%;
        height:auto;
        text-align: center;
    }

    .box-leftA{
        margin-left: 2%;
        position: relative;
        top: 350px;
        width: 20%;
        height:auto;
        text-align: center;
    }

    .box-right{
        margin-left: 70%;
        position: relative;
        top: 350px;
        right: 75px;
        width: 30%;
        height: auto;
        text-align: center;
    }
  }

  @media only screen and (max-width: 1280px){
    html,body{
        width: 100%;
        margin: 0px;
        padding: 0px;
    }

    p{
        font-size: 30px;
    }

    .containerA, .containerB, .containerC, .containerD, .containerE, .containerF, .containerG, 
    .containerH, .containerI, .containerJ, .containerK, .containerL, .containerM, .containerN,
    .containerO, .containerP, .containerQ, .containerR, .containerS, .containerT, .containerU,
    .containerV, .containerW, .containerX, .containerY, .containerZ, .containerAA, .containerAB,
    .containerAC, .containerAD, .containerAE, .containerAF, .containerAG, .container1, .container2{
        height: 720px;
        width:auto;
        background-size:cover;
        background-repeat: no-repeat;
        background-size: 100%;
    }
  }

  /*---------------------------Tablet Sizes-------------------*/

  @media only screen and (max-width: 820px){
    html,body{
        width: 100%;
        margin: 0px;
        padding: 0px;
    }

    p{
        font-size: 28px;
    }

    .containerA, .containerB, .containerC, .containerD, .containerE, .containerF, .containerG, 
    .containerH, .containerI, .containerJ, .containerK, .containerL, .containerM, .containerN,
    .containerO, .containerP, .containerQ, .containerR, .containerS, .containerT, .containerU,
    .containerV, .containerW, .containerX, .containerY, .containerZ, .containerAA, .containerAB,
    .containerAC, .containerAD, .containerAE, .containerAF, .containerAG, .container1, .container2{
        height: 1280px;
        width:auto;
        background-size:cover;
        background-repeat: no-repeat;
        background-size: 100%;
    }

    .container1{
        background-image: url(Images/TabPage01.png);
    }
    
    .container2{
        background-image: url(Images/TabPage35.png);
    }
    
    .containerA{
        background-image: url(Images/TabPage02.png);
    }
    
    .containerB{
        background-image: url(Images/TabPage03.png);
    }
    
    .containerC{
        background-image: url(Images/TabPage04.png);
    }
    
    .containerD{
        background-image: url(Images/TabPage05.png);
    }
    
    .containerE{
        background-image: url(Images/TabPage06.png);
    }
    
    .containerF{
        background-image: url(Images/TabPage07.png);
    }
    
    .containerG{
        background-image: url(Images/TabPage08.png);
    }
    
    .containerH{
        background-image: url(Images/TabPage09.png);
    }
    
    .containerI{
        background-image: url(Images/TabPage10.png);
    }
    
    .containerJ{
        background-image: url(Images/TabPage11.png);
    }
    
    .containerK{
        background-image: url(Images/TabPage12.png);
    }
    
    .containerL{
        background-image: url(Images/TabPage13.png);
    }
    
    .containerM{
        background-image: url(Images/TabPage14.png);
    }
    
    .containerN{
        background-image: url(Images/TabPage15.png);
    }
    
    .containerO{
        background-image: url(Images/TabPage16.png);
    }
    
    .containerP{
        background-image: url(Images/TabPage17.png);
    }
    
    .containerQ{
        background-image: url(Images/TabPage18.png);
    }
    
    .containerR{
        background-image: url(Images/TabPage19.png);
    }
    
    .containerS{
        background-image: url(Images/TabPage20.png);
    }
    
    .containerT{
        background-image: url(Images/TabPage21.png);
    }
    
    .containerU{
        background-image: url(Images/TabPage22.png);
    }
    
    .containerV{
        background-image: url(Images/TabPage23.png);
    }
    
    .containerW{
        background-image: url(Images/TabPage24.png);
    }
    
    .containerX{
        background-image: url(Images/TabPage25.png);
    }
    
    .containerY{
        background-image: url(Images/TabPage26.png);
    }
    
    .containerZ{
        background-image: url(Images/TabPage27.png);
    }
    
    .containerAA{
        background-image: url(Images/TabPage28.png);
    }
    
    .containerAB{
        background-image: url(Images/TabPage29.png);
    }
    
    .containerAC{
        background-image: url(Images/TabPage30.png);
    }
    
    .containerAD{
        background-image: url(Images/TabPage31.png);
    }
    
    .containerAE{
        background-image: url(Images/TabPage32.png);
    }
    
    .containerAF{
        background-image: url(Images/TabPage33.png);
    }
    
    .containerAG{
        background-image: url(Images/TabPage34.png);
    }

    .box-right{
        margin-left: 70%;
        position: relative;
        top: 200px;
        right: 200px;
        width: 40%;
        height: auto;
        text-align: center;
    }
    
    .box-left{
        margin-left: 5%;
        position: relative;
        bottom: 250px;
        width: 30%;
        height:auto;
        text-align: center;
    }
    
    .box{
        margin-left: 5%;
        position: relative;
        top: 300px;
        width: 40%;
        height:auto;
        text-align: center;
    }
    
    .box-center{
        margin: 5%;
        padding: 0;
        display: flex;
        text-align: center;
        align-items: center;
        justify-content: center;
    }
    
    .box-leftA{
        margin-left: 2%;
        position: relative;
        top: 250px;
        width: 40%;
        height:auto;
        text-align: center;
    }
    
    .box-rightA{
        margin-left: 70%;
        position: relative;
        top: 200px;
        right: 150px;
        width: 40%;
        height: auto;
        text-align: center;
    }
    
    .box-leftB{
        margin-left: 2%;
        position: relative;
        top: 150px;
        left: 200px;
        width: 40%;
        height:auto;
        text-align: center;
    }
    
    .box-leftC{
        color: white;
        margin-left: 2%;
        position: relative;
        top: 1100px;
        left: 200px;
        width: 40%;
        height:auto;
        text-align: center;
    }
  }

  @media only screen and (max-width: 810px){
    html,body{
        width: 100%;
        margin: 0px;
        padding: 0px;
    }

    p{
        font-size: 28px;
    }

    .containerA, .containerB, .containerC, .containerD, .containerE, .containerF, .containerG, 
    .containerH, .containerI, .containerJ, .containerK, .containerL, .containerM, .containerN,
    .containerO, .containerP, .containerQ, .containerR, .containerS, .containerT, .containerU,
    .containerV, .containerW, .containerX, .containerY, .containerZ, .containerAA, .containerAB,
    .containerAC, .containerAD, .containerAE, .containerAF, .containerAG, .container1, .container2{
        height: 1080px;
        width:auto;
        background-size:cover;
        background-repeat: no-repeat;
        background-size: 100%;
    }

    .box-left{
        margin-left: 5%;
        position: relative;
        bottom: 100px;
        width: 30%;
        height:auto;
        text-align: center;
    }

    .box-leftC{
        color: white;
        margin-left: 2%;
        position: relative;
        top: 800px;
        left: 550px;
        width: 30%;
        height:auto;
        text-align: center;
    }
  }

  @media only screen and (max-width: 800px){
    html,body{
        width: 100%;
        margin: 0px;
        padding: 0px;
    }

    p{
        font-size: 27px;
    }

    .containerA, .containerB, .containerC, .containerD, .containerE, .containerF, .containerG, 
    .containerH, .containerI, .containerJ, .containerK, .containerL, .containerM, .containerN,
    .containerO, .containerP, .containerQ, .containerR, .containerS, .containerT, .containerU,
    .containerV, .containerW, .containerX, .containerY, .containerZ, .containerAA, .containerAB,
    .containerAC, .containerAD, .containerAE, .containerAF, .containerAG, .container1, .container2{
        height: 1280px;
        width:auto;
        background-size:cover;
        background-repeat: no-repeat;
        background-size: 100%;
    }

    .box-left{
        margin-left: 5%;
        position: relative;
        bottom: 200px;
        width: 30%;
        height:auto;
        text-align: center;
    }
  }

  @media only screen and (max-width: 768px){
    html,body{
        width: 100%;
        margin: 0px;
        padding: 0px;
    }

    p{
        font-size: 28px;
    }

    .containerA, .containerB, .containerC, .containerD, .containerE, .containerF, .containerG, 
    .containerH, .containerI, .containerJ, .containerK, .containerL, .containerM, .containerN,
    .containerO, .containerP, .containerQ, .containerR, .containerS, .containerT, .containerU,
    .containerV, .containerW, .containerX, .containerY, .containerZ, .containerAA, .containerAB,
    .containerAC, .containerAD, .containerAE, .containerAF, .containerAG, .container1, .container2{
        height: 1024px;
        width:auto;
        background-size:cover;
        background-repeat: no-repeat;
        background-size: 100%;
    }

    .box-left{
        margin-left: 5%;
        position: relative;
        bottom: 100px;
        width: 30%;
        height:auto;
        text-align: center;
    }

    .box{
        margin-left: 5%;
        position: relative;
        top: 250px;
        width: 40%;
        height:auto;
        text-align: center;
    }

    .box-leftB{
        margin-left: 2%;
        position: relative;
        top: 100px;
        left: 200px;
        width: 40%;
        height:auto;
        text-align: center;
    }

    .box-leftC{
        color: white;
        margin-left: 2%;
        position: relative;
        top: 800px;
        left: 500px;
        width: 30%;
        height:auto;
        text-align: center;
    }
  }

  @media only screen and (max-width: 601px){
    html,body{
        width: 100%;
        margin: 0px;
        padding: 0px;
    }

    p{
        font-size: 26px;
    }

    .containerA, .containerB, .containerC, .containerD, .containerE, .containerF, .containerG, 
    .containerH, .containerI, .containerJ, .containerK, .containerL, .containerM, .containerN,
    .containerO, .containerP, .containerQ, .containerR, .containerS, .containerT, .containerU,
    .containerV, .containerW, .containerX, .containerY, .containerZ, .containerAA, .containerAB,
    .containerAC, .containerAD, .containerAE, .containerAF, .containerAG, .container1, .container2{
        height: 962px;
        width:auto;
        background-size:cover;
        background-repeat: no-repeat;
        background-size: 100%;
    }

    .box-right{
        margin-left: 70%;
        position: relative;
        top: 100px;
        right: 200px;
        width: 40%;
        height: auto;
        text-align: center;
    }

    .box-left{
        margin-left: 5%;
        position: relative;
        bottom: 200px;
        width: 40%;
        height:auto;
        text-align: center;
    }

    .box{
        margin-left: 5%;
        position: relative;
        top: 200px;
        width: 40%;
        height:auto;
        text-align: center;
    }

    .box-leftA{
        margin-left: 2%;
        position: relative;
        top: 150px;
        width: 40%;
        height:auto;
        text-align: center;
    }

    .box-rightA{
        margin-left: 70%;
        position: relative;
        top: 125px;
        right: 135px;
        width: 50%;
        height: auto;
        text-align: center;
    }

    .box-leftB{
        margin-left: 2%;
        position: relative;
        top: 50px;
        left: 200px;
        width: 40%;
        height:auto;
        text-align: center;
    }

    .box-leftC{
        color: white;
        margin-left: 2%;
        position: relative;
        top: 800px;
        left: 150px;
        width: 50%;
        height:auto;
        text-align: center;
    }
  }

  /*---------------------------Mobile Sizes-------------------*/

  @media only screen and (max-width: 414px){
    html,body{
        width: 100%;
        margin: 0px;
        padding: 0px;
    }

    p{
        font-size: 20px;
    }

    .containerA, .containerB, .containerC, .containerD, .containerE, .containerF, .containerG, 
    .containerH, .containerI, .containerJ, .containerK, .containerL, .containerM, .containerN,
    .containerO, .containerP, .containerQ, .containerR, .containerS, .containerT, .containerU,
    .containerV, .containerW, .containerX, .containerY, .containerZ, .containerAA, .containerAB,
    .containerAC, .containerAD, .containerAE, .containerAF, .containerAG, .container1, .container2{
        height: 896px;
        width:auto;
        background-size:cover;
        background-repeat: no-repeat;
        background-size: 100%;
    }

    .container1{
        background-image: url(Images/MobilePage01.png);
    }
    
    .container2{
        background-image: url(Images/MobilePage35.png);
    }
    
    .containerA{
        background-image: url(Images/MobilePage02.png);
    }
    
    .containerB{
        background-image: url(Images/MobilePage03.png);
    }
    
    .containerC{
        background-image: url(Images/MobilePage04.png);
    }
    
    .containerD{
        background-image: url(Images/MobilePage05.png);
    }
    
    .containerE{
        background-image: url(Images/MobilePage06.png);
    }
    
    .containerF{
        background-image: url(Images/MobilePage07.png);
    }
    
    .containerG{
        background-image: url(Images/MobilePage08.png);
    }
    
    .containerH{
        background-image: url(Images/MobilePage09.png);
    }
    
    .containerI{
        background-image: url(Images/MobilePage10.png);
    }
    
    .containerJ{
        background-image: url(Images/MobilePage11.png);
    }
    
    .containerK{
        background-image: url(Images/MobilePage12.png);
    }
    
    .containerL{
        background-image: url(Images/MobilePage13.png);
    }
    
    .containerM{
        background-image: url(Images/MobilePage14.png);
    }
    
    .containerN{
        background-image: url(Images/MobilePage15.png);
    }
    
    .containerO{
        background-image: url(Images/MobilePage16.png);
    }
    
    .containerP{
        background-image: url(Images/MobilePage17.png);
    }
    
    .containerQ{
        background-image: url(Images/MobilePage18.png);
    }
    
    .containerR{
        background-image: url(Images/MobilePage19.png);
    }
    
    .containerS{
        background-image: url(Images/MobilePage20.png);
    }
    
    .containerT{
        background-image: url(Images/MobilePage21.png);
    }
    
    .containerU{
        background-image: url(Images/MobilePage22.png);
    }
    
    .containerV{
        background-image: url(Images/MobilePage23.png);
    }
    
    .containerW{
        background-image: url(Images/MobilePage24.png);
    }
    
    .containerX{
        background-image: url(Images/MobilePage25.png);
    }
    
    .containerY{
        background-image: url(Images/MobilePage26.png);
    }
    
    .containerZ{
        background-image: url(Images/MobilePage27.png);
    }
    
    .containerAA{
        background-image: url(Images/MobilePage28.png);
    }
    
    .containerAB{
        background-image: url(Images/MobilePage29.png);
    }
    
    .containerAC{
        background-image: url(Images/MobilePage30.png);
    }
    
    .containerAD{
        background-image: url(Images/MobilePage31.png);
    }
    
    .containerAE{
        background-image: url(Images/MobilePage32.png);
    }
    
    .containerAF{
        background-image: url(Images/MobilePage33.png);
    }
    
    .containerAG{
        background-image: url(Images/MobilePage34.png);
    }

    .box-right{
        margin-left: 70%;
        position: relative;
        top: 180px;
        right: 150px;
        width: 50%;
        height: auto;
        text-align: center;
    }

    .box{
        margin-left: 5%;
        position: relative;
        top: 200px;
        left: 50px;
        width: 50%;
        height:auto;
        text-align: center;
    }

    .box-leftA{
        margin-left: 2%;
        position: relative;
        top: 150px;
        left: 100px;
        width: 40%;
        height:auto;
        text-align: center;
    }

    .box-rightA{
        margin-left: 70%;
        position: relative;
        top: 50px;
        right: 135px;
        width: 50%;
        height: auto;
        text-align: center;
    }

    .box-leftC{
        color: white;
        margin-left: 2%;
        position: relative;
        top: 800px;
        left: 100px;
        width: 50%;
        height:auto;
        text-align: center;
    }
  }

  @media only screen and (max-width: 412px){
    html,body{
        width: 100%;
        margin: 0px;
        padding: 0px;
    }

    p{
        font-size: 20px;
    }

    .containerA, .containerB, .containerC, .containerD, .containerE, .containerF, .containerG, 
    .containerH, .containerI, .containerJ, .containerK, .containerL, .containerM, .containerN,
    .containerO, .containerP, .containerQ, .containerR, .containerS, .containerT, .containerU,
    .containerV, .containerW, .containerX, .containerY, .containerZ, .containerAA, .containerAB,
    .containerAC, .containerAD, .containerAE, .containerAF, .containerAG, .container1, .container2{
        height: 915px;
        width:auto;
        background-size:cover;
        background-repeat: no-repeat;
        background-size: 100%;
    }

    
    .box{
        margin-left: 5%;
        position: relative;
        top: 150px;
        left: 100px;
        width: 50%;
        height:auto;
        text-align: center;
    }

    
  }

  @media only screen and (max-width: 393px){
    html,body{
        width: 100%;
        margin: 0px;
        padding: 0px;
    }

    p{
        font-size: 20px;
    }

    .containerA, .containerB, .containerC, .containerD, .containerE, .containerF, .containerG, 
    .containerH, .containerI, .containerJ, .containerK, .containerL, .containerM, .containerN,
    .containerO, .containerP, .containerQ, .containerR, .containerS, .containerT, .containerU,
    .containerV, .containerW, .containerX, .containerY, .containerZ, .containerAA, .containerAB,
    .containerAC, .containerAD, .containerAE, .containerAF, .containerAG, .container1, .container2{
        height: 873px;
        width:auto;
        background-size:cover;
        background-repeat: no-repeat;
        background-size: 100%;
    }

    .box-right{
        margin-left: 70%;
        position: relative;
        top: 150px;
        right: 150px;
        width: 50%;
        height: auto;
        text-align: center;
    }

    .box-rightA{
        margin-left: 70%;
        position: relative;
        top: 50px;
        right: 135px;
        width: 60%;
        height: auto;
        text-align: center;
    }
  }

  @media only screen and (max-width: 390px){
    html,body{
        width: 100%;
        margin: 0px;
        padding: 0px;
    }

    p{
        font-size: 20px;
    }

    .containerA, .containerB, .containerC, .containerD, .containerE, .containerF, .containerG, 
    .containerH, .containerI, .containerJ, .containerK, .containerL, .containerM, .containerN,
    .containerO, .containerP, .containerQ, .containerR, .containerS, .containerT, .containerU,
    .containerV, .containerW, .containerX, .containerY, .containerZ, .containerAA, .containerAB,
    .containerAC, .containerAD, .containerAE, .containerAF, .containerAG, .container1, .container2{
        height: 844px;
        width:auto;
        background-size:cover;
        background-repeat: no-repeat;
        background-size: 100%;
    }
  }

  @media only screen and (max-width: 360px){
    html,body{
        width: 100%;
        margin: 0px;
        padding: 0px;
    }

    p{
        font-size: 18px;
    }

    .containerA, .containerB, .containerC, .containerD, .containerE, .containerF, .containerG, 
    .containerH, .containerI, .containerJ, .containerK, .containerL, .containerM, .containerN,
    .containerO, .containerP, .containerQ, .containerR, .containerS, .containerT, .containerU,
    .containerV, .containerW, .containerX, .containerY, .containerZ, .containerAA, .containerAB,
    .containerAC, .containerAD, .containerAE, .containerAF, .containerAG, .container1, .container2{
        height: 800px;
        width:auto;
        background-size:cover;
        background-repeat: no-repeat;
        background-size: 100%;
    }

    .box-right{
        margin-left: 70%;
        position: relative;
        top: 100px;
        right: 150px;
        width: 50%;
        height: auto;
        text-align: center;
    }

    .box-leftC{
        color: white;
        margin-left: 2%;
        position: relative;
        top: 700px;
        left: 80px;
        width: 50%;
        height:auto;
        text-align: center;
    }
  }