@font-face {
   font-family: Proxima Nova;
   src: url('../font/Proxima\ Nova\ Regular.otf')
 }

 /*--------------------------------------------------------------
# General
--------------------------------------------------------------*/

 html {
   height: 100%;
 }
body{
  font-family: Proxima Nova !important;
   src: url('../font/Proxima\ Nova\ Regular.otf')
}
a {
  font-family: Proxima Nova;
   src: url('../font/Proxima\ Nova\ Regular.otf');
   color: #2088DA;
 }
p{
  font-family: Proxima Nova !important;
  src: url('assets/')
}
 @media screen and (min-width: 320px) {

   .animate__animated {
     margin-top: 45%;
     font-size: 20px !important;
   }

   .statistics-circle {
     margin-left: 60px !important;
   }

   .center-cricle-statistics-header {
     margin-left: 45px !important;
   }
 }

 @media screen and (min-width: 375px) {

   .animate__animated {
     margin-top: 50%;
     font-size: 25px !important;
   }

   .statistics-circle {
     margin-left: 80px !important;
   }

   .center-cricle-statistics-header {
     margin-left: 65px !important;
   }
 }

 @media screen and (min-width: 425px) {
   .animate__animated {
     margin-top: 50%;
     font-size: 25px !important;
   }

   .statistics-circle {
     margin-left: 100px !important;
   }

   .center-cricle-statistics-header {
     margin-left: 95px !important;
   }
 }

 @media screen and (min-width: 768px) {
   .animate__animated {
     margin-top: 50%;
     font-size: 50px !important;
   }

   .statistics-circle {
     margin-left: 70px !important;
   }

   .center-cricle-statistics-header {
     margin-left: 50px !important;
   }
 }

 @media screen and (min-width: 1024px) {
   .animate__animated {
     margin-top: 50%;
     font-size: 80px !important;
   }

   .statistics-circle {
     margin-left: 20px !important;
   }

   .center-cricle-statistics-header {
     margin-left: 10px !important;
   }
 }

 @media screen and (min-width: 2560px) {
   .animate__animated {
     margin-top: 50%;
     font-size: 110px !important;
   }
 }

 body {
   font-family: "Proxima Nova";
   color: #444444;
   content-visibility: auto;
 }

 .main-slider-title {
   color: #ffffff;
   text-shadow: 3px 3px 2px #2088DA;

 }

 .statistics-circle {
   background: #2088DA;
   border-radius: 50%;
   width: 160px;
   height: 160px;
   overflow: hidden;
 }

 :target:before {
   content: "";
   display: inline-block;
   height: 250px;
   margin: -180px 0 0;
 }

 .center-cricle-statistics {
   display: flex;
   align-items: center;
   justify-content: center;
   height: 100%;
   color: white;
   font-weight: bold;
   font-size: 22px;

 }

 .center-cricle-statistics-header {
   text-align: left;
   font-weight: bold;
   color: black;
   font-size: 25px;
 }

 a:hover {
   text-decoration: none;
 }

 h1,
 h2,
 h3,
 h4,
 h5,
 h6 {
   font-family: "Proxima Nova";
 }

 ul,
 ol {
   margin: 0px;
   padding: 0px;
   list-style-type: none;
   font-size: 24px;
 }

 /*--------------------------------------------------------------
# Back to top button
--------------------------------------------------------------*/
 .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: all 0.4s;
 }

 .back-to-top i:hover {
   background: #2088DA;
 }

 /*--------------------------------------------------------------
# Preloader
--------------------------------------------------------------*/
 #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 #f2f2f2;
   border-top: 6px solid #2088DA;
   border-radius: 50%;
   width: 60px;
   height: 60px;
   -webkit-animation: animate-preloader 0.5s linear infinite;
   animation: animate-preloader 1s linear infinite;
 }

 @-webkit-keyframes animate-preloader {
   0% {
     transform: rotate(0deg);
   }

   100% {
     transform: rotate(360deg);
   }
 }

 @keyframes animate-preloader {
   0% {
     transform: rotate(0deg);
   }

   100% {
     transform: rotate(360deg);
   }
 }

 /*--------------------------------------------------------------
# Disable AOS delay on mobile
--------------------------------------------------------------*/
 @media screen and (max-width: 768px) {
   [data-aos-delay] {
     transition-delay: 0 !important;
   }
 }

 /*--------------------------------------------------------------
# Menubar
--------------------------------------------------------------*/
 .header-area {
   position: relative;
   z-index: 1000;
   width: 100%;
 }

 .header-area .vizew-main-menu {
   position: relative;
   width: 100%;
 }

 .header-area .vizew-main-menu .classy-nav-container {
   background-color: #fff;
   box-shadow: 0px 0px 30px rgba(127, 137, 161, 0.25);
 }

 .header-area .vizew-main-menu .classy-navbar {
   padding-top: 10px;
   height: 80px;
 }

 .header-area .vizew-main-menu .classy-navbar .nav-brand {
   max-width: 300px;
 }

 .header-area .vizew-main-menu .classy-navbar .classynav ul li a {
   font-weight: 700;
   text-transform: uppercase;
   font-size: 16px;
   height: 90px;
   line-height: 100px;
 }

 @media only screen and (min-width: 992px) and (max-width: 1199px) {
   .header-area .vizew-main-menu .classy-navbar .classynav ul li a {
     height: 70px;
     line-height: 70px;
     font-size: 14px;
   }
 }

 @media only screen and (min-width: 768px) and (max-width: 991px) {
   .header-area .vizew-main-menu .classy-navbar .classynav ul li a {
     height: 35px;
     line-height: 35px;
     font-size: 14px;
     background-color: #fff;
     border-bottom: none;
   }
 }

 @media only screen and (max-width: 767px) {
   .header-area .vizew-main-menu .classy-navbar .classynav ul li a {
     height: 75px;
     line-height: 85px;
     font-size: 16px;
     background-color: #fff;
     border-bottom: 1px solid #2088DA;
   }
 }

 .header-area .vizew-main-menu .classy-navbar .classynav ul li a:hover,
 .header-area .vizew-main-menu .classy-navbar .classynav ul li a:focus {
   color: #41D0FF;
   border-bottom-color: #ffffff;
 }

 .header-area .vizew-main-menu .classy-navbar .classynav .arrow::after {
   content: "\ea99";
   font-family: IcoFont;
 }

 .header-area .vizew-main-menu .classy-navbar .classynav ul li ul li a {
   text-transform: uppercase;
   text-align: center;
   padding: 0;
   font-size: 16px;
   line-height: 45px;
   height: 45px;
 }

 .header-area .vizew-main-menu .classy-navbar .classynav .heading {
   color: #41D0FF;
   font-size: 18px;
 }

 .header-area .vizew-main-menu .classy-navbar .classynav ul li a i {
   font-size: 30px;
 }

 .header-area .vizew-main-menu .classy-navbar .classynav ul li ul li a::after {
   color: #41D0FF;
 }

 .header-area .vizew-main-menu .classy-navbar .classynav ul li ul li a:hover,
 .header-area .vizew-main-menu .classy-navbar .classynav ul li ul li a:focus {
   color: #41D0FF;
 }

 .header-area .is-sticky .vizew-main-menu {
   z-index: 9999;
   box-shadow: 0 5px 50px 0 rgba(0, 0, 0, 0.2);
 }

 .breakpoint-on .classynav {
   padding-top: 70px;
   padding-bottom: 70px;
 }

 .breakpoint-on .classy-navbar .classy-menu {
   background-color: #fff;
   box-shadow: 0 0 20px 0 rgba(255, 255, 255, 0.2);
 }

 .breakpoint-on .classynav ul li .megamenu .single-mega.cn-col-3 {
   padding: 0;
   border-bottom: 1px solid #393c3d;
 }

 .breakpoint-on .classycloseIcon .cross-wrap span {
   background: #fff;
 }

 /*--------------------------------------------------------------
# Hero Section
--------------------------------------------------------------*/
 /* #intro {
  width: 100%;
  margin-top: 0;
  height: 90vh;
  background: #000;
  overflow: hidden;
  position: relative;
}

@media (max-height: 500px) {
  #intro {
    height: 150vh;
  }
}

#intro .carousel, #intro .carousel-inner, #intro .carousel-item, #intro .carousel-item::before {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
}

#intro .carousel-item {
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

#intro .carousel-item::before {
  content: '';
  background-color: rgba(0, 0, 0, 0.2);
}

intro .carousel-container {
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  bottom: 150px;
  top: 0;
  left: 50px;
  right: 50px;
}

#intro .container {
  text-align: center;
}

#intro h2 {
  margin-top: 120px;
  font-size: 40px;
  font-weight: 700;
}

@media (max-width: 768px) {
  #intro h2 {
    font-size: 28px;
  }
} */

 /* @media (min-width: 1024px) {
  #intro p {
    width: 60%;
  }
} */

 /* #intro .carousel-fade {
  overflow: hidden;
} */

 /* #intro .carousel-fade .carousel-inner .carousel-item {
  transition-property: opacity;
} */
 /* 
#intro .carousel-fade .carousel-inner .carousel-item,
#intro .carousel-fade .carousel-inner .active.carousel-item-left,
#intro .carousel-fade .carousel-inner .active.carousel-item-right {
  opacity: 0;
} */

 /* #intro .carousel-fade .carousel-inner .active,
#intro .carousel-fade .carousel-inner .carousel-item-next.carousel-item-left,
#intro .carousel-fade .carousel-inner .carousel-item-prev.carousel-item-right {
  opacity: 1;
  transition: 0.5s;
} */

 /* #intro .carousel-fade .carousel-inner .carousel-item-next,
#intro .carousel-fade .carousel-inner .carousel-item-prev,
#intro .carousel-fade .carousel-inner .active.carousel-item-left,
#intro .carousel-fade .carousel-inner .active.carousel-item-right {
  left: 0;
  transform: translate3d(0, 0, 0);
} */

 /* #intro .carousel-control-prev, #intro .carousel-control-next {
  width: 10%;
} */

 /* @media (min-width: 1024px) {
  #intro .carousel-control-prev, #intro .carousel-control-next {
    width: 5%;
  }
} */

 /* #intro .carousel-control-next-icon, #intro .carousel-control-prev-icon {
  background: none;
  font-size: 32px;
  line-height: 0;
  margin-top: -50px;
} */

 /* #intro .carousel-indicators li {
  cursor: pointer;
} */

 /*------------------------------------------------------------
# Sections General
--------------------------------------------------------------*/
 section {
   padding: 20px 0;
   overflow: hidden;
 }

 .section-heading {
   margin-bottom: 50px;
   text-align: center;
 }

 .section-heading h6 {
   font-size: 32px;
   font-weight: 800;
   color: #2088DA;
   text-transform: uppercase;
   margin-bottom: 0;
   /* margin-top: 7%; */
   /* margin-top: 60px; */
 }

 .section-heading h2 {
   font-size: 21px;
   text-transform: capitalize;
   color: #2a2a2a;
   font-weight: 500;
   position: relative;
   z-index: 2;
   line-height: 45px;
 }

 /*--------------------------------------------------------------
# About
--------------------------------------------------------------*/
 .about h4 {
   font-size: 25px;
   text-transform: capitalize;
   color: #2a2a2a;
   font-weight: 500;
   position: relative;
   z-index: 2;
   line-height: 45px;
 }

 .about h4 em {
   font-style: normal;
   color: #2088DA;
   font-weight: 700;
 }

 .about h4 span {
   color: #2088DA;
   font-weight: 700;
 }

 .about .single-do {
   padding: 10px 0;
 }

 .about .single-do.active {
   margin: 10px;
   box-shadow: 0px 10px 30px 0px rgba(133, 66, 189, 0.1);
 }

 .space{
  margin-bottom: 20px;
 }

 .main-story {
   width: 100%;
   height: auto;
   display: grid;
   place-items: center;
   padding: 50px 0;
 }

 .main-story .head-story {
   font-size: 32px;
   font-weight: 800;
   text-transform: uppercase;
   color: #0089DE;
   position: relative;
   margin-bottom: 80px;
 }

 .main-story .head-story::after {
   content: " ";
   position: absolute;
   width: 50%;
   height: 3px;
   left: 50%;
   bottom: -5px;
   transform: translateX(-50%);
   background-image: linear-gradient(to right, #0089DE, #0089DE, );
 }

 /* Container Css Start  */

 .container-story {
   width: 70%;
   height: auto;
   position: relative;
 }

 .container-story ul {
   list-style: none;
 }

 .container-story ul::after {
   content: "";
   position: absolute;
   width: 2px;
   height: 100%;
   left: 50%;
   top: 0;
   transform: translateX(-50%);
   background-image: linear-gradient(to bottom, rgba(91, 14, 216, 0.767), rgba(238, 12, 200, 0.747));
 }

 .container-story ul li {
   width: 50%;
   height: auto;
   padding: 15px 20px;
   background-color: #0089DE;
   border-radius: 8px;
   box-shadow: 1px 1px 15px rgba(0, 0, 0, 0.218);
   position: relative;
   z-index: 99;
   margin-bottom: 60px;
 }

 ul li p {
  font-family: "Proxima Nova";
   color: #fff;
   font-size: 18px;
   padding: 3px;
   line-height: 1.5rem;
   margin: 6px 0 4px 0;
   text-align: left;
 }

 .container ul li img {
   border-radius: 4px;
   margin: 6px 0 4px 0;
   text-align: left;
 }

 .container-story ul li .circle {
   position: absolute;
   width: 20px;
   height: 20px;
   border-radius: 50%;
   background-color: #fa381a8a;
   top: 0;
   display: grid;
   place-items: center;
 }

 .circle::after {
   content: '';
   width: 12px;
   height: 12px;
   background-color: #040305;
   border-radius: 50%;
 }

 ul li:nth-child(odd) .circle {
   transform: translate(50%, -50%);
   right: -15px;
 }

 ul li:nth-child(even) .circle {
   transform: translate(-50%, -50%);
   left: -45px;
 }

 ul li .date {
   position: absolute;
   width: auto;
   height: auto;
   background-color: black;
   border-radius: 15px;
   padding: 8px;
   top: -54px;
   display: grid;
   place-items: center;
   color: #fff;
   font-size: 18px;
   box-shadow: 1px 2px 12px rgba(0, 0, 0, 0.318);
 }

 .container-story ul li:nth-child(odd) {
   float: left;
   clear: right;
   transform: translateX(-30px);
 }

 ul li:nth-child(odd) .date {
   right: 20px;
 }

 .container-story ul li:nth-child(even) {
   float: right;
   clear: left;
   transform: translateX(30px);
 }

 ul li .heading {
   font-size: 20px;
   color: #fff;
 }

 @media only screen and (min-width:798px) and (max-width: 1100px) {
   .container-story {
     width: 80%;
   }
 }

 @media only screen and (max-width: 798px) {
   .container-story {
     width: 70%;
     transform: translateX(-3px);
   }

   .container-story ul::after {
     left: -12px;
   }

   .container-story ul li {
     width: 100%;
     float: none;
     clear: none;
     margin-bottom: 80px;
   }

   .container-story ul li .circle {
     left: -40px;
     transform: translate(-50%, -50%);
   }

   .container-story ul li .date {
     left: 100px;
   }

   .container-story ul li:nth-child(odd) {
     transform: translateX(0px);
     text-align: left;
   }

   .container-story ul li:nth-child(even) {
     transform: translateX(0px);
   }
 }

 @media only screen and (max-width: 550px) {
   .container-story {
     width: 95%;
   }

   .container-story ul::after {
     left: 9px;
   }

   .container-story ul li .circle {
     left: -20px;
   }
 }

 /*--------------------------------------------------------------
# features
--------------------------------------------------------------*/
 .features {
   padding: 40px 0;
   text-align: justify;
 }

 .features .box {
   padding: 20px;
   box-shadow: 0px 0px 30px rgba(73, 78, 92, 0.15);
   transition: 0.4s;
   height: 100%;
 }

 .features .box .icon {
   margin-top: 55px;
   float: left;
 }

 .features .box .icon i {
   font-size: 84px;
   transition: 0.5s;
   line-height: 0;
 }

 .features .box h4 {
   margin-left: 100px;
   font-weight: 600;
   margin-bottom: 8px;
   font-size: 24px;
   text-transform: capitalize;
 }

 .features .box h4 a {
   color: #444;
 }

 .features .box p {
   font-size: 15px;
   margin-left: 100px;
   margin-bottom: 0;
   line-height: 24px;
 }

 @media (max-width: 767px) {
   .features .box .box {
     margin-bottom: 20px;
   }

   .features .box .icon {
     float: none;
     text-align: center;
     padding-bottom: 15px;
   }

   .features .box h4,
   .features .box p {
     margin-left: 0;
     text-align: center;
   }
 }

 /*--------------------------------------------------------------
# Services
--------------------------------------------------------------*/
 .services {
   position: relative;
 }

 .services::before {
   /* background-image: url('../img/shape/what_do.png'); */
   position: absolute;
   content: "";
   top: -187px;
   z-index: 1;
   background-repeat: no-repeat;
   left: 0px;
   max-width: 243px;
   max-height: 482px;
   width: 243px;
   height: 482px;
 }

 @media only screen and (min-width: 768px) and (max-width: 991px) {
   .services::before {
     display: none;
   }
 }

 @media only screen and (min-width: 576px) and (max-width: 767px) {
   .services::before {
     display: none;
   }
 }

 @media (max-width: 767px) {
   .services::before {
     display: none;
   }
 }

 .services::after {
   /* background-image: url(../img/shape/what_do_right.png); */
   position: absolute;
   content: "";
   bottom: -187px;
   z-index: -1;
   background-repeat: no-repeat;
   right: 0px;
   max-width: 351px;
   max-height: 461px;
   width: 351px;
   height: 461px;
   bottom: 125px;
 }

 @media only screen and (min-width: 992px) and (max-width: 1199px) {
   .services::after {
     display: none;
   }
 }

 @media only screen and (min-width: 768px) and (max-width: 991px) {
   .services::after {
     display: none;
   }
 }

 @media only screen and (min-width: 576px) and (max-width: 767px) {
   .services::after {
     display: none;
   }
 }

 @media (max-width: 767px) {
   .services::after {
     display: none;
   }
 }

 .services .single-do {
   -webkit-transition: all .3s ease-out 0s;
   -moz-transition: all .3s ease-out 0s;
   -ms-transition: all .3s ease-out 0s;
   -o-transition: all .3s ease-out 0s;
   transition: all .3s ease-out 0s;
   padding: 56px 40px 69px;
   border-radius: 6px;
 }

 @media only screen and (min-width: 992px) and (max-width: 1199px) {
   .services .single-do {
     padding: 41px 17px 63px;
   }
 }

 @media only screen and (min-width: 768px) and (max-width: 991px) {
   .services .single-do {
     padding: 41px 17px 63px;
   }
 }

 @media only screen and (min-width: 576px) and (max-width: 767px) {
   .services .single-do {
     padding: 41px 17px 63px;
   }
 }

 @media (max-width: 767px) {
   .services .single-do {
     padding: 41px 17px 63px;
   }
 }

 .services .single-do .do-icon span {
   font-size: 73px;
   margin-bottom: 20px;
   display: inline-block;
 }

 .services .single-do .do-caption h4 {
   font-size: 24px;
   font-weight: 600;
   margin-bottom: 23px;
   color: #444;
 }

 @media only screen and (min-width: 992px) and (max-width: 1199px) {
   .services .single-do .do-caption h4 {
     font-size: 21px;
   }
 }

 .services .single-do .do-caption p {
   margin-bottom: 40px;
 }

 .services .single-do .do-btn a {
   text-transform: uppercase;
   font-size: 16px;
   font-weight: 500;
   -webkit-transition: all .3s ease-out 0s;
   -moz-transition: all .3s ease-out 0s;
   -ms-transition: all .3s ease-out 0s;
   -o-transition: all .3s ease-out 0s;
   transition: all .3s ease-out 0s;
 }

 .services .single-do .do-btn a i {
   width: 24px;
   height: 24px;
   display: inline-block;
   line-height: 24px;
   border-radius: 50%;
   margin-right: 7px;
   -webkit-transition: all .3s ease-out 0s;
   -moz-transition: all .3s ease-out 0s;
   -ms-transition: all .3s ease-out 0s;
   -o-transition: all .3s ease-out 0s;
   transition: all .3s ease-out 0s;
 }

 .services .single-do.active {
   box-shadow: 0px 10px 30px 0px rgba(133, 66, 189, 0.1);
 }

 /*--------------------------------------------------------------
# Pricing
--------------------------------------------------------------*/
 .single_pricing {
   box-shadow: 0px 10px 30px 0px rgba(133, 66, 189, 0.1);
   padding-top: 30px;
   padding-bottom: 30px;
   border-radius: 10px;
 }

 .single_pricing .pricing_top_bar .pricing_title {
   font-size: 24px;
   font-weight: 600;
   border-radius: 50%;
 }

 .single_pricing .pricing_top_bar i {
   text-align: center;
   font-size: 40px;
   margin-top: 60px;
   line-height: 60px;
 }

 .single_pricing .pricing_top_bar p {
   text-align: center;
   font-size: 14px;
   background: #c5ccd8;
   width: 250px;
   height: 24px;
   display: inline-block;
   border-radius: 4%;
   margin-right: 7px;
 }

 .single_pricing .pricing_top_bar .price {
   display: block;
   font-size: 44px;
   font-weight: 700;
   margin-top: 0;
   padding-bottom: 10px;
 }

 /*--------------------------------------------------------------
# Testimonials
--------------------------------------------------------------*/
 .testimonials {
   padding: 30px 0;
 }

 .testimonials .testimonial-item {
   box-sizing: content-box;
   padding: 30px 30px 0 30px;
   margin: 30px 15px;
   text-align: center;
   min-height: 300px;
   box-shadow: 0px 10px 30px 0px rgba(133, 66, 189, 0.1);
 }

 @media (max-width: 767px) {
   .testimonials .testimonial-item {
     margin: 30px 10px;
   }
 }

 .testimonials .testimonial-item .testimonial-img {
   width: 90px;
   border-radius: 50%;
   border: 4px solid #fff;
   margin: 0 auto;
 }

 .testimonials .testimonial-item h3 {
   font-size: 24px;
   margin: 10px 0 5px 0;
   color: #444;
   font-weight: 600;
 }

 .testimonials .testimonial-item h4 {
   font-size: 16px;
   color: #999;
   margin: 0;
 }

 .testimonials .testimonial-item .quote-sign-left {
   margin-top: -15px;
   padding-right: 10px;
   display: inline-block;
   width: 37px;
 }

 .testimonials .testimonial-item .quote-sign-right {
   margin-bottom: -15px;
   padding-left: 10px;
   display: inline-block;
   max-width: 100%;
   width: 37px;
 }

 .testimonials .testimonial-item p {
   margin: 0 auto 15px auto;
 }

 .testimonials .swiper-pagination {
   margin-top: 20px;
   position: relative;
 }

 .testimonials .swiper-pagination .swiper-pagination-bullet {
   width: 12px;
   height: 12px;
   opacity: 1;
   border: 1px solid #009cea;
   background-color: #ffffff;
 }

 .testimonials .swiper-pagination .swiper-pagination-bullet-active {
   background-color: #009cea;
 }

 /*--------------------------------------------------------------
# Partner
--------------------------------------------------------------*/
 .partner {
   padding: 30px 0;
 }

 .partner .partner-item {
   box-sizing: content-box;
   padding: 10px;
   margin: 10px;
   text-align: center;
   min-height: 50px;
   box-shadow: 0px 10px 30px 0px rgba(133, 66, 189, 0.1);
 }

 @media (max-width: 767px) {
   .partner .partner-item {
     margin: 30px 10px;
   }
 }

 .partner .partner-item .partner-img {
   width: 200px;
   border: 4px solid #fff;
   margin: 0 auto;
 }

 .partner .swiper-pagination {
   margin-top: 20px;
   position: relative;
 }

 .partner .swiper-pagination .swiper-pagination-bullet {
   width: 12px;
   height: 12px;
   opacity: 1;
   border: 1px solid #009cea;
   background-color: #fff;
 }

 .partner .swiper-pagination .swiper-pagination-bullet-active {
   background-color: #009cea;
 }

 /*--------------------------------------------------------------
# About.html
--------------------------------------------------------------*/
 /*--------------------------------------------------------------
# What makes us different
--------------------------------------------------------------*/
 .about_new {
   position: relative;
 }

 .about_new .single-do {
   -webkit-transition: all .3s ease-out 0s;
   -moz-transition: all .3s ease-out 0s;
   -ms-transition: all .3s ease-out 0s;
   -o-transition: all .3s ease-out 0s;
   transition: all .3s ease-out 0s;
   padding: 20px 10px 10px;
   border-radius: 6px;
 }

 @media only screen and (min-width: 992px) and (max-width: 1199px) {
   .about_new .single-do {
     padding: 15px 17px;
   }
 }

 @media only screen and (min-width: 768px) and (max-width: 991px) {
   .about_new .single-do {
     padding: 15px 17px;
   }
 }

 @media only screen and (min-width: 576px) and (max-width: 767px) {
   .about_new .single-do {
     padding: 15px 17px;
   }
 }

 @media (max-width: 767px) {
   .about_new .single-do {
     padding: 15px 17px;
   }
 }

 .about_new .single-do .do-caption p {
   margin-bottom: 20px;
 }

 .single-do.active {
   box-shadow: 0px 10px 30px 0px rgba(133, 66, 189, 0.1);
 }

 .about_new .icon {
   float: left;
 }

 .about_new .icon i {
   font-size: 30px;
   line-height: 0;
 }

 .about_new h4 {
   margin-left: 40px;
   font-weight: 500;
   margin-bottom: 0;
   font-size: 17px;
   color: #000;
 }

 .about_new p {
   font-weight: 500;
   margin-bottom: 0;
   font-size: 20px;
   color: #000;
 }

 .about_new em {
   font-style: normal;
 }

 /*--------------------------------------------------------------
# Team
--------------------------------------------------------------*/
 .team .member {
   position: relative;
   box-shadow: 0px 2px 15px rgba(0, 0, 0, 0.1);
   padding: 10px;
   text-align: center;
   margin-bottom: 10px;
 }

 .team .member .pic {
   overflow: hidden;
   width: 100%;
   margin: 0 0 10px 0;
 }

 .team .member .pic img {
   transition: ease-in-out 0.3s;
 }

 .team .member:hover img {
   transform: scale(1.1);
 }

 .team .member h4 {
   font-weight: 700;
   margin-bottom: 5px;
   font-size: 20px;
   color: #36343a;
 }

 .team .member span {
   display: block;
   font-size: 15px;
   position: relative;
   font-weight: 500;
 }

 .team .member .social {
   margin-top: 12px;
   display: flex;
   align-items: center;
   justify-content: center;
 }

 .team .member .social a {
   transition: ease-in-out 0.3s;
   display: flex;
   align-items: center;
   justify-content: center;
   border-radius: 50px;
   border: 1px solid #009cea;
   width: 32px;
   height: 32px;
 }

 .team .member .social a i {
   font-size: 16px;
   margin: 0 2px;
 }

 .team .member .social a+a {
   margin-left: 8px;
 }

 /* .services-section */
 /*--------------------------------------------------------------
# Services
--------------------------------------------------------------*/
 .services-section {
   padding: 11px 0;
   font-family: 'Proxima Nova';
 }

 .services-section .about-content {
   padding: 25px 0 0;
 }

 @media only screen and (min-width: 768px) and (max-width: 991px) {
   .services-section .about-img {
     margin-bottom: 20px;
   }
 }

 @media (max-width: 767px) {
   .services-section .about-img {
     margin-bottom: 20px;
   }
 }

 .services-section .about-img-2 {
   position: relative;
   z-index: 1;
   padding: 0;
 }



 @media only screen and (min-width: 768px) and (max-width: 991px) {
   .services-section .about-img-2 {
     margin-bottom: 20px;
   }
 }

 @media (max-width: 767px) {
   .services-section .about-img-2 {
     margin-bottom: 20px;
   }
 }

 .services-section .about-content ul li {
   padding-left: 40px;
   font-size: 18px;
   font-weight: 700;
   color: #444;
   margin-bottom: 20px;
   position: relative;
 }

 .services-section .about-content ul li::before {
   content: '';
   width: 14px;
   height: 14px;
   border-radius: 50%;
   background: #2088DA;
   position: absolute;
   left: 0;
   top: 6.5px;

   ;
 }

 /*--------------------------------------------------------------
# Contact
--------------------------------------------------------------*/
 .contact .info {
   padding: 30px;
   width: 100%;
   box-shadow: 0px 10px 30px 0px rgba(133, 66, 189, 0.1);
   border-radius: 4px;
 }

 .contact .info i {
   font-size: 20px;
   float: left;
   width: 44px;
   height: 44px;
   border: 1px solid #009cea;
   display: flex;
   justify-content: center;
   align-items: center;
   border-radius: 50px;
   transition: all 0.3s ease-in-out;
 }

 .contact .info h4 {
   padding: 0 0 0 60px;
   font-size: 20px;
   font-weight: 600;
   margin-bottom: 5px;
   color: #364146;
 }

 .contact .info p {
   padding: 0 0 10px 60px;
   margin-bottom: 20px;
   font-size: 14px;
   color: #627680;
 }

 .contact .info .social-links {
   padding-left: 60px;
 }

 .contact .info .social-links a {
   font-size: 18px;
   display: inline-block;
   line-height: 1;
   padding: 8px 0;
   border-radius: 50%;
   text-align: center;
   width: 36px;
   height: 36px;
   transition: 0.3s;
   margin-right: 10px;
 }

 .contact .php-email-form {
   width: 100%;
   padding: 30px;
   box-shadow: 0px 10px 30px 0px rgba(133, 66, 189, 0.1);
   border-radius: 4px;
 }

 .contact .php-email-form .form-group {
   padding-bottom: 8px;
 }

 .contact .php-email-form input,
 .contact .php-email-form textarea {
   border-radius: 0;
   box-shadow: none;
   font-size: 14px;
 }

 .contact .php-email-form input {
   height: 44px;
 }

 .contact .php-email-form textarea {
   padding: 10px 12px;
 }

 .contact .php-email-form button[type="submit"] {
   border: 0;
   padding: 10px 24px;
   transition: 0.4s;
   border-radius: 4px;
 }

 .contact .php-email-form button[type="submit"]:hover {
   background: #1eb4ff;
 }

 @-webkit-keyframes animate-loading {
   0% {
     transform: rotate(0deg);
   }

   100% {
     transform: rotate(360deg);
   }
 }

 @keyframes animate-loading {
   0% {
     transform: rotate(0deg);
   }

   100% {
     transform: rotate(360deg);
   }
 }

 /*--------------------------------------------------------------
# Footer
--------------------------------------------------------------*/
 .footer {
   background-color: #f2f3f5;
   padding: 60px 0 50px 0;
   font-family: 'Proxima Nova';
 }

 .footer .footer-site-logo {
   text-align: center;
   font-size: 32px;
   font-weight: 900;
   padding: 0 0 10px 0;
 }

 .footer .footer-site-logo a {
   color: #4200ff;
 }

 .footer .nav-links {
   padding: 0 0 10px 0;
   margin: 0;
 }

 .footer .nav-links li {
   display: inline-block;
 }

 .footer .nav-links li a {
   padding: 10px;
   color: #000;
 }

 .footer .social h3 {
   font-weight: bold;
   font-size: 18px;
   color: #000;
   padding: 0 0 10px 0;
 }

 .footer .social ul li {
   display: inline-block;
 }

 .footer .social ul li a {
   display: inline-block;
   padding: 10px;
 }

 .footer .copyright {
   color: #999999;
   padding: 10px 0 0;
 }

 /*--------------------------------------------------------------
# Button
--------------------------------------------------------------*/
 .btn {
   position: relative;
   height: 50px;
   width: 50px;
   margin: 5px;
   border-radius: 50%;
   box-shadow: -7px -7px 20px 0 rgba(255, 255, 255, 0.9),
     7px 7px 20px 0 rgba(0, 0, 0, 0.3);
   transition: 0.2s;
 }

 .btn:hover {
   transform: scale(1.1);
 }

 .btn::before {
   content: "";
   position: absolute;
   height: 80%;
   width: 80%;
   background: rgb(255, 255, 255);
   border-radius: 50%;
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);
 }

 .btn:hover::before {
   box-shadow: inset -7px -7px 20px 0 rgba(255, 255, 255, 1),
     inset 7px 7px 20px 0 rgba(0, 0, 0, 0.3);
 }

 .btn i {
   position: absolute;
   font-size: 30px;
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);
   transition: 0.2s;
 }

 .btn:hover i {
   font-size: 26px;
 }

 /*--------------------------------------------------------------
# Color
--------------------------------------------------------------*/
 .contact .info .social-links a:hover,
 .contact .info .email:hover i,
 .contact .info .address:hover i,
 .contact .info .phone:hover i,
 .contact .php-email-form button[type="submit"],
 .back-to-top i,
 .services .single-do .do-btn a i,
 .services .single-do.active .do-btn a i,
 .team .member .social a,
 .header-area .classy-navbar-toggler .navbarToggler span {
   background: #2088DA;
 }

 .contact .info i,
 .nav-menu a,
 .nav-menu .drop-down ul a,
 .mobile-nav-toggle i,
 .mobile-nav a,
 .services .single-do .do-icon span,
 .about_new span,
 .single_pricing.pricing_color .pricing_top_bar i,
 .services .single-do .do-btn a,
 .services .single-do.active .do-btn a,
 .about_new span,
 .about_new .icon i,
 .footer .nav-links li a:hover,
 .about_new em,
 .team .member .social a i,
 .team .member .social a:hover i,
 .features .box .icon i,
 .btn i,
 .header-area .vizew-main-menu .classy-navbar .classynav ul li a,
 .header-area .vizew-main-menu .classy-navbar .classynav .arrow::after,
 .header-area .vizew-main-menu .classy-navbar .classynav ul li ul li a {
   color: #2088DA;
 }

 #header .logo a,
 .back-to-top i,
 .back-to-top i:hover,
 .nav-menu .drop-down ul a:hover,
 .nav-menu .drop-down ul .active>a,
 .nav-menu .drop-down ul li:hover>a,
 .mobile-nav-active .mobile-nav-toggle i,
 #intro h2,
 .contact .info .social-links a,
 .contact .info .social-links a:hover,
 .contact .info .email:hover i,
 .contact .info .address:hover i,
 .contact .info .phone:hover i,
 .contact .php-email-form button[type="submit"],
 .team .member .social a i,
 .nav-menu li.active a,
 .nav-menu>ul>li:hover>a,
 .services .single-do .do-btn a i,
 .single_pricing .pricing_top_bar p {
   color: #fff;
 }

 #header,
 #header.header-scrolled,
 .mobile-nav,
 .features .box,
 .contact .info,
 .team,
 .nav-menu .drop-down ul,
 .contact .php-email-form,
 .single_pricing,
 .btn,
 .team .member .social a:hover {
   background: #fff;
 }

 .nav-menu>ul>li:hover,
 .nav-menu .active,
 .nav-menu .drop-down ul a:hover,
 .nav-menu .drop-down ul .active>a,
 .nav-menu .drop-down ul li:hover>a {
   background: #41D0FF;
 }

 .mobile-nav a:hover,
 .mobile-nav .active>a,
 .mobile-nav li:hover>a {
   color: #41D0FF;
 }