#hero h1,

#hero h2,

#hero h3 {

  color: #fffaf0;

}



#footer .footer-top .footer-contact,

#footer .footer-top .footer-info,

#footer .footer-top .footer-links,

#hero h3 {

  margin-bottom: 30px;

}



@font-face {

  font-family: Warmesty;

  src: url(../font/Warmesty.ttf) format("truetype");

  font-display: swap;

}



@font-face {

  font-family: Nathalia;

  src: url(../font/Nathalia.ttf) format("truetype");

  font-display: swap;

}



@font-face {

  font-family: brownies;

  src: url(../font/brownies\ cake.ttf) format("truetype");

  font-display: swap;

}



@font-face {

  font-family: Adriana;

  src: url(../font/adriana/Adriana.ttf) format("truetype");

  font-display: swap;

}



@font-face {

  font-family: Baby;

  src: url(../font/Baby\ Darling.ttf) format("truetype");

  font-display: swap;

}



@font-face {

  font-family: Cream;

  src: url(../font/Cream\ Cake.ttf) format("truetype");

  font-display: swap;

}



@font-face {

  font-family: Signatra;

  src: url(../font/Signatra.ttf) format("truetype");

  font-display: swap;

}



@font-face {

  font-family: Amarillo;

  src: url(../font/Amarillo.ttf) format("truetype");

  font-display: swap;

}



@font-face {

  font-family: Ananda;

  src: url(../font/Ananda\ Personal\ Use.ttf) format("truetype");

  font-display: swap;

}



@font-face {

  font-family: Birds;

  src: url(../font/Birds\ of\ Paradise\ +\ PERSONAL\ USE\ ONLY.ttf)

    format("truetype");

  font-display: swap;

}



@font-face {

  font-family: Valentina;

  src: url(../font/Hello\ Valentina.ttf) format("truetype");

  font-display: swap;

}



@font-face {

  font-family: hello;

  src: url(../font/hello\ honey.otf);

  font-display: swap;

}



@font-face {

  font-family: BacktoBlack;

  src: url(../font/Back\ to\ Black\ Demo.ttf);

  font-display: swap;

}



@font-face {

  font-family: BillionDreams_PERSONAL;

  src: url(../font/BillionDreams_PERSONAL.ttf);

  font-display: swap;

}



@font-face {

  font-family: Blacksword;

  src: url(../font/Blacksword.otf);

  font-display: swap;

}



@font-face {

  font-family: Cherolina;

  src: url(../font/Cherolina.ttf);

  font-display: swap;

}



@font-face {

  font-family: lambresia;

  src: url(../font/lambresia.otf);

  font-display: swap;

}



@font-face {

  font-family: mellisahella;

  src: url(../font/mellisahella.ttf);

  font-display: swap;

}



@font-face {

  font-family: WhiteBowling;

  src: url(../font/White\ Bowling.ttf);

  font-display: swap;

}



@font-face {

  font-family: Bacalisties;

  src: url(../font/Bacalisties.ttf);

  font-display: swap;

}



@font-face {

  font-family: Beauty;

  src: url(../font/Beauty\ Queen.ttf);

  font-display: swap;

}



@font-face {

  font-family: CassandraPersonalUseRegular;

  src: url(../font/CassandraPersonalUseRegular-3BjG.ttf);

  font-display: swap;

}



@font-face {

  font-family: Empirez;

  src: url(../font/Empirez-PKZJx.ttf);

  font-display: swap;

}



@font-face {

  font-family: Chopsic;

  src: url(../font/Chopsic-K6Dp.ttf);

  font-display: swap;

}



@font-face {

  font-family: Spantaran;

  src: url(../font/Spantaran-GE2D.ttf);

  font-display: swap;

}



@font-face {

  font-family: SweetSensationsPersonalUse;

  src: url(../font/SweetSensationsPersonalUse-lRgq.ttf);

  font-display: swap;

}



@font-face {

  font-family: ComicSans;

  src: url(../font/ComicSans.ttf);

  font-display: swap;

}



@font-face {

  font-family: JosefinSans;

  src: url(../font/JosefinSans.ttf);

  font-display: swap;

}



@font-face {

  font-family: Jumper;

  src: url(../font/JumperPersonalUseOnlyRegular.ttf);

  font-display: swap;

}



body {

  font-family: "Open Sans", sans-serif;

  color: #554945;

}



::-webkit-scrollbar {

  width: 6px;

  background-color: #f5f5f5;

}



::-webkit-scrollbar-track {

  -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);

  background-color: #f5f5f5;

}



::-webkit-scrollbar-thumb {

  background-color: #555;

}



/* ::-webkit-scrollbar {

    width: 12px;

    background-color: #F5F5F5;

}

::-webkit-scrollbar-track {

    -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);

    border-radius: 10px;

    background-color: #F5F5F5;

}

::-webkit-scrollbar-thumb {

    border-radius: 10px;

    -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, .3);

    background-color: #555;

} */



#readButton,

.careers .cta-btn,

h1,

h2,

h3,

h4,

h5,

h6 {

  font-family: Raleway, sans-serif;

}



#about1 .about-col h2 a:hover,

#about1 .about-col:hover i,

#footer .credits a,

#footer .footer-top .footer-links ul a:hover,

.mobile-nav-toggle i,

.nav-menu .drop-down ul .active > a,

.nav-menu .drop-down ul a:hover,

.nav-menu .drop-down ul li:hover > a,

.servicesInfo .icon-box:hover .icon i,

.why-us .icon-box:hover i,

a {

  color: #06bff9;

}



.mobile-nav .active > a,

.mobile-nav a:hover,

.mobile-nav li:hover > a,

a:hover {

  color: #06bff9;

  text-decoration: none;

}



.back-to-top i,

.back-to-top i:hover {

  background: #06bff9;

  color: #fff;

}



#preloader {

  position: fixed;

  top: 0;

  left: 0;

  right: 0;

  bottom: 0;

  z-index: 9999;

  overflow: hidden;

  background: #fff;

}



#preloader:before {

  content: "";

  position: fixed;

  top: calc(50% - 30px);

  left: calc(50% - 30px);

  border: 6px solid #06bff9;

  border-top-color: #fff;

  border-radius: 50%;

  width: 60px;

  height: 60px;

  -webkit-animation: 1s linear infinite animate-preloader;

  animation: 1s linear infinite animate-preloader;

}



@-webkit-keyframes animate-preloader {

  0% {

    transform: rotate(0);

  }



  100% {

    transform: rotate(360deg);

  }

}



@keyframes animate-preloader {

  0% {

    transform: rotate(0);

  }



  100% {

    transform: rotate(360deg);

  }

}



.back-to-top {

  position: fixed;

  display: none;

  right: 15px;

  bottom: 15px;

  z-index: 99999;

}



.back-to-top i {

  display: flex;

  align-items: center;

  justify-content: center;

  font-size: 24px;

  width: 40px;

  height: 40px;

  border-radius: 4px;

  transition: 0.4s;

}



#header {

  transition: 0.5s;

  z-index: 997;

  padding: 7px 0;

  background-color: #fff;

}



#header .logo {

  font-size: 32px;

  margin: 0;

  padding: 0;

  line-height: 1;

  /* font-weight: 600; */

  letter-spacing: 0;

  font-family: Jumper;

}



#header .logo a {

  color: #493c3e;

}



#header .logo h6 a {

  font-family: Jumper;

  color: #eb2127 !important;

  position: absolute;

  right: -1px;

  top: 32px;

  font-size: 9.5px;

}



#hero .btn-get-started,

.nav-menu a {

  font-family: Poppins, sans-serif;

  color: #fff;

}



#header .detail .icon-box:hover .icon i,

.mobile-nav-active .mobile-nav-toggle i,

.pricing .featured h3,

.pricing .featured h4,

.pricing .featured ul,

.pricing .featured ul .na,

.pricing .featured ul li,

.services .icon-box:hover .description,

.services .icon-box:hover .icon i,

.services .icon-box:hover .title a,

.servicesInfo .icon-box:hover h4 a,

.servicesInfo .icon-box:hover p a,

.why-us .icon-box:hover a,

.why-us .icon-box:hover h4 {

  color: #fff;

}



#header .logo img {

  max-height: 70px;

}



#header.header-inner-pages,

#header.header-scrolled {

  background: #fff;

  box-shadow: 0 2px 15px rgba(0, 0, 0, 0.1);

  padding: 7px 0;

}



#header.header-inner-pages .logo a,

#header.header-scrolled .logo a,

.header-inner-pages .nav-menu > ul > li > a,

.header-scrolled .nav-menu > ul > li > a {

  color: #493c3e;

}



.mobile-nav *,

.nav-menu ul {

  margin: 0;

  padding: 0;

  list-style: none;

}



.mobile-nav,

.nav-menu .drop-down ul {

  opacity: 0;

  visibility: hidden;

  padding: 10px 0;

}



.nav-menu > ul {

  display: flex;

}



.nav-menu > ul > li {

  position: relative;

  white-space: nowrap;

  padding: 10px 0 10px 25px;

}



.nav-menu a {

  display: block;

  position: relative;

  transition: 0.3s;

  font-size: 15px;

  padding: 0 4px;

  letter-spacing: 0.4px;

  color: #000;

}



.nav-menu > ul > li > a:before {

  content: "";

  position: absolute;

  width: 100%;

  height: 2px;

  bottom: -6px;

  left: 0;

  background-color: #06bff9;

  visibility: hidden;

  transform: scaleX(0);

  transition: 0.3s ease-in-out;

}



.nav-menu .active > a:before,

.nav-menu a:hover:before,

.nav-menu li:hover > a:before {

  visibility: visible;

  transform: scaleX(1);

}



.nav-menu .drop-down ul {

  display: block;

  position: absolute;

  left: 0;

  top: calc(100% + 30px);

  z-index: 99;

  background: #fff;

  box-shadow: 0 0 30px rgba(127, 137, 161, 0.25);

  transition: 0.3s;

}



.nav-menu .drop-down:hover > ul {

  opacity: 1;

  top: 100%;

  visibility: visible;

}



.nav-menu .drop-down li {

  min-width: 180px;

  position: relative;

}



.nav-menu .drop-down ul a {

  padding: 10px 20px;

  font-size: 14px;

  text-transform: none;

  color: #493c3e;

}



.nav-menu .drop-down > a:after {

  content: "\ea99";

  font-family: IcoFont;

  padding-left: 5px;

}



.nav-menu .drop-down .drop-down ul {

  top: 0;

  left: calc(100% - 30px);

}



.nav-menu .drop-down .drop-down:hover > ul {

  opacity: 1;

  top: 0;

  left: 100%;

}



.mobile-nav .drop-down > a,

.nav-menu .drop-down .drop-down > a {

  padding-right: 35px;

}



.nav-menu .drop-down .drop-down > a:after {

  content: "\eaa0";

  font-family: IcoFont;

  position: absolute;

  right: 15px;

}



@media (max-width: 1445px) {

  .nav-menu .drop-down .drop-down ul,

  .nav-menu .drop-down .drop-down:hover > ul {

    left: -84%;

  }



  .nav-menu .drop-down .drop-down > a:after {

    content: "\ea9d";

  }

}



.mobile-nav-toggle {

  position: fixed;

  right: 15px;

  top: 35px;

  z-index: 9998;

  border: 0;

  background: 0 0;

  font-size: 24px;

  transition: 0.4s;

  outline: 0 !important;

  line-height: 1;

  cursor: pointer;

  text-align: right;

}



.mobile-nav,

.mobile-nav-overly {

  position: fixed;

  transition: 0.2s ease-in-out;

}



#hero h1,

.h1-style {

  font-weight: 900;

  line-height: 56px;

}



.mobile-nav {

  top: 55px;

  right: 15px;

  bottom: 15px;

  left: 15px;

  z-index: 9999;

  overflow-y: auto;

  background: #fff;

  border-radius: 10px;

}



.mobile-nav a {

  display: block;

  position: relative;

  color: #493c3e;

  padding: 10px 20px;

  font-weight: 500;

  outline: 0;

}



.mobile-nav .drop-down > a:after {

  content: "\ea99";

  font-family: IcoFont;

  padding-left: 10px;

  position: absolute;

  right: 15px;

}



.mobile-nav .active.drop-down > a:after {

  content: "\eaa1";

}



.mobile-nav .drop-down ul {

  display: none;

  overflow: hidden;

}



.mobile-nav .drop-down li {

  padding-left: 20px;

}



.mobile-nav-overly {

  width: 100%;

  height: 100%;

  z-index: 9997;

  top: 0;

  left: 0;

  background: rgba(45, 37, 38, 0.6);

  overflow: hidden;

  display: none;

}



.mobile-nav-active {

  overflow: hidden;

}



.mobile-nav-active .mobile-nav {

  opacity: 1;

  visibility: visible;

}



#hero {

  width: 100%;

  height: 100vh;

  background: url("../img/wallpaper/2.webp") top center/cover;

  position: relative;

}



#hero:before {

  content: "";

  background: rgba(0, 0, 0, 0.4);

  position: absolute;

  bottom: 0;

  top: 0;

  left: 0;

  right: 0;

}



/* #hero .hero-container {



    position: absolute;



    bottom: 0;



    top: 0;



    left: 0;



    right: 0;



    display: flex;



    justify-content: center;



    align-items: center;



    flex-direction: column;



    text-align: center;



    padding: 0 15px;


} */



#hero .hero-container {

  position: absolute;



  bottom: 0;



  top: 10%;



  left: 0;



  right: 0;



  display: flex;



  justify-content: space-between;



  align-items: center;



  padding: 0px 15px;



  margin-right: auto;



  margin-left: auto;

}



#about .about-img,

#about1,

.why-us {

  position: relative;

}



#hero h3 {

  background: rgba(255, 255, 255, 0.1);



  font-size: 26px;



  padding: 10px 30px;



  font-weight: 900;



  border-radius: 50px;

}



#hero h1 {

  margin: 0 0 10px;



  font-size: 46px;



  text-transform: uppercase;



  font-family: JosefinSans, sans-serif;

}



#hero h2 {

  margin-bottom: 20px;



  font-weight: 700;



  font-size: 22px;



  font-family: JosefinSans, sans-serif;

}



#hero h4 {

  margin: 0 0 10px;

  font-size: 46px;

  font-weight: 700;

  text-transform: uppercase;

  font-family: JosefinSans, sans-serif;

}



@media (min-width: 200px) and (max-width: 450px) {

  #hero h4 {

    margin: 10px 0 10px;



    font-size: 30px;

  }

}



#hero .btn-get-started {

  text-transform: uppercase;



  font-size: 13px;



  letter-spacing: 1px;



  display: inline-block;



  font-weight: 900;



  padding: 8px 30px 9px;



  border-radius: 50px;



  transition: 0.5s;



  border: 2px solid #fff;

}



#hero .btn-get-started:hover {

  background: #06bff9;



  border: 2px solid #06bff9;

}



#hero .col-lg-10 {

  padding-right: 0px;



  padding-left: 0px;

}



#hero .php-email-form {

  /* box-shadow: 0 0 30px rgba(214, 215, 216, 0.6); */



  padding: 20px;



  background: #fff;



  border-radius: 7px;



  margin-right: 14px;

}



#hero .php-email-form .validate {

  display: none;



  color: red;



  margin: 0 0 15px 0;



  font-weight: 400;



  font-size: 13px;

}



#hero .php-email-form .error-message {

  display: none;



  color: #fff;



  background: #06bff9;



  text-align: left;



  padding: 15px;



  font-weight: 600;

}



#hero .php-email-form .error-message br + br {

  margin-top: 25px;

}



#hero .php-email-form .sent-message {

  display: none;



  color: #fff;



  background: #18d26e;



  text-align: center;



  padding: 15px;



  font-weight: 600;

}



#hero .php-email-form .loading {

  display: none;



  background: #fff;



  text-align: center;



  padding: 15px;

}



#hero .php-email-form .loading:before {

  content: "";



  display: inline-block;



  border-radius: 50%;



  width: 24px;



  height: 24px;



  margin: 0 10px -6px 0;



  border: 3px solid #18d26e;



  border-top-color: #eee;



  -webkit-animation: animate-loading 1s linear infinite;



  animation: animate-loading 1s linear infinite;

}



#hero .php-email-form input,

#hero .php-email-form textarea {

  border-radius: 0;



  box-shadow: none;



  font-size: 14px;



  border-radius: 4px;

}



#hero .php-email-form input:focus,

#hero .php-email-form textarea:focus {

  border-color: #06bff9;

}



#hero .php-email-form input {

  padding: 20px 15px;

}



#hero .php-email-form textarea {

  padding: 12px 15px;

}



#hero .php-email-form button[type="submit"] {

  background: #06bff9;



  border: 0;



  padding: 5px 10px;



  font-size: 14px;



  border-radius: 4px;



  color: #fff;



  transition: 0.4s;

}



#hero .php-email-form button[type="submit"]:hover {

  background: #06bff9;

}



#about .about-img::after,

#about .about-img::before {

  width: 90%;



  height: 92%;



  background-color: #ebf1fa;



  transition: 0.5s;



  content: "";

}



@media (min-width: 1024px) {

  #hero {

    background-attachment: fixed;

  }

}



@media (min-width: 1400px) and (max-width: 1550px) {

  #hero .hero-container {

    max-width: 75% !important;

  }

}



@media (min-width: 1551px) and (max-width: 1650px) {

  #hero .hero-container {

    max-width: 70% !important;

  }

}



@media (min-width: 1651px) and (max-width: 1780px) {

  #hero .hero-container {

    max-width: 65% !important;

  }

}



@media (min-width: 1781px) {

  #hero .hero-container {

    max-width: 61% !important;

  }

}



@media (max-width: 500px) {

  #hero .hero-container {

    justify-content: center;



    flex-direction: column;



    padding: 0px 15px;

  }



  #hero .php-email-form {

    margin-right: 0px;

  }

}



@media (max-height: 500px) {

  #hero {

    height: 150vh;

  }

}



.features .row + .row {

  margin-top: 100px;

}



.features h3 {

  font-weight: 400;



  font-size: 24px;

}



.section-title h2,

.section-title1 h2 {

  margin: 0;



  font-weight: 700;



  text-transform: uppercase;



  font-family: Poppins, sans-serif;

}



#about .about-content ul,

.features ul {

  list-style: none;



  padding: 0;

}



.features ul li {

  padding-bottom: 10px;

}



.features ul i {

  font-size: 20px;



  padding-right: 4px;



  color: #68a4c4;

}



.features p:last-child {

  margin-bottom: 0;

}



section {

  padding: 60px 0;

}



#clients {

  /* background-color: #f6f9fd; */

  padding-top: 50px;

  padding-bottom: 30px;

}



.section-bg {

  background-color: #f6f9fd;

}



.section-title,

.section-title1 {

  padding-bottom: 40px;

}



#footer,

.why-us {

  padding: 0 0 30px;

}



.section-title h2 {

  font-size: 32px;



  color: #000;

}



.section-title1 h2 {

  font-size: 32px;



  color: #fff;

}



.section-title h3,

.section-title1 h3 {

  font-size: 15px;



  margin: 15px 0 5px;



  padding: 0;

}



.section-title h2::after {

  content: "";



  width: 120px;



  height: 1px;



  display: inline-block;



  background: #06bff9;



  margin: 10px;

}



.section-title h3 {

  font-weight: 500;



  line-height: 1px;



  color: #000;



  font-family: Poppins, sans-serif;

}



.section-title1 h3 {

  font-weight: 500;



  color: #fff;



  font-family: Poppins, sans-serif;

}



#about .about-content h2,

.section-title p {

  font-weight: 700;



  color: #000;



  font-family: Poppins, sans-serif;



  text-transform: uppercase;

}

#about1 .container p {

  font-size: 15.5px;

}



.section-title p {

  margin: 0;

  font-size: 36px;

}



.why-us {

  z-index: 3;

}



.why-us .what-we-do-style {

  display: flex;



  flex-direction: column;



  align-items: center;

}



.why-us .content {

  padding: 25px 30px;



  background: #06bff9;



  border-radius: 0 30px 30px;



  color: #fff;

}



.why-us .content h3 {

  font-weight: 700;



  font-size: 30px;



  text-align: center;



  margin-bottom: 25px;

}



.why-us .content p {

  font-size: 17px;



  text-align: center;



  margin-bottom: 28px;

}



.why-us .content .more-btn {

  display: inline-block;



  background: rgba(255, 255, 255, 0.2);



  padding: 6px 30px 8px;



  color: #fff;



  border-radius: 50px;



  transition: 0.4s ease-in-out;

}



.why-us .content .more-btn i,

.why-us .icon-boxes .icon-box .more-btn i {

  font-size: 14px;

}



.why-us .content .more-btn:hover {

  color: #06bff9;



  background: #fff;

}



.why-us .icon-boxes .icon-box {

  text-align: center;



  border-radius: 0 30px 30px;



  position: relative;



  overflow: hidden;



  background: #fff;



  box-shadow: 0 2px 15px rgba(0, 0, 0, 0.2);



  transition: 0.3s ease-in-out;



  z-index: 1;



  width: 100%;



  max-height: 210px;

}



.why-us .icon-boxes:hover .icon-box:hover {

  transform: translate(-10px, -10px);

}



.why-us .icon-box::before {

  content: "";



  position: absolute;



  background: #fdeff2;



  right: 0;



  left: 0;



  bottom: 0;



  top: 100%;



  z-index: -1;

}



.services .icon-box:hover::before,

.why-us .icon-box:hover::before {

  background: #06bff9;



  top: 0;



  border-radius: 0;

}



.why-us .icon-box .icon-style {

  display: flex;



  justify-content: center;



  align-self: center;



  margin-bottom: 27px;



  padding: 15px;



  align-items: center;



  border-radius: 0 50px 50px;



  background-color: #eff2f7;

}



#about1 .about-col:hover .icon,

.why-us .icon-box:hover .icon-style {

  background-color: #fff;

}



.why-us .icon-boxes .icon-box i {

  font-size: 40px;



  color: #06bff9;

}



.why-us .icon-boxes .icon-box h4 {

  font-size: 15px;



  font-weight: 700;



  margin: 0 0 20px;

}



.why-us .icon-boxes .icon-box p {

  font-size: 15px;



  color: #716f6f;

}



.why-us .icon-boxes .icon-box .more-btn {

  display: inline-block;



  background: #06bff9;



  padding: 6px 10px 8px;



  color: #fff;



  border-radius: 50px;



  transition: 0.4s ease-in-out;

}



.why-us .icon-boxes .icon-box .more-btn:hover {

  color: #06bff9;



  background: rgba(255, 255, 255, 0.2);

}



.why-us .icon-box a {

  display: flex;



  flex-direction: column;



  width: 100%;



  height: 100%;



  padding: 30px;

}



.why-us .icon-box h4 {

  color: #444;

}



.careers {

  background: linear-gradient(rgba(2, 2, 2, 0.4), rgba(0, 0, 0, 0.4)) 0 0 /

      cover,

    url("../img/wallpaper/career-bg.webp") center center/cover fixed;



  padding: 60px 0;

}



.careers h3 {

  color: #fff;



  font-size: 28px;



  font-weight: 700;

}



.careers p {

  color: #fff;



  font-size: 17px;



  line-height: 1.8rem;



  font-family: "Open Sans", sans-serif;

}



.careers .cta-btn {

  font-weight: 600;



  font-size: 16px;



  letter-spacing: 1px;



  display: inline-block;



  padding: 8px 28px;



  border-radius: 4px;



  transition: 0.5s;



  margin-top: 10px;



  border: 2px solid #fff;



  color: #fff;

}



.careers .cta-btn:hover {

  background: #06bff9;



  border-color: #06bff9;



  color: #151515;

}



#readButton {

  font-weight: 500;



  font-size: 14px;



  letter-spacing: 1px;



  display: inline-block;



  padding: 14px 32px;



  border-radius: 4px;



  transition: 0.5s;



  line-height: 1;



  color: #fff;



  -webkit-animation-delay: 0.8s;



  animation-delay: 0.8s;



  background: #06bff9;



  margin-top: 15px;

}



#readButton:hover {

  background: #add8e6;

}



#about {

  padding: 40px 0;

}



#about .about-content {

  padding-top: 35px;

}



#about .about-content h2 {

  margin-bottom: 15px;



  font-size: 32px;

}



#about .about-content h3 {

  color: #696592;

  font-weight: 400;

  font-size: 22px;

  font-style: italic;

}



#about .about-content p,

#about .about-content ul li {

  color: #554945;

  letter-spacing: 0.2px;

  /* font-family: Muli, sans-serif; */

}



#about .about-content p {

  font-size: 15.5px;

  /* font-weight: 300; */

  line-height: 25px;

}



#about .about-content ul li {

  padding-bottom: 10px;

  font-weight: 300;

  line-height: 23px;

  font-size: 14px;

}



/* #detail .about-content ul li {



    font-size: 15px;



} */



#about .about-content ul li i {

  font-size: 15px;



  padding-right: 4px;



  color: #06bff9;

}



#about .about-img {

  margin: 30px;

}



#about .about-img img {

  width: 100%;



  border: 8px solid #fff;



  transition: 0.5s;

}



#about .about-img img:hover {

  width: 100%;



  transform: scale(1.03);

}



#about .about-img::before {

  position: absolute;



  left: -31px;



  top: -30px;



  z-index: -1;

}



#about .about-img::after {

  position: absolute;



  right: -31px;



  bottom: -30px;



  z-index: -1;

}



#about .about-lottie {

  display: flex;



  height: 100%;



  align-items: center;

}



@media (max-width: 991px) {

  #about .about-lottie {

    align-items: flex-start;

  }

}



#about1 {

  background: url("../img/about-bg.webp") center top/cover no-repeat fixed;



  padding: 60px 0 40px;

}



#about1::before {

  content: "";



  position: absolute;



  left: 0;



  right: 0;



  top: 0;



  bottom: 0;



  background: rgba(255, 255, 255, 0.92);



  z-index: 9;

}



#about1 .container {

  position: relative;



  z-index: 10;

}



#about1 .about-col {

  background: #fff;



  border-radius: 0 0 4px 4px;



  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);



  margin-bottom: 20px;

}



#about1 .about-col .img {

  position: relative;

}



#about1 .about-col .img img {

  border-radius: 4px 4px 0 0;

}



#about1 .about-col .icon {

  width: 64px;



  height: 64px;



  padding-top: 8px;



  position: absolute;



  background-color: #06bff9;



  border-radius: 50%;



  text-align: center;



  border: 4px solid #fff;



  left: calc(50% - 32px);



  bottom: -30px;



  transition: 0.3s;

}



#about1 .about-col i {

  font-size: 36px;



  line-height: 1;



  color: #fff;



  transition: 0.3s;

}



#about1 .about-col h2 {

  color: #000;



  text-align: center;



  font-weight: 700;



  font-size: 18px;



  padding: 0;



  margin: 40px 0 12px;

}



#about1 .about-col h2 a {

  color: #000;

}



#about1 .about-col p {

  font-size: 15px;



  line-height: 20px;



  text-align: center;



  font-weight: 400;



  margin-bottom: 0;



  padding: 0 20px 20px;



  font-family: "Open Sans", sans-serif;

}



.clients .owl-item,

.skills .owl-item {

  display: flex;



  justify-content: center;



  align-items: center;



  padding: 0 20px;

}



.clients .owl-item img,

.skills .owl-item img {

  width: 70%;



  transition: 0.3s;

}



.clients .owl-item img:hover,

.skills .owl-item img:hover {

  -webkit-filter: none;



  filter: none;



  opacity: 1;

}



.clients .owl-dots,

.clients .owl-nav,

.portfolio-details .portfolio-details-carousel .owl-dots,

.portfolio-details .portfolio-details-carousel .owl-nav,

.skills .owl-dots,

.skills .owl-nav {

  margin-top: 5px;



  text-align: center;

}



.clients .owl-dot,

.portfolio-details .portfolio-details-carousel .owl-dot {

  display: inline-block;



  margin: 0 5px;



  width: 12px;



  height: 12px;



  border-radius: 50%;



  background-color: #ddd !important;

}



.clients .owl-dot.active {

  background-color: #e96b56 !important;

}



.skills .owl-stage-outer .owl-stage {

  display: flex;



  justify-content: center;



  align-items: center;

}



.skills {

  background-color: #f6f9fd;



  padding: 15px 0 2px;

}



.skills .progress {

  height: 45px;



  display: block;



  background: 0 0;

}



.skills .progress .skill {

  padding: 10px 0;



  margin: 0 0 6px;



  text-transform: uppercase;



  display: block;



  font-weight: 600;



  font-family: Poppins, sans-serif;



  color: #fff;

}



.skills .progress .skill .val {

  float: right;



  font-style: normal;

}



.skills .progress-bar-wrap {

  background: #e3e6e9;

}



.skills .progress-bar {

  width: 1px;



  height: 15px;



  transition: 0.9s;



  background-color: #06bff9;

}



.servicesAgain .icon-box {

  text-align: center;



  border: 1px solid #ebebeb;



  padding: 80px 20px;



  transition: 0.3s ease-in-out;



  background: #fff;

}



.pricing .box,

.services .icon-box {

  overflow: hidden;



  border-radius: 8px;



  text-align: center;



  position: relative;

}



.servicesAgain .icon-box .icon {

  margin: 0 auto 20px;



  width: 64px;



  height: 64px;



  background: #ffc451;



  border-radius: 4px;



  display: flex;



  align-items: center;



  justify-content: center;



  transition: 0.3s;

}



.servicesAgain .icon-box .icon i {

  color: #151515;



  font-size: 28px;



  transition: 0.3s ease-in-out;

}



.servicesAgain .icon-box h4 {

  font-weight: 700;



  margin-bottom: 15px;



  font-size: 20px;

}



.servicesAgain .icon-box h4 a {

  color: #151515;



  transition: 0.3s ease-in-out;

}



.servicesAgain .icon-box h4 a:hover {

  color: #ffc451;

}



.servicesAgain .icon-box p {

  line-height: 24px;



  font-size: 14px;



  margin-bottom: 0;

}



.servicesAgain .icon-box:hover {

  border-color: #fff;



  box-shadow: 0 0 25px 0 rgba(0, 0, 0, 0.1);



  transform: translateY(-10px);

}



.pricing .box {

  padding: 20px;



  background: #f9f9f9;

}



.pricing .box h3 {

  padding: 15px;



  font-size: 18px;



  text-transform: uppercase;



  font-weight: 600;



  color: #191919;

}



.pricing .box h4 {

  font-size: 42px;



  color: #cc1616;



  font-weight: 500;



  font-family: "Open Sans", sans-serif;



  margin-bottom: 20px;

}



.services .icon,

.services .title {

  margin-bottom: 15px;

}



.pricing .box h4 sup {

  font-size: 20px;



  top: -15px;



  left: -3px;

}



.pricing .box h4 span {

  color: #bababa;



  font-size: 15px;



  font-weight: 300;

}



.pricing .box ul {

  padding: 0;



  list-style: none;



  color: #191919;



  text-align: center;



  line-height: 20px;



  font-size: 14px;

}



.pricing .box ul li {

  padding-bottom: 16px;

}



.pricing .box ul i {

  color: #cc1616;



  font-size: 18px;



  padding-right: 4px;

}



.pricing .box ul .na {

  color: #ccc;



  text-decoration: line-through;

}



.pricing .box .btn-wrap,

.pricing .featured .btn-wrap {

  padding: 15px;



  text-align: center;

}



.pricing .box .btn-buy {

  background: #cc1616;



  display: inline-block;



  padding: 10px 40px;



  color: #fff;



  transition: 0.3s;



  font-size: 14px;



  font-family: Raleway, sans-serif;



  font-weight: 600;

}



.pricing .box .btn-buy:hover {

  background: #e82d2d;

}



.pricing .featured {

  background: #cc1616;



  box-shadow: none;



  color: #fff;

}



.pricing .featured h4 span {

  color: rgba(255, 255, 255, 0.58);

}



.pricing .featured .btn-buy {

  background: rgba(255, 255, 255, 0.2);

}



.pricing .featured .btn-buy:hover {

  background: #fff;



  color: #cc1616;

}



.servicesInfo .icon-box {

  text-align: center;



  padding: 60px 20px;



  transition: 0.3s ease-in-out;



  box-shadow: 0 2px 15px rgba(0, 0, 0, 0.1);

}



.servicesInfo .icon-box .icon {

  margin: 0 auto 20px;

  width: 54px;

  height: 54px;

  background: #06bff9;

  transition: 0.3s ease-out;

  display: flex;

  align-items: center;

  justify-content: center;

  transform-style: preserve-3d;

}



.servicesInfo .icon-box .icon i {

  color: #fff;



  font-size: 28px;

}



.servicesInfo .icon-box .icon::before {

  position: absolute;

  content: "";

  left: -8px;

  top: -8px;

  height: 100%;

  width: 100%;

  background: #fce5e5;

  transition: 0.3s ease-out;

  transform: translateZ(-1px);

}



.servicesInfo .icon-box h4 {

  font-weight: 700;

  margin-bottom: 15px;

  font-size: 22px;

}



.servicesInfo .icon-box h4 a {

  color: #191919;

}



.servicesInfo .icon-box p {

  line-height: 20px;

  font-size: 14px;

  margin-bottom: 0;

}



.servicesInfo .icon-box p a {

  font-weight: 700;

}



.servicesInfo .icon-box:hover {

  background: #06bff9;

  border-color: #06bff9;

  padding: 70px 20px 90px;

}



.servicesInfo .icon-box:hover .icon {

  background: #fff;

}



#footer .footer-newsletter form input[type="submit"]:hover,

.contact .php-email-form button[type="submit"]:hover,

.servicesInfo .icon-box:hover .icon::before {

  background: #06bff9;

}



.services {

  padding-bottom: 30px;

}



.services .icon-box {

  padding: 60px 30px;

  background: #fff;

  box-shadow: 2px 0 35px 0 rgba(68, 88, 144, 0.12);

  transition: 0.3s ease-in-out;

  z-index: 1;

}



.services .icon-box::before {

  content: "";

  position: absolute;

  background: #fdeff2;

  right: 0;

  left: 0;

  bottom: 0;

  top: 100%;

  transition: 0.4s;

  z-index: -1;

}



.services .icon i {

  font-size: 48px;

  line-height: 1;

  color: #06bff9;

  transition: 0.3s ease-in-out;

}



.services .title {

  font-weight: 700;

  font-size: 15px;

}



.services .title a {

  color: #111;

}



.services .description {

  font-size: 15px;

  line-height: 28px;

  margin-bottom: 0;

}



.contact .info-box,

.contact .php-email-form {

  box-shadow: 0 0 30px rgba(214, 215, 216, 0.6);



  background: #fff;

}



.contact .map {

  margin-bottom: 20px;

}



.contact .info-box {

  color: #0b2341;

  text-align: center;

  padding: 20px 0 30px;

}



.contact .info-box i {

  font-size: 32px;

  color: #06bff9;

  border-radius: 50%;

  padding: 8px;

  border: 2px dotted #fbdad2;

}



.contact .info-box h3 {

  font-size: 15px;

  color: #777;

  font-weight: 700;

  margin: 10px 0;

}



.contact .info-box p {

  padding: 0;

  font-size: 13px;

  margin-bottom: 0;

}



.contact .php-email-form {

  padding: 30px;

}



.contact .php-email-form .validate {

  display: none;

  color: red;

  margin: 0 0 15px;

  font-weight: 400;

  font-size: 13px;

}



.contact .php-email-form .error-message {

  display: none;

  color: #fff;

  background: #06bff9;

  text-align: left;

  padding: 15px;

  font-weight: 600;

}



.contact .php-email-form .error-message br + br {

  margin-top: 25px;

}



.contact .php-email-form .sent-message {

  display: none;

  color: #fff;

  background: #18d26e;

  text-align: center;

  padding: 15px;

  font-weight: 600;

}



.contact .php-email-form .loading {

  display: none;

  background: #fff;

  text-align: center;

  padding: 15px;

}



.contact .php-email-form .loading:before {

  content: "";

  display: inline-block;

  border-radius: 50%;

  width: 24px;

  height: 24px;

  margin: 0 10px -6px 0;

  border: 3px solid #18d26e;

  border-top-color: #eee;

  -webkit-animation: 1s linear infinite animate-loading;

  animation: 1s linear infinite animate-loading;

}



.contact .php-email-form input,

.contact .php-email-form textarea {

  border-radius: 4px;

  box-shadow: none;

  font-size: 14px;

}



.contact .php-email-form input:focus,

.contact .php-email-form textarea:focus {

  border-color: #06bff9;

}



.contact .php-email-form input {

  padding: 20px 15px;

}



.contact .php-email-form textarea {

  padding: 12px 15px;

}



.contact .php-email-form button[type="submit"] {

  background: #06bff9;

  border: 0;

  padding: 10px 30px;

  font-size: 15px;

  border-radius: 4px;

  color: #fff;

  transition: 0.4s;

}



@-webkit-keyframes animate-loading {

  0% {

    transform: rotate(0);

  }



  100% {

    transform: rotate(360deg);

  }

}



@keyframes animate-loading {

  0% {

    transform: rotate(0);

  }



  100% {

    transform: rotate(360deg);

  }

}



.breadcrumbs {

  padding: 15px 0;

  background: #f8f8f8;

  min-height: 40px;

  margin-top: 86px;

}



.breadcrumbs h2 {

  font-size: 28px;

  font-weight: 400;

  margin: 0;

}



.breadcrumbs ol {

  display: flex;

  flex-wrap: wrap;

  list-style: none;

  padding: 0;

  margin: 0;

  font-size: 14px;

}



.breadcrumbs ol li + li {

  padding-left: 10px;

}



.breadcrumbs ol li + li::before {

  display: inline-block;

  padding-right: 10px;

  color: #3c3c3c;

  content: "/";

}



@media (max-width: 768px) {

  #hero h3 {

    font-size: 22px;

  }



  #hero h1 {

    font-size: 28px;

    line-height: 36px;

  }



  #hero h2 {

    font-size: 18px;

    line-height: 24px;

    margin-bottom: 30px;

  }



  .breadcrumbs .d-flex {

    display: block !important;

  }



  .breadcrumbs ol {

    display: block;

  }



  .breadcrumbs ol li {

    display: inline-block;

  }

}



.detail .icon-boxes h4 {

  font-size: 18px;

  color: #7f6d68;

  margin-bottom: 15px;

}



.detail .icon-boxes h3 {

  font-size: 28px;

  font-weight: 700;

  color: #554945;

  margin-bottom: 15px;

}



.detail .icon-boxes h1 {

  font-size: 28px;

  font-weight: 700;

  color: #554945;

  margin-bottom: 15px;

}



.detail .icon-boxes h2 {

  font-size: 28px;

  font-weight: 700;

  color: #554945;

  margin-bottom: 15px;

}



.detail .icon-boxes p {

  font-size: 15px;

  font-weight: 400;

  color: #554945;

  margin-bottom: 15px;

}



.detail .icon-box {

  margin-top: 40px;

}



.detail .icon-box .icon {

  float: left;

  display: flex;

  align-items: center;

  justify-content: center;

  width: 64px;

  height: 64px;

  border: 2px solid #ffcbba;

  border-radius: 50px;

  transition: 0.5s;

  background: #fff;

}



.detail .icon-box .icon i {

  color: #ff5821;

  font-size: 32px;

}



.detail .icon-box:hover .icon {

  background: #ff5821;

  border-color: #ff5821;

}



.detail .icon-box .title {

  margin-left: 85px;

  font-weight: 700;

  margin-bottom: 10px;

  font-size: 18px;

}



.detail .icon-box .title a {

  color: #343a40;

  transition: 0.3s;

}



.detail .icon-box .title a:hover {

  color: #ff5821;

}



.detail .icon-box .description {

  margin-left: 85px;

  line-height: 24px;

  font-size: 14px;

}



.detail .video-box {

  background-size: cover;

  min-height: 300px;

}



@-webkit-keyframes pulsate-btn {

  0% {

    transform: scale(0.6, 0.6);

    opacity: 1;

  }



  100% {

    transform: scale(1, 1);

    opacity: 0;

  }

}



@keyframes pulsate-btn {

  0% {

    transform: scale(0.6, 0.6);

    opacity: 1;

  }



  100% {

    transform: scale(1, 1);

    opacity: 0;

  }

}



.portfolio-details {

  padding-top: 20px;

}



.portfolio-details .portfolio-title {

  font-size: 26px;

  font-weight: 700;

  margin-bottom: 20px;

}



.portfolio-details .portfolio-details-carousel .owl-dot.active {

  background-color: #3498db !important;

}



.portfolio-details .portfolio-info {

  padding-top: 45px;

}



.portfolio-details .portfolio-info h3 {

  font-size: 22px;

  font-weight: 400;

  margin-bottom: 20px;

}



.portfolio-details .portfolio-info ul {

  list-style: none;

  padding: 0;

  font-size: 14px;

  line-height: 1;

}



.portfolio-details .portfolio-info ul li + li {

  margin-top: 10px;

}



#portfolio-details .portfolio-info ul li i {

  font-size: 15px;

  padding-right: 4px;

  color: #1bb1dc;

}



.portfolio-details .portfolio-info p {

  font-size: 15px;

  padding: 15px 0 0;

}



@media (max-width: 992px) {

  #header .logo {

    font-size: 28px;

  }



  .breadcrumbs {

    margin-top: 72px;

  }



  .breadcrumbs ol {

    margin-top: 10px;

  }



  .portfolio-details .portfolio-info {

    padding-top: 20px;

  }

}



#footer {

  background: #0b212d;

  color: #fff;

  font-size: 14px;

}



#footer .footer-newsletter {

  padding: 50px 0;

  background: #0d2735;

}



#footer .footer-newsletter h4 {

  font-size: 24px;

  margin: 0 0 20px;

  padding: 0;

  line-height: 1;

  font-weight: 600;

  color: #06bff9;

}



#footer .footer-newsletter form {

  margin-top: 30px;

  background: #fff;

  padding: 6px 10px;

  position: relative;

  border-radius: 50px;

}



#footer .footer-newsletter form input[type="email"] {

  border: 0;

  padding: 4px;

  width: calc(100% - 100px);

}



#footer .footer-newsletter form input[type="submit"] {

  position: absolute;

  top: 0;

  right: 0;

  bottom: 0;

  border: 0;

  background: #06bff9;

  font-size: 15px;

  padding: 0 20px;

  margin: 3px;

  color: #fff;

  transition: 0.3s;

  border-radius: 50px;

}



#footer .footer-top {

  background: #0d2735;

  border-top: 1px solid #06bff9;

  border-bottom: 1px solid #06bff9;

  padding: 60px 0 30px;

}



#footer .footer-top .footer-info h3 {

  font-size: 18px;

  margin: 0 0 20px;

  padding: 2px 0;

  line-height: 1;

  color: #06bff9;

  font-weight: 600;

}



#footer .footer-top .footer-info p {

  font-size: 15px;

  line-height: 24px;

  margin-bottom: 0;

  font-family: Roboto, sans-serif;

  color: #fff;

}



#footer .footer-top .social-links a {

  font-size: 18px;

  display: inline-block;

  background: #06bff9;

  color: #fff;

  line-height: 1;

  padding: 8px 0;

  margin-right: 4px;

  border-radius: 50%;

  text-align: center;

  width: 36px;

  height: 36px;

  transition: 0.3s;

}



#footer .footer-top .social-links a:hover {

  background: #06bff9;

  color: #fff;

  text-decoration: none;

}



#footer .social-links a {

  font-size: 18px;

  display: inline-block;

  background: #06bff9;

  color: #fff;

  line-height: 1;

  padding: 8px 0;

  margin-right: 4px;

  border-radius: 50%;

  text-align: center;

  width: 36px;

  height: 36px;

  transition: 0.3s;

}



#footer .social-links a:hover {

  background: #06bff9;

  color: #fff;

  text-decoration: none;

}



#footer .whatsapp-float {

  position: fixed;

  display: none;

  left: 15px;

  bottom: 15px;

  z-index: 99999;

}



#footer .whatsapp-float i {

  display: flex;

  align-items: center;

  justify-content: center;

  font-size: 40px;

  width: 48px;

  height: 48px;

  border-radius: 50%;

  transition: 0.4s;

  background: #25d366;

  color: #fff;

}



@media (min-width: 200px) and (max-width: 450px) {

  #footer .whatsapp-float i {

    width: 40px;

    height: 40px;

    font-size: 28px;

  }

}



#footer .footer-top h4 {

  font-size: 18px;

  font-weight: 600;

  color: #06bff9;

  position: relative;

  padding-bottom: 12px;

}



#footer .footer-top .footer-links ul {

  list-style: none;

  padding: 0;

  margin: 0;

}



#footer .footer-top .footer-links ul i {

  padding-right: 2px;

  color: #06bff9;

  font-size: 18px;

  line-height: 1;

}



#footer .footer-top .footer-links ul li {

  padding: 10px 0;

  display: flex;

  align-items: center;

}



#footer .footer-top .footer-links ul li:first-child {

  padding-top: 0;

}



#footer .footer-top .footer-links ul a {

  color: #fff;

  transition: 0.3s;

  display: inline-block;

  line-height: 1;

}



#footer .footer-top .footer-contact p {

  line-height: 26px;

}



#footer .copyright {

  text-align: center;

  padding-top: 30px;

}



#footer .credits {

  padding-top: 10px;

  text-align: center;

  font-size: 13px;

  color: #fff;

}



.h1-style {

  color: #06bff9;

  margin: 0 0 10px;

  font-size: 46px;

  font-family: JosefinSans, sans-serif;

  text-transform: uppercase;

}



.contact .info-box a {

  color: rgb(11, 35, 65);

}



.footer-contact a {

  color: #fff;

}



dt {

  display: list-item;



  list-style-type: disc;

}



.list li {

  margin-top: 2%;

}



.list li:first-child {

  margin-top: 0%;

}



.accordion {

  --bs-accordion--btn-bg: #fff;

  --bs-accordion-active-bg: #fff;

  --bs-accordion-btn-focus-box-shadow: none;

  --bs-accordion-border-width: 0px;

  --bs-accordion-border-radius: 0px;

}



.accordion-button:not(.collapsed) {

  box-shadow: none;

}



.detail .icon-boxes .accordion h2 {

  font-size: 28px;

  font-weight: 700;

  color: #554945;

  margin-bottom: 0px;

}



.blog .info-box {

  box-shadow: 0 0 30px rgba(214, 215, 216, 0.6);
  border-radius: 10px;
  background: #fff;

}

.blog .info-box .img-fluid {

  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
}


.blog .info-box{

  color: #0b2341;
}


.blog .info-box-inner { 

  color: #0b2341;

  /* text-align: center; */

  padding: 24px 20px 30px;

}



.blog .info-box i {

  font-size: 32px;

  color: #06bff9;

  border-radius: 50%;

  padding: 8px;

  border: 2px dotted #fbdad2;

}

.blog .info-box h1,

.blog .info-box h2,

.blog .info-box h3 {

  font-family: JosefinSans, sans-serif;

  margin-bottom: 10px;

}



.blog .info-box h1 {

  font-weight: 600;

  font-size: 23px;

  text-align: center;

}



.blog .info-box h2 {

  font-weight: 500;

  font-size: 20px;

}



.blog .info-box h3 {

  font-weight: 500;

  font-size: 20px;

}



.blog .info-box p {

  padding: 0;

  font-size: 14px;

  margin-bottom: 0;

}



#more {

  display: none;

}



#readMoreBtn .btn-outline-primary:hover,

.btn-outline-primary:focus,

.btn-outline-primary:active {

  box-shadow: none;

}