*{
    padding: 0px;
    margin: 0px;
    box-sizing: border-box;
}
/* nav bar */
.navi{
    background: linear-gradient(to bottom, rgb(89, 19, 19) ,rgb(79, 13, 13));
    /* top: 0px; */
    color: black;
    /* border: 2px solid black; */
}
.main{
  color: black;
    /* margin-left: 350px; */
    /* border: 2px solid black; */
}
.new{
  color: black;
}
.name{
    color: white;
    font-size: 18px;
    font-weight: 600;
}
.name:hover{
    color: rgb(225, 191, 0);
    /* font-weight: 600; */
}
.navi2{
    width: 1390%;
    height: 53.5vh;
    margin-left: -200px !important;
    border:0px solid white !important;
    /* border: 2px solid black; */
    border-top-left-radius: 20px !important;
    border-top-right-radius: 20px !important;
    background-color: rgba(0,0, 0,0.5) !important; 
}
.navi2 p{
    background-color: rgba(0,0, 0,0.8);
}
.sub{
    width: 100%;
    display: grid;
    grid-template-columns: auto auto auto auto auto auto;
    grid-column-gap: 15px;
    /* border: 2px solid black; */
}
/*  */
/*  */

.box1{
    width: 100%;
    height: 60vh;
    /* border: 2px solid black; */
    padding-top: 15px;
    
}
.box1 p{
    text-align: center;
    font-size: 20px;
    color: rgb(225, 191, 0);
}
.box2{
    width: 100%;
    height: 60vh;
    /* border: 2px solid black; */
    padding-top: 15px;
    
}
.box2 p{
    text-align: center;
    font-size: 20px;
    color: rgb(225, 191, 0);
}
.box3{
    width: 100%;
    height: 60vh;
    /* border: 2px solid black; */
    padding-top: 15px;
    
}
.box3 p{
    text-align: center;
    font-size: 20px;
    color: rgb(225, 191, 0);
}
.box4{
    width: 100%;
    height: 60vh;
    /* border: 2px solid black; */
    padding-top: 15px;
    
}
.box4 p{
    text-align: center;
    font-size: 20px;
    color: rgb(225, 191, 0);
}
.box5{
    width: 100%;
    height: 60vh;
    /* border: 2px solid black; */
    padding-top: 15px;
    
}
.box5 p{
    text-align: center;
    font-size: 20px;
    color: rgb(225, 191, 0);
}
.box6{
    width: 100%;
    height: 60vh;
    /* border: 2px solid black; */
    padding-top: 15px;
    
}
.box6 p{
    text-align: center;
    font-size: 20px;
    color: rgb(225, 191, 0);
}
/*  */
/*  */
/* banner */
.ban{
    width: 100%;
    height: 105vh;
    background-image: url(./main1a.jpg);
    background-repeat: no-repeat;
    background-size: cover;
   
    /* border: 2px solid black; */
}
.company{
    width: 40%;
    height: 40vh;
    /* margin: auto; */
    position: absolute;
    /* border: 2px solid white; */
    margin-top: 220px;
    margin-left: 50px;
    text-align: center;
}
.company p{
    font-size: 35px;
    color: white;
    font-style: oblique;
}
.companyin{
    width: 60%;
    position: absolute;
    height: 10vh;
    margin-left: 120px;
    display: grid;
    grid-template-columns: auto auto;
    grid-column-gap: 15px;
    /* border: 2px solid black; */
}
.box7{
    width: 100%;
    
}
.box7 button{
    /* margin-top:9%; */
    font-size: 18px;
    padding: 10px 10px;
    border-radius: 10px;
    color: white;
    font-family: 'Ubuntu Mono', monospace;
    transition:  0.3s;
    cursor: pointer;
  }
  
  .firstbutton{
    background-color: rgb(89, 19, 19);
    margin-left: 32px;
    color: black;
    /* border: 1px solid #FFF;  */
  }
  
  .secondbutton{
    background-color: rgb(89, 19, 19);
    margin-left:40px;
    /* border: 1px solid #FFF;  */
  }
  
  .box7 button:hover {
    transform: scale(1.1); 
  }
  .firstbutton:hover{
    background-color: white; 
    color: rgb(89, 19, 19);
  }
  
  .secondbutton:hover {
    background-color: white; 
    color: rgb(89, 19, 19);
  }


.menu1 ul li{
    /* padding: 25px; */
    display: inline;
    /* margin: auto; */
}
.menu1 ul li a{
    color: white;
}
.menu1 ul li a:hover{
    color: rgb(225, 191, 0);
}
/* banner2 */
.ban2{
    width: 100%;
    height: 15vh;
    background: linear-gradient(to bottom, rgb(224, 27, 27),rgb(81, 23, 23));
    /* border: 2px solid black; */
}
.banrap2{
    width: 70%;
    height: 15vh;
    margin: auto;
    /* border: 2px solid black; */
}
.head1{
    padding-top: 10px;
}
.head1 p{
    font-weight: 400;
    text-align: center;
    font-size: 50px;
    color: white;
}
/* middle */
.mid{
    width: 100%;
    height: 15vh;
    margin: auto;
    /* border: 2px solid black; */
    background-color: rgb(81, 23, 23);
}
.midrap{
    width: 85%;
    height: 15vh;
    margin: auto;
    display: grid;
    padding-left: 20px;
    padding-right: 20px;
    background-color: antiquewhite;
    border-radius: 20px;
    grid-template-columns: auto auto auto auto auto auto;
    grid-column-gap: 30px;
    /* border: 2px solid black; */
}
.box8{
    width: 80%;
    height: 6vh;
    margin: auto;
    text-align: center;
    /* border: 2px solid black; */
    /* padding-top: 25px; */
}
.box8 a{
    /* text-align: center; */
    text-decoration: none;
    margin: auto;
    text-transform: uppercase;
    /* padding-top: 10px; */
    font-size: 25px;
    color: rgb(81, 23, 23);
}
.box8:hover{
    background-color: rgb(229, 195, 6);
    border-radius: 10px;
    transform: scale(1.02);
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.5), 0 6px 20px 0 rgba(0, 0, 0, 0.5); 
}
.box8 a:hover{
    color: white;
    padding-top: 10px;
    text-decoration: none;
    text-transform: uppercase;
}
.box9{
    width: 80%;
    height: 6vh;
    margin: auto;
    text-align: center;
    /* border: 2px solid black; */
    /* padding-top: 25px; */
}
.box9 a{
    /* text-align: center; */
    text-decoration: none;
    margin: auto;
    text-transform: uppercase;
    /* padding-top: 10px; */
    font-size: 25px;
    color: rgb(81, 23, 23);
}
.box9:hover{
    background-color: rgb(229, 195, 6);
    border-radius: 10px;
    transform: scale(1.02);
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.5), 0 6px 20px 0 rgba(0, 0, 0, 0.5); 
}
.box9 a:hover{
    color: white;
    padding-top: 10px;
    text-decoration: none;
    text-transform: uppercase;
}
.box10{
    width: 80%;
    height: 6vh;
    margin: auto;
    text-align: center;
    /* border: 2px solid black; */
    /* padding-top: 25px; */
}
.box10 a{
    /* text-align: center; */
    text-decoration: none;
    margin: auto;
    text-transform: uppercase;
    /* padding-top: 10px; */
    font-size: 25px;
    color: rgb(81, 23, 23);
}
.box10:hover{
    background-color: rgb(229, 195, 6);
    border-radius: 10px;
    transform: scale(1.02);
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.5), 0 6px 20px 0 rgba(0, 0, 0, 0.5); 
}
.box10 a:hover{
    color: white;
    padding-top: 10px;
    text-decoration: none;
    text-transform: uppercase;
}
.box11{
    width: 80%;
    height: 6vh;
    margin: auto;
    text-align: center;
    /* border: 2px solid black; */
    /* padding-top: 25px; */
}
.box11 a{
    /* text-align: center; */
    text-decoration: none;
    margin: auto;
    text-transform: uppercase;
    /* padding-top: 10px; */
    font-size: 25px;
    color:rgb(81, 23, 23);
}
.box11:hover{
    background-color: rgb(229, 195, 6);
    border-radius: 10px;
    transform: scale(1.02);
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.5), 0 6px 20px 0 rgba(0, 0, 0, 0.5); 
}
.box11 a:hover{
    color: white;
    padding-top: 10px;
    text-decoration: none;
    text-transform: uppercase;
}
.box12{
    width: 80%;
    height: 6vh;
    margin: auto;
    text-align: center;
    /* border: 2px solid black; */
    /* padding-top: 25px; */
}
.box12 a{
    /* text-align: center; */
    text-decoration: none;
    margin: auto;
    text-transform: uppercase;
    /* padding-top: 10px; */
    font-size: 25px;
    color: rgb(81, 23, 23);
}
.box12:hover{
    background-color: rgb(229, 195, 6);
    border-radius: 10px;
    transform: scale(1.02);
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.5), 0 6px 20px 0 rgba(0, 0, 0, 0.5); 
}
.box12 a:hover{
    color: white;
    padding-top: 10px;
    text-decoration: none;
    text-transform: uppercase;
}
.box13{
    width: 80%;
    height: 6vh;
    margin: auto;
    text-align: center;
    /* border: 2px solid black; */
    /* padding-top: 25px; */
}
.box13 a{
    /* text-align: center; */
    text-decoration: none;
    margin: auto;
    text-transform: uppercase;
    /* padding-top: 10px; */
    font-size: 25px;
    color: rgb(81, 23, 23);
}
.box13:hover{
    background-color: rgb(229, 195, 6);
    border-radius: 10px;
    transform: scale(1.02);
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.5), 0 6px 20px 0 rgba(0, 0, 0, 0.5); 
}
.box13 a:hover{
    color: white;
    padding-top: 10px;
    text-decoration: none;
    text-transform: uppercase;
}
/*  */
/*  */
/*  */
/* middle2 */
.mid2{
    width: 100%;
    height: 80vh;
    padding-top: 30px;
    background: linear-gradient(to top,white,white, rgb(224, 27, 27),rgb(81, 23, 23));
    /* margin-top: 8vh; */
    /* background-color: rgb(224, 27, 27); */
}
.midrap2{
    width: 85%;
    height: 80vh;
    margin: auto;/
    padding-top: 25px;
    display: grid;
    grid-template-columns: auto auto auto auto;
    grid-column-gap: 20px;
}
.box14{
    width: 100%;
    height: 70vh;
    /* border: 2px solid black; */
    background-color: blanchedalmond;
    border-radius: 20px;
    text-align: center;
}
.box14:hover{
    transform: scale(1.02);
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.5), 0 6px 20px 0 rgba(0, 0, 0, 0.5); 
}
.box14 h1{
    font-size: 35px;
    font-style: oblique;
}
.box14 p{
    font-size: 20px;
}
.box14 s{
    font-style: italic;
    font-size: 20px;
}

.box15{
    width: 100%;
    height: 70vh;
    /* border: 2px solid black; */
    background-color: blanchedalmond;
    border-radius: 20px;
    text-align: center;
}
.box15:hover{
    transform: scale(1.02);
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.5), 0 6px 20px 0 rgba(0, 0, 0, 0.5); 
}
.box15 h1{
    font-size: 35px;
    font-style: oblique;
}
.box15 p{
    font-size: 20px;
}
.box15 s{
    font-style: italic;
    font-size: 20px;
}


.box16{
    width: 100%;
    height: 70vh;
    /* border: 2px solid black; */
    background-color: blanchedalmond;
    border-radius: 20px;
    text-align: center;
}
.box16:hover{
    transform: scale(1.02);
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.5), 0 6px 20px 0 rgba(0, 0, 0, 0.5); 
}
.box16 h1{
    font-size: 35px;
    font-style: oblique;
}
.box16 p{
    font-size: 20px;
}
.box16 s{
    font-style: italic;
    font-size: 20px;
}


.box17{
    width: 100%;
    height: 70vh;
    /* border: 2px solid black; */
    background-color: blanchedalmond;
    border-radius: 20px;
    text-align: center;
}
.box17:hover{
    transform: scale(1.02);
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.5), 0 6px 20px 0 rgba(0, 0, 0, 0.5); 
}
.box17 h1{
    font-size: 35px;
    font-style: oblique;
}
.box17 p{
    font-size: 20px;
}
.box17 s{
    font-style: italic;
    font-size: 20px;
}
/* middle2 */
.mid3{
    width: 100%;
    height: 80vh;
    /* margin-top: 15px; */
    background: linear-gradient(to bottom,white,white, rgb(224, 27, 27),rgb(81, 23, 23));
}
.midrap3{
    width: 85%;
    height: 80vh;
    margin: auto;
    display: grid;
    grid-template-columns: auto auto auto auto;
    grid-column-gap: 20px;
}
.box18{
    width: 100%;
    height: 70vh;
    /* border: 2px solid black; */
    background-color: blanchedalmond;
    border-radius: 20px;
    text-align: center;
}
.box18:hover{
    transform: scale(1.02);
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.5), 0 6px 20px 0 rgba(0, 0, 0, 0.5); 
}
.box18 h1{
    font-size: 35px;
    font-style: oblique;
}
.box18 p{
    font-size: 20px;
}
.box18 s{
    font-style: italic;
    font-size: 20px;
}

.box19{
    width: 100%;
    height: 70vh;
    /* border: 2px solid black; */
    background-color: blanchedalmond;
    border-radius: 20px;
    text-align: center;
}
.box19:hover{
    transform: scale(1.02);
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.5), 0 6px 20px 0 rgba(0, 0, 0, 0.5); 
}
.box19 h1{
    font-size: 35px;
    font-style: oblique;
}
.box19 p{
    font-size: 20px;
}
.box19 s{
    font-style: italic;
    font-size: 20px;
}


.box20{
    width: 100%;
    height: 70vh;
    /* border: 2px solid black; */
    background-color: blanchedalmond;
    border-radius: 20px;
    text-align: center;
}
.box20:hover{
    transform: scale(1.02);
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.5), 0 6px 20px 0 rgba(0, 0, 0, 0.5); 
}
.box20 h1{
    font-size: 35px;
    font-style: oblique;
}
.box20 p{
    font-size: 20px;
}
.box20 s{
    font-style: italic;
    font-size: 20px;
}


.box21{
    width: 100%;
    height: 70vh;
    /* border: 2px solid black; */
    background-color: blanchedalmond;
    border-radius: 20px;
    text-align: center;
}
.box21:hover{
    transform: scale(1.02);
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.5), 0 6px 20px 0 rgba(0, 0, 0, 0.5); 
}
.box21 h1{
    font-size: 35px;
    font-style: oblique;
}
.box21 p{
    font-size: 20px;
}
.box21 s{
    font-style: italic;
    font-size: 20px;
}
/*  */
.ban3{
    width: 100%;
    height: 90vh;
    margin-top: 70px;
    border-top-left-radius: 40px;
    border-top-right-radius: 40px;
    /* border: 2px solid white; */
}
#img1{
    border-top-left-radius: 40px;
    border-top-right-radius: 40px;
}

.banrap3{
    width: 100%;
    height: 90vh;
    /* border: 2px solid white; */
}
/*  */

.mid4{
    width: 100%;
    height: 108vh;
    /* margin-top: 8vh; */
    /* border: 2px solid black; */
    background: linear-gradient(to left,black,red,black);
    border-bottom-left-radius: 40px;
    border-bottom-right-radius: 40px;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.5), 0 6px 20px 0 rgba(0, 0, 0, 0.5);
}
.midrap4{
    width: 85%;
    height: 60vh;
    padding-top: 15px;
    margin: auto;
    display: grid;
    grid-template-columns: auto auto;
    grid-column-gap: 20px;
    /* border: 2px solid white; */
}
.box22{
    height: 58vh;
    position: relative;
    text-align: center;
    color: white;
    /* border: 2px solid white; */
}
/* Bottom left text */
.bottom-left1 {
    position: absolute;
    color: white;
    bottom: 8px;
    left: 16px;
    font-size: 20px;
    font-style: oblique;
}
.box22:hover{
    transform: scale(1.02);
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.5), 0 6px 20px 0 rgba(0, 0, 0, 0.5); 
}
.box23{
    height: 58vh;
    /* border: 2px solid white; */
    position: relative;
  text-align: center;
  color: white;
}
.bottom-left2 {
    position: absolute;
    color: white;
    bottom: 8px;
    left: 16px;
    font-size: 20px;
    font-style: oblique;
}
.box23:hover{
    transform: scale(1.02);
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.5), 0 6px 20px 0 rgba(0, 0, 0, 0.5); 
}
.midrap5{
    width: 85%;
    height: 46vh;
    padding-top: 20px;
    margin: auto;
    display: grid;
    grid-template-columns: auto auto auto;
    grid-column-gap: 20px;
    /* border: 2px solid black; */
}
.box24{
    height: 43.5vh;
    /* border: 2px solid white; */
    position: relative;
  text-align: center;
  color: white;
}
.bottom-left3 {
    position: absolute;
    color: white;
    bottom: 8px;
    left: 16px;
    font-size: 20px;
    font-style: oblique;
}
.box24:hover{
    transform: scale(1.02);
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.5), 0 6px 20px 0 rgba(0, 0, 0, 0.5); 
}
.box25{
    height: 43.5;
    position: relative;
  text-align: center;
  color: white;
    /* border: 2px solid white; */
}
.bottom-left4 {
    position: absolute;
    color: white;
    bottom: 8px;
    left: 16px;
    font-size: 20px;
    font-style: oblique;
}
.box25:hover{
    transform: scale(1.02);
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.5), 0 6px 20px 0 rgba(0, 0, 0, 0.5); 
}
.box26{
    height: 43.5vh;
    /* border: 2px solid white; */
    position: relative;
  text-align: center;
  color: white;
}
.bottom-left5 {
    position: absolute;
    color: white;
    bottom: 8px;
    left: 16px;
    font-size: 20px;
    font-style: oblique;
}
.box26:hover{
    transform: scale(1.02);
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.5), 0 6px 20px 0 rgba(0, 0, 0, 0.5); 
}
/*  
*/
/* 
*/
.ban4{
    width: 100%;
    margin-top: 40px;
}
.banrap4{
    width: 100%;
}
/*  */
/*  */
/*  */
.mid5{
    width: 100%;
    height: 115vh;
    margin-top: -29px;
    /* border: 2px solid black; */
    background-color: black;
    /* border-top-left-radius: 40px; */
    /* border-top-right-radius: 40px; */
    border-bottom-left-radius: 40px;
    border-bottom-right-radius: 40px;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.5), 0 6px 20px 0 rgba(0, 0, 0, 0.5);

}
.midrap6{
    width: 85%;
    height: 60vh;
    padding-top: 60px;
    margin: auto;
    display: grid;
    grid-template-columns: auto auto auto;
    grid-column-gap: 20px;
    /* border: 2px solid white;    */
}
.image2{
    border-radius: 40px;
}
.image2:hover{
    box-shadow: 0 4px 8px 0 rgba(255, 255, 255, 0.9), 0 6px 20px 0 rgba(255, 254, 254, 0.9); 
}
.box27{
    height: 50vh;
    padding-top: 35px;
    /* border: 2px solid white; */
    /* box-shadow: 0 4px 8px 0 rgba(255, 255, 255, 0.5), 0 6px 20px 0 rgba(255, 255, 255, 0.5); */
}

.box28{
    height: 50vh;
    padding-top: 35px;
    /* border: 2px solid white; */
    /* box-shadow: 0 4px 8px 0 rgba(255, 255, 255, 0.5), 0 6px 20px 0 rgba(255, 255, 255, 0.5); */
}

.box29{
    height: 50vh;
    padding-top: 35px;
    /* border: 2px solid white; */
    /* box-shadow: 0 4px 8px 0 rgba(255, 255, 255, 0.5), 0 6px 20px 0 rgba(255, 255, 255, 0.5); */
}

.midrap7{
    width: 85%;
    height: 60vh;
    padding-top: 35px;
    margin: auto;
    display: grid;
    grid-template-columns: auto auto auto auto auto;
    grid-column-gap: 20px;
    /* border: 2px solid white;    */
}
.box30{
    height: 40vh;
    padding-top: 35px;
    /* border: 2px solid white; */
    /* box-shadow: 0 4px 8px 0 rgba(255, 255, 255, 0.5), 0 6px 20px 0 rgba(255, 255, 255, 0.5); */
}

.box31{
    height: 40vh;
    padding-top: 35px;
    /* border: 2px solid white; */
    
}

.box32{
    height: 40vh;
    padding-top: 35px;
    /* border: 2px solid white; */
    /* box-shadow: 0 4px 8px 0 rgba(255, 255, 255, 0.5), 0 6px 20px 0 rgba(255, 255, 255, 0.5); */
}

.box33{
    height: 40vh;
    padding-top: 35px;
    /* border: 2px solid white; */
    /* box-shadow: 0 4px 8px 0 rgba(255, 255, 255, 0.5), 0 6px 20px 0 rgba(255, 255, 255, 0.5); */
}

.box34{
    height: 40vh;
    padding-top: 35px;
    /* border: 2px solid white; */
    /* box-shadow: 0 4px 8px 0 rgba(255, 255, 255, 0.5), 0 6px 20px 0 rgba(255, 255, 255, 0.5); */
}

/* 
 */
/* 
 */
.ban5{
    width: 100%;
    margin-top: 40px;
}
.banrap5{
    width: 100%;
}
.ban6{
    width: 100%;
    margin-top: -24px;
}
.mid6{
    width: 100%;
    height: 190vh;
    margin-top: -29px;
    /* border: 2px solid black; */
    background-color: rgb(95, 93, 93);
    /* border-top-left-radius: 40px; */
    /* border-top-right-radius: 40px; */
    border-bottom-left-radius: 40px;
    border-bottom-right-radius: 40px;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.5), 0 6px 20px 0 rgba(0, 0, 0, 0.5);
}
.midrap8{
    width: 85%;
    height: 62vh;
    padding-top: 25px;
    margin: auto;
    display: grid;
    grid-template-columns: auto auto;
    grid-column-gap: 20px;
    /* border: 2px solid white;    */
}
.top-left {
    position: absolute;
    top: 18px;
    left: 200px;
    font-size: 20px;
    font-style: italic;
}
.box35{
    width: 100%;
    position: relative;
        text-align: center;
        color: white;
}
.box36{
    width: 100%;
    position: relative;
        text-align: center;
        color: white;
}
.box37{
    width: 100%;
    position: relative;
        text-align: center;
        color: white;
}
.box38{
    width: 100%;
    position: relative;
        text-align: center;
        color: white;
}
.box39{
    width: 100%;
    position: relative;
        text-align: center;
        color: white;
}
.box40{
    width: 100%;
    position: relative;
        text-align: center;
        color: white;
}
.box41{
    width: 100%;
    position: relative;
        text-align: center;
        color: white;
}
.image1{
    border-radius: 40px;
}
.image1:hover{
    transform: scale(1.02);
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.9), 0 6px 20px 0 rgba(0, 0, 0, 0.9);
}
.midrap9{
    width: 85%;
    height: 62vh;
    padding-top: 25px;
    margin: auto;
    display: grid;
    grid-template-columns: auto auto auto;
    grid-column-gap: 20px;
    /* border: 2px solid rgb(17, 16, 16);    */
}
.midrap10{
    width: 85%;
    height: 62vh;
    padding-top: 25px;
    margin: auto;
    display: grid;
    grid-template-columns: auto auto;
    grid-column-gap: 20px;
    /* border: 2px solid rgb(17, 16, 16); */
}
/* 

*/
.ban7{
    width: 100%;
    margin-top: 15vh;
}
.banrap{
    width: 100%;
}
.mid7{
    width: 100%;
    height: 194vh;
    padding-top: 20px;
    /* margin-top: 20px; */
    /* border: 2px solid black; */
    background-color: white;
    /* border-top-left-radius: 40px; */
    /* border-top-right-radius: 40px; */
    border-bottom-left-radius: 40px;
    border-bottom-right-radius: 40px;
    /* box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.5), 0 6px 20px 0 rgba(0, 0, 0, 0.5); */
}
.image3{
    border-radius: 40px;
}
.image3:hover{
    transition: transform 0.1s ease-in-out;
    transform: scale(1.05);
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.8), 0 6px 20px 0 rgba(0, 0, 0, 0.8);
}
.midrap11{
    width: 90%;
    height: 62vh;
    padding-top: 25px;
    margin: auto;
    display: grid;
    grid-template-columns: auto auto;
    grid-column-gap: 20px;
    /* border: 2px solid rgb(17, 16, 16); */
}
.midrap12{
    width: 90%;
    height: 62vh;
    padding-top: 25px;
    margin: auto;
    display: grid;
    grid-template-columns: auto auto auto;
    grid-column-gap: 20px;
    /* border: 2px solid rgb(17, 16, 16); */
}
.midrap13{
    width: 90%;
    height: 62vh;
    padding-top: 25px;
    margin: auto;
    display: grid;
    grid-template-columns: auto auto;
    grid-column-gap: 20px;
    /* border: 2px solid rgb(17, 16, 16); */
}
.ban8{
    width: 100%;
}
.banrap8{
    width: 100%;
}
.mid8{
    width: 100%;
    height: 194vh;
    padding-top: 20px;
    /* margin-top: 20px; */
    /* border: 2px solid black; */
    background-color: white;
    /* border-top-left-radius: 40px; */
    /* border-top-right-radius: 40px; */
    border-bottom-left-radius: 40px;
    border-bottom-right-radius: 40px;
}
.midrap14{
    width: 80%;
    height: 62vh;
    padding-top: 25px;
    margin: auto;
    display: grid;
    grid-template-columns: auto auto;
    grid-column-gap: 20px;
    /* border: 2px solid rgb(17, 16, 16); */
}
.midrap15{
    width: 60%;
    height: 62vh;
    padding-top: 20px;
    margin: auto;
    display: grid;
    grid-template-columns: auto;
    grid-column-gap: 20px;
    /* border: 2px solid rgb(17, 16, 16); */
}
.midrap16{
    width: 80%;
    height: 62vh;
    padding-top: 20px;
    margin: auto;
    display: grid;
    grid-template-columns: auto auto auto;
    grid-column-gap: 20px;
    /* border: 2px solid rgb(17, 16, 16); */
}
/*  */
/*  */
.ban9{
    width: 100%;
}
.banrap9{
    width: 100%;
}
.mid9{
    width: 100%;
    height: 120vh;
    padding-top: 20px;
    /* margin-top: 20px; */
    /* border: 2px solid black; */
    background-color: white;
    /* border-top-left-radius: 40px; */
    /* border-top-right-radius: 40px; */
    border-bottom-left-radius: 40px;
    border-bottom-right-radius: 40px;
    border: 2px solid white;
}
.midrap17{
    width: 60%;
    height: 36vh;
    padding-top: 25px;
    margin: auto;
    display: grid;
    grid-template-columns: auto;
    /* grid-column-gap: 20px; */
    /* border: 2px solid white; */
} 
.midrap18{
    width: 60%;
    height: 36vh;
    /* padding-top: 25px; */
    margin: auto;
    display: grid;
    grid-template-columns: auto;
    /* grid-column-gap: 20px; */
    /* border: 2px solid white; */
}   
.image4{
    border-radius: 40px;
}
.image4:hover{
    transition: transform 0.1s ease-in-out;
    transform: scale(1.05);
    box-shadow: 0 4px 8px 0 rgba(15, 15, 15, 0.8), 0 6px 20px 0 rgba(15, 15, 15, 0.8);
} 
.midrap19{
    width: 60%;
    height: 36vh;
    /* padding-top: 25px; */
    margin: auto;
    display: grid;
    grid-template-columns: auto auto;
    grid-column-gap: 20px;
    /* border: 2px solid white; */
} 
/* Footer */
.foot{
    width: 100%;
    height: 50vh;
    background-color: rgb(45, 45, 57);
    /* border: 2px solid black; */
  }
  .footrap{
    width: 90%;
    /* border: 2px solid black; */
    padding-top: 25px;
    margin: auto;
    display: grid;
    grid-template-columns: auto auto auto auto auto;
    grid-column-gap: 20px;
  }
  .box59{
    width: 100%;
    /* border: 2px solid black; */
    text-align: center;
  }
  .box59 h1{
    font-size: 25px;
    color: white;
    font-style: oblique;
  }
  .box59 ul{
    text-align: center;
    list-style: none;
  }
  .box59 ul li a{
   color: white;
   font-size: 15px; 
   font-style: italic;
   text-decoration: none;
  }
  .box60{
    width: 100%;
    /* border: 2px solid black; */
    text-align: center;
  }
  .box60 h1{
    font-size: 25px;
    color: white;
    font-style: oblique;
  }
  .box60 ul{
    text-align: center;
    list-style: none;
  }
  .box60 ul li a{
   color: white;
   font-size: 15px; 
   font-style: italic;
   text-decoration: none;
  }
  .box61{
    width: 100%;
    /* border: 2px solid black; */
    text-align: center;
  }
  .box61 h1{
    font-size: 25px;
    color: white;
    font-style: oblique;
  }
  .box61 ul{
    text-align: center;
    list-style: none;
  }
  .box61 ul li a{
   color: white;
   font-size: 15px; 
   font-style: italic;
   text-decoration: none;
  }
  .box62{
    width: 100%;
    /* border: 2px solid black; */
    text-align: center;
  }
  .box62 h1{
    font-size: 25px;
    color: white;
    font-style: oblique;
  }
  .box62 ul{
    text-align: center;
    list-style: none;
  }
  .box62 ul li a{
   color: white;
   font-size: 25px; 
   font-style: italic;
   text-decoration: none;
  }
  .box63{
    width: 100%;
    /* border: 2px solid black; */
    text-align: center;
  }
  .box63 iframe{
    border-top-left-radius: 15px;
    border-top-right-radius: 15px;
    border-bottom-left-radius: 15px;
    border-bottom-right-radius: 15px;
  }
  .footfinal{
    width: 100%;
    height: 10vh;
    background-color: rgb(45, 45, 57);
  }
  .footfinalrap{
    width: 90%;
    margin: auto;
  }
  .menulast{
    text-align: center;
  }
  .menulast p{
    color: white;
    font-size: 15px;
    font-style: oblique;
  }