/*

Theme Name: Hello Elementor Child

Theme URI: https://github.com/elementor/hello-theme/

Description: Hello Elementor Child is a child theme of Hello Elementor, created by Elementor team

Author: Elementor Team

Author URI: https://elementor.com/

Template: hello-elementor

Version: 1.0.1

Text Domain: hello-elementor-child

License: GNU General Public License v3 or later.

License URI: https://www.gnu.org/licenses/gpl-3.0.html

*/


/* Your CSS code goes here
-------------------------------------- */
:root{
	--mauve: #40002B;
	--mauve-2: #7B002C;
	--rouge: #BB392F;
	--vert: #09c300;
	--jaune: #ff9b04;
	--rose: #FF9C94;
	--bleu-clair: #E9F6FF;
	--beige: #FFFAF2;
	--bleu: #D3EAFA;

	--font: Poppins, sans-serif;
	--container-w: 1440px;
	--container-p: calc((1920px - var(--container-w)) / 2);
	--container-1200-w: 1200px;
	--container-1200-p: calc((1920px - var(--container-1200-w)) / 2);
	--header-h: 101px;
}

@media (max-width: 1920px){
	:root{
		--container-p: calc((100vw - var(--container-w)) / 2);
		--container-1200-p: calc((100vw - var(--container-1200-w)) / 2);
	}
}
@media (max-width: 1470px){ :root{--container-p: 15px;} }
@media (max-width: 1230px){ :root{--container-1200-p: 15px;} }
@media (max-width: 1024px){ :root{--header-h: 60px;} }

[data-elementor-type="header"] + main,
[data-elementor-type="header"] + div{
	padding-top: var(--header-h);
}

*{font-family: var(--font);}

body{
	max-width: 1920px;
	width: 100%;
	margin: 0 auto;
	overflow-x: hidden;
}

.container, .container-1200{
	width: 100%;
	max-width: calc(var(--container-w) + 30px);
	margin: 0 auto;
	padding-left: 15px;
	padding-right: 15px;
}

.container-1200{ max-width: calc(var(--container-1200-w) + 30px); }

button.reset{
	background-color: transparent;
	border: none;
	outline: none;
	padding: 0;
}

ul.reset,
ol.reset{
	list-style: none;
	margin: 0;
	padding: 0;
}

a, a:not(.btn):hover{
	text-decoration: none;
	color: inherit;
}

a:not(.btn):hover{text-decoration: underline;}

a.btn, button.btn{
	--bg-color: var(--mauve);
	--border-color: var(--bg-color);
	--text-color: white;
	background-color: var(--bg-color);
	color: var(--text-color);
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 10px;
	padding: 7px 15px;
	min-height: 30px;
	border-radius: 5px;
	font-size: 12px;
	line-height: 1.15;
	border: var(--border-color) 1px solid;
	transition: background-color .3s ease, color .3s ease;
	will-change: background-color, color;
	width: 100%;
	max-width: max-content;
}

.btn img, .btn svg{
	height: 1.1em;
	width: auto;
	display: flex;
}

a.btn-big, button.btn-big{
	min-height: 60px;
}

.btn path{
	transition: fill .3s ease;
	will-change: fill;
	fill: var(--text-color);
}

a.btn:hover, .btn:hover{
	--bg-color: white;
	--border-color: var(--mauve);
	--text-color: var(--border-color);
}

a.btn-red, button.btn-red{--bg-color: var(--rouge);}
a.btn-red:hover, button.btn-red:hover{
	--bg-color: white;
	--border-color: var(--rouge);
}

a.btn-mauve-2, button.btn-mauve-2{--bg-color: var(--mauve-2);}
a.btn-mauve-2:hover, button.btn-mauve-2:hover{
	--bg-color: white;
	--border-color: var(--mauve-2);
}

[type=button]:focus, [type=button]:hover, [type=submit]:focus, [type=submit]:hover, button:focus, button:hover{
	background-color: var(--mauve-2);
}