*{
    font-family: 'Poppins', sans-serif;
    
}

:root{
    --bluer: 34 133 193;
    --blue:#2285C1;
    --orange:#F36A10;
    --white:#fff;
    --black:#000;
    --bigfont:80px;
    --title:50px;
    --smallfont:16px;
    --h3font:40px;
    --midfont:25px;
    --padt:100px;
    --padb:100px;
}
.bodyover{ overflow: hidden;}
.mt-30{ margin-top: 30px;}
.sectionpad{ padding-top: var(--padt);}
.sectionpadb{ padding-bottom: var(--padb);}
/* navigation */
.navigation {    display: flex; position: absolute !important; top: 0; z-index: 1; width: 100%;}
.navpad{     padding-top: 15px !important;}
.navcenter{     justify-content: center;}
.navgap{gap: 40px;}
.navgap li a{ padding: 0 !important;}
.navgap li {position: relative;}
.navpad .navbar-nav .nav-link:focus, .navbar-light .navbar-nav .nav-link:hover {    color: var(--black) !important;}
.navipad {    padding-top: 20px;    padding-right: 6%;}
.navpad .navbar-nav .nav-link {color: var(--black) !important; position: relative;}
.navpad .container{ align-items: flex-start !important;}
.navpad .navbar-nav .nav-link::before{ content: ""; width: 0%; transition: 0.5s; height: 2px; background-color: var(--orange); position: absolute; bottom: 0; left: 0;}
.navpad .navbar-nav .nav-link:hover::before{ width: 100%;}
.navpad .navbar-nav .active::before{ width: 100%;}
.gap30{ gap: 30px 0;}

/* .dropdown-menu .dropdown-item {  padding: 10px 15px !important;  border-bottom: 1px solid #bdbdbd; }
.dropdown-menu .dropdown-item:xactive{ background-color: var(--orange) !important;}
.dropdown-menu {     margin-left: -16px;  min-width: 180px; padding: 0 !important; border: transparent !important;} */
/* navigation */

/*sticky navigation*/
.mystyle { position: sticky !important; top: 0; z-index: 1111; background: #fff;}
.mystyle .mainlogo img{ height:75px;}
/*sticky navigation*/

/* banner */
.bannercontent{ position: relative; }
.bannertextpo{ position: absolute; top: 0; width: 100%; height: 100%; background: linear-gradient(90deg, rgba(34,133,193,1) 0%, rgba(34,133,193,1) 25%, rgba(255,255,255,0) 25%, rgba(255,255,255,0) 100%);}
.bannertextpo .container{ height: 100%;}
.bannertextpo .row{ align-items: center; height: 100%;}
.bannerproduct img{ width: 100%;     height: 270px;  object-fit: contain;}
.bannercontent > img {    height: 100vh;    object-fit: cover;    width: 100%; position: relative;}
.bannertext h1{ font-size: var(--bigfont); color: var(--orange); font-weight: normal; margin: 0; line-height: 60px; line-height: 85px;}
.bannertext h3{ font-size: var(--h3font); font-weight: normal; margin: 0; padding-bottom: 10px; }
.bannertext p{font-size: var(--smallfont); text-align: justify; }
.bannerslider .slick-next, .slick-prev{ bottom: 50px !important; top: auto !important; z-index: 3;}
.bannerslider .slick-prev {    left: 87% !important;}
.bannerslider .slick-next { right: 8% !important;}
.bannerslider .slick-next:before {    content: ''; }
.bannerslider .slick-prev:before { content: ''; }
.bannerslider .slick-next::after{content: '';  background-image: url(../images/arrowright.png); background-repeat: no-repeat; height: 50px;    width: 50px;    position: absolute;}
.bannerslider .slick-next:hover::after{ background-image: url(../images/arrowhoverright.png); background-repeat: no-repeat;}
.bannerslider .slick-prev::after{content: '';  background-image: url(../images/arrowleft.png); background-repeat: no-repeat; height: 50px;    width: 50px;    position: absolute;}
.bannerslider .slick-prev:hover::after{ background-image: url(../images/arrowhover.png); background-repeat: no-repeat;}
/* banner */
/* button */
.knowmore a{ position: relative;  display: inline-block;  vertical-align: middle;  text-decoration: none;  background: transparent;  padding: 0;  font-size: inherit;  font-family: inherit;}
.knowmore a {  width: 12rem;  height: auto;}
.knowmore a .circle {  transition: all 0.45s cubic-bezier(0.65, 0, 0.076, 1);  position: relative;  display: block;  margin: 0;  width: 3rem;  height: 3rem;  background: var(--orange);  border-radius: 1.625rem;}
.knowmore a .circle .icon {  transition: all 0.45s cubic-bezier(0.65, 0, 0.076, 1);  position: absolute;  top: 0;  bottom: 0;  margin: auto;  background: #fff;}
.knowmore a .circle .icon.arrow {  transition: all 0.45s cubic-bezier(0.65, 0, 0.076, 1);  left: 0.625rem;  width: 1.125rem;  height: 0.125rem;  background: none;}
.knowmore a .circle .icon.arrow::before {  position: absolute;  content: "";  top: -0.25rem;  right: 0.0625rem;  width: 0.625rem;  height: 0.625rem;  border-top: 0.125rem solid #fff;  border-right: 0.125rem solid #fff;  transform: rotate(45deg);}
.knowmore a .button-text {  transition: all 0.45s cubic-bezier(0.65, 0, 0.076, 1);  position: absolute;  top: 0;  left: 0;  right: 0;  bottom: 0;  padding: 0.75rem 0;  margin: 0 0 0 1.85rem;  color: #000;   line-height: 1.6;  text-align: center;  text-transform: uppercase;}
.knowmore a:hover .circle {  width: 100%;}
.knowmore a:hover .circle .icon.arrow {  background: #fff;  transform: translate(1rem, 0);}
.knowmore a:hover .button-text {  color: #fff;}
.representative .knowmore a .button-text{ color: #fff;}
.white a .button-text{ color: #fff !important; }

.download a{ position: relative;  display: inline-block;  vertical-align: middle;  text-decoration: none;  background: transparent;  padding: 0;  font-size: inherit;  font-family: inherit;}
.download a {  width: 16rem;  height: auto;}
.download a .circle {  transition: all 0.45s cubic-bezier(0.65, 0, 0.076, 1);  position: relative;  display: block;  margin: 0;  width: 3rem;  height: 3rem;  background: var(--orange);  border-radius: 1.625rem;}
.download a .circle .icon {  transition: all 0.45s cubic-bezier(0.65, 0, 0.076, 1);  position: absolute;  top: 0;  bottom: 0;  margin: auto;  background: #fff;}
.download a .circle .icon.arrow {  transition: all 0.45s cubic-bezier(0.65, 0, 0.076, 1);  left: 0.625rem;  width: 1.125rem;  height: 0.125rem;  background: none;}
.download a .circle .icon.arrow::before {  position: absolute;  content: "";  top: -0.25rem;  right: 0.0625rem;  width: 0.625rem;  height: 0.625rem;  border-top: 0.125rem solid #fff;  border-right: 0.125rem solid #fff;  transform: rotate(45deg);}
.download a .button-text {  transition: all 0.45s cubic-bezier(0.65, 0, 0.076, 1);  position: absolute;  top: 0;  left: 0;  right: 0;  bottom: 0;  padding: 0.75rem 0;  margin: 0 0 0 1.85rem;  color: #000;   line-height: 1.6;  text-align: center;  text-transform: uppercase;}
.download a:hover .circle {  width: 100%;}
.download a:hover .circle .icon.arrow {  background: #fff;  transform: translate(1rem, 0);}
.download a:hover .button-text {  color: #fff;}

/* aboutus */
.aboutussection{position: relative; max-width: 1920px; margin: 0 auto;}
.yearstext {  position: absolute;  background: var(--blue);  top: 0;  width: 25%;  padding: 40px;  z-index: -1; height: 400px;}
.yearstext p:nth-child(1){ font-size: 150px; font-weight: 200;line-height: 120px; margin: 0; color: var(--white); }
.yearstext p:nth-child(2){ font-size: var(--midfont); font-weight: normal;line-height: 35px; color: var(--white); }
.titletext p{font-size: var(--smallfont);margin: 0; display:none; }
.titletext h2{ font-size: var(--title); padding-bottom: 20px; margin: 0; color: var(--orange); font-weight: normal;}
.abouttext h4{ font-size: var(--midfont); font-weight: 300; margin: 0; padding-bottom: 20px; text-align: justify;}
.abouttext p{ font-size: var(--smallfont); margin: 0; text-align: justify;}
.qulitytext h4{ font-size: var(--midfont); font-weight: 300; margin: 0; padding-bottom: 3px; }
.qulitytext p{ font-size: var(--smallfont); margin: 0;}
.qualitycontent{ display: flex; gap: 20px; align-items: center;}
.qualityflex {  display: flex;  justify-content: space-between;  background-color: #E2E2E2;  padding: 40px;  border-radius: 200px;  margin-top: -20px;}
.whoareyou{ background-image: url(..///images/homebanner.jpg);background-repeat: no-repeat; width: 100%;     background-size: cover;}
/* aboutus */

/* product */
.text-right{ text-align: right;}
.producttext{ background-color: #F8F8F8; padding: 25px; border-radius: 20px; transition: 0.5s;    height: 100%;    display: flex;    flex-direction: column;    justify-content: space-between;}
.producttext h3{ font-size: 22px; font-weight: 600; color: var(--orange);}
.producttext img {  width: 100%;  height: 200px;  object-fit: contain;  padding: 10px 0px;}
.producttext:hover{ box-shadow: 0px 3px 20px rgba(0, 0, 0, 0.16); }
.producttext.new,.bannerproduct.new{position: relative;}
.producttext.new::after,.bannerproduct.new::after{content: ''; position: absolute; top:-15px; right: -15px; background: url(../images/new.png)no-repeat; background-size: contain; height: 60px; width: 60px;}
/* product */

/* client */
.clientsection{background-image: url(..///images/clients.jpg);background-repeat: no-repeat; width: 100%;     background-size: cover; }
.clientimg{ background-color: var(--white); border-radius: 30px;  width: 100px; height: 100px;}
.clientimg img{ width: 85px; height: 100%;  margin: 0 auto;  padding: 10px; transition: 0.5s;    object-fit: contain; overflow: hidden;}
.clientimg img:hover{ transform: scale(1.2)}
.client {  display: flex;  flex-direction: column;  gap: 20px;}
.client :not(:last-child){margin-bottom: 20px;}
.clientslider .slick-next{ bottom: -40px !important; top: auto !important; z-index: 3;}
.clientslider .slick-prev{ bottom: -40px !important; top: auto !important; z-index: 3;}
.clientslider .slick-prev {    left: 40% !important;}
.clientslider .slick-next { right: 47% !important;}
.clientslider .slick-next:before {    content: ''; }
.clientslider .slick-prev:before { content: ''; }
.clientslider .slick-next::after{content: '';  background-image: url(../images/arrowright.png); background-repeat: no-repeat; height: 50px;    width: 50px;    position: absolute;}
.clientslider .slick-next:hover::after{ background-image: url(../images/arrowhoverright.png); background-repeat: no-repeat;}
.clientslider .slick-prev::after{content: '';  background-image: url(../images/arrowleft.png); background-repeat: no-repeat; height: 50px;    width: 50px;    position: absolute;}
.clientslider .slick-prev:hover::after{ background-image: url(../images/arrowhover.png); background-repeat: no-repeat;}
/* client */

/* representative */
.representative {  display: flex;    margin-bottom: -100px;  justify-content: space-between;  align-items: center;  background-color: var(--blue);  padding: 50px 100px;  border-radius: 30px;}
.titletext.white h2 { color: var(--white); padding: 0;}
.titletext.white p{ font-size: 30px; color: var(--white);}
/* representative */

/* footer */
.footercenter{ align-items: center; padding-bottom: 30px;}
.footersection{ background-color:#000; padding-top: 160px;}
.footerlinks ul {  list-style: none;  margin: 0;  padding: 0;  display: flex;  gap: 50px;  justify-content: left;}
.footerlinks ul a{ text-decoration: none; color: var(--white);}
.call h4{ color: var(--white); font-size: 18px; font-weight: 500; padding-left: 20px;} 
.calldetails {  display: flex;  gap: 10px;}
.calldetails a{ color: var(--white); font-size: 14px; text-decoration: none;  transition: 0.5s;}
.calldetails a:hover{   color: #d7d7d7;}
.calldetails i {  padding-top: 3px;  color: #F5821F;  font-size: 14px;}
.socialfooter{ display: flex;  gap: 10px;}
.p-0 h4{ padding: 0 !important;}
.socialfooter i {  font-size: 14px;  color: #fff;  border: 1px solid #fff;  padding: 10px 11px;  border-radius: 30px;}
.footercontact {  padding: 40px 0px;  border-top: 1px solid #fff; border-bottom: 1px solid #fff;}
.copyright p { text-align: center; color: #fff; margin: 0; font-size: 14px ;}
.copyright {  display: flex;  justify-content: space-between; padding: 35px 0px;}
.copyright img {  width: 30px;}

/* footer */

.innerbanner{ position: relative;}
.innerbannercontent{  position: absolute;  top: 0;  width: 100%;  height: 100%;     justify-content: center;  align-items: center; display: flex;}
.innerbannertext h1{ font-size: var(--bigfont); color: #F36A10; font-weight: normal; text-align: center;}

.aboutbottom{ margin-top: -60px;}
.orangesection{ background-color: var(--orange); padding:160px 60px 100px 60px; border-radius: 20px;     height: 100%;}
.orangesection p{ color: var(--white); font-size: var(--smallfont); margin: 0; text-align: justify; line-height: 34px;}
.whitesection{padding:160px 0px 100px 0px; }
.whitesection p { font-size: var(--smallfont); text-align: justify; margin: 0;}
.bolder{ font-weight: 600;}
.ml-30 {  padding-left: 60px;}
.visiontext{ background-color: #EFEFEF; padding: 60px; font-size: 20px; border-radius: 20px; line-height: 40px;     position: relative; z-index: 1;}
.vision{ padding-top: 100px; margin-right: -100px; margin-left: 100px;}
.visionimg{ width: 100%;margin-right: 100px; margin-left: -100px;  }
.textcenter h2{ text-align: center;}
.team h4{ font-size: 20px; color: var(--orange); padding-top: 30px; margin: 0;}
.teampra p { font-size: 20px; color: var(--white); margin-top: 80px; }
.team img{ width: 100%;}
.teamimg{ padding-top: 80px;}
.teamimg img{ width: 100%;}
.teambg{ background: linear-gradient(0deg, rgba(255,255,255,0) 26%, rgba(34,133,193,1) 26%, rgba(34,133,193,1) 77%, rgba(255,255,255,0) 77%);}
.clientimgab{ width: 100%; background-color: var(--white); border-radius: 30px;}
.clientimgab img{ height: 160px; padding: 10px; width: 100%;  object-fit: contain;}
.clientgap{ gap: 30px 0px;}
.visionimg img {  width: 100%;}
.innerbanner img {  width: 100%;  height: 400px;  object-fit: cover;}

.visionslider .slick-next, .slick-prev{ bottom: 50px !important; top: auto !important; z-index: 3;}
.visionslider .slick-prev {    left: 60% !important;}
.visionslider .slick-next { right: 34% !important;}
.visionslider .slick-next:before {    content: ''; }
.visionslider .slick-prev:before { content: ''; }
.visionslider .slick-next::after{content: '';  background-image: url(../images/arrowright.png); background-repeat: no-repeat; height: 50px;    width: 50px;    position: absolute;}
.visionslider .slick-next:hover::after{ background-image: url(../images/arrowhoverright.png); background-repeat: no-repeat;}
.visionslider .slick-prev::after{content: '';  background-image: url(../images/arrowleft.png); background-repeat: no-repeat; height: 50px;    width: 50px;    position: absolute;}
.visionslider .slick-prev:hover::after{ background-image: url(../images/arrowhover.png); background-repeat: no-repeat;}

.productpage{ position: relative;}
.productpageimg {  position: absolute;  right: 0;  top: 0;     z-index: -1;     width: 512px;}
.productpageimg img{ width: 100%;}
.padl{ padding-left: 80px;}
.productspecisection{ background-image: url(../images/productbg.jpg); background-repeat: no-repeat;     background-size: cover;}
.speciproduct{ text-align: center;}
.speciproduct img { background-color: var(--orange); padding: 30px; border-radius: 20px;    width: 120px;  height: 120px; }
.speciproduct p{ background-color: var(--white); width: 100%; border-radius: 20px; padding: 100px 0px 50px 0px; margin-top: -60px; margin-bottom: 0;}
.row.productspeci {  gap: 30px 0px;}
.spegray1 {  background: #F3F3F3;  padding: 40px; vertical-align: top; width: 30%;}
.spegray2 {  background: #FBFBFB;  padding: 40px; vertical-align: top;}
.specification tr{ border-bottom: 10px solid #fff;}
.contactuspage {  position: relative;     z-index: -1;}
.contactuspage .innerbannercontent {     padding-top: 180px;     align-items: flex-start}
.contactdetails i {  font-size: 20px; color: var(--orange);}
.contactdetails p { font-size: var(--smallfont); color: var(--blue); margin: 0;}
.contactdetails a{  font-size: var(--smallfont); color: var(--black); text-decoration: none; display: flex; }
.contactdetails a:hover{ color: var(--blue);}
.contactdetails {  padding-top: 30px;}
.quicksupport {  background:#F5F5F5; border-radius: 72px;  padding: 40px 80px;}
.contmargin{ margin-top: -200px;}
.map {  padding-left: 30%; position: relative;}
.formfild {   width: 100%;    border: none;  font-size: 13px;  padding: 15px; border-radius: 20px; resize: none;}
.formfild:focus{outline: none; }
.contactbg{ background-color: #FF9956; padding: 80px 50px !important; border-radius: 72px;}
.contactform2 {  padding-top: 30px;}
.contactform2 .row {  gap: 30px 0px;}
.contactform {  position: absolute;  top: 0;  width: 100%;  left: 0;  display: flex;  align-items: center;  height: 100%;}
.whitetext h2 {  color: #fff !important;}
.whitetext p {  color: #fff !important;}
.whitetext a {  color: #fff !important;}
.whitetext i {  color: #fff !important;}
.quickblueposi {position: relative; max-width: 1920px; margin: 0 auto;}
.quickblue{ position: absolute; background-color: var(--blue); padding: 80px; border-radius: 0px 72px 72px 0px; margin-top: -50px;}
.boxshado{ box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.06);}
.productre{ position: relative;}
.contactuspage img {  width: 100%;  height: 600px;  object-fit: cover;}
.learn-more {  padding: 10px 30px;  background: #f36a10;  border: none;  color: #fff;  border-radius: 50px;}
.comingsoon p {  font-size: var(--bigfont);  height: 300px; margin: 0;  display: flex;  justify-content: center;  align-items: center;}

@media (max-width:1200px){
  .vision{ margin-left: 0;}
  .visionimg{ margin-left: 0;}
  

}
@media (max-width:991px){
  /* navigation */
  .visionslider .slick-next, .slick-prev{display: none !important;}
  .padl{ padding-left: 0;}
  .productpageimg{ width: 100%;}
    .navipad {    position: absolute;    top: 0;    z-index: 100;    width: 100%;    background: #fff;    height: 100vh;    margin: 0 !important;       left: 0;    }
    .togglermobile{  margin-top: 30px;  z-index: 111;}
    .navbar-toggler:focus{ box-shadow:none !important;}
    .navipad{ padding: 0;}
    .navbar-nav{     align-items: center; padding-top: 50px;}
    .navgap {      background-color: var(--white);      height: 100vh;  }
    .navgap li:not(:last-child):after{ display: none;}
    .navgap {        gap: 40px; }
    .language {        text-align: center;        padding-top: 40px;    }
    #nav-icon1 {        width: 34px;        height: 45px;        position: relative;        -webkit-transform: rotate(0deg);        -moz-transform: rotate(0deg);        -o-transform: rotate(0deg);        transform: rotate(0deg);        -webkit-transition: .5s ease-in-out;        -moz-transition: .5s ease-in-out;        -o-transition: .5s ease-in-out;        transition: .5s ease-in-out;        cursor: pointer;      }      
      #nav-icon1 span {        display: block;        position: absolute;        height: 3px;        width: 100%;        background: var(--orange);        border-radius: 9px;        opacity: 1;        left: 0;        -webkit-transform: rotate(0deg);        -moz-transform: rotate(0deg);        -o-transform: rotate(0deg);        transform: rotate(0deg);        -webkit-transition: .25s ease-in-out;        -moz-transition: .25s ease-in-out;        -o-transition: .25s ease-in-out;        transition: .25s ease-in-out;      }
      #nav-icon1 span:nth-child(1) {        top: 0px;      }      
      #nav-icon1 span:nth-child(2) {        top: 10px;      }      
      #nav-icon1 span:nth-child(3) {        top: 20px;      }      
      #nav-icon1.open span:nth-child(1) {        top: 10px;        -webkit-transform: rotate(135deg);        -moz-transform: rotate(135deg);        -o-transform: rotate(135deg);        transform: rotate(135deg);      }      
      #nav-icon1.open span:nth-child(2) {        opacity: 0;        left: -60px;      }            
      #nav-icon1.open span:nth-child(3) {        top: 10px;        -webkit-transform: rotate(-135deg);        -moz-transform: rotate(-135deg);        -o-transform: rotate(-135deg);       transform: rotate(-135deg);      }
  /* navigation */
  .footerlinks ul{ justify-content: center;}
  .footercenter{ gap: 30px;}
  .bannerslider .slick-prev {    left: 84% !important;}
  .mainlogo img {    height: 100px; }
  .bannerproduct {    padding-top: 100px;     }
  .bannerproduct img{height: 250px;    object-fit: contain; }
  .bannertextpo { background: transparent;}
  .aboutussection .col-lg-5{ order: 2;  }
  .aboutussection .col-lg-7{ order: 1;     padding-left: 25%;  }
  .aboutussection .col-lg-12{ order: 3;  }
  .yearstext{     padding: 100px 40px;}
  .aboutimg {    text-align: center;  padding-top: 30px;}
  .aboutimg img {    height: 300px;   }
  .whoareyou{     background-position: right; position: relative; }
  .whoareyou::after{ content: ""; position: absolute; width: 100%; height: 100%; background-color: rgba(235, 235, 235, 0.7); top: 0;}
  .whomobile {    z-index: 1;}
  .momt-30{ margin-top: 30px;}
  .clientslider .slick-prev {    left: 34% !important;}
  .footerlinks ul{   gap: 30px;}
  .orangesection{   padding: 100px 60px 60px 60px;}
  .whitesection {    padding-top: 60px; padding-bottom: 0;}
  .teamimg{ gap: 30px 0px;}
  .teambg {
    background: linear-gradient(0deg, rgba(255,255,255,0) 0%, rgba(34,133,193,1) 0%, rgba(34,133,193,1) 86%, rgba(255,255,255,0) 86%);
}
.productpageimg {  position: relative; padding-top: 30px;}
.productpage .col-lg-5{ order: 2;  }
.productpage .col-lg-7{ order: 1;}
.productpagetext p {  text-align: center;}
.quickblue{ position: relative; width: fit-content;}
.map{ padding: 0;display: flex;  flex-direction: column;  gap: 60px;}
.map iframe{ order: 2;}
.contactform {
  position: relative; order: 1;     padding-top: 60px;}
}



@media (max-width:768px){
  :root{
    --bigfont:60px;
    --title:35px;
    --smallfont:16px;
    --h3font:28px;
    --midfont:20px;
    --padt:60px;
    --padb:60px;
}
  .qualityflex{ flex-direction: column;    gap: 30px; border-radius: 30px;}  
  .yearstext {    padding: 40px 40px;  position: relative;   width: 100%; display: flex;    height: auto;    align-items: center;    gap: 10px;    justify-content: center;} 
  .aboutussection .col-lg-7{ padding: 0 15px;}
  .representative{     flex-direction: column;     gap: 30px; padding: 50px;align-items: flex-start;}
  .vision{     margin-right: 100px;}
  .visionimg { margin-left: 100px; width: auto; margin-right: 0; margin-top: -200px;}
  .vision{ padding: 0;}
  .visiontext { padding: 30px;}
  .ml-30 {    padding-left: 30px;}
  .teambg {
    background: linear-gradient(0deg, rgba(255,255,255,0) 0%, rgba(34,133,193,1) 0%, rgba(34,133,193,1) 56%, rgba(255,255,255,0) 56%);
}
  
}
@media (max-width:574px){
  .copyright { flex-direction: column; gap: 10px;}
  .mommt-30{ margin-top: 30px;}
  .knowmore.text-right {    display: none;}
  .footerlinks ul{     flex-direction: column;    align-items: center;}  
  .call {    text-align: center;}
  .calldetails {     justify-content: center;}
  .socialfooter{  justify-content: center;}
  .bannertext p{ font-size: calc( var(--smallfont) - 2px ); }
  .teambg {
    background: linear-gradient(0deg, rgba(255,255,255,0) 0%, rgba(34,133,193,1) 0%, rgba(34,133,193,1) 58%, rgba(255,255,255,0) 58%);
}
.spegray1 {padding: 10px;}
.spegray2 {padding: 10px;}
}

@media (max-width:400px){
  .quicksupport{     padding: 40px 30px;}
  .titletext h2{ font-size: calc(var(--title) - 10px);;}
  .titletext.white p{ font-size: calc(30px - 10px);;}
  .representative{ padding: 25px;}
  .quickblue {
    padding: 50px 20px;
}
  .orangesection {
    padding: 100px 30px 30px 30px;
}
.teambg {
  background: linear-gradient(0deg, rgba(255,255,255,0) 0%, rgba(34,133,193,1) 0%, rgba(34,133,193,1) 62%, rgba(255,255,255,0) 62%);
}

}