@charset "utf-8";
/* CSS Document */
body{margin:0;padding: 0;color:#00184b;overflow-x: hidden;font-family: Helvetica, sans-serif}
/* nmenu */
.bg-gradient1{background: #DBE8FF;
background: linear-gradient(90deg,rgba(219, 232, 255, 1) 0%, rgba(219, 232, 255, 1) 19%, rgba(77, 142, 255, 1) 19%, rgba(77, 142, 255, 1) 100%);}
.bg-logo{background-color: #DBE8FF;border-radius: 0 38px 38px 0;}
.font-head{font-size: 4rem;}
.dashed1::before {
content: "";
  font-weight: bold;
  display: inline-block;
  background-color: #333;
  margin-right: 20px;
  width: 70px;
  height: 2px;
  margin-left: 5px;
  margin-bottom:5px
}
.custom-btn {
  color: #000;
  padding: 10px 25px;
  font-weight: 500;
  background: transparent;
  cursor: pointer;
  border-radius: 35px;
  transition: all 0.3s ease;
  display: inline-block;
  outline: none;position: relative;z-index: 999999
}
a{color:inherit;text-decoration: none;}
.btn-15 {
  background: #d5e4fe;
  border: none;
  z-index: 1;
}
.btn-15:after {
  position: absolute;
  content: "";
  width: 0;
  height: 100%;
  top: 0;
  right: 0;
  z-index: -1;
  background-color: #fff;
  border-radius: 35px;
  transition: all 0.3s ease;
}
.btn-15:hover, a:hover {
  color: #333;
}
.btn-15:hover:after {
  left: 0;
  width: 100%;
}
.btn-15:active {
  top: 2px;
}
.custom-btn1 {
  color: #fff!important;
  padding: 10px 25px;
  font-weight: 500;
  background: transparent;
  cursor: pointer;
  border-radius: 35px;
  transition: all 0.3s ease;
  display: inline-block;
  outline: none;position: relative;z-index: 999999
}
a{color:inherit;text-decoration: none;}
.btn-16 {
  background: #699bff;
  background: linear-gradient(280deg,rgba(105, 155, 255, 1) 0%, rgba(20, 93, 219, 1) 100%);
  border: none;
  z-index: 1;
}
.btn-16:after {
  position: absolute;
  content: "";
  width: 0;
  height: 100%;
  top: 0;
  right: 0;
  z-index: -1;
  background-color: #DBE8FF;
  background: linear-gradient(280deg,rgba(219, 232, 255, 1) 0%, rgba(197, 212, 240, 1) 100%);
  border-radius: 35px;
  transition: all 0.3s ease;
}
.btn-16:hover {
  color: #333!important;
}
.btn-16:hover:after {
  left: 0;
  width: 100%;
}
.btn-16:active {
  top: 2px;
}
/* end menu */
html{scroll-behavior:smooth}
.row > *,.row {
  padding-right: 0!important;
  padding-left: 0!important;margin:0
}


/* banner */
.bg-banner{background:url('../img/garage-door-repair-bg.webp') no-repeat center;background-size:cover; background-attachment:fixed;}
.margin-theme{margin: 15% 0 15% 0;}
.z-in3{z-index: 2;}
/* end banner */
/*scale*/
.zoom {
    -webkit-animation: zoom 2s alternate infinite;
    animation: zoom 2s alternate infinite;right:-50px;bottom: 10px
}
@keyframes zoom {
    0% {
        transform: scale(0.5);
    }

    100% {
        transform: scale(1.2);
    }
}
/*scale*/
.card{background-color: transparent;}
.bg-gallery{background:url('../img/bg-form.webp') no-repeat center;background-size:cover; background-attachment:fixed;}
/*button*/
.btn:hover{background:#00184b;border-color:#00184b}
/*button*/
/*service box*/
.services{background: url("../img/service-bg.webp") right center;background: url("../img/rotate-shape.webp") left center;background-size: cover; background-repeat: no-repeat}	
        /* button f */
        /* end button f */
/*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;
}
ul li{list-style: none}
/*FAQ*/

@media (max-width:1300px){.display-top2{display: none;}.z-in3{right: 8%;position: static;} .text-end1{text-align: end!important;}}
/*FAQ*/

@media (max-width: 580px) {
  body {
    flex-direction: column;
  }
}
/*counter*/
/*testimonials*/
.bg-img1{background:url('../img/bg-testi.webp') no-repeat center top;background-size:100% 60%;}
/*marquee*/
.spam { display:none;}
.form-control{width:90%;float:left;margin-right:2%;border-radius:0; border: none;}
.comment {
  display: block;
  width: 92%;
  padding: .375rem .75rem;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background-color: var(--bs-body-bg);
  background-clip: padding-box;
  border: none;
  transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;float:left;border-radius:0;color:#868686
}
.container-fluid{padding:0;}
.move3 {
  animation-name: example;
  animation-duration: 4s;
  animation-iteration-count: infinite;
  animation-timing-function: linear;
  transition: all ease 4s;left:0px;font-weight:900;
	bottom:100px;border-radius: 20px}
@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);} }
.exp-box {
  background-color: #4d8eff;
  width: 350px;
  padding: 30px 10px 42px;
  text-align: center;color:#fff;font-weight: bold;position: absolute;
}
.overlay-anim:after {
  background: rgba(255, 255, 255, 0.3);
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 0;
  opacity: 1;
  z-index: 9;
  pointer-events: none;
}
.overlay-anim:hover:after {
  height: 100%;
  opacity: 0;
  -webkit-transition: all 400ms linear;
  transition: all 400ms linear;
}
a{color:#00184b}

.row{margin-top:0}
/*process*/
.icon-top{background: #00184b;float:left;padding:20px;transition: 1s}	
.section-counter{background-image: url(../img/section-counter-bg.webp);}
/*process*/
/*footer*/
.footer{color:#fff;background: #00184b}
.footer h2::before {
  content: "";
  position: absolute;
  width: 50px;
  height: 2px;
  background-color: #03bce1;
  bottom: -14px;
  left: 0;
}
.footer h2{font-size:1.5rem;margin-top:30px}
.bg-secondary{padding:5px 10px;color:#fff}
/* Responsive Css Coding Created By Shift Media Solutions| SMS */
/*footer*/
a:link, a:active, a:hover{color:inherit;text-decoration: none}
.footer a{color:#fff}
@media only screen and (max-width:1800px){
.section-counter{background-image: none;background-color: #4d8eff;}
}	
@media only screen and (max-width:1600px){
.bg-sec-1{background-color: rgba(255, 255, 255, 0.5);}}
@media only screen and (max-width:1200px){.nav-link{margin-top:20px}
.bg-img1{background-size:cover}	
.navbar{padding-left:2%}
.bg-top{background-color: #4d8eff;}
}	
@media only screen and (max-width:850px){	.navbar-toggler{background: #fff}
}
/*banner*/

/* ===================== RESPONSIVE IPAD ============================= */
.icon-top:hover{background: #03bce1;}
/*banner*/
/*water button*/
/*water button*/
/*service-style*/
@keyframes bounceInLeft{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)}
0%{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)}
}
.bounceInLeft{-webkit-animation-name:bounceInLeft;animation-name:bounceInLeft}
/*service-style*/
/*form*/
.dance2 {
    -webkit-animation: dance2 4s alternate infinite;
    animation: dance2 4s alternate infinite;z-index: -1;
}

@keyframes dance2 {
    0% {
        transform: translate3d(0, 0, 0);
    }

    50% {
        transform: translate3d(25px, -25px, 0);
    }

    100% {
        transform: translate3d(0, -25px, 25px);
    }
}
/*form*/
.big-title-font {
  font-size: 50px;
  -webkit-text-stroke: 1px #8f9399;
  -webkit-text-fill-color: transparent;
  line-height: 1;margin-bottom: 50px;margin-top: 50px
}
/*!
 * Font Awesome Free 7.0.0 by @fontawesome - https://fontawesome.com
 * License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License)
 * Copyright 2025 Fonticons, Inc.
 */
.fa-brands,
.fas,
.fa {
  --_fa-family: var(--fa-family, var(--fa-style-family, "Font Awesome 7 Free"));
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  display: var(--fa-display, inline-block);
  font-family: var(--_fa-family);
  font-feature-settings: normal;
  font-style: normal;
  font-synthesis: none;
  font-variant: normal;
  font-weight: var(--fa-style, 900);
  line-height: 1;
  text-align: center;
  text-rendering: auto;
  width: var(--fa-width, 1.25em);
}

:is(.fas,
.far,
.fab,
.fa-solid,
.fa-regular,
.fa-brands,
.fa-classic,
.fa)::before {
  content: var(--fa);
  content: var(--fa)/"";
}

/* Heads Up: Bordered Icons will not be supported in the future!
  - This feature will be deprecated in the next major release of Font Awesome (v8)!
  - You may continue to use it in this version *v7), but it will not be supported in Font Awesome v8.
*/
/* Notes:
* --@{v.$css-prefix}-border-width = 1/16 by default (to render as ~1px based on a 16px default font-size)
* --@{v.$css-prefix}-border-padding =
  ** 3/16 for vertical padding (to give ~2px of vertical whitespace around an icon considering it's vertical alignment)
  ** 4/16 for horizontal padding (to give ~4px of horizontal whitespace around an icon)
*/

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

.fa-clock {
  --fa: "\f017";
}

.fa-map-marker {
  --fa: "\f041";
}

.fa-phone {
  --fa: "\f095";
}

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

.fa-angle-double-right {
  --fa: "\f101";
}

.fa-comment-dollar {
  --fa: "\f651";
}
:root, :host {
  --fa-family-brands: "Font Awesome 7 Brands";
  --fa-font-brands: normal 400 1em/1 var(--fa-family-brands);
}

@font-face {
  font-family: "Font Awesome 7 Brands";
  font-style: normal;
  font-weight: 400;
  font-display: block;
  src: url("../webfonts/fa-brands-400.woff2");
}
.fa-brands {
  --fa-family: var(--fa-family-brands);
  --fa-style: 400;
}

.fa-twitter {
  --fa: "\f099";
}

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

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

.fa-yelp {
  --fa: "\f1e9";
}

.fa-facebook-f {
  --fa: "\f39e";
}:root, :host {
  --fa-family-classic: "Font Awesome 7 Free";
  --fa-font-regular: normal 400 1em/1 var(--fa-family-classic);
  /* deprecated: this older custom property will be removed next major release */
  --fa-style-family-classic: var(--fa-family-classic);
}

@font-face {
  font-family: "Font Awesome 7 Free";
  font-style: normal;
  font-weight: 400;
  font-display: block;
  src: url("../webfonts/fa-regular-400.woff2");
}:root, :host {
  --fa-family-classic: "Font Awesome 7 Free";
  --fa-font-solid: normal 900 1em/1 var(--fa-family-classic);
  /* deprecated: this older custom property will be removed next major release */
  --fa-style-family-classic: var(--fa-family-classic);
}

@font-face {
  font-family: "Font Awesome 7 Free";
  font-style: normal;
  font-weight: 900;
  font-display: block;
  src: url("../webfonts/fa-solid-900.woff2");
}
.fas {
  --fa-family: var(--fa-family-classic);
  --fa-style: 900;
}@font-face {
  font-family: "Font Awesome 5 Brands";
  font-display: block;
  font-weight: 400;
  src: url("../webfonts/fa-brands-400.woff2") format("woff2");
}
@font-face {
  font-family: "Font Awesome 5 Free";
  font-display: block;
  font-weight: 900;
  src: url("../webfonts/fa-solid-900.woff2") format("woff2");
}
@font-face {
  font-family: "Font Awesome 5 Free";
  font-display: block;
  font-weight: 400;
  src: url("../webfonts/fa-regular-400.woff2") format("woff2");
}@font-face {
  font-family: "FontAwesome";
  font-display: block;
  src: url("../webfonts/fa-solid-900.woff2") format("woff2");
}
@font-face {
  font-family: "FontAwesome";
  font-display: block;
  src: url("../webfonts/fa-brands-400.woff2") format("woff2");
}
@font-face {
  font-family: "FontAwesome";
  font-display: block;
  src: url("../webfonts/fa-regular-400.woff2") format("woff2");
  unicode-range: U+F003, U+F006, U+F014, U+F016-F017, U+F01A-F01B, U+F01D, U+F022, U+F03E, U+F044, U+F046, U+F05C-F05D, U+F06E, U+F070, U+F087-F088, U+F08A, U+F094, U+F096-F097, U+F09D, U+F0A0, U+F0A2, U+F0A4-F0A7, U+F0C5, U+F0C7, U+F0E5-F0E6, U+F0EB, U+F0F6-F0F8, U+F10C, U+F114-F115, U+F118-F11A, U+F11C-F11D, U+F133, U+F147, U+F14E, U+F150-F152, U+F185-F186, U+F18E, U+F190-F192, U+F196, U+F1C1-F1C9, U+F1D9, U+F1DB, U+F1E3, U+F1EA, U+F1F7, U+F1F9, U+F20A, U+F247-F248, U+F24A, U+F24D, U+F255-F25B, U+F25D, U+F271-F274, U+F278, U+F27B, U+F28C, U+F28E, U+F29C, U+F2B5, U+F2B7, U+F2BA, U+F2BC, U+F2BE, U+F2C0-F2C1, U+F2C3, U+F2D0, U+F2D2, U+F2D4, U+F2DC;
}
@font-face {
  font-family: "FontAwesome";
  font-display: block;
  src: url("../webfonts/fa-v4compatibility.woff2") format("woff2");
  unicode-range: U+F041, U+F047, U+F065-F066, U+F07D-F07E, U+F080, U+F08B, U+F08E, U+F090, U+F09A, U+F0AC, U+F0AE, U+F0B2, U+F0D0, U+F0D6, U+F0E4, U+F0EC, U+F10A-F10B, U+F123, U+F13E, U+F148-F149, U+F14C, U+F156, U+F15E, U+F160-F161, U+F163, U+F175-F178, U+F195, U+F1F8, U+F219, U+F27A;
}