@media screen and (max-width: 1032px) {
   
   
   .service_container {
        display: flex;
        flex-direction: column;
        gap: 50px;
        background-color: transparent;
    }
    .service_container2 {
        display: flex;
        flex-direction: column;
        gap: 50px;
        background-color: transparent;
        
    }
    .left, .left1, .left2, .left3, .left4, .left5, .left6 {
       width: 100%;
       height: 500px;
       background-color: transparent;
    }
    .left1, .left3, .left4, .left5 {
        order: -1;
    }
    .right {
       width: 100%;
       height: 500px;
       background-color: transparent;
    }
    .btn_service {
        display: none;
    }
}

@media screen and (max-width: 900px) {
   .goofy_container_title {
      font-size: 25px;
   }
}





@media screen and (max-width: 307px) {
    .service_container {
        display: flex;
        flex-direction: column;
        gap: 50px;
    }
    .left {
       width: 200px;
       height: 300px;
       z-index: auto; 
    }
    .left1 {
       width: 200px;
       height: 300px;
       z-index: auto; 
    }
    .left2 {
       width: 200px;
       height: 300px;
       z-index: auto; 
    }
    .left3 {
       width: 200px;
       height: 300px;
       z-index: auto; 
    }
    .left4 {
       width: 200px;
       height: 300px;
       z-index: auto; 
    }
    .left5 {
       width: 200px;
       height: 300px;
       z-index: auto; 
    }
    .left6 {
       width: 200px;
       height: 300px;
       z-index: auto; 
    }
    .right {
        width: 200px;
       height: 500px;
       z-index: auto; 
    }
}