#grid-body
{
	display: grid;
	max-width:1440px;
	background-color:rgb(250,250,250);
	margin:auto;
	grid-template-columns: repeat(6, 1fr);
	grid-template-rows: 1fr;
	grid-template-areas: 
		"background background background background background background"
		"quinous quinous quinous adhererdon adhererdon adhererdon"
        "nbrsoutiens nbrsoutiens nbrsoutiens boxsoutenir boxsoutenir boxsoutenir"
		"s-pictos-pres s-pictos-pres s-pictos-pres s-pictos-pres s-pictos-pres s-pictos-pres"
		"chiffres chiffres chiffres chiffres chiffres chiffres"
		"se-former se-former se-former se-former se-former se-former"
		"lutter lutter lutter programme programme programme"
		"informer informer informer informer informer informer"
		"head-affranchi head-affranchi head-affranchi head-affranchi head-affranchi head-affranchi"
		"redline redline redline redline redline redline"
		"art-1 art-1 unesection unesection art-2 art-2"
		"engager engager engager engager engager engager"
		"img-enseignant img-enseignant tx-enseignant tx-enseignant tx-enseignant tx-enseignant";
}

.no-select
{
	-moz-user-select: none;
 	-webkit-user-select: none;
 	-ms-user-select: none;
 	user-select: none;
}

#redline
{
	grid-area: redline;
    height: 4px;
    background-color: #B41021;
    margin-top: 22px;
}

.cont-title-center
{
	text-align: center;
    margin-bottom: 40px;
}

#background-accueil
{
	grid-area: background;
	height: 603px;
	background-image: url('/images/background-accueil-2.webp');
	background-repeat: no-repeat;
	background-size: contain;
	display: flex; 
	align-items: flex-end;
}

#center-box-bienvenue
{
    position: fixed;
    z-index: 10000;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: rgba(0,0,0,0.6);
}

#btn-fermer-popup-bienvenue
{
    border: 1px solid #ddd;
    padding: 6px 25px 6px 25px;
    font-family: overpass-light, Arial;
    font-size: 1rem;
    margin: 35px 0px 0px 0px;
    border-radius: 8px;
    color: #4F4F4F;
    cursor: pointer;
    -webkit-transition: background-color 0.2s, border 0.2s, color 0.2s;
    -moz-transition: background-color 0.2s, border 0.2s, color 0.2s;
    -o-transition: background-color 0.2s, border 0.2s, color 0.2s;
    transition: background-color 0.2s, border 0.2s, color 0.2s;
}

#btn-fermer-popup-bienvenue:hover
{
    color: #FFF;
    background-color: #121619;
    border-color: #121619;
}

#box-popup-bienvenue
{
    width: 545px;
    display: flex;
    flex-direction: column;
    align-items: center;
    background-color: #FFF;
    border-radius: 15px;
    padding-bottom: 20px;
}

#tx-popup-bienvenue
{
    font-family: overpass-extrabold, Arial;
    font-size: 1.7rem;
    margin-bottom: 5px;
    margin-top: 35px;
}

#tx-ss-popup-bienvenue
{
    font-family: overpass-light, Arial;
    font-size: 1.2rem;
    margin-bottom: 15px;
    text-align: center;
    padding-left: 15px;
    padding-right: 15px;
}

.link-popup-color
{
    color: #356795;
    font-family: overpass-bold, Arial;
}
.link-popup-color:hover
{
    color: #000;
}

#cont-slogans
{
    padding: 0px 0px 65px 81px;
    filter: alpha(opacity=0);
    opacity: 0;
    z-index: 10;
}

#cont-btn-slogan
{
    padding: 0px 0px 75px 0px;
    filter: alpha(opacity=0);
    opacity: 0;
    z-index: 10;
}

#txt-slogan
{
    font-size: 2.9rem;
    font-family: overpass-extrabold, Arial;
    color: #FFF;
    white-space: nowrap;
    text-shadow: 0px 0px 10px rgba(0, 0, 0, 0.5);
}

#txt-slogan-bis
{
    font-size: 2.12rem;
    font-family: overpass-light, Arial;
    margin-top: -7px;
    color: #FFF;
    text-shadow: 0px 0px 10px rgba(0, 0, 0, 0.5);
}

.btn-slogan
{
    color: #FFF;
    background-color: rgba(255,255,255,0);
    text-shadow: 0px 0px 10px rgba(0, 0, 0, 0.5);
    text-decoration: none;
    font-size: 1.21em;
    font-family: overpass-bold, Arial;
    text-align: center;
    border: 3px solid #FFF;
    border-radius: 50px;
    -webkit-transition: background-color 0.3s, color 0.3s;
    -moz-transition: background-color 0.3s, color 0.3s;
    -o-transition: background-color 0.3s, color 0.3s;
    transition: background-color 0.3s, color 0.3s;
    cursor: pointer;
    float: left;
    padding-top: 16px;
    padding-bottom: 16px;
    width: 323px;
    margin-top: 20px;
}

.btn-slogan:hover
{
	 background-color: rgba(255,255,255,1);
	 color: #121619;
	 text-shadow: none;
}

.ajust-width-btn-devenir-militant
{
    width: 300px;
}

.ajust-margin-btn-comprendre-monde
{
	 margin-right: 20px;
}

#cont-qui-sommes-nous
{
	grid-area: quinous;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding-left: 81px;
    padding-right: 81px;
}

#cont-pres-don-adherer
{
	grid-area: adhererdon;
    padding: 40px 25px 40px 25px;
}

#nbr-soutiens
{
    grid-area: nbrsoutiens;
}

#box-soutenir
{
    grid-area: boxsoutenir;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}





#cont-nbr-soutiens
{
    line-height: 48px;
    padding: 100px 80px 100px 80px;
}

.number-soutiens
{
    font-family: overpass-extrabold, Arial;
    font-size: 4.5rem;
    color: #A73333;
    line-height: 65px;
}

.tx-soutiens
{
    font-family: overpass-extrabold, Arial;
    font-size: 2.6rem;   
}

#box-email-soutien
{
    width: 472px;
    padding: 40px;
    background-color: rgb(250,250,250);
    box-shadow: 0px 2px 20px -4px rgba(0, 0, 0, .2);
    border-radius: 14px;
}

#tx-email-soutien
{
    font-family: overpass-bold, Arial;
    font-size: 1.5rem;
}

#email-soutien
{
    outline: none;
    border-radius: 8px;
    border: 1px solid #ddd;
    padding: 12px;
    margin-bottom: 25px;
    margin-top: 7px;
    width: 100%;
    font-size: 1.2rem;
    font-family: overpass-light, Arial;
}

#tx-soutenez-nous-gratuit
{
    font-family: overpass-extrabold, Arial;
    font-size: 1.1rem;
}

#btn-je-soutiens
{
    background-color: #A73333;
    width: calc(100% - 40px);
    padding: 18px 20px 18px 20px;
    border-radius: 10px;
    text-align: center;
    color: #FFF;
    font-family: overpass-extrabold, Arial;
    font-size: 1.2rem;
    margin-top: 12px;
    cursor: pointer;
    -webkit-transition: background 0.3s;
    -moz-transition: background 0.3s;
    -o-transition: background 0.3s;
    transition: background 0.3s;
}

#btn-je-soutiens:hover
{
    background-color: #8a2828;
}

.box-btn-adherer-don-pres
{
    width: 266px;
    height: 200px;
    background-color: rgb(250,250,250);
    box-shadow: 0px 2px 20px -4px rgba(0, 0, 0, .2);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    border-radius: 14px;
    margin: 10px;
    text-decoration: none;
}

.box-btn-adherer-don-pres > img
{
    width: 70px;
    cursor: pointer;
}

.btn-adherer-don-pres
{
    border-radius: 50px;
    border: 1px solid #ddd;
    width: 200px;
    outline: none;
    background: #FFF;
    font-size: 1.2rem;
    height: 46px;
    display: flex;
    justify-content: center;
    align-items: center;
    text-decoration: none;
    color: #121619;
    -webkit-transition: background 0.3s, border 0.3s, color 0.3s;
    -moz-transition: background 0.3s, border 0.3s, color 0.3s;
    -o-transition: background 0.3s, border 0.3s, color 0.3s;
    transition: background 0.3s, border 0.3s, color 0.3s;
    font-family: overpass-extrabold, Arial;
    margin-top: 33px;
    cursor: pointer;
}

.box-btn-adherer-don-pres:hover .btn-adherer-don-pres
{
    border: 1px solid #356795;
    background-color: #356795;
    color: #FFF;
}

.center-box-btn-adherer-don-pres
{
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
}

.title-section
{
    font-family: overpass-extrabold, Arial;
    font-size: 2.52rem;
}

.text-description-section
{
    font-family: overpass-light, Arial;
    font-size: 1.45rem;
    margin-top: 8px;
    line-height: 35px;
}

#cont-pictos-presentation
{
    grid-area: s-pictos-pres; 
    background-color: #A73333;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    padding: 50px 73px 50px 73px;
    align-items: center;
    margin-top: 50px;
}

.box-pictos-presentation
{
    border: 5px solid #FFF;
    border-radius: 21px;
    width: 180px;
    height: 190px;
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
    margin: 10px;
}

.img-picto-presentation
{
    width: 85px;
}

.tx-pictos-presentation
{
    font-family: overpass-extrabold, Arial;
    font-size: 1.4rem;
    text-align: center;
    color: #FFF; 
    margin-top: 5px;
    margin-bottom: 5px;
}

.ajust-picto-revo
{
    width: 70px;
    margin-right: 20px;
}

#cont-institut-chiffres
{
	grid-area: chiffres;
	padding: 75px 73px 75px 73px;
}


#cont-title-institut-chiffres
{
    display: flex;
    flex-direction: column;
    align-items: center;
}

#cont-box-institut-chiffres
{
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    margin-top: 45px;
}

.box-btn-institut-chiffres
{
    width: 260px;
    height: 195px;
    background-color: rgb(250,250,250);
    box-shadow: 0px 2px 20px -4px rgba(0, 0, 0, .2);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    border-radius: 14px;
    margin: 10px;
    text-decoration: none;
    color: #121619;
     -webkit-transition: background 0.3s, color 0.3s;
    -moz-transition:  background 0.3s, color 0.3s;
    -o-transition:  background 0.3s, color 0.3s;
    transition:  background 0.3s, color 0.3s;
}

.box-btn-institut-chiffres:hover
{
    background-color: #356795;
    color: #FFF;
}

.tx-chiffre
{
    font-family: overpass-extrabold, Arial;
    font-size: 3.2rem;
}

.title-chiffre
{
    font-family: overpass-extrabold, Arial;
    font-size: 1.85rem;
    text-align: center;
}

.ss-title-chiffre
{
    font-family: overpass-bold, Arial;
    font-size: 1.2rem;
    text-align: center;
}

.svg-fleche-chiffres
{
	pointer-events: none;
	display: none;
	width: 60px;
	height: 50px;
	transform: rotate(270deg);
	fill: #121619;
}

.box-btn-institut-chiffres:hover > .svg-fleche-chiffres
{
	fill: #FFF;
}


#ajust-grid-chiffres
{
	display: none;
}

#cont-se-former
{
	grid-area: se-former;
}

#cont-lutter
{
	grid-area: lutter;
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding-left: 81px;
	padding-right: 81px;
}

#cont-box-programme
{
	grid-area: programme;
	flex-wrap: wrap;
    display: flex;
    margin-top: 90px;
    margin-bottom: 90px;
}

.box-btn-programme
{
    width: 200px;
    height: 120px;
    font-family: overpass-extrabold, Arial;
    font-size: 1.15rem;
    background-color: rgb(250,250,250);
    box-shadow: 0px 2px 20px -4px rgba(0, 0, 0, .2);
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
    border-radius: 14px;
    margin: 5px 10px 5px 0px;
    text-decoration: none;
    color: #121619;
    -webkit-transition: background 0.3s, color 0.3s;
    -moz-transition: background 0.3s, color 0.3s;
    -o-transition: background 0.3s, color 0.3s;
    transition: background 0.3s, color 0.3s;
}

.box-btn-programme:hover
{
    background-color: #356795;
    color: #FFF;
}

#cont-title-s-informer
{
	grid-area: informer;
	margin-bottom: 50px;
}

.sous-title-section
{
	font-family: overpass-light, Arial;
	font-size: 1.8rem;
}

#art-1
{
	padding: 30px;
	grid-area: art-1;
}

#art-2
{
	padding: 30px;
	grid-area: art-2;
}

#unesection
{
	grid-area: unesection;
	padding: 30px;
	box-shadow: 0px 2px 20px -4px rgba(0, 0, 0, .15);
    border-bottom-left-radius: 25px;
    border-bottom-right-radius: 25px;
}

#tx-une
{
	text-align: center;
    color: #121619;
    filter: alpha(opacity=50);
    opacity: 0.6;
    font-family: overpass-light, Arial;
    font-size: 1.6rem;
    margin-bottom: 22px;
    display: flex;
    justify-content: center;
    align-items: center;
}

/*#art-4, #art-5, #art-6
{
Articles de la Une
le grid area est la section
}*/

.etiquette
{
	text-decoration: none;
    font-family: overpass-light, Arial;
    font-size: 1.12rem;
    color: #B41021;
}

.a-deco-none
{
	text-decoration: none;
}

.title-article
{
	font-size: 1.7rem;
    font-family: overpass-bold, Arial;
	font-weight: initial;
    color: #121619;
    margin: 2px 0 13px 0;
	-webkit-transition: color 0.3s;
    -moz-transition: color 0.3s;
    -o-transition: color 0.3s;
    transition: color 0.3s;
}

.title-article:hover
{
	color: #254258;
}

.a-img-article
{
	display: inline-block;
	width: 100%;
}

.a-img-article::before
{
	content: '';
	width: 0px;
	height: 1px;
	display: block;
	background-color: #B41021;
	-webkit-transition: width 0.3s;
    -moz-transition: width 0.3s;
    -o-transition: width 0.3s;
    transition: width 0.3s;
}

.a-img-article:hover::before
{
	width: 100%;
}

.description-article
{
	font-family: overpass-light, Arial;
    font-size: 1.15rem;
    line-height: 1.5rem;
	margin-top: 15px;
}

.img-article
{
	width: 100%; 
	margin-top: 5px;
	border-radius: 20px;
	filter: brightness(1);
	-webkit-transition: filter 0.3s;
	-moz-transition: filter 0.3s;
	-o-transition: filter 0.3s;
	transition: filter 0.3s;
}

.img-article:hover
{
	filter: brightness(0.7);
}

.lil-img-article
{
	width: 100%; 
	margin-top: 5px;
	border-radius: 7px;
	filter: brightness(1);
	-webkit-transition: filter 0.3s;
	-moz-transition: filter 0.3s;
	-o-transition: filter 0.3s;
	transition: filter 0.3s;
}

.lil-img-article:hover
{
	filter: brightness(0.7);
}

.lil-article
{
	display: flex; 
	margin-bottom: 30px; 
	padding-bottom: 23px; 
}

.border-art-une
{
	border-bottom: 1px solid #CCC;
}

.lil-title-article
{
	font-size: 1.12rem;
    font-family: overpass-bold, Arial;
	font-weight: initial;
    color: #121619;
    margin: 0;
    -webkit-transition: color 0.3s;
    -moz-transition: color 0.3s;
    -o-transition: color 0.3s;
    transition: color 0.3s;
}

a:hover > .lil-title-article
{
	color: #254258;
}

.cont-lil-img-art
{
	width: 41%;
}

.max-width-200
{
	max-width: 200px;
}

.a-lil-art
{
	margin-left: 20px; 
	width: 59%;
	margin-top: 2px;
}

#tx-desc-nous
{
	font-family: overpass-light, Arial;
	font-size: 1.4rem;
	margin-bottom: 23px;
}

#redline-art
{
	grid-area: redline;
    height: 4px;
    background-color: #B41021;
    margin-top: 22px;
}

.lil-title-marg-top
{
	margin-top: 8px;
}

#cont-s-engager
{
	grid-area: engager;
	margin-top: 90px;
	margin-bottom: 60px;
}

#cont-box-s-engager
{
    display: flex;
    justify-content: space-between;
    padding: 20px;
	flex-wrap: wrap;
}

.box-s-engager
{
    width: 390px;
    margin: 10px;
    border-radius: 22px 22px 10px 10px;
    overflow: hidden;
    box-shadow: 0px 2px 8px 1px rgba(0, 0, 0, .15);
    -webkit-transition: box-shadow 0.2s ease-in-out;
    -moz-transition: box-shadow 0.2s ease-in-out;
    -o-transition: box-shadow 0.2s ease-in-out;
    transition: box-shadow 0.2s ease-in-out;
}

.freepik
{
    position: absolute;
    font-size: 0.9rem;
    margin-top: 15px;
    margin-left: 15px;
    border: 1px solid #2654E8;
    color: #2654E8;
    padding-left: 4px;
    padding-right: 4px;
    border-radius: 5px;
    text-decoration: none;
}

.freepik:hover
{
    background-color: #2654E8;
    color: #FFF;
}

.bg-img-asso
{
    display: block;
    height: 185px;
    background-size: cover;
    overflow: hidden;
}

.bg-img-asso > img
{
    width: 100%;
}

.boxbottom-s-engager
{
    padding: 30px;
    display: flex;
    flex-direction: column;
}

.cont-tx-s-engager
{  
    display: flex;
}

.tx-s-engager
{
    font-size: 1.3rem;
    font-family: overpass-light, Arial;
    line-height: 34px;
}

.cont-btn-s-engager
{
    display: flex;
    justify-content: center;
    margin-top: 30px;
}

.btn-bleu
{
    border-radius: 50px;
    border: 2px solid #356795;
    width: 220px;
    outline: none;
    background: #FFF;
    font-size: 1.2rem;
    height: 46px;
    display: flex;
    justify-content: center;
    align-items: center;
    text-decoration: none;
    color: #356795;
    -webkit-transition: background 0.3s, color 0.3s;
    -moz-transition: background 0.3s, color 0.3s;
    -o-transition: background 0.3s, color 0.3s;
    transition: background 0.3s, color 0.3s;
    font-family: overpass-extrabold, Arial;
    cursor: pointer;
}

.btn-bleu:hover
{
    color: #FFF;
    background-color: #356795;
}

.ajust-width-lire-programme
{
	width: 275px;
	margin-top: 15px;
}

.ajust-en-savoir-plus
{
	margin-top: 15px;
}

#cont-img-enseignant
{
	grid-area: img-enseignant;
	padding: 30px 60px 30px 30px;
}

#cont-tx-enseignant
{
	grid-area: tx-enseignant;
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding-right: 50px;
}

#cont-img-enseignant > img
{
    width: 100%;
    border-radius: 15px;
}

#tx-loic-chaigneau
{
    font-family: overpass-light, Arial;
    font-size: 3.15rem;
    margin-left: -2px;
    margin-top: -7px;
}

#cv-loic-chaigneau
{
    font-family: overpass-light, Arial;
    font-size: 1.35rem;
    line-height: 31px;
    margin-top: 10px;
}

.liens-cv
{
    text-decoration: underline;
    color: #121619;
}

.liens-cv:hover
{
    color: #B41021;
}

#cont-btn-cv-loic-chaigneau
{
    display: flex;
    margin-top: 35px;
    margin-bottom: 10px;
    flex-wrap: wrap;
}

.ajust-btn-cv
{
    margin-bottom: 15px;
    margin-right: 15px;
    width: auto;
    padding-right: 40px;
    padding-left: 40px;
}

/*rupture en dessous d'ordi/tablette paysage*/
@media screen and (max-width: 1200px)
{	
	#grid-body
	{
		grid-template-areas: 
			"background background background background background background"
			"quinous quinous quinous quinous quinous quinous"
			"adhererdon adhererdon adhererdon adhererdon adhererdon adhererdon"
            "nbrsoutiens nbrsoutiens nbrsoutiens nbrsoutiens nbrsoutiens nbrsoutiens"
            "boxsoutenir boxsoutenir boxsoutenir boxsoutenir boxsoutenir boxsoutenir"
			"s-pictos-pres s-pictos-pres s-pictos-pres s-pictos-pres s-pictos-pres s-pictos-pres"
			"chiffres chiffres chiffres chiffres chiffres chiffres"
			"se-former se-former se-former se-former se-former se-former"
			"lutter lutter lutter lutter lutter lutter"
			"programme programme programme programme programme programme"
			"informer informer informer informer informer informer"
			"head-affranchi head-affranchi head-affranchi head-affranchi head-affranchi head-affranchi"
			"redline redline redline redline redline redline"
			"art-1 art-1 art-1 art-2 art-2 art-2"
			"empty-a unesection unesection unesection unesection empty-b"
			"engager engager engager engager engager engager"
			"img-enseignant img-enseignant tx-enseignant tx-enseignant tx-enseignant tx-enseignant";
		
	}
	
	#background-accueil
	{
		height: 504px;
	}

	.ajust-width-btn-devenir-militant
	{
		width: 323px;
	}

	#cont-slogans 
	{
    	padding: 0px 30px 55px 81px;
	}

	#cont-btn-slogan
	{
		padding: 0px 30px 55px 0px;
	}

    #cont-nbr-soutiens
    {
        padding: 60px 80px 40px 80px;
        text-align: center;
    }

	#txt-slogan
	{
		font-size: 2.75rem;
	}

	#txt-slogan-bis
	{
		margin-top: 0px;
	}

	#cont-qui-sommes-nous, #cont-lutter
	{
		text-align: center;
		align-items: center;
	}

	#cont-lutter
	{
		padding-top: 90px;
	}

	#cont-box-programme
	{
		margin-top: 50px;
		padding-left: 90px;
		padding-right: 80px;
		justify-content: center;
	}

	#cont-pres-don-adherer
	{
		display: flex;
		justify-content: center;
		flex-wrap: wrap;
	}

	#cont-pictos-presentation
	{
	    padding: 50px 31px 50px 31px;   
	}

	.box-pictos-presentation
	{
	    margin: 0px;
	}

	#tx-une
	{
		display: none;
	}
	
	#ajust-grid-chiffres
	{
		display: flex;
	}

	.box-donner-suppr
	{
		display: none;
	}

	#cont-box-s-engager
	{
		justify-content: space-around;
	}
}

/*Réajustement pour les tablettes à 1024*/
@media screen and (max-width: 1060px)
{
	#cont-slogans
	{
		padding: 0px 30px 55px 50px;
	}
}

/*rupture en dessous de tablette portrait*/
@media screen and (max-width: 959px)
{
	#grid-body
	{
		grid-template-areas: 
			"background background background background background background"
			"quinous quinous quinous quinous quinous quinous"
			"adhererdon adhererdon adhererdon adhererdon adhererdon adhererdon"
            "nbrsoutiens nbrsoutiens nbrsoutiens nbrsoutiens nbrsoutiens nbrsoutiens"
            "boxsoutenir boxsoutenir boxsoutenir boxsoutenir boxsoutenir boxsoutenir"
			"s-pictos-pres s-pictos-pres s-pictos-pres s-pictos-pres s-pictos-pres s-pictos-pres"
			"chiffres chiffres chiffres chiffres chiffres chiffres"
			"se-former se-former se-former se-former se-former se-former"
			"lutter lutter lutter lutter lutter lutter"
			"programme programme programme programme programme programme"
			"informer informer informer informer informer informer"
			"head-affranchi head-affranchi head-affranchi head-affranchi head-affranchi head-affranchi"
			"redline redline redline redline redline redline"
			"empty-a art-1 art-1 art-1 art-1 empty-b"
			"empty-c art-2 art-2 art-2 art-2 empty-d"
			"empty-e unesection unesection unesection unesection empty-f"
			"engager engager engager engager engager engager"
			"img-enseignant img-enseignant img-enseignant img-enseignant img-enseignant img-enseignant"
			"tx-enseignant tx-enseignant tx-enseignant tx-enseignant tx-enseignant tx-enseignant";
	}

	#background-accueil
	{
		height: 403px;
		align-items: center;
		flex-direction: column;
	}

	#background-accueil:before
	{
		content: ' ';
		position: absolute;
		opacity: 0.5;
		background-image: url('/images/brightness-background.jpg');
		background-size: contain;
		background-repeat: no-repeat;
		width: 100%;
		height: 100%;
		top: 203px;
	}

	#cont-slogans
	{
		padding: 25px 0px 0px 0px;
	}

	#cont-btn-slogan
	{
		padding: 0;
	}

	#txt-slogan, #txt-slogan-bis
	{
		text-align: center;
		font-size: 2rem;
	}

	#cont-pictos-presentation
	{
		padding: 50px 0px 50px 0px;
		justify-content: space-around;
	}

	.box-pictos-presentation
	{
		width: 120px;
		height: 175px;
		margin: 0px;
		border: none;
	}

	.img-picto-presentation, .ajust-picto-revo
	{
		width: 70px;
	}

	.tx-pictos-presentation
	{
		font-size: 1.2rem;
	}

	#ajust-grid-chiffres
	{
		display: none;
	}

	#cont-institut-chiffres 
	{
	    padding: 75px 59px 75px 59px;
	}

	#cont-img-enseignant
	{
		height: 250px;
		overflow: hidden;
		padding: 30px 22px 30px 22px;
	}

	#cont-tx-enseignant
	{
		padding: 30px 22px 0px 22px;
	}

	#cont-btn-cv-loic-chaigneau
	{
		justify-content: space-around;
	}

	.ajust-btn-cv
	{
		margin-right: 0;
	}

		
}

/*rupture smartphone*/
@media screen and (max-width: 767px)
{
	#grid-body
	{
		grid-template-areas: 
			"background background background background background background"
			"quinous quinous quinous quinous quinous quinous"
			"adhererdon adhererdon adhererdon adhererdon adhererdon adhererdon"
            "nbrsoutiens nbrsoutiens nbrsoutiens nbrsoutiens nbrsoutiens nbrsoutiens"
            "boxsoutenir boxsoutenir boxsoutenir boxsoutenir boxsoutenir boxsoutenir"
			"s-pictos-pres s-pictos-pres s-pictos-pres s-pictos-pres s-pictos-pres s-pictos-pres"
			"chiffres chiffres chiffres chiffres chiffres chiffres"
			"se-former se-former se-former se-former se-former se-former"
			"lutter lutter lutter lutter lutter lutter"
			"programme programme programme programme programme programme"
			"informer informer informer informer informer informer"
			"head-affranchi head-affranchi head-affranchi head-affranchi head-affranchi head-affranchi"
			"redline redline redline redline redline redline"
			"art-1 art-1 art-1 art-1 art-1 art-1"
			"art-2 art-2 art-2 art-2 art-2 art-2"
			"unesection unesection unesection unesection unesection unesection"
			"engager engager engager engager engager engager"
			"img-enseignant img-enseignant img-enseignant img-enseignant img-enseignant img-enseignant"
			"tx-enseignant tx-enseignant tx-enseignant tx-enseignant tx-enseignant tx-enseignant";
	}

	#background-accueil
	{
		height: 490px;
		justify-content: flex-end;
	}

	#background-accueil:before
	{
		display: none;
	}

    #box-popup-bienvenue
    {
        width: 100%;
    }

	#txt-slogan, #txt-slogan-bis
	{
		font-size: 1.45rem;
		text-align: center;
		color:  #121619;
		text-shadow: none;
	}

	#cont-slogans
	{
		padding: 20px 30px 5px 30px;
		background-color: rgb(250,250,250);
		border-radius: 9px;
	}

	#cont-btn-slogan
	{
		width: 330px;
		color: #121619;
	}

	.btn-slogan
	{
		color: #121619;
		border-color: #121619;
		text-shadow: none;
	}

	#cont-qui-sommes-nous
	{
		padding-left: 18px;
		padding-right: 18px;
	}

    #box-email-soutien
    {
        width: initial;
        padding: 22px;
    }

    #cont-nbr-soutiens
    {
        padding: 60px 0px 40px 0px;
    }

    #email-soutien
    {
        width: calc(100% - 25px);
    }

    .tx-soutiens 
    {
        font-size: 2.2rem;
    }

	#cont-lutter
	{
		padding: 0px 18px 0px 18px;
	}

	#cont-box-programme
	{
		display: none;
	}

	.text-description-section
	{
		font-size: 1.45rem;
	}

	.title-section
	{
		font-size: 2.3rem;
		margin-top: 65px;
		text-align: center;
	}

	#cont-institut-chiffres 
	{
		padding: 15px 21px 75px 21px;
	}

	.box-btn-institut-chiffres
	{
	    width: 100%;
	    flex-direction: row;
		justify-content: space-between;
		height: 100px;
		flex-wrap: wrap;
		padding: 0px 5px 0px 25px;
		margin: 5px 2px 5px 2px;
	}

	.ss-title-chiffre
	{
		text-align: start;
		font-size: 1rem;
	}
	
	.tx-chiffre
	{
		font-size: 2.35rem;
		width: 55px;
	}

	.tx-reduire-chiffre
	{
		font-size: 1.8rem;
	}

	.cont-tx-chiffres
	{
		width: 175px;
	}

	#tx-local-suppr-smartphone
	{
		display: none;
	}

	.title-chiffre
	{
		font-size: 1.5rem;
		text-align: start;
	}

	.svg-fleche-chiffres
	{
		display: block;
	}

	#art-1, #art-2, #unesection
	{
		padding: 22px;
	}
	
	#tx-videos-redline
	{
		margin-left: 22px;
	}
	
	.sous-title-section
	{
		margin-right: 10px;
		margin-left: 10px;
	}

	#cont-box-s-engager
	{
		padding: 0;
	}

	.box-s-engager
	{
		width: 100%;
		margin: 22px;
	}

	#cont-s-engager
	{
		margin-top: 0;
	}

	.ajust-tx-enseignant
	{
		text-align: start;
		margin-top: 0;
	}

	#tx-loic-chaigneau
	{
		font-size: 2.95rem;
	}

	#cont-qui-sommes-nous, #cont-lutter
	{
		text-align: start;
		align-items: start;
	}

	.ajust-en-savoir-plus, .ajust-width-lire-programme
	{
		align-self: center;
	}

	.ajust-tx-construire-avenir
	{
		margin: 0;
	}

}