@media only screen 
and (min-width : 320px) 
and (max-width : 812px) {
    #inspector{opacity: 0;}
    #hometxtcon{width: 100%;left: 0px;}
    .t1{width: 100%; text-align: left; padding-left: 30px; box-sizing: border-box; top:10px; margin-top: 0px;font-size: 17px; opacity: 0.65;}
    .t2{font-size: 31px; text-align: left;margin-top: 10px; padding-left: 30px; box-sizing: border-box;}
    #scrollicon{left: 30px;}
    #logomob{display: block;}
    #topmenu{display: none;}
    #aboutcon{left: 30px;margin-top: -45px; width: 54%;}
    .title{font-size: 17px;}
    .text{font-size: 13px;}
    #aboutxt{height: 155px; overflow: hidden;}
    #clientxt{height: 155px; overflow: hidden;}
    #sertxt{height: 155px; overflow: hidden;}
    #sectxt{height: 155px; overflow: hidden;}
    .button{font-size: 12px;}
    .button_w{font-size: 12px;}
    #slogan1{font-size: 19px; width: 100%; left: 0px; text-align: center; margin-top: -100px;}
    #slogan2{font-size: 25px; width: 100%; left: 0px; text-align: center; margin-top: -120px;}
    #bgslog{display: none;}
    #bgslog2{display: block;}
    .icon{background-size: 55%; margin-top: 5px;}
    .icontxt{font-size: 13px;top: 60px;}
    #s2{margin-left: -200px;}
    #s4{margin-left: 0px;}
    #sectors{height: 500px;}
    #sectortable{width: 100%;left: 0px; margin-left: 0px; margin-top: -50px;}
    .sectorcell{width: 80%; left: 10%;}
    .sectortxt{font-size: 13px;}
    .sectortxt2{font-size: 13px;color: white;
    font-weight: 500;
    text-transform: uppercase;
    padding: 20px;
    padding-left: 70px;
    text-align: left;
    box-sizing: border-box;
    border-left: 2px solid rgba(255,255,255,0.25);
    background-color: rgba(27, 42, 65, 0.3);
    transition-duration: 0.2s;
    clip-path: polygon(0% 0%, 75% 0%, 100% 50%, 75% 100%, 0% 100%);
    -webkit-clip-path: polygon(0% 0%, 75% 0%, 100% 50%, 75% 100%, 0% 100%);}
    .sectoricon2{width: 40px;
    height: 40px;
    top:10px;
    left: 15px;
    position: absolute;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    z-index: 100;}
    #clientscon{margin-top: -35px; right: 30px;}
    #contactcon{padding:30px;top:0px; width: 300px;;box-sizing: border-box; left: 0px; }
    #officebar{height: auto;}
    .office{height: 150px; padding: 0px; left: 30px; border: none;}
    #contact{height:800px;clip-path: polygon(0 0, 100% 0%, 100% 100%, 0% 100%);
    -webkit-clip-path: polygon(0 0, 100% 0%, 100% 100%, 0% 100%);}
    .cityname{left: 60px; font-size: 13px; top: 35px;}
    .textoffice{font-size: 13px;}
    #map{width: 100%; height: 200px; top: 30px; position: relative;}
    #sitemap{position: relative; width: 100%; left: 0px; margin-top: 0px; display: none;}
    #footer{height:70px; position: relative; font-size: 8px; padding: 30px 30px;}
    #site{height: 230px;}
    #innertitle{text-align: left; width: 100%; left: 0px; font-size: 20px; top: 30px; padding-left: 30px;box-sizing: border-box;}
    #innersub{text-align: left; width: 100%; left: 0px; font-size: 30px; top: 5px; padding-left: 30px; box-sizing: border-box;}
    #detailcon{width: 100%; left: 0px; padding-left: 30px; padding: 30px; box-sizing: border-box; top: 0px;}
    #innercon{width: 100%; padding: 30px; box-sizing: border-box; left: 0px;
    top: 70px;}
    #scrollicon_b{left: 30px; bottom: 75px;}
    #bgfront{display: none;}
    #innerdetail{padding-bottom: 0px;}
    #swan{width: 20px;}
    #servicecon{top: -10%}
    #mobmenubtn{display: block;}
    #mobmenubtn_w{display: block;}
    #logopre{margin-left: -65px; margin-top: -60px; width: 130px;}
    #pretxt{margin-left: -80px; margin-top: -10px; font-size: 18px; letter-spacing:px;}
}