/* end new */
form.CUS input.subject { display: none; }
.bg-contact-all input, .bg-contact-all textarea{margin: 10px;border-radius: 8px;height: 40px;width: 45%;padding-left: 1%;}
.bg-contact-all select{background-color: #ffffff;border-radius: 8px;height: 40px;margin-left: 2%;}
body{font-family:'Roboto',sans-serif !important;font-size:16px!important;font-weight:400;color:#00184b;overflow-x:hidden ;line-height: 32px!important;}
html{scroll-behavior:smooth}
.container-fluid{padding: 0;}
    .slider-container {
      height: 100vh;
      position: relative;
    }
 
    .carousel-fade .carousel-item {
      transition: opacity 1s ease-in-out;
      opacity: 0;
      display: flex !important;
      height: 100vh;
      flex-direction: row;
      pointer-events: none;
    }
 
    .carousel-fade .carousel-item.active {
      opacity: 1;
      pointer-events: auto;
    }
 
    .text-side, .image-side {
      width: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
      overflow: hidden;
      padding: 20px;
    }
 
    .carousel-item.active .text-content {
      animation: slideUp 0.8s ease-out forwards;
    }
 
    .carousel-item.active .image-side img {
      animation: slideInRight 0.8s ease-out forwards;
    }
 
    .text-content, .image-side img {
      opacity: 0;
    }
 
    .text-content {
      text-align: center;
    }
 
    .text-content h1 {
      font-size: 2.5rem;
      font-weight: bold;
    }
 
    .text-content p {
      font-size: 1.2rem;
      margin-bottom: 20px;
    }
 
    .text-content .btn {
      font-size: 1rem;
      padding: 10px 25px;
    }
 
    .image-side img {
      width: 100%;
      height: 100vh;
      object-fit: cover;
    }
 
    /* Animations */
    @keyframes slideUp {
      from {
        opacity: 0;
        transform: translateY(100px);
      }
      to {
        opacity: 1;
        transform: translateY(0);
      }
    }
 
    @keyframes slideInRight {
      from {
        opacity: 0;
        transform: translateX(100%);
      }
      to {
        opacity: 1;
        transform: translateX(0);
      }
    }
 
    /* Controls */
    .carousel-control-prev,
    .carousel-control-next {
      width: 50px;
      height: 50px;
      top: 50%;
      transform: translateY(-50%);
      background-color: rgba(0, 0, 0, 0.5);
      border-radius: 50%;
      z-index: 5;
    }
 
    .carousel-control-prev-icon,
    .carousel-control-next-icon {
      filter: invert(1);
    }
 
    /* Custom Right Dash Indicators */
    .carousel-indicators.custom-indicators {
      position: absolute;
      right: 15px;
      top: 50%;
      transform: translateY(-50%);
      flex-direction: column;
      gap: 10px;
      margin: 0;
      z-index: 6;
    }
 
    .carousel-indicators.custom-indicators button {
      width: 25px;
      height: 4px;
      background-color: rgba(000, 000, 000, 0.6);
      border: none;
      transition: all 0.3s ease;
      border-radius: 2px;
    }
 
    .carousel-indicators.custom-indicators button.active {
      background-color: #333;
      width: 35px;
    }
 
    /* Mobile Responsive */
    @media (max-width: 767px) {
      .bg-contact-all input, .bg-contact-all textarea{width: 90%;}
      .carousel-item {
        flex-direction: column;
      }
 
      .text-side, .image-side {
        width: 100%;
        height: auto;
        padding: 40px 20px;
      }
 
      .image-side img {
        height: 300px;
      }
 
      .text-content h1 {
        font-size: 1.8rem;
      }
 
      .text-content p {
        font-size: 1rem;
      }
 
      .text-content .btn {
        font-size: 0.9rem;
        padding: 8px 20px;
      }
 
      .carousel-indicators.custom-indicators {
        right: 10px;
      }
    }
.top-1{position: absolute;top: 8%;}
.top-2{position: relative;}
.bg-gradient1{background: #FC6000;
background: linear-gradient(180deg,rgba(252, 96, 0, 1) 0%, rgba(252, 96, 0, 1) 49%, rgba(255, 255, 255, 1) 50%, rgba(255, 255, 255, 1) 100%);}
.bg-logo{background-color: #0b0c68;clip-path: polygon(0% 0%,66% 0%,100% 100%,0% 100%);}
/* banner irving */
/* start steam */
.smoke {
  position: absolute;
  bottom: 0;
  left: 50%;
  width: 200px;
  height: 200px;
  background: radial-gradient(closest-side, rgba(255,255,255,0.8), transparent);
  border-radius: 50%;
  opacity: 0.1;
  animation: smokeRise 4s linear infinite;
  pointer-events: none;
  z-index: 2;
}

@keyframes smokeRise {
  0% {
    transform: translateX(-50%) translateY(0) scale(0.6);
    opacity: 0.3;
  }
  50% {
    transform: translateX(-55%) translateY(-80px) scale(1);
    opacity: 0.5;
  }
  100% {
    transform: translateX(-60%) translateY(-160px) scale(1.3);
    opacity: 0;
  }
}
/* end steam */
 *,*::after, *::before {
            box-sizing: border-box;
            margin: 0;
            padding: 0;
        }

        .carousel-item{
            min-height: 85vh;
            background-position: cover;
            background-size: cover;
            background-repeat: no-repeat;
        }
        
        .carousel-item::before{
          content: '';
          position: absolute;
          inset: 0;
          width: 100%;
          height: 100%;
          background-color: rgba(0, 0, 0, 0.4);
          z-index: -1;
        }

     

        .carousel-item .container{
           position: absolute;
           left: 50%;
           top: 50%;
           transform: translate(-50%, -50%);
           text-align: center;
        }

        .carousel-item h2 {
            font-size: 80px;
            color: #ffffff;
            margin: 0 10px;
        }

        .carousel-item h1 {
            font-size: 25px;
            color: #ffffff;
            margin: 0 10px;
        }

        .carousel-item p {
            color: #a09f9f;
            margin: 0;
        }

        .name h1 {
            font-size: 2em;
            font-weight: bolder;
            font-style: italic;
            margin: 2% 0 2% 0;
        }
.name span {background: #FC6000;
background: radial-gradient(circle,rgba(252, 96, 0, 1) 0%, rgba(9, 9, 121, 1) 100%); padding:0 10px 0 10px;
        }
        .name h2 {
            font-size: 2em;
        }

        .name p {
            color: #ffffff;
            font-size: 1.2em;
            margin: 0;
        }

        .name i {
            width: 35px;
            line-height: 30px;
            color: white;
            margin: 2px;
            font-size: 1.3em;
            display: inline-block;
            border-radius: 50%;
            box-shadow: 0px 0px 2px 2px #000077;
            border: 2px solid transparent;
        }
.num{ margin: 10px;}
        em {
            font-style: normal;
            font-size: 0.7em;
            color: #ccc;
        }

        .carousel-item.active h2 {
            animation: fadeInLeft 0.5s ease forwards;
        }

        .carousel-item.active p {
            animation: fadeInRight 0.5s ease forwards;
        }

        .carousel-controls {
            position: absolute;
            left: 50%;
            bottom: 40px;
            z-index: 10;
            transform: translateX(-50%);
        }

        .carousel-indicators {
            position: relative;
            margin: 0;
        }

        .main .carousel-indicators button {
            width: 60px;
            height: 60px;
            margin: 0 5px;
            border-radius: 50%;
            background-position: center;
            background-size: cover;
            background-repeat: no-repeat;
            border: 2px solid transparent;
            transition: all 0.3s linear;
        }

        .carousel-indicators button.active {
            box-shadow: 0 0 10px #ffffff;
            transform: scale(1.2);
        }

        .carousel-control-prev, 
        .carousel-control-next {
            height: 60px;
            width: 60px;
            background-color: rgba(0, 0, 0, 0.521);
            opacity: 1;
            z-index: 3;
            top: 50%;
            transform: translateY(-50%);
            border-radius: 50%;
        }

        .carousel-control-prev {
            left: -80%;
        }

        .carousel-control-next {
            right: -80%;
        }

        @keyframes fadeInLeft {
            0% {
                opacity: 0;
                transform: translateX(-30px);
            }
            100% {
                opacity: 1;
                transform: translateX(0px);
            }
        }

        @keyframes fadeInRight {
            0% {
                opacity: 0;
                transform: translateX(30px);
            }
            100% {
                opacity: 1;
                transform: translateX(0px);
            }
        }

        @media (max-width: 767px) {
            .carousel-control-next, 
            .carousel-control-prev {
                display: none;
            }
            .carousel-indicators button {
                height: 60px;
                width: 60px;
            }

            .carousel-item h2 {
                font-size: 45px;
            }

            .carousel-item p {
                font-size: 22px;
            }
        }
/* end banner irving */
.list-decoration{list-style: none;}
.ms-7{margin-left: 4rem !important;}
/* gallery */

    .gallery {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
      gap: 1rem;
      padding: 1rem;
    }

    .gallery-item {
      position: relative;
      overflow: hidden;
      cursor: pointer;
      height: 300px;
      --hover-color: rgba(170, 175, 195, 0.6); /* default color */
    }

    .gallery-item img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      display: block;
      transition: transform 0.5s ease;
    }

    .gallery-item .overlay {
      position: absolute;
      top: 0; left: 0;
      width: 100%;
      height: 100%;
      pointer-events: none;
      display: flex;
      align-items: center;
      justify-content: center;
      font-family: "Unica One", sans-serif;
      font-size: 1.5rem;
      color: #fff;
      opacity: 0;
      transition: opacity 0.3s;
      z-index: 10;
    }

    .gallery-item:hover img {
      transform: scale(1.1);
    }

    .gallery-item:hover .overlay {
      opacity: 1;
    }

    .gallery-item::before,
    .gallery-item::after {
      content: "";
      position: absolute;
      background: var(--hover-color);
      width: 100%;
      height: 100%;
      top: 0;
      left: 0;
      transform: translateY(-100%);
      transition: transform 0.3s ease, background 0.3s ease;
      pointer-events: none;
      mix-blend-mode: multiply;
      clip-path: polygon(1rem 1rem, 1rem calc(100% - 1rem), calc(100% - 1rem) calc(100% - 1rem), calc(100% - 1rem) 1rem);
    }

    .gallery-item::after {
      transform: translateX(-100%);
    }

    .gallery-item:hover::before {
      transform: translateY(0);
    }

    .gallery-item:hover::after {
      transform: translateX(0);
    }

    @media (max-width: 768px) {
      .gallery {
        grid-template-columns: 1fr;
      }
    }

    /* Custom hover colors for each image */
    .color-1 { --hover-color: rgba(26, 35, 126, 0.6); }    /* deep blue */
    .color-2 { --hover-color: rgba(181, 161, 183, 0.6); }  /* purple */
    .color-3 { --hover-color: rgba(218, 163, 132, 0.6); }  /* warm peach */
    .color-4 { --hover-color: rgba(165, 214, 167, 0.6); }  /* green */
    .color-5 { --hover-color: rgba(108, 67, 49, 0.6); }    /* brown */
    .color-6 { --hover-color: rgba(85, 85, 85, 0.6); }     /* grey */
    .color-7 { --hover-color: rgba(168, 133, 4, 0.6); }    /* gold */
    .color-8 { --hover-color: rgba(255, 105, 180, 0.6); }  /* pink */
/* end gallery */

/* sec 4 */
.bg-sec-4{background: url('../img/plumber-technician-sec-4.webp') no-repeat;
  background-size: cover;
  background-position: center;}
/* end sec 4 */
.bg-process{background: url('../img/process-steps.webp') no-repeat;
  background-size: contain;
  background-color: #eaeaea;
  background-position: center;}
.bg-header{background: rgb(141,236,180);
  background: linear-gradient(90deg, rgba(141,236,180,1) 0%, rgba(141,236,180,1) 47%, rgba(20,30,70,1) 47%, rgba(20,30,70,1) 100%);}
.bg-theme{background-color:linear-gradient(90deg,rgba(18, 91, 218, 1) 0%, rgba(76, 141, 254, 1) 100%); color: #fff;}
.bg-theme-s{background-color: #8decb4;}
.bg-primary1{background-color: #0b0c68;}
.border1{border: 1px solid #fff;}
.border-bottom1{border-bottom: 1px solid;border-bottom-color:#3268fd}
.border-bottom2{border-bottom: 1px solid;border-bottom-color:#283f88}
.border-bottom-nav{border-bottom: 1px solid;border-bottom-color:#283f88;width: 50%;}
.btn-theme{background: #125BDA;
  background: linear-gradient(90deg,#125bda 0%, rgba(69, 135, 247, 1) 48%, rgba(122, 169, 250, 1) 100%);color:#fff;}
.btn-theme:hover{color: #fff !important;
  background-color: #00184b;}
.icon-theme{color: #acc8fa;}
.color-font{color: #00184b;}
.btn-outline-theme{background:transparent;border-color: #8decb4;color: #fff;}
.btn-outline-theme:hover{background-color: #8decb4;border-color: #00184b;color: #00184b;}
.bg-light-blue{background-color: #b0d9ff;border-top: 2px solid #125BDA;}
.decoration{text-decoration: none!important;}
.span-color{color: #ff3c00;}
.bg-nav{background:rgba(0,0,0,0.5);}
.navbar{padding: 0px;}
.light-blue{background:#f1f6ff;}
.border-radius{border-radius:15px 15px 0 0!important;}
.border-radius1{border-radius:0px 0px 15px 15px!important;}
.row > * {padding: 0px;}
.navbar-brand{padding: 0px;}
.nav-link:active{color:#125bda;}
.nav-link {
  color: #000;

}
.nav-link:hover, .nav-link:focus{
  color: #125bda;

}

#obfuscatedEmail a {
  color: #fff;text-decoration: none!important;
}
.margin-n{margin-top: -2rem;}
h1{font-size: 3rem;}
.dashed3::before, .dashed3::after{ 
  content: "";
  width:300px;
  display: inline-block;
  height:1px;
  background-color: #7a7a7a;
  font-weight: bold;
margin:0 10px 5px 0;
}
.dashed::before { 
  content: "";
  width:70px;
  display: inline-block;
  height:34px;
  background: url('../img/section-sub-shape1.webp') no-repeat;
  font-weight: bold;
  background-size: cover;
  background-position: right center;
margin:0 10px 5px 0;
}
.dashed1::before { 
  content: "";
  width:70px;
  display: inline-block;
  height:40px;
  background: url('../img/section-sub-shape2.webp') no-repeat;
  animation: moveLeftBounce 3s linear infinite;
  font-weight: bold;
  background-size: cover;
  background-position: center center;
margin:0px 30px -10px 0px;
top: 10px;
  position: relative;}
  @keyframes moveLeftBounce {
    0% {
      transform: translateX(0);
    }
    50% {
     transform: translateX(30px);
    }
    100% {
      transform: translateX(0);
    }
  }
  .icon-2::before { 
    content: "";
    width:35px;
    display: inline-block;
    height:35px;
    background: url('../img/lock.gif') no-repeat;
    font-weight: bold;
    background-size: cover;
    background-position: center center;
  margin:0px 5px 0px 0px;
  top: 5px;
    position: relative;}
.move2 {
    animation-name: example;
    animation-duration: 4s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
    transition: all ease 4s;
    margin-bottom: -7%;
  }
  .move3 {
    animation-name: example;
    animation-duration: 4s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
    transition: all ease 4s;
  }
  .move1 {
    animation-name: example2;
    animation-duration: 4s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
    transition: all ease 4s;
    margin-bottom: -7%;
  }
  .rotateme {
    -webkit-animation-name: rotateme;
            animation-name: rotateme;
    -webkit-animation-duration: 20s;
            animation-duration: 20s;
    -webkit-animation-iteration-count: infinite;
            animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
            animation-timing-function: linear;
  }
  @keyframes rotateme {
    from {
      -webkit-transform: rotate(0deg);
              transform: rotate(0deg);
    }
    to {
      -webkit-transform: rotate(360deg);
              transform: rotate(360deg);
    }
  }
  
  @keyframes example {
    0% {
      -webkit-transform: translate(-50px);
      transform: translateY(-50px);}
    50% {
      -webkit-transform: translateY(-20px);
      transform: translateY(-20px);}
    100% {
      -webkit-transform: translateY(-50px);
      transform: translateY(-50px);} }
      
      .zoom {
        -webkit-animation: zoom 1.5s alternate infinite;
        animation: zoom 1.5s alternate infinite;
      }
      @keyframes zoom{
        0% {
          transform: scale(0.5);
        }
      
        100% {
         transform: scale(1.5);
        }
      }
      @keyframes example2 {
        0% {
          -webkit-transform: translateX(-50px);
          transform: translateX(-50px);}
        50% {
          -webkit-transform: translateX(-20px);
          transform: translateX(-20px);}
        100% {
          -webkit-transform: translateX(-50px);
          transform: translateX(-50px);} }
/* banner */
.my-15{margin-top: 4rem; margin-bottom: 4rem;}
.py-15{padding-top: 4rem; padding-bottom: 4rem;}
.margin-theme{margin: 15% 0 15% 0;}
.banner{background-image: url(../img/cypress-air-duct-cleaning-banner.webp);background-position:center top; background-size: 100% auto;background-repeat: no-repeat;position: relative;width:100%}
.banner-vent{background-image: url(../img/cypress-air-vent-cleaning-banner.webp);background-position:center top; background-size: 100% auto;background-repeat: no-repeat;position: relative;width:100%}
.banner-carpet{background-image: url(../img/cypress-carpet-cleaning-banner.webp);background-position:center top; background-size: 100% auto;background-repeat: no-repeat;position: relative;width:100%}
.bg-banner{background-color:rgba(225, 225, 225, 0.8);}
/*title before*/
.title-sec .h5 {
    font-size: 20px;
    text-transform: uppercase;
    position: relative;
    z-index: 1;
    display: inline-block;
}
.title-sec .h5:before {
    position: absolute;
    z-index: 1;
    content: "";
    display: inline-block;
    width: 40px;
    height: 1px;
    background: #684df5;
    right: -46px;
    top: 15px;
}
.title-sec:after {
    position: absolute;
    content: "";
    left: -5px;
    top: -4px;
    background: url(../img/section1.png);
    width: 63px;
    height: 63px;
    display: inline-block;
    background-repeat: no-repeat;
}
/*line*/
/*service box*/
@keyframes bounceInLeft {
  from, 60%, 75%, 90%, to {
    animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }
 
  0% {
    opacity: 0;
    transform: translate3d(-3000px, 0, 0);
  }
 
  60% {
    opacity: 1;
    transform: translate3d(25px, 0, 0);
  }
 
  75% {
    transform: translate3d(-10px, 0, 0);
  }
 
  90% {
    transform: translate3d(5px, 0, 0);
  }
 
  to {
    transform: none;
  }
}
 
.bounceInLeft {
  animation-name: bounceInLeft;
}
@-webkit-keyframes bounceInRight{from,60%,75%,90%,to{-webkit-animation-timing-function:cubic-bezier(0.215,0.61,0.355,1);animation-timing-function:cubic-bezier(0.215,0.61,0.355,1)}from{opacity:0;-webkit-transform:translate3d(3000px,0,0);transform:translate3d(3000px,0,0)}60%{opacity:1;-webkit-transform:translate3d(-25px,0,0);transform:translate3d(-25px,0,0)}75%{-webkit-transform:translate3d(10px,0,0);transform:translate3d(10px,0,0)}90%{-webkit-transform:translate3d(-5px,0,0);transform:translate3d(-5px,0,0)}to{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}@keyframes bounceInRight{from,60%,75%,90%,to{-webkit-animation-timing-function:cubic-bezier(0.215,0.61,0.355,1);animation-timing-function:cubic-bezier(0.215,0.61,0.355,1)}from{opacity:0;-webkit-transform:translate3d(3000px,0,0);transform:translate3d(3000px,0,0)}60%{opacity:1;-webkit-transform:translate3d(-25px,0,0);transform:translate3d(-25px,0,0)}75%{-webkit-transform:translate3d(10px,0,0);transform:translate3d(10px,0,0)}90%{-webkit-transform:translate3d(-5px,0,0);transform:translate3d(-5px,0,0)}to{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}.bounceInRight{-webkit-animation-name:bounceInRight;animation-name:bounceInRight}
/*FAQ*/
.row,.container,.row > *{padding-left:0;padding-right:0!important}

.title-sec .h5::before {color:#ffb74d !important}
.custom-btn {
  color: #fff;
  padding: 10px 25px;
  font-weight: 500;
  background: transparent;
  cursor: pointer;
  border-radius: 25px;
  transition: all 0.3s ease;
  display: inline-block;
  outline: none;position: relative;z-index: 999999
}
a{color:inherit;text-decoration: none;}
.btn-15 {
  background: #0b0c68;
  border: none;
  z-index: 1;
}
.btn-15:after {
  position: absolute;
  content: "";
  width: 0;
  height: 100%;
  top: 0;
  right: 0;
  z-index: -1;
  background-color: #202286;
  border-radius: 25px;
  transition: all 0.3s ease;
}
.btn-15:hover, a:hover {
  color: #fff;
}
.btn-15:hover:after {
  left: 0;
  width: 100%;
}
.btn-15:active {
  top: 2px;
}

/*taba*/
/*taba*/
@media only screen and (max-width:1200px){
.banner{background-size:cover;height:auto}.nav-link{margin-top:20px}
}		
@media only screen and (max-width:700px){
	.row > * {
  padding-right: 5%!important;
  padding-left: 5%!important;
}
 
}
.card{background-color:transparent}
/* end banner */

/* process */
/* process sec */
.process-section {
  background: #fff;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  padding: 90px 0 60px;
}

.single-process-box {
  text-align: center;
  margin-bottom: 30px;
  position: relative;
  z-index: 1;
}

.single-process-box:before {
  position: absolute;
  content: "";
  right: 51px;
  top: 60px;
  width: 100%;
  height: 100%;
  background: url('../img/arrow1.webp');
  background-repeat: no-repeat;
}

.upper.single-process-box:before {
  position: inherit;
}

.process-thumb {
  position: relative;
  z-index: 1;
  width: 142px;
  height: 142px;
  line-height: 142px;
  border-radius: 71px;
  background-color: #f5f8fe;
  transition: .5s;
  display: inline-block;
}

.process-thumb:before {
  position: absolute;
  content: "";
  left: -9px;
  top: -9px;
  width: 160px;
  height: 160px;
  line-height: 160px;
  border-radius: 50%;
  border: 2px dashed #152b63;
  opacity: .154;
  transition: .5s;
}

.process-thumb:after {
  position: absolute;
  content: "";
  z-index: -1;
  left: 0;
  top: 0;
  bottom: 0;
  right: 0;
  border-radius: 71px;
  background: #b0d9ff;
  transform: scale(0);
  transition: .5s;
}


.process-number {
  position: absolute;
  right: -20px;
  top: 0;
  transition: .5s;
}

.process-number span {
  font-size: 14px;
  font-weight: 600;
  color: #fff;
  background: #152b63;
  border-radius: 30px;
  font-family: 'Inter';
  height: 36px;
  width: 36px;
  line-height: 36px;
  text-align: center;
  display: inline-block;
}

h4.process-title {
  font-size: 22px;
  padding: 25px 0 10px;
}

p.process-desc {
  opacity: .6;
  font-weight: 300;
}

span.check-arrow i {
  font-size: 20px;
}

.single-process-box:hover .process-thumb:before {
  border: 2px dashed #b0d9ff;
  opacity: 1;
  -webkit-animation-name: rotateme;
  -webkit-animation-duration: 20s;
  -webkit-animation-iteration-count: infinite;
}

.single-process-box:hover .process-thumb:after {
  transform: scale(1);
}

.single-process-box:hover .process-number {
  right: -8px;
  top: -45px;
}

.process-number {
        right: 24px;
        top: 65px;
    }

    .single-process-box:hover .process-number {
        right: 35px;
    }

    p.process-desc {
        font-size: 13px;
        line-height: 25px;
    }
/* end process sec */

/* why us */
.bg-choose-us{background: url('../img/bg-why-us.webp') no-repeat;
  background-size: cover;
  background-position: center center;}
.why-us-icon1::before {
  content: '\f4c0';
  position: absolute;
  font-family: 'Font Awesome 5 Free';
  font-weight: 900;
  left: 50%;
  transform: translateX(-50%);
  background-color: #212529;
  top: -45px;
  width: 80px;
  height: 80px;
  border-radius: 60px;
  padding-top: 5%;
  font-size: 2rem;
}
.why-us-icon1{
  position: relative;
  text-align: center;
  font-size: large;
  font-size: 1rem;
  color: #00184b;
margin:0 5% 0 5%;
float: left;}

.why-us-icon2::before {
  content: '\f559';
  position: absolute;
  font-family: 'Font Awesome 5 Free';
  font-weight: 900;
  left: 50%;
  transform: translateX(-50%);
  background-color: #0d6efd;
  top: -45px;
  width: 80px;
  height: 80px;
  border-radius: 60px;
  padding-top: 5%;
  font-size: 2rem;
}
.why-us-icon2{
  position: relative;
  text-align: center;
  font-size: large;
  font-size: 1rem;
  color: #00184b;
margin:0 5% 0 5%;
float: left;}

.why-us-icon3::before {
  content: '\f3ed';
  position: absolute;
  font-family: 'Font Awesome 5 Free';
  font-weight: 900;
  left: 50%;
  transform: translateX(-50%);
  background-color: #fff;
  top: -45px;
  width: 80px;
  height: 80px;
  border-radius: 60px;
  padding-top: 5%;
  font-size: 2rem;
}
.why-us-icon3{
  position: relative;
  text-align: center;
  font-size: large;
  font-size: 1rem;
  color: #00184b;
margin:0 5% 0 5%;
float: left;}

/* end why us */
/* counter */
.bg-counter{background: url('../img/bg-counter.webp') no-repeat;
  background-size: cover;
  background-position: center center;color: rgba(255, 255, 255, 0.9);}
/* end counter */
/* gallery */
.navbar-toggler{background-color: #315ce6!important;margin-right: 2%;}
/* end gallery */
.bg-brands{background-color:#031b66 ;}
.sec-1{background: url('../img/bg-sec2.webp') no-repeat;
  background-size: cover;
  background-position: center center;}
/*marquee*/
.marquee{width:100%;margin:0 auto;white-space:nowrap;box-sizing:border-box;animation:marquee 50s linear infinite;color:#fff}
.marquee:hover{animation-play-state:paused}
/* Make it move */
@keyframes marquee{0%{text-indent:27.5em}
100%{text-indent:-105em}
}
/* LOAD */   
.list-group{list-style: none;}
/* END LOAD */
/* load offer */
.loader {
  width: 50px;
  height: 30px;
  display: grid;
  overflow: hidden;
}
.loader:before,
.loader:after {
  content: "";
  grid-area: 1/1;
  background: rgba(0, 0, 0, 0.25);
  clip-path: polygon(0 10px,calc(100% - 15px) 10px,calc(100% - 15px) 0,100% 50%,calc(100% - 15px) 100%,calc(100% - 15px) calc(100% - 10px),0 calc(100% - 10px));
  animation: l5 1s infinite;
  transform: translate(calc(0% + var(--s,0%)));
}
.loader:after {
  --s:-100%;
}
@keyframes l5 {
  80%,100%{transform: translate(calc(100% + var(--s,0%)))}
}

.loader1 {
  width: 30px;
  height: 30px;
  display: inline-block;
  position: relative;
  color: #0c38bb;
  border: 1px solid;
  box-sizing: border-box;
  animation: fill 2s linear infinite alternate;
}

@keyframes fill {
  0% {
    box-shadow: 0 0  inset;
  }
  100% {
    box-shadow: 0 48px inset;
  }
}
  
/* end load offer */
.loader2 {
  width: 100%;
  height: 3px;
  display: inline-block;
  background: rgba(255, 255, 255, 0.15);
  position: relative;
  overflow: hidden;
  margin-right: 10px;
}
.loader2::after {
  content: '';  
  width: 0%;
  height: 3px;
  background-color: #FFF;
  font-size: 15px;
  background-image: linear-gradient(45deg, rgba(0, 0, 0, 0.25) 25%, transparent 25%, transparent 50%, rgba(0, 0, 0, 0.25) 50%, rgba(0, 0, 0, 0.25) 75%, transparent 75%, transparent);
  background-size: 1em 1em;
  position: absolute;
  top: 0;
  left: 0;
  box-sizing: border-box;
  animation: animFw 10s ease-in infinite,  barStripe 2s linear infinite;
}

@keyframes barStripe {
  0% {
    background-position: 1em 0;
  }
  100% {
    background-position: 0 0;
  }
}

@keyframes animFw {
  0% {
    width: 0;
  }
  100% {
    width: 100%;
  }
}
.z-in{position: absolute;
  z-index: 10;
  right: 16%;
}
.z-in3{position: absolute;
  z-index: 10;
}
.z-in2{position: relative;}
.ms-10{margin-left: 12rem!important;clip-path: polygon(20% 100%, 80% 100%, 100% 0%, 0% 0%);width: 308px;height: 120px;z-index: 1;}
.mt-20{margin-top: 20rem!important;}

/* sec2 */
.bg-sec2{background:url('../img/sec-2-bg.webp') no-repeat;
  background-size: cover;
  background-position: center center;}
/* end sec2 */
/* gallery */
.bg-gallery{background-image:url('../img/bg-sec-6.webp') no-repeat;
  background-size: cover;
  background-position: center center; ;}
.card{border: 0px;}
/* end gallery */
/* coupon */
a.lightbox img{height:auto;transition:.5s}
.lightbox-target{position:fixed;top:0;left:0;width:100%;background:rgba(0,0,0,0.7);opacity:0;-webkit-transition:opacity .5s ease-in-out;-moz-transition:opacity .5s ease-in-out;-o-transition:opacity .5s ease-in-out;transition:opacity .5s ease-in-out;overflow:hidden;z-index:12}
.lightbox-target img{margin:auto;position:absolute;top:0;left:0;right:0;bottom:0;box-shadow:0 0 8px rgba(0,0,0,0.7);box-sizing:border-box;transition:.5s ease-in-out}
a.lightbox-close{width:100%;height:100%;position:absolute;transition:.5s ease-in-out;opacity:0;top:0;left:0}
.lightbox-target:target{opacity:1;top:0;bottom:0;width:100%;height:100%}
.lightbox-target:target img{max-height:100%;max-width:100%}
.printable{position:relative;z-index:14}
/* end coupon */
/* contact */

.spam { display:none;}
/* end contact */

/* bg-cards */
.bg-card1{background: url("../img/bg-gallery.webp");
  background-position: left center;
  background-repeat: no-repeat;
  background-size: cover;}
.bg-card2{background: url("../img/bg-gallery.webp");
    background-position: left center;
    background-repeat: no-repeat;
    background-size: cover;}
.bg-card3{background: url("../img/bg-gallery.webp");
      background-position: left center;
      background-repeat: no-repeat;
      background-size: cover;}
.bg-card4{background: url("../img/bg-gallery.webp");
        background-position: left center;
        background-repeat: no-repeat;
        background-size: cover;}
        .box{
          background: linear-gradient(180deg, #3a6bfb 0%, #0b35b4 100%);
          font-family: 'Nanum Gothic', sans-serif;
          border-radius: 25px 0;
          position: relative;
          overflow: hidden;
      }
      .box:before,
      .box:after,
      .box .box-content:before,
      .box .box-content:after{
          content: "";
          background: #fff;
          width: 50%;
          height: 4px;
          transform: scaleX(0);
          position: absolute;
          top: 15px;
          left: 15px;
          z-index: 1;
          transition: all 600ms ease;
      }
      .box:after{
          top: auto;
          bottom: 15px;
          left: auto;
          right: 15px;
      }
      .box .box-content:before,
      .box .box-content:after{
          width: 4px;
          height: 50%;
          transform: scaleY(0);
      }
      .box .box-content:after{
          left: auto;
          right: 15px;
          top: auto;
          bottom: 15px;
      }
      .box:hover:before,
      .box:hover:after,
      .box:hover .box-content:before,
      .box:hover .box-content:after{
          transform: scale(1);
      }
      .box img{
          width: 100%;
          height: auto;
          transform: scale3d(1.1, 1.1, 1);
          transition: all 0.25s linear;
      }
      .box:hover img{
          opacity: 0.25;
          transform: scale(1.25);
      }
      .box .inner-content{
          color: #fff;
          text-align: center;
          width: 70%;
          opacity: 0;
          transform: translateX(-50%) translateY(-50%);
          position: absolute;
          top: 70%;
          left: 50%;
          transition: all 600ms ease;
      }
      .box:hover .inner-content{
          opacity: 1;
          top: 50%;
      }
      .box .title{
          font-size: 20px;
          font-weight: 800;
          letter-spacing: 1px;
          text-transform: uppercase;
          margin: 0 0 3px;
      }
      .box .post{
          font-size: 14px;
          letter-spacing: 1px;
          text-transform: capitalize;
          margin: 0 0 12px;
          display: block;
      }
      .box .icon{
          padding: 0;
          margin: 0;
          list-style: none;
      }
      .box .icon li{
          display: inline-block;
          margin: 0 4px;
      }
      .box .icon li a{
          color: #fff;
          font-size: 18px;
          line-height: 32px;
          height: 35px;
          width: 35px;
          border: 2px solid #fff;
          border-radius: 10px 0 10px 0;
          display: block;
          transition: all 0.3s;
      }
      .box .icon li a:hover{
          color: #3a6bfb;
          background: #fff;
          border-radius: 0 10px 0 10px;
      }
      @media only screen and (max-width:990px){
          .box { margin: 0 0 30px; }
      }
/* end bg-cards */

/* Contact us */
.bg-contact-all{background:url('../img/bg-form.webp') no-repeat;
  background-size: cover;
  background-position: center center;}
.bg-contact{background-color: #fc6000; margin-top: -10%;
 }
 .bg-contact1{background-color: #fc6000; 
 }
 .form-control{width: 46%;display:inline}
 .comment{width: 95%;}
/* end contact us */
/* test */
.bg-test{background: url("../img/bg-testimonials.webp");
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;}
/* end test */
/* sec4 */
.bg-sec-6{background: url("../img/bg-sec-6.webp");
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
}
/* end sec4 */

/* reviews */
.bg-tesimoials{width: 100%;background: url("../img/bg-testimonials.webp");
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;}
/* end reviews */

/* footer */
.bg-footer{background:url('../img/bg-footer.webp') no-repeat center;background-size:cover; background-attachment:fixed;}
.contact-info a{color: #fff;text-decoration: none;}
/* end footer */
@media (max-width:1500px){.display-3{display: none;}.display-13{display: none;}.z-in{position: static;right: 0;}.bg-gradient1{background-color: #031b66;background: linear-gradient(180deg,rgba(225, 225, 225, 1) 0%, rgba(225, 225, 225, 1) 49%, rgba(225, 225, 225, 1) 50%, rgba(225, 225, 225, 1) 100%);}
 .bg-logo{background-color: rgba(0, 0, 119, 9);clip-path: polygon(0% 2%,100% 3%,100% 100%,0% 100%);}}
@media (max-width:1400px){.mt-20{margin-top: 0px!important;}.top-1{position: initial;top: 0; left: 0; width: 100%;}
.top-2{position: initial;}}
@media (max-width:1300px){.display-top{display: none;}}
@media (max-width:1000px){
  .display-top1{display: none;}.my-15{margin-top: 7rem;margin-bottom: 0rem;}}
/*!
 * Font Awesome Free 5.15.4 by @fontawesome - https://fontawesome.com
 * License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License)
 */
.fa,
.fab {
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased;
  display: inline-block;
  font-style: normal;
  font-variant: normal;
  text-rendering: auto;
  line-height: 1; }

/* Font Awesome uses the Unicode Private Use Area (PUA) to ensure screen
readers do not read off random characters that represent icons */

.fa-arrow-circle-right:before {
  content: "\f0a9"; }

.fa-check-square:before {
  content: "\f14a"; }

.fa-facebook-f:before {
  content: "\f39e"; }

.fa-google:before {
  content: "\f1a0"; }

.fa-instagram:before {
  content: "\f16d"; }

.fa-phone-volume:before {
  content: "\f2a0"; }

.fa-pinterest:before {
  content: "\f0d2"; }

.fa-tiktok:before {
  content: "\e07b"; }

.fa-tumblr:before {
  content: "\f173"; }
@font-face {
  font-family: 'Font Awesome 5 Brands';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../webfonts/fa-brands-400.eot");
  src: url("../webfonts/fa-brands-400.eot?#iefix") format("embedded-opentype"), url("../webfonts/fa-brands-400.woff2") format("woff2"), url("../webfonts/fa-brands-400.woff") format("woff"), url("../webfonts/fa-brands-400.ttf") format("truetype"), url("../webfonts/fa-brands-400.svg#fontawesome") format("svg"); }

.fab {
  font-family: 'Font Awesome 5 Brands';
  font-weight: 400; }
@font-face {
  font-family: 'Font Awesome 5 Free';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../webfonts/fa-regular-400.eot");
  src: url("../webfonts/fa-regular-400.eot?#iefix") format("embedded-opentype"), url("../webfonts/fa-regular-400.woff2") format("woff2"), url("../webfonts/fa-regular-400.woff") format("woff"), url("../webfonts/fa-regular-400.ttf") format("truetype"), url("../webfonts/fa-regular-400.svg#fontawesome") format("svg"); }
@font-face {
  font-family: 'Font Awesome 5 Free';
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src: url("../webfonts/fa-solid-900.eot");
  src: url("../webfonts/fa-solid-900.eot?#iefix") format("embedded-opentype"), url("../webfonts/fa-solid-900.woff2") format("woff2"), url("../webfonts/fa-solid-900.woff") format("woff"), url("../webfonts/fa-solid-900.ttf") format("truetype"), url("../webfonts/fa-solid-900.svg#fontawesome") format("svg"); }

.fa {
  font-family: 'Font Awesome 5 Free';
  font-weight: 900; }

/* work process */