/*
@File: Everb Template Style

* This file contains the styling for the actual template, this
is the file you need to edit to change the look of the
template.

This files table contents are outlined below>>>>>

*******************************************
*******************************************
** - Default CSS
** - Header Area CSS
** - Navbar Area CSS
** - Banner Section CSS
** - Video Section CSS
** - Theory Section CSS
** - About Section CSS
** - Feature Section CSS
** - Service Section CSS
** - Team Section CSS
** - Testimonial Section CSS
** - Portfolio Section CSS
** - Progress Section CSS
** - Blog Section CSS
** - Contact Section CSS
** - Footer Section CSS
*/
@import url("https://fonts.googleapis.com/css?family=Montserrat:400,500,600,700|Poppins:400,500,600&display=swap");

@font-face {
  font-family: 'Calibri';
  src: url('./../font/Calibri.woff2') format('woff2'),
      url('./../font/Calibri.woff') format('woff');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

/* Color Variable */
/* Font Variable */
body {
  color: #717477;
  font-family: 'Calibri';
  line-height: 1.8;
  font-size: 18px;
}

/* Default CSS Start */
img {
  max-width: 100%;
}

a {
  -webkit-transition: .5s;
  transition: .5s;
  text-decoration: none;
}

a:hover {
  text-decoration: none;
}

a:focus {
  text-decoration: none;
}

button {
  outline: 0 !important;
  -webkit-box-shadow: none;
  box-shadow: none;
  border: none;
  background-color: transparent;
}

.form-control:focus {
  -webkit-box-shadow: 0 0 0 0;
  box-shadow: 0 0 0 0;
}

.d-table {
  width: 100%;
  height: 100%;
}

.d-table-cell {
  display: table-cell;
  vertical-align: middle;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  color: #333333;
}

h3 {
  font-size: 22px;
  font-family: 'Calibri';
  color: #0f2137;
}

.pt-100 {
  padding-top: 100px;
}

.pt-70 {
  padding-top: 70px;
}

.pb-15 {
  padding-bottom: 15px;
}

.pt-20 {
  padding-top: 20px;
}

.pt-30 {
  padding-top: 30px;
}

.pb-70 {
  padding-bottom: 70px;
}

.pb-100 {
  padding-bottom: 100px;
}



.section-title span {
  font-size: 16px;
  color: #886a03;
  display: inline-block;
  margin-bottom: 10px;
  font-weight: 600;
  text-transform: uppercase;
}

.section-title h2 {
  font-size: 38px;
  font-weight: 700;
  margin-bottom: 15px;
}

.section-title.about {
  margin: 0;
  max-width: 100%;
}

/* Default CSS End */
/** -------------- Home Page One CSS Start --------------**/
/* Header CSS Start */
.navbar-area .mean-container a.meanmenu-reveal span {
  position: relative;
  margin-top: -6px;
  top: 8px;
}

.header-area {
  background: #0d1528;
  padding: 15px 0;
}

.header-area .header-left-text ul {
  padding-left: 0;
  margin-bottom: 0;
}

.header-area .header-left-text ul li {
  display: inline-block;
  color: #565659;
  font-size: 15px;
  font-family: 'Calibri';
  font-weight: 500;
  margin-right: 20px;
  line-height: 1;
}

.header-area .header-left-text ul li a {
  color: #1c7df8;
}

.header-area .header-left-text ul li a:hover {
  color: #fff;
}

.header-area .header-left-text ul li i {
  margin-right: 5px;
  font-size: 16px;
  top: 1px;
  position: relative;
}

.header-area .header-right .header-social ul {
  padding-left: 0;
  margin-bottom: 0;
}

.header-area .header-right .header-social ul li {
  display: inline-block;
  line-height: 1;
  margin-left: 5px;
}

.header-area .header-right .header-social ul li a i {
  width: 25px;
  height: 25px;
  line-height: 23px;
  background: -webkit-gradient(linear, left bottom, left top, color-stop(25%, #0d3642), to(#fd740e));
  background: linear-gradient(0deg, #0d3642 25%, #0d3642 100%);
  color: #FFFFFF;
  font-size: 14px;
  text-align: center;
  display: inline-block;
  -webkit-transition: .5s;
  transition: .5s;
  border: 1px solid transparent;
}

.header-area .header-right .header-social ul li a i:hover {
  background: #FFFFFF;
  color: #0d3642;
  border: 1px dashed #0d3642;
}

/* Header CSS End */
/* Navbar CSS Start */
.navbar-area .main-nav {
  position: inherit;
  background: #FFFFFF;
  border-bottom: 2px solid #fff9e6;
  padding-top: 20px;
  padding-bottom: 4px;
}

.navbar-area .main-nav .navbar {
  padding: 0;
}

.navbar-area .main-nav .navbar .navbar-brand {
  padding: 0;
  top: -2px;
  position: relative;
}

.navbar-area .main-nav .navbar .navbar-nav .nav-item .nav-link {
  color: #4a4a4a;
  font-weight: 500;
  text-transform: capitalize;
  line-height: 1;
  -webkit-transition: 0.5s;
  transition: 0.5s;
}

.navbar-area .main-nav .navbar .navbar-nav .nav-item .nav-link>i {
  font-size: 12px;
}

.navbar-area .main-nav .navbar .navbar-nav .nav-item .nav-link.active {
  color: #1c7df8;
}

.navbar-area .main-nav .navbar .navbar-nav .nav-item .dropdown-menu {
  background: #FFFFFF;
  padding: 10px 0;
  border: 0;
  -webkit-transform: scaleX(0);
  transform: scaleX(0);
  top: 55px !important;
  right: 0;
}

.navbar-area .main-nav .navbar .navbar-nav .nav-item .dropdown-menu .nav-item .nav-link {
  border-bottom: 1px dashed #0d3642;
  padding: 10px 15px;
  position: relative;
  -webkit-transition: 0.5s;
  transition: 0.5s;
}

.navbar-area .main-nav .navbar .navbar-nav .nav-item .dropdown-menu .nav-item .nav-link>i {
  font-size: 12px;
  float: right;
}

.navbar-area .main-nav .navbar .navbar-nav .nav-item .dropdown-menu .nav-item .nav-link:hover {
  color: #0d3642;
  padding-left: 25px;
}

.navbar-area .main-nav .navbar .navbar-nav .nav-item .dropdown-menu .nav-item .nav-link:hover::before {
  width: 10px;
}

.navbar-area .main-nav .navbar .navbar-nav .nav-item .dropdown-menu .nav-item .nav-link:hover::after {
  width: 0px;
}

.navbar-area .main-nav .navbar .navbar-nav .nav-item .dropdown-menu .nav-item .nav-link::before {
  position: absolute;
  content: '';
  background: #0d3642;
  width: 0;
  height: 1px;
  top: 50%;
  left: 0;
  right: 0;
  -webkit-transition: .5s;
  transition: .5s;
}

.navbar-area .main-nav .navbar .navbar-nav .nav-item .dropdown-menu .nav-item .nav-link.active {
  color: #0d3642;
}

.navbar-area .main-nav .navbar .navbar-nav .nav-item .dropdown-menu .nav-item .nav-link:hover {
  color: #0d3642;
}

.navbar-area .main-nav .navbar .navbar-nav .nav-item .dropdown-menu .nav-item .dropdown-menu {
  left: -100%;
  top: 0 !important;
  opacity: 0;
  visibility: hidden;
}

.navbar-area .main-nav .navbar .navbar-nav .nav-item .dropdown-menu .nav-item .dropdown-menu .nav-item .nav-link:hover {
  color: #0d3642;
  padding-left: 25px;
}

.navbar-area .main-nav .navbar .navbar-nav .nav-item .dropdown-menu .nav-item .dropdown-menu .nav-item .nav-link:hover::before {
  width: 10px;
}

.navbar-area .main-nav .navbar .navbar-nav .nav-item .dropdown-menu .nav-item .dropdown-menu .nav-item .nav-link:hover::after {
  width: 0px;
}

.navbar-area .main-nav .navbar .navbar-nav .nav-item .dropdown-menu .nav-item .dropdown-menu .nav-item .nav-link::before {
  position: absolute;
  content: '';
  background: #0d3642;
  width: 0;
  height: 1px;
  top: 50%;
  left: 0;
  right: 0;
  -webkit-transition: .5s;
  transition: .5s;
}

.navbar-area .main-nav .navbar .navbar-nav .nav-item .dropdown-menu .nav-item .dropdown-menu .nav-item .nav-link.active {
  color: #0d3642;
}

.navbar-area .main-nav .navbar .navbar-nav .nav-item .dropdown-menu .nav-item:hover .dropdown-menu {
  opacity: 1 !important;
  visibility: visible;
  top: 0px !important;
}

.navbar-area .main-nav .navbar .navbar-nav .nav-item .dropdown-menu:last-child .nav-link {
  border-bottom: 0px;
}

.navbar-area .main-nav .navbar .navbar-nav .nav-item .dropdown-toggle::after {
  display: none;
}

.navbar-area .main-nav .navbar .navbar-nav .nav-item:hover .dropdown-menu {
  -webkit-transform: scaleX(1);
  transform: scaleX(1);
}

.navbar-area .main-nav .navbar .other-option {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.navbar-area .main-nav .navbar .other-option .search-bar {
  position: relative;
}

.navbar-area .main-nav .navbar .other-option .search-bar .search-icon {
  width: 30px;
  height: 30px;
  border: 1px solid #0d3642;
  text-align: center;
  line-height: 27px;
  color: #0d3642;
  display: inline-block;
  cursor: pointer;
  -webkit-transition: .5s;
  transition: .5s;
}

.navbar-area .main-nav .navbar .other-option .search-bar .search-icon:hover {
  background: #0d3642;
  color: #FFFFFF;
  border-radius: 20px;
}

.navbar-area .main-nav .navbar .other-option .search-bar .search-form {
  position: absolute;
  right: 0;
  -webkit-box-shadow: 0 0 15px rgba(0, 0, 0, 0.15);
  box-shadow: 0 0 15px rgba(0, 0, 0, 0.15);
  padding: 15px;
  background: #FFFFFF;
  top: 70px;
  -webkit-animation: fadeInDown 1s;
  animation: fadeInDown 1s;
  display: none;
  z-index: 1;
}

.navbar-area .main-nav .navbar .other-option .search-bar .search-form .search-input {
  height: 50px;
  width: 230px;
  padding-left: 20px;
  border: 1px dashed #0d3642;
  font-size: 20px;
  background: #FFFFFF;
}

.navbar-area .main-nav .navbar .other-option .search-bar .search-form .search-input:focus {
  border: 1px solid #0d3642;
  outline: 0;
}

.navbar-area .main-nav .navbar .other-option .search-bar .search-form ::-webkit-input-placeholder {
  color: #717477;
  font-size: 18px;
}

.navbar-area .main-nav .navbar .other-option .search-bar .search-form :-ms-input-placeholder {
  color: #717477;
  font-size: 18px;
}

.navbar-area .main-nav .navbar .other-option .search-bar .search-form ::-ms-input-placeholder {
  color: #717477;
  font-size: 18px;
}

.navbar-area .main-nav .navbar .other-option .search-bar .search-form ::placeholder {
  color: #717477;
  font-size: 18px;
}

.navbar-area .main-nav .navbar .other-option .search-bar .search-form button {
  position: absolute;
  top: 23px;
  right: 25px;
  border: 1px solid #0d3642;
  border-radius: 17px;
  -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);
  color: #0d3642;
  width: 33px;
  height: 33px;
  line-height: 30px;
}

.navbar-area .main-nav .navbar .other-option .sidebar-toggle .navbar-toggle {
  width: 30px;
  height: 30px;
  border: 1px solid #0d3642;
  text-align: center;
  line-height: 27px;
  color: #0d3642;
  display: inline-block;
  cursor: pointer;
  -webkit-transition: .5s;
  transition: .5s;
  padding: 0;
  border-radius: 0;
  margin-left: 10px;
}

.navbar-area .main-nav .navbar .other-option .sidebar-toggle .navbar-toggle:hover {
  background: #0d3642;
  color: #FFFFFF;
}

.navbar-area .main-nav .navbar .other-option .sidebar-toggle .navbar-toggle:focus {
  outline: 0;
  -webkit-box-shadow: 0 0 0 0;
  box-shadow: 0 0 0 0;
}

.navbar-area.sticky-top {
  -webkit-animation: .5s ease-in-out fadeInDown;
  animation: .5s ease-in-out fadeInDown;
  -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);
}

/* Navbar CSS End */
/* Modal CSS Start */
.modal.fade:not(.in).left .modal-dialog {
  -webkit-transform: translate3d(-25%, 0, 0);
  transform: translate3d(-25%, 0, 0);
}

.modal.fade:not(.in).right .modal-dialog {
  -webkit-transform: translate3d(0%, 0, 0);
  transform: translate3d(0%, 0, 0);
}

.modal.fade:not(.in).bottom .modal-dialog {
  -webkit-transform: translate3d(0, 25%, 0);
  transform: translate3d(0, 25%, 0);
}

.modal.right .modal-dialog {
  position: absolute;
  top: 0;
  right: 0;
  margin: 0;
}

.right-modal .modal {
  z-index: 9999999;
  -webkit-transition: 1s;
  transition: 1s;
}

.right-modal .modal .modal-header img {
  width: 120px;
  padding-top: 5px;
  padding-left: 20px;
}

.right-modal .modal .modal-header button span {
  background: #fff;
  width: 50px;
  height: 50px;
  display: inline-block;
  border-radius: 40px;
  line-height: 50px;
  -webkit-transition: .5s;
  transition: .5s;
  -webkit-box-shadow: 7px 5px 30px rgba(72, 73, 121, 0.15);
  box-shadow: 7px 5px 30px rgba(72, 73, 121, 0.15);
  font-size: 50px;
  color: #0d3642;
}

.right-modal .modal .modal-header button span:hover {
  border-radius: 0px;
}

.right-modal .modal .modal-body {
  width: 500px;
  padding: 40px;
  background: #FFFFFF;
}

.right-modal .modal .modal-body .modal-link {
  position: relative;
  margin-bottom: 30px;
}

.right-modal .modal .modal-body .modal-link a {
  display: inline-block;
  -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}

.right-modal .modal .modal-body .modal-link h3 a {
  position: absolute;
  bottom: -8px;
  left: 0;
  background: #fff;
  width: 100%;
  height: 50px;
  text-align: center;
  padding-top: 15px;
  color: #3f3f3f;
  display: inline-block;
  font-size: 18px;
}

.right-modal .modal .modal-body .modal-link:hover h3 a {
  background: #0d3642;
  color: #FFFFFF;
}

.right-modal .modal.fade {
  -webkit-transition: .5s linear;
  transition: .5s linear;
  -webkit-transform: translateX(100%);
  transform: translateX(100%);
}

.right-modal .modal.show {
  -webkit-transform: translateX(0%);
  transform: translateX(0%);
}

.modal.right .modal-content {
  min-height: 100vh;
  border: 0;
}

.modal-body {
  padding: 0;
}

.modal-header .close {
  margin-right: 0;
}

/* Modal CSS End */
/* ===== DARK GRADIENT BANNER ===== */
.main-banner {
  position: relative;
  padding: 120px 0;
  background: linear-gradient(135deg, #020617 0%, #0f172a 50%, #020617 100%);
  overflow: hidden;
  z-index: 1;
}

/* Animated Glow Effects */
.main-banner::before {
  content: "";
  position: absolute;
  width: 500px;
  height: 500px;
  background: radial-gradient(circle, rgba(28,125,248,0.25), transparent 70%);
  top: -150px;
  left: -150px;
  filter: blur(100px);
  animation: floatGlow 8s ease-in-out infinite;
}

.main-banner::after {
  content: "";
  position: absolute;
  width: 400px;
  height: 400px;
  background: radial-gradient(circle, rgba(57,33,147,0.25), transparent 70%);
  bottom: -150px;
  right: -150px;
  filter: blur(100px);
  animation: floatGlow 10s ease-in-out infinite;
}

/* TEXT */
.main-banner .banner-text {
  max-width: 600px;
  position: relative;
  z-index: 2;
}

/* Heading */
.main-banner .banner-text h1 {
  font-size: 52px;
  font-weight: 700;
  font-family: 'Open Sans', sans-serif;
  background: linear-gradient(90deg, #1c7df8, #392193);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  margin-bottom: 25px;
  line-height: 1.2;
}

/* Paragraph */
.main-banner .banner-text p {
  color: #cbd5f5;
  margin-bottom: 35px;
  line-height: 1.8;
}

/* BUTTON */
.main-banner .default-btn {
  display: inline-block;
  padding: 14px 32px;
  background: linear-gradient(45deg, #1c7df8, #392193);
  color: #fff;
  border-radius: 50px;
  font-weight: 600;
  text-decoration: none;
  transition: 0.4s ease;
  box-shadow: 0 10px 30px rgba(28,125,248,0.3);
}

/* Hover */
.main-banner .default-btn:hover {
  transform: translateY(-4px);
  box-shadow: 0 15px 40px rgba(28,125,248,0.6);
}

/* IMAGE */
.main-banner .banner-image img {
  width: 100%;
  animation: floatImage 5s ease-in-out infinite;
  filter: drop-shadow(0 20px 40px rgba(0,0,0,0.6));
}

/* ANIMATIONS */
@keyframes floatGlow {
  0%,100% { transform: translateY(0); }
  50% { transform: translateY(30px); }
}

@keyframes floatImage {
  0%,100% { transform: translateY(0); }
  50% { transform: translateY(-15px); }
}

/* PARTICLES FIX */
#particles-js {
  position: absolute;
  width: 100%;
  height: 100%;
  z-index: 0;
}

/* RESPONSIVE */
@media (max-width: 992px) {
  .main-banner {
    text-align: center;
    padding: 80px 0;
  }

  .main-banner .banner-text h1 {
    font-size: 36px;
  }

  .main-banner .banner-image {
    margin-top: 40px;
  }
}
/* banner css ends */

/* .theory-section */

.theory-section .theory-area {
  position: relative;
  background: #FFFFFF;
  -webkit-box-shadow: 0px 2px 20px 0px rgba(12, 0, 46, 0.04);
  box-shadow: 0px 2px 20px 0px rgba(12, 0, 46, 0.04);
}


.theory-section .theory-area .theory-text h2 {
  font-size: 38px;
  font-weight: 700;
  text-transform: capitalize;
  line-height: 1.4;
}

.theory-section .theory-area .theory-text p {
  color: #333333;
  margin-bottom: 30px;
}
.theory-section .theory-area .theory-text p b {
  color: #E67E22;
}

.theory-section .theory-area .theory-text .signature-box img {
  margin-bottom: 10px;
}

.theory-section .theory-area .theory-text .signature-box p {
  margin-bottom: 0;
  color: #333333;
  font-weight: 500;
}

.theory-section .theory-area .theory-text .signature-box span {
  font-size: 14px;
  color: #333333;
}

.theory-text ul li {
  list-style-type: none;
}

.theory-text ul li b {
  color: #E67E22;
  /* list-style-type: none; */
}
/* Theory CSS End */
/* About CSS Start */
.about-section {
  padding-top: 100px;
  background: #FFFFFF;
}

.about-section .about-image img {
  border-radius: 30% 70% 70% 30% / 30% 30% 70% 70%;
  -webkit-box-shadow: 0 0 11px 0 rgba(0, 0, 0, 0.35);
  box-shadow: 0 0 11px 0 rgba(0, 0, 0, 0.35);
  z-index: 1;
  -webkit-animation: wrep 10s infinite linear;
  animation: wrep 10s infinite linear;
  width: 100%;
  max-width: unset;
}

.about-section .about-text .section-title {
  margin: 0 auto 15px 0;
}

.about-section .about-text .about-us {
  margin-bottom: 20px;
}

.about-section .about-text .about-us i {
  font-size: 40px;
  left: 20px;
  position: relative;
  top: 0;
  line-height: 1;
  margin-bottom: 10px;
  display: inline-block;
  color: #111111;
  z-index: 0;
}

.about-section .about-text .about-us i::after {
  position: absolute;
  content: '';
  width: 40px;
  height: 40px;
  top: 0;
  left: -15px;
  z-index: -1;
}

.about-section .about-text .about-us i.icon-one::after {
  background: rgba(132, 186, 63, 0.65);
}

.about-section .about-text .about-us i.icon-two::after {
  background: rgba(255, 124, 0, 0.64);
  border-radius: 50px;
}

.about-section .about-text .about-us i.icon-three::after {
  background: rgba(255, 199, 10, 0.66);
  -webkit-transform: rotate(30deg);
  transform: rotate(30deg);
}

.about-section .about-text .about-us p {
  font-size: 14px;
  color: #808291;
  margin-bottom: 0;
}

.about-section .about-text p {
  color: #34495E;
  margin-bottom: 15px;
}

.about img {
  width: 100%;
}

/* About CSS End */
.about-section .about-text .section-title

/* Feature CSS Start */
.features-card .features-card {
  text-align: center;
  -webkit-box-shadow: 0px 2px 20px 0px rgba(12, 0, 46, 0.1);
  box-shadow: 0px 2px 20px 0px rgba(12, 0, 46, 0.1);
  padding: 30px 20px;
  margin-bottom: 30px;
  -webkit-transition: .5s;
  transition: .5s;
  position: relative;
  background: #FFFFFF;
  z-index: 1;
}

.features-card.feature-one {

  text-align: center;
  -webkit-box-shadow: 0px 2px 20px 0px rgb(12 0 46 / 10%);
  box-shadow: 0px 2px 20px 0px rgb(12 0 46 / 10%);
  padding: 30px 20px;
  margin-bottom: 30px;
  -webkit-transition: .5s;
  transition: .5s;
  position: relative;
  background: #FFFFF1;
  z-index: 1;
  height: 100%;
}

.features-card.feature-two {

  text-align: center;
  -webkit-box-shadow: 0px 2px 20px 0px rgb(12 0 46 / 10%);
  box-shadow: 0px 2px 20px 0px rgb(12 0 46 / 10%);
  padding: 30px 20px;
  margin-bottom: 30px;
  -webkit-transition: .5s;
  transition: .5s;
  position: relative;
  background: #FFFFF1;
  z-index: 1;
  height: 100%;
}

.features-card.feature-three {

  text-align: center;
  -webkit-box-shadow: 0px 2px 20px 0px rgb(12 0 46 / 10%);
  box-shadow: 0px 2px 20px 0px rgb(12 0 46 / 10%);
  padding: 30px 20px;
  margin-bottom: 30px;
  -webkit-transition: .5s;
  transition: .5s;
  position: relative;
  background: #FFFFF1;
  z-index: 1;
  height: 100%;
}

.features-card.feature-four {

  text-align: center;
  -webkit-box-shadow: 0px 2px 20px 0px rgb(12 0 46 / 10%);
  box-shadow: 0px 2px 20px 0px rgb(12 0 46 / 10%);
  padding: 30px 20px;
  margin-bottom: 30px;
  -webkit-transition: .5s;
  transition: .5s;
  position: relative;
  background: #FFFFF1;
  z-index: 1;
  height: 100%;
}

.features-card.feature-five {

  text-align: center;
  -webkit-box-shadow: 0px 2px 20px 0px rgb(12 0 46 / 10%);
  box-shadow: 0px 2px 20px 0px rgb(12 0 46 / 10%);
  padding: 30px 20px;
  margin-bottom: 30px;
  -webkit-transition: .5s;
  transition: .5s;
  position: relative;
  background: #FFFFF1;
  z-index: 1;
  height: 100%;
}

.features-card.feature-six {

  text-align: center;
  -webkit-box-shadow: 0px 2px 20px 0px rgb(12 0 46 / 10%);
  box-shadow: 0px 2px 20px 0px rgb(12 0 46 / 10%);
  padding: 30px 20px;
  margin-bottom: 30px;
  -webkit-transition: .5s;
  transition: .5s;
  position: relative;
  background: #FFFFF1;
  z-index: 1;
  height: 100%;
}

.features-card.feature-seven {

  text-align: center;
  -webkit-box-shadow: 0px 2px 20px 0px rgb(12 0 46 / 10%);
  box-shadow: 0px 2px 20px 0px rgb(12 0 46 / 10%);
  padding: 30px 20px;
  margin-bottom: 30px;
  -webkit-transition: .5s;
  transition: .5s;
  position: relative;
  background: #FFFFF1;
  z-index: 1;
  height: 100%;
}

.features-card.feature-eight {

  text-align: center;
  -webkit-box-shadow: 0px 2px 20px 0px rgb(12 0 46 / 10%);
  box-shadow: 0px 2px 20px 0px rgb(12 0 46 / 10%);
  padding: 30px 20px;
  margin-bottom: 30px;
  -webkit-transition: .5s;
  transition: .5s;
  position: relative;
  background: #FFFFF1;
  z-index: 1;
  height: 100%;
}

.features-section .features-card:hover {
  margin-top: -10px;
  -webkit-box-shadow: 0px 2px 20px 0px rgba(12, 0, 46, 0.04);
  box-shadow: 0px 2px 20px 0px rgba(12, 0, 46, 0.04);
}

.features-section .features-card:hover p,
.features-section .features-card:hover h3 {
  color: #FFFFFF;
}

.features-section .features-card i {
  font-size: 35px;
  width: 90px;
  height: 90px;
  display: inline-block;
  text-align: center;
  line-height: 90px;
  border-radius: 46% 54% 68% 32% / 55% 48% 52% 45%;
  margin-bottom: 25px;
  -webkit-animation: icon-animation 5s ease-in-out infinite;
  animation: icon-animation 5s ease-in-out infinite;
  border: 1px dashed;
}

.features-section .features-card h3 {
  font-weight: 600;
  margin-bottom: 10px;
  -webkit-transition: .5s;
  transition: .5s;
}

.features-section .features-card p {
  margin-bottom: 0;
  font-size: 16px;
  -webkit-transition: .5s;
  transition: .5s;
}

.features-section .features-card.feature-one i {
  color: #18a87c;
  background: #daf4ec;
}

.features-section .features-card.feature-one:hover {
  background: #88a32a;
}

.features-section .features-card.feature-two i {
  color: #f0573c;
  background: #ffd7ca;
}

.features-section .features-card.feature-two:hover {
  background: #f0573c;
}

.features-section .features-card.feature-three i {
  color: #3454d1;
  background: #e1e6f8;
}

.features-section .features-card.feature-three:hover {
  background: #3454d1;
}

.features-section .features-card.feature-four i {
  color: #ffc70b;
  background: #fff9e6;
}

.features-section .features-card.feature-four:hover {
  background: #d1ad34;
}

.features-section .features-card.feature-five i {
  color: #f26d56;
  background: #ede5fb;
}

.features-section .features-card.feature-five:hover {
  background: #f26d56;
}

.features-section .features-card.feature-six i {
  color: #88a32a;
  background: #eff2e2;
}

.features-section .features-card.feature-six:hover {
  background: #88a32a;
}

/* Feature CSS End */
/* Service CSS Start */
.service-section {
  position: relative;
}

.service-section .service-img {
  position: absolute;
  background-image: url(../img/service-img.jpg);
  background-position: center center;
  background-size: cover;
  width: 55%;
  height: 100%;
  left: 0;
  top: 0;
}

.service-section .service-text {
  background: #0d3642;
  margin-bottom: 16px;
  margin-top: 15px;
  padding: 100px;
  position: relative;
}

.service-section .service-text h2 {
  margin-bottom: 50px;
  color: #FFFFFF;
  font-size: 35px;
  font-weight: 700;
  line-height: 1.4;
}

h2.about-section-title {
  font-size: 40px;
  font-weight: 700;
  margin-bottom: 20px;
}

.service-section .service-text ul {
  padding-left: 0;
  margin-bottom: 0;
}

.service-section .service-text ul li {
  padding: 15px 15px 15px 90px;
  background: #FFFFFF;
  margin-bottom: 20px;
  position: relative;
  color: #808291;
  font-size: 18px;
  font-weight: 500;
  max-width: 400px;
  list-style: none;
}

.service-section .service-text ul li i {
  background: #fd6318;
  color: #FFFFFF;
  text-align: center;
  position: absolute;
  line-height: 65px;
  font-size: 25px;
  height: 100%;
  width: 60px;
  left: 0;
  top: 0;
}

/* Service CSS End */
/* Team CSS End */
.team-section .section-title {
  max-width: 700px;
}

.team-section .team-card {
  margin-bottom: 80px;
}

.team-section .team-card:hover .team-text {
  background: #0d3642;
}

.team-section .team-card:hover .team-text h3 {
  color: #FFFFFF;
}

.team-section .team-card:hover .team-text p {
  color: #FFFFFF;
}

.team-section .team-card:hover .team-text .team-social {
  opacity: 1;
  -webkit-transform: translateY(-15px);
  transform: translateY(-15px);
}

.team-section .team-card .team-img {
  position: relative;
}

.team-section .team-card .team-img img {
  width: 100%;
}

.team-section .team-card .team-text {
  background: #FFFFFF;
  padding: 25px;
  -webkit-box-shadow: 0 2px 10px rgba(12, 0, 46, 0.15);
  box-shadow: 0 2px 10px rgba(12, 0, 46, 0.15);
  position: absolute;
  text-align: center;
  z-index: 1;
  width: 230px;
  left: 0;
  right: 0;
  margin: auto;
  bottom: -50px;
  -webkit-transition: .5s;
  transition: .5s;
  transition: .5s;
}

.team-section .team-card .team-text .team-social {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  opacity: 0;
  -webkit-transition: .5s;
  transition: .5s;
}

.team-section .team-card .team-text .team-social ul {
  padding-left: 0;
  margin-bottom: 0;
}

.team-section .team-card .team-text .team-social ul li {
  display: inline-block;
}

.team-section .team-card .team-text .team-social ul li i {
  background: #FFFFFF;
  color: #333333;
  width: 25px;
  height: 25px;
  display: inline-block;
  line-height: 25px;
  text-align: center;
  -webkit-transition: .5s;
  transition: .5s;
  font-size: 14px;
  border-radius: 30px;
}

.team-section .team-card .team-text .team-social ul li i:hover {
  background: #0d3642;
  color: #FFFFFF;
}

.team-section .team-card .team-text h3 {
  font-size: 18px;
  font-weight: 700;
  -webkit-transition: .5s;
  transition: .5s;
}

.team-section .team-card .team-text p {
  margin-bottom: 0;
  -webkit-transition: .5s;
  transition: .5s;
}

/* Team CSS End */
/* Testimonial CSS Start */
.testimonial-section {
  background: linear-gradient(135deg, #0a192f, #064884);;
}

.testimonial-section .testimonial-slider {
  text-align: center;
  position: relative;
  z-index: 0;
}

.testimonial-section .testimonial-slider::before {
  position: absolute;
  content: '';
  background: #FFFFFF;
  width: 85%;
  height: 85%;
  left: 0;
  z-index: -1;
  margin: auto;
  right: 0;
  bottom: -20px;
  z-index: -1;
  border-radius: 30px;
}

.testimonial-section .testimonial-slider img {
  max-width: 150px;
  width: unset;
  margin: 0 auto 40px;
  right: 0;
  left: 0;
  border: 3px solid #0d3642;
  border-radius: 150px;
  padding: 5px;
  background: #fff;
  -webkit-box-shadow: 0 0 25px rgba(0, 0, 0, 0.15);
  box-shadow: 0 0 25px rgba(0, 0, 0, 0.15);
}

.testimonial-section .testimonial-slider h3 {
  font-size: 24px;
  font-weight: 500;
  margin-bottom: 0;
}

.testimonial-section .testimonial-slider span {
  color: #0d3642;
  font-size: 16px;
  margin-bottom: 20px;
  display: inline-block;
}

.testimonial-section .testimonial-slider p {
  padding: 0 150px;
}

.testimonial-section .testimonial-slider .owl-prev:hover,
.testimonial-section .testimonial-slider .owl-next:hover {
  background: none;
}

.testimonial-section .testimonial-slider .owl-prev span,
.testimonial-section .testimonial-slider .owl-next span {
  color: #0d3642;
  font-size: 16px;
  margin-bottom: 20px;
  display: inline-block;
  width: 45px;
  height: 45px;
  border-radius: 50px;
  line-height: 40px;
  font-size: 30px;
  text-align: center;
  border: 1px solid #0d3642 !important;
  -webkit-transition: .5s;
  transition: .5s;
}

.testimonial-section .testimonial-slider .owl-prev span:hover,
.testimonial-section .testimonial-slider .owl-next span:hover {
  background: #0d3642;
  color: #FFFFFF !important;
}

.testimonial-section .testimonial-image {
  background-image: url(../img/testimonial-img.jpg);
  background-position: center center;
  background-size: cover;
  height: 100%;
}

/* Testimonial CSS End */
/* Portfolio CSS Start */
.portfolio-section .portfolio-item {
  cursor: pointer;
  margin-bottom: 30px;
}

.portfolio-section .portfolio-item:hover .portfolio-img .portfolio-text {
  bottom: 0;
}

.portfolio-section .portfolio-item .portfolio-img {
  position: relative;
  overflow: hidden;
}

.portfolio-section .portfolio-item .portfolio-img img {
  width: 100%;
}

.portfolio-section .portfolio-item .portfolio-img::before {
  position: absolute;
  content: '';
  background: #34495E;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  opacity: .3;
}

.portfolio-section .portfolio-item .portfolio-img .portfolio-text {
  position: absolute;
  bottom: -68px;
  left: 0;
  right: 0;
  margin: auto;
  text-align: center;
  -webkit-transition: .5s;
  transition: .5s;
  background: rgba(0, 0, 0, 0.5);
}

.portfolio-section .portfolio-item .portfolio-img .portfolio-text h3 {
  color: #FFFFFF;
  font-weight: 700;
  padding: 15px 0 15px;
  margin-bottom: 0;
}

.portfolio-section .portfolio-item .portfolio-img .portfolio-text .portfolio-btn {
  font-size: 14px;
  font-weight: 500;
  background: linear-gradient(90deg, #2C3E50 0%, #2C3E50 100%);
  color: #FFFFFF;
  padding: 10px 20px;
  display: inline-block;
  margin-bottom: 20px;
  border: 1px solid transparent;
}

.portfolio-section .portfolio-item .portfolio-img .portfolio-text .portfolio-btn i {
  font-size: 10px;
}

.portfolio-section .portfolio-item .portfolio-img .portfolio-text .portfolio-btn:hover {
  border: 1px solid #FFFFFF;
  background: transparent;
}

/* Portfolio CSS End */
/* Progress CSS Start */
.progress-section {
  position: relative;
}

.progress-section .progress-image {
  background-image: url(../img/progress.jpg);
  background-position: center center;
  background-size: cover;
  position: absolute;
  height: 100%;
  width: 60%;
  left: 0;
  top: 0;
}

.progress-section .progress-image-1 {
  background-image: url(../img/progress-1.jpg);
  background-position: center center;
  background-size: cover;
  position: absolute;
  height: 100%;
  width: 60%;
  left: 0;
  top: 0;
}

.progress-section .progress-text {
  background: #0d3642;
  /* margin-bottom: 50px; */
  /* margin-top: 50px; */
  padding: 80px;
  position: relative;
  z-index: 1;
}

.progress-section .progress-text h2 {
  color: #FFFFFF;
  margin-bottom: 20px;
  font-weight: 700;
  font-size: 35px;
  line-height: 1.4;
}

.progress-section .progress-text p {
  color: #FFFFFF;
  margin-bottom: 30px;
}

.progress-section .progress-text .progress-inner {
  position: relative;
  margin-bottom: 60px;
}

.progress-section .progress-text .progress-inner p {
  position: absolute;
  margin-bottom: 0;
  top: -35px;
  color: #FFFFFF;
}

.progress-section .progress-text .progress-inner span {
  position: absolute;
  top: -35px;
  right: 0;
  color: #FFFFFF;
}

.progress-section .progress-text .progress-inner .progress {
  height: 6px;
  border-radius: 0;
}

.progress-section .progress-text .progress-inner .progress .progress-bar {
  background-color: #0d3642;
  height: 6px;
}

.progress-section .progress-text :last-child {
  margin-bottom: 0;
}

.pricing-feature ul li img {
  max-width: 20px;
}

.pricing-feature ul {
  padding-left: 0;
}

/* Progress CSS End */
/* Blog CSS Start */
.blog-section .blog-card {
  -webkit-box-shadow: 0px 2px 25px 0px rgba(12, 0, 46, 0.1);
  box-shadow: 0px 2px 25px 0px rgba(12, 0, 46, 0.1);
  margin-bottom: 30px;
  background: #FFFFFF;
  height: 500px;
}
.blog-card.one {
  height: 565px;
}

.blog-section .blog-card:hover .blog-img img {
  -webkit-transform: scale(1.1);
  transform: scale(1.1);
}

.blog-section .blog-card:hover .blog-img .blog-date {
  left: 0;
}

.blog-section .blog-card .blog-img {
  position: relative;
  overflow: hidden;
}

.blog-section .blog-card .blog-img img {
  -webkit-transition: .5s;
  transition: .5s;
}

.blog-section .blog-card .blog-img .blog-date {
  position: absolute;
  background: #0d3642;
  width: 55px;
  text-align: center;
  top: 0;
  left: 25px;
  padding: 6px;
  -webkit-transition: .5s;
  transition: .5s;
}

.blog-section .blog-card .blog-img .blog-date span {
  color: #FFFFFF;
  display: inline-block;
  line-height: 25px;
}

.blog-section .blog-card .blog-text {
  padding: 25px 25px 65px;
}

.blog-section .blog-card .blog-text h3 {
  font-size: 20px;
  font-weight: 600;
  margin-bottom: 15px;
  -webkit-transition: .5s;
  transition: .5s;
  line-height: 1.4;
}

.blog-section .blog-card .blog-text h3 a {
  color: #111111;
}

.blog-section .blog-card .blog-text .post-info {
  position: relative;
}

.blog-section .blog-card .blog-text .post-info img {
  position: absolute;
}

.blog-section .blog-card .blog-text .post-info a p {
  position: absolute;
  left: 50px;
  top: 8px;
  font-size: 14px;
  color: #808291;
  margin-bottom: 0;
  -webkit-transition: .5s;
  transition: .5s;
}

.blog-section .blog-card .blog-text .post-info .blog-btn {
  position: absolute;
  right: 0;
  top: 9px;
  font-size: 14px;
  color: #808291;
}

.blog-section .blog-card .blog-text .post-info .blog-btn i {
  font-size: 12px;
}

.blog-section .blog-card:hover .blog-text a h3,
.blog-section .blog-card:hover .blog-text .post-info a p,
.blog-section .blog-card:hover .blog-text .post-info .blog-btn {
  color: #0d3642;
}

/* Blog CSS End */
/* Contact CSS Start */
/* .contact-section .contact-img {
  position: relative;
  /* background-image: url(../img/contact.jpg); */
  /* background-position: center center;
  background-size: cover;
  max-width: 100%;
  background-repeat: no-repeat;
} */

/* .contact-section .contact-img img {
  position: absolute;
  max-width: 100%;
  height: 100%; */
  /* display: none; */
/* } */

.col-lg-6.contact-img.p-0 img {
  border-radius: 10px;
}

.contact-section .contact-form {
  -webkit-box-shadow: 0px 2px 25px 0px rgba(12, 0, 46, 0.1);
  box-shadow: 0px 2px 25px 0px rgba(12, 0, 46, 0.1);
  padding: 70px;
  background: #FFFFFF;
  position: relative;
}

.contact-section .contact-form .contact-text {
  padding-bottom: 40px;
}

.contact-section .contact-form .contact-text h3 {
  font-weight: 600;
  margin-bottom: 15px;
}

.contact-section .contact-form .contact-text p {
  color: #646464;
  margin-bottom: 0;
}

.contact-section .contact-form .form-group {
  margin-bottom: 15px;
}

.contact-section .contact-form .form-group .form-control {
  height: 50px;
  border: 1px solid #0d3642;
  border-radius: 10px;
}

.contact-section .contact-form .form-group .message-field {
  border: 1px solid #0d3642;
  width: 100%;
  border-radius: 10px;
  padding-left: 10px;
  padding-top: 10px;
}

.contact-section .contact-form .form-group .message-field:focus {
  border: 1px solid #0d3642;
  outline: 0;
}

.contact-section .contact-form .form-group .message-field .list-unstyled {
  margin-top: 0;
}

.contact-section .contact-form .form-group ::-webkit-input-placeholder {
  color: #464646;
}

.contact-section .contact-form .form-group :-ms-input-placeholder {
  color: #464646;
}

.contact-section .contact-form .form-group ::-ms-input-placeholder {
  color: #464646;
}

.contact-section .contact-form .form-group ::placeholder {
  color: #464646;
}

.contact-section .contact-form .form-group .list-unstyled {
  color: red;
  margin-top: 10px;
}

.contact-section .contact-form .default-btn {
  color: #FFFFFF;
  border-radius: 5px;
  padding: 10px 20px;
  margin-top: 10px;
  z-index: 0;
  position: relative;
  -webkit-transition: .5s;
  transition: .5s;
  font-size: 16px;
  border: 1px solid #2C3E50;
  margin-bottom: 10px;
}

.contact-section .contact-form .default-btn::before {
  position: absolute;
  content: '';
  background: linear-gradient(90deg, #2C3E50 0%, #2C3E50 100%);
  width: 100%;
  height: 100%;
  border-radius: 4px;
  top: 0;
  left: 0;
  -webkit-transform: scale(1);
  transform: scale(1);
  -webkit-transition: .5s;
  transition: .5s;
  z-index: -1;
}

.contact-section .contact-form .default-btn:hover::before {
  -webkit-transform: scale(0);
  transform: scale(0);
}

.contact-section .contact-form .default-btn:hover {
  color: #5156f7;
  border: 1px solid #2C3E50;
}

.contact-section .contact-form .contact-shape {
  position: absolute;
  right: 0;
  bottom: 0;
  -webkit-animation: translatey 5s infinite linear;
  animation: translatey 5s infinite linear;
}

.contact-section .contact-form .contact-text h2 {
    color: #c9a646;
}
/* Contact CSS End */
/* Newsletter CSS Start */
.newsletter-section .newsletter-area {
  background: #ff7309;
  padding: 43px;
  margin-bottom: 0px;
  z-index: 1;
  position: relative;
  text-align: center;
}

.newsletter-section .newsletter-area h2 {
  font-size: 32px;
  font-weight: 700;
  color: #FFFFFF;
  margin-bottom: 35px;
  line-height: 1;
}

.newsletter-section .newsletter-area .newsletter-form {
  position: relative;
}

.newsletter-section .newsletter-area .newsletter-form .form-control {
  border: 1px solid #FFFFFF;
  padding: 20px 0 20px 20px;
  height: 50px;
  background: #ff7309 !important;
  color: #FFFFFF;
  border-radius: 0;
}

.newsletter-section .newsletter-area .newsletter-form ::-webkit-input-placeholder {
  color: #FFFFFF;
}

.newsletter-section .newsletter-area .newsletter-form :-ms-input-placeholder {
  color: #FFFFFF;
}

.newsletter-section .newsletter-area .newsletter-form ::-ms-input-placeholder {
  color: #FFFFFF;
}

.newsletter-section .newsletter-area .newsletter-form ::placeholder {
  color: #FFFFFF;
}

.newsletter-section .newsletter-area .newsletter-form .default-btn {
  position: absolute;
  font-size: 16px;
  color: #FFFFFF;
  height: 50px;
  padding: 0 20px;
  top: 0px;
  right: -1px;
  -webkit-transition: .5s;
  transition: .5s;
  border-left: 1px solid;
  background: #ff7309;
  border: 1px solid;
}

.newsletter-section .newsletter-area .newsletter-form .default-btn:hover {
  color: #FFFFFF;
  background: #34495E;
}

.newsletter-section .newsletter-area .validation-danger {
  color: #ffffff;
  margin-top: 10px;
}

.newsletter-section .newsletter-area .subscribe-shape {
  position: absolute;
  right: 50px;
  bottom: 0;
  -webkit-animation: translatey 5s infinite linear;
  animation: translatey 5s infinite linear;
}

/* Newsletter CSS End */
/* Footer Section CSS Start */
.footer-area {
  background: linear-gradient(135deg, #020617 0%, #0f172a 40%, #020617 100%);
  padding-top: 100px;
  -webkit-clip-path: polygon(53% 15%, 100% 0, 100% 43%, 100% 78%, 100% 100%, 32% 100%, 0 100%, 0% 43%, 0 0);
  clip-path: polygon(0% 0%, 100% 0, 100% 43%, 100% 70%, 100% 100%, 0% 100%, 0 100%, 0% 43%, 0 0);
}

.footer-area .footer-widget .footer-logo img {
  margin-bottom: 25px;
  max-width: 145px;
}

.footer-area .footer-widget p {
  color: #FFFFFF;
  margin-bottom: 18px;
}

.footer-area .footer-widget .footer-social a i {
  color: #fff;
  font-size: 16px;
  margin-right: 10px;
  -webkit-transition: .5s;
  transition: .5s;
}

.footer-area .footer-widget .footer-social a i:hover {
  color: #FFFFFF;
}

.footer-area .footer-widget h3 {
  color: #FFFFFF;
  font-size: 20px;
  font-weight: 600;
  margin-bottom: 40px;
  display: inline-block;
  position: relative;
  padding-bottom: 5px;
}

.footer-area .footer-widget h3::before {
  position: absolute;
  content: '';
  background: #626a5b;
  width: 100%;
  height: 2px;
  bottom: -2px;
  left: 0;
}

.footer-area .footer-widget ul {
  padding-left: 0;
  line-height: 1;
  margin-bottom: 0;
}

ul.about-points li {
  color: aliceblue;
}

ul.about-points li:hover {
  color: #fe6317;
}

.footer-area .footer-widget ul li {
  display: block;
  margin-bottom: 20px;
  -webkit-transition: .5s;
  transition: .5s;
  color: #FFFFFF;
  display: flex;
}

.footer-area .footer-widget ul li a {
  color: #FFFFFF;
  -webkit-transition: .5s;
  transition: .5s;
}

.footer-area .footer-widget ul li a:hover {
  color: #5156f7;
  margin-left: 2px;
}

.footer-area .footer-widget ul li a:hover i {
  color: #5156f7;
}

.footer-area .footer-widget ul li a i {
  font-size: 12px;
  top: -1px;
  position: relative;
}

.footer-area .footer-widget ul li i {
  font-size: 12px;
  -webkit-transition: .5s;
  transition: .5s;
}

.footer-area .footer-widget ul :last-child {
  margin-bottom: 0;
}

.footer-area .pl-75 {
  padding-left: 48px;
}

.footer-area .copyright-area {
  border-top: 1px solid #4a6871;
  padding: 20px 0;
  margin-top: 40px;
}

.footer-area .copyright-area p {
  color: #FFFFFF;
  margin-bottom: 0;
}

.footer-area .copyright-area p a {
  color: #FFFFFF;
}

.footer-area .copyright-area p a:hover {
  color: #0d3642;
}

li.address {
  line-height: 30px;
}

.footer-area .copyright-area .lh-1 {
  line-height: 1;
}

.footer-area .copyright-area ul {
  margin-bottom: 0;
}

.footer-area .copyright-area ul li {
  display: inline-block;
  margin-left: 20px;
  position: relative;
}

.footer-area .copyright-area ul li::before {
  position: absolute;
  content: '';
  background: #FFFFFF;
  width: 5px;
  height: 5px;
  border-radius: 10px;
  right: -15px;
  top: 6px;
}

.footer-area .copyright-area ul li a {
  color: #FFFFFF;
}

.footer-area .copyright-area ul li a:hover {
  color: #0d3642;
}

.footer-area .copyright-area ul :nth-child(2)::before {
  display: none;
}

/* Footer Section CSS End */
/** -------------- Home Page One CSS End --------------**/
/** -------------- Home Page Two CSS Start --------------**/
/* Header CSS Start */
.header-style-two {
  background: #071d24;
}

.header-style-two .header-left-text ul li {
  color: #95999a;
}

.header-style-two .header-left-text ul li a {
  color: #95999a;
}

p.need-for-counselling {
  margin-top: 20px;
}


/* Header CSS End */
/* Navbar CSS Start */
.navbar-style-two .main-nav {
  background: #0d1528;
  border-bottom: 2px solid #fff9e6;
}

.navbar-style-two .main-nav .navbar .navbar-nav .nav-item .nav-link {
  color: #9d9eaa;
}

.navbar-style-two .main-nav .navbar .navbar-nav .nav-item .nav-link:hover {
  color: #1c7df8;
}

.navbar-style-two .main-nav .navbar .navbar-nav .nav-item .dropdown-menu {
  background: #1c7df8;
  -webkit-box-shadow: 3px -5px 12px rgba(0, 0, 0, 0.5);
  box-shadow: 3px -5px 12px rgba(0, 0, 0, 0.5);
}

.navbar-style-two .main-nav .navbar .navbar-nav .nav-item .dropdown-menu .nav-item .nav-link {
  color: #9d9eaa;
}

.navbar-style-two .main-nav .navbar .navbar-nav .nav-item .dropdown-menu .nav-item .nav-link:hover {
  color: #0d3642;
}

/* Navbar CSS End */
/* Banner CSS Start */
.banner-style-two {
  background: #0d3642;
}

.banner-style-two .banner-text h1 {
  color: #FFFFFF;
}

.banner-style-two .banner-text p {
  color: #FFFFFF;
}

.banner-style-two .banner-text .default-btn::before {
  background: transparent;
  border: 1px solid #5156f7;
}

.banner-style-two .banner-text .video-btn {
  color: #5156f7 !important;
}

.banner-style-two .banner-text .video-btn:hover {
  color: #FFFFFF !important;
}

.banner-style-two .banner-text .video-btn:hover i {
  background: #FFFFFF;
}

.banner-style-two .banner-image img {
  width: 100%;
}

.banner-image img {
  border-radius: 20px 20px 0px 70px;
}

/* Banner CSS End */
/* About CSS Start */
.about-style-two {
  padding: 50px 0;
  position: relative;
}

.about-style-two .about-image {
  background-image: url(../img/about/4.jpg);
  background-position: center center;
  background-size: cover;
  height: 100%;
  width: 50%;
  position: absolute;
  top: 0;
  left: 0;
}

.about-style-two .about-text {
  background: #0d3642;
  padding: 70px 80px;
  position: relative;
}

.about-style-two .about-text p {
  color: #FFFFFF;
}

.about-style-two .about-text .section-title span {
  color: #886a03;
}

.about-style-two .about-text .section-title h2 {
  color: #FFFFFF;
}

.about-style-two .about-text .about-us i,
.about-style-two .about-text .about-us p {
  color: #FFFFFF;
}

/* About CSS End */
/* Video CSS Start */
.video-style-two {
  background-image: url(../img/video-bg.jpg);
  background-position: center center;
  background-size: cover;
  position: relative;
  height: 100%;
  padding-top: 200px;
  padding-bottom: 200px;
  z-index: 0;
}

.video-style-two::before {
  position: absolute;
  content: '';
  background: #464544;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  opacity: .45;
  z-index: -1;
}

.video-style-two .video-text a {
  margin-bottom: 38px;
  display: inline-block;
}

.video-style-two .video-text a i {
  color: #FFFFFF;
  background: #fe6417;
  width: 80px;
  height: 80px;
  text-align: center;
  line-height: 85px;
  display: inline-block;
  font-size: 20px;
  position: relative;
  z-index: 0;
  border-radius: 55% 45% 38% 62% / 52% 57% 43% 48%;
}

.video-style-two .video-text a i::after {
  position: absolute;
  content: '';
  background: rgba(255, 101, 80, 0.5);
  width: 100px;
  height: 100px;
  top: -10px;
  left: -10px;
  z-index: -1;
  border-radius: 55% 45% 38% 62% / 52% 57% 43% 48%;
  -webkit-animation: wrep 5s infinite ease-in-out;
  animation: wrep 5s infinite ease-in-out;
}

.video-style-two .video-text p {
  color: #FFFFFF;
  margin-bottom: 0;
  font-size: 20px;
  font-weight: 500;
  text-transform: capitalize;
  line-height: 1;
}

/* Video CSS End */
/* Service CSS Start */
.service-style-two .service-img {
  width: 50%;
}

.service-style-two .service-text {
  margin-top: 0;
  margin-bottom: 0;
}

/* Service CSS End */
/* Progress CSS Start */
.progress-style-two .progress-image {
  width: 50%;
  right: 0;
  left: inherit;
  background-image: url(../img/testimonial-img.jpg);
}

.progress-style-two .progress-text {
  margin-top: 0;
  margin-bottom: 0;
}

/* Progress CSS End */
/* Price CSS Start */
.pricing-section .pricing-card {
  padding: 45px;
  -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);
  position: relative;
  margin-bottom: 30px;
  background: #FFFFFF;
}


.pricing-section .pricing-card .price-header {
  position: relative;
  margin-bottom: 100px;
}

.pricing-section .pricing-card .price-header h2 {
  color: #FFFFFF;
  font-size: 14px;
  font-weight: 700;
  margin-bottom: 5px;
  line-height: 1;
}

.pricing-section .pricing-card .price-header h3 {
  color: #FFFFFF;
  font-size: 32px;
  font-weight: 700;
}

.pricing-section .pricing-card .price-header h3 sup {
  font-size: 15px;
  font-weight: 400;
  top: -14px;
  position: relative;
}

.pricing-section .pricing-card .price-header h3 span {
  font-size: 15px;
  font-weight: 400;
}

.pricing-section .pricing-card .price-header i {
  left: 0;
  right: 0;
  top: 50px;
  z-index: 0;
  margin: auto;
  width: 100px;
  height: 100px;
  color: #2C3E50;
  font-size: 60px;
  line-height: 90px;
  position: absolute;
  border-radius: 50px;
  display: inline-block;
  background: #FFFFFF;
  border: 5px solid #2C3E50;
  -webkit-box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.15);
  box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.15);
}

.pricing-section .pricing-card .pricing-feature {
  padding: 75px 0px 40px;
}

.pricing-section .pricing-card .pricing-feature ul {
  padding-left: 0;
  margin-bottom: 0;
}

.pricing-section .pricing-card .pricing-feature ul li {
  color: #808291;
  font-size: 15px;
  margin-bottom: 5px;
  list-style: none;
}

.pricing-feature ul li i {
  color: #E67E22;
  margin-right: 10px;
}

.pricing-section .pricing-card .pricing-feature ul :last-child {
  margin-bottom: 0;
}

.pricing-section .pricing-card.price-card-two i {
  z-index: 1;
}

.pricing-section .pricing-card.price-card-two::before {
  height: 250px;
  -webkit-clip-path: polygon(0 0, 100% 0, 100% 70%, 0 70%);
  clip-path: polygon(0 0, 100% 0, 100% 70%, 0 70%);
}

.pricing-section .pricing-card.price-card-two::after {
  position: absolute;
  content: '';
  width: 50px;
  top: 150px;
  left: 0;
  right: 0;
  margin: auto;
  border-left: 90px solid transparent;
  border-right: 90px solid transparent;
  border-top: 100px solid #fe6714;
  z-index: 0;
}

.pricing-section .pricing-card.price-card-three::before {
  -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 65%);
  clip-path: polygon(0 0, 100% 0, 100% 88%, 0% 60%);
}

.pricing-section .pricing-card .pricing-feature ul li i {
  color: #5156f7;
  margin-right: 10px;
}

/* Price CSS End */
/**-------------- Home Page Two CSS End --------------**/
/**-------------- About Page CSS Start --------------**/
/* About Title CSS Start */
.about-title {
  height: 350px;
  background: linear-gradient(135deg, #020202 0%, #0f0f0f 40%, #c9a227 100%);;
}

.about-title .title-text h2 {
  color: #FFFFFF;
  font-size: 38px;
  font-weight: 700;
  margin-bottom: 10px;
}

.about-title .title-text ul {
  padding-left: 0;
  margin-bottom: 0;
}

.about-title .title-text ul li {
  font-size: 18px;
  color: #FFFFFF;
  display: inline-block;
  position: relative;
  margin: 0 10px;
}

.about-title .title-text ul li::before {
  position: absolute;
  content: '';
  width: 5px;
  height: 5px;
  background: #FFFFFF;
  top: 15px;
  right: -15px;
  border-radius: 10px;
}

.about-title .title-text ul li a {
  color: #FFFFFF;
}

.about-title .title-text ul li a:hover {
  color: #0d3642;
}

.about-title .title-text ul li i {
  font-size: 14px;
}

.about-title .title-text ul li:last-child::before {
  display: none;
}

/* About Title CSS End */
/* Theory CSS Start */
.theory-style-two {
  margin-top: 75px;
  margin-bottom: -130px;
  z-index: 1;
  position: relative;
}

.theory-style-two .theory-area {
  -webkit-box-shadow: 0px 2px 20px 0px rgba(12, 0, 46, 0.14);
  box-shadow: 0px 2px 20px 0px rgba(12, 0, 46, 0.14);
}

.theory-style-two .theory-area .theory-img {
  bottom: 0;
}

/* Theory CSS End */
/* Video CSS Start */
.video-style-three {
  padding-top: 340px;
}

/* Video CSS End */
/**-------------- About Page CSS End --------------**/
/**-------------- Portfolio Page CSS Start --------------**/
.portfolio-title {
  height: 400px;
  background: #0d3642;
}

.portfolio-title .title-text h2 {
  color: #FFFFFF;
  font-size: 38px;
  font-weight: 700;
  margin-bottom: 10px;
}

.portfolio-title .title-text ul {
  padding-left: 0;
  margin-bottom: 0;
}

.portfolio-title .title-text ul li {
  font-size: 18px;
  color: #FFFFFF;
  display: inline-block;
  position: relative;
  margin: 0 10px;
}

.portfolio-title .title-text ul li::before {
  position: absolute;
  content: '';
  width: 5px;
  height: 5px;
  background: #FFFFFF;
  top: 15px;
  right: -15px;
  border-radius: 10px;
}

.portfolio-title .title-text ul li a {
  color: #FFFFFF;
}

.portfolio-title .title-text ul li a:hover {
  color: #0d3642;
}

.portfolio-title .title-text ul li i {
  font-size: 14px;
}

.portfolio-title .title-text ul li:last-child::before {
  display: none;
}

/**-------------- Portfolio Page CSS End --------------**/
/**-------------- Blog Page CSS Start --------------**/
.blog-title {
  height: 400px;
  background: #0d3642;
}

.blog-title .title-text h2 {
  color: #FFFFFF;
  font-size: 38px;
  font-weight: 700;
  margin-bottom: 10px;
}

.blog-title .title-text ul {
  padding-left: 0;
  margin-bottom: 0;
}

.blog-title .title-text ul li {
  font-size: 18px;
  color: #FFFFFF;
  display: inline-block;
  position: relative;
  margin: 0 10px;
}

.blog-title .title-text ul li::before {
  position: absolute;
  content: '';
  width: 5px;
  height: 5px;
  background: #FFFFFF;
  top: 15px;
  right: -15px;
  border-radius: 10px;
}

.blog-title .title-text ul li a {
  color: #FFFFFF;
}

.blog-title .title-text ul li a:hover {
  color: #0d3642;
}

.blog-title .title-text ul li i {
  font-size: 14px;
}

.blog-title .title-text ul li:last-child::before {
  display: none;
}

/**-------------- Blog Page CSS End --------------**/
/**-------------- Blog Details Page CSS Start --------------**/
.blog-details-area .blog-description .article-image {
  margin-bottom: 35px;
  position: relative;
}

.blog-details-area .blog-description .article-image .blog-date {
  position: absolute;
  background: #0d3642;
  width: 55px;
  text-align: center;
  top: 25px;
  left: 25px;
  padding: 6px;
}

.blog-details-area .blog-description .article-image .blog-date span {
  color: #FFFFFF;
  display: inline-block;
  line-height: 25px;
}

.blog-details-area .blog-description .article-info {
  margin-bottom: 25px;
  position: relative;
}

.blog-details-area .blog-description .article-info ul {
  margin: 0;
  padding-left: 0;
}

.blog-details-area .blog-description .article-info ul li {
  font-size: 14px;
  color: #ff7b01;
  display: inline-block;
  margin-right: 5px;
  font-weight: 700;
}

.blog-details-area .blog-description .article-info ul li i {
  margin-right: 5px;
}

.blog-details-area .blog-description .article-title {
  font-size: 32px;
  color: #111111;
  font-weight: 600;
  margin-bottom: 25px;
}

.blog-details-area .blog-description p {
  font-family: 'Calibri';
  margin-bottom: 10px;
}

.blog-details-area .blog-description .article-bottom-img {
  margin-bottom: 20px;
  margin-top: 10px;
  width: 100%;
}

.blog-details-area .blog-description .article-meta {
  position: relative;
  padding-top: 15px;
  margin-bottom: 30px;
}

.blog-details-area .blog-description .article-meta::before {
  position: absolute;
  content: '';
  background: #ebebeb;
  width: 50%;
  height: 1px;
  top: 0;
  left: 0;
  right: 0;
  margin: auto;
}

.blog-details-area .blog-description .article-meta ul {
  padding-left: 0;
  margin-bottom: 0;
}

.blog-details-area .blog-description .article-meta ul li {
  display: inline-block;
  font-size: 14px;
  margin-right: 15px;
  color: #808291;
}

.blog-details-area .blog-description .article-meta ul li i {
  margin-right: 5px;
}

.blog-details-area .blog-description .blog-nav {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-bottom: 40px;
  background: #ddd;
  padding: 20px;
  margin-top: 20px;
  border-radius: 5px;
}

.blog-details-area .blog-description .blog-nav .prev-btn,
.blog-details-area .blog-description .blog-nav .next-btn {
  width: 50%;
}

.blog-details-area .blog-description .blog-nav .prev-btn a,
.blog-details-area .blog-description .blog-nav .next-btn a {
  color: #3f3f3f;
  border: 1px solid #0d3642;
  border-radius: 5px;
  padding: 8px 20px;
  font-family: 'Calibri';
  display: inline-block;
  background: #FFFFFF;
}

.blog-details-area .blog-description .blog-nav .prev-btn a:hover,
.blog-details-area .blog-description .blog-nav .next-btn a:hover {
  background: #0d3642;
  color: #FFFFFF;
}

.blog-details-area .blog-description .blog-comment {
  -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);
  padding: 30px;
  margin-bottom: 30px;
  border-radius: 5px;
}

.blog-details-area .blog-description .blog-comment h3 {
  font-size: 22px;
  font-weight: 600;
  color: #333333;
  margin-bottom: 25px;
}

.blog-details-area .blog-description .blog-comment .form-control {
  height: 60px;
  padding-left: 20px;
  border: 1px solid #0d3642;
  width: 100%;
  border-radius: 0;
  background: #fcf6f6;
  margin-bottom: 30px;
  border-radius: 5px;
}

.blog-details-area .blog-description .blog-comment .message-field {
  padding-top: 20px;
  padding-left: 20px;
  border: 1px solid #0d3642;
  width: 100%;
  background: #fcf6f6;
  border-radius: 5px;
}

.blog-details-area .blog-description .blog-comment .message-field:focus {
  outline: 0;
}

.blog-details-area .blog-description .blog-comment ::-webkit-input-placeholder {
  font-size: 14px;
  color: #a07373;
  font-family: 'Calibri';
}

.blog-details-area .blog-description .blog-comment :-ms-input-placeholder {
  font-size: 14px;
  color: #a07373;
  font-family: 'Calibri';
}

.blog-details-area .blog-description .blog-comment ::-ms-input-placeholder {
  font-size: 14px;
  color: #a07373;
  font-family: 'Calibri';
}

.blog-details-area .blog-description .blog-comment ::placeholder {
  font-size: 14px;
  color: #a07373;
  font-family: 'Calibri';
}

.blog-details-area .blog-description .blog-comment .default-btn {
  font-size: 16px;
  font-family: 'Calibri';
  font-weight: 600;
  background: #5156f7;
  color: #FFFFFF;
  padding: 15px 40px;
  margin-top: 10px;
  border: 1px solid transparent;
  -webkit-transition: .5s;
  transition: .5s;
}

.blog-details-area .blog-description .blog-comment .default-btn:hover {
  background: #FFFFFF;
  border: 1px dashed #2C3E50;
  color: #2C3E50;
}

.blog-details-area .blog-search {
  -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);
  padding: 20px;
  margin-bottom: 30px;
}

.blog-details-area .blog-search form {
  position: relative;
}

.blog-details-area .blog-search form input {
  border: 1px solid #fe6a12;
  padding: 10px 20px;
  width: 100%;
}

.blog-details-area .blog-search form input:focus {
  outline: 0;
}

.blog-details-area .blog-search form ::-webkit-input-placeholder {
  font-size: 16px;
  font-family: 'Calibri';
  color: #333333;
}

.blog-details-area .blog-search form :-ms-input-placeholder {
  font-size: 16px;
  font-family: 'Calibri';
  color: #333333;
}

.blog-details-area .blog-search form ::-ms-input-placeholder {
  font-size: 16px;
  font-family: 'Calibri';
  color: #333333;
}

.blog-details-area .blog-search form ::placeholder {
  font-size: 16px;
  font-family: 'Calibri';
  color: #333333;
}

.blog-details-area .blog-search form button {
  position: absolute;
  background: #fe6318;
  text-align: center;
  right: 0;
  top: 0;
  width: 50px;
  height: 100%;
  font-size: 18px;
  -webkit-transition: .5S;
  transition: .5S;
}

.blog-details-area .blog-search form button:hover {
  background: #333333;
}

.blog-details-area .blog-search form button i {
  color: #FFFFFF;
}

.blog-details-area .recent-blog {
  padding: 20px;
  -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);
  margin-bottom: 30px;
}

.blog-details-area .recent-blog h3 {
  font-weight: 600;
  margin-bottom: 20px;
}

.blog-details-area .recent-blog .recent-post {
  position: relative;
  margin-bottom: 20px;
  border-bottom: 1px dashed #dddddd;
  padding-bottom: 20px;
}

.blog-details-area .recent-blog .recent-post img {
  position: absolute;
  top: 0;
  left: 0;
  width: 90px;
  height: 90px;
  border-radius: 5px;
}

.blog-details-area .recent-blog .recent-post h3 {
  margin-bottom: 0;
}

.blog-details-area .recent-blog .recent-post h3 a {
  color: #333333;
  font-size: 14px;
  padding-left: 110px;
  margin-bottom: 10px;
  padding-top: 8px;
  display: inline-block;
  line-height: 18px;
}

.blog-details-area .recent-blog .recent-post h3 a:hover {
  color: #ff7209;
}

.blog-details-area .recent-blog .recent-post ul {
  padding-left: 110px;
  margin-bottom: 0;
}

.blog-details-area .recent-blog .recent-post ul li {
  display: inline-block;
  color: #ff7209;
  font-size: 14px;
  font-family: 'Calibri';
  margin-right: 10px;
}

.blog-details-area .recent-blog .recent-post ul li i {
  font-size: 14p;
}

.blog-details-area .recent-blog .recent-post:last-child {
  border-bottom: 0;
  padding-bottom: 0;
  margin-bottom: 0;
}

.blog-details-area .blog-category {
  padding: 20px;
  -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);
  margin-bottom: 30px;
}

.blog-details-area .blog-category h3 {
  font-weight: 600;
  margin-bottom: 20px;
}

.blog-details-area .blog-category ul {
  padding-left: 0;
  margin-bottom: 0;
}

.blog-details-area .blog-category ul li {
  line-height: 1;
  list-style: none;
}

.blog-details-area .blog-category ul li a {
  padding: 15px 20px;
  display: block;
  border-left: 2px solid #ff7209;
  position: relative;
  border-bottom: 1px dashed #dddddd;
  font-size: 18px;
  font-weight: 600;
  color: #333333;
  margin-bottom: 5px;
}

.blog-details-area .blog-category ul li a i {
  position: absolute;
  top: 12px;
  right: 0px;
  font-size: 25px;
}

.blog-details-area .blog-category ul li a:hover {
  background: #0d3642;
  color: #FFFFFF;
}

.blog-details-area .photo-gallery {
  -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);
  margin-bottom: 30px;
}

.blog-details-area .photo-gallery h3 {
  font-weight: 600;
  margin-bottom: 20px;
  padding-left: 20px;
  padding-top: 20px;
}

.blog-details-area .photo-gallery a img {
  padding-left: 20px;
  margin-bottom: 20px;
  max-width: 95px;
}

.blog-details-area .tags {
  padding: 20px;
  -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);
  margin-bottom: 30px;
}

.blog-details-area .tags h3 {
  font-weight: 600;
  margin-bottom: 20px;
}

.blog-details-area .tags a {
  background: #e5e5e5;
  color: #333333;
  padding: 8px 16px;
  margin-bottom: 15px;
  display: inline-block;
  font-family: 'Calibri';
  border-radius: 10px;
  border: 1px dashed #333333;
  width: 100px;
  text-align: center;
}

.blog-details-area .tags a:hover {
  background: #0d3642;
  color: #FFFFFF;
}

/**-------------- Blog Details Page CSS End --------------**/
/**-------------- Contact Page CSS Start --------------**/
/* Contact Title Start */
.contact-title {
  background: linear-gradient(135deg, #000000, #1a1a1a, #d4af37);
  padding-top: 100px;
  padding-bottom: 140px;
}

.contact-title .title-text h2 {
  color: #FFFFFF;
  font-size: 38px;
  font-weight: 700;
  margin-bottom: 10px;
}

.contact-title .title-text ul {
  padding-left: 0;
  margin-bottom: 0;
}

.contact-title .title-text ul li {
  font-size: 18px;
  color: #FFFFFF;
  display: inline-block;
  position: relative;
  margin: 0 10px;
}

.contact-title .title-text ul li::before {
  position: absolute;
  content: '';
  width: 5px;
  height: 5px;
  background: #FFFFFF;
  top: 15px;
  right: -15px;
  border-radius: 10px;
}

.contact-title .title-text ul li a {
  color: #FFFFFF;
}

.contact-title .title-text ul li a:hover {
  color: #0d3642;
}

.contact-title .title-text ul li i {
  font-size: 14px;
}

.contact-title .title-text ul li:last-child::before {
  display: none;
}

/* Contact Title Start */
/* Contact Section Start */
.contact-area .contact-box {
  margin-top: -100px;
  background: linear-gradient(135deg, #020617 0%, #0f172a 40%, #020617 100%);
  padding: 60px 45px;
  -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);
}

.contact-area .contact-box .contact-card {
  border: 1px solid #b69732;
  position: relative;
  padding: 20px;
  height: 115px;
}

.contact-area .contact-box .contact-card i {
  width: 50px;
  height: 50px;
  border-radius: 50px;
  border: 1px solid #1c7df8;
  display: inline-block;
  color: #1c7df8;
  text-align: center;
  line-height: 50px;
  font-size: 20px;
  position: absolute;
  top: 37px;
  left: 25px;
}

.contact-area .contact-box .contact-card h3 {
  padding-left: 80px;
  font-weight: 700;
  color: #1c7df8;
}

.contact-area .contact-box .contact-card ul {
  padding-left: 0;
  margin-bottom: 0;
  padding-left: 80px;
}

.contact-area .contact-box .contact-card ul li {
  color: #1c7df8;
  font-size: 14px;
  list-style: none;
}

div#contact-form {
    background: linear-gradient(135deg, #020617 0%, #0f172a 40%, #020617 100%);
}

.contact-area {
    background: linear-gradient(135deg, #020617 0%, #0f172a 40%, #020617 100%);
}

.map {
  line-height: 1;
  height: 500px;
  margin-bottom: -120px;
}

.map iframe {
  width: 100%;
  height: 500px;
  border: 0;
}

/* Contact Section End */
/* Footer Area Start */
.footer-style-three {
  -webkit-clip-path: none;
  clip-path: none;
}

/* Footer Area End */
/**-------------- Contact Page CSS End --------------**/
/**-------------- Service Page CSS Start --------------**/
.service-title {
  height: 400px;
  background: #0d3642;
}

.service-title .title-text h2 {
  color: #FFFFFF;
  font-size: 38px;
  font-weight: 700;
  margin-bottom: 10px;
}

.service-title .title-text ul {
  padding-left: 0;
  margin-bottom: 0;
}

.service-title .title-text ul li {
  font-size: 18px;
  color: #FFFFFF;
  display: inline-block;
  position: relative;
  margin: 0 10px;
}

.service-title .title-text ul li::before {
  position: absolute;
  content: '';
  width: 5px;
  height: 5px;
  background: #FFFFFF;
  top: 15px;
  right: -15px;
  border-radius: 10px;
}

.service-title .title-text ul li a {
  color: #FFFFFF;
}

.service-title .title-text ul li a:hover {
  color: #0d3642;
}

.service-title .title-text ul li i {
  font-size: 14px;
}

.service-title .title-text ul li:last-child::before {
  display: none;
}

.service-style-three .service-card {
  text-align: center;
  -webkit-box-shadow: 0px 2px 20px 0px rgba(12, 0, 46, 0.1);
  box-shadow: 0px 2px 20px 0px rgba(12, 0, 46, 0.1);
  padding: 30px 20px;
  margin-bottom: 30px;
  -webkit-transition: .5s;
  transition: .5s;
  position: relative;
  border-bottom: 2px solid #717477;
}

.service-style-three .service-card:hover {
  margin-top: -10px;
}

.service-style-three .service-card:hover i {
  -webkit-animation: none;
  animation: none;
  border: 1px dashed #0d3642;
  color: #0d3642;
}

.service-style-three .service-card i {
  font-size: 35px;
  width: 90px;
  height: 90px;
  display: inline-block;
  text-align: center;
  line-height: 90px;
  border-radius: 46% 54% 68% 32% / 55% 48% 52% 45%;
  margin-bottom: 25px;
  -webkit-animation: icon-animation 5s ease-in-out infinite;
  animation: icon-animation 5s ease-in-out infinite;
  border: 1px dashed;
  -webkit-transition: .5s;
  transition: .5s;
}

.service-style-three .service-card h3 {
  font-weight: 600;
  margin-bottom: 10px;
}

.service-style-three .service-card p {
  margin-bottom: 0;
  font-size: 16px;
  color: #0f2137;
}

/**-------------- Serice Page CSS End --------------**/
/**-------------- Portfolio Page Two CSS Start --------------**/
.portfolio-style-two .portfolio-menu {
  margin-bottom: 50px;
}

.portfolio-style-two .portfolio-menu ul li {
  cursor: pointer;
  padding: 10px 20px;
  list-style-type: none;
  display: inline-block;
  border: 1px solid #0d3642;
  -webkit-transition: .5s;
  transition: .5s;
}

.portfolio-style-two .portfolio-menu ul li:hover {
  background: #0d3642;
  color: #FFFFFF;
}

.portfolio-style-two .portfolio-menu ul .active {
  color: #FFFFFF;
  background: #0d3642;
}

#Container .mix {
  display: none;
}

/**-------------- Portfolio Page Two CSS End --------------**/
/**-------------- Pricing Page CSS Start --------------**/
.pricing-title {
  height: 300px;
  background:  linear-gradient(135deg, #000000, #1a1a1a, #d4af37);;
}

.pricing-title .title-text h2 {
  color: #FFFFFF;
  font-size: 38px;
  font-weight: 700;
  margin-bottom: 10px;
}

.pricing-title .title-text ul {
  padding-left: 0;
  margin-bottom: 0;
}

.pricing-title .title-text ul li {
  font-size: 18px;
  color: #FFFFFF;
  display: inline-block;
  position: relative;
  margin: 0 10px;
}

.pricing-title .title-text ul li::before {
  position: absolute;
  content: '';
  width: 5px;
  height: 5px;
  background: #FFFFFF;
  top: 15px;
  right: -15px;
  border-radius: 10px;
}

.pricing-title .title-text ul li a {
  color: #FFFFFF;
}

.pricing-title .title-text ul li a:hover {
  color: #0d3642;
}

.pricing-title .title-text ul li i {
  font-size: 14px;
}

.pricing-title .title-text ul li:last-child::before {
  display: none;
}

/**-------------- Pricing Page CSS End --------------**/
/**-------------- 404 Page CSS Start --------------**/
.error-title {
  height: 400px;
  background: #0d3642;
}

.error-title .title-text h2 {
  color: #FFFFFF;
  font-size: 38px;
  font-weight: 700;
  margin-bottom: 10px;
}

.error-title .title-text ul {
  padding-left: 0;
  margin-bottom: 0;
}

.error-title .title-text ul li {
  font-size: 18px;
  color: #FFFFFF;
  display: inline-block;
  position: relative;
  margin: 0 10px;
}

.error-title .title-text ul li::before {
  position: absolute;
  content: '';
  width: 5px;
  height: 5px;
  background: #FFFFFF;
  top: 15px;
  right: -15px;
  border-radius: 10px;
}

.error-title .title-text ul li a {
  color: #FFFFFF;
}

.error-title .title-text ul li a:hover {
  color: #0d3642;
}

.error-title .title-text ul li i {
  font-size: 14px;
}

.error-title .title-text ul li:last-child::before {
  display: none;
}

.error-section .error-img {
  margin-bottom: 50px;
}

.error-section .error-img img {
  width: 100%;
}

/**-------------- 404 Page CSS End --------------**/
/**-------------- Team Page CSS Start --------------**/
.team-title {
  height: 400px;
  background: #0d3642;
}

.team-title .title-text h2 {
  color: #FFFFFF;
  font-size: 38px;
  font-weight: 700;
  margin-bottom: 10px;
}

.team-title .title-text ul {
  padding-left: 0;
  margin-bottom: 0;
}

.team-title .title-text ul li {
  font-size: 18px;
  color: #FFFFFF;
  display: inline-block;
  position: relative;
  margin: 0 10px;
}

.team-title .title-text ul li::before {
  position: absolute;
  content: '';
  width: 5px;
  height: 5px;
  background: #FFFFFF;
  top: 15px;
  right: -15px;
  border-radius: 10px;
}

.team-title .title-text ul li a {
  color: #FFFFFF;
}

.team-title .title-text ul li a:hover {
  color: #0d3642;
}

.team-title .title-text ul li i {
  font-size: 14px;
}

.team-title .title-text ul li:last-child::before {
  display: none;
}

.footer-style-two {
  padding-top: 100px;
  -webkit-clip-path: none;
  clip-path: none;
}

/**-------------- Team Page CSS End --------------**/
/**-------------- Team Page Two CSS Start --------------**/
.team-style-two .team-card {
  margin-bottom: 30px;
}

.team-style-two .team-card .team-img {
  position: relative;
}

.team-style-two .team-card .team-img:hover .team-text {
  background: rgba(0, 0, 0, 0.5);
  -webkit-transform: scale(1);
  transform: scale(1);
}

.team-style-two .team-card .team-img img {
  width: 100%;
}

.team-style-two .team-card .team-text {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  right: 0;
  margin: auto;
  top: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.5);
  color: #FFFFFF;
  -webkit-transform: scale(0);
  transform: scale(0);
}

.team-style-two .team-card .team-text h3 {
  font-size: 25px;
  color: #FFFFFF;
}

.team-style-two .team-card .team-text:hover {
  background: rgba(0, 0, 0, 0.5);
}

/**-------------- Team Page Two CSS End --------------**/
/**-------------- Service Page Details CSS Start --------------**/
.service-style-four .service-details-area .service-details-img {
  margin-bottom: 40px;
}

.service-style-four .service-details-area .service-details-img img {
  width: 100%;
}

.service-style-four .service-details-area h3 {
  position: relative;
  padding-left: 0;
  margin-bottom: 15px;
  font-size: 30px;
}

.service-style-four .service-details-area p {
  margin-bottom: 15px;
}

.service-style-four .service-details-area .mb-35 {
  margin-bottom: 35px;
}

.service-style-four .service-details-area .service-btm-img {
  margin: 10px 0 20px;
}

.service-style-four .blog-search {
  -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);
  padding: 20px;
  margin-bottom: 30px;
}

.service-style-four .blog-search form {
  position: relative;
}

.service-style-four .blog-search form input {
  border: 1px solid #fe6a12;
  padding: 10px 20px;
  width: 100%;
}

.service-style-four .blog-search form input:focus {
  outline: 0;
}

.service-style-four .blog-search form ::-webkit-input-placeholder {
  font-size: 16px;
  font-family: 'Calibri';
  color: #333333;
}

.service-style-four .blog-search form :-ms-input-placeholder {
  font-size: 16px;
  font-family: 'Calibri';
  color: #333333;
}

.service-style-four .blog-search form ::-ms-input-placeholder {
  font-size: 16px;
  font-family: 'Calibri';
  color: #333333;
}

.service-style-four .blog-search form ::placeholder {
  font-size: 16px;
  font-family: 'Calibri';
  color: #333333;
}

.service-style-four .blog-search form button {
  position: absolute;
  background: #fe6318;
  text-align: center;
  right: 0;
  top: 0;
  width: 50px;
  height: 100%;
  font-size: 18px;
  -webkit-transition: .5S;
  transition: .5S;
}

.service-style-four .blog-search form button:hover {
  background: #333333;
}

.service-style-four .blog-search form button i {
  color: #FFFFFF;
}

.service-style-four .service-category {
  padding: 20px;
  -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);
  margin-bottom: 30px;
}

.service-style-four .service-category h3 {
  font-weight: 600;
  margin-bottom: 20px;
}

.service-style-four .service-category ul {
  padding-left: 0;
  margin-bottom: 0;
}

.service-style-four .service-category ul li {
  line-height: 1;
  list-style: none;
}

.service-style-four .service-category ul li a {
  padding: 15px 20px;
  display: block;
  border-left: 2px solid #ff7209;
  position: relative;
  border-bottom: 1px dashed #dddddd;
  font-size: 18px;
  font-weight: 600;
  color: #333333;
  margin-bottom: 5px;
}

.service-style-four .service-category ul li a i {
  position: absolute;
  top: 12px;
  right: 0px;
  font-size: 25px;
}

.service-style-four .service-category ul li a:hover {
  background: #0d3642;
  color: #FFFFFF;
}

/**-------------- Service Page Details CSS End --------------**/
/**-------------- FAQ Page CSS Start --------------**/
.faq-title {
  height: 400px;
  background: #0d3642;
}

.faq-title .title-text h2 {
  color: #FFFFFF;
  font-size: 38px;
  font-weight: 700;
  margin-bottom: 10px;
}

.faq-title .title-text ul {
  padding-left: 0;
  margin-bottom: 0;
}

.faq-title .title-text ul li {
  font-size: 18px;
  color: #FFFFFF;
  display: inline-block;
  position: relative;
  margin: 0 10px;
}

.faq-title .title-text ul li::before {
  position: absolute;
  content: '';
  width: 5px;
  height: 5px;
  background: #FFFFFF;
  top: 15px;
  right: -15px;
  border-radius: 10px;
}

.faq-title .title-text ul li a {
  color: #FFFFFF;
}

.faq-title .title-text ul li a:hover {
  color: #0d3642;
}

.faq-title .title-text ul li i {
  font-size: 14px;
}

.faq-title .title-text ul li:last-child::before {
  display: none;
}

.faq-area h2 {
  /* margin-left: 20px; */
  padding-right: 20px;
  padding-bottom: 15px;
  margin-bottom: 50px;
  font-size: 28px;
  font-weight: 600;
  text-align: center;
  border-bottom: 2px dashed #886a03;
  color: #1c7df8;
}

.faq-area .topic {
  padding: 20px;
  padding-top: 0px;
  padding-bottom: 0px;
}

.faq-area .topic h3 {
  color: #1c7df8;
}

.faq-area .open {
  cursor: pointer;
  display: inline-block;
  padding: 0px;
  height: 60px;
}

.faq-area .open:hover {
  opacity: 0.7;
}

.faq-area .topic h3:hover {
  color: #1c7df8;
}

.faq-area .expanded {
  background-color: #f5f5f5;
  -webkit-transition: all .3s ease-in-out;
  transition: all .3s ease-in-out;
}

.faq-area .question {
  padding-top: 20px;
  padding-right: 40px;
  padding-bottom: 20px;
  font-size: 17px;
  font-weight: 500;
  color: #526ee4;
  padding-left: 40px;
}

.faq-area .answer {
  font-size: 16px;
  line-height: 26px;
  display: none;
  margin-bottom: 0;
  padding-left: 40px;
  padding-right: 20px;
  padding-bottom: 20px;
}

.faq-area .faq-t {
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
  display: inline-block;
  position: relative;
  top: -55px;
  left: 5px;
  width: 10px;
  height: 10px;
  background: transparent;
  border-left: 2px solid #1c7df8;
  border-bottom: 2px solid #1c7df8;
  -webkit-transition: all .3s ease-in-out;
  transition: all .3s ease-in-out;
}

.faq-area .faq-o {
  top: -50px;
  -webkit-transform: rotate(-224deg);
  transform: rotate(-224deg);
}

/**-------------- FAQ Page CSS End --------------**/
/**-------------- Privacy Page CSS Start --------------**/
.privacy-title {
  height: 300px;
  background: linear-gradient(135deg, #020202 0%, #0f0f0f 40%, #c9a227 100%);;
}

.privacy-title .title-text h2 {
  color: #FFFFFF;
  font-size: 38px;
  font-weight: 700;
  margin-bottom: 10px;
}

.privacy-title .title-text ul {
  padding-left: 0;
  margin-bottom: 0;
}

.privacy-title .title-text ul li {
  font-size: 18px;
  color: #FFFFFF;
  display: inline-block;
  position: relative;
  margin: 0 10px;
}

.privacy-title .title-text ul li::before {
  position: absolute;
  content: '';
  width: 5px;
  height: 5px;
  background: #FFFFFF;
  top: 15px;
  right: -15px;
  border-radius: 10px;
}

.privacy-title .title-text ul li a {
  color: #FFFFFF;
}

.privacy-title .title-text ul li a:hover {
  color: #0d3642;
}

.privacy-title .title-text ul li i {
  font-size: 14px;
}

.privacy-title .title-text ul li:last-child::before {
  display: none;
}

.privacy-section .privacy-text {
  margin-bottom: 15px;
}

.privacy-section .privacy-text h3 {
  font-size: 20px;
  font-family: 'Calibri';
  color: #0f2137;
  text-transform: capitalize;
  margin-bottom: 10px;
  display: inline-block;
}

.privacy-section .privacy-text p {
  margin-bottom: 0;
}

.privacy-section ul li {
  margin-top: 10px;
  list-style: circle;
  color: #111111;
}

/**-------------- Privacy Page CSS End --------------**/
/**-------------- Back to Top CSS Start --------------**/
/**-------------- Back to Top Page CSS End --------------**/
/**-------------- Pre Loader CSS Start --------------**/
.loader-content {
  background: #FFFFFF;
  height: 100%;
  width: 100%;
  position: fixed;
  z-index: 99999999;
  left: 0;
  top: 0;
  text-align: center;
}

.lds-ripple {
  display: inline-block;
  position: relative;
  width: 80px;
  height: 80px;
}

.lds-ripple div {
  position: absolute;
  border: 4px solid red;
  opacity: 1;
  border-radius: 50%;
  -webkit-animation: lds-ripple 1s cubic-bezier(0, 0.2, 0.8, 1) infinite;
  animation: lds-ripple 1s cubic-bezier(0, 0.2, 0.8, 1) infinite;
}

.lds-ripple div:nth-child(2) {
  -webkit-animation-delay: -0.5s;
  animation-delay: -0.5s;
}

@-webkit-keyframes lds-ripple {
  0% {
    top: 36px;
    left: 36px;
    width: 0;
    height: 0;
    opacity: 1;
  }

  100% {
    top: 0px;
    left: 0px;
    width: 72px;
    height: 72px;
    opacity: 0;
  }
}

@keyframes lds-ripple {
  0% {
    top: 36px;
    left: 36px;
    width: 0;
    height: 0;
    opacity: 1;
  }

  100% {
    top: 0px;
    left: 0px;
    width: 72px;
    height: 72px;
    opacity: 0;
  }
}

/**-------------- Pre Loader CSS End --------------**/
/* Magnific Popup */
.mfp-fade.mfp-bg {
  opacity: 0;
  -webkit-transition: all 0.15s ease-out;
  transition: all 0.15s ease-out;
}

.mfp-fade.mfp-bg.mfp-ready {
  opacity: 0.8;
}

.mfp-fade.mfp-bg.mfp-removing {
  opacity: 0;
}

.mfp-fade.mfp-wrap .mfp-content {
  opacity: 0;
  -webkit-transition: all 0.15s ease-out;
  transition: all 0.15s ease-out;
}

.mfp-fade.mfp-wrap.mfp-ready .mfp-content {
  opacity: 1;
}

.mfp-fade.mfp-wrap.mfp-removing .mfp-content {
  opacity: 0;
}

/* Animation CSS */
@-webkit-keyframes icon-animation {
  0% {
    border-radius: 46% 54% 68% 32% / 55% 48% 52% 45%;
  }

  50% {
    border-radius: 66% 34% 41% 59% / 51% 34% 66% 49%;
  }

  100% {
    border-radius: 46% 54% 68% 32% / 55% 48% 52% 45%;
  }
}

@keyframes icon-animation {
  0% {
    border-radius: 46% 54% 68% 32% / 55% 48% 52% 45%;
  }

  50% {
    border-radius: 66% 34% 41% 59% / 51% 34% 66% 49%;
  }

  100% {
    border-radius: 46% 54% 68% 32% / 55% 48% 52% 45%;
  }
}

@-webkit-keyframes wrep {
  0% {
    border-radius: 55% 45% 38% 62% / 52% 57% 43% 48%;
  }

  35% {
    border-radius: 67% 33% 39% 61% / 48% 63% 37% 52%;
  }

  70% {
    border-radius: 40% 60% 62% 38% / 32% 41% 59% 68%;
  }

  100% {
    border-radius: 55% 45% 38% 62% / 52% 57% 43% 48%;
  }
}

@keyframes wrep {
  0% {
    border-radius: 55% 45% 38% 62% / 52% 57% 43% 48%;
  }

  35% {
    border-radius: 67% 33% 39% 61% / 48% 63% 37% 52%;
  }

  70% {
    border-radius: 40% 60% 62% 38% / 32% 41% 59% 68%;
  }

  100% {
    border-radius: 55% 45% 38% 62% / 52% 57% 43% 48%;
  }
}

@-webkit-keyframes translatex {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }

  50% {
    -webkit-transform: translateX(20px);
    transform: translateX(20px);
  }

  10% {
    -webkit-transform: translateX(0px);
    transform: translateX(0px);
  }
}

@keyframes translatex {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }

  50% {
    -webkit-transform: translateX(20px);
    transform: translateX(20px);
  }

  10% {
    -webkit-transform: translateX(0px);
    transform: translateX(0px);
  }
}

@-webkit-keyframes translatey {
  0% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }

  50% {
    -webkit-transform: translateY(-15px);
    transform: translateY(-15px);
  }

  10% {
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
  }
}

@keyframes translatey {
  0% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }

  50% {
    -webkit-transform: translateY(-15px);
    transform: translateY(-15px);
  }

  10% {
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
  }
}

/* play button animation */
@-webkit-keyframes pulse {
  from {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-filter: opacity(0.9);
    filter: opacity(0.9);
  }

  to {
    -webkit-transform: scale(2);
    transform: scale(2);
    -webkit-filter: opacity(0);
    filter: opacity(0);
  }
}

@keyframes pulse {
  from {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-filter: opacity(0.9);
    filter: opacity(0.9);
  }

  to {
    -webkit-transform: scale(2);
    transform: scale(2);
    -webkit-filter: opacity(0);
    filter: opacity(0);
  }
}

img.gplus-icon {
  width: 24px;
  margin-left: -3px;
  /* margin-right: 0px; */
  margin-top: 0px;
}

.about img {
  border-radius: 10px;
}

p.service-form a {
  color: #fff;
}

p.service-form a:hover {
  color: #34495E;
}

a.navbar-brand img {
  width: 145px;
}

.footer-social a img {
  width: 20px;
}

.header-social li a img {
  width: 34px;
}

.price-tag {
  position: relative;
  display: inline-flex;
  flex-direction: column;
  height: 20px;
  margin-left: 10px; /* 20px / 2 */
  padding: 0 5px 0 10px;
  color: #fff;
  border-radius: 0 4px 4px 0;
  background-color: #ff6347;
  line-height: 1;
  justify-content: center;
}

.price-tag::before,
.price-tag::after {
  position: absolute;
  content: '';
}

.price-tag::before {
  left: -7px; /* round(20px / 1.428) / 2 */
  width: 14px; /* round(20px / 1.428) */
  height: 14px; /* round(20px / 1.428) */
  transform: rotate(45deg);
  border-radius: 0 0 0 4px;
  background-color: #ff6347;
}

.price-tag::after {
  z-index: 1;
  top: 50%;
  left: -10px; /* 20px / 2 */
  width: 6px;
  height: 6px;
  transform: translate(-50%, -50%) translateX(10px);
  border-radius: 3px; /* 6px / 2 */
  background-color: #fff;
}

.price-tag__main {
  font-size: 1.15em;
  font-weight: bold;
}

.price-tag__main ~ * {
  opacity: 0.85;
}

.price-tag span {
  position: relative;
  z-index: 1;
}

.price-tag--two-lines {
  margin-left: 20px; /* 20px */
  height: 40px; /* 20px * 2 */
}

.price-tag--two-lines::before {
  left: -14px; /* round(20px / 1.428) * 2 / 2 */
  width: 28px; /* round(20px / 1.428) * 2 */
  height: 28px; /* round(20px / 1.428) * 2 */
}

.price-tag--two-lines::after {
  transform: translate(-50%, -50%) translateX(10px) scale(2);
}

.price-tag--one-line {
  flex-direction: row;
  align-items: center;
}

.price-tag--one-line span:not(:first-child)::before {
  content: ', ';
}

.newsletter-area p {
  color: #fff;
}

.mt-10 {
  margin-top: 10px;
}

ul.answer li img {
  max-width: 16px;
}

ul.answer li {
  list-style: none;
}

.about-text h2 {
  color: #34495E;
}

.about-text span {
  color: #2C3E50;
}

.blog-section .blog-card.tab-one {
  height: 210px;
  /* padding: 10px; */
}

.theory-img img {
  border-radius: 10px;
}
/*# sourceMappingURL=style.css.map */


/* what we offer latest css */

.services-section {
  background-color: #f9fafc;
  padding: 100px 0;
}

.section-title {
  font-size: 2.2rem;
  font-weight: 700;
  color: #301d44;
  margin-bottom: 10px;
}

.section-subtitle {
  color: #555;
  font-size: 1rem;
  max-width: 700px;
  margin: 0 auto 40px;
  line-height: 1.7;
}

.service-card {
  background: #fff;
  border-radius: 16px;
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.08);
  transition: all 0.4s ease;
  text-align: center;
  padding: 40px 25px;
  height: 100%;
  border-top: 4px solid transparent;
}

.service-card:hover {
  transform: translateY(-8px);
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.12);
  border-top: 4px solid #fba311;
}

.service-icon {
  background: linear-gradient(135deg, #886a03, #fba311);
  width: 80px;
  height: 80px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 20px;
  color: #fff;
  font-size: 32px;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
  transition: all 0.3s ease;
}

.service-card:hover .service-icon {
  transform: scale(1.1);
  box-shadow: 0 6px 18px rgba(251, 163, 17, 0.4);
}

.service-content h3 {
  font-size: 1.3rem;
  color: #886a03;
  font-weight: 600;
  margin-bottom: 12px;
}

.service-content p {
  color: #555;
  font-size: 0.95rem;
  line-height: 1.7;
}


/* why counselling latest css */
.timeline-section {
  background-color: #f9fafc;
  padding: 100px 0;
  overflow-x: hidden;
}

.section-title {
  font-size: 2.2rem;
  font-weight: 700;
  color: #301d44;
}

.section-subtitle {
  color: #555;
  font-size: 1rem;
  max-width: 700px;
  margin: 0 auto 50px;
  line-height: 1.7;
}

/* Timeline Container */
.timeline-container {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  position: relative;
  gap: 30px;
  flex-wrap: wrap;
}

/* Horizontal Line */
.timeline-container::before {
  content: "";
  position: absolute;
  top: 55px;
  left: 5%;
  right: 5%;
  height: 4px;
  background: linear-gradient(90deg, #886a03, #fba311);
  z-index: 1;
  border-radius: 4px;
}

/* Timeline Boxes */
.timeline-box {
  position: relative;
  width: 23%;
  min-width: 250px;
  text-align: center;
  z-index: 2;
}

.timeline-icon {
  width: 70px;
  height: 70px;
  border-radius: 50%;
  background: linear-gradient(135deg, #886a03, #fba311);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 28px;
  margin: 0 auto 25px;
  position: relative;
  box-shadow: 0 5px 20px rgba(0, 0, 0, 0.15);
  z-index: 3;
}

.timeline-content {
  background: #fff;
  border-radius: 16px;
  padding: 25px;
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.08);
  transition: all 0.4s ease;
  position: relative;
}

.timeline-content h3 {
  color: #886a03;
  font-size: 1.25rem;
  margin-bottom: 12px;
  font-weight: 600;
}

.timeline-content p {
  color: #555;
  font-size: 0.95rem;
  line-height: 1.7;
}

.timeline-box:hover .timeline-content {
  transform: translateY(-6px);
  box-shadow: 0 12px 25px rgba(0, 0, 0, 0.15);
}

/* Connector Dot */
.timeline-box::before {
  content: "";
  position: absolute;
  top: 50px;
  left: 50%;
  transform: translateX(-50%);
  width: 18px;
  height: 18px;
  background: #fff;
  border: 3px solid #fba311;
  border-radius: 50%;
  z-index: 2;
}

/* Responsive Design */
@media (max-width: 991px) {
  .timeline-container {
    flex-direction: column;
    align-items: center;
  }

  .timeline-container::before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 50%;
    width: 4px;
    height: 100%;
    background: linear-gradient(180deg, #886a03, #fba311);
    transform: translateX(-50%);
  }

  .timeline-box {
    width: 100%;
    max-width: 500px;
    text-align: left;
    padding-left: 80px;
  }

  .timeline-box::before {
    left: 50%;
    transform: translateX(-50%);
  }

  .timeline-icon {
    position: absolute;
    left: 50%;
    transform: translate(-50%, 0);
    top: -10px;
    margin: 0;
  }

  .timeline-content {
    margin-top: 60px;
  }
}

@media (max-width: 575px) {
  .timeline-box {
    padding-left: 0;
  }
  .timeline-content {
    margin-top: 80px;
    text-align: center;
  }
}


/* psychometric tests css */

.pricing-section {
  background: linear-gradient(135deg, #020617 0%, #0f172a 40%, #020617 100%);
}

.section-title {
  font-size: 2.2rem;
  font-weight: 700;
  color: #301d44;
}

.section-subtitle {
  color: #555;
  font-size: 1rem;
  max-width: 700px;
  margin: 0 auto 50px;
  line-height: 1.7;
}

/* Tabs Container */
.pricing-tabs-container {
  display: flex;
  gap: 30px;
  align-items: flex-start;
  flex-wrap: wrap;
}

/* Sidebar Tabs */
.tabs-sidebar {
  flex: 1 1 250px;
  display: flex;
  flex-direction: column;
  gap: 15px;
}

.tab-btn {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 20px;
  background-color: #fff;
  border-radius: 10px;
  font-weight: 600;
  color: #886a03;
  cursor: pointer;
  transition: all 0.3s ease;
}

.tab-btn.active,
.tab-btn:hover {
  background: linear-gradient(90deg, #1c7df8, #392193);
  color: #fff;
}

.tab-btn i {
  font-size: 1.2rem;
}

/* Tab Content */
.tabs-content {
  flex: 3 1 600px;
}

.tab-pane {
  display: none;
}

.tab-pane.active {
  display: block;
}

.pricing-card {
  background-color: #fff;
  padding: 30px 25px;
  border-radius: 16px;
  box-shadow: 0 6px 20px rgba(0,0,0,0.08);
  border-image: linear-gradient(90deg, #ff7c00 0%, #fe6219 100%) 1;
  transition: transform 0.3s ease;
}

.pricing-card h3 {
  color: #886a03;
  font-size: 1.5rem;
  margin-bottom: 15px;
}

.pricing-card p {
  color: #555;
  line-height: 1.7;
}

/* Hover Animation */
.pricing-card:hover {
  transform: translateY(-5px);
}

/* Responsive */
@media (max-width: 991px) {
  .pricing-tabs-container {
    flex-direction: column;
  }
  .tabs-sidebar {
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
  }
  .tab-btn {
    flex: 1 1 45%;
    justify-content: center;
  }
  .tabs-content {
    width: 100%;
  }
}

/* founder css starts */
/* ===== Founder Section ===== */
.founder-section {
  background: linear-gradient(135deg, #0f172a, #020617);
  padding: 100px 0;
  color: #e2e8f0;
  overflow: hidden;
}

/* Container */
.container {
  width: 90%;
  max-width: 1200px;
  margin: auto;
}

/* Layout */
.founder-wrapper {
  display: flex;
  align-items: center;
  gap: 60px;
  flex-wrap: wrap;
}

/* Image Section */
.founder-image {
  flex: 1;
  display: flex;
  justify-content: center;
}

.image-box {
  position: relative;
  border-radius: 20px;
  overflow: hidden;
  transform: translateY(40px);
  opacity: 0;
  animation: fadeUp 1s ease forwards;
}

.image-box img {
  width: 100%;
  max-width: 420px;
  border-radius: 20px;
  transition: transform 0.5s ease;
}

/* Glow Effect */
.image-box::before {
  content: "";
  position: absolute;
  inset: -5px;
  background: linear-gradient(45deg, #1c7df8, #392193);
  z-index: -1;
  filter: blur(25px);
  opacity: 0.6;
  border-radius: 20px;
}

.image-box:hover img {
  transform: scale(1.05);
}

/* Content Section */
.founder-content {
  flex: 1;
  transform: translateY(40px);
  opacity: 0;
  animation: fadeUp 1.2s ease forwards;
}

.founder-content h2 {
  font-size: 36px;
  margin-bottom: 20px;
  color: #ffffff;
  font-weight: 700;
}

.founder-content p {
  font-size: 16px;
  line-height: 1.8;
  margin-bottom: 20px;
  color: #cbd5f5;
}

/* Animation */
@keyframes fadeUp {
  to {
    transform: translateY(0);
    opacity: 1;
  }
}

/* Responsive */
@media (max-width: 992px) {
  .founder-wrapper {
    flex-direction: column;
    text-align: center;
  }

  .founder-content h2 {
    font-size: 28px;
  }
}

/* CTA Button */
.cta-btn {
  display: inline-block;
  margin-top: 20px;
  padding: 14px 32px;
  font-size: 15px;
  font-weight: 600;
  color: #fff;
  background: linear-gradient(45deg, #1c7df8, #392193);
  border-radius: 50px;
  text-decoration: none;
  transition: all 0.4s ease;
  box-shadow: 0 10px 25px rgba(28, 125, 248, 0.3);
  position: relative;
  overflow: hidden;
}

/* Hover Effect */
.cta-btn:hover {
  transform: translateY(-3px);
  box-shadow: 0 15px 35px rgba(28, 125, 248, 0.5);
}

/* Shine Animation */
.cta-btn::before {
  content: "";
  position: absolute;
  top: 0;
  left: -75%;
  width: 50%;
  height: 100%;
  background: rgba(255,255,255,0.2);
  transform: skewX(-25deg);
  transition: 0.5s;
}

.cta-btn:hover::before {
  left: 125%;
}
/* founder css ends */

/* edgrab css starts */
.about-edgrad-gradient {
  position: relative;
  padding: 120px 0;
  background: linear-gradient(135deg, #020617 0%, #0f172a 40%, #020617 100%);
  overflow: hidden;
}

/* Animated Gradient Glow */
.about-edgrad-gradient::before {
  content: "";
  position: absolute;
  width: 500px;
  height: 500px;
  background: radial-gradient(circle, rgba(28,125,248,0.25), transparent 70%);
  top: -150px;
  left: -150px;
  filter: blur(100px);
  animation: moveGlow 8s ease-in-out infinite;
}

.about-edgrad-gradient::after {
  content: "";
  position: absolute;
  width: 400px;
  height: 400px;
  background: radial-gradient(circle, rgba(57,33,147,0.25), transparent 70%);
  bottom: -150px;
  right: -150px;
  filter: blur(100px);
  animation: moveGlow 10s ease-in-out infinite;
}

/* Layout */
.container {
  width: 90%;
  max-width: 1200px;
  margin: auto;
}

.about-wrapper {
  display: flex;
  align-items: center;
  gap: 60px;
  flex-wrap: wrap;
  position: relative;
  z-index: 2;
}

/* LEFT CONTENT */
.about-content-box {
  flex: 1;
}

.about-content-box h2 {
  font-size: 36px;
  color: #fff;
  margin-bottom: 25px;
  font-weight: 700;
}

.about-content-box p {
  font-size: 16px;
  line-height: 1.9;
  color: #cbd5f5;
  margin-bottom: 20px;
}

/* RIGHT IMAGE */
.about-image-box {
  flex: 1;
  display: flex;
  justify-content: center;
}

.image-wrapper {
  position: relative;
  border-radius: 20px;
  overflow: hidden;
  max-width: 420px;
  transition: 0.4s ease;
}

.image-wrapper img {
  width: 100%;
  display: block;
  border-radius: 20px;
}

/* Glow Border */
.image-wrapper::before {
  content: "";
  position: absolute;
  inset: -3px;
  background: linear-gradient(45deg, #1c7df8, #392193);
  z-index: -1;
  filter: blur(20px);
  opacity: 0.6;
  border-radius: 20px;
}

/* Floating Badges */
.badge {
  position: absolute;
  padding: 10px 16px;
  background: rgba(255,255,255,0.08);
  backdrop-filter: blur(12px);
  border-radius: 30px;
  color: #fff;
  font-size: 14px;
  border: 1px solid rgba(255,255,255,0.1);
  box-shadow: 0 10px 30px rgba(0,0,0,0.5);
  animation: float 4s ease-in-out infinite;
}

.badge.one {
  top: 20px;
  left: -30px;
}

.badge.two {
  bottom: 20px;
  right: -30px;
}

/* Hover Effect */
.image-wrapper:hover {
  transform: translateY(-8px) scale(1.02);
}

/* Animations */
@keyframes float {
  0%,100% { transform: translateY(0); }
  50% { transform: translateY(-10px); }
}

@keyframes moveGlow {
  0%,100% { transform: translateY(0); }
  50% { transform: translateY(30px); }
}

/* Responsive */
@media (max-width: 992px) {
  .about-wrapper {
    flex-direction: column;
    text-align: center;
  }

  .badge.one {
    left: 10px;
  }

  .badge.two {
    right: 10px;
  }
}
/* edgrab css ends */

/*  need for counselling css starts */
/* ===== SECTION BASE ===== */
.career-need-section {
  background: linear-gradient(160deg, #020617 50%, #0f172a 50%);
  padding: 120px 0;
  position: relative;
  overflow: hidden;
}

/* Container */
.career-container {
  width: 90%;
  max-width: 1200px;
  margin: auto;
  display: flex;
  align-items: center;
  gap: 60px;
  flex-wrap: wrap;
}

/* LEFT IMAGE */
.career-image {
  flex: 1;
  position: relative;
  border-radius: 20px;
  overflow: hidden;
}

.career-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: 0.5s ease;
}

/* Overlay */
.image-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(2,6,23,0.8), transparent);
}

/* Floating Tag */
.image-tag {
  position: absolute;
  bottom: 20px;
  left: 20px;
  padding: 10px 18px;
  background: rgba(28,125,248,0.2);
  border: 1px solid rgba(28,125,248,0.4);
  color: #fff;
  border-radius: 30px;
  font-size: 14px;
  backdrop-filter: blur(10px);
}

/* Hover Zoom */
.career-image:hover img {
  transform: scale(1.08);
}

/* RIGHT CONTENT */
.career-content {
  flex: 1;
  color: #e2e8f0;
}

/* Heading */
.career-content h2 {
  font-size: 34px;
  margin-bottom: 25px;
  color: #fff;
}

/* Paragraphs */
.career-content p {
  font-size: 16px;
  line-height: 1.9;
  margin-bottom: 20px;
  color: #cbd5f5;
}

/* Highlight Box */
.highlight-box {
  display: flex;
  gap: 20px;
  padding: 25px;
  margin-top: 30px;
  border-radius: 16px;
  background: rgba(255,255,255,0.03);
  border-left: 3px solid #1c7df8;
  backdrop-filter: blur(10px);
  transition: 0.3s ease;
}

/* Number Style */
.highlight-box .number {
  font-size: 28px;
  font-weight: 700;
  color: #1c7df8;
}

/* Hover Effect */
.highlight-box:hover {
  transform: translateY(-5px);
  box-shadow: 0 15px 40px rgba(0,0,0,0.6);
}

/* Responsive */
@media (max-width: 992px) {
  .career-container {
    flex-direction: column;
  }

  .career-content {
    text-align: center;
  }

  .highlight-box {
    flex-direction: column;
    align-items: center;
    text-align: center;
  }
}
/* need for counselling ends */

/* what we ofefr starts */
/* ===== SECTION BASE ===== */
.services-section {
  padding: 120px 0;
  background: linear-gradient(135deg, #020617, #0f172a, #020617);
  font-family: 'Open Sans', sans-serif;
}

/* Container */
.container {
  width: 90%;
  max-width: 1200px;
  margin: auto;
}

/* Header */
.section-header {
  text-align: center;
  margin-bottom: 60px;
}

.section-header h2 {
  font-size: 38px;
  color: #fff;
  margin-bottom: 20px;
}

.section-header p {
  max-width: 800px;
  margin: auto;
  color: #cbd5f5;
  line-height: 1.8;
}

/* GRID */
.services-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 30px;
}

/* CARD */
.service-card {
  position: relative;
  padding: 30px;
  border-radius: 18px;
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.08);
  backdrop-filter: blur(12px);
  transition: all 0.4s ease;
  overflow: hidden;
}

/* Gradient Border Glow */
.service-card::before {
  content: "";
  position: absolute;
  inset: -1px;
  background: linear-gradient(45deg, #1c7df8, #392193);
  opacity: 0;
  transition: 0.4s;
  z-index: -1;
  border-radius: 18px;
}

/* Hover */
.service-card:hover::before {
  opacity: 1;
}

.service-card:hover {
  transform: translateY(-10px) scale(1.02);
  box-shadow: 0 25px 60px rgba(0,0,0,0.7);
}

/* Number */
.service-card .number {
  font-size: 28px;
  font-weight: 700;
  color: #1c7df8;
  display: block;
  margin-bottom: 10px;
}

/* Title */
.service-card h3 {
  font-size: 20px;
  color: #fff;
  margin-bottom: 12px;
}

/* Text */
.service-card p {
  font-size: 15px;
  line-height: 1.8;
  color: #cbd5f5;
}

/* Subtle Shine Effect */
.service-card::after {
  content: "";
  position: absolute;
  top: 0;
  left: -75%;
  width: 50%;
  height: 100%;
  background: rgba(255,255,255,0.08);
  transform: skewX(-25deg);
  transition: 0.6s;
}

.service-card:hover::after {
  left: 125%;
}

/* Responsive */
@media (max-width: 992px) {
  .services-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 600px) {
  .services-grid {
    grid-template-columns: 1fr;
  }
}
/* what we offer ends */

/* need for counselling css */
/* SECTION */
.career-approach {
  padding: 120px 0;
  background: linear-gradient(135deg, #020617, #0f172a);
  font-family: 'Open Sans', sans-serif;
}

/* TITLE */
.section-title {
  text-align: center;
  font-size: 42px;
  color: #fff;
  margin-bottom: 60px;
}

/* GRID */
.grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 30px;
}

/* CARD */
.card {
  position: relative;
  height: 260px;
  border-radius: 20px;
  overflow: hidden;
  cursor: pointer;
}

/* IMAGE */
.card img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: 0.6s ease;
}

/* DARK OVERLAY */
.overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(to bottom, rgba(2,6,23,0.2), rgba(2,6,23,0.9));
}

/* CONTENT */
.content {
  position: absolute;
  bottom: 20px;
  left: 20px;
  right: 20px;
  color: #fff;
  z-index: 2;
}

.content h3 {
  font-size: 20px;
  margin-bottom: 10px;
  color: #1c7df8;
}

.content p {
  font-size: 14px;
  line-height: 1.6;
  color: #cbd5f5;
}

/* HOVER EFFECT */
.card:hover img {
  transform: scale(1.1);
}

.card:hover {
  transform: translateY(-6px);
  box-shadow: 0 20px 50px rgba(0,0,0,0.7);
}

/* RESPONSIVE */
@media (max-width: 992px) {
  .grid {
    grid-template-columns: 1fr;
  }
}
/* need for counselling css */

/* service page css */
.faq-area.pt-100 {
    background: linear-gradient(135deg, #020617 0%, #0f172a 40%, #020617 100%);
}