/*
    Template Name    : Xoro
	Description		 : Responsive HTML5 Template.
    Version          : 1.0
*/

/*
================================================
/* Table of Content
==================================================

1. Fonts - Raleway and Opensans
2. Common CSS
3. Loader CSS
4. Scrool top Arrow
5. header-top-area
6. Navigation
7. Slider Area
8. About Us
9. Our Team
10. Counters
11. Services
12. Testimonials Wrapper 
13. Portfolio
14. Blog
15. Pricing Table
16. Contact Us
17. Footer
18. Media Quries 

/*
================================================
1. Fonts - Raleway and Opensans
================================================
*/

/*
================================================
2. Common CSS
================================================
*/
* {
	margin: 0;
	padding: 0;
}
body {
	font-family: 'Open Sans', sans-serif;
	font-size: 14px;
	line-height: 23px;
	font-weight: 400;
	overflow-x: hidden;
}
h1, h2, h3, h4, h5, h6 {
	font-family: 'Raleway', sans-serif;
	margin-top: 0;
	text-transform: none;
	line-height:23px;
	}
h5 {
	font-size: 18px;
}
h6 {
		font-size: 16px;
}
.section-subtitle {
	font-size: 16px;
	font-weight: 600;
	margin: 0;
	line-height: 1.4;
}
.news-title {
	font-size: 18px;
	font-weight: 700;
	line-height: 1.35;
	margin-bottom: 10px;
}
h4{
font-weight:600;
}
p{
font-size:14px;
color:#595959;
}
a, a:hover, a:active, a:focus {
	outline: none;
	border: none;
	font-family:Montserrat,sans-serif;
	text-decoration:none;
}
a {
	transition: opacity 0.3s ease 0s, transform 0.3s ease 0s, color 0.3s ease 0s, background-color 0.3s ease 0s, box-shadow 0.3s ease 0s, border-color 0.3s ease 0s;
}
a:focus, a:hover {
	color: #101010;
}
body, html {
	height: 100%
}
section {
    width: 100%;
    float: left;
    padding: 80px 0;
}
.section-title {
    text-align: center;
    margin: 0 0 25px;
}
section h2 {
	text-align: center;
	text-transform: uppercase;
	letter-spacing: 1px;
	position: relative;
	line-height: 50px;
	display: inline-block;
	text-align: center;
	padding: 12px 10px 10px;
}
.section-title h2 {
	font-size: 35px;
	letter-spacing: 1.2px;
	padding:0 0 10px;
	text-transform: uppercase;
	font-weight: 600;
	margin-bottom:15px;
	position:relative;
}
.margin-bottom-1 {
    margin-bottom: 10px;
}
.margin-bottom-2{
margin-bottom:30px;
}
.padding-1{
padding:10px;
}
.padding-2{
padding:20px;
}
.text-color{
color:#FFFFFF;
}
.space{
padding-bottom:40px;
}
.ln-sp{
width:70%;
margin:0 auto;
}
.ln-sp-2{
width:85%;
}
.line-height-1{
line-height:23px;
}
.line-height-2{
line-height:27px;
}
.bx-shadow{
    -webkit-box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.1);
    -moz-box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.1);
    box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.1);
}
.padding-no{
padding:0;
}
.dvd-line{
border:1px solid #d7d7d7;
width:80%;
}
/*
================================================
3. Loader CSS
================================================
*/
#loader {
    background: #fff;
    width: 100%;
    height: 100%;
    position: fixed;
    z-index: 9999999;
}
#loader::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 48px;
    height: 48px;
    margin: -24px 0 0 -24px;
    border: 4px solid #e5e5e5;
    border-top-color: #3f4d5a;
    border-radius: 50%;
    animation: helios-spin 0.8s linear infinite;
}
@keyframes helios-spin {
    to {
        transform: rotate(360deg);
    }
}
/*
================================================
5. header-top-area
================================================
*/
.header-top-area {
	left: 0;
	position: fixed;
	top: 0;
	width: 100%;
	z-index: 9999;
	-webkit-transition: opacity .4s ease, transform .4s ease, color .4s ease, background-color .4s ease, box-shadow .4s ease, border-color .4s ease;
	transition: opacity .4s ease, transform .4s ease, color .4s ease, background-color .4s ease, box-shadow .4s ease, border-color .4s ease;
}
.logo a {
	font-size: 24px;
	font-weight: 700;
	color: #fff;
	letter-spacing: 2px;
	text-transform:uppercase;
	display: inline-flex;
	align-items: center;
	gap: 8px;
}
.logo {
	padding-top: 14px
}
.logo picture,
.logo img {
	display: block;
}
.logo img {
	max-width: 100%;
	height: auto;
}
.logo span {
	line-height: 1;
}
/*
================================================
6. Navigation
================================================
*/
.menu-bg {
  background: rgba(0, 0, 0, 0.9);
  z-index: 999;
}
.menu-bg .logo {
	padding-top: 29px;
	transition: opacity 0.3s ease 0s, transform 0.3s ease 0s, color 0.3s ease 0s, background-color 0.3s ease 0s, box-shadow 0.3s ease 0s, border-color 0.3s ease 0s;
}
.navbar-default {
	background-color: inherit;
	border-color: inherit;
}
.navbar {
	border-radius: 0;
	min-height: auto;
	margin: 0;
	border: none;
	z-index: 9;
}
.navbar-collapse {
	float: right;
	margin:0;
	padding: 0;
}
.navbar-brand {
	padding: 0;
	height: auto;
}
.navbar-nav > li {
	padding: 0;
}
.navbar-default .navbar-nav li a {
  color: #fff;
  font-size: 13px;
  font-weight: 400;
  padding: 24px 13px;
	transition: opacity 0.3s ease 0s, transform 0.3s ease 0s, color 0.3s ease 0s, background-color 0.3s ease 0s, box-shadow 0.3s ease 0s, border-color 0.3s ease 0s;
  text-transform:uppercase;
}
.menu-bg .navbar-default .navbar-nav li a {
	padding: 24px 13px;
	transition: opacity 0.3s ease 0s, transform 0.3s ease 0s, color 0.3s ease 0s, background-color 0.3s ease 0s, box-shadow 0.3s ease 0s, border-color 0.3s ease 0s;
}
.navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:focus, .navbar-default .navbar-nav > .active > a:hover {
	background-color: inherit;
	color:#e66d0a;
}
.navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:focus, .navbar-default .navbar-nav > .active > a:hover {
	color: #e66d0a;
}
.navbar-default .navbar-nav > li > a:focus, .navbar-default .navbar-nav > li > a:hover {
	color: #e66d0a;
}
.menu-bg .logo a, .menu-bg .navbar-default .navbar-nav li a:hover {
  color: #e66d0a;
}
.menu-bg {
	-webkit-transition: opacity 0.3s ease-out, transform 0.3s ease-out, color 0.3s ease-out, background-color 0.3s ease-out, box-shadow 0.3s ease-out, border-color 0.3s ease-out;
	transition: opacity 0.3s ease-out, transform 0.3s ease-out, color 0.3s ease-out, background-color 0.3s ease-out, box-shadow 0.3s ease-out, border-color 0.3s ease-out;
	/* translucent white with blur for sleek effect on scroll */
	background: rgba(255,255,255,0.85);
	-webkit-backdrop-filter: blur(6px);
	backdrop-filter: blur(6px);
	box-shadow: 0 2px 10px -1px rgba(87, 97, 100, 0.35);
	border: none;
}
.menu-bg .navbar-nav li a{
color:#595959;
}
/*
================================================
7. Slider Area
================================================
*/
.affix + .banner-wrapper {
  margin-top: 49px;
}
.welcome-hero-area,
.home-slider-area,
.home-slider-area #welcome-slide-carousel,
.home-slider-area .carousel-inner,
.home-slider-area .item,
.home-slider-area .single-slide-item,
.home-slider-area .single-slide-item-table,
.home-slider-area .single-slide-item-table-cell {
	height: 100%;
}
.welcome-hero-area,
.home-slider-area {
	height: 100vh;
	min-height: 600px;
}
.welcome-hero-area div.single-slide-item-table-cell {
	height: 100%;
}
.welcome-hero-area div.single-slide-item-table-cell div {
	height: auto;
}
.single-slide-item-table-cell {
	display: table-cell;
	text-align: center;
	vertical-align: middle
}
.single-slide-item-table {
	display: table;
	width: 100%
}
a.slide-btn {
	color: #fff;
	display: inline-block;
	font-weight: 400;
	margin-left: 5px;
	margin-right: 5px;
	margin-top: 10px;
	padding: 12px 20px;
	width: 160px;
	transition: opacity .5s ease, transform .5s ease, color .5s ease, background-color .5s ease, box-shadow .5s ease, border-color .5s ease;
	text-transform:uppercase;
}
a.slide-btn:hover {
	opacity:0.6;
	border: none
}
.single-slide-item h2 {
	font-size: 50px;
	color: #fff;
	line-height: 70px;
	margin-bottom: 20px
}
.single-slide-item h2 span {
	color: #2980b9
}
.single-slide-item p {
	color: #fff;
	margin-bottom: 20px
}
.fixed-bg {
	background-attachment: fixed!important
}
.slide-1, .text-slide {
	background-image: image-set(
	  url('../images/ui/optimized/bg1.avif') type('image/avif') 1x,
      url('../images/ui/optimized/bg1.webp') type('image/webp') 1x,
      url('../images/ui/bg1.jpg') type('image/jpeg') 1x
    );
	background-size: cover
}
.slide-2 {
	background-image: image-set(
	  url('../images/ui/optimized/02.avif') type('image/avif') 1x,
      url('../images/ui/optimized/02.webp') type('image/webp') 1x,
      url('../images/ui/02.jpg') type('image/jpeg') 1x
    );
	background-size: cover
}
.slide-3 {
	background-image: image-set(
	  url('../images/optimized/03.avif') type('image/avif') 1x,
      url('../images/optimized/03.webp') type('image/webp') 1x,
      url('../images/03.png') type('image/png') 1x
    );
	background-size: cover
}
.single-slide-item {
	position: relative;
	z-index: 1
}
.single-slide-item:after {
	background: rgba(0,0,0,.5);
	content: "";
	height: 100%;
	left: 0;
	position: absolute;
	top: 0;
	width: 100%;
	z-index: -1
}
a.welcome-control:focus, a.welcome-control:hover {
	color: #e66d0a;
}
.carousel-fade .carousel-inner .item {
	-webkit-transition-property: opacity;
	transition-property: opacity
}
.carousel-fade .carousel-inner .active.left, .carousel-fade .carousel-inner .active.right, .carousel-fade .carousel-inner .item {
	opacity: 0;
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"
}
.carousel-fade .carousel-inner .active, .carousel-fade .carousel-inner .next.left, .carousel-fade .carousel-inner .prev.right {
	opacity: 1;
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"
}
.carousel-fade .carousel-inner .active.left, .carousel-fade .carousel-inner .active.right, .carousel-fade .carousel-inner .next, .carousel-fade .carousel-inner .prev {
	left: 0;
	-webkit-transform: translate3d(0, 0, 0);
	transform: translate3d(0, 0, 0)
}
.carousel-fade .carousel-control {
	z-index: 2
}
.welcome-control {
	background: 0 0!important;
	border: 1px solid #ddd;
	color: #fff;
	font-size: 40px;
	font-family: inherit;
	font-weight: 700;
	height: 50px;
	left: 0;
	line-height: 46px;
	position: absolute;
	text-align: center;
	top: 50%;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
	width: 50px;
	z-index: 20
}
.service-icon i, .single-featured i {
	border-radius: 50%;
	text-align: center
}
.right.welcome-control {
	left: auto;
	right: -52px
}
.left.welcome-control {
	left: -52px
}
.home-slider-area:hover .right.welcome-control {
	right: 30px;
	transition: .25s;
	-webkit-transition: .25s;
	border:1px solid #fff;
}
.home-slider-area:hover .left.welcome-control {
	left: 30px;
	transition: .25s;
	-webkit-transition: .25s;
	border:1px solid #fff;	
}

#scrollUp {
	background: rgba(255,255,255,0.9);
	border: 1px solid rgba(0,0,0,0.08);
	border-radius: 50%;
	color: #e66d0a;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 20px;
	line-height: 1;
	width: 50px;
	height: 50px;
	box-shadow: -5px 5px 20px rgba(0, 0, 0, 0.2);
}
.featured-area {
	overflow: hidden
}
.single-featured {
	cursor: pointer
}
.single-featured h4 {
	cursor: pointer;
	margin-top: 20px;
	margin-bottom: 10px
}
.single-featured i {
	background: #687074;
	color: #fff;
	display: block;
	font-size: 35px;
	height: 80px;
	line-height: 80px;
	margin: 0 auto 10px;
	width: 80px
}
.service-icon i, a.about-btn, a.get-start-btn, ul.team-social>li, ul.work li {
	display: inline-block
}
.single-featured:hover i {
	background: #33d685;
	color: #fff;
	-webkit-transition: .5s;
	transition: .5s
}
.home-slider-area .carousel-indicators {
  display: none;
}
/*Version-2*/
.slider-sec{
text-align:center;
position: relative;
    background:url(../images/banner4.jpg);
    background-size: cover;
    z-index: 1;
}
.slider-sec h1{
color:#FFFFFF;
}
.slider-sec-text{
padding:200px 0px;
}
a.btn-slider{
border: 1px solid #fff;
    color: #FFFFFF;
    padding: 12px 20px;
}
a.btn-slider:hover{
color:#fff;
background:#e66d0a;
border:1px solid #e66d0a;
}

/*Version-3*/

/*
================================================
7. Youtube Area
================================================
*/

#main-section {
    overflow: hidden;
    padding: 300px 0 185px;
    margin-bottom: 0;
    font-size: 18px;
    line-height: 28px;
    background-image:url(../images/video-bg.jpg);
}
#main-section h1{
margin-bottom: 16px;
    font-size: 48px;
    line-height: 62px;
}
#main-section h6{
color:#FFFFFF;
}
.full-section {
	position: relative;
	z-index: 1;
	padding: 100px 0;
	margin-bottom: 100px;
	background: no-repeat center center;
}
.full-section.dark-section {
    background-color: #212121;
    color: #fff;
}
.full-section-overlay-color {
	position: absolute;
	z-index: 2;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	background: #e100ff;
	background: -webkit-linear-gradient(0deg, #333399, #e100ff);
	background: 	-ms-linear-gradient(0deg, #333399, #e100ff);
	background: 		linear-gradient(0deg, #333399, #e100ff);
	opacity: 0.8;
}

.full-section-container {
	position: relative;
	z-index: 3;
}
#local-video-section,
#youtube-video-section {
	position: absolute;
	z-index: 1;
	overflow: hidden;
	top: 0;
	width: 100%;
	height: 100%;
}

#video-section {
	height: 800px;
	padding: 0;
	margin-bottom: 0;
}

.youtube-player {
	display: none;
}

#video-section .full-section-container {
	position: absolute;
	z-index: 2;
	top: 50%;
	left: 0;
	width: 100%;
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
}

.embed-responsive {
	margin-bottom: 20px;
}

#local-video-section video {
	width: 100%;
}

/*
================================================
 About Us
================================================
*/
.aboutus{
background-color:#f4f4f4;
text-align:center;
}
.aboutus .sec {
	    width: 100%;
    float: left;
    padding: 20px;
    background-color: #fff;
}
.aboutus .sec-box i {
	font-size: 40px;
	height: 64px;
	line-height: 64px;
	text-align: center;
	width: 64px;
	border-radius: 100%;
	color: #e66d0a;
	border: 1px solid #f1f1f1;
	transition: background-color 400ms, background-color 400ms;
	position: relative;
}
.aboutus .sec:hover {
	box-shadow: 0px 10px 10px 7px rgba(0,0,0,0.05);
	-webkit-transition-duration: 0.3s;
	-moz-transition-duration: 0.3s;
	-ms-transition-duration: 0.3s;
	-o-transition-duration: 0.3s;
	transition-duration: 0.3s;
}
/*
================================================
 About Us-2
================================================
*/
.ab-2-box h2{text-align:justify;
font-weight:700;
margin:0;
}
.ab-2-box-sec{
padding:0px 10px;
}
/*
================================================
13. Our Team
================================================
*/
.ourteam {
	width: 100%;
	float: left;
	padding: 65px 0 50px;
}
.team-cnt {
	padding: 0;
	display: inline-block;
	margin: 0;
	width: 100%;
	text-align: center;
}
.team-item {
	margin: 0 0 25px;
}
.team-item-image {
	position: relative;
	overflow: hidden;
	transition: opacity 0.3s ease, transform 0.3s ease, color 0.3s ease, background-color 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
}
.team-item-image img {
	width: 100%;
}
.team-item-image:after {
	content: " ";
	display: block;
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	background: transparent;
	z-index: 1;
	-webkit-transition: opacity 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000), transform 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000), color 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000), background-color 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000), box-shadow 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000), border-color 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);
	-moz-transition: opacity 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000), transform 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000), color 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000), background-color 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000), box-shadow 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000), border-color 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);
	-o-transition: opacity 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000), transform 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000), color 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000), background-color 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000), box-shadow 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000), border-color 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);
	-ms-transition: opacity 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000), transform 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000), color 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000), background-color 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000), box-shadow 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000), border-color 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);
	transition: opacity 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000), transform 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000), color 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000), background-color 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000), box-shadow 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000), border-color 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);
}
.team-item-detail {
	opacity: 0;
	width: 100%;
	position: absolute;
	top: 60%;
	left: 0;
	padding: 20px 23px 55px;
	font-size: 14px;
	font-weight: 300;
	color: #777;
	text-align: center;
	z-index: 2;
	-webkit-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	transform: translateY(-50%);
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	-webkit-transition: opacity 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000), transform 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000), color 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000), background-color 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000), box-shadow 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000), border-color 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);
	-moz-transition: opacity 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000), transform 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000), color 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000), background-color 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000), box-shadow 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000), border-color 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);
	-o-transition: opacity 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000), transform 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000), color 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000), background-color 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000), box-shadow 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000), border-color 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);
	-ms-transition: opacity 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000), transform 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000), color 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000), background-color 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000), box-shadow 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000), border-color 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);
	transition: opacity 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000), transform 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000), color 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000), background-color 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000), box-shadow 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000), border-color 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);
}
.team-item-descr {
background-color:#e66d0a;
	color: #777;
	text-align: center;
	padding:20px 0;
	-webkit-transition: opacity 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000), transform 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000), color 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000), background-color 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000), box-shadow 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000), border-color 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);
	-moz-transition: opacity 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000), transform 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000), color 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000), background-color 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000), box-shadow 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000), border-color 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);
	-o-transition: opacity 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000), transform 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000), color 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000), background-color 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000), box-shadow 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000), border-color 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);
	-ms-transition: opacity 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000), transform 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000), color 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000), background-color 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000), box-shadow 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000), border-color 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);
	transition: opacity 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000), transform 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000), color 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000), background-color 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000), box-shadow 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000), border-color 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);
}
.team-item-detail h4 {
	margin: 0 0 10px;
	line-height: normal;
}
.team-item-name {
	font-size: 18px;
	font-weight: 600;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color:#fff;
}
.team-item-role {
	margin-top: 4px;
	font-size: 12px;
	text-transform: uppercase;
	letter-spacing: 0.4em;
	color: #eee;
}
.team-social-links {
	font-size: 14px;
	cursor: pointer;
}
.team-social-links a {
	display: inline-block;
	padding: 3px 7px;
	color: rgba(0,0,0, .4);
	-webkit-transition: opacity 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000), transform 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000), color 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000), background-color 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000), box-shadow 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000), border-color 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);
	-moz-transition: opacity 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000), transform 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000), color 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000), background-color 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000), box-shadow 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000), border-color 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);
	-o-transition: opacity 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000), transform 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000), color 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000), background-color 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000), box-shadow 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000), border-color 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);
	-ms-transition: opacity 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000), transform 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000), color 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000), background-color 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000), box-shadow 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000), border-color 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);
	transition: opacity 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000), transform 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000), color 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000), background-color 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000), box-shadow 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000), border-color 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);
}
/* Hover state */
.team-item:hover .team-item-image:after{
	background: rgba(255,255,255, .93);
}
.team-item:hover .team-item-descr {
	background: rgba(230,230,230, 0.3);
}
.team-item:hover .team-item-detail {
	opacity: 1;
}
.team-item:hover .team-item-descr {
	color: #111;
}
.team-item:hover .team-item-name {
	color:#000;
	}
.team-item:hover .team-item-role {
	color:#444;
	}	
.team-social-links a:hover {
	color: rgba(0,0,0, .75);
}
/* Mobile touch */
.team-item.js-active .team-item-image:after, .team-item-descr:after {
	background: rgba(255,255,255, .93);
}
.team-item.js-active .team-item-detail {
	opacity: 1;
}
.team-item.js-active .team-item-descr {
	color: #111;
}
.team-item.js-active .team-social-links a:hover {
	color: rgba(0,0,0, .75);
}
/*
================================================
11. Services
================================================
*/
.services {
background:#f8f8f8;
	padding: 65px 0 80px;
}
.services .section-title {
	margin:0;
	}
.service-callouts {
	text-align: center;
}
.service-callouts h2 {
	font-size: 20px;
	margin: 0 0 10px;
	line-height: normal;
	padding: 0;
	font-size:1.6rem;
	font-weight:600;
	text-transform:capitalize;
}
.single-service {
    position: relative;
    text-align: left;
    background-color: #fff;
    color: #333;
    padding: 40px 20px 20px;
    font-weight: 400;
	margin:25px 0 0;
	-webkit-transition: opacity 0.3s ease 0s, transform 0.3s ease 0s, color 0.3s ease 0s, background-color 0.3s ease 0s, box-shadow 0.3s ease 0s, border-color 0.3s ease 0s;
	-moz-transition: opacity 0.3s ease 0s, transform 0.3s ease 0s, color 0.3s ease 0s, background-color 0.3s ease 0s, box-shadow 0.3s ease 0s, border-color 0.3s ease 0s;
	-o-transition: opacity 0.3s ease 0s, transform 0.3s ease 0s, color 0.3s ease 0s, background-color 0.3s ease 0s, box-shadow 0.3s ease 0s, border-color 0.3s ease 0s;
	transition: opacity 0.3s ease 0s, transform 0.3s ease 0s, color 0.3s ease 0s, background-color 0.3s ease 0s, box-shadow 0.3s ease 0s, border-color 0.3s ease 0s;
}

.single-service h1,h2,h3,h4,h5,h6{
	text-align: center;
}
.single-service .service-icon {
    border-radius: 50%;
    display: block;
    font-size: 40px;
    height: 120px;
    line-height: 129px;
    margin: 0 auto 20px;
    text-align: center;
    width: 120px;
}
.single-service h3,
.single-service h3 a {
    font-size: 18px;
    font-weight: 700;
    line-height: 1.35;
    letter-spacing: 0;
    text-transform: capitalize;
    color: #333;
    margin-bottom: 10px;
    font-family: 'Raleway', sans-serif;
    margin-top: 0;
}
.single-service:before,
.single-service:after {
    position: absolute;
    content: "";
	-webkit-transition: opacity .3s ease 0s, transform .3s ease 0s, color .3s ease 0s, background-color .3s ease 0s, box-shadow .3s ease 0s, border-color .3s ease 0s;
	-moz-transition: opacity 0.3s ease 0s, transform 0.3s ease 0s, color 0.3s ease 0s, background-color 0.3s ease 0s, box-shadow 0.3s ease 0s, border-color 0.3s ease 0s;
	-o-transition: opacity 0.3s ease 0s, transform 0.3s ease 0s, color 0.3s ease 0s, background-color 0.3s ease 0s, box-shadow 0.3s ease 0s, border-color 0.3s ease 0s;
	transition: opacity 0.3s ease 0s, transform 0.3s ease 0s, color 0.3s ease 0s, background-color 0.3s ease 0s, box-shadow 0.3s ease 0s, border-color 0.3s ease 0s;
    height: 0;
    width: 3px;
}
.single-service:before {
    top: 0;
    left: 0;
}
.single-service:after {
    bottom: 0;
    right: 0;
}
.single-service:hover:before,
.single-service:hover:after {
    height: 90px;
}
.service-bar {
    position: absolute;
    content: "";
    left: 0;
    top: 0;
    height: 100%;
    width: 100%;
}
.single-service .service-bar:before,
.single-service .service-bar:after {
    background-color: #e66d0a;
}
.single-service:before,
.single-service:after {
    background-color: #e66d0a;
}
.single-service .service-icon {
    box-shadow: 0 0 0 8px #fff inset, 0 0 5px 0 rgba(51, 214, 133, 0.24);
    color: #e66d0a;
}
.single-service .service-bar:before,
.single-service .service-bar:after {
    position: absolute;
    content: "";
    width: 0;
    height: 3px;
	-webkit-transition: opacity .3s ease 0s, transform .3s ease 0s, color .3s ease 0s, background-color .3s ease 0s, box-shadow .3s ease 0s, border-color .3s ease 0s;
	-moz-transition: opacity 0.3s ease 0s, transform 0.3s ease 0s, color 0.3s ease 0s, background-color 0.3s ease 0s, box-shadow 0.3s ease 0s, border-color 0.3s ease 0s;
	-o-transition: opacity 0.3s ease 0s, transform 0.3s ease 0s, color 0.3s ease 0s, background-color 0.3s ease 0s, box-shadow 0.3s ease 0s, border-color 0.3s ease 0s;
	transition: opacity 0.3s ease 0s, transform 0.3s ease 0s, color 0.3s ease 0s, background-color 0.3s ease 0s, box-shadow 0.3s ease 0s, border-color 0.3s ease 0s;
}
.single-service .service-bar:before {
    right: 50%;
    top: 0;
}
.single-service .service-bar:after {
    left: 50%;
    bottom: 0;
}
.single-service:hover .service-bar:after,
.single-service:hover .service-bar:before {
    width: 50%;
}
.single-service:hover {
    box-shadow: 0 15px 20px 0 rgba(0, 0, 0, 0.12);
}
.single-service:hover .service-icon {
    background-color: #333;
}
/*
================================================
13. Portfolio
================================================
*/
.portfolio {
	clear: both;
	float: left;
	width: 100%;
	padding: 70px 0 50px;
}
.work {
	margin-bottom: 30px;
}
.work a {
	display: block;
	overflow: hidden;
	position: relative;
}
.work-inner {
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
	display: block;
	padding: 20px;
}
.work-inner:after {
	content: "";
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
	background: #000;
	opacity: 0;
	-webkit-transition: opacity 0.4s ease, transform 0.4s ease, color 0.4s ease, background-color 0.4s ease, box-shadow 0.4s ease, border-color 0.4s ease;
	transition: opacity 0.4s ease, transform 0.4s ease, color 0.4s ease, background-color 0.4s ease, box-shadow 0.4s ease, border-color 0.4s ease;
	z-index: 1;
}
.work:hover .work-inner:after {
	opacity: 0.8;
}
.work-info {
	text-align: center;
	margin-top: 40%;
	top: -15px;
	position: relative;
}
.work-info h2:after {
	display:none;
	}
.work-info p, .work-info h2, .work-info i {
	position: relative;
	z-index: 2;
	opacity: 0;
	-webkit-transition: opacity 0.3s ease, transform 0.3s ease, color 0.3s ease, background-color 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
	transition: opacity 0.3s ease, transform 0.3s ease, color 0.3s ease, background-color 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
}
.work-info h2 {
	font-size: 20px;
	color: #fff;
	top: -10px;
	margin: 0;
	padding: 0;
	line-height: 35px;
}
.work-info p {
	font-size: 12px;
	top: 10px;
	font-weight: 700;
	-webkit-transition: opacity 0.6s ease, transform 0.6s ease, color 0.6s ease, background-color 0.6s ease, box-shadow 0.6s ease, border-color 0.6s ease;
}
.work-info i {
	font-size: 14px;
	top: 20px;
	font-weight: 700;
	-webkit-transition: opacity 0.6s ease, transform 0.6s ease, color 0.6s ease, background-color 0.6s ease, box-shadow 0.6s ease, border-color 0.6s ease;
	transition: opacity 0.6s ease, transform 0.6s ease, color 0.6s ease, background-color 0.6s ease, box-shadow 0.6s ease, border-color 0.6s ease;
	color: #333;
	background: #fff;
	border-radius: 50%;
	width: 30px;
	height: 30px;
	line-height: 30px;
}
.work:hover .work-info p, .work:hover .work-info h2, .work:hover .work-info i {
	opacity: 1;
	top: 0;
}
.portfolio-filter {
	text-align: center;
	list-style: none;
	margin-bottom:20px;
}
.portfolio-filter li.active, .portfolio-filter li:hover{
    border-style: solid;
    border-width: 1px 0;
	color:#e66d0a;
	-webkit-transition: opacity .3s ease 0s, transform .3s ease 0s, color .3s ease 0s, background-color .3s ease 0s, box-shadow .3s ease 0s, border-color .3s ease 0s;
	-moz-transition: opacity 0.3s ease 0s, transform 0.3s ease 0s, color 0.3s ease 0s, background-color 0.3s ease 0s, box-shadow 0.3s ease 0s, border-color 0.3s ease 0s;
	-o-transition: opacity 0.3s ease 0s, transform 0.3s ease 0s, color 0.3s ease 0s, background-color 0.3s ease 0s, box-shadow 0.3s ease 0s, border-color 0.3s ease 0s;
	transition: opacity 0.3s ease 0s, transform 0.3s ease 0s, color 0.3s ease 0s, background-color 0.3s ease 0s, box-shadow 0.3s ease 0s, border-color 0.3s ease 0s;
	}
.portfolio-filter li {
	display: inline-table;
	text-transform: uppercase;
	font-size: 13px;
	padding: 8px;
	margin: 0 5px 10px;
	cursor: pointer;
	position: relative;
    border-style: solid;
    border-width: 1px 0;	
}
.portfolio-filter li:after {
	position: absolute;
	content: "";
	width: 0;
	height: 3px;
	left: 0;
	bottom: 0;
	-webkit-transition: opacity 0.4s ease, transform 0.4s ease, color 0.4s ease, background-color 0.4s ease, box-shadow 0.4s ease, border-color 0.4s ease;
	transition: opacity 0.4s ease, transform 0.4s ease, color 0.4s ease, background-color 0.4s ease, box-shadow 0.4s ease, border-color 0.4s ease;
}
.portfolio-filter li.active:after {
	width: 100%;
}
.work-popup {
	max-width: 550px;
	background: #fff;
	position: relative!important;
	margin: 30px auto;
	left: 0!important;
}
.work-info p {
    color: #e66d0a;
}
.work-popup img {
	width: 100%;
	height: 100%;
}
.work-popup-content {
	padding: 25px;
}
.work-popup-content h3 {
	font-size: 26px;
	margin-bottom: 20px;
}
.work-popup-content p {
	text-align: left;
	line-height: 23px;
}
.mfp-close-btn-in .mfp-close {
	position: absolute;
	background: #fff;
	font-size: 40px;
	width: 50px;
	height: 50px;
	opacity: 1;
	box-shadow: -5px 5px 20px rgba(0, 0, 0, 0.2);
}
/*
================================================
14. Testimonials Wrapper 
================================================
*/
.testimonials-wrapper {
	width: 100%;
	float: left;
	background-image: image-set(
	  url('../images/optimized/counters-bg.avif') type('image/avif') 1x,
      url('../images/optimized/counters-bg.webp') type('image/webp') 1x,
      url('../images/counters-bg.jpg') type('image/jpeg') 1x
    ); background-repeat: repeat; background-position: left top;
	padding: 65px 0 80px;
	background-attachment:fixed;
}
.testimonials-wrapper blockquote {
	border-left: none;
	margin: 0;
	background: #fff;
	padding: 60px 40px;
	text-align:center;
}
.testimonials-wrapper blockquote h3 {
	text-transform: none;
	font-size: 20px;
}
.testimonials-wrapper h2{
color:#FFFFFF;
}
.testimonials-wrapper p {
	color: #595959;
	font-size: 15px;
	line-height: 25px;
	margin: 0 0 30px;
	padding: 0;
}
.testimonials-wrapper h3 {
	color: #333;
	font-size: 18px;
	font-weight: 600;
	letter-spacing: 1px;
	margin: 0 0 15px;
	text-transform: uppercase;
}
.testimonials-wrapper h3 i {
	font-size: 20px;
}
.testimonials-wrapper h4 {
	color: #777;
	letter-spacing: 1px;
}
.testimonials-wrapper .carousel-indicators .active {
    background-color: #e66d0a;
}
.testimonials-wrapper .carousel-indicators li {
    background-color: #e66d0a;
}
.testimonials-wrapper .carousel-indicators {
	bottom: 70px;
	right: 6%;
	width: auto;
	margin: 0;
	left: auto;
}
.testimonials-wrapper .carousel-indicators li:first-child {
	margin: 0;
}
.testimonials-wrapper .carousel-indicators li {
	height: 15px;
	margin: 0 0 0 5px;
	width: 4px;
	border-radius: 0;
	border: none;
	transition: opacity 0.2s ease 0s, transform 0.2s ease 0s, color 0.2s ease 0s, background-color 0.2s ease 0s, box-shadow 0.2s ease 0s, border-color 0.2s ease 0s;
}
.testimonials-wrapper .carousel-indicators .active {
	height: 25px;
	width: 4px;
	border: none;
}
.testimonials-wrapper .client-name {
	margin-top: 15px;
}
.testimonials-wrapper .client-name p {
	margin: 0;
}
.testimonials-wrapper .client-name p b {
	font-weight: 700;
}
.testimonials-wrapper .test-img img {
	border: 2px solid #f5f5f5;
	border-radius: 50%;
	padding: 5px 5px 0;
	width:auto;
}
/*
================================================
16. Pricing Table
================================================
*/
.pricing-table-wrapper {
	background: #f7f7f7;
	padding: 65px 0 76px;
}
.pricing-table-wrapper .pricing-table {
	display: inline-block;
	margin: 10px 0 0;
	padding: 0;
	width: 100%;
}
.pricing-table-wrapper .price-content-wrap {
	background: #fff;
	border-top: 2px solid #333;
	padding: 30px 0 55px;
	text-align: center;
	box-shadow: 0 0 17px 2px rgba(0, 0, 0, 0.1);
}
.pricing-table-wrapper .plan-name {
	display: inline-block;
	width:85%;
	background:rgba(0, 0, 0, 0.03);
	margin:0 0 30px;
	padding:15px 0 20px;
}
.pricing-table-wrapper .price-title {
  display: inline-block;
  font-size: 30px;
  font-weight: 600;
  letter-spacing: 1px;
  padding: 10px 15px 0;
  width: 100%;
}
.pricing-table-wrapper .price-amount {
	font-size: 48px;
	font-weight: 800;
	margin: 0 auto;
	padding: 12px 10px 0;
	text-transform: uppercase;
	display: block;
}
.pricing-table-wrapper .price-amount span {
	font-size: 24px;
	color: #000;
}
.pricing-table-wrapper .price-date {
	color: #757575;
	font-size: 12px;
	font-weight: 700;
	margin-top: 5px;
	text-transform: uppercase;
	margin-bottom:0;
}
.pricing-table-wrapper .price-details {
	font-size: 16px;
	font-weight: 500;
	list-style: none;
}
.pricing-table-wrapper .price-details li {
	padding: 6px 0;
}
.pricing-table-wrapper .price-btn {
	margin-top: 30px;
}
.price-btn {
	background: #333;
	color: #fff;
}
.pricing-table-wrapper .features-price-btn:hover {
	background: #333;
	color: #fff;
}
.features-price-btn {
    background: #e66d0a;
}
.pricing-table-wrapper .features-price .plan-name {
    background: #e66d0a;
}
.pricing-table-wrapper .features-price .plan-name p{color:#FFFFFF;
}
.pricing-table-wrapper .features-price .plan-name .price-amount, .pricing-table-wrapper .features-price .plan-name .price-amount span {
    color: #fff;
}
.pricing-table-wrapper .price-btn:hover {
	background: #e66d0a;
}
.pricing-table-wrapper .features-price .plan-name .price-title {
	color:#fff;
	}
.pricing-table-wrapper .btn {
	border-radius: 0;
	color: #fff;
	font-weight: 700;
	padding: 15px 25px;
	text-transform: uppercase;
	transition: opacity 0.3s ease 0s, transform 0.3s ease 0s, color 0.3s ease 0s, background-color 0.3s ease 0s, box-shadow 0.3s ease 0s, border-color 0.3s ease 0s !important;
	border: none;
}
/*
================================================
16. Section-Feature
================================================
*/
.feature-sec{
background-color:#e66d0a;
text-align:center;
}
.feature-sec h3{
color:#FFFFFF;
letter-spacing:5px;
text-transform:uppercase;
}
.feature-sec h1{
color:#FFFFFF;
font-weight:900;
letter-spacing:5px;
}
.feature-sec h6{
color:#FFFFFF;
}
.feature-sec a.btn{
border:1px solid #fff;
color:#FFFFFF;
padding:12px 20px;
}
.feature-sec a.btn:hover{
background:#FFFFFF;
color:#595959;
}
/*
================================================
14. Blog
================================================
*/
.blog-wrapper {
	background: #f7f7f7;
	position: relative;
	z-index: 99;
}
.blog-wrapper .section-title {
	margin:0 0 -5px;
	}
.blog-wrapper .single-blog-post {
	margin-top: 30px
}
.blog-wrapper .single-post-content {
  padding: 20px;
}
.blog-wrapper .single-post-content {
	background: #fff
}
.blog-wrapper .single-post-content a {
	color: #595959
}
.blog-wrapper .single-post-content h4 {
  margin-top: 15px;
  text-transform: uppercase;
}
.blog-wrapper .single-post-content h4:hover a {
	color: #e66d0a;
}
.blog-wrapper a.blog-btn {
  color: #fff;
  font-size: 12px;
  padding: 8px 12px;
  text-transform:capitalize;
}
.blog-wrapper .post-meta i {
  margin-right: 5px;
}
.blog-wrapper ul.post-meta {
  list-style: outside none none;
}
.package-btn, a.blog-btn, ul.post-meta li {
  display: inline-block;
}
.post-meta a {
	color: #595959;
  font-size: 14px;
  font-weight: 400;
  margin-right: 10px;
}
.single-blog-post:hover, .single-team:hover {
	    box-shadow: 0px 10px 10px 7px rgba(0,0,0,0.05);
	-webkit-transition: opacity .3s ease 0s, transform .3s ease 0s, color .3s ease 0s, background-color .3s ease 0s, box-shadow .3s ease 0s, border-color .3s ease 0s;
	-moz-transition: opacity 0.3s ease 0s, transform 0.3s ease 0s, color 0.3s ease 0s, background-color 0.3s ease 0s, box-shadow 0.3s ease 0s, border-color 0.3s ease 0s;
	-o-transition: opacity 0.3s ease 0s, transform 0.3s ease 0s, color 0.3s ease 0s, background-color 0.3s ease 0s, box-shadow 0.3s ease 0s, border-color 0.3s ease 0s;
	transition: opacity 0.3s ease 0s, transform 0.3s ease 0s, color 0.3s ease 0s, background-color 0.3s ease 0s, box-shadow 0.3s ease 0s, border-color 0.3s ease 0s;
}
/*
================================================
15. Client
================================================
*/
.client{
background-color:#f1f1f1;
padding:60px 0px;
}
.client-img{
padding:12px 20px;
border:2px solid #f1f1f1;
}
.client-img:hover{
border:2px solid #d8d8d8;
-webkit-transition: opacity .3s ease 0s, transform .3s ease 0s, color .3s ease 0s, background-color .3s ease 0s, box-shadow .3s ease 0s, border-color .3s ease 0s;
	-moz-transition: opacity 0.3s ease 0s, transform 0.3s ease 0s, color 0.3s ease 0s, background-color 0.3s ease 0s, box-shadow 0.3s ease 0s, border-color 0.3s ease 0s;
	-o-transition: opacity 0.3s ease 0s, transform 0.3s ease 0s, color 0.3s ease 0s, background-color 0.3s ease 0s, box-shadow 0.3s ease 0s, border-color 0.3s ease 0s;
	transition: opacity 0.3s ease 0s, transform 0.3s ease 0s, color 0.3s ease 0s, background-color 0.3s ease 0s, box-shadow 0.3s ease 0s, border-color 0.3s ease 0s;
}
/*
================================================
16. Contact Us
================================================
*/
.contactus {
	padding: 60px 0 80px;
	background: #fff;
}
.contact-info {
    margin-bottom: 50px;
    overflow: hidden;
}
.single-contact {
    text-align: center;
  	padding: 15px 0;	
}
.single-contact h3 {
    color: #333;
    font-size: 18px;
    font-weight: 700;
    letter-spacing: 0;
    line-height: 1.35;
    margin:25px 0 5px;
    text-transform: uppercase;
    font-family: 'Raleway', sans-serif;
    margin-top: 0;
}
.single-contact p {
    margin-bottom: 0;
}
.single-contact i {
  border-radius: 50%;
  box-shadow: 0 0 0 8px #ffffff inset, 0 0 5px 0 rgba(51, 214, 133, 0.24);
  color: #fff;
  font-size: 29px;
  height: 70px;
  line-height: 70px;
  padding: 30px;
  text-align: center;
  width: 80px;
}
.single-contact i {
    background: #e66d0a;
}
.form-control {
    background: none repeat scroll 0 center rgba(0, 0, 0, 0);
    border-color: transparent transparent #ddd;
    border-radius: 0;
    border-style: none none solid;
    border-width: medium medium 1px;
    box-shadow: none;
    height: 45px;
    margin-bottom: 20px;
    padding: 0;
	-webkit-transition: opacity 0.3s ease 0s, transform 0.3s ease 0s, color 0.3s ease 0s, background-color 0.3s ease 0s, box-shadow 0.3s ease 0s, border-color 0.3s ease 0s;
	-moz-transition: opacity 0.3s ease 0s, transform 0.3s ease 0s, color 0.3s ease 0s, background-color 0.3s ease 0s, box-shadow 0.3s ease 0s, border-color 0.3s ease 0s;
	-o-transition: opacity 0.3s ease 0s, transform 0.3s ease 0s, color 0.3s ease 0s, background-color 0.3s ease 0s, box-shadow 0.3s ease 0s, border-color 0.3s ease 0s;
	transition: opacity 0.3s ease 0s, transform 0.3s ease 0s, color 0.3s ease 0s, background-color 0.3s ease 0s, box-shadow 0.3s ease 0s, border-color 0.3s ease 0s;
}
.form-control::-moz-placeholder {
    opacity: 1;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
}
.form-control:hover,
.form-control:focus {
    border-color: #e66d0a;
    box-shadow: none;
}
.contact-form .btn-contact {
    color: #fff;
    font-weight: 700;
    padding: 12px 30px;
    letter-spacing: 0;
    text-transform: uppercase;
	border-radius:0;
}
.btn-contact:hover {
    background-color: #333;
    color: #fff;
}
.contact-form .btn-contact {
    background-color: #e66d0a;
    border: 1px solid #e66d0a;
}
/*
================================================
16. Contact Us
================================================
*/
footer{background-color:#e66d0a;
padding: 25px 0;
    width: 100%;
    float: left;
}
footer p {
    color: #fff;
    text-align: center;
    margin: 0;
	}

.contact-map-box {
	background: #fff;
	border: 1px solid rgba(0, 0, 0, 0.08);
	border-radius: 6px;
	padding: 28px;
	min-height: 200px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.06);
}
.contact-map-box p {
	color: #3f4d5a;
	margin-bottom: 14px;
}
.contact-map-link {
	display: inline-block;
	background: #e66d0a;
	color: #fff;
	padding: 12px 18px;
	border-radius: 4px;
	font-weight: 600;
}
.contact-map-link:hover,
.contact-map-link:focus {
	color: #fff;
	background: #c85d09;
}
	
	
/*
================================================
Search Panel
================================================
*/
#search-toggle {
  background: none;
  border: none;
  color: #fff;
  cursor: pointer;
  padding: 24px 13px;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  font-size: 13px;
  font-weight: 400;
  font-family: 'Open Sans', sans-serif;
  text-transform: uppercase;
  transition: color 0.3s ease;
  vertical-align: middle;
  line-height: 1;
}
#search-toggle:hover { color: #e66d0a; }
.menu-bg #search-toggle { color: #595959; }
.menu-bg #search-toggle:hover { color: #e66d0a; }

.search-panel {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  background: #fff;
  z-index: 9990;
  box-shadow: 0 8px 30px rgba(0,0,0,0.13);
  /* translateY(-100%) = déplace vers le haut de exactement la hauteur du panneau
     → bord inférieur toujours à 0px du viewport, jamais visible */
  transform: translateY(-100%);
  visibility: hidden;
  pointer-events: none;
  transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1),
              visibility 0s linear 0.35s; /* visibility cachée après fin d'animation */
  max-height: 100vh;
  overflow-y: auto;
  padding: 90px 0 36px; /* fallback : ~70px navbar + 20px espace ; recalculé par JS */
}
.search-panel.is-open {
  transform: translateY(0);
  visibility: visible;
  pointer-events: auto;
  transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1),
              visibility 0s linear 0s; /* visibility visible immédiatement à l'ouverture */
}

.search-top-bar {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 16px;
}
.search-input-wrap {
  flex: 1;
  display: flex;
  align-items: center;
  border: 2px solid #e66d0a;
  border-radius: 4px;
  overflow: hidden;
  background: #fff;
  transition: box-shadow 0.2s ease;
}
.search-input-wrap:focus-within {
  box-shadow: 0 0 0 3px rgba(230,109,10,0.15);
}
.search-icon-wrap {
  padding: 0 12px;
  color: #e66d0a;
  display: flex;
  align-items: center;
  flex-shrink: 0;
}
#search-input {
  flex: 1;
  border: none;
  outline: none;
  padding: 11px 8px;
  font-size: 15px;
  font-family: 'Open Sans', sans-serif;
  color: #333;
  background: transparent;
  height: auto;
  margin-bottom: 0;
  box-shadow: none;
  border-radius: 0;
}
#search-input::placeholder { color: #bbb; }
.search-clear-btn {
  background: none;
  border: none;
  color: #aaa;
  font-size: 22px;
  cursor: pointer;
  padding: 0 12px;
  display: none;
  align-items: center;
  line-height: 1;
  transition: color 0.2s;
}
.search-clear-btn:hover { color: #e66d0a; }
.search-close-btn {
  background: none;
  border: 1px solid #ddd;
  border-radius: 4px;
  color: #777;
  font-size: 12px;
  cursor: pointer;
  padding: 10px 18px;
  font-family: 'Open Sans', sans-serif;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  transition: border-color 0.2s, color 0.2s;
  flex-shrink: 0;
}
.search-close-btn:hover { border-color: #e66d0a; color: #e66d0a; }

.search-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 10px;
  margin-bottom: 20px;
  padding-bottom: 14px;
  border-bottom: 1px solid #f0f0f0;
}
.search-filters { display: flex; gap: 8px; flex-wrap: wrap; }
.filter-btn {
  background: #f4f4f4;
  border: 1px solid #e0e0e0;
  border-radius: 20px;
  color: #595959;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  cursor: pointer;
  padding: 6px 16px;
  font-family: 'Open Sans', sans-serif;
  transition: background 0.2s, border-color 0.2s, color 0.2s;
}
.filter-btn:hover { border-color: #e66d0a; color: #e66d0a; }
.filter-btn.active { background: #e66d0a; border-color: #e66d0a; color: #fff; }

.search-sort-wrap { display: flex; align-items: center; gap: 8px; }
.search-sort-label {
  font-size: 11px;
  color: #aaa;
  text-transform: uppercase;
  font-weight: 700;
  letter-spacing: 0.5px;
  white-space: nowrap;
}
#search-sort {
  border: 1px solid #e0e0e0;
  border-radius: 4px;
  padding: 6px 10px;
  font-size: 13px;
  font-family: 'Open Sans', sans-serif;
  color: #595959;
  background: #fff;
  cursor: pointer;
  height: auto;
  margin-bottom: 0;
  box-shadow: none;
}
#search-sort:focus { border-color: #e66d0a; outline: none; box-shadow: none; }

.search-results {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 14px;
}
.search-result-card {
  background: #f8f8f8;
  border: 1px solid #eee;
  border-radius: 6px;
  padding: 18px;
  transition: box-shadow 0.2s, border-color 0.2s;
}
.search-result-card:hover { box-shadow: 0 4px 16px rgba(230,109,10,0.11); border-color: #e66d0a; }
.result-badge {
  display: inline-block;
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.8px;
  padding: 3px 10px;
  border-radius: 3px;
  margin-bottom: 10px;
  color: #fff;
}
.result-badge--actu    { background: #2980b9; }
.result-badge--produit { background: #27ae60; }
.result-badge--projet  { background: #8e44ad; }
.result-badge--apropos { background: #e66d0a; }
.result-title { font-size: 14px; font-weight: 700; margin: 0 0 8px; line-height: 1.45; }
.result-title a { color: #3f4d5a; }
.result-title a:hover { color: #e66d0a; }
.result-title mark,
.result-excerpt mark { background: #fff3cd; color: inherit; border-radius: 2px; padding: 0 2px; font-style: normal; }
.result-excerpt { font-size: 13px; color: #777; line-height: 1.6; margin: 0 0 10px; }
.result-ext-link {
  display: inline-block;
  font-size: 11px;
  font-weight: 700;
  color: #e66d0a;
  text-transform: uppercase;
  letter-spacing: 0.4px;
}
.result-ext-link:hover { color: #c85d09; }
.search-empty,
.search-initial {
  text-align: center;
  padding: 28px 0;
  color: #bbb;
  font-size: 14px;
}
.search-empty svg,
.search-initial svg { display: block; margin: 0 auto 12px; opacity: 0.35; }

/*
================================================
Bouton contact (lien mailto)
================================================
*/
.contact-modal-btn {
  display: block;
  width: 100%;
  margin-top: 16px;
  background: #e66d0a;
  color: #fff;
  font-weight: 700;
  padding: 12px 20px;
  text-align: center;
  text-transform: uppercase;
  border-radius: 4px;
  font-size: 13px;
  letter-spacing: 0.5px;
  font-family: 'Open Sans', sans-serif;
  transition: background 0.2s;
}
.contact-modal-btn:hover,
.contact-modal-btn:focus { background: #c85d09; color: #fff; }

/*
================================================
Section Actualités — bannière responsive
================================================
*/
.aboutus-2 .container > picture {
  display: block;
  width: 100%;
  overflow: hidden;
}
.aboutus-2 .container > picture img {
  width: 100%;
  height: auto;
  display: block;
  max-width: 100%;
}

/*
================================================
18. Media Quries
================================================
*/
/* ── Desktop ≥992px : flexbox pour centrage parfait logo + nav ── */
@media (min-width: 992px) {
  .header-top-area .container > .row {
    display: flex;
    align-items: center;
  }
  .header-top-area .col-md-3,
  .header-top-area .col-md-9 {
    float: none;
  }
  .logo {
    padding-top: 0;
  }
  .menu-bg .logo {
    padding-top: 0;
  }
}

@media (min-width: 768px) and (max-width: 991px) {
.navigation {
	padding: 0;
}
.logo {
  float: left;
}
.menu-bg .logo {
  padding-top: 14px;
}
.navbar-toggle {
  margin-right: 0;
  margin-top: -34px;
}
.navbar-default .navbar-nav li a {
  font-size: 12px;
  padding: 20px 11px;
}
#search-toggle {
  padding: 20px 10px;
}
.navbar-collapse {
  margin: 6px 0 0;
}
.navigation .navbar-collapse {
	padding: 0;
}
.navbar {
	margin-top:0px;
}
.aboutus .sec {
    margin-bottom: 30px;
}
.pricing-table .space1 {
	margin-top: 30px;
}
.feature-sec h1 {
    letter-spacing:0px;
}
div.team-cnt div {
	margin: 0 0 15px;
	text-align: center;
}
.contact-info-content p span {
	padding:8px 0 0;
	}
.contact-info-content {
	padding:36px 25px
	}
#scrool-top {
	right: 15px;
}
}
@media (max-width: 767px) {
.search-toolbar { flex-direction: column; align-items: flex-start; }
.search-sort-wrap { width: 100%; }
#search-sort { width: 100%; }
.search-results { grid-template-columns: 1fr; }
.search-label { display: none; }
#search-toggle { padding: 14px 10px; }
section h2 {
	font-size: 25px;
}
.navbar-default .navbar-toggle .icon-bar {
	background: #e66d0a
}
.menu-bg .navbar-toggle .icon-bar {
	background: #e66d0a
}
.menu-bg .navbar-toggle {
	margin-top: -40px;
	}
.navbar-toggle {
	margin-right: 0;
	margin-top: -40px;
	border:none;
	}
.menu-bg .navbar-collapse, .navbar-collapse {
  background: #fff none repeat scroll 0 0;
}
.navbar-default .navbar-toggle:hover, .navbar-default .navbar-toggle:focus {
	background:none;
	}
.navbar-default .navbar-nav li a, .menu-bg .navbar-default .navbar-nav li a {
  padding: 11px 15px;
  color:#333;
}
.menu-bg .logo {
	padding: 14px 0 0;
}
header .navbar-nav {
  margin: 7.5px 0;
}
.navbar {
	margin: 0;
}
.navbar-brand {
	display: block;
	padding: 0;
	height: auto;
}
.navbar-default .navbar-collapse {
	float: none;
	border: none;
	box-shadow: none;
}
a.slide-btn {
  font-size: 14px;
  padding: 8px 16px;
  width: 120px;
}
.welcome-control {
  display: none;
}
.single-slide-item h2 {
  font-size: 24px;
  line-height: 26px;
}
.aboutus .sec {
    margin-bottom: 30px;
}
.ab-2-box h2 {
    text-align:center;
}
.dvd-line {
    width: 100%;
}
.counter {
	margin: 0 0 50px;
}
.counters {
	padding-bottom: 30px;
	margin:0;
}
div.team-cnt > div > div {
	margin: 0 0 25px;
	text-align: center;
}
.ourteam {
	padding: 66px 0 40px;
}
.feature-sec h1 {
    letter-spacing: 3px;
}
.blog-wrapper {
	padding: 65px 0 45px;
}
.callouts {
	padding: 0;
}
#scrool-top {
	right: 15px;
}

}