/* responsive */

/*syt*/
@media only screen and (min-width : 1920px) and (max-width : 2559px){}

/*syt*/
@media only screen and (min-width : 1600px) and (max-width : 1919px){

header .container-fluid {width: 1600px;}

header .navtext { width: 80%; margin-right:30px;}
header .navtext .btn{width: 170px;     margin-left: 0px;}

.company .container{max-width: 90%;}
.company .about-visual{    width: 100%;}
.company .about-img { width: 90%; margin-top: 15vh;}
.h1key {padding: 70px; margin-top: 0vh; padding-bottom: 100px;}



.slide h5 {font-size: 4rem}
.portfolio.full-bg .cluom { height: 70vh;}
.glry-img-ballain img{height: 70vh;}


.f-d-d .container-fluid {width: 100%;}

.tab-panel {margin-top: 2vh; margin-bottom: 3vh;}



/*tech*/
.h1key h1.zize{
    font-size: 2rem;
    line-height: 50px;
}
.section-services .container {
    max-width: 1400px;
}



.dd-menu{        left: -76vh;
        width: 1270px;
        top: -20vh;

    }




}

/*syt*/
@media only screen and (min-width : 1440px) and (max-width : 1599px){
	
header .container-fluid {width: 1400px;}

header .navtext { width: 88%; margin-right:0px;}
header .navtext .btn{width: 170px;     margin-left: 0px;}
header .nav-menu{margin-left:-34px;}
header .navtext ul li{    margin: 15px 6px;}

.hero-banner .text-content .hero-text { margin-top: 30vh;  width: 70%;}
.hero-banner .text-content .hero-text h2{    font-size: 4rem;}

.company {padding: 40px;}
.company .container{max-width: 90%;}
.company .about-visual{    width: 100%;}
.company .about-img { width: 90%; margin-top: 15vh;}
.h1key {padding: 70px; margin-top: 0vh; padding-bottom: 100px;}


.slide h5 {font-size: 4rem}
.portfolio.full-bg .cluom { height: 70vh;}
.glry-img-ballain img{height: 70vh;}


.f-d-d .container-fluid {width: 100%;}



.body-t{padding: 50px;}
.tabs {width: 100%;  max-width: 100%;}


.tabs-nav {
    position: relative;
    display: block;
    background: var(--highlight-color);
    padding: var(--tabs-nav-padding);
    border-radius: var(--tab-border-radius);
    margin-bottom: 2rem;
    margin-top: 2rem;
    float: left;
}
.tabs-indicator {
    position: absolute;
    top: var(--tabs-nav-padding);
    bottom: var(--tabs-nav-padding);
    left: 0;
    pointer-events: none;
    z-index: 0;
    will-change: transform, width; display:none;
}
.tab-button {
    position: relative;
    padding: 15px;
    font-size: var(--tab-font-size);
    color: var(--text-color);
    border-radius: var(--tab-border-radius);
    cursor: pointer;
    text-align: center;
    z-index: 1;
    display: block;
    float: left;
    background: #ffffff00;
    border: 0px;
    margin: 10px;
}
.tabs-nav button{border:.5px solid #ffffff3d;}
.tabs-nav button:focus{outline:0px!important; border:.5px solid #fdd407;}
.tab-button[aria-selected="true"]{border:.5px solid #fdd407; }
.tab-button:hover{color:#fff;}

.tab-panel {margin-top: 16vh; margin-bottom: 3vh;}

/*tech*/
.h1key h1.zize{
    font-size: 2rem;
    line-height: 50px;
}
.section-services .container {
    max-width: 1300px;
}


.dd-menu{left: -71vh;
        width: 1210px;
        top: -20vh;
    }

}

/*syt*/
@media only screen and (min-width : 1366px) and (max-width : 1439px){
	
header .container-fluid {width: 1400px;}

header .navtext { width: 88%; margin-right:0px;}
header .navtext .btn{width: 170px;      float: left;   margin-left: 0px;}
header .nav-menu{margin-left:-34px;}
header .navtext ul li{margin: 15px 4px;}




.hero-banner .text-content .hero-text { margin-top: 30vh;  width: 70%;}
.hero-banner .text-content .hero-text h2{    font-size: 4rem;}

.company {padding: 40px;}
.company .container{max-width: 100%;}
.company .about-visual{    width: 100%;}
.company .about-img { width: 90%; margin-top: 15vh;}
.h1key {padding: 70px; margin-top: 0vh; padding-bottom: 100px;}
.h1key h1 { font-size: 2rem; line-height: 64px;}

.slide h5 {font-size: 4rem}
.portfolio.full-bg .cluom { height: 70vh;}
.glry-img-ballain img{height: 70vh;}


.f-d-d .container-fluid {width: 100%;}
.company .container .innovation button { float: left; margin-top: 0vh;}
.hero-banner .text-content .hero-text h2{font-size: 4rem;}

.body-t{padding: 50px;}
.tabs {width: 100%;  max-width: 100%;}


.tabs-nav {
    position: relative;
    display: block;
    background: var(--highlight-color);
    padding: var(--tabs-nav-padding);
    border-radius: var(--tab-border-radius);
    margin-bottom: 2rem;
    margin-top: 2rem;
    float: left;
}
.tabs-indicator {
    position: absolute;
    top: var(--tabs-nav-padding);
    bottom: var(--tabs-nav-padding);
    left: 0;
    pointer-events: none;
    z-index: 0;
    will-change: transform, width; display:none;
}
.tab-button {
    position: relative;
    padding: 15px;
    font-size: var(--tab-font-size);
    color: var(--text-color);
    border-radius: var(--tab-border-radius);
    cursor: pointer;
    text-align: center;
    z-index: 1;
    display: block;
    float: left;
    background: #ffffff00;
    border: 0px;
    margin: 10px;
}
.tabs-nav button{border:.5px solid #ffffff3d;}
.tabs-nav button:focus{outline:0px!important; border:.5px solid #fdd407;}
.tab-button[aria-selected="true"]{border:.5px solid #fdd407; }
.tab-button:hover{color:#fff;}

.tab-panel {margin-top: 23vh; margin-bottom: 3vh;}


/*tech*/
.h1key h1.zize{
    font-size: 2rem;
    line-height: 50px;
}
.section-services .container {
    max-width: 1200px;
}

.dd-menu{left: -67vh;
        width: 1188px;
        top: -20vh;}




}

/*syt*/
@media only screen and (min-width : 1200px) and (max-width : 1365px){


	header .container-fluid {width: 1180px;}
	header .navtext ul {display:none;}
	header .navtext {width: 20%;}
	header .nav-menu{float: left;}


.h1key {padding: 70px; margin-top: 0vh;}
.h1key h1{font-size: 1.5rem; line-height:46px;}


.company .container{max-width: 100%;}
.company .container .innovation button { float: left; margin-top: 0vh;}
.company {padding: 40px;}
.company .about-visual { width: 100%;}
.company .container .innovation ul li p{font-size:14px;}
.company .container .innovation ul li img{width: 25px; margin-top: 5px;}

.hero-banner .text-content .hero-text h2{font-size: 4rem;}
.hero-banner .text-content .hero-text {margin-top: 14vh;}
.hero-banner .text-content{left: 11vh; width: 85%;}

.body-t{padding: 50px;}
.tabs {width: 100%;  max-width: 100%;}


.tabs-nav {
    position: relative;
    display: block;
    background: var(--highlight-color);
    padding: var(--tabs-nav-padding);
    border-radius: var(--tab-border-radius);
    margin-bottom: 2rem;
    margin-top: 2rem;
    float: left;
}
.tabs-indicator {
    position: absolute;
    top: var(--tabs-nav-padding);
    bottom: var(--tabs-nav-padding);
    left: 0;
    pointer-events: none;
    z-index: 0;
    will-change: transform, width; display:none;
}
.tab-button {
    position: relative;
    padding: 15px;
    font-size: var(--tab-font-size);
    color: var(--text-color);
    border-radius: var(--tab-border-radius);
    cursor: pointer;
    text-align: center;
    z-index: 1;
    display: block;
    float: left;
    background: #ffffff00;
    border: 0px;
    margin: 10px;
}
.tabs-nav button{border:.5px solid #ffffff3d;}
.tabs-nav button:focus{outline:0px!important; border:.5px solid #fdd407;}
.tab-button[aria-selected="true"]{border:.5px solid #fdd407; }
.tab-button:hover{color:#fff;}
.tab-panel {margin-top: 24vh; margin-bottom: 3vh;}


.slide h5 {font-size: 3rem}

.portfolio.full-bg .cluom{height:50vh;}
.glry-img-ballain img{height:50vh;}

.f-d-d .container-fluid {width: 100%;}



.valign .cont{padding:0px; padding-right: 10px;}
.tags a.rih{margin-bottom:10px;}


/*tech*/
.h1key h1.zize{
    font-size: 2rem;
    line-height: 50px;
}
.section-services .container {
    max-width: 1100px;
}


}

/*Tab-syt*/
@media only screen and (min-width : 1024px) and (max-width : 1199px){

 	header .container-fluid {width: 1000px;}
	header .navtext ul {display:none;}
	header .navtext {width: 20%;}
	header .nav-menu{float: left;}


.h1key {padding: 70px; margin-top: 0vh;}
.h1key h1{font-size: 1.5rem; line-height:46px;}


.company .container{max-width: 100%;}
.company .container .innovation button { float: left; margin-top: 0vh;}
.company {padding: 40px;}
.company .about-visual { width: 100%;}
.company .container .innovation ul li p{font-size:14px;}
.company .container .innovation ul li img{width: 25px; margin-top: 5px;}
.company .container .innovation ul li{margin-top: 2vh;}

.hero-banner .text-content .hero-text h2{font-size: 4rem;}
.hero-banner .text-content .hero-text {margin-top: 14vh;}
.hero-banner .text-content{left: 11vh; width: 85%;}

.body-t{padding: 50px;}
.tabs {width: 100%;  max-width: 100%;}


.tabs-nav {
    position: relative;
    display: block;
    background: var(--highlight-color);
    padding: var(--tabs-nav-padding);
    border-radius: var(--tab-border-radius);
    margin-bottom: 2rem;
    margin-top: 2rem;
    float: left;
}
.tabs-indicator {
    position: absolute;
    top: var(--tabs-nav-padding);
    bottom: var(--tabs-nav-padding);
    left: 0;
    pointer-events: none;
    z-index: 0;
    will-change: transform, width; display:none;
}
.tab-button {
    position: relative;
    padding: 15px;
    font-size: var(--tab-font-size);
    color: var(--text-color);
    border-radius: var(--tab-border-radius);
    cursor: pointer;
    text-align: center;
    z-index: 1;
    display: block;
    float: left;
    background: #ffffff00;
    border: 0px;
    margin: 10px;
}
.tabs-nav button{border:.5px solid #ffffff3d;}
.tabs-nav button:focus{outline:0px!important; border:.5px solid #fdd407;}
.tab-button[aria-selected="true"]{border:.5px solid #fdd407; }
.tab-button:hover{color:#fff;}
.tab-panel {margin-top: 24vh; margin-bottom: 3vh;}


.slide h5 {font-size: 3rem}

.portfolio.full-bg .cluom{height:50vh;}
.glry-img-ballain img{height:50vh;}

.f-d-d{padding-bottom:0px;}
.f-d-d .container-fluid {width: 100%;}
.media-trust .caption h3{font-size:1.5rem; line-height:45px;}
.media-trust .caption h3 strong{font-size:1.5rem;}
.go-down-btn svg{width: 125%;}
.go-down-btn .arrow img{width: 25%; left: 9.5vh;}


.valign .cont{padding:0px; padding-right: 10px;}
.tags a.rih{margin-bottom:10px;}


/*tech*/
.h1key h1.zize{
    font-size: 2rem;
    line-height: 50px;
}
.section-services .container {
    max-width: 1000px;
}








.nav-content{    width: calc(66vw);
    top: -60vh;}








}








/*Tab*/
@media only screen and (min-width : 768px) and (max-width : 1023px){


 	header .container-fluid {width: 100%;}
	header .navtext ul {display:none;}
header .nav-menu{float:left;}

header .navtext {width: 30%;}


.h1key {padding: 30px; margin-top: 4vh; padding-bottom:40px;}
.h1key h1 {font-size: 1.5rem; line-height: 47px; font-weight: 300;}



.company .container{max-width: 100%;}
.company .container .innovation button { float: left; margin-top: 0vh; width:100%;}
.company {padding: 15px; margin-top: 6vh;}
.company h3 { font-size: 30px; line-height: 41px;}
.company .about-img {    width: 100%;    margin-top: 4vh;}
.company .about-visual{width: 100%; margin-bottom: 15vh; top:8vh;  }
.company .container p { font-size: 16px;  line-height: 29px;}
.company .container .innovation { margin-top: 5vh;}
.company .weall {margin-top: 6vh;}
.company .container .innovation ul li p{font-size: 14px; margin-right: 12px; margin-bottom:0px;}
.company .container .innovation ul li img{width:22px; margin-top:3px;}
.company .container .innovation ul li{margin: 0px; margin-top: 0vh; margin-bottom: 3vh;}


.slide {margin-bottom: 0vh;}
.slide h5 {font-size: 4rem;}

.portfolio.full-bg .cluom { height: 34vh;}
.glry-img-ballain img{height:100%;}
.portfolio.full-bg .cluom .info h5 {font-size: 22px;}
.portfolio.full-bg .cluom .info h6{letter-spacing:2px;}

.hero-banner .text-content .hero-text h2{font-size: 2rem;}

.hero-banner .text-content .hero-text {margin-top: 7vh;}
  .body-t .tabs{max-width: 100%;}
  .valign .cont{padding:0; padding-right:10px;}

.hero-banner .text-content { width: 85%;    left: 7vh; top: 5vh;}




.body-t{padding: 50px;}
.tabs {width: 100%;  max-width: 100%;}


.tabs-nav {
    position: relative;
    display: block;
    background: var(--highlight-color);
    padding: var(--tabs-nav-padding);
    border-radius: var(--tab-border-radius);
    margin-bottom: 2rem;
    margin-top: 2rem;
    float: left;
}
.tabs-indicator {
    position: absolute;
    top: var(--tabs-nav-padding);
    bottom: var(--tabs-nav-padding);
    left: 0;
    pointer-events: none;
    z-index: 0;
    will-change: transform, width; display:none;
}
.tab-button {
    position: relative;
    padding: 15px;
    font-size: var(--tab-font-size);
    color: var(--text-color);
    border-radius: var(--tab-border-radius);
    cursor: pointer;
    text-align: center;
    z-index: 1;
    display: block;
    float: left;
    background: #ffffff00;
    border: 0px;
    margin: 10px;
}
.tabs-nav button{border:.5px solid #ffffff3d;}
.tabs-nav button:focus{outline:0px!important; border:.5px solid #fdd407;}
.tab-button[aria-selected="true"]{border:.5px solid #fdd407; }
.tab-button:hover{color:#fff;}

.tab-panel {margin-top: 31vh; margin-bottom: 3vh;}
.tabs button.btn{width:100%;}



.media-trust .md-hide .rotate-circle {position: relative; left: 24vh; top: -1vh;}
.media-trust {padding: 60px; margin-top: 0vh; padding-top: 0px;}
.media-trust .caption h3{font-size: 20px; line-height: 38px;}
.media-trust .caption h3 strong{font-size: 20px;}
.mt-50 {margin-top: 0px;}
.media-trust .text p.ban-t {font-weight: 300; line-height: 29px; font-size: 16px;}
.media-trust .crv-butn-vid{margin-bottom: 4vh;}
.crv-butn-vid .vid .icon{padding: 30px 35px 20px 35px;}
.go-down-btn{display:none;}


.tabs-indicator{display:none;}


.f-d-d{margin-top:0vh;}
.f-d-d .container-fluid {width: 100%;}
.f-d-d button{float:left; width:50%;}


.with-us {margin-top: 0vh;}
.sec-lg-head .dot-titl-non{display: block; width: 84%; margin: auto; padding: 15px 25px;}
.arrow-zorroae {width: 25px; float: right;}
.sec-lg-head{margin-bottom:4vh;}
.myartical{width: 95%; margin: auto;}
.myartical .b-tom{margin-bottom:4vh;}

.rest .col-lg-6{padding: 15px;margin:15px;}
.with-us .col-lg-6.b-tom{padding:0; margin:0;}
.with-us .item {padding: 0px !important;}



.nav-content{  width: calc(58vw);
        top: -65vh; }

.nav-content .items .active{    padding: 15px 93px;}

.social a{    padding: 10px 10px; font-size: 12px;}

.nav-content .items .active{padding: 15px 90px;}

.nav-content .item a p{font-size: 15px}


}






















/*Mob*/
@media only screen and (min-width : 150px) and (max-width : 767px){
.copyrights{padding-top: 12vh;}
.rest .col-lg-6{padding: 15px;margin:15px;}
.with-us .col-lg-6.b-tom{padding:0; margin:0;}
.with-us .item {padding: 0px !important;}

.nav-content {  position: relative;      right: -38vh;
        min-width: 304px;
        align-items: start;
        left: 0;
        margin: 0;}
#drawer-input:checked ~ .nav-content{height:auto;}
.nav-bar {margin-top: 0;}
.social {position: relative; top: 0vh;  background: transparent;display: none; }
.social a {display: block; float: left;}
.nav-content .items {margin-top: 0vh;}
.nav-content .items .active{padding: 15px 15px;}

.playbtn{    margin: auto;}
.slide h3{border-right: 6px solid #fdd407;}
 
 	header .container-fluid {width: 100%;}
	header .navtext ul {display:none;}
header .nav-menu{float:right; width: 80px;}

header .navtext {width: 30%; display:none;}
.h1key .classs-sec{display: none;}

.h1key {padding: 15px; margin-top: 4vh; padding-bottom:10px;}
.h1key h1 {font-size: 1.5rem; line-height: 37px; font-weight: 300; text-align: right;}
.h1key p {text-align: right;}
.top-hed h5{    line-height: 28px;
    text-align: center; display: none;}
strong.ready-level a{font-size: 14px; margin-bottom: 5vh;}
strong.ready-level{display: none;}

.hero-banner .text-content .hero-text h2 br{display: none;}
.hero-banner .col-md-12{padding-right:0px; padding-left:0px;}

.company .container .innovation h4 {
    font-size: 30px;
}
.company .container{max-width: 100%; padding: 0;}
.company .container .innovation button { float: left; margin-top: 0vh; width:100%;}
.company {padding: 15px; margin-top: 6vh;}
.company h3 { font-size: 30px; line-height: 41px;}
.company .about-img {    width: 100%;    margin-top: 4vh;    margin-bottom: 0vh;}
.company .about-visual{        width: 100%;
        margin-bottom: 10vh;
        top: 4vh; }
.company .container p { font-size: 16px;  line-height: 29px;}
.company .container .innovation { margin-top: 5vh;}
.company .weall {margin-top: 6vh;}
.company .container .innovation ul li p{font-size: 14px; margin-right: 12px; margin-bottom:0px;}
.company .container .innovation ul li img{width:22px; margin-top:3px;}
.company .container .innovation ul li{margin: 0px; margin-top: 0vh; margin-bottom: 3vh;}


.slide {margin-bottom: 0vh;}
.slide h5 {        font-size: 3rem;
        font-weight: 300;
        line-height: 61px;}

.portfolio.full-bg .cluom { height: 60vh;}
.glry-img-ballain img{height:100%;}
.portfolio.full-bg .cluom .info h5 {font-size: 22px;}
.portfolio.full-bg .cluom .info h6{letter-spacing:2px;}
.portfolio.full-bg .cluom .more{top: 31vh; left: 13vh;}


    .hero-banner .text-content .hero-text h2 {
        font-size: 26px;
        line-height: 36px;    }
    .hero-banner .text-content .hero-text h2 strong {
    color: #fff;
    font-weight: 700;}
.hero-banner .qury {
    margin-top: 2vh;}
.hero-banner .new-com{padding: 10px 15px;}
.hero-banner .text-content .hero-text {margin-top: 0vh;
    width: 100%;}
  .body-t .tabs{max-width: 100%;}


  .valign .cont{padding: 30px 30px;  margin-top: 0vh;}
.cont h5{ font-size: 30px; line-height: 38px; margin:10px 0px;}

    .hero-banner .text-content {
        width: 85%;
        left: 3vh;
        top: 6vh;    }
    .hero-banner .text-content .course {
    display: none;}


.body-t{padding: 50px;}
.tabs {width: 100%;  max-width: 100%;}


.tabs-nav {
    position: relative;
    display: block;
    background: var(--highlight-color);
    padding: var(--tabs-nav-padding);
    border-radius: var(--tab-border-radius);
    margin-bottom: 2rem;
    margin-top: 2rem;
    float: left;}
.tabs-indicator {
    position: absolute;
    top: var(--tabs-nav-padding);
    bottom: var(--tabs-nav-padding);
    left: 0;
    pointer-events: none;
    z-index: 0;
    will-change: transform, width; display:none;}
.tab-button {
    position: relative;
    padding: 15px;
    font-size: var(--tab-font-size);
    color: var(--text-color);
    border-radius: var(--tab-border-radius);
    cursor: pointer;
    text-align: center;
    z-index: 1;
    display: block;
    float: left;
    background: #ffffff00;
    border: 0px;
    margin: 10px;}
.tabs-nav button{border:.5px solid #ffffff3d;}
.tabs-nav button:focus{outline:0px!important; border:.5px solid #fdd407;}
.tab-button[aria-selected="true"]{border:.5px solid #fdd407; }
.tab-button:hover{color:#fff;}

.tab-panel {margin-top: 54vh; margin-bottom: 3vh;}
.tabs button.btn{width:100%;}



.media-trust .md-hide .rotate-circle {position: relative; left: 24vh; top: -1vh;}
.media-trust {        padding: 38px;
        margin-top: 4vh; padding-top: 0px;}
        .media-trust .caption h3 strong.ready-level a{    letter-spacing: 0px;}
.media-trust .caption h3{font-size: 20px; line-height: 38px;}
.media-trust .caption h3 strong{font-size: 20px;}
.mt-50 {margin-top: 0px;}
.media-trust .text p.ban-t {font-weight: 300; line-height: 29px; font-size: 16px;}
.media-trust .crv-butn-vid{margin-bottom: 4vh;}
.media-trust .caption h3 strong.ready-level a{    letter-spacing: 0px;
    line-height: 30px;
    text-align: left;
    margin: auto;
    display: block;
    font-size: 23px;
    padding: 25px 0px;}
.crv-butn-vid .vid .icon{padding: 30px 35px 20px 35px;}
.go-down-btn{display:none;}


.tabs-indicator{display:none;}


.f-d-d{margin-top:1vh;    padding: 30px;}
.f-d-d .container-fluid {width: 100%;}
.f-d-d button{float: left;
        width: 100%;
        text-align: left;
        padding-left: 25px;}
.f-d-d button img {
    float: right;
    width: 25px;
    margin-left: 5vh;}

.with-us {margin-top: 0vh;}
.sec-lg-head .dot-titl-non{display: block; width: 90%; margin: auto; padding: 15px 25px;}
.tags a{font-size: 14px;
    padding: 10px 30px;margin: 6px 0px;
    width: 100%;}
.arrow-zorroae {width: 25px;
        float: right;
        margin-top: -6px;}
.sec-lg-head{margin-bottom:4vh;}
.myartical{width: 100%; margin: auto;}
.myartical .b-tom{margin-bottom:4vh;}

footer {
    height: 30vh;
    background-size: contain;
    background-position: bottom;
    background-attachment: fixed;
    background-repeat: no-repeat;}

button a{display: block;
    text-align: left;
    padding: 3px 15px;}


.company .container .innovation button img {margin-right: 12px;  margin-top: -3px;}

.hero-banner .new-com a{font-size:14px;}




/* About */




.we-are button{    margin-top: 18vh;    border-radius: 0px;}



.we-are {padding: 18px; padding-bottom: 3em;}
.we-are p.global{width: 100%;     font-size: 3rem;    line-height: 70px;     margin-bottom: 7vh;}


.whyus {padding: 18px; padding-top: 3em; padding-bottom: 3em;}
.whyus h2{font-size: 3em;    line-height: 70px;}
.whyus h4{font-size: 1.7em;    line-height: 42px;}


section.team{transform: translatey(0em);padding: 18px;}
section.team .card-top {
    flex-basis: 100%;
    display: flex;
    justify-content: center;
    gap: 0.938rem;
    flex-wrap: wrap;
}
section.team .card{width: 100%;
    height: auto; padding: 1em;
    max-width: 100%;}

section.team .card-top .card img {
    width: 100%;
    height: 100%;}


.y-us-section {
    padding: 28px 0 28px;
}



.content-container{    max-inline-size: 23rem;
    padding-top: 14vh;
    padding-bottom: 8vh;}
.rig-ht {
    padding: 10px;}

.pin-spacer{position: relative!important;}

.WhatWeDo_whatWeDoCotentList{position: relative!important; right: 0;}
.WhatWeDo_whatWeDoWrapContainer{padding-left: 0;}

.WhatWeDo_whatWeDoWrap {
    padding: 20px;}


.contact .container{width: 100% ;    margin-top: 12vh;}

.contact{padding: 18px;}
.contact .forget label {
    display: block;}
    .contact form{ width: 100%; margin-top: 0;}
.contact .forget label p {
    margin-left: 6px;
    color: #fff;
    font-size: 14px;
}
    
.bd-container {
    max-width: 100%;
    width: 100%;     margin-top: 0vh;}






.gallery-image:hover .more{left: 15vh!important}


.nav-content{           width: calc(84vw);
        top: -25vh;}

.nav-content .items .active{    padding: 15px 93px;}

.social a{    padding: 10px 10px; font-size: 12px;}

.nav-content .items .active{padding: 15px 50px;}

.nav-content .item a p{font-size: 15px}

.nav-content .items{min-width: 100px;}


}



@media only screen and (max-width: 375px) {
    .nav-content .items{display: block;  float: left; margin: auto;}


.hero-banner .new-com a{font-size:11px;}
    .hero-banner .new-com {
        padding: 10px 14px;    }
        .hero-banner .text-content .hero-text h2 {
        font-size: 19px;
        line-height: 27px;    }
        .hero-banner .text-content {top: 3vh;}
.tab-button{    white-space: normal;}


    .tab-panel {
        margin-top: 54vh;
        margin-bottom: 3vh;    padding: 20px;    }
        .tabs {margin:0px;    }
        .body-t {
        padding: 15px;        padding-top: 20px;
        padding-bottom: 50px;  }   
         .f-d-d {
        margin-top: 5vh;
        padding: 0px;}
#drawer-input:checked ~ .nav-content {
        height: auto; top: -38vh; }
.nav-content .item{padding: 0}
.top-hed h4{font-size: 2rem}
}


@media only screen and (max-width: 320px) {
.item a p{font-size:14px;}
    .nav-content .items{display: block;  float: left; margin: auto; min-width: 100%;}
#drawer-input:checked ~ .nav-content {
        height: auto;  }

.top-hed h4{font-size: 1.5rem}
.hero-banner .new-com a{font-size:11px;}
    .hero-banner .new-com {
        padding: 10px 14px; }
        .hero-banner .text-content .hero-text h2 {
        font-size: 19px;
        line-height: 27px; }
        .hero-banner .text-content {top: 3vh;}
.tab-button{    white-space: normal;}


    .tab-panel {
        margin-top: 54vh;
        margin-bottom: 3vh;    padding: 20px;  }
        .tabs {margin:0px;  }
        .body-t {
        padding: 15px;        padding-top: 20px;
        padding-bottom: 50px; }   
         .f-d-d {
        margin-top: 5vh;
        padding: 0px;}








}