
/* Normal desktop :1200px. */
@media (min-width: 1500px) and (max-width: 1900px) {
    
    body{
        font-size: 11px;
    }

    .info_right,.info_left,.img-none{
        font-size:16px;
      }
}
/* Normal desktop :1200px. */
@media (min-width: 1200px) and (max-width: 1500px) {
    
    body{
        font-size: 8px;
    }
    .info_right,.info_left,.img-none{
        font-size:14px;
      }
}


/* Normal desktop :992px. */
@media (min-width: 992px) and (max-width: 1199.98px) {
    body{
        font-size:8px;
    }

    .home h1{
        line-height:80px;
    }
    .info_right,.info_left,.img-none{
        font-size:14px;
      }
}



 
/* Tablet desktop :768px. */
@media (min-width: 768px) and (max-width: 991.98px) {
    body{
        font-size:6px;
    }

    .home h1{
        line-height:60px;
    }

    .about{
        flex-direction: column;
        justify-content:center;
        align-items: center;
        height: auto;
    }

    .right_bg{
      margin-top: 20px;
      padding: 5% 0;
      width: 100%;
    }
    

    .right {
      width: 60%;
      height:90%;
        border-radius: 10px;
        overflow: hidden;
        box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.3);
      }
      
      .right img {
        width: 100%;
        height: 100%;
      }
      .left h1{
        font-size:40px;
      }
      .left h4{
        font-size: 28px;
      }
      .left .content{
        font-size: 18px;
      }

      .left span{
        font-size: 18px;
      }
      .left button{
        font-size: 18px;

      }
      .info_box{
        width: 100%;
      }
      .img-none{
        min-height: 500px;
      }
      .info_right,.info_left,.img-none{
        font-size:20px;
      }
}




 
/* small mobile :320px. */
@media (min-width: 576px) and (max-width: 767.98px) {
    body{
        font-size:4px;
    }

    .home h1{
        line-height:60px;
    }
    .about{
        flex-direction: column;
        justify-content:center;
        align-items: center;
        height: auto;
    }

    .right_bg{
      margin-top: 20px;
      padding: 5% 0;
      width: 100%;
    }
    

    .right {
      width: 60%;
      height:90%;
        border-radius: 10px;
        overflow: hidden;
        box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.3);
      }
      
      .right img {
        width: 100%;
        height: 100%;
      }
      .left h1{
        font-size:40px;
      }
      .left h4{
        font-size: 28px;
      }
      .left .content{
        font-size: 18px;
      }

      .left span{
        font-size: 18px;
      }
      .left button{
        font-size: 18px;

      }
      .info_box{
        width: 100%;
      }
      .info_left{
        width: 30%;
      }
      .info_right{
        width: 70%;
      }
      .img-none{
        min-height: 500px;
      }
      .info_right,.info_left,.img-none{
        font-size:16px;
      }
}





/* Large Mobile :480px. */
@media only screen and  (max-width: 575.98px) {

    body{
        font-size:4px;
    }

    .home h1{
        line-height:60px;
    }
    .about{
        flex-direction: column;
        justify-content:center;
        align-items: center;
        height: auto;
    }
    .right_bg{
      margin-top: 20px;
      padding: 5% 0;
      width: 100%;
    }
    

    .right {
      width: 60%;
      height:90%;
        border-radius: 10px;
        overflow: hidden;
        box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.3);
      }
      .w{
        width: 90%;
      }

      .right img {
        width: 100%;
        height: 100%;
      }
      .left h1{
        font-size:40px;
      }
      .left h4{
        font-size: 28px;
      }
      .left .content{
        font-size: 18px;
      }

      .left span{
        font-size: 18px;
      }
      .left button{
        font-size: 18px;

      }
      .info_box{
        width: 100%;
      }
      .info_left{
        width: 30%;
      }
      .info_right{
        width: 70%;
      }
      .img-none{
        min-height: 500px;
      }
      .info_right,.info_left,.img-none{
        font-size:14px;
      }
}
