﻿



/* Tablets Start */
@media only screen and (max-width:1199px){
    .headerNav {position:fixed; left:0; top:0; width:360px; height:100%; background:#fff;transition:0.2s all ease-in-out;padding-top:90px; transform:translateX(-100%);}
    .headerNav .level0 {height:100%; overflow:auto;}
    .bannerContents {width:80%; left:50%; transform:translate(-50%,-50%);text-align:center;}
    .touchPanelHeader {position:absolute; left:0; top:0; width:100%;}
    .showNav .headerNav {transform:translateX(0)}
    .level0 > li > a {color:#000;padding: 10px 0;margin-bottom: 8px;border-bottom: 1px solid #efefef;font-size:17px;}
    .level0 > li {margin: 0 20px;}
    .utbars {display:inline-block; font-size:24px; color:#fff;vertical-align:middle; padding:12px;margin:15px 0;border-radius:5px; border:1px solid transparent;transition:0.2s all ease-in-out}
    .utbars:hover,.utbars:focus,.utbars:active {color:#fff;}
    .showNav .utbars {background:#fff; color:#951b1e;border-color:#951b1e;}
    .level1, .level2 {display:none;}
    .subNav0,
    .subNav0 a {transition:all 0.2s linear;}
    .subNav0 > a:after,
    .subNav1 > a:after {font-family: "utrade" !important;  font-style: normal !important;  font-weight: normal !important;  font-variant: normal !important;  text-transform: none !important;  speak: none;  line-height: 1;  -webkit-font-smoothing: antialiased;  -moz-osx-font-smoothing: grayscale;content:"\66";position:absolute; right:0; top:50%; transform:translateY(-50%);color:#951b1e;}
    .subNav0.open > a:after,
    .subNav1.open > a:after {content:"\67";}
    .subNav0.open > a,
    .subNav1.open > a {color:#951b1e;font-weight:900;} 
    .level1 a {margin:0;}
    .level2 a {margin:0 10px;}
    .level1,
    .level2 {margin-bottom:10px;}
    .touchPanelHeader {text-align:center;}
    .touchPanelHeader .headLogo {display:inline-block;}
    .touchPanelHeader .closePanel {position:absolute;left:0; top:50%;transform:translateY(-50%);display:block; padding:22px 15px; font-size:40px;}
    .aboutImgs {margin-bottom:60px;}
    .aboutImgs img {width:90%;}
    .aboutImgs img.oLappingImg {display:none;}
    .serviceBoxDetail article h6 {font-size:18px;}
    .serviceBoxDetail article h5 {font-size:20px;}
    .serviceBox:hover .serviceBoxDetail article {left: 20px;bottom: 20px;}
    .whyInner {padding:40px 20px;}

}
@media only screen and (max-width:1182px){

    .utAboutVideo .video {position:relative; transform:translateX(-50%); top:initial; min-width:initial; max-width:initial;margin-bottom:50px;}

    .utAboutVideo {width:80%; margin:0 auto;}

}





@media only screen and (min-width:1200px){
    .touchPanelHeader,
    .utbars {display:none;}
    .level0 > li {float:left;margin:0 10px;}
    .level0 > li > a:after {content:""; display:block; position:absolute; left:0; top:100%; width:0; height:2px; background:rgba(256,256,256,1);transition:0.2s all linear;}
    .level0 > li:not(.subNav0):hover > a:after {width:100%;z-index:-1;}
    .level0 > li:hover .level1,
    .level1 > li:hover .level2 {display:block;z-index:90}
    .level1, .level2 {display: none;position: absolute;min-width:300px;}
    .level1 li:hover > a, .level2 li:hover > a {border-bottom-color:#951b1e; color:#951b1e;}
    .subNav1 > a:after {font-family: "utrade" !important;  font-style: normal !important;  font-weight: normal !important;  font-variant: normal !important;  text-transform: none !important;  speak: none;  line-height: 1;  -webkit-font-smoothing: antialiased;  -moz-osx-font-smoothing: grayscale;content:"\70";position:absolute; right:0; top:50%; transform:translateY(-50%);color:#951b1e;}
    .level0 > li.myAccLi {float:right;}
}
/* Tablets end */
@media only screen and (min-width:1024px){
    .DBPanelSwitchM {display:none;}
}
@media only screen and (max-width:1023px){
    body, header {padding-left:0;}
    .DBPanelSwitchM {display:block;position:absolute; right:0; top:0;z-index:999;}
    .DBPanel .DBPanelSwitchM a {padding:22px 5px;color:#fff;transform: rotate(45deg);display:block;}
    .DBPanel .DBPanelSwitchM a i {font-size:inherit;}
    .DBMainHome {text-align:left;}
    .DBPanel {transform: translateX(-100%);}
    body.DBPanelClose .DBPanel {transform: translateX(0);}
    body.DBPanelClose .DBMainHome a,
    .headerTop #logo a:not(.DBPanelSwitch) {visibility:visible;opacity:1;margin-left:0;}
    
}

@media only screen and (max-width:991px){
    .processDetailImg {max-height:300px; padding:0;}
    .processDetailImg img {position:relative;}
    a.icon-play {left:50%; top:0; transform:translate(-50%, -50%);}
    .projectBoxWrap {margin-bottom:30px;}
    .footerAbout {padding-right: 15px;}
    .projectDescriptionM {margin-top:15px;}
    .achieveImg {margin-bottom:80px;}
}


@media only screen and (max-width:767px){
    .bannerContents h1 {font-size:40px;}
    .bannerContents p {font-size:16px;}
    .processDetail {padding:80px 40px;}
    footer .col-md-3 h6 {margin-top:30px;}
    .footerAbout {padding-right: 0;}
    .copyrightsArea {text-align:center;}
    .achieveImg {margin-bottom:50px;}
    .tabRegulationContent {width:100%;}
    .loggedMenu .userInfo {display:block;}
    .loggedName,
    .loggedDesig {display:none !important;}
    .notifications {margin-right:5px;}
    .mCenteredChecks {text-align:center;margin-bottom:5px;}
}
@media only screen and (max-width:640px){
    .cFiledTable > tbody > tr > td {width:100%;display:block;border-left:none !important;}
    .alUser .fl,
    .alUser .fr {float:none; display:block; text-align:center; }
    .alUser .fr b {display:none;}
    .alUser .fl {padding-bottom:15px;}
}

@media only screen and (max-width:575px){
    .aboutImgs .experience h4 {font-size:40px;}
    .aboutImgs .experience p {font-size: 18px;}
    .aboutImgs {margin-bottom:100px;}
    .aboutBox h2,
    .servicesSection h2,
    .whyUs h2,
    .sHeading,
    .processDetail h2 {font-size:32px;}
    .processDetail {padding:80px 30px;}
    .achieveImg {width: 90%;margin-left: auto;margin-right: auto;}
    .greySection.tabsOverlapBG {padding:0; background:transparent;}
    .tabsOverlapInner, .resultsWrap {padding-left:0; padding-right:0;}
    .footer {font-size:14px; text-align:center;}
    .utAboutVideo {width:90%; margin:0 auto;}
    .utAboutVideo .video .btn {margin:0; right:10px; font-size:13px;padding:0 10px;}
    .vidPlay i {font-size:80px;}
}


@media only screen and (max-width:480px){
    .bannerContents h1 {font-size:32px;}
    .bannerContents p {font-size:14px;}
    .headerNav {width:100%;}
    .siteForm {padding-left:0; padding-right:0;}
    .headerTop {padding-left:15px; padding-right:15px;}
    .container-fluid {padding:0;}
    .BOMainForm h3 {padding-left:15px;}
    .notificationDetail {position:fixed; left:15px; right:15px; top:60px;width:auto;}
    .tabbingList li, .stepOuter li {padding:10px; font-size:13px;}
    .aboutBox {padding-left:30px; padding-right:30px;}
    
}
@media only screen and (max-width:380px){
    .headerTop #logo img {width:120px;}
    .DBPanel, .DBMainHome {min-width:100%;}
}
@media only screen and (max-width:359px){
    .tabbingList li, .stepOuter li {padding:5px; font-size:12px;}
}
@media only screen and (max-width:320px){
    .headerTop #logo a:not(.DBPanelSwitch) {display:none !important;}
}

