.boite-noire
{
	display: table;
	padding: 0.5rem 1rem 0.5rem 1rem;
	border: 1px solid #000000;
}
.chevron-petit-bleu:before
{
	content: ' ' url(../images/icons/chevron-petit-bleu.png);
	margin-right: 0.5rem;
	vertical-align: middle;
}
.chevron-gros-bleu:before
{
	content: ' ' url(../images/icons/chevron-gros-bleu.png);
	margin-right: 1rem;
	vertical-align: middle;
}
.lien-bleu
{
	text-decoration: none;
	color: #02aef0;
	background-color: none;
	padding: 0px;
}
.lien-bleu:hover
{
	text-decoration: none;
	background-color: #02aef0;
	color: #ffffff;
	padding: 0.5rem 1rem 0.5rem 1rem;
}
.lien-bleu-fonds
{
	text-decoration: none;
	background-color: #02aef0;
	color: #ffffff;
	padding: 0.5rem 1rem 0.5rem 1rem;
}
.lien-bleu-fonds:hover
{
	text-decoration: none;
	background-color: none;
	color: #02aef0;
	padding: 0px;
}
.chevron-precedent:before
{
	content: url(../../../images/icons/image.gif);
	width: 1.2rem;
	margin: 0.2rem 0.5rem 0 0;
}
.bouton-rond 
{
	color: #fff;
	display: inline-block;
	width: 8.8rem;
	height: 6.8rem;/*+padding*/
	border-right: 2.5rem;
	background-color: #97c652;
	vertical-align: middle;
	padding-top:2rem;
	-webkit-border-radius:10rem;
	-moz-border-radius:10rem;
	-o-border-radius:10rem;
	border-radius:10rem;
	text-decoration: none;
}

.moduletable.ariane
{
	position: fixed;
	top: 0.2rem;
	left: 13rem;
	z-index: 99998;
	font-size: 1.2rem;
	color: #000000;
}
.moduletable.ariane a
{
	color: #2C8D24;
}
.moduletable.ariane a:hover
{
	color: #7b7b7b;
}


/********************************************                            Nouveau Habillage             *******************************************************/
h1, h2, h3
{
    font-family: 'quador_boldbold' !important;
}


div.habillage 
{
	padding: 1rem;
	color: #303030;
	font-family: 'arial';
	line-height: 2.6rem;

}

div.habillage img
{
max-width: 100%;
}

div.habillage a
{

color: #55AF92;
transition-duration:  0.2s;
}

div.habillage a:hover
{
text-decoration: underline;
}


div.habillage span
{
color: #2E7031;
font-size: 1.5rem;
}



div.habillage-centre
{
	padding: 1rem;
	color: #303030;
	font-family: 'aller_lightregular';
	line-height: 2.6rem;
	text-align: center;
}

div.habillage h1
{
font-size: 3.3rem;
color: #000;
line-height: 4.5rem;
}

div.habillage h2
{
font-size: 2.5rem;
color: #000;
line-height: 4.5rem;
}

.habillage-centre h4
{
    color: #fff;
    font-family: 'quador_boldbold';
    margin: 2rem;
}

.habillage-centre h5
{
     color: #000;
    font-family: 'quador_boldbold';
    margin: 2rem 0 0;
    font-size: 3rem;
    max-width: 1366px;
    text-align: left;
    width: 40%;
    line-height: normal;
}


div.habillage hr
{
	width: 15rem;
	border: 2.5px solid #3F9242;
	margin-bottom: 1rem;
}

span.habillage-gras
{
font-weight: bold;	
}

.zone-icons
{
    width: 80%;
    margin: 2rem auto;
    display: flex;
}

.bloc-icon
{
    /*width: 25%;*/
    padding: 0 1rem;
    box-sizing: border-box;
    color: #fff;
    font-size: 14px;
}

.bloc-icon p 
{
    line-height: 17px;
    margin-top: 1rem;
}

/****************************************					page contact			*/


.titre-contact
{
font-size: 2rem;
font-family: 'allerregular';
color: #666666;
border-bottom: 1px #e6e6e6 solid;
width: 50%;
padding-bottom: 0.7rem;
}

.titre-contact2
{
font-size: 2rem;
font-family: 'allerregular';
color: #666666;
border-bottom: 1px #ffffff solid;
margin: 0 auto;
width: 50%;
padding-bottom: 0.7rem;
}


div.info-contact
{
text-align: center;
margin: 0 auto;
width: 50%;
background-color: #e6e6e6;
padding: 3rem;
}


.mail
{
color: #3F9242;
font-family: 'allerregular';
}




/****************************************					contact				*/
/*	voici le format d'édition dans l'article*/
/*
<p>&nbsp;</p>
<div class="habillage-contact">
<h5>Contact</h5>
<p>&nbsp;</p>
<p>Nom du contact</p>
<p>Tel:&nbsp;<a class="habillage-tel" href="tel:00000000">000000000</a></p>
<p>Email:&nbsp;<a class="habillage-email" href="mailto:dddd@dddd.dd">oooooooooo</a></p>
<p>More:&nbsp;<a class="habillage-more" target="_blank" href="http://magiris.fr">Magiris.fr</a></p>
</div>

		ne pas oublier les &nbsp; entre les chiffres du téléphone
*/
div.habillage-contact /*pas besion de mettre p, assigner à contact div et p inheritera*/
{
text-align: center;
width: 45%;
/*border: 1px solid #D3D3D3;*/
/*display: inline-block;*/
padding: 3rem;
margin: auto !important;
}

div.habillage-contact a
{
color: #2E7031;

}

div.habillage-contact a:hover
{

}


div.habillage-contact h5
{
font-size: 2.5rem;
}

div.habillage-contact hr
{
	width: 10rem;
	border: 2.5px solid #F68220;
	margin-bottom: 1rem;
	margin: auto;
}


a.habillage-tel
{

}
a.habillage-tel:hover
{

}
a.habillage-email
{

}
a.habillage-email:hover
{

}
a.habillage-more
{

}
a.habillage-more:hover
{

}

.habillage-centre 
{
	padding:1rem;
	margin-top: 0px;
}


.habillage-centre h1
{
font-family: 'quador_boldbold';
font-size: 3.2rem;
margin-top: 3rem;
text-align: center;
color: #000;
letter-spacing: 1px;
}

.habillage-gris
{
color: grey !important;
font-size: 3.3rem !important;
}

.habillage-centre h2
{
    font-family: 'arial';
    font-size: 1.5rem;
    color: #4D4D4D;
    font-weight: normal;
    text-align: center;
}


hr.news-trait
{
	margin-top: 2rem !important;
	width: 20rem;
	border: 1px solid #ffffff;
	margin-bottom: 1rem;
	margin: auto;
}


.habillage-centre h3
{
font-family: 'quador_boldbold';
font-size: 3.2rem;
margin-top: 3rem;
text-align: center;
color: #000;
letter-spacing: 1px;
/*margin-top: 4rem;
margin-bottom: 2rem;*/
}

.habillage-centre span
{
font-family:'aller_lightregular';
color: #666666;
}

.habillage-bouton h3
{
font-family: 'aller_lightregular';
font-size: 2rem;
color: #666666;
text-align: center;
margin-top: 1rem;
letter-spacing: 1px;
margin-bottom: 2rem;
}

.habillage-bouton img
{
width: 160px;
height: auto;
}

.habillage-fond
{
	background:#DADADA;	
	padding: 1rem;
}

.habillage-float
{
	padding: 1rem;
	float: left;
	margin: 0px;
	width: 50%;
}

.habillage-blog
{
	padding: 1rem;
	font-size: 1.3rem;
	line-height: 1.8rem;
}

h2.titre-news
{
color: #ffffff;
font-family: 'allerregular';
font-size: 4rem;
letter-spacing: 2px;
}

p.sub
{
color: #ffffff;
font-size: 3rem;
}


.trait 
{
	width: 5%;
	border:2px solid #DADADA;
	margin: ;
}
.trait15 
{
	width: 15%;
	border: 0.5px solid #3F9242;
	margin: 0 auto;
	margin-bottom: 1rem;
}
.imagesplus 
{
	/*width: 50%;
	text-align: center;*/
}

.floatimage 
{
	width: 30%;
	float:left ;
	box-sizing: border-box;
}

.floattexte
{
	width: 70%;
	float:left;
	box-sizing: border-box;
	padding-left: ;
	padding-right: ;
}

.floatstop
{
	clear: both;
}

.emballage
{


}
div.emballage-right
{
float: right;
margin-left: 1rem;
}
div.emballage-left
{
float: left;
margin-right: 1rem;
}
.emballage ici /* insérer votre video ou votre ifram */
{
	position: absolute;
	top:0;
	left: 0;
	width: 100%;
	height: 100%;
}

.icones 
{
	width: 40%;
	margin-right: 0.5rem;
	vertical-align: bottom;
}

.listetitre 
{
	text-transform: uppercase;
	font-weight: bold;
}

.liste
{
	margin-left: 2rem;
}

.spantexte 
{
	font-weight: lighter;
	color: ;
}
.spantitre
{
	font-weight: bold;
	color: ;
}

.habillage-bouton 
{
	padding: 3rem 1rem; 
	/*border:2px solid #DADADA;*/
	text-align: center;
	color: black;
}
.habillage-bouton a
{

	color: black;
    padding: 2rem 0;
    border: 1px solid #55AF92;
    display: block;
}

.habillage-bouton a:hover
{

	   color: #fff;
	background: #55AF92 ;
}


.zone-bouton
{
    display: flex;
    text-align: center;
}

table.tableau
{
    width: 60%;
    border: 1px solid #8e8e8e !important;
    border-collapse: collapse;
    padding: 1rem;
    margin: 0 auto;
    line-height: 1.5rem;
    font-size: 1.2rem;
}

.tableau th, .tableau td {
    border: 1px solid #8e8e8e;
    padding: 0.8rem;
}


.tableau th
{
color: #468068;
}


a.reini
{
margin-left: 2rem;
background: #468068;
padding: 0.5rem 1.5rem 0.5rem 1.5rem;
border-radius: 2px;
color: white;
transition: all .4s ease-out;
}


a.reini:hover
{
margin-left: 2rem;
background: #ffffff;
padding: 0.5rem 1.5rem 0.5rem 1.5rem;
border-radius: 2px;
color: #468068;
transition: all .4s ease-out;
}


.goto
{
font-size: 2rem;
padding: 1.5rem 3rem 1.5rem 3rem !important;
text-align: center;
}



a.bouton-info
{
    color: #b7a76d;
    border: 2px solid #2E7031;
    font-size: 1.4rem;
    padding: 0.5rem 1rem;
    transition: all 0.4s ease-out;
    line-height: 3rem;
}

a.bouton-info:hover
{

    
    transition: all 0.4s ease-out;
}

.osia-bloc
{
    width: 80%;
    background: #AD5389;
    padding: 3rem;
    display: flex;
    color: #fff;
    margin: 1rem auto 6rem;
    box-sizing: border-box;
}

.osia-left, .osia-right, .osia-center
{
    width: 33%;
}

.osia-left h3
{
    font-size: 3rem;
    line-height: normal;
}

.osia-right a
{
    padding: 1rem 3rem;
    color: #fff;
    border: 1px solid #fff;
    display: block;
    max-width: 80px;
    text-align: center;
}

.osia-right a:hover
{
    color: #AD5389;
    background: #fff;
}


.workgroups-layer1
{
    background: #fff !important;
}

.edocs::before
{
    content: '';
    width: 40px;
    height: 8px;
    background: #005f9f;
    display: block;
    margin-bottom: 15px;
}

.id4all::before
{
    content: '';
    width: 40px;
    height: 8px;
    background: #AD5389;
    display: block;
    margin-bottom: 15px;
}

.eservices::before
{
    content: '';
    width: 40px;
    height: 8px;
    background: #33afe2;
    display: block;
    margin-bottom: 15px;
}

.eborder::before
{
    content: '';
    width: 40px;
    height: 8px;
    background: #f59502;
    display: block;
    margin-bottom: 15px;
}

.biometrics::before
{
    content: '';
    width: 40px;
    height: 8px;
    background: #927b6b;
    display: block;
    margin-bottom: 15px;
}


.workgroups-layer1 h3, .title-slide-workgroups
{
    font-size: 45px !important;
    font-weight: 600 !important;
} 

.readmore-slider-id4
{
    color: #4D4D4D !important;
     letter-spacing: 0px !important;
    border: 1px solid #AD5389;
    display: block;
    padding: 4px 15px !important;
    max-width: 110px;
     text-align: center;
    font-size: 14px !important;
}

.readmore-slider-id4:hover
{
    background: #AD5389;
    color: #fff !important;
}


.readmore-slider-edocs
{
    color: #4D4D4D !important;
    border: 1px solid #005f9f;
    letter-spacing: 0px !important;
    display: block; 
    padding: 4px 15px !important;
    max-width: 110px;
     text-align: center;
    font-size: 14px !important;
}

.readmore-slider-edocs:hover
{
    background: #005f9f;
    color: #fff !important;
}


.readmore-slider-eservices
{
    color: #4D4D4D !important;
     letter-spacing: 0px !important;
    border: 1px solid #42b1e8;
    display: block;
    padding: 4px 15px !important;
    max-width: 110px;
     text-align: center;
    font-size: 14px !important;
}

.readmore-slider-eservices:hover
{
    background: #42b1e8;
    color: #fff !important;
}

.readmore-slider-eborder
{
    color: #4D4D4D !important;
     letter-spacing: 0px !important;
    border: 1px solid #f59502;
    display: block;
    padding: 4px 15px !important;
    max-width: 110px;
     text-align: center;
    font-size: 14px !important;
}

.readmore-slider-eborder:hover
{
    background: #f59502; 
    color: #fff !important;
}



.readmore-slider-biometrics
{
    color: #4D4D4D !important;
    border: 1px solid #927b6b;
    letter-spacing: 0px !important;
    display: block; 
    padding: 4px 15px !important;
    max-width: 110px;
     text-align: center;
    font-size: 14px !important;
}

.readmore-slider-biometrics:hover
{
    background: #927b6b;
    color: #fff !important;
}




.wrap-workgroups
{
    display: flex;
    width: 100%;
    margin: 5rem auto;
}

.workgroup-item
{
    width: 20%; 
    padding: 1rem;
    box-sizing: border-box;
}

.eborder-title::after
{
    content: '';
    width: 100%;
    height: 4px;
    background: #f59502;
    display: block;
    margin: 5px 0;
} 

.id-title::after
{
    content: '';
    width: 100%;
    height: 4px;
    background: #AD5389;
    display: block;
    margin: 5px 0;
}

.edocs-title::after
{
    content: '';
    width: 100%;
    height: 4px;
    background: #005f9f;
    display: block;
    margin: 5px 0;
}

.eservices-title::after
{
    content: '';
    width: 100%;
    height: 4px;
    background: #42b1e8;
    display: block;
    margin: 5px 0;
}

.ebiometrics-title::after
{
    content: '';
    width: 100%;
    height: 4px;
    background: #927b6b;
    display: block;
    margin: 5px 0;
}



.osia-link
{
    color: #AD5389 !important;
}

.osia-link:hover
{
    text-decoration: underline;
}



/*** newsletter ***/

.intro-newsletter
{
    font-size: 2.5rem;
    line-height: normal;
    width: 50%;
    font-family: 'quador_boldbold';
    padding: 0 1rem;
}

.acymailing_module_form .acymailing_introtext
{
    padding: 1rem !important;
    font-weight: bold;
    font-family: 'Arial';
}

table.acymailing_form
{
    margin: 0 !important;
    padding: 1rem;
    width: 50%;
}

.acyfield_name.acy_requiredField input, .acyfield_email.acy_requiredField input
{
    width: 100%;
    background: #E6E6E6;
    color: #000;
}

.acysubbuttons
{
    text-align: left;
}

.acysubbuttons .btn-primary
{
    margin: 0;
    background: #fff;
    border: 1px solid #55AF92 !important;
    color: #000;
    cursor: pointer;
}

.acysubbuttons .btn-primary:hover
{
    background: #55AF92;
    color: #fff;
    margin: 0;
}

.moduletablenewsletter-home-osia .acysubbuttons .btn-primary
{
    display: block;
    border: 1px solid #AD5389 !important;
    color: #AD5389;
    padding: 1rem 0.5rem;
    text-align: center;
    max-width: 200px;
    text-transform: none;
    width: 210px;
}


.moduletablenewsletter-home-osia .acysubbuttons .btn-primary:hover
{
    background: #AD5389;
    color: #fff;
    margin: auto;
}


#pied2 img
{
    width: 100%;
}

/********** footer **********/

.menu-footer li
{
    display: inline;
}



/*** OUR MISSION ***/ 

.advocacy-wrap
{
    display: flex;
}

.advocacy-item
{
    width: 33%;
    text-align: center;
}

.advocacy-item h3
{
    font-family: 'arial';
    margin: 10px;
}

.space-mid
{
    margin: 0 15rem;
}

.policy-wrap, .appli-wrap
{
    display: flex;
}

.policy-item, .appli-item
{
    width: 20%;
    margin: 0 5% 0 0;
    height: 200px; 
    background: #fff;
}

.policy-item img, .appli-item img
{
    width: 100%;
    height: 100px;
}

.policy-item p, .appli-item p
{
    font-family: 'arial';
    font-weight: bold;
}

.banner-our-mission
{
    background-image: url(../../../images/tmpl/banner-mission.jpg);
    background-position: center;
    background-size: cover;
    height: 380px;
}

.banner-our-members
{
    background-image: url(../../../images/tmpl/banner-founders.jpg);
    background-position: center;
    background-size: cover;
    height: 380px;
}

.banner-governance
{
    background-image: url(../../../images/tmpl/banner-mission.jpg);
    background-position: center;
    background-size: cover;
    height: 380px;
}

#brasw .container-fluid
{
    max-width: none;
}

/*** OUR MEMBERS ***/

.content-members
{
    display: flex;
}

.content-members h2
{
        font-family: 'quador_boldbold';
    font-size: 3.2rem;
    color: #000;
    margin-bottom: 1rem;
}

.text-members1, .img-members2
{
    width: 50%;
    margin-right: 15rem;
}

.img-members1, .text-members2
{
    width: 65%;
}

.separator-page
{
    width: 100% !important;
    border: 1px solid #666666 !important;
    margin: 0 !important;
}


/*** CODE OF CONDUCT ***/ 

.center-text
{
    text-align: center;
}

.number-item
{
    width: 55px;
    height: 55px;
    margin: auto;
    background: #AD5389;
    border-radius: 50%;
    line-height: 55px;
    font-size: 2rem;
    color: #fff;
} 

.bt-download
{
    padding: 10px 25px !important;
    color: #55AF92;
    border: 1px solid #55AF92;
    transition: 0.2s;
}

.bt-download:hover
{
    background: #55AF92;
    color: #fff;
    text-decoration: none !important;
}



.bt-download-osia
{
    padding: 10px 25px !important;
    color: #AD5389;
    border: 1px solid #AD5389;
    transition: 0.2s;
}

.bt-download-osia:hover
{
    background: #AD5389;
    color: #fff;
    text-decoration: none !important;
}


.code-conduct-item
{
    width: 50%;
    margin: 1rem auto;
}


.banner-code-conduct
{
    background-image: url(../../../images/tmpl/banner-code-of-conduct.jpg);
    background-position: center;
    background-size: cover;
    height: 380px;
}
/*** type of membership ***/ 

.left-members
{
    width: 60%;
    margin-right: 15rem;
}

.img-right
{   
    width: 40%;
}

.full-fee
{
    width: 200px;
    background: #AD5389;
    padding: 1rem;
    box-sizing: border-box;
    color: #fff;
    margin: 1rem 0;
}

.associate-fee
{
    width: 200px;
    background: #00A3E0;
    padding: 1rem;
    box-sizing: border-box;
    color: #fff;
    margin: 1rem 0;
}

.banner-types-membership
{
    background-image: url(../../../images/tmpl/banner-types-membership.jpg);
    background-position: center;
    background-size: cover;
    height: 380px;
}



/**** OSIA ABOUT US ***/


.pink-title
{
    color: #AD5389;
    font-size: 2rem;
    max-width: 45%;
    display: block;
}

.wrap-part
{
    display: flex;
    margin: 3rem 0;
}

.left-part
{
    width: 60%;
}

.right-part
{
    width: 40%;
}

.wrap-part img
{
    display: block;
    width: 100%;
}

.left-part ul
{
    list-style: none;
    margin-left: 2rem;
    color: #959595;
    padding-right: 5rem;
}

.left-part ul li, .standard-right ul li
{
    margin: 1rem 0;
}

.left-part ul li::before, .standard-right ul li::before
{
     content: "\2022";  /* Add content: \2022 is the CSS Code/unicode for a bullet */
  color: #AD5389; /* Change the color */
  font-weight: bold; /* If you want it to be bold */
  display: inline-block; /* Needed to add space between the bullet and the text */ 
  width: 1em; /* Also needed for space (tweak if needed) */
  margin-left: -1em; /* Also needed for space (tweak if needed) */
}

.standard-right ul
{
    margin-left: 1.5rem;
}


.registries
{
    width: 40%;
    float: left;
    margin-right: 2rem;
    border-top: 2px solid #000;
}

.bottom-space
{
    margin-bottom: 5rem;
}

.registries p
{
    color: #959595;
}

.registries h4
{
    margin-bottom: 1rem;
    padding-top: 5px;
}

.registries-top
{
    float: left;
    width: 100%;
}

.standard-left, .standard-right
{
    width: 50%;
}

.standard-left p
{
    color: #959595;
    padding-right: 4rem;
}

.standard-right
{
    margin-left: 15rem;
}


.bloc-rose
{
    padding: 2rem;
    background: #AD5389;
    box-sizing: border-box;
    color: #fff;
    font-weight: bold;
    margin-top: 2rem;
}

.title-deco::before
{
    content: '';
    display: block;
    width: 30px;
    height: 8px;
    background: #AD5389;
}

.eb-category-head::before
{
    content: '';
    display: block;
    width: 30px;
    height: 8px;
    background: #AD5389;
}


.principles
{
    width: 33%;
    padding: 0 5rem;
    box-sizing: border-box;
}

.principles h4
{
    border-bottom: 2px solid #fff;
    margin-bottom: 2rem;
    padding-bottom: 5px;
}

.content-fond-rose
{
    color: #fff;
    background: #AD5389;
    padding: 2rem;
    box-sizing: border-box;
}

.title-deco-blanc::before
{
    content: '';
    display: block;
    width: 30px;
    height: 8px;
    background: #fff;
}


/*** OSIA GOVERNANCE ***/ 

.gove-item
{
    width: 30%;
    margin: 0 5rem 0 0;
}

.gove-img
{
    width: 40%;
}


.gove-item h4
{
    padding: 10px; 
    box-sizing: border-box;
    background: #AD5389;
    color: #fff;
    text-transform: uppercase;
}

.gove-item p
{
    background: #ececed;
    padding: 2rem;
    box-sizing: border-box;
}
 
.zone-bt-center
{
    margin: 2rem 0;
    text-align: center;
}


/** OSIA HOME **/ 

.intro-osia
{
    margin: 3rem 0;
}

.bold-text
{
    font-size: 22px;
    font-weight: bold;
}

.title-deco-center
{
    text-align: center;
    margin-top: 3rem;
}

.title-deco-center::after
{
    content: '';
    display: block;
    width: 80px;
    height: 8px;
    background: #AD5389;
    margin: 2rem auto;
} 



.wrap-part-home
{
    display: flex;
    width: 80%;
    max-width: 1366px;
    margin: auto;
}

.left-part-home
{
    width: 40%;
}

.right-part-home
{
    width: 60%;
    margin-left: 10rem;
}

.right-part-home ul 
{
    list-style: none;
    margin-left: 2rem;
    color: #959595;
    padding-right: 5rem;
}

.right-part-home ul li::before, .standard-right ul li::before
{
    content: "\2022";
    color: #AD5389;
    font-weight: bold;
    display: inline-block;
    width: 1em;
    margin-left: -1em;
}

.view-more-right
{
    display: block;
    border: 1px solid #AD5389;
    color: #AD5389;
    padding: 1rem 0.5rem;
    text-align: center;
    max-width: 200px;
    margin-top: 4rem;
}

.view-more-right:hover
{
    color: #fff;
    background: #AD5389;
    transition: 0.2s;
}

.wrap-part-min
{
    display: flex;
    width: 80%;
    margin: auto;
}

#avantw .container-fluid
{
    max-width: none;
}

#jupe .mod_easybloglatestblogs
{
    max-width: 1366px;
    margin: auto;
}

.bloc-image
{
    text-align: center;
}

.view-more
{
    display: block;
    border: 1px solid #AD5389;
    color: #AD5389;
    padding: 1rem 0.5rem;
    text-align: center;
    max-width: 200px;
    margin : 2rem auto;
}

.view-more:hover
{
    color: #fff;
    background: #AD5389;
    transition: 0.2s;
}
.bloc-image p 
{
    font-size: 2rem;
    margin: 2rem 0;
}

.pink-text-slider
{
    color: #AD5389;
    font-size: 24px !important;
}

.github-link
{
    color: #fff !important;
    border: 1px solid #fff;
    padding: 15px 10px;
}

.github-link:hover
{
    background: #fff;
    color: #000 !important;
    transition: all 0.2s;
}


/**** OSIA CONTACT ****/ 

div#fox-container-m347 form .fox-row
{
    text-align: center;
    margin: auto;
    width: 50%;
}

div#fox-container-m347 .fox-form input[type="text"]:hover, div#fox-container-m347 .fox-form input[type="email"]:hover, div#fox-container-m347 .fox-form textarea:hover, div#fox-container-m347 .fox-form input[type="text"]:focus, div#fox-container-m347 .fox-form input[type="email"]:focus, div#fox-container-m347 .fox-form textarea:focus
{
    background: none;
}

.banner-contact
{
    background-image: url(../../../images/tmpl/banner-contact.jpg);
    background-position: center;
    background-size: cover;
    height: 380px;
}

div#fox-container-m347 .control-label label
{
    color: #AD5389 !important;
}


.fox-row h2
{
    margin: 3rem 0;
    font-size: 3rem;
}

.fox-row h2::after
{
    content: '';
    display: block;
    width: 30px;
    height: 8px;
    background: #AD5389;
    margin: auto;
    margin-top: 2rem;
}

div#fox-container-m347 .btn
{
    padding: 10px 25px !important;
    border: 1px solid #AD5389 !important;
    transition: 0.2s;
    background: #AD5389;
}

.submit-button span
{
    color: #fff !important;
    text-shadow: none;
}

div#fox-container-m347 .btn:hover
{
    background: #8d366a !important;
    
}



/**** JOIN US FORM ****/ 

div#fox-container-m348 form .fox-row
{
    text-align: center;
    margin: auto;
    width: 50%;
}

div#fox-container-m348 .fox-form-stacked .controls, div#fox-container-m348 .fox-form select, div#fox-container-m348 .fox-form textarea, div#fox-container-m348 .fox-form input[type="text"], div#fox-container-m348 .fox-form input[type="email"]
{
    width: 100%;
}

a.modal
{
    color: #000;
}


.banner-join-us
{
    background-image: url(../../../images/tmpl/banner-join-us.jpg);
    background-position: center;
    background-size: cover;
    height: 380px; 
}


div#fox-container-m348 .btn
{
    padding: 10px 25px !important;
    border: 1px solid #55AF92 !important;
    transition: 0.2s;
    background: #55AF92;
}

.submit-button span
{
    color: #fff !important;
    text-shadow: none;
}

div#fox-container-m348 .btn:hover
{
    background: #3d8b72 !important;
    
}

div#fox-container-m348 .fox-form input[type="text"]:hover, div#fox-container-m348 .fox-form input[type="email"]:hover, div#fox-container-m348 .fox-form textarea:hover, div#fox-container-m348 .fox-form input[type="text"]:focus, div#fox-container-m348 .fox-form input[type="email"]:focus, div#fox-container-m348 .fox-form textarea:focus
{
    background-color: #fff !important;
}


/**** CONTACT US FORM ****/

div#fox-container-m350 form .fox-row
{
    text-align: center;
    margin: auto;
    width: 50%;
}

div#fox-container-m350 .fox-form-stacked .controls, div#fox-container-m348 .fox-form select, div#fox-container-m350 .fox-form textarea, div#fox-container-m350 .fox-form input[type="text"], div#fox-container-m350 .fox-form input[type="email"]
{
    width: 100%;
}

a.modal
{
    color: #000;
}


.banner-contact-sia
{
    background-image: url(../../../images/tmpl/banner-contact-sia.jpg);
    background-position: center;
    background-size: cover;
    height: 380px; 
}


div#fox-container-m350 .btn
{
    padding: 10px 25px !important;
    border: 1px solid #55AF92 !important;
    transition: 0.2s;
    background: #55AF92; 
}

.submit-button span
{
    color: #fff !important;
    text-shadow: none;
}

div#fox-container-m350 .btn:hover
{
    background: #3d8b72 !important;
    
}

div#fox-container-m350 .fox-form input[type="text"]:hover, div#fox-container-m350 .fox-form input[type="email"]:hover, div#fox-container-m350 .fox-form textarea:hover, div#fox-container-m350 .fox-form input[type="text"]:focus, div#fox-container-m350 .fox-form input[type="email"]:focus, div#fox-container-m350 .fox-form textarea:focus
{
    background-color: #fff !important;
}



/*** titres news ***/ 

#eb .eb-category-profile
{
    background: transparent;
}


/********************************************                             slider              *******************************************************/
.sloganslide
{
font-family: "aller_lightregular";
background: rgba(81,122,104,1);
font-size: 3.5rem;
line-height: 4.5rem;
padding: 1.5rem 3rem 1.5rem 3rem !important;
/*border: 2px #2e7031 solid !important;*/
color: #ffffff !important;
}

.sloganslide-eserv
{
font-family: "aller_lightregular";
background: #42b1e8;
font-size: 3.5rem;
line-height: 4.5rem;
padding: 1.5rem 3rem 1.5rem 3rem !important;
/*border: 2px #2e7031 solid !important;*/
color: #ffffff !important;
}

.sloganslide-edocs
{
font-family: "aller_lightregular";
background: #005f9f;
font-size: 3.5rem;
line-height: normal !important;
padding: 1.5rem 3rem 1.5rem 3rem !important;
/*border: 2px #2e7031 solid !important;*/
color: #ffffff !important;
}

.sloganslide-id4
{
font-family: "aller_lightregular";
background: #AD5389;
font-size: 3.5rem;
line-height: normal !important;
padding: 1.5rem 3rem 1.5rem 3rem !important;
/*border: 2px #2e7031 solid !important;*/
color: #ffffff !important;
}

.sloganslide-biometrics
{
font-family: "aller_lightregular";
background: #927b6b;
font-size: 3.5rem;
line-height: normal !important;
padding: 1.5rem 3rem 1.5rem 3rem !important;
/*border: 2px #2e7031 solid !important;*/
color: #ffffff !important;
}


.sloganslide a, .sloganslide-edocs a, .sloganslide-id4 a, .sloganslide-eserv a, .sloganslide-biometrics a
{
font-family: "aller_lightregular";
font-size: 2.5rem;
line-height:normal !important;
padding: 0!important;
color: #ffffff !important;
}

.sloganslide span, .sloganslide-edocs span, .sloganslide-id4 span, .sloganslide-eserv span, .sloganslide-biometrics span
{
font-family: "aller_lightregular";
font-size: 2rem;
line-height: 2.5rem;
color: #ffffff !important;
}

.sloganslide .slink, .sloganslide-edocs .slink,.sloganslide-id4 .slink, .sloganslide-eserv .slink, .sloganslide-biometrics slink
{
font-family: "aller_lightregular";
font-size: 2rem;
line-height: normal !important;
color: #ffffff !important;
margin-top: 2rem;
}



/**** eSAM - eSEC ***/

.banner-esam
{

    background-image: url(../../../images/tmpl/banner-esam.jpg);
    background-position: center;
    background-size: cover;
    height: 380px;
}

.banner-esec
{

    background-image: url(../../../images/tmpl/banner-esec.jpg);
    background-position: center;
    background-size: cover;
    height: 380px;
}


/********************************************                             Xtableau               *******************************************************/
/*
	Chaque tableau porte un numéro
	L'adresse de chaque div comporte l'adresse de son parent en première place
	La div Gilles a le parent Cloutier: (Nom de famille et prénom)
	div.cloutier div.gilles
	{
	est son adresse;
	}
	div.xtableau1 div.xt
	[
	est son adresse;
	}
*/

div.xtableau1 
{
width: 60%;
border-top:1px solid #CCCCCC;
border-right:1px solid #CCCCCC;
border-left:1px solid #CCCCCC;
font-weight: bold;
margin: auto;
margin-bottom: 4rem;
}
div.xtableau1 hr
{
border: 0px;
height: 1px;
background-color: #ffffff;
}
/*2colonnes 49%, 3colonnes 33%, 4colonnes 24%, 5colonnes 19% plus que 4 colonnes c'est difficile pour le responsive*/
div.xtableau1 span.xc1
, div.xtableau1 span.xc2
, div.xtableau1 span.xc3
{
width: 33%;
margin-left: 0.5rem;
margin-right: 0.5rem;
padding: 1rem;

}
div.xtableau1 div.xt span.xc1
, div.xtableau1 div.xt span.xc2
, div.xtableau1 div.xt span.xc3
{
padding: 25px 30px;
background: #CCCCCC;
color: white;
font-weight: bold;
text-transform: uppercase;
font-size: 2rem;
}
div.xtableau1 span.xc2
{
font-weight: lighter !important;
}
div.xtableau1 span.xc3
{
font-weight: lighter !important;
}

div.xtableau1 div.xt
{
display: flex;
text-align: center;
font-size: 1.5rem;
background-color: #CCCCCC;
}
div.xtableau1 div.xt span.xc1
, div.xtableau1 div.xt span.xc2
, div.xtableau1 div.xt span.xc3
{
color: #ffffff !important;
}
div.xtableau1 div.xl
{
display: flex;
text-align: left;
font-size: 1.3rem;
border-bottom: 1px solid #CCCCCC;
}
div.xtableau1 div.xl:last-child 
{
background: red;
}
/*
xtableau1:	pour tableau fleXible et responsive
xt:			xt est la div ligne de titre
xl:			xl est la div ligne de tableau
xc1-2 et 3	xc1 xc2 et xc3 sont les " colonnes span dans chaque ligne du tableau

Voici donc le format de texte qu'il faut copier dans un article pour utiliser
ce tableau flexible.
*/
/*
<div class="xtableau1">
	<div class="xt">
		<span class="xc1">Titre1
			</span>
		<span class="xc2">Titre2
			</span>
		<span class="xc3">Titre3
			</span>
		</div>
	<hr />
	<div class="xl">
		<span class="xc1">1. Ligne1 col1
			</span>
		<span class="xc2">Ligne1 col2
			</span>
		<span class="xc3">Ligne1 col3
			</span>
		</div>
	<hr />
	<div class="xl">
		<span class="xc1">2. Ligne2 col1
			</span>
		<span class="xc2">Ligne2 col2
			</span>
		<span class="xc3">Ligne2 col3
			</span>
		</div>
	<hr />
	<div class="xl">
		<span class="xc1">3. Ligne3 col1
			</span>
		<span class="xc2">Ligne3 col2
			</span>
		<span class="xc3">Ligne3 col3
			</span>
		</div>
	<hr />
	<div class="xl">
		<span class="xc1">4. Ligne4 col1
			</span>
		<span class="xc2">Ligne4 col2
			</span>
		<span class="xc3">Ligne4 col3
			</span>
		</div>
	<hr />
	<div class="xl">
		<span class="xc1">5. Ligne5 col1
			</span>
		<span class="xc2">Ligne5 col2
			</span>
		<span class="xc3">Ligne5 col3
			</span>
		</div>
	<hr />
	<div class="xl">
		<span class="xc1">6. Ligne6 col1
			</span>
		<span class="xc2">Ligne6 col2
			</span>
		<span class="xc3">Ligne6 col3
			</span>
		</div>
	<hr />
	<div class="xl">
		<span class="xc1">7. Ligne7 col1
			</span>
		<span class="xc2">Ligne7 col2
			</span>
		<span class="xc3">Ligne7 col3
			</span>
		</div>
	<hr />
	</div>
*/


/********** RESPONSIVE *************/ 


/***** mobile ***/

@media screen and (max-width: 765px){
    
    .banner-our-mission, .banner-code-conduct, .banner-our-members, .banner-types-membership
    
    {
        
        height: 200px;
        
    }
    
    .left-members, .img-right
    {
        width: 100%;
    }
    
    .content-members
    {
        display: block;
    }
    
    .img-members1, .text-members2, .text-members1, .img-members2
    {
        width: 100%;
    }
    
    
    div.habillage-contact
    {
        width: 100%;
        padding: 0;
    }
    
    div.habillage hr
    {
        width: 10rem;
    }
    
    .code-conduct-item
    {
        width: 100%;
    }
    
    .customlogo-sia
    {
        text-align: center;
    }
    
    .left-part-home img
    {
        height: auto;
        width: 100%;
    }
    
    .wrap-part-home
    {
        display: block;
    }
    
    .left-part-home, .right-part-home
    {
        width: 90%;
    margin-left: 0;
    margin: auto;

    }
    
    .view-more-right
    {
        max-width: none;
    }
    
    .wrap-part-home
    {
        width: 100%;
    }
    
    .wrap-part-min
    {
        display: block;
    }
    
    .principles
    {
        width: 100%;
        padding: 0;
        margin-bottom: 2rem;
    }
    
    .wrap-part
    {
        display: block;
        
    }
    
    .gove-item, .gove-img
    {
        width: 100%;
    }
    
    .gove-item
    {
        margin-bottom: 2rem;
    }
    
    table.acymailing_form
    {
        width: 100%;
    }
    
    .bloc-image img
    {
        width: 100%;
    }
    
    .content-fond-rose, .wrap-part
    {
        margin: 0 1rem;
    }
    
    .title-deco-center
    {
        font-size: 2.5rem;
    }
    
    
    /*** about ***/
    
    #wrapper
    {
        margin: 0 1rem;
    }
    
    .pink-title
    {
        width: 100%;
    }
    
    .left-part, .right-part
    {
        width: 100%;
    }
    
    .standard-left, .standard-right
    {
        width: 100%;
    }
    
    .standard-right
    {
        margin-left: 0;
    }
    
    /*** gov ***/
    
    .bt-download
    {
        display: block;
    }
    
    /** contact **/ 
    
    div#fox-container-m347 form .fox-row
    {
        width: 100%;
    }
    
    
    /** banners ***/ 
    
    .banner-contact
    {
            background-position: center right;
    background-size: cover;
    height: 150px
    }
    
    
    /*** slider ***/ 
    
    #rev_slider_3_1_wrapper
    {
        height: 200px !important;
    }
    
    #rev_slider_3_1
    {
        height: 100% !important;
    }
    
    .pink-text-slider
    {
        font-size: 14px !important;
        line-height: normal !important;
        margin-top: 3rem !important;
    }
    
    .github-link
    {
        padding: 16px 10px !important;
    display: block !important;
    margin-top: 7rem !important;
    border: 1px solid #fff !important;
        font-size: 16px !important;
    }
    
    .intro-slider 
    {
        font-size: 16px !important;
        line-height: normal !important;
    }
    
    .slider-img
    {
        display: none !important;
    }
    
    .tp-bgimg
    {
        background-position: center !important;
    }
    
    
    
}


/*** macbook ***/

@media screen and (min-width: 1000px) and (max-width: 1200px){
    
    .wrap-part-home
    {
        width: 90%;
    }
    
    .right-part-home
    {
        margin-left: 2rem;
        width: 55%;
    }
    
    .left-part-home
    {
        width: 45%;
    }
    
    .left-part-home img
    {
        width: 100%;
        display: block;
        height: 100%;
    }
    
    .view-more-right
    {
        margin-top: 2rem;
    }
    
    .wrap-part-min
    {
        width: 90%;
    }
    
    .customlogo-sia
    {
        margin-left: 10%;
    }
    
    .tp-leftarrow.round
    {
        left: 40px;
    }
    
    .tp-rightarrow.round
    {
        right: 40px;
    }
    
    
}