@media only screen and (max-width:1199px){
    .name{font-size: 1.2rem;}
    .break2-text,.break3-text,.break4-text{font-size: 60px;}
    .hero h2 {margin: 20vh 7vw 8vh;}
    .per2{position:unset;}
    .foundation{margin-bottom: 30vh;}
    .leg-info img{top:9%;bottom:auto;}
    .leg-info p{line-height: 1.5;width: 64%;}
    .ytu-info img{top:20%;bottom:auto;}
    .ytu-info p{line-height: 1.5;}

}
@media only screen and (max-width:1140px){}
@media only screen and (max-width:1024px){
    .ytu-info{padding-right: 0vw;padding-left: 3vw;}
    .leg-info p{width: 60%;}
}
@media only screen and (max-width:992px){}
@media only screen and (max-width:991px){
    .hero-main { margin-top: 15vh;}
    .per2{align-items: start;margin-top: 4%;}
    .info p{line-height: 1.5;}
    .break2-text, .break3-text, .break4-text {font-size: 5vw;margin: 0; color: #fff;}
    .break2,.break3,.break4{background-color: #878B7F;padding: 15px;margin-top: 0;}
    .break2::before,.break3::after,.break4::before{display:none;}
    .leg-info p { width: 58%; }
    .break3-text { margin-left: 0; margin-bottom: 15px; }
    .last-sec{margin-top: 7vh;font-size: 1rem;line-height: 1.3;}
    .footer {margin-top: 10vh;}
    .hero-img {height: 100vh;}
    .behind { left: 33vw; top: -3vh; width: 15vw; }
    .navbar a {margin: 0 1rem;}
    .leg-info{margin-top: 4%;gap: 15px;}
    .leg-info img{top: 0;position: unset;}    

    .foundation { margin-bottom: 16vh; }
    .ytu,.break5{margin-top: 10vh;}
    
    
}
@media only screen and (max-width:769px){
  
}
@media only screen and (max-width:768px){
    .hero-mob{
        position: absolute;
        top: 10%;
        left: 32%;
    }
    .hero-main{height: auto;}
    .hero h2 { margin: 6vh 7vw 0; }
    .foundation { margin-bottom: 7vh; }
    .leg-info img{position:unset;}
    .legacy { margin-top:5vh;}
    .break3 { margin-top: 0;}
    /* .break3-text { margin-top: 7vh;} */
    .underline{display:none;}
    .leg-info{flex-direction: column;gap: 20px;}
    .leg-info p { width: 100%; }
    .ytu-info img{position:unset;margin-top: 3%;}
    .ytu { margin-top: 6vh;}
    .break4 {margin: 0 auto 30px;width:100%;}
    .break4-text { margin-top: 0;}
    .break5 { margin-top: 10vh;}
    .break5 img{height:auto;}
    /* .break2{width: 80%;} */
    .foot-icon{order:1;}
    .footer > P {order:2;}
    .footer > .foot-in {order:3;}
    .footer {flex-direction: column; row-gap: 5px; }
    .per1{margin-bottom:0vh}
    .foundation {margin-top: 4vh;}
    nav ul li{margin: 25px 0;}
    .nav-bg {background-color: #102020;height: 110px;}


}
@media only screen and (max-width:678px){
    .break2-text, .break3-text, .break4-text {font-size: 1.5rem;margin: 0;}
    .last-sec{font-size: 0.6rem;}
    
}
@media only screen and (max-width:567px){
    .name2{padding-left: 63vw;margin-top: 18vh;}
    .hero-main {margin-top: 10vh;margin-left: 2vw;}
    .name1 span { padding-left: 0vw; }
    .behind {left: 52vw;}
    .hero h2{margin: 3vh 2vw 0;}
    .break5 {margin-top: 5vh;}
    .last-sec {margin-top: 4vh;}
    .footer { margin-top: 4vh; }   
    .ytu-info img,.leg-info img{width: 100%;} 
}
@media only screen and (max-width:481px){
    .name2 {padding-left: 48vw;margin-top: 25vh;}
    .hero-mob{left: 22%;}
    .behind {left: 47vw;top: 5vh;}
    .name2 span {padding-left: 0;}
    
}
@media only screen and (max-width:320px){}