/*
	Template Name: Pegeon - Business & Consulting html landing page
	Author: webthemes
	Author Uri: https://www.templatemonster.com/authors/webthemes/
	Version: 1.2
*/


/*============================
 		Content table
 	--------------------

	01. Google fonts
	02. Basic css
	03. Preloader Css
	04. Custom Header
	05. Landing Wrapper
	06. About Wrapper
	07. Service Wrapper
	08. Banner Wrapper
	09. Grow Wrapper
	10. Project Wrapper
	11. Expert Wrapper
	12. Ask Wrapper
	13. Pricing Wrapper
	14. Testimonials Wrapper
	15. News Wrapper
	16. Contact Wrapper
	17. Footer Wrapper
 ===============================*/


/*======================
   01. Google fonts
========================*/

@import url('https://fonts.googleapis.com/css?family=Heebo:400,500,700&display=swap');
@import url('https://fonts.googleapis.com/css?family=Poppins:400,500,700&display=swap');

/*======================
   02. Basic css
========================*/

html,
body,
div,
span,
h1,
h2,
h3,
h4,
h5,
h6,
p,
a,
strong,
i,
ol,
ul,
li,
form,
label,
footer,
header,
menu,
nav,
section {
	margin: 0;
	padding: 0;
}

body {
	line-height: 26px;
	font-family: 'Heebo', sans-serif;
	background-color: #fff;
	color: #687c94;
	-webkit-transition: .5s;
	-o-transition: .5s;
	transition: .5s;
	font-size: 18px;
}

ol,
ul {
	list-style: none;
}

a:hover {
	text-decoration: none;
}

a:focus,
button:focus,
input:focus,
textarea:focus,
select:focus {
	outline: none;
}

.section_padd {
	padding: 90px 0;
}

.title_1 {
	font-size: 38px;
	line-height: 48px;
	font-weight: bold;
	color: #0b1a39;
}

.title_2 {
	max-width: 600px;
	line-height: 29px;
	margin: 20px auto -5px auto;
	color: #687c94;
}

@media (max-width: 768px) {
    .title_1 {
        font-size: 28px; /* Reduce font size for mobile */
        line-height: 36px; /* Adjust line height for mobile */
    }
}


/*======================
   03. Preloader Css
========================*/

.preloader {
	width: 100%;
	height: 100%;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 999999;
	background: #ffffff;
	text-align: center;
}

.loader {
	width: 44px;
	height: 44px;
	position: absolute;
	border: 4px solid #0c5adb;
	top: calc(50% - 22px);
	left: calc(50% - 22px);
	-webkit-animation: loader 2s infinite ease;
	animation: loader 2s infinite ease;
}

.loader-inner {
	width: 100%;
	background-color: #0c5adb;
	-webkit-animation: loader-inner 2s infinite ease-in;
	animation: loader-inner 2s infinite ease-in;
}

@-webkit-keyframes loader {
	0% {
		-webkit-transform: rotate(0deg);
		transform: rotate(0deg);
	}
	25% {
		-webkit-transform: rotate(180deg);
		transform: rotate(180deg);
	}
	50% {
		-webkit-transform: rotate(180deg);
		transform: rotate(180deg);
	}
	75% {
		-webkit-transform: rotate(360deg);
		transform: rotate(360deg);
	}
	100% {
		-webkit-transform: rotate(360deg);
		transform: rotate(360deg);
	}
}

@keyframes loader {
	0% {
		-webkit-transform: rotate(0deg);
		transform: rotate(0deg);
	}
	25% {
		-webkit-transform: rotate(180deg);
		transform: rotate(180deg);
	}
	50% {
		-webkit-transform: rotate(180deg);
		transform: rotate(180deg);
	}
	75% {
		-webkit-transform: rotate(360deg);
		transform: rotate(360deg);
	}
	100% {
		-webkit-transform: rotate(360deg);
		transform: rotate(360deg);
	}
}

@-webkit-keyframes loader-inner {
	0% {
		height: 0%;
	}
	25% {
		height: 0%;
	}
	50% {
		height: 100%;
	}
	75% {
		height: 100%;
	}
	100% {
		height: 0%;
	}
}

@keyframes loader-inner {
	0% {
		height: 0%;
	}
	25% {
		height: 0%;
	}
	50% {
		height: 100%;
	}
	75% {
		height: 100%;
	}
	100% {
		height: 0%;
	}
}


/*======================
   04. Custom Header 
========================*/

header {
	position: fixed;
	top: 0;
	left: 0;
	height: 75px;
	z-index: 1024;
	width: 100%;
	-webkit-transition: background 0.3s;
	-o-transition: background 0.3s;
	transition: background 0.3s;
}

header.fixed_header {
	background-color: #030921;
}

header .logo img {
	max-width: 250px;
	width: 100%;
}

#menu {
	text-align: right;
}

#menu li {
	display: inline-block;
	color: #fff;
	padding: 0 15px;
}

#menu li a {
	font-size: 17px;
	letter-spacing: 0.5px;
	font-weight: 500;
	color: #fff;
	position: relative;
	padding: 0;
}

#menu li:last-child {
	padding-right: 0;
}

#menu li a::before {
	position: absolute;
	content: "";
	top: 13px;
	left: 0;
	height: 100%;
	width: 0;
	pointer-events: none;
	background-image: url(../img/wave.png);
	background-size: 43px;
	background-position: -200px center;
	-webkit-transition: width .7s;
	-o-transition: width .7s;
	transition: width .7s;
}

#menu li a.active::before,
#menu li a:hover::before {
	width: 100%;
}

.hamburger-menu {
	cursor: pointer;
	position: absolute;
	right: 15px;
	display: none;
	z-index: 999;
	top: -15px;
}

.hamburger-menu span {
	background: #ffffff;
	width: 30px;
	height: 3px;
	display: block;
	margin: 5px 0;
	border-radius: 5px;
	-webkit-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
	transition: all 0.3s ease;
}

.hamburger-menu .line-top.current {
	-webkit-transform: translateY(200%) rotate(135deg);
	-ms-transform: translateY(200%) rotate(135deg);
	transform: translateY(200%) rotate(135deg);
}

.hamburger-menu .line-center.current {
	opacity: 0;
}

.hamburger-menu .line-bottom.current {
	-webkit-transform: translateY(-325%) rotate(-135deg);
	-ms-transform: translateY(-325%) rotate(-135deg);
	transform: translateY(-325%) rotate(-135deg);
}

/*======================
   05. Landing Wrapper
========================*/

.landing_wrapper {
	min-height: 100vh;
	width: 100%;
	padding-top: 145px;
	padding-bottom: 70px;
	background-size: cover;
	background-position: center center;
	background-color: #073683;
	position: relative;
}

.landing_wrapper::before {
	content: ' ';
	position: absolute;
	top: 0;
	left: 0;
	background-color: #0e1454;
	width: 100%;
	height: 100%;
	opacity: 0.7;
}

.landing_wrapper .heading {
	font-size: 65px;
	line-height: 75px;
	font-weight: bold;
}

.landing_wrapper .sub_heading {
	max-width: 621px;
	font-size: 20px;
	line-height: 30px;
}

.landing_wrapper .home_btn_wrapper .button {
	margin: 8px;	
}



/*video slider*/

.hero_slider .owl-item.active .landing_wrapper h1,
.hero_slider .owl-item.active .landing_wrapper p,
.hero_slider .owl-item.active .landing_wrapper a {
  top: 0;
  opacity: 1;
  position: relative;
}

.hero_slider .owl-item.active .landing_wrapper h1 {
  -webkit-transition: all 0.4s ease 0.4s;
  -o-transition: all 0.4s ease 0.4s;
  transition: all 0.4s ease 0.4s;
}
.hero_slider .owl-item.active .landing_wrapper p {
  -webkit-transition: all 0.6s ease 0.6s;
  -o-transition: all 0.6s ease 0.6s;
  transition: all 0.6s ease 0.6s;
}

.hero_slider .owl-item.active .landing_wrapper .home_btn_wrapper  {
  -webkit-transition: all 0.7s ease 0.7s;
  -o-transition: all 0.7s ease 0.7s;
  transition: all 0.7s ease 0.7s;
  position: relative;
  top: 0;
  opacity: 1;
}

.hero_slider .owl-item .landing_wrapper h1,
.hero_slider .owl-item .landing_wrapper p {
  top: 50px;
  opacity: 0;
  position: absolute;
}

.hero_slider .owl-item .landing_wrapper .home_btn_wrapper  {
  top: 100px;
  opacity: 0;
  position: absolute;
}

.hero_slider .owl-nav button{
	height: 50px;
    width: 40px;
    border-radius: 0px 5px 5px 0px;
    background: #228aff !important;
    color: #ffffff !important;
    font-size: 25px !important;
    position: absolute;
    top: calc(50% + 15px);
    left: 0;
}

.hero_slider .owl-nav button.owl-next{
    left: auto;
    right: 0;
    border-radius: 5px 0px 0px 5px;
}

#particles-js {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
}

/*======================
  New Page Layout
========================*/

#info-section {
  background: linear-gradient(to right, #007bff, #0056b3); /* Updated gradient */
  color: #fff;
  padding: 40px; /* Increased padding for more space */
  border-radius: 8px;
  box-shadow: 0 6px 12px rgba(0, 0, 0, 0.1);
  margin: 20px auto;
  max-width: 1000px; /* Increased width for better layout */
}

#info-section h3, #info-section h4 {
  margin-bottom: 16px;
}

#info-section p {
  line-height: 1.7;
  margin-bottom: 21px;
}

#info-section ul, #info-section ol {
  padding-left: 40px;
  margin-bottom: 30px; /* Increased margin for better separation */
  list-style-type: disc;
  color: #fff;
}

#info-section ul li, #info-section ol li {
  margin-bottom: 10px;
}

/* Ensuring responsiveness */
@media (max-width: 768px) {
  #info-section {
    padding: 20px;
    margin: 15px;
    max-width: 100%; /* Ensures full width on smaller screens */
  }
}




/*======================
  Tiles
========================*/


.tile-container {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  justify-content: center;
}

.tile {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  width: 300px;
  border: 1px solid #ccc;
  border-radius: 8px;
  overflow: hidden;
}

.tile img {
  width: 100%;
  display: block;
}

.tile h4 {
  margin: 0;
  padding: 15px 15px 0;
  font-family: 'Poppins', sans-serif;
  color: #007bff; /* Adjust the color as needed */
}

.tile p {
  padding: 0 15px;
  font-family: 'Poppins', sans-serif;
  color: #333;
  flex-grow: 1;
}

.tile .button-container {
  padding: 15px;
  display: flex;
  justify-content: center;
}

.read-more-btn {
  display: inline-block;
  padding: 12px 25px;
  background: linear-gradient(90deg, #007bff, #0056b3);
  color: white;
  text-decoration: none;
  font-family: 'Poppins', sans-serif;
  text-align: center;
  border-radius: 30px;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
  transition: background 0.3s, transform 0.3s, box-shadow 0.3s;
}

.read-more-btn:hover {
  background: linear-gradient(90deg, #0056b3, #003f7f);
  transform: translateY(-2px);
  box-shadow: 0 8px 12px rgba(0, 0, 0, 0.2);
}



/* Media query for tablets and larger devices */
@media (min-width: 768px) {
  .tile {
    width: calc(50% - 20px); /* Adjust width for 2 tiles in a row, accounting for gap */
  }
}

.tile img {
  width: 100%;
  display: block;
}

.tile p {
  padding: 0 15px;
  font-family: 'Poppins', sans-serif;
  color: #333;
}

  .read-more-btn {
    padding: 10px 20px;
    font-size: 1em;
    width: 100%;
    text-align: center;
    box-shadow: none;
    margin: 10px 0;
  }

  .read-more-btn:hover {
    transform: none;
  }
}



/*======================
   06. About Wrapper
========================*/

.about_wrapper img {
	width: 100%;
}

.about_img_wrapper {
	padding: 0 20px;
	margin-top: 20px;
	margin-bottom: 20px;
}

.about_img_wrapper::before {
	position: absolute;
	content: '';
	top: -20px;
	left: 0;
	border-top: 200px solid #0c5adb;
	border-right: 250px solid transparent;
	z-index: -1;
}

.about_img_wrapper::after {
	position: absolute;
	content: '';
	bottom: -20px;
	right: 0;
	border-bottom: 200px solid #0c5adb;
	border-left: 250px solid transparent;
	z-index: -1;
}

.about_wrapper .title_2 {
	margin-bottom: 20px;
	margin-left: 0;
}

.about_wrapper p,
.about_wrapper h4 {
	color: #0b1a39;
}

.title_top {
	color: #0c5adb !important;
	font-size: 17px;
	font-weight: 600;
	margin-bottom: 15px;
	text-transform: uppercase;
}

.about_wrapper h4 {
	font-size: 22px;
	font-weight: bold;
	margin-bottom: 10px;
}

.about_wrapper span {
	font-size: 35px;
	color: #0c5adb;
	font-weight: bold;
}




/*======================
   New Page Layout 30-05-2024
========================*/

.content-section {
    margin-bottom: 30px;
}


.content-title {
    font-size: 2em;
    font-weight: bold;
    color: #555; /* Softer color */
    margin-bottom: 15px;
    text-align: left;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.1); /* Subtle shadow */
}


.content-subtitle {
    font-size: 1.5em;
    color: #007bff;
    margin-top: 20px;
    margin-bottom: 10px;
    text-align: left;
}

/* Fresh and modern h6 section */
.stylish-h6 {
    font-size: 1.2em;
    color: #333;
    background: linear-gradient(135deg, #f0f8ff, #e0f7fa);
    padding: 20px;
    border-radius: 10px;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
    margin: 20px 0;
    position: relative;
    overflow: hidden;
    z-index: 1;
}

.stylish-h6:before {
    content: '';
    position: absolute;
    top: 0;
    left: -50px;
    width: 100%;
    height: 100%;
    background: rgba(0, 123, 255, 0.1);
    transform: skewX(-15deg);
    transition: transform 0.5s ease-in-out;
    z-index: -1;
}

.stylish-h6:hover:before {
    transform: skewX(15deg);
}

.stylish-h6 a {
    color: #007bff;
    text-decoration: none;
    font-weight: bold;
    position: relative;
    z-index: 2;
    transition: color 0.3s, text-shadow 0.3s;
}

.stylish-h6 a:hover {
    color: #0056b3;
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
}

.content-section p {
    font-size: 1.1em;
    color: #555;
    line-height: 1.6;
    margin-bottom: 15px;
}

.content-list {
    margin: 0;
    padding: 0;
    list-style: none; /* Remove default bullets */
}

/* Banner Image Styling */
.banner-image {
    width: 100%;
    overflow: hidden;
    margin-top: 30px; /* Adjust as needed for spacing */
}

.banner-image img {
    width: 100%;
    height: auto;
    display: block;
}



.content-list li {
    margin-bottom: 10px;
    font-size: 1.1em;
    color: #333;
    padding-left: 25px; /* Space for custom bullet */
    position: relative;
}

.content-list li:before {
    content: '•'; /* Custom bullet character */
    position: absolute;
    left: 0;
    top: 0;
    color: #007bff; /* Custom bullet color */
    font-size: 1.5em; /* Custom bullet size */
    line-height: 1.1em; /* Align bullet with text */
}

/* Numbered list styling */
.content-list-numbered {
    counter-reset: list-counter; /* Reset counter */
    margin: 0;
    padding: 0;
    list-style: none; /* Remove default numbers */
}

.content-list-numbered li {
    position: relative;
    padding-left: 35px; /* Space for custom number */
    margin-bottom: 15px;
    font-size: 1.1em;
    color: #333;
    line-height: 1.6;
}

.content-list-numbered li:before {
    content: counter(list-counter) ". "; /* Custom number */
    counter-increment: list-counter; /* Increment counter */
    position: absolute;
    left: 0;
    top: 0;
    color: #007bff; /* Custom number color */
    font-size: 1.2em; /* Custom number size */
    font-weight: bold; /* Bold number for emphasis */
    line-height: 1.6; /* Align number with text */
}


.map-section {
    margin-top: 40px;
    text-align: center;
}

.map-title {
    font-size: 1.8em;
    font-weight: bold;
    color: #333;
    margin-bottom: 15px;
}

/* Call to Action Section */
.cta-section {
    text-align: center;
    margin: 30px 0;
    padding: 20px;
    background: #f0f8ff; /* Solid background color */
    border-radius: 10px;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
}

.cta-button {
    display: inline-block;
    padding: 15px 30px;
    background: linear-gradient(90deg, #007bff, #0056b3);
    color: white;
    font-size: 1.2em;
    font-family: 'Poppins', sans-serif;
    text-decoration: none;
    border-radius: 30px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    transition: background 0.3s, transform 0.3s;
    margin-bottom: 15px;
}

.cta-button:hover {
    background: linear-gradient(90deg, #0056b3, #003f7f);
    transform: translateY(-2px);
}

.cta-contact {
    font-size: 1.1em;
    color: #333;
}

.cta-contact a {
    color: #007bff;
    text-decoration: none;
    font-weight: bold;
    transition: color 0.3s, text-shadow 0.3s;
}

.cta-contact a:hover {
    color: #0056b3;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
}




@media (max-width: 768px) {
    .service_wrapper {
        padding: 30px 0;
    }
    
    .content-title {
        font-size: 1.5em;
    }

    .content-subtitle {
        font-size: 1.2em;
    }

    .content-section p {
        font-size: 1em;
    }

    .content-list li {
        font-size: 1em; /* Adjust font size for mobile */
    }
	
    .content-list-numbered li {
        font-size: 1em; /* Adjust font size for mobile */
        padding-left: 25px; /* Adjust padding for mobile */
    }

    .content-list-numbered li:before {
        font-size: 1em; /* Adjust number size for mobile */
    }	

    .map-title {
        font-size: 1.5em;
    }
    
    .map-section iframe {
        width: 100%;
        height: 300px;
    }
	
    .banner-image {
        margin-top: 20px; /* Adjust as needed for spacing on mobile */
    }	
	
}



/*======================
   07. Service Wrapper
========================*/

.service_wrapper {
	background-color: #f7fcff;
}

.service_box {
	text-align: center;
	padding: 40px 30px;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	-ms-border-radius: 5px;
	-o-border-radius: 5px;
	-webkit-transition: .3s;
	-o-transition: .3s;
	transition: .3s;
	background-color: #ffffff;
}

.service_box:hover {
	border-color: #fff;
	-webkit-box-shadow: 0px 4px 17px #eaeaea;
	box-shadow: 0px 4px 17px #eaeaea;
	-webkit-transition: .3s;
	-o-transition: .3s;
	transition: .3s;
}

.service_box .service_icon {
	position: relative;
	margin: 0 auto;
	font-size: 32px;
	height: 80px;
	width: 80px;
	color: #fff;
	z-index: 1;
	text-align: center;
	line-height: 80px;
	border: 2px dashed #0c5adb;
}

.service_box .service_icon::before {
	position: absolute;
	content: '';
	top: 0;
	left: 0;
	width: 76px;
	height: 76px;
	border-radius: 15px;
	background-color: #0b1a39;
	-webkit-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	transform: rotate(45deg);
	z-index: -1;
	-webkit-transition: 0.3s;
	-o-transition: 0.3s;
	transition: 0.3s;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}

.service_box:hover .service_icon::before {
	-webkit-transform: rotate(0deg);
	-ms-transform: rotate(0deg);
	transform: rotate(0deg);
	background-color: #0c5adb;
}

.service_box:hover .service_icon {
	border-color: transparent;
}

.service_box .title {
	font-size: 22px;
	color: #0b1a39;
	font-weight: bold;
}

.service_box .description {
	color: #687c94;
	line-height: 32px;
}


/*======================
   08. Banner Wrapper
========================*/

.banner_wrapper {
	padding: 60px 0;
	background-size: cover;
	background-position: center center;
	position: relative;
	background-attachment: fixed;
}

.banner_wrapper .title_1,
.banner_wrapper .title_2 {
	max-width: 100%;
	color: #fff;
}

.banner_wrapper::before {
	content: ' ';
	position: absolute;
	top: 0;
	left: 0;
	background-color: #000000;
	width: 100%;
	height: 100%;
	opacity: 0.61;
}

.banner_button_wrapper {
	text-align: right;
}


/*======================
   09. Grow Wrapper
========================*/

.grow_wrapper .title_1 {
	margin-left: 0;
}

.grow_wrapper .title_2 {
	margin-left: 0;
}

.grow_wrapper .technics li {
	padding-left: 25px;
	position: relative;
	margin-top: 15px;
}

.grow_wrapper .technics li::before,
.grow_wrapper .technics li::after {
	position: absolute;
	content: '';
	left: 0;
	top: 7px;
	height: 10px;
	width: 10px;
	background-color: #0c5adb;
}

.grow_wrapper .technics li::after {
	-webkit-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	transform: rotate(45deg);
}


/*======================
   10. Project Wrapper
========================*/

.project_wrapper {
	background-color: #f7fcff;
	overflow: hidden;
}

.project_filter_menu ul li {
	display: inline-block;
	font-size: 19px;
	font-weight: 600;
	padding: 15px 0;
	margin: 0 15px;
	cursor: pointer;
	position: relative;
	overflow: hidden;
	line-height: 20px;
}

.project_filter_menu ul li:hover {
	color: #0c5adb;
}

.project_filter_menu ul li::before,
.project_filter_menu ul li.active::before {
	content: '';
	position: absolute;
	top: calc(50% - 1px);
	left: -100%;
	width: 100%;
	height: 2px;
	background-color: #0c5adb;
	-webkit-transition: .5s;
	-o-transition: .5s;
	transition: .5s;
}

.project_filter_menu ul li:hover::before,
.project_filter_menu ul li.active::before {
	left: 0;
}

.project_filter_menu ul li.active {
	position: relative;
	color: #0c5adb;
}

.project_items .item img {
	width: 100%;
}

.project_items .item .overlay {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 1;
	color: #fff;
	background-color: rgba(0, 0, 0, 0.51);
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column;
}

.project_items .item .overlay h3 {
	font-size: 27px;
	line-height: 24px;
}

.project_items .item .overlay i {
	width: 40px;
	height: 40px;
	border: 2px solid #fff;
	border-radius: 50%;
	line-height: 37px;
	-webkit-transition: 0.3s;
	-o-transition: 0.3s;
	transition: 0.3s;
	color: #fff;
	-webkit-transform: translateY(30px);
	-ms-transform: translateY(30px);
	transform: translateY(30px);
	display: inline-block;
}

.project_items .item:hover .overlay i {
	-webkit-transform: translateY(0);
	-ms-transform: translateY(0);
	transform: translateY(0);
}

.project_items .item .overlay i:hover {
	background-color: #0c5adb;
	border-color: transparent;
	-webkit-box-shadow: 0px 0px 10px 0px #0c5adb;
	box-shadow: 0px 0px 10px 0px #0c5adb;
}

.project_items a{
	color:black;
	font-weight:bold;
}


/*======================
   11. Expert Wrapper
========================*/

.single_expert {
	position: relative;
	overflow: hidden;
	border: 1px solid #f2f2f4;
}

.expert_details {
	position: absolute;
	bottom: -80px;
	width: 100%;
	background-color: rgb(255 255 255);
	z-index: 1;
	-webkit-transition: .4s;
	-o-transition: .4s;
	transition: .4s;
	-webkit-transform: skewX(6deg) rotate(6deg);
	-ms-transform: skewX(6deg) rotate(6deg);
	transform: skewX(6deg) rotate(6deg);
}

.expert_content {
	-webkit-transform: skewX(-6deg) rotate(-6deg);
	-ms-transform: skewX(-6deg) rotate(-6deg);
	transform: skewX(-6deg) rotate(-6deg);
	padding: 25px 0 15px;
}

.single_expert:hover .expert_details {
	bottom: -20px;
}

.single_expert:hover .expert_details {
	background-color: #0c5adb;
	color: #fff;
}

.single_expert:hover .expert_details h4 {
	color: #fff;
}

.expert_details h4 {
	font-size: 22px;
	color: #0b1a39;
	font-weight: 600;
	margin-bottom: 5px;
}

.expert_details p {
	font-size: 15px;
}

.expert_details ul {
	position: relative;
}

.expert_details ul::before {
	content: '';
	position: absolute;
	top: 0;
	left: 15px;
	height: 1px;
	width: calc(100% - 30px);
	background-color: #fff;
}

.expert_details ul li {
	display: inline-block;
	padding: 20px 10px;
}

.expert_details ul li a {
	font-size: 19px;
	color: #fff;
}


/*======================
   12. Ask Wrapper
========================*/

.ask_wrapper {
	background-color: #f7fcff;
}

.ask_wrapper .button {
	font-size: 16px;
	background-color: #0c5adb;
	color: #fff;
	width: 100%;
	text-align: left;
	border-color: #dbe4f0;
	padding: 0 50px 0 25px;
	-webkit-transition: .3s;
	-o-transition: .3s;
	transition: .3s;
	line-height: 30px;
	position: relative;
	font-weight: 600;
}

.ask_wrapper .button[aria-expanded="false"] {
	background-color: transparent;
	color: #687c94;
}

.ask_wrapper .button:hover {
	background-color: #0c5adb;
	color: #fff;
}

.ask_content {
	padding: 30px 20px 0;
}

.accordion .button .fa-check {
	background-color: #fff;
	height: 25px;
	width: 25px;
	border-radius: 50%;
	line-height: 25px;
	text-align: center;
	font-size: 12px;
	color: #0c5adb;
	position: absolute;
	right: 20px;
	top: 14px;
	opacity: 0;
}

.accordion .button .btn_content {
	overflow: hidden;
}

.accordion .button .btn_content span {
	display: block;
	white-space: nowrap;
	-o-text-overflow: ellipsis;
	text-overflow: ellipsis;
	overflow: hidden;
}

.accordion .button[aria-expanded="true"] .fa-check {
	opacity: 1;
}


/*======================
   13. Pricing Wrapper
========================*/

.tabs .nav-link {
	border-radius: 28px;
	text-align: center;
	color: #000000;
	display: inline-block;
	font-size: 18px;
	text-transform: capitalize;
	-webkit-transition: 0.3s;
	-o-transition: 0.3s;
	transition: 0.3s;
	padding: 10px 35px;
	font-weight: 500;
}

.tabs .nav-link.active {
	background-color: #0c5adb;
	color: #fff;
}

.icon-list-item {
	position: relative;
	padding-left: 35px;
}

.icon-list-item .icon {
	color: #0c5adb;
	background-color: #cedef9;
	display: inline-block;
	height: 18px;
	width: 18px;
	text-align: center;
	font-size: 11px;
	line-height: 2;
	position: absolute;
	left: 0;
	top: 3px;
}

.pricing_wrapper .card-body h2 {
	font-size: 50px;
	font-weight: 600;
	margin: 15px 0;
}

.pricing_wrapper .card-body h4 {
	color: #051229;
	margin-bottom: 5px;
	font-weight: 700;
	font-size: 22px;
}

.pricing_wrapper .card-body .button {
	height: 48px;
	line-height: 48px;
}


/*===========================
   14. Testimonials Wrapper
=============================*/

.testi_wrapper {
	background-color: #f7fcff;
}

.testi_carousel .item .single_client {
	padding: 35px;
	border: 2px solid #dddddd;
	border-radius: 10px;
	line-height: 24px;
	-webkit-transition: 0.3s;
	-o-transition: 0.3s;
	transition: 0.3s;
}

.testi_carousel .item:hover .single_client {
	border-color: #0c5adb;
}

.testi_carousel .item:hover i {
	color: #75a1eb;
}

.testi_carousel .item i {
	font-size: 50px;
	-webkit-transition: .3s;
	-o-transition: .3s;
	transition: .3s;
}

.testi_carousel .item .client_feedback {
	font-weight: 600;
	color: #687c94;
	letter-spacing: 0.1px;
}

.testi_carousel .item .client_img {
	height: 64px;
	width: 64px;
	border-radius: 50%;
	background-color: #de8893;
	margin-right: 20px;
	overflow: hidden;
}

.testi_carousel .single_client .media-body h4 {
	font-size: 20px;
	font-weight: 600;
	color: #0b1a39;
}

.testi_carousel .single_client .media-body p {
	margin-top: 4px;
}


/*==================
   15. News Wrapper
====================*/

.news_wrapper .single_news {
	line-height: 24px;
	border: 1px solid #edeaea;
	padding: 30px;
	-webkit-box-shadow: 0px 0px 15px #f3f3f3;
	box-shadow: 0px 0px 15px #f3f3f3;
	border-radius: 10px;
	overflow: hidden;
}

.news_wrapper .single_news .overflow-hidden {
	border-radius: 10px;
}

.news_wrapper .single_news img {
	width: 100%;
	-webkit-transition: 0.5s;
	-o-transition: 0.5s;
	transition: 0.5s;
}

.news_wrapper .single_news:hover img {
	-webkit-transform: scale(1.1);
	-ms-transform: scale(1.1);
	transform: scale(1.1);
}

.news_wrapper .single_news h4 {
	font-size: 20px;
	color: #0b1a39;
	font-weight: 600;
}

.news_wrapper .single_news p {
	font-size: 17px;
}

.news_wrapper .single_news a {
	display: block;
	height: 45px;
	line-height: 45px;
	width: 145px;
}


/*==================
   16. Contact Wrapper
====================*/

.contact_wrapper {
	background-image: url(../img/map.svg);
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center center;
	position: relative;
}

.contact_wrapper::before {
	position: absolute;
	content: '';
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: #ffffff;
	opacity: 0.9;
	border-top: 1px solid #e8e8e8;
}

aside {
	border: 1px solid #e6e6e6;
	padding: 30px;
	height: 100%;
	background-color: #ffffff;
}

aside h4 {
	line-height: 0.8;
	border-bottom: 1px solid #d6cece;
	padding-bottom: 15px;
	color: #000000;
}

aside .address ul li {
	border-bottom: 1px solid #f3f0f0;
	margin: 15px 0 0;
	padding-bottom: 15px;
}

aside .address ul li:last-child {
	border-bottom: none;
	padding-bottom: 0;
}

aside .address ul li a {
	display: block;
	color: #687c94;
	-webkit-transition: 0.3s;
	-o-transition: 0.3s;
	transition: 0.3s;
}

aside .address ul li a:hover {
	color: #0c5adb;
}

aside ul li strong {
	color: #000000;
	position: relative;
	padding-left: 15px;
	margin-bottom: 5px;
	display: inline-block;
}

aside ul li strong::before {
	position: absolute;
	content: '';
	left: 0;
	top: 8px;
	width: 8px;
	height: 8px;
	background-color: #0c5adb;
}

.inputBox,
.textBox {
	height: 45px;
	width: 100%;
	padding: 0 15px;
	border: 1px solid #e6e6e6;
	background-color: #ffffff;
	font-size: 16px;
	-webkit-transition: 0.3s;
	-o-transition: 0.3s;
	transition: 0.3s;
}

.textBox {
	height: 170px;
	resize: none;
	padding-top: 10px;
}

.inputBox:focus,
.textBox:focus {
	border-color: #0c5adb;
	-webkit-box-shadow: none;
	box-shadow: none;
}

.contact_wrapper .button {
	width: 100%;
	border-radius: 0;
}


/*====================
   17. Footer Wrapper
======================*/

footer {
	background-color: #030921;
	font-size: 16px;
	color: #fff;
	padding: 10px 0 30px 0;
}

footer .social_icons li {
	display: inline-block;
	margin-left: 5px;
}

footer .social_icons li:first-child {
	margin-left: 0px;
}

footer .social_icons li a {
	height: 40px;
	width: 40px;
	display: inline-block;
	line-height: 40px;
	border-radius: 50%;
	background-color: rgba(255, 255, 255, 0.06);
	text-align: center;
	color: #ffffff;
	-webkit-transition: 0.3s;
	-o-transition: 0.3s;
	transition: 0.3s;
}

footer .social_icons li a:hover {
	color: #0c5adb;
}

.back-to-top.button {
	font-size: 24px;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	line-height: 40px;
	text-align: center;
	display: none;
	position: fixed;
	bottom: 80px;
	right: 10px;
	z-index: 1000;
}


/* Style for the project wrapper section */
.project_wrapper {
    background-color: #f9f9f9;
    padding: 50px 0;
}

/* Style for the section title */
.project_wrapper .title_1 {
    font-size: 2.5em;
    font-weight: bold;
    color: #333;
    margin-bottom: 20px;
}

.project_wrapper .title_2 {
    font-size: 1.2em;
    color: #666;
    margin-bottom: 20px;
}

/* Style for the filter menu */
.project_filter_menu ul {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    list-style: none;
    padding: 0;
}

.project_filter_menu ul li {
    margin: 10px 15px;
    padding: 10px 20px;
    border: 2px solid #007bff;
    border-radius: 30px;
    cursor: pointer;
    transition: background-color 0.3s, color 0.3s, transform 0.3s;
}

.project_filter_menu ul li.active,
.project_filter_menu ul li:hover {
    background-color: #007bff;
    color: #fff;
    transform: scale(1.05);
}

/* Style for the project items */
.project_items .item {
    margin-bottom: 30px;
    text-align: center;
}

.project_items .item .overlay {
    background: rgba(0, 0, 0, 0.7);
    color: #fff;
    padding: 20px;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    opacity: 0;
    transition: opacity 0.3s;
}

.project_items .item:hover .overlay {
    opacity: 1;
}

/* Style for the links in the new section */
.project_items .row.justify-content-center h5 a {
    color: #007bff;
    text-decoration: none;
    transition: color 0.3s;
}

.project_items .row.justify-content-center h5 a:hover {
    color: #0056b3;
}

/* Stylish list */
.stylish-list {
    list-style: none;
    padding: 0;
    margin: 0;
    text-align: left;
}

.stylish-list li {
    margin: 10px 0;
    padding: 10px;
    border: 2px solid #007bff;
    border-radius: 8px;
    transition: background-color 0.3s, color 0.3s, transform 0.3s;
}

.stylish-list li a {
    color: #007bff;
    text-decoration: none;
    font-size: 1.1em;
    transition: color 0.3s;
}

.stylish-list li:hover {
    background-color: #007bff;
    color: #fff;
    transform: scale(1.05);
}

.stylish-list li:hover a {
    color: #fff;
}


/* Responsive styles */
@media (max-width: 768px) {
    .project_wrapper {
        padding: 30px 0;
    }
    
    .project_wrapper .title_1 {
        font-size: 2em;
    }

    .project_wrapper .title_2 {
        font-size: 1em;
    }
    
    .project_filter_menu ul {
        flex-direction: column;
        align-items: center;
    }
    
    .project_filter_menu ul li {
        margin: 5px 0;
        padding: 10px 15px;
        font-size: 1.2em;
    }
    
    .project_items .item {
        margin-bottom: 20px;
    }
    
    .project_items .item .overlay {
        padding: 15px;
    }
}