/*
Theme Name: Mairie Champagny-en-Vanoise 2026
Theme URI: https://www.mairie-champagny.fr/
Description: Thème créé par Net-tendance.com
Version: 1
Author: Net-tendance - Erwan Girerd
Author URI:   https://www.net-tendance.com
*/

@import url('https://fonts.googleapis.com/css2?family=Figtree:ital,wght@0,300..900;1,300..900&display=swap');
:root
{
	--CouleurCorail:#E07A6A;
	--CouleurTerraCotta:#A13F28;
	--CouleurTaupe:#75695D;
	/*--CouleurBleu:#0b1b33;*/
	--CouleurBleu:#192734;
	--CouleurBeige:#F5F1EB;
	--CouleurGrisChaud:#D6D1CB;
}


body, html{font: 14px/20px 'Roboto', sans-serif; font-weight: 300; color:#1d1d1d; border:0px; margin:0px; padding: 0px;}
body{}

a{ color:#1d1d1d; background: none;}
/* STRUCTURE*/
div#first{ width: 100%; display: block; text-align: center; float: left;}

@media screen and (max-width: 1024px) 
{
	div#first div#second{ width:  calc(100% - 20px);padding:10px; display: inline-block; text-align: left;  }
	div.CaseLimite{width: calc(100% - 20px); padding: 20px 10px; display: inline-block;}
}
@media screen and (min-width: 1024px) 
{
	div#first div#second{ width: 944px; display: inline-block; text-align: left;  }
	div.CaseLimite{width: 50%; display: inline-block;}
}
@media screen and (min-width: 1200px) 
{
	div#first div#second{ width: 1120px; display: inline-block; text-align: left;  }
	div.CaseLimite{max-width: 400px; width: calc(100% - 100px); display: inline-block;padding: 50px;}
}
@media screen and (min-width: 1400px) 
{
	div#first div#second{ width: 1320px; display: inline-block; text-align: left;  }
	div.CaseLimite{max-width: 500px; width: calc(100% - 100px); display: inline-block; padding: 50px;}
}

@media screen and (max-width: 1024px) {
}
@media screen and (max-width: 767px) {
}
@media screen and (min-width: 1024px) {
	.row{width: 100%;display: -webkit-box;  display: -moz-box;  display: -ms-flexbox;  display: -webkit-flex; display: flex !important;  -webkit-flex-direction: row;  -moz-flex-direction: row;  -ms-flex-direction: row;  flex-direction: row !important; float: none; display: inline-block; position: relative;}
	.row.h100{height: 100%;}
 	.row .case1{ flex: 1;display: inline-block; position: relative; }.row .case2{ flex: 2;display: inline-block; position: relative; }.row .case3{ flex: 3; display: inline-block; position: relative; max-width: calc(100% / 4);}.row .case4{ flex: 4; display: inline-block; position: relative;}.row .case5{ flex: 5; }.row .case6{ flex: 6; max-width: 50%; }.row .case7{ flex: 7; }.row .case8{ flex: 8; }.row .case9{ flex: 9; }.row .case10{ flex: 10; }.row .case11{ flex: 11; }.row .case12{ flex: 12; }
	
	.column{width: 100%;display: -webkit-box;  display: -moz-box;  display: -ms-flexbox;  display: -webkit-flex; display: flex !important;  -webkit-flex-direction: row;  -moz-flex-direction: row;  -ms-flex-direction: row;  flex-direction:column ; float: none; min-height: 100%; height: 100%; }
 	.column .case1{ flex: 1; flex-direction: column;}.column .case2{ flex: 2;flex-direction: column; }.column .case3{ flex: 3;flex-direction: column; }.column .case4{ flex: 4;flex-direction: column; }.column .case5{ flex: 5;flex-direction: column; }.column .case6{ flex: 6; max-height: 50%;flex-direction: column; }.column .case7{ flex: 7; flex-direction: column;}.column .case8{ flex: 8; flex-direction: column;}.column .case9{ flex: 9;flex-direction: column; }.column .case10{ flex: 10;flex-direction: column; }.column .case11{ flex: 11; flex-direction: column;}.column .case12{ flex: 12; flex-direction: column;}
	
	.row > div, .column > div{position: relative;}	
}
@media screen and (max-width: 1024px) 
{
	.row, .column{float: left; width: 100%;}
}

.txtcenter { text-align:center;}

.DesignTxt1{color:#A13F28;font: 14px/20px 'Roboto', sans-serif; font-weight: 300; text-transform: uppercase; letter-spacing: 1px;}
.DesignTxt1 p{padding: 0px; margin: 0px;}

.DesignTxt2{color:var(--CouleurTaupe);font: 14px/20px 'Roboto', sans-serif !important; font-weight: 300; text-transform: uppercase; letter-spacing: 1px; margin-top: 0px; display: inline-block; position: relative;}
.DesignTxt2 p{padding: 0px; margin: 0px;}
/*
* Bloc de texte
*/
.BlocDesign1{margin: auto;max-width: 600px; text-align: left;}
.BlocDesign2{ max-width: 600px; text-align: left;}

/*
* HEADER
*/

.HeaderTop.fixe{position: fixed; top:0px; z-index: 9999991; width: 100%; height: 40px;}
.HeaderTop.fixe .elementor-widget-wrap{height: 40px; padding: 0px;}
.HeaderMenu.fixe{position: fixed; top:40px; z-index: 999999; width: 100%; background: #FFFFFF; border-bottom: 1px solid var(--CouleurBleu);}

/*
* Fil d'arianne
*/
.FilArianne{background: var(--CouleurBeige); padding:3px 5px 3px 5px; font: 11px/20px 'Figtree', sans-serif; font-weight: 600; text-transform: uppercase;}

/*
* Boutons
*/
.Btn1{ color:#FFFFFF; font: 14px/20px "Figtree", sans-serif; font-weight: 600; text-transform: uppercase; background: var(--CouleurTerraCotta); border-radius: 5px; margin: 5px; padding: 10px 20px; text-decoration: none; display: inline-block;}
.Btn1.active, .Btn1:hover{background: var(--CouleurCorail); color:#FFFFFF; }


.BtnRetour{color:var(--CouleurTaupe); font-weight: 700; font: 16px/32px 'Oswald', sans-serif; padding: 0px 10px 0px 50px; display: inline-block;  position: relative; text-decoration: none;  border-radius:5px;}
.BtnRetour::before{content: ""; top: 50%; width: 20px; height: 20px; transform: translateY(-50%); left: 15px; background: var(--CouleurTaupe);-webkit-mask: url('charte/IconeFleche2-bis.svg') no-repeat 50% 50%;  mask: url('charte/IconeFleche2-bis.svg') no-repeat 50% 50%; display: block; z-index: 1; position: absolute;}
.BtnRetour:hover{background:var(--CouleurTaupe); color:#FFFFFF;}
.BtnRetour:hover::before{background: #FFFFFF;}

@media screen and (max-width: 1024px) 
{
}
@media screen and (max-width: 767px) {
}

/*
* Background
*/
.BgBeige{background: var(--CouleurBeige);}

/*
* Mise en page
*/
.h100{height: 100%;}


/*
* Titres
*/

/*
.IconeMap{padding-left: 30px;}
.IconeMap::before{content: ""; top: 50%; width: 20px; height: 20px; transform: translateY(-50%); left: 5px; background: var(--CouleurTaupe);-webkit-mask: url('charte/IconeMap.svg') no-repeat 50% 50%;  mask: url('charte/IconeMap.svg') no-repeat 50% 50%; display: block; z-index: 1; position: absolute;}*/