/*
 Theme Name:   Template CPL 2024
 Theme URI:    https://www.commparlimage.ca/
 Description:  Thème en développement
 Author:       Jordan Ouellet
 Author URI:   https://www.commparlimage.ca
 Template:     blankslate
 Version:      1.0.0
 Text Domain:  templatecpl
*/

/********************************************************************************************************************/

html{
	font-size: 16px;
	font-family: 'Montserrat', sans-serif;
	font-optical-sizing: auto;
	font-weight: 300;
	font-style: normal;
	touch-action: manipulation;
}

html, body, address, blockquote, div, dl, form, h1, h2, h3, h4, h5, h6, ol, p, pre, table, ul,
dd, dt, li, tbody, td, tfoot, th, thead, tr, del, ins, map, object,
a, abbr, acronym, b, bdo, big, br, cite, code, dfn, em, i, img, kbd, q, samp, small, span,
strong, sub, sup, tt, var, legend, fieldset {
	margin: 0;
	padding: 0;
	text-decoration: none; 
}

img, fieldset {
	border: 0;
}

/* set image max width to 100% */
img {
	display: block;
	height: auto;
	max-height: 100%;
	max-width: 100%;
	width: auto\9; /* ie8 */
	object-fit: cover;
}

/* set html5 elements to block */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { 
    display: block;
}

ul li {
	list-style-type: none;
}


#human{display:none !important;}


html, body {
	width: 100%;
	min-height: 100%;
	scroll-behavior: smooth;
	overflow-x: hidden;
}

p {
	line-height: 1.5rem;
}

/* INITIALISATION ***************************************************************************************************/

.table{display:table;}
.flex{display:flex;}
.grid{display:grid;}

/********************************************************************************************************************/
/* BACKGROUNDS */


/********************************************************************************************************************/
/* SPECIAL CLASSES */

:root{
	--filter-primary: invert(61%) sepia(39%) saturate(5216%) hue-rotate(360deg) brightness(102%) contrast(107%);
	--filter-white: invert(100%) sepia(8%) saturate(7456%) hue-rotate(287deg) brightness(114%) contrast(115%);
}

.wrap{position:relative; margin:0 auto; width: 1300px;}
.specialheight{min-height:760px;}
.bold{font-weight:700;}
.light{font-weight:300;}
.flex{display:flex;}
.grid{display:grid;}
body.no-scroll,
html.no-scroll{overflow: hidden;}

.w-80{
	width: 80%;
	margin: auto;
}

.mb-3 {
	margin-bottom: 3rem;
}

.page-top-pad{
	padding: 250px 0 3rem;
}

.hp-4{
	padding-top: 4rem;
	padding-bottom: 4rem;
}

.hp-6{
	padding-top: 6rem;
	padding-bottom: 6rem;
}

.hp-angled{
	position: relative;
	padding: 8rem 0;
}

.nm-angled{
	margin-top: -5.05rem;
}

.single-angle{
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
	background-attachment: fixed;
	clip-path: polygon(0 5rem, 100% 0, 100% calc(100% - 5rem), 0 100%);
/*	transform: scaleZ(1);*/
}

.single-angle-reverse{
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
	background-attachment: fixed;
	clip-path: polygon(0 0, 100% 5rem, 100% 100%, 0 calc(100% - 5rem));
/*	transform: scaleZ(1);*/
}

.double-angle{
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
	background-attachment: fixed;
	clip-path: polygon(0 5rem, 100% 0, 100% 100%, 0 calc(100% - 5rem));
/*	transform: scaleZ(1);*/
}

.double-angle-reverse{
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
	background-attachment: fixed;
	clip-path: polygon(0 0, 100% 5rem, 100% calc(100% - 5rem), 0 100%);
/*	transform: scaleZ(1);*/
}

.nm-footer{
	margin-bottom: -9rem;
}

.nm-footer-angled{
	margin-bottom: -5.05rem;
}

.col-reverse{
	flex-direction: row-reverse;
}

/* 2 Column layout style */

.col-2{
	display: flex;
	align-items: center;
	gap: 3.25rem;
}

.col-2 > *{
	flex-grow: 1;
	min-width: calc(50% - 1.625rem);
}

.col-2 img{
	border-radius: 40px;
}

.grid-2{
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 3rem;
	padding: 2rem 0;
}

/* 3 Column layout style */

/*.col-3{
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 2rem;
}*/

.col-3{
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	gap: 2rem;
}

.col-3 > *{
	width: calc((100% / 3) - 2rem + (2rem / 3));
}

.col-4{
	display: flex;
	justify-content: center;
	gap: 1rem;
	flex-wrap: wrap;
}

.col-4 > *{
	width: calc((100% / 4) - 1rem + (1rem / 4));
	width: 23%;
}

/* General text block style */

.section-title .main-title{
	font-size: 2.25rem;
	line-height: 2.5rem;
	margin-bottom: 2rem;
}

.section-title .extra-title{
	font-size: 1.5rem;
	font-weight: 600;
	color: #555555;
	margin-bottom: 2rem;
}

.section-title.sm-title .main-title{
	font-size: 1.5rem;
	line-height: 2.25rem;
}

.section-title.sm-title .extra-title{
	font-size: 1.25rem;
	margin-bottom: 1rem;
}

.extra-title{
	font-size: 1.5rem;
	font-weight: 600;
	color: #555555;
	margin-bottom: 2rem;
}

.text-block > p:not(:last-child){
	margin-bottom: 1rem;
}

.text-block > ul,
.sm-text-block > ul{
	margin-top: 1.5rem;
	margin-left: 2rem;
}

.text-block > ul > li,
.sm-text-block > ul > li{
	list-style-type: disc;
	line-height: 1.5;
	padding-left: 1rem;
}

.text-block > ul > li:not(:last-child),
.sm-text-block > ul > li:not(:last-child){
	margin-bottom: 1rem;
}

.text-block > ul > li::marker,
.sm-text-block > ul > li::marker{
	content: '▶';
	color: var(--primary-color);
}

.white-text .text-block > ul > li::marker,
.white-text .sm-text-block > ul > li::marker{
	content: '▶';
	color: #fff;
}

.text-block > a{
	margin-top: 1.25rem;
}

.sm-text-block > h3{
	margin-bottom: .5rem;
}

.block-center{
	width: 80%;
	margin: auto;
}

.block-center.w-60{
	width: 60%;
}

.image-shape-layout{
	border: 1rem solid #fff;
	box-shadow: -5rem 6.5rem 0 #e5e5e5;
	box-sizing: border-box;
	margin-left: auto;
	margin: 0 0 6.5rem;
}

.image-shape-layout-reverse{
	border: 1rem solid #fff;
	box-shadow: 5rem 6.5rem 0 #e5e5e5;
	margin-left: auto;
	margin: 0 0 6.5rem;
}

/* Icon boxes */

.icon-boxes-col{
	padding: 1rem 0;
}

.icon-boxes-col .icon-box .icon-container{
	background-color: var(--primary-color);
	border-radius: 20px;
	margin-bottom: 1.5rem;
	overflow: hidden;
}

.icon-boxes-col .icon-box .icon-container .icon{
	background-color: #fff;
	mask-repeat: no-repeat;
	mask-position: center center;
	mask-size: 5rem 5rem;
	padding: 5rem 3rem;
}

.icon-boxes-col .icon-box .icon-container .image{
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
	padding: 5rem 3rem;
}

.icon-boxes-col .icon-box .text h3{
	font-size: 1.125rem;
	margin-bottom: .625rem;
}

.icon-boxes-col .icon-box .text p{
	font-size: .875rem;
}

.icon-box-outline{
	border: 1px solid var(--primary-color);
	padding: 2rem 1.5rem;
	border-radius: 10px;
	box-sizing: border-box;
}

.icon-box-outline .icon{
	width: 3rem;
	height: 3rem;
	background-color: var(--primary-color);
	margin: auto;
}

.icon-box-outline.address .icon{
	-webkit-mask: url(img/icons/icon-map.svg) no-repeat center center/contain;
	mask: url(img/icons/icon-map.svg) no-repeat center center/contain;
}

.icon-box-outline.email .icon{
	-webkit-mask: url(img/icons/icon-email.svg) no-repeat center center/contain;
	mask: url(img/icons/icon-email.svg) no-repeat center center/contain;
}

.icon-box-outline.phone .icon{
	-webkit-mask: url(img/icons/icon-phone.svg) no-repeat center center/contain;
	mask: url(img/icons/icon-phone.svg) no-repeat center center/contain;
}

.icon-box-outline h3{
	margin: .5rem;
}

.icon-box-outline p{
	font-size: .875rem;
}

.icon-box-outline p span{
	display: inline-block;
}

.icon-box-outline a{
	font-size: .875rem;
	font-weight: 500;
	color: var(--primary-color);
	transition: color .2s;
}

.icon-box-outline a:hover{
	color: #000;
}

/* General buttons style */

.btn-primary{
	display: inline-block;
	font-size: 1.125rem;
	font-weight: 700;
	text-transform: uppercase;
	color: #fff;
	background-color: var(--primary-color);
	padding: 1rem 2rem;
	border-radius: 10px;
	transition: background-color .2s;
}

.btn-primary:hover{
	background-color: var(--primary-hover);
}

.btn-primary-outline{
	display: inline-block;
	font-size: 1.125rem;
	font-weight: 700;
	text-transform: uppercase;
	color: var(--primary-color);
	padding: .75rem 2rem;
	border: 3px solid var(--primary-color);
	border-radius: 10px;
	transition: color .2s, background-color .2s;
}

.btn-primary-outline:hover{
	color: #fff;
	background-color: var(--primary-color);
}

.white-btn{
	font-size: .875rem;
	font-weight: 500;
	color: var(--primary-color);
	text-transform: uppercase;
	background-color: #fff;
	padding: .875rem 1rem;
	border-radius: 10px;
	transition: color .2s, background-color .2s;
}

.white-btn:hover{
	color: #fff;
	background-color: var(--primary-color);
}

.arrow-btn{
	display: flex;
	align-items: center;
	width: max-content;
	color: var(--primary-color);
	font-weight: 600;
	text-transform: uppercase;
	transition: color .2s;
}

.arrow-btn:hover{
	color: var(--primary-hover);
}

.arrow-btn::after{
	display: block;
	content: '';
	width: 2rem;
	height: 2rem;
	background-color: var(--primary-color);
	mask-image: url(img/icons/icon-arrow-right.svg);
	mask-position: center center;
	mask-size: 100%;
	mask-repeat: no-repeat;
	margin-left: .5rem;
	transition: background-color .2s, transform .2s cubic-bezier(0.65, 0.05, 0.36, 1);
}

.arrow-btn:hover::after{
	background-color: var(--primary-hover);
	transform: translateX(.5rem);
}

.arrow-btn.center-btn{
	margin-left: auto;
	margin-right: auto;
}

/**********/

.extra-ls,
.extra-ls p{
	line-height: 1.8rem;
}

.white-text,
.white-text .extra-title,
.white-text .main-title{
	color: #fff;
}

.img-mid{
	width: 90%;
	margin: 4rem auto;
}

.img-rounded{
	border-radius: 20px;
}

.dark-overlay{
	position: relative;
}

.dark-overlay::before{
	content: '';
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	background-color: #000;
	opacity: .65;
	z-index: 0;
}

.anchor{position:relative; visibility:hidden; top:-150px; display:block;}
.overlay{position: fixed; width: 100%; height: 100%; background-color: #000; visibility: hidden; opacity: 0; z-index: 1500;
	transition: all 0.6s;
}
.overlay.show-overlay{visibility: visible; opacity: 0.3;}

/* ALIGN */
.text-center{text-align: center;}
.align-right{margin-left: auto;}
.align-center{margin-left: auto; margin-right: auto;}
.side{width: 95%;}
.mid{width: 90%;}
.half{height:400px;}
.wide{height: 400px;}

/* ELEMENTS CLASSES */

.anchor{display: block; position: relative; top: -400px; visibility: hidden;}

/********************************************************************************************************************/
/* NAV STYLE */

#nav{
	position: fixed;
	top: 0;
	width: 100%;
	background-color: #fff;
	box-shadow: 0 0 18px #00000023;
	transform: skewY(-1.5deg);
	transition: transform .5s;
	z-index: 1000;
}

/* Navbar top styling */

#nav .nav-top{
	position: relative;
	background-color: #f4f4f4;
	padding: .625rem 0;
	transform: skewY(1.5deg);
	transition: transform .5s;
	z-index: 1010;
}

#nav .nav-top > .flex {
	align-items: center;
}

#nav .nav-top .item{
	display: inline-flex;
	align-items: center;
	color: #000;
	margin-right: 1rem;
	transition: all 0.3s;
}
#nav .nav-top .item:hover{
	color: var(--primary-color);
}

#nav .nav-top .item svg{
	width: 24px;
	stroke: #000;
	margin-right: .5rem;
	transition: all 0.3s;
}
#nav .nav-top .item:hover svg{
	stroke: var(--primary-color);
}

#nav .nav-top .item span {
	color: red;
	font-weight: 400;
	margin-right: 6px;
}

#nav .nav-top .socials{
	display: inline-block;
	margin-left: auto;
}

#nav .nav-top .socials svg{
	width: 24px;
	fill: #000;
	transition: all 0.3s;
}

#nav .nav-top .socials a{
	display: inline-block;
}

#nav .nav-top .socials a:not(:last-child){
	margin-right: .25rem;
}

#nav .nav-top .lang-link{
	color: #000;
    font-weight: 700;
/*    border-left: 1px solid #0000001A;*/
/*    margin-left: 1.5rem;*/
    margin-left: auto;
    padding-left: 1.5rem;
    transition: color .2s;
}

#nav .nav-top .lang-link:hover{
	color: var(--primary-color);
}

/* Navbar main section styling */

#nav .nav-main{
	position: relative;
	padding: 1rem 0;
	transform: skewY(1.5deg) scaleZ(1);
	transition: transform .5s, padding .3s;
}

#nav .nav-main .flex{
	align-items: center;
	justify-content: space-between;
	gap: 3rem;
}

#nav .nav-main .logo img{
	width: 380px;
	max-width: 380px;
	height: 100px;
	object-fit: contain;
	transition: max-width .3s, height .3s;
}

#nav .nav-main .menu{
	display: flex;
	align-items: center;
	gap: 1rem;
}

#nav .nav-main .menu > li > a{
	display: flex;
	align-items: center;
	color: #000;
	font-weight: 600;
	text-transform: uppercase;
	transition: color .3s;
}
#nav .nav-main .menu > li:hover > a{
	color: var(--primary-color);
}

#nav .nav-main .menu > li.btn-quote > a{
	color: red;
/*	background-color: var(--primary-color);*/
	border: 3px solid red;
	padding: .875rem 1.25rem;
	border-radius: 10px;
	transition: color .3s, background-color .3s;
}
#nav .nav-main .menu > li.btn-quote > a:hover{
	color: #fff;
	background-color: red;
}

#nav .nav-main .mobile-menu-open-btn{
	display: none;
	width: 3rem;
	height: 3rem;
	background-color: #000;
	-webkit-mask: url(img/icons/icon-menu.svg) no-repeat center center/contain;
	mask: url(img/icons/icon-menu.svg) no-repeat center center/contain;
	border: none;
	cursor: pointer;
	transition: background-color .2s;
}

#nav .nav-main .mobile-menu-open-btn:hover{
	background-color: var(--primary-color);
}

#nav .nav-main .menu .menu-item-has-children{
	position: relative;
}

#nav .nav-main .menu .menu-item-has-children > a::after{
	display: block;
	content: '▾';
	position: relative;
	top: -2px;
	font-size: 1rem;
	margin-left: .5rem;
}

#nav .nav-main .menu .menu-item-has-children .sub-menu{
	display: none;
	position: absolute;
	top: 100%;
	left: 0;
	width: 300px;
}

#nav .nav-main .menu .menu-item-has-children .sub-menu::before{
	display: block;
	content: '';
	width: 100%;
	height: 1rem;
}

#nav .nav-main .menu .menu-item-has-children .sub-menu::after{
	content: '';
	display: block;
	position: absolute;
    bottom: 0;
    width: 100%;
    height: calc(100% - 1rem);
    box-shadow: 0 3px 12px #00000033;
    z-index: -1;
}

#nav .nav-main .menu .menu-item-has-children:hover .sub-menu{
	display: block;
}

#nav .nav-main .menu .menu-item-has-children .sub-menu > li > a{
	display: block;
	color: #fff;
	background-color: var(--primary-color);
	padding: .75rem 1rem;
}

#nav .nav-main .menu .menu-item-has-children .sub-menu > li > a:hover{
	background-color: #000;
}

/* Menu dropdown styling */

.menu .sub-menu{
	display: none;
}

/* SCROLLED */

#nav.scrolled{
	transform: skewY(0);
}

#nav.scrolled .nav-top{
	transform: skewY(0);
}

#nav.scrolled .nav-main{
	padding: 1rem 0 1.5rem;
	transform: skewY(0);
}
#nav.scrolled .nav-main::before{
	transform: scale(2) rotate(0);
}

#nav.scrolled .nav-main .logo img{
	max-width: 250px;
}

/**
 * Mobile menu styling
 */

#mobile-menu{
	position: fixed;
	width: 75%;
	height: 100%;
	right: -75%;
	background-color: #f4f4f4;
	padding: 2rem;
	border-top: 1rem solid var(--primary-color);
	border-left: 1rem solid var(--primary-color);
	box-sizing: border-box;
	transition: right .5s;
	z-index: 2000;
}

#mobile-menu.open-menu{
	right: 0;
}

#mobile-menu .menu > li:not(:last-child){
	margin-bottom: 1rem;
}

#mobile-menu .menu > li > a{
	font-size: 1.25rem;
	font-weight: 500;
	color: #000;
	transition: color .2s;
}

#mobile-menu .menu > li > a:hover{
	color: var(--primary-color);
}

#mobile-menu .mobile-menu-close-btn{
	position: absolute;
	top: 1rem;
	right: 1rem;
	width: 2rem;
	height: 2rem;
	background-color: var(--primary-color);
	-webkit-mask: url(img/icons/icon-close.svg) no-repeat center center/contain;
	mask: url(img/icons/icon-close.svg) no-repeat center center/contain;
	border: none;
	cursor: pointer;
	transition: background-color .2s;
}

#mobile-menu .mobile-menu-close-btn:hover{
	background-color: #000;
}

#mobile-menu .extra-info{
	border-top: 1px solid #e4e4e4;
	padding-top: 1.5rem;
	margin-top: 1.5rem;
}

#mobile-menu .extra-info .item{
	display: flex;
	align-items: center;
	font-weight: 400;
	color: #000;
	margin-bottom: 1rem;
	transition: all 0.3s;
}
#mobile-menu .extra-info .item:hover{
	color: var(--primary-color);
}

#mobile-menu .extra-info .item svg{
	width: 24px;
	stroke: #000;
	margin-right: .5rem;
	transition: all 0.3s;
}
#mobile-menu .extra-info .item:hover svg{
	stroke: var(--primary-color);
}

#mobile-menu .lang-link{
	display: block;
	font-weight: 700;
	color: #000;
	font-size: 1.25rem;
	float: right;
	transition: color .2s;
}

#mobile-menu .lang-link:hover{
	color: var(--primary-color);
}


/********************************************************************************************************************/
/* HOME PAGE TOP STYLES */

#hero-section{
	position: relative;
	margin-top: -3rem;
}

#hero-section::after{
	display: block;
	content: '';
	width: 100%;
	height: 300px;
	position: absolute;
	top: 96%;
	background-color: var(--primary-color);
	transform: skewY(4deg);
	z-index: 1;
}

#hero-section .swiper-slide{
	height: 1080px;
}

#hero-section .swiper-slide::before{
	display: block;
	content: '';
	position: absolute;
	width: 100%;
	height: 100%;
	background-color: #000;
	top: 0;
	opacity: 0.45;
}

#hero-section .swiper-slide .flex{
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	position: absolute;
	left: 0;
	right: 0;
	bottom: 25%;
}

#hero-section .swiper-slide h1,
#hero-section .swiper-slide h2{
	max-width: 70%;
	font-size: 3rem;
	color: #fff;
	margin-bottom: 1rem;
}

#hero-section .swiper-slide p{
	max-width: 70%;
	font-size: 1.875rem;
	color: #fff;
	line-height: 2.5rem;
	margin-bottom: 3.125rem;
}

#hero-section .swiper-slide .btn-hero{
	display: inline-block;
	font-size: 1.25rem;
	font-weight: 700;
	color: #fff;
	text-transform: uppercase;
	padding: 1.25rem 2.125rem;
	background-color: var(--primary-color);
	border-radius: 10px;
	transition: all 0.3s;
}
#hero-section .swiper-slide .btn-hero:hover{
	background-color: var(--primary-hover);
}

/********************************************************************************************************************/
/* HOME PAGE BODY STYLES */

#home-content{
	position: relative;
	z-index: 2;
}

#home-content::before{
	display: block;
	content: '';
	width: 100%;
	height: 10%;
	min-height: 750px;
	position: absolute;
	top: -25px;
	background-color: #fff;
	transform: skewY(-8deg);
}

#home-content > *:not(section.partners){
	margin-bottom: 8rem;
}

/**
 * Section 1 - Presentation styling
 */

#home-content .presentation img{
	border-left: 1rem solid #fff;
	border-top: 1rem solid #fff;
	box-sizing: border-box;
}

#home-content .icon-boxes{
	padding: 3.5rem 0;
}

#home-content .icon-box{
	padding: 0 1rem;
	box-sizing: border-box;
}

#home-content .icon-box .icon{
	flex-shrink: 0;
	width: 64px;
	background-color: var(--primary-color);
	mask-repeat: no-repeat;
	margin-right: 1.5rem;
}

#home-content .icon-box h3{
	font-size: 1.25rem;
	margin-bottom: .625rem;
}

/**
 * Section 2 - Services styling
 */

#home-content .services{
	position: relative;
}

#home-content .services::before{
	display: block;
	content: '';
	position: absolute;
	top: 28%;
	width: 100%;
	height: 60%;
	background-color: #f4f4f4;
	transform: skewY(-3deg);
}

#home-content .services .arrow-btn{
	margin-bottom: 4rem;
}

#home-content .services .services-container{
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	gap: 2rem;
}

#home-content .services .service-box{
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: flex-end;
	flex-grow: 1;
	position: relative;
	width: calc(33% - 2rem);
	max-width: calc(33% - 2rem);
	min-height: 400px;
	color: #fff;
	text-align: center;
	padding: 1rem 2rem;
	border: 2px solid var(--primary-color);
	border-radius: 20px;
	box-sizing: border-box;
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
	overflow: hidden;
	transition: transform .5s;
}

#home-content .services .service-box > *{
	z-index: 1;
}

#home-content .services .service-box::before{
	display: block;
	content: '';
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 40%;
	background-image: linear-gradient(to top, #000, transparent);
	opacity: 1;
	transition: opacity .5s, background-image .5s, height .5s
}

@media (hover: hover) {

	#home-content .services .service-box:hover{
		transform: translateY(-1rem);
	}

	#home-content .services .service-box:hover::before{
		height: 100%;
	}

	#home-content .services .service-box p{
		display: none;
	}

	#home-content .services .service-box a{
		display: none;
	}

}

@media (hover: none) {

	#home-content .services .service-box::before{
		height: 100%;
	}

	#home-content .services .service-box p,
	#home-content .services .service-box a{
		display: block !important;
	}

}

#home-content .services .service-box h3{
	margin-bottom: 1rem;
}

#home-content .services .service-box h3::after{
	display: block;
	content: '';
	width: 3rem;
	border-bottom: 1px solid #fff;
	margin: .5rem auto 0;
}

#home-content .services .service-box a{
	margin-top: 1rem;
}

/**
 * Section 4 - Blog styling
 */

#home-content article > *:not(:last-child){
	margin-bottom: 1rem;
}

#home-content article .article-image{
	display: block;
	position: relative;
	background-color: #000;
	border-radius: 10px;
	overflow: hidden;
}

#home-content article .article-image img{
	width: 100%;
	max-height: 300px;
}

#home-content article .article-date{
	position: absolute;
	bottom: 0;
	left: 0;
	font-weight: 700;
	color: #fff;
	text-transform: uppercase;
	background-color: var(--primary-color);
	padding: 1rem;
	box-sizing: border-box;
	border-top-right-radius: 20px;
}

#home-content article .article-title{
	display: block;
	font-size: 1.25rem;
	font-weight: 700;
	color: #000;
	margin: 1rem 0;
	transition: color .2s;
}

#home-content article:hover .article-title{
	color: var(--primary-color);
}

/**
 * Section 5 - Testimonies styling
 */

#home-content .testimonies{
	position: relative;
	color: #fff;
	padding: 6rem 0;
	background-repeat: no-repeat;
	background-position: bottom;
	background-size: cover;
	background-attachment: fixed;
	clip-path: polygon(0 0, 100% 10%, 100% 100%, 0 90%);
}

#home-content .testimonies::before{
	display: block;
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: var(--primary-color);
	opacity: .75;
}

#home-content .testimonies .section-title{
	font-size: 1.875rem;
}

#home-content .testimonies .icon-quote{
	width: 4rem;
	height: 4rem;
	background-color: #fff;
	mask: url(img/icons/icon-quote.svg) no-repeat center center/contain;
	margin: 2rem auto;
}

#home-content .testimonies .testimony-slider{
	width: 60%;
}

#home-content .testimonies .testimony-slider .testimony-message,
#home-content .testimonies .testimony-slider .testimony-name{
	line-height: 2.25rem;
}

#home-content .testimonies .testimony-slider .testimony-name{
	font-weight: 600;
}

#home-content .testimonies .testimony-slider-dots{
	display: none;
	position: relative;
	margin-top: 2rem;
}

#home-content .testimonies .testimony-slider-dots .swiper-pagination-bullet{
	background: #fff;
	opacity: .5;
}

#home-content .testimonies .testimony-slider-dots .swiper-pagination-bullet-active{
	background: #fff;
	opacity: 1;
}

#home-content .testimonies .testimony-slide-arrow{
	all: unset;
	position: absolute;
	top: 50%;
	width: 4rem;
	height: 4rem;
	background-color: #fff;
	mask: url(img/icons/icon-arrow-simple.svg) no-repeat center center/contain;
	opacity: .5;
	cursor: pointer;
	transition: opacity .2s;
}

#home-content .testimonies .testimony-slide-arrow:hover{
	opacity: 1;
}

#home-content .testimonies .testimony-slide-arrow.testimony-slide-prev{
	left: 10%;
}

#home-content .testimonies .testimony-slide-arrow.testimony-slide-next{
	right: 10%;
	transform: scaleX(-1);
}

/**
 * Section urgence
 */

.general-section.urgence .btn-primary-outline {
	color: red;
	border: 3px solid red;
}

.general-section.urgence .btn-primary-outline:hover {
	color: #fff;
	background: red;
}

/**
 * Section 7 - Portfolio styling
 */

#home-content .portfolio .portfolio-container{
	margin-top: 3rem;
}

#home-content .portfolio .portfolio-single{
	display: block;
	position: relative;
	min-height: 260px;
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
	border-radius: 20px;
	overflow: hidden;
	transition: transform .5s;
}

#home-content .portfolio .portfolio-single:hover{
	transform: translateY(-1rem);
}

#home-content .portfolio .portfolio-single::before{
	display: block;
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: #000;
	opacity: 0;
	transition: opacity .5s;
}

#home-content .portfolio .portfolio-single:hover::before{
	opacity: .5;
}

#home-content .portfolio .portfolio-single .portfolio-title{
	position: absolute;
	bottom: 10%;
	left: 0;
	right: 0;
	font-size: 1.5rem;
	font-weight: 600;
	color: #fff;
	padding: 1rem;
	margin: auto;
	opacity: 0;
	transform: translateY(2rem);
	transition: opacity.3s, transform .3s;
	z-index: 1;
}

#home-content .portfolio .portfolio-single:hover .portfolio-title{
	opacity: 1;
	transform: translateY(0);
	transition-delay: .3s;
}

#home-content .portfolio .portfolio-single .portfolio-title::after{
	display: block;
	content: '';
	width: 3rem;
	border-bottom: 2px solid #fff;
	margin: .5rem auto 0;
}

/**
 * Section 8 - Contact / Request quote styling
 */

.quote-form{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: 1rem;
}

.quote-form > *{
	width: 100%;
	box-sizing: border-box;
}

.quote-form > *.half-width{
	width: 47.5%;
}

.quote-form input[type=text],
.quote-form input[type=email],
.quote-form select{
	font-family: 'Montserrat', sans-serif;
	font-size: 1rem;
	border: none;
	border-bottom: 2px solid var(--primary-color);
	padding: .5rem;
}

.quote-form textarea{
	font-family: 'Montserrat', sans-serif;
	font-size: 1rem;
	min-height: 200px;
	border: 2px solid var(--primary-color);
	padding: .5rem;
}

.quote-form input[type=submit]{
	display: inline-block;
	width: max-content;
    font-size: 1.125rem;
    font-weight: 700;
    text-transform: uppercase;
    color: #fff;
    background-color: var(--primary-color);
    border: none;
    padding: .75rem 2rem;
    border-radius: 10px;
    cursor: pointer;
    transition: background-color .2s;
}

.quote-form input[type=submit]:hover{
	background-color: var(--primary-hover);
}

/**
 * Section 9 - Partners styling
 */

#home-content .partners{
	background-color: #f4f4f4;
	padding: 3rem 0 8rem;
}

#home-content .partners .partners-container{
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 5rem;
}

/********************************************************************************************************************/
/* GENERAL PAGE STYLING */
/********************************************************************************************************************/

#page-top{
	position: relative;
	height: 950px;
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
	box-shadow: 0 0 30px #00000066;
	margin-bottom: 4rem;
}

#page-top::before{
	display: block;
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: #000;
	opacity: .45;
	z-index: 0;
}

#page-top::after{
	display: block;
	content: '';
	position: absolute;
	bottom: 0;
	width: 100%;
	height: 150px;
	background-color: var(--primary-color);
	clip-path: polygon(0 0, 100% 60%, 100% 100%, 0 100%);
	z-index: 10;
}

#page-top > .wrap{
	height: 100%;
}

#page-top .page-title{
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	max-width: 65%;
	color: #fff;
}

#page-top .page-title h1{
	font-size: 3rem;
}

#page-top .page-title p{
	max-width: 65%;
	font-size: 1.5rem;
	line-height: 2rem;
	margin-top: 1rem;
}

.page-id-833 #services-single .text-block p:last-child strong {
	color: red;
}

/********************************************************************************************************************/
/* About Us page styling */
/********************************************************************************************************************/

#about-us .cta-section{
	display: flex;
	align-items: center;
	gap: 10rem;
}

#about-us .cta-section .cta-text h3{
	font-size: 1.5rem;
	margin-bottom: 2rem;
}

#about-us .cta-section .cta-btn{
	flex-shrink: 0;
}

/********************************************************************************************************************/
/* Services page styling */
/********************************************************************************************************************/

#services-single .sm-text-block > h3:not(:first-of-type) {
	margin-top: 3rem;
}

#services-single .sm-text-block > ul {
	margin-top: 0;
	margin-left: 0;
}

#services-single .sm-text-block > ul > li {
	list-style-type: none;
	padding-left: 0;
}

#services-single .sm-text-block > ul > li::marker {
	content: unset;
}

#services-single .col-center {
	grid-column: span 2;
/*	max-width: 1100px;
	margin-left: auto;
	margin-right: auto;*/
}

/*#services-single .col-center h3 {
	text-align: center;
}*/

#services-single .col-center ul {
	display: grid;
	grid-template-columns: 1fr 1fr;
	column-gap: 3rem;
	/*padding-left: 2rem;
	padding-right: 2rem;
	margin-left: auto;*/
}

#services-single .lr-text {
	flex-direction: row;
	align-items: flex-start;
	padding: 2rem 0;
}

/********************************************************************************************************************/
/* Portfolio page styling */
/********************************************************************************************************************/

#portfolio .grid-2{
	gap: 2rem;
}

#portfolio .portfolio-single{
	display: block;
	position: relative;
	min-height: 350px;
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
	border-radius: 20px;
	overflow: hidden;
	transition: transform .5s;
}

#portfolio .portfolio-single:hover{
	transform: translateY(-1rem);
}

#portfolio .portfolio-single::before{
	display: block;
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: #000;
	opacity: 0;
	transition: opacity .5s;
}

#portfolio .portfolio-single:hover::before{
	opacity: .5;
}

#portfolio .portfolio-single .portfolio-title{
	position: absolute;
	bottom: 10%;
	left: 0;
	right: 0;
	font-size: 1.875rem;
	font-weight: 600;
	color: #fff;
	padding: 1rem;
	margin: auto;
	opacity: 0;
	transform: translateY(2rem);
	transition: opacity.3s, transform .3s;
	z-index: 1;
}

#portfolio .portfolio-single:hover .portfolio-title{
	opacity: 1;
	transform: translateY(0);
	transition-delay: .3s;
}

#portfolio .portfolio-single .portfolio-title::after{
	display: block;
	content: '';
	width: 3rem;
	border-bottom: 2px solid #fff;
	margin: .5rem auto 0;
}

/**
 * Portfolio summary page styling
 */

#portfolio-single .portfolio-container{
	display: flex;
}

#portfolio-single .portfolio-container > *:first-child{
	width: 70%;
}

#portfolio-single .portfolio-container > *:last-child{
	width: 30%;
}

#portfolio-single .main-content .portfolio-image{
	display: block;
	position: relative;
	width: 100%;
	max-height: 650px;
	background-color: #000;
	border-radius: 10px;
	overflow: hidden;
}

#portfolio-single .main-content h1{
	font-size: 2rem;
	margin: 3rem 0 2rem;
}

#portfolio-single .main-content .text-content > p:not(:last-child){
	margin-bottom: 1rem;
}

#portfolio-single .main-content .portfolio-gallery{
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 1rem;
	margin: 3rem 0;
}

#portfolio-single .main-content .portfolio-gallery > a{
	display: block;
	aspect-ratio: 1;
	border-radius: 10px;
	overflow: hidden;
	transition: opacity 0.3s;
}

#portfolio-single .main-content .portfolio-gallery > a:hover{
	opacity: .6;
}

#portfolio-single .main-content .portfolio-gallery > a > img{
	width: 100%;
	height: 100%;
	object-fit: cover;
}

#portfolio-single .sidebar{
	margin-left: 3rem;
}

#portfolio-single .sidebar h3{
	font-size: 1.25rem;
	margin-bottom: 2rem;
}

#portfolio-single .sidebar .project-preview{
	display: flex;
	align-items: center;
	gap: 1rem;
	color: #666;
	transition: color .3s;
}

#portfolio-single .sidebar .project-preview:hover{
	color: var(--primary-color);
}

#portfolio-single .sidebar .project-preview:not(:last-child){
	margin-bottom: 1rem;
}

#portfolio-single .sidebar .project-preview img{
	width: 8rem;
	border-radius: 10px;
	transition: opacity .3s;
}

#portfolio-single .sidebar .project-preview:hover img{
	opacity: .6;
}

#portfolio-single .sidebar .project-preview h4{
	margin-bottom: .3rem;
}

#portfolio-single .sidebar .project-preview p{
	font-size: .875rem;
	line-height: 1.25rem;
}

/********************************************************************************************************************/
/* Contact styling */
/********************************************************************************************************************/

#contact .contact-form{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: 3rem 1rem;
}

#contact .contact-form > *{
	width: 100%;
	box-sizing: border-box;
}

#contact .contact-form > *.half-width{
	width: 47.5%;
}

#contact .contact-form input[type=text],
#contact .contact-form input[type=email],
#contact .contact-form select{
	font-family: 'Montserrat', sans-serif;
	font-size: 1rem;
	border: none;
	border-bottom: 2px solid var(--primary-color);
	padding: .5rem;
}

#contact .contact-form textarea{
	font-family: 'Montserrat', sans-serif;
	font-size: 1rem;
	min-height: 200px;
	border: 2px solid var(--primary-color);
	padding: .5rem;
}

#contact .contact-form input[type=submit]{
	display: inline-block;
	width: max-content;
    font-size: 1.125rem;
    font-weight: 700;
    text-transform: uppercase;
    color: #fff;
    background-color: var(--primary-color);
    border: none;
    padding: .75rem 2rem;
    border-radius: 10px;
    cursor: pointer;
    transition: background-color .2s;
}

#contact .contact-form input[type=submit]:hover{
	background-color: var(--primary-hover);
}

#contact .hours-section .col-2{
	align-items: stretch;
	gap: 0;
}

#contact .open-hours{
	color: #fff;
	background-color: #4a4a4a;
	padding: 6rem 10rem 10rem 6rem;
	box-sizing: border-box;
}

#contact .open-hours h2{
	display: flex;
	align-items: center;
	margin-bottom: 3rem;
}

#contact .open-hours h2::before{
	display: block;
	content: '';
	width: 2.5rem;
	height: 2.5rem;
	background-color: #fff;
	-webkit-mask: url(img/icons/icon-clock.svg) no-repeat center center/contain;
	mask: url(img/icons/icon-clock.svg) no-repeat center center/contain;
	margin-right: 1rem;
}

#contact .open-hours .open-hours-day{
	display: flex;
	align-items: center;
	gap: 1rem;
	color: #fff;
}

#contact .open-hours .open-hours-day:not(:last-child){
	margin-bottom: 1rem;
}

#contact .open-hours .open-hours-day::before{
	display: block;
	content: '';
	width: 100%;
	border-bottom: 1px dotted #fff;
	flex-grow: 1;
	order: 1;
}

#contact .open-hours .open-hours-day p:first-of-type{
	flex-shrink: 0;
	order: 0;
}

#contact .open-hours .open-hours-day p:last-of-type{
	flex-shrink: 0;
	order: 2;
}

#contact .hours-section iframe{
	height: auto;
}

/********************************************************************************************************************/
/* Quote page styling */
/********************************************************************************************************************/

#quote .quote-form{
	gap: 2rem 1rem;
	margin-top: 3rem;
}

/********************************************************************************************************************/
/* Careers page styling */
/********************************************************************************************************************/

.page-template-carrieres #page-top .page-title p {
	max-width: 100%;
}

#careers .quote-form{
	gap: 2rem 1rem;
	margin-top: 3rem;
}

#careers form .file{
	display: flex;
	align-items: flex-end;
	justify-content: flex-end;
	gap: 1rem;
	flex-basis: 100%;
	background-color: #fff;
}

#careers form .file input[type="file"]{
	width: 0.1px;
	height: 0.1px;
	opacity: 0;
	position: absolute;
}

#careers form .file p{
	font-weight: 400;
}

#careers form .file label{
	display: flex;
	align-items: center;
	height: 30px;
	font-weight: 600;
	color: var(--primary-color);
	border: 2px solid var(--primary-color);
	padding: 5px 15px;
	cursor: pointer;
	transition: color .2s, background .2s;
}

#careers form .file label:hover{
	color: #fff;
	background: var(--primary-color);
}

#careers form .file .filename {
	flex-grow: 1;
	padding-bottom: .5rem;
	border-bottom: 2px solid var(--primary-color);
}

/********************************************************************************************************************/
/* Blog styling */
/********************************************************************************************************************/

.blog-container{
	display: flex;
}

.blog-container .grid-2{
	gap: 3rem 1.5rem;
	padding: 0;
}

.blog-container > *:first-child{
	width: 70%;
}

.blog-container > *:last-child{
	width: 30%;
}

#blog article .article-image{
	display: block;
	position: relative;
	background-color: #000;
	border-radius: 10px;
	overflow: hidden;
}

#blog article .article-image img{
	width: 100%;
	max-height: 300px;
}

#blog article .article-date{
	position: absolute;
	bottom: 0;
	left: 0;
	font-weight: 700;
	color: #fff;
	text-transform: uppercase;
	background-color: var(--primary-color);
	padding: 1rem;
	box-sizing: border-box;
	border-top-right-radius: 20px;
}

#blog article .entry-title{
	display: block;
	font-size: 1.25rem;
	font-weight: 700;
	color: #000;
	margin: 1rem 0;
	transition: color .2s;
}

#blog article:hover .entry-title{
	color: var(--primary-color);
}

#blog article p{
	line-height: 1.8rem;
	margin-bottom: 1rem;
}

/**************************************/

.blog-container .sidebar{
	margin-left: 2rem;
}

.blog-container .sidebar .widget_block:first-child{
	padding-bottom: 1.5rem;
}

.blog-container .sidebar .widget_block:not(:first-child){
	padding: 1.5rem 0;
}

.blog-container .sidebar .widget_block h2{
	font-size: 1.25rem;
}

.blog-container .sidebar .widget_block ul{
	margin-top: 1.25rem;
}

.blog-container .sidebar .widget_block ul > li:not(:last-child){
	margin-bottom: 1rem;
}

.blog-container .sidebar .widget_block ul > li > a{
	color: #000;
	transition: color .2s;
}

.blog-container .sidebar .widget_block ul > li > a:hover{
	color: var(--primary-color);
}

.blog-container .sidebar .widget_block ul > li > time{
	font-weight: 600;
	text-transform: uppercase;
	opacity: .4;
	margin-top: .3rem;
}

.blog-container .sidebar .wp-block-search__button{
	border: 0;
}

/**
 * Blog single page styling
 */

#blog-single .attachment-post-thumbnail{
	border-radius: 20px;
	margin-bottom: 2rem;
}

#blog-single .entry-title{
	font-size: 2rem;
	line-height: 2.25rem;
}

#blog-single .article-date{
	font-weight: 500;
	color: var(--primary-color);
	margin: .5rem 0 1rem;
}

#blog-single article > p:not(:last-child){
	margin-bottom: 1.25rem;
}

/********************************************************************************************************************/
/* General page styling */
/********************************************************************************************************************/

#general-page{
	padding-top: 300px;
	padding-bottom: 100px;
}

#general-page .page-title{
	font-size: 3rem;
	margin-bottom: 3rem;
}

#general-page h2{
	margin-bottom: 1.25rem;
}

#general-page h3,
#general-page p{
	line-height: 1.6rem;
	margin-bottom: 1rem;
}

#general-page p + h2,
#general-page ul + h2{
	margin-top: 30px;
}

#general-page ul{
	padding-left: 50px;
}

#general-page ul li{
	list-style-type: initial;
	color: var(--font-color);
	margin-bottom: 10px;
}

/********************************************************************************************************************/
/* FOOTER STYLE */

footer{
	position: relative;
	background-color: var(--primary-color);
	padding-top: 8rem;
	clip-path: polygon(0 5rem, 100% 0, 100% 100%, 0 100%);
	z-index: 100;
}

footer .wrap.flex{
	justify-content: center;
	gap: 5rem;
}

footer .footer-menu{
	max-width: 300px;
	color: #fff;
}

footer .footer-menu h3::after{
	display: block;
	content: '';
	width: 100%;
	border-bottom: 2px solid #000;
	opacity: .1;
	margin: 1rem 0;
}

footer .footer-menu .footer-menu-item{
	font-weight: 400;
	margin-bottom: 1rem;
}

footer .footer-menu .footer-menu-item h4{
	font-size: .75rem;
	text-transform: uppercase;
	margin-bottom: .5rem;
}

footer .footer-menu .footer-menu-item a{
	color: #fff;
	transition: color .2s;
}

footer .footer-menu .footer-menu-item a:hover{
	color: #000;
}

footer .footer-menu .menu > li:not(:last-child){
	margin-bottom: .625rem;
}

footer .footer-menu .menu > li > a{
	color: #fff;
	transition: color .2s;
}

footer .footer-menu .menu > li > a:hover{
	color: #000;
}

footer .footer-socials{
	display: flex;
	gap: .5rem;
	margin-top: 2rem;
}

#home-content + footer{
	margin-top: -6rem;
}

/**
 * CMEQ styling
 */

footer .cmeq-container {
	margin-top: 3rem;
}

footer .cmeq-container img {
	max-width: 500px;
	margin: 0 auto 1rem;
}

footer .cmeq-container p {
	font-weight: 600;
}

/**
 * Subfooter styling
 */

footer .subfooter{
	color: #fff;
	padding: 2rem 0;
	margin-top: 6rem;
}

footer .subfooter .wrap.flex{
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 2rem;
}

footer .subfooter a{
	font-weight: 600;
	color: #fff;
	transition: color .2s;
}

footer .subfooter a:hover{
	color: #000;
}

/********************************************************************************************************************/

.social-icon{
	width: 1.75rem;
	height: 1.75rem;
	transition: background-color .2s;
}

#nav .social-icon{
	background-color: #000;
}

#nav .social-icon:hover{
	background-color: var(--primary-color);
}

footer .social-icon{
	background-color: #fff;
}

footer .social-icon:hover{
	background-color: #000;
}

.social-icon.facebook{
	mask: url(img/icons/icon-facebook.svg) no-repeat center center/contain;
}
.social-icon.instagram{
	mask: url(img/icons/icon-instagram.svg) no-repeat center center/contain;
}
.social-icon.social-x{
	mask: url(img/icons/icon-x.svg) no-repeat center center/contain;
}
.social-icon.youtube{
	mask: url(img/icons/icon-youtube.svg) no-repeat center center/contain;
}
.social-icon.linkedin{
	mask: url(img/icons/icon-linkedin.svg) no-repeat center center/contain;
}

/********************************************************************************************************************/

.form-result{
	color: #fff;
	padding: 1rem;
	margin-bottom: 2rem;
}

.form-result.error{
	background-color: red;
}

.form-result.success{
	background-color: var(--primary-color);
}

/********************************************************************************************************************/

.page-not-found .buttons {
	margin-top: 3rem;
}

/********************************************************************************************************************/

/* CSS MEDIA QUERIES - WIDTH */

@media screen and (max-width: 1600px) {

}

@media screen and (max-width: 1450px) {

	.wrap{width:1100px;}

	#nav .nav-main .logo img {
		width: 310px;
	}

	#nav .nav-main .menu > li > a {
		font-size: .875rem;
	}

	#nav .nav-main .menu > li.btn-quote > a {
		padding: .875rem 1rem;
	}

	/**
	 * Home page media queries
	 */

	.quote-form input[type=text],
	.quote-form input[type=email],
	.quote-form select,
	.quote-form textarea{
		font-size: .875rem;
	}

}

@media screen and (max-width: 1150px) {

	.wrap{width:900px;}

	/**
	 * General media queries
	 */

	.col-3{
		gap: 1rem;
	}

	.block-center{
		width: 100%;
	}

	/**
	 * Navbar media queries
	 */

	#nav .nav-top .item {
		font-size: .875rem;
	}

	#nav .nav-main .flex {
		gap: 1.5rem;
	}

	#nav .nav-main .menu > li > a {
		font-size: .76rem;
	}

	#nav .nav-main .logo img {
		width: 225px;
	}

	#nav.scrolled .nav-main .logo img {
		height: 55px;
	}

	/**
	 * Home page media queries
	 */

	#home-content .icon-box{
		padding: 0;
	}

	#home-content .icon-box .icon{
		margin-right: 1rem;
	}

	#home-content .services .services-container{
		flex-wrap: wrap;
	}

	#home-content .services .service-box{
		width: calc(50% - 1rem);
		max-width: calc(50% - 1rem);
	}

	@media (hover: hover) {

		#home-content .services .service-box:hover{
			transform: translateY(-1rem);
		}

	}

	#home-content .article .article-title{
		font-size: 1.25rem;
	}

	.quote-form > *.half-width{
		width: 100%;
	}

	/**
	 * General page media queries
	 */

	#page-top .page-title{
		max-width: 75%;
	}

	#page-top .page-title h1,
	#general-page .page-title{
		font-size: 2.5rem;
	}

	#blog article .article-date,
	#home-content article .article-date{
		font-size: .75rem;
		padding: .75rem;
	}

	#contact .open-hours{
		padding: 6rem 8rem 10rem 6rem;
	}

}

@media screen and (max-width: 950px) {

	.wrap{width:700px;}

	/**
	 * General media queries
	 */

	.col-2{
		flex-direction: column;
	}

	.col-2 > *{
		flex-basis: 100%;
	}

	.col-3 > *{
		width: 100%;
	}

	/*.col-4{
		grid-template-columns: 1fr 1fr;
	}*/

	.col-4 > *{
		width: 47.5%;
	}

	.section-title .main-title{
		font-size: 2rem;
	}

	.block-center.w-60{
		width: 100%;
	}

	.page-top-pad{
		padding: 150px 0 3rem;
	}

	/**
	 * Navbar media queries
	 */

	#nav .nav-main .nav-menu{
		display: none;
	}

	#nav .nav-main .mobile-menu-open-btn{
		display: block;
	}

	#nav .nav-main .logo img {
		width: 330px;
	}

	/**
	 * Hero section media queries
	 */

	#hero-section .swiper-slide{
		height: 800px;
	}

	#hero-section .swiper-slide .flex{
		bottom: 25%;
	}

	#hero-section .swiper-slide h1,
	#hero-section .swiper-slide h2{
		font-size: 2rem;
	}

	#hero-section .swiper-slide p{
		font-size: 1.25rem;
		line-height: 1.5;
		margin-bottom: 2.5rem;
	}

	/**
	 * Home page media queries
	 */

	#home-content .col-reverse{
		flex-direction: column-reverse;
	}

	#home-content .icon-boxes{
		gap: 3rem;
		padding: 5rem 0;
	}

	#home-content .icon-box{
		width: 100%;
	}

	#home-content .blog .col-3{
		grid-template-columns: auto;
		gap: 3rem;
	}

	#home-content .article > *:not(:last-child){
		margin-bottom: 1.5rem;
	}

	/*#home-content .portfolio .portfolio-container{
		grid-template-columns: 1fr 1fr;
	}*/

	#home-content .portfolio .portfolio-single{
		width: 46%;
	}

	#home-content .portfolio .portfolio-single:hover{
		transform: translateY(-.625rem);
	}

	#home-content .partners .partners-container{
		gap: 3rem;
	}

	.quote-form > *.half-width{
		width: 47.5%;
	}

	/**
	 * General page media queries
	 */

	#page-top .page-title{
		max-width: 100%;
	}

	#about-us .cta-section{
		gap: 5rem;
	}

	#portfolio-single .portfolio-container{
		flex-direction: column;
	}

	#portfolio-single .portfolio-container > *:first-child,
	#portfolio-single .portfolio-container > *:last-child{
		width: 100%;
	}

	#portfolio-single .sidebar{
		margin-left: 0;
		margin-top: 3rem;
	}

	.blog-container .grid-2{
		grid-template-columns: auto;
	}

	.blog-container .sidebar{
		margin-left: 3rem;
	}

	#blog-single .blog-container{
		flex-direction: column;
	}

	#blog-single .blog-container > *:first-child,
	#blog-single .blog-container > *:last-child{
		width: 100%;
	}

	#blog-single .blog-container .sidebar{
		margin-top: 5rem;
		margin-left: 0;
	}

	#contact .open-hours{
		padding: 6rem 4rem 10rem 4rem;
	}

	/**
	 * Footer media queries
	 */

	footer .wrap.flex{
		flex-wrap: wrap;
		gap: 3rem;
	}

	footer .footer-menu{
		width: 45%;
	}

	footer .footer-menu .footer-menu-item,
	footer .footer-menu .menu > li > a,
	footer .subfooter .wrap.flex{
		font-size: .875rem;
	}

	footer .footer-menu .menu > li:not(:last-child){
		margin-bottom: 1rem;
	}

}

@media screen and (max-width: 750px) {

	.wrap{width: 500px;}

	/**
	 * General media queries
	 */

	.grid-2{
		grid-template-columns: auto;
		gap: 2rem;
	}

	.section-title.sm-title .main-title{
		font-size: 1.25rem;
		line-height: 2rem;
	}

	.image-shape-layout{
		box-shadow: -5rem 3rem 0 #e5e5e5;
		margin: 0;
	}

	.image-shape-layout-reverse{
		box-shadow: 5rem 3rem 0 #e5e5e5;
		margin: 0;
	}

	/**
	 * Navbar media queries
	 */

	#nav .nav-top{
		display: none;
	}

	#nav::before{
		display: block;
		content: '';
		width: 100%;
		height: 50%;
		position: absolute;
		top: 0;
		left: 0;
		background-color: inherit;
		transform: skewY(1.5deg) scaleZ(1);
		transition: transform .5s;
	}

	#nav.scrolled::before{
		transform: skewY(0);
	}

	/**
	 * Hero section media queries
	 */

	#hero-section .swiper-slide{
		height: 700px;
	}

	#hero-section .swiper-slide h1,
	#hero-section .swiper-slide h2{
		max-width: 85%;
		font-size: 1.75rem;
	}

	#hero-section .swiper-slide p{
		max-width: 85%;
		font-size: 1.125rem;
	}

	#hero-section .swiper-slide .btn-hero{
		font-size: 1.125rem;
	}

	/**
	 * Home page media queries
	 */

	#home-content .services .service-box{
		width: 85%;
		max-width: none;
	}

	#home-content .testimonies{
		clip-path: polygon(0 0, 100% 5%, 100% 100%, 0 95%);
	}

	#home-content .testimonies .section-title{
		font-size: 1.5rem;
	}

	#home-content .testimonies .testimony-slider{
		width: 100%;
	}

	#home-content .testimonies .testimony-slider .testimony-message,
	#home-content .testimonies .testimony-slider .testimony-name{
		line-height: 1.625rem;
	}

	#home-content .testimonies .testimony-slider .testimony-name{
		margin-top: 1rem;
	}

	#home-content .testimonies .testimony-slider-dots{
		display: block;
	}

	#home-content .testimonies .testimony-slide-arrow{
		display: none;
	}

	#home-content .portfolio .portfolio-single .portfolio-title {
		font-size: 1.125rem;
	}

	#home-content .partners .partners-container{
		justify-content: center;
		flex-wrap: wrap;
	}

	#home-content .partners .partners-container > a{
		max-width: 25%;
	}

	/**
	 * General page media queries
	 */

	#general-page{
		padding-top: 250px;
	}

	#page-top{
		height: 600px;
	}

	#page-top::after{
		height: 80px;
	}

	#page-top .page-title {
		top: 55%;
	}

	#page-top .page-title h1,
	#general-page .page-title{
		font-size: 2rem;
	}

	#page-top .page-title p{
		max-width: 80%;
		font-size: 1.25rem;
	}

	#about-us .cta-section{
		flex-direction: column;
		align-items: flex-start;
		gap: 2rem;
	}

	#services-single .col-center {
		grid-column: auto;
	}

	#services-single .col-center ul {
		grid-template-columns: auto;
		padding-left: 2rem;
		padding-right: 0;
	}

	#services-single .lr-text {
		flex-direction: column;
	}

	#services-single .sm-text-block>h3:not(:first-of-type) {
		margin-top: 2rem;
	}

	.blog-container{
		flex-direction: column;
	}

	.blog-container > *:first-child,
	.blog-container > *:last-child{
		width: 100%;
	}

	.blog-container .sidebar{
		margin-top: 5rem;
		margin-left: 0;
	}

	/*#contact section:first-child .col-3{
		grid-template-columns: auto;
	}*/

	/**
	 * Footer media queries
	 */

	footer .footer-menu{
		width: 40%;
	}

	footer .cmeq-container img {
		max-width: 75%;
	}

	footer .subfooter .wrap.flex{
		justify-content: center;
		gap: 1rem;
	}

}

@media screen and (max-width: 550px) {

	.wrap{width: 90%;}

	html{
		font-size: 14px;
	}

	/**
	 * General media queries
	 */

	.col-2{
		gap: 2rem;
	}

	.section-title .main-title{
		font-size: 1.625rem;
		line-height: 2rem;
		margin-bottom: 1.5rem;
	}

	.section-title .extra-title{
		font-size: 1.25rem;
		font-weight: 500;
		margin-bottom: 1rem;
	}

	.image-shape-layout,
	.image-shape-layout-reverse{
		border: 0;
		box-shadow: none;
	}

	.icon-boxes-col .icon-box .icon-container .icon,
	.icon-boxes-col .icon-box .icon-container .image{
		mask-size: 4rem 4rem;
		padding: 3.5rem 0;
	}

	/**
	 * Navbar media queries
	 */

	#nav .nav-main .logo img{
		width: 260px;
	}

	#nav.scrolled .nav-main .logo img{
		max-width: 220px;
		height: 60px;
	}

	/**
	 * Hero section media queries
	 */

	#hero-section .swiper-slide h1,
	#hero-section .swiper-slide h2,
	#hero-section .swiper-slide p{
		max-width: 100%;
	}

	/**
	 * Home page media queries
	 */

	#home-content::before{
		top: 0;
	}

	#home-content .presentation img{
		border-right: 1rem solid #fff;
	}

	#home-content .services .service-box{
		width: 100%;
		min-height: 300px;
	}

	#home-content .services .service-box h3{
		font-size: 1.5rem;
	}

	#home-content .partners .partners-container{
		gap: 2rem;
	}

	#home-content .partners .partners-container > a{
		max-width: 30%;
	}

	.quote-form > *.half-width{
		width: 100%;
	}

	/**
	 * General page media queries
	 */

	#general-page{
		padding-top: 180px;
	}

	#page-top{
		height: 500px;
	}

	#page-top .page-title h1,
	#general-page .page-title{
		font-size: 1.75rem;
	}

	#page-top .page-title p{
		max-width: 100%;
		font-size: 1.125rem;
	}

	#portfolio-single .main-content .portfolio-gallery{
		grid-template-columns: 1fr 1fr;
		gap: .5rem;
	}

	#blog-single .entry-title{
		font-size: 1.75rem;
		line-height: 2rem;
	}

	#contact .contact-form{
		gap: 2rem 1rem;
	}

	#contact .contact-form > *.half-width{
		width: 100%;
	}

	#contact .hours-section iframe{
		min-height: 350px;
	}

	#contact .open-hours{
		padding: 4rem 2rem 10rem 2rem;
	}

	/**
	 * Footer media queries
	 */

	footer{
		padding-top: 6rem;
		clip-path: polygon(0 2rem, 100% 0, 100% 100%, 0 100%);
	}

	footer .footer-menu{
		width: 100%;
	}

	footer .footer-socials{
		gap: .875rem;
	}

}

/* CSS MEDIA QUERIES - HEIGHT */


@media screen and (max-height: 1000px) and (min-width: 550px) {
	#page-top {
		height: 750px;
	}
}

@media screen and (max-height: 810px) {
	
}