@media screen and (max-width : 1200px){

    .card-kotak{
        width: 800px;
        height: 700px; 
    }

    .card-alamat{
        width: 320px;
        height: 420px; 

    }

    .rounded{
        width: 800px;
        height: auto;
        
    }

      .card-detail{
        height: 700px;
        width: 900px;
        
        
    }

}

@media screen and (max-width : 922px) {
    .hero-tegline h1{
        line-height: 70px;
    }

    .img-hero{
        width: auto;
        height:40%;        
    }

    .card-kotak{
        width: 500px;
        height: 979px; 
    }

    .card-alamat{
        width: 420px;
        height: 375px;         
    }

    .card-alamat h3{
        font-size: 12px;
    }

    #alamat p{
        font-size: 10px;
    }

    .rounded{
        width: 740px;
        height: auto;
        
    }

    .card-detail{
        height: 700px;
        width: 700px;
    }

}


@media screen and (max-width : 768px) and (max-width : 576px)  {

    .hero-tegline h1{
        line-height: 70px;
    }

    .img-hero{
        width: auto;
        height:35%;        
    }

    h2{
        font-size: 48px;
    }

    .sub-title{
        font-size: 16px;
    }

    .card-info{
        margin: 15px 10px;
    }

    .card-kotak{
        width: 500px;
        height: 1000px; 
    }

    .card-alamat{
        width: 420px;
        height: 400px;         
    }

    .card-alamat h3{
        font-size: 16px;
    }
  
    #Kontak h3{
        font-size: 20px ;                 
    }
    .copyright {
        text-align: center;
    }

    .rounded{
        width: 500px;
        height: 500px;
        
    }

    .card-detail{
        height: 700px;
        width: 500px;
    }

    #perusahaan h2{
        font-size: 24px ;
        
    }    
}

@media screen and (max-width : 350px) {
    .img-hero{
        width: auto;
        height:90%;        
    }
}