﻿
/*--------------- @media (max-width:1199){ -------------------------*/
@media (max-width:1199px) {
     #header > .container > .main-menu > nav{width:320px!important}
     /*.btnShowSubmenu{display:block;font-size:40px;color:#000;text-align:center;line-height:40px}*/
     
  #menuPc{display:none}
  .main-menu-mobile{display:block;order:4}
  .login{display:none}
   #header > .container > .main-menu-mobile > a#condensed-menu {
        display: block;
        height: 100%;
        padding: 23px 0px 23px 18px;
        position: relative; }
        #header > .container > .main-menu-mobile > a#condensed-menu:hover {
          cursor: pointer; }
        #header > .container > .main-menu-mobile > a#condensed-menu > span {
          display: block;
          width: 24px;
          height: 3px;
          background-color: #333333;
          position: relative;
          border-radius: 3px;
          top: 0px; }
          #header > .container > .main-menu-mobile > a#condensed-menu > span.line-2 {
            top: 5px; }
          #header > .container > .main-menu-mobile > a#condensed-menu > span.line-3 {
            top: 10px; }

    .contentMenuMobile {
        background: #fff;
        width: 320px;
        position: absolute;
        right: 0px;
        top: 60px;
        display: none;
        padding-bottom: 10px;
        /*min-height: 380px;*/
        border: 1px solid #DEDEDE;
    }
          .contentMenuMobile .nav-item{position:relative}
          .contentMenuMobile .nav-item > a{color:red;line-height:40px;display:block;width:100%;padding:0 10px;font-size:14px;font-weight:bold;text-transform:uppercase;color:#000}
          .contentMenuMobile .nav-item .submenuMB{padding:0 15px;display:none}
          .contentMenuMobile .nav-item .submenuMB ul li{ line-height: 40px;
                  height: 40px;
                  display: block;
                  padding-left: 10px;
                  min-width: 200px;
                  color: #000000;
                  background: rgba(255, 255, 255, 0.9);
                  text-decoration: none;margin-bottom:1px;}
          .contentMenuMobile .nav-item .submenuMB ul li a{color:#000}
 
          .btnShowSubmenu{    width: 28px;
    height: 28px;
    background: #dfdfdf;
    font-size: 20px;
    line-height: 25px;
    text-align: center;
    position: absolute;
    top: 7px;
    right: 5px;}         

          .contentMenuMobile .nav-item.search{padding:0 10px}
          .contentMenuMobile .nav-item.search input{    width: calc(100% - 90px);}
          .contentMenuMobile .nav-item.search button{    background: #055d8c;
    border: 0;
    color: #fff;
    padding: 0 10px;
    height: 26px;}
          

}

/*--------------- @media (max-width:1024){ -------------------------*/
    @media (max-width:1024px) {
     

    }
    
/*  =========================   @media (max-width:991px) ==================================*/
@media (max-width:991px) {
  .page-content > .content-wrapper > .content img{height:auto!important;width:100%!important;max-width:100%!important}
  .content-mb img{height:auto!important;width:100%!important;max-width:100%!important}
  #banner > img{    object-fit: cover;
    object-position: top left;}
   #copyright > .container > .social{position:initial;float:left;width:100%}
#copyright > .container > .social > a:first-child{width:100px}
   #copyright > .container > .social > a{float:left;width:calc((100% - 100px) / 4);text-align:center}
   #copyright > .container > p{float:left;clear:both;padding-top:0}

   #main-content > .body > .container > .row > div > .invoices > .invoice-carousel ul#image-gallery > li img{width:100%!important}
}

/*  =========================   @media (max-width:767px) ==================================*/
@media (max-width:767px) {
  #slide .item > .container{}
  #slide .item > a{position:initial!important}
  #slide .item > a > img{height:auto!important}

  #introduction a.btn-1{width:100%}
  #versions a.btn-1{width:100%}
  #experience > .container > .title > div{display:initial!important}
  #experience a.btn-2{display: block;
    width: 160px;
    position: relative;
    float: right;}
  #experience a.btn-2::after{position:absolute;right: 15px;
    top: 10px;}

   #news > .container > .title > div{display:initial!important;margin-bottom:15px}
  #news a.btn-2{display: block;
    width: 160px;
    position: relative;
    float: right;}
  #news a.btn-2::after{position:absolute;right: 15px;
    top: 10px;}
  .page-hddt{height:auto!important;overflow:hidden}
  .page-hddt img{width:auto!important;margin-bottom:10px;height:34px}
  #banner > .content > .container > .row > div:last-child > form.search{padding-left:30px}

  .hideInMobile{display:none!important}
  .showInMobile{display:block!important}

  #top-customers > .container > .row > div:first-child{display:initial!important}
   #top-customers a.btn-2{display: block;
    width: 160px;
    position: relative;
    float: right;}
  #top-customers a.btn-2::after{position:absolute;right: 15px;
    top: 10px;}
  
}

/* ----------------------@media (max-width:550px){ -------------------------*/
@media (max-width:550px) {
  .rps-mb-pdl15-pdr15{padding-left:15px!important;padding-right:15px!important}
}

/* ----------------------@media (max-width:479px){ -------------------------*/
@media (max-width:479px) {
    
}
/* ===================== @media (max-width:320px) { ================================== */
@media (max-width:320px) {
   
}