/*Small devices (landscape phones, 576px and up)*/
@media (min-width: 576px) {
    .navbar {
        padding: .5rem 1rem;
        font-size: 14px;
    }
    .contactbar-blue .container {
        margin: 0;
        width: 100%;
        float: right;
        display: block;
        margin-left: 15%;
    }
    .navbar-brand img {
        width: 65px;
    }
    .icon-box-title img{
        width: 2rem;
    }
    .icon-box-title span h1 {
        font-size: 16px;
    }
    .icon-box-title span p {
        font-size: 12px;
    }
    .about-box, .product-box, .service-box{
        padding: 5% 0;
    }
    .title-content-right {
        font-size: 20px;
        background-size: 17% !important;
        background-position:  right 8rem top ;
    }
    .title-content-left{
        font-size: 20px;
        background-size: 17% !important;
        background-position:  left 7rem top ;
    }
    .menu-product ul {
        margin: 4% auto;
    }
    .product-detail-box{
        margin: 18% auto 5%;
    }
    .titlename-service {
        padding-left: 3rem;
    }
    .footer {
        font-size: 14px;
    }
}
/*Medium devices (tablets, 768px and up)*/
@media (min-width: 768px) {
    .menufull-white .col-12{
        padding: 0;
    }
    .navbar-nav {
        width: 80%;
    }
   .navbar-collapse ul li {
        width: 23%;
        padding: 10px 0;
       text-align: center;
    }
    .navbar-collapse ul li.width-spac-1{
        width: 30%;
    } 
    .navbar-collapse ul li.width-spac-2{
        width: 15%;
    } 
    .social-mobile{
        width: 20%;
        margin: 0;
    }
    .social-mobile img {
        padding: 0;
        width: 1.8rem;
        transition: all 0.5s;
    }
    .social-mobile img:hover {
        transform: scale(1.05);
    }
    .navbar-brand {
        width: auto;
        padding: 0;
        margin: 0;
        text-align: left;
    }
    .hamburgers-box{
        padding: 10px;
    }
    .icon-box-title span h1 {
        font-size: 14px;
    }
    .title-content-right {
        text-align: left;
        font-size: 22px;
        background-size: 6rem !important;
        background-position: right 26rem top;
    }
    .title-content-left {
        text-align: left;
        font-size: 22px;
        background-size: 6rem !important;
        background-position: left 0rem top;
    }
    .title-content-right.title-content-right-1{        
        margin-bottom: 2rem;
        background-position: right 18rem top;
    }
    .img-about {
        width: 100%;
        margin: 10% auto;
    }    
    .detail-about {
        margin: 10% auto 0;
    }    
    .menu-product ul {
        margin: 0 auto;
    }
    .titlename-service {
        padding-left: 7rem;
    }
    .slide-portfolio{
        margin-top: 2rem;
    }
    .address-footer{
        margin: 0 auto;
    }
    .footer h1{
        font-size: 18px;
    }
    .menu-footer ul li{
        padding: 5px 0;
    }
}
/*///////////////////////////////////////////////////////////////////////////////////*/
/*Large devices (desktops, 992px and up)*/
@media (min-width: 992px) {
   .icon-box-title img {
        width: 3rem;
    }
    .icon-box-title span h1 {
        font-size: 18px;
    }
    .icon-box-title span p {
        font-size: 13px;
    }
    .title-content-right {
        font-size: 27px;
        background-size: 7rem !important;
        background-position: right 37rem top;
    }
    .detail-about {
        font-size: 18px;
    }
    .title-content-left {
        font-size: 27px;
        background-size: 7rem !important;
    }
    .menu-product ul li {
        font-size: 20px;
    }
    .title-content-right.title-content-right-1 {
        margin-bottom: 3rem;
        background-position: right 27rem top;
    }
    .readmore-btn{
        font-size: 18px;
    }
    .readmore-btn img {
        width: 1.8rem;
    }
    .titlename-service h1 {
        font-size: 28px;
    }
    .titlename-service p {
        font-size: 18px;
    }
    .titlename-service {
        padding-left: 13rem;
    }
    .readmore-hover h1 {
        padding: 10px;
        font-size: 18px;
        margin-bottom: .5rem;
    }
    .readmore-hover a {
        font-size: 18px;
    }
    .detailtitle-portfolio .readmore-hover img {
        width: 1.8rem;
    }
    .social-footer {
        text-align: left;
        padding-left: 4rem;
        margin-top: .75rem;
    }
    .footer {
        font-size: 16px;
    }
    .menu-footer ul li {
        padding: 3px 0;
    }
    .navbar-nav {
        width: 78%;
    }
    .social-mobile{
        width: 15%;
    }
    .navbar-collapse ul li{
        font-size: 20px;
    }
    .social-footer img{
        transition: all 0.5s;
    }
    .social-footer img:hover{
        transform: scale(1.05);
    }
    .address-footer img{
        width: auto;
    }
} 
/*///////////////////////////////////////////////////////////////////////////////////*/
/*Extra large devices (large desktops, 1200px and up)*/
@media (min-width: 1200px) {
      .container{
        max-width: 1230px;
    }
    .social-mobile img {
        width: auto;
    }
    .navbar {
        font-size: 18px;
    }
    .navbar-brand img {
        width: 142px;
        transition: all 0.5s;
    }
    .slim .navbar-brand img {
        width: 85px;
    }
    .navbar-nav {
        width: 80%;
    }
    .hamburgers-box {
        padding: 0;
    }
    .icon-box-title span h1 {
        font-size: 22px;
    }
    .icon-box-title span p {
        font-size: 16px;
    }
    .title-content-right {
        font-size: 36px;
        background-size: 176px !important;
        background-position: right 51rem top;
        padding: 29px 0;
    }
    .img-about {
        margin: 10% auto 0;
    }
    .menu-product ul li {
        font-size: 22px;
    }
    .title-content-left {
        font-size: 36px;
        background-size: 178px !important;
        padding: 29px 0;
        padding-left: 20px;
    }
    .readmore-hover-product h1 {
        font-size: 20px;
        width: 45%;
        text-align: center;
    }
    .title-content-right.title-content-right-1 {
        margin-bottom: 4rem;
        background-position: right 32rem top;
    }
    .readmore-btn{
        margin-top: 30%;
    }
    .titlename-service {
        padding-left: 20rem;
    }
    .titlename-service h1 {
        font-size: 35px;
    }
    .titlename-service p {
        font-size: 20px;
    }
    .portfolio-box{
        padding: 5% 0;
    }
    .footer {
        font-size: 18px;
    }
    .footer h1 {
        font-size: 24px;
    }

}
/*///////////////////////////////////////////////////////////////////////////////////*/
/*Extra large devices (large desktops, 1600px and up)*/
@media (min-width: 1700px) {  
/*    .container{
        max-width: 1440px;
    }*/
}
/*///////////////////////////////////////////////////////////////////////////////////*/
@media (min-width: 2000px) {
}