/**
 * Theme Name:          Mai Law Pro
 * Theme URI............https://maitheme.com
 * Description:         Mai Law Pro is a custom child theme for The Genesis Framework.
 * Author:              Mike Hemberger, BizBudding Inc
 * Author URI:          https://bizbudding.com/
 * Version:             1.3.0
 *
 * Template:            genesis
 *
 * License:             GPL-2.0+
 * License URI:         http://www.opensource.org/licenses/gpl-license.php
 */


/* Table of Contents

	- Defaults
	- Media Queries (mobile-first)
	- Media Queries (mobile-second)

*/
/*====== VARIABLES ======*/
:root{
	--primary-color: #EB5E28;
	--secondary-color: #0B6161;
	--gray-color: #F1EDE5;
	--white-color: #fff;
	--black-color: #000000;
	--transparent-color: #00000000;
	--hmsection5-background: url(https://paysagistelatino.com/wp-content/uploads/2021/09/bush-block.jpg);
	--single-service__style1-margin : 10em;
	--column_desk-row_mobile: column;
	--row_desk-column_mobile: row;
}
/*====== FONT ROBOTO ======*/
@font-face{
	font-family: Roboto;
	src: url('fonts/roboto/roboto-regular.ttf');
	font-weight: 400;
}
@font-face{
	font-family: Roboto;
	src: url('fonts/roboto/roboto-light.ttf');
	font-weight: 300;
}
@font-face{
	font-family: Roboto;
	src: url('fonts/roboto/roboto-bold.ttf');
	font-weight: 600;
}
@font-face{
	font-family: Roboto;
	src: url('fonts/roboto/roboto-italic.ttf');
	font-style: italic;
}

/* # Defaults
---------------------------------------------------------------------------------------------------- */
body { font-family: 'Roboto', Source Sans Pro, sans-serif; font-weight: 300; background-color: var(--white-color); scroll-behavior: smooth;}
h1,
.banner-title,
.heading,
.widget-title,
.widgettitle {
	font-family: 'Roboto', serif;
	font-weight: 700;
	letter-spacing: 1px;
}
h1 { font-size: 2.8em; }
h2 { font-size: 2.5em; }
h3 { font-size: 2.2em; }

h2, h3, h4, h5, h6 { 
	font-family: 'Roboto', Poppins, sans-serif;
	font-weight: 600;
	color: var(--secondary-color); 
	letter-spacing: 0.6px;
}
.heading { text-align: inherit; }

.genesis-nav-menu a { font-weight: normal; }

li { list-style: none; }

.entry-content p { line-height: 1.25em; margin: 0;}
:focus { outline: none; }
.site-container .gform_wrapper input:not([type=radio]):not([type=checkbox]):not([type=submit]):not([type=button]):not([type=image]):not([type=file]),
input[type=email], 
input[type=number], 
input[type=password], 
input[type=tel], 
input[type=text], 
input[type=url], textarea, select{
    border-radius: 1em;
	background-color: var(--white-color);
}
select{
    width: 100%;
    height: 3em;
    border: 1px solid #eee;
}
select option { color: var(--secondary-color); }
textarea { height: 5em; resize: none; }

/*====== GENERAL CLASS ======*/
/*- SLIDER -*/
.wpls-logo-showcase button.slick-arrow { width: 20px; }
.wpls-logo-showcase button.slick-next, .wpls-logo-showcase button.slick-next:active, 
.wpls-logo-showcase button.slick-next:hover, .wpls-logo-showcase button.slick-next:focus { 
	background: url(https://paysagistelatino.com/wp-content/uploads/2021/10/arrow_right.png) no-repeat !important; 
	background-size: 20px 30px !important;
}
.wpls-logo-showcase button.slick-prev, .wpls-logo-showcase button.slick-prev:active, 
.wpls-logo-showcase button.slick-prev:hover, .wpls-logo-showcase button.slick-prev:focus { 
	background: url(https://paysagistelatino.com/wp-content/uploads/2021/10/arrow_left.png) no-repeat !important; 
	background-size: 20px 30px !important;
}


/*- SECTIONS -*/
section.section { padding: .8em; }
section.section.medium__section .wrap { max-width: 1300px; }
section.section.large__section .wrap { max-width: 1700px; }
.footer__section {    
	height: 200px;
    display: flex;
    flex-direction: column;
    justify-content: space-around;
}

/*- BANNER PAGES -*/
.banner-page { color: #fff; }
.banner-page .section-content { max-width: 880px; }
.banner-page .banner-logo, .banner-page .title-banner{ margin-bottom: 32px; }
.home.banner-page .banner-logo, .home.banner-page .title-banner{ margin-bottom: 14px; }

/*- COLUMNS -*/
.columns-2 { 
	display: flex;
	justify-content: center;
	gap: 2em;
	flex-direction: var(--row_desk-column_mobile);
}
.columns-2.columns__center { align-items: center; }
.columns-2__col1, .columns-2__col2 { 
	flex-basis: 50%;  
	display: flex; 
	flex-direction: column; 
	justify-content: center;
}
.columns-2__col1.items__center, .columns-2__col2.items__center { align-items: center; }
.columns-2__col1.direction__row, .columns-2__col2.direction__row { flex-direction: row; }


/*- CUSTOM FORM -*/
.custom-form .wrap { padding: 3em .5em; }

/*- BUSH AND WALL BACKGROUND -*/
.section__bush_wall{ height: 550px; position: relative; background-image: url(https://paysagistelatino.com/wp-content/uploads/2021/09/bush-block-rotate.jpg); }
.section__bush_wall .section-content{ position: absolute; padding: 0 2em; }
.section__bush_wall-text { color: var(--white-color); }
.entry-content .section__bush_wall-images { margin-top: -10em; }
.bush__wall-btn { z-index: 1; }

/*- SERVICE -*/
.service { max-width: 1100px; }
.entry-content .service__description { margin-bottom: 1em; }
.service__section-content { display: flex; justify-content: space-between;}
.service__section-content.vcolumns{ flex-direction: column; }
.service__section-title { flex-basis: 25%; margin-bottom: 2em;}

/*- GALLERY SERVICE -*/
.service__section_gallery { margin-bottom: 1.5em; }
.service__section_gallery .section-content { flex-basis: 100%; max-width: 100%; }
.service__section_gallery { 
	position: relative;
	display: flex;
	gap: 1em;
    max-width: max-content;
	width: 100%;
	overflow-x: scroll;
	scroll-snap-type: x mandatory;
	-ms-overflow-style: none;  /* IE and Edge */
    scrollbar-width: none;  /* Firefox */
} 
.service__section_gallery::-webkit-scrollbar { display: none; }
.service__section_gallery-title{ 
	color: var(--white-color);
    z-index: 2;
    position: absolute;
	border-bottom: 1px solid;
    border-top: 1px solid;
    padding: .5em;
}
.service__section_gallery-box { 
	width: 18em;
    height: 18em;
	margin: 0 auto;
	display: flex;
    justify-content: center;
    align-items: center; 
	position: relative; 
	scroll-snap-align: center;
}
.service__section_gallery-img img, .overlay-green {
	position: absolute;
	width: 100%;
	height: 100%;
	overflow: hidden;
	top: 0;
	left: 0;
}
.overlay-green { z-index: 2; background-color: rgba(11,97,97,0.5); }

/*- GALLERY PAGE -*/
.service__section-content.gallery_page { position: relative; }
.service__section_gallery.gallery_page { width: 95%; } 
.service__section_gallery-box.gallery_page-box { flex: 1 0 auto;  }
.overlay__scroll {
    position: absolute;
    overflow: hidden;
    bottom: 7em;
    right: 0;
    z-index: 1;
    display: flex;
    justify-content: center;
    align-items: center;
	opacity: 1;
	transition: opacity 200ms linear;
}
.overlay__scroll-text{ 
	color: var(--white-color);    
	background: var(--primary-color);
    padding: .6em; 
	border-radius: 14px;
	
}
.service__section-content.gallery_page:hover .overlay__scroll { opacity: 0.7; transition: opacity 200ms linear; }

/* SINGLE SERVICE -*/
.section__single_service.style-1, .section__single_service.style-2  { gap: 5em; }
.section__single_service-photos { 
	display: flex; 
	justify-content: flex-start; 
	align-items: center; 
    gap: 1em;
    max-width: max-content;
    width: 100%;
    overflow-x: scroll;
    scroll-snap-type: x mandatory;
	-ms-overflow-style: none;  /* IE and Edge */
    scrollbar-width: none;  /* Firefox */
}
.style-1__photos_col1, .style-1__photos_col2,
.style-2__photos_col1, .style-2__photos_col2 {
	flex: 1 0 auto;
}
.section__single_service-photos::-webkit-scrollbar { display: none; }

/*- SINGLE SERVICE STYLE 1-*/
.section__single_service .style-1__photos_col2 { margin-top: var(--single-service__style1-margin); }
.style-1__photos_col1, .style-1__photos_col2{
	display: flex;
    flex-direction: var(--column_desk-row_mobile);
    align-items: center;
    justify-content: center;
	gap: 1em;
}

/*- SINGLE SERVICE STYLE 2-*/
.section__single_service.style-2 { flex-direction: column; align-items: center; }
.section__single_service.style-2 .section__single_service-description,
.section__single_service.style-2 .section__single_service-photos{
	flex-grow: 1;
}
.section__single_service.style-2 .section__single_service-photos { display: flex; gap: 2em; }
.style-2__photos_col1, .style-2__photos_col2 {
    display: flex;
    gap: 2em;
	height: 20em;
}
.style-2__img-top { align-self: flex-start; }
.style-2__img-bottom { align-self: flex-end;  }


/*- GRID -*/
.grid {
    display: grid;
    gap: 2em;
    grid-template-columns: repeat(auto-fit, minmax(20rem, 1fr));
}
.grid_box {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
	margin: 0 auto;
}
.grid__box-img {
    width: 100vw;
	height: 80%;
    filter: brightness(0.7);
	transition: 300ms linear;
}
.grid__box-title {
    width: 100%;
    box-shadow: 0px 2px 3px #0000001a;
    text-align: center;
    padding: .5em;
    color: #252422;
    font-size: 1.3em;
    font-weight: 500;
	transition: 300ms linear;
}
.grid__box-title { opacity: .8; }
.grid__box:hover .grid__box-title { color: var(--black-color); opacity: 1; transition: 200ms linear; }
.grid__box:hover .grid__box-img { filter: brightness(0.9); transition: 300ms linear; }

/*- BUTTONS -*/
a, .entry-content a{ text-decoration: none; }
a.btn, input.btn {
    background: var(--primary-color);
    color: var(--white-color);
	font-size: 1.2em;
    padding: 12px 24px;
    display: flex;
    max-width: max-content;
    margin: 0 auto;
    border-radius: 14px;
    font-weight: 400;
	transition: 300ms linear;
	border: 1px solid var(--transparent-color);
	cursor: pointer;
}
a.btn:hover, input.btn:hover {
    background: var(--white-color);
    color: var(--primary-color);
	border: 1px solid var(--primary-color);
	transition: 300ms linear;
}
a.btn__border-bottom {
    padding: 0 .5em .5em .5em;
    border-bottom: 1px solid var(--secondary-color);
    color: var( --primary-color);
	font-weight: 400;
	cursor: pointer;
	position: relative;
}
a.btn__border-bottom::after {
	font-family: "dashicons";
    content: '\f344';
    display: inline;
    margin-left: .5em;
	position: absolute;
	color: var(--primary-color);
	transition: 300ms linear;
}
a.btn__border-bottom:hover { color: var(--secondary-color); border-bottom: 1px solid var(--primary-color); }
a.btn__border-bottom:hover:after { transform: translatex(10px); transition: 300ms linear; }

/*- TITLES -*/
.h3-gray{ color: #707070; }
.text__with_icon { display: flex; align-items: center; gap:1em; }

/*- PARAGRAPHS -*/
.entry-content p.text__secondary-color { 
	color: var(--secondary-color);
	line-height: 1.6em;
	font-weight: 500;
}
p.large-text{
	font-size: 1.7em;
	font-weight: 400;
	margin-bottom: 24px;
}
p.medium-text{
	font-size: 1.3em;
	font-weight: 400;
	margin-bottom: 24px;
}
.italic-text { font-style: italic; font-weight: 600;}

/*- SPACE -*/
.space-1em { margin-bottom: 1em; }
.space-2em { margin-bottom: 2em; }
.space-3em { margin-bottom: 3em; }
.space-5em { margin-bottom: 5em; }
.space-6em { margin-bottom: 6em; }

/*- ANIMATION DELAY -*/
.delay-5{
  animation-delay: 5s;
}

/*====== HEADER ======*/
header.site-header.has-header-right .wrap { max-width: max-content; }
.site-header-row.row.middle-xs.between-xs { gap: 3em; }
ul#menu-accueil-menu { gap: 1.5em .1em; padding: 2em 0; }
header.site-header { background-color: var(--primary-color); }
.home .nav-header.menu > li > a, .nav-header.menu > li > a{
    color: var(--white-color);
    text-transform: uppercase;
    font-weight: 400;
	padding: 4px 8px;
	margin: 0 .5em;
	transition: 500ms;
}
.mobile-menu li > a:hover,
.mobile-menu li.current-menu-item > a,
.home .mobile-menu li.current-menu-item > a,
.mobile-menu li > a:focus {
    color: var(--primary-color);
	transition: 500ms;
}
nav-header li > a:hover,
.nav-header li.current-menu-item > a,
.home .nav-header li.current-menu-item > a{ 
}
.nav-header.menu > li.btn-menu > a{
	color: var(--primary-color);
    background: var(--white-color);
    padding: 6px 12px;
    border-radius: 12px;
}
nav.nav-header_right ul > li.current-menu-item > a:before, 
nav.nav-header_right ul > li.menu-item:hover > a:before {
    opacity: 1;
    transition: opacity 300ms;
    background-position: left bottom;
}
.nav-header.menu > li > a:before{
    content: "";
    position: absolute;
    width: 1.4285714286rem;
    height: .12em;
	left: .5rem;
    top: 1.8em;
    opacity: 0;
    background: linear-gradient(to left, #ccc 50%, var(--white-color) 50%);
    background-position: right bottom;
    background-size: 200% 100%;
    transition: all 0.2s ease-out;
    transition-timing-function: linear;
}
.nav-header.menu > li.btn-menu > a:before{ content: ''; width: 0; }
span.mai-bars { color: var(--white-color); }
.nav-header>.menu-item-has-children:not(.highlight):hover>a { color: var(--white-color); }
.nav-header .sub-menu { 
	border: 10px solid  white; 
	border-radius: 14px; 
	width: 250px;
    background-color: white;
}
.nav-header .sub-menu a:hover { background-color: var(--white-color); }
.nav-header .sub-menu a { 
	color: var(--primary-color); 
	text-transform: uppercase; 
	font-weight: 400; 
	padding: 1em;
	font-size: 1em;
	white-space: nowrap;
}

/*====== HOME ======*/
.hmheader { 
	background-image: url(https://paysagistelatino.com/wp-content/uploads/2021/09/header-home-courtyard.jpg);
	background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}
.hmsection4 p.italic-text {
    color: var(--secondary-color);
    font-weight: 600;
    letter-spacing: 1px;
}
.hmsection5{ background-image: var(--hmsection5-background); }
.columns-2__col1.contact-info { 
	display: flex; 
	flex-direction: column; 
	position: relative; 
}
.ctsection__number, .ctsection__email, .ctsection__img { margin: 1em 0; }
.ctsection__info { max-width: 430px; }
div.wpcf7 { color: var(--secondary-color); }
div.wpcf7 form.wpcf7-form { 
	padding: 2em; 
	background-color: white; 
	border-radius: .6em; 
}
div.wpcf7 .label { font-weight: 600; margin: 1em 0; }
.form__services span.wpcf7-form-control.wpcf7-checkbox {
    display: grid;
    gap: 1em;
    grid-template-columns: repeat(auto-fit, minmax(10rem, 1fr));
    margin: 1em;
}
.form__services .wpcf7-list-item { margin: 0; }
.form__services .label { padding: 1em 0; }
.form__time, .form__questions { margin: 2em auto; }
.form__btn{
	display: flex;
    justify-content: flex-end;
    flex-direction: column;
    align-items: flex-end;
}
.form__btn .btn { margin: 0; }

/*====== FOOTER ======*/
div#genesis-footer-widgets { background-color: var(--primary-color);}
div#genesis-footer-widgets .row {
	display: flex;
    justify-content: center;
    align-items: center;
}
footer.site-footer.text-sm { background-color: #252422; color: var(--white-color); font-size: .8em; }

/* # Media Queries (mobile-first)
---------------------------------------------------------------------------------------------------- */

@media only screen and (min-width: 545px) {}

@media only screen and (min-width: 769px) {
	/*- BUSH AND WALL -*/
	.section__bush_wall { background-position: center; background-repeat: repeat-x; }
	.section__bush_wall .section-content{ top: 8em; }
	
	/*- BUSH AND WALL ROTATE -*/
	.section__bush_wall.bush__rotate .section-content{ bottom: 8em; top: auto; }
}

@media only screen and (min-width: 993px) {}

@media only screen and (min-width: 1160px) {}

/* # Media Queries (mobile-second)
---------------------------------------------------------------------------------------------------- */

@media only screen and (max-width: 1450px) {
	/*-  SERVICE SECTION -*/
	.site-container .site-inner .entry-content .service__section .wrap{ justify-content: center; }
	.service__section-content { flex-direction: column;  align-items: center; }
	
	/*- GALLERY SERVICE -*/
	.service__section_gallery-box { flex: 1 0 auto;}
}

@media only screen and (max-width: 1159px) {
	:root{
		--single-service__style1-margin: 0em;
		--column_desk-row_mobile: row;
		--row_desk-column_mobile: column;
	}
	
	/*- COLUMNS -*/
	.columns-2__col1, .columns-2__col2 { flex-basis: 100%; width: 100%; }
	
	/*- BUSH AND WALL ROTATE -*/
	.section__bush_wall-images .section-content{
		display: flex;
		justify-content: center;
		flex-direction: column;
		margin: 0 auto;
	}
	.section__bush_wall-images .grid { display: none; }
	.section__bush_wall-images .space-2em { order: 1; }
	
	/*- SINGLE SERVICE STYLE 2 -*/
	.style-2__img-bottom { align-self: flex-start; }	
	
	/*====== HOME ======*/
	.hmsection11__img {
		position: absolute;
		width: 6em;
		right: 0;
		bottom: -75px;
		margin: 0;
	}
}

@media only screen and (max-width: 992px) {
	/*- FONTS -*/
	h1 { font-size: 1.9em; }
	h2 { font-size: 1.6em; }
	h3 { font-size: 1.4em; }
	p.large-text{ font-size: 1.2em; }
	p.medium-text{ font-size: 1em; }
	.overlay__scroll { bottom: -1em;  width: 100%;}
}

@media only screen and (max-width: 768px) {
	:root{
		--hmsection5-background: url(https://paysagistelatino.com/wp-content/uploads/2021/09/block-bush-mobile.jpg);
	}
	
	/*- BUSH AND WALL -*/
	.section__bush_wall { background-position: center top; 	background-size: cover; }
	.section__bush_wall .section-content{ bottom: 8em; }
	
	/*- GRID -*/
	.grid { grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr)); }
}

@media only screen and (max-width: 544px) {}
@media only screen and (max-width: 370px) {
	/*- GALLERY SERVICE -*/
	.service__section_gallery-box { flex-basis: 100%; }
}
