p {
	margin: 0;
}

h1 {
font-family: 'Cookie', cursive;
color: #ffffff;
text-align: center;
text-shadow: 1px 1px rgba(0,0,0, 0.8), -1px -1px rgba(0,0,0, 0.8), 1px -1px rgba(0,0,0, 0.8), -1px 1px rgba(0,0,0, 0.8), 2px 0 rgba(0,0,0, 0.5), -2px 0 rgba(0,0,0, 0.5), 0 2px rgba(0,0,0, 0.5), 0 -2px rgba(0,0,0, 0.5), 3px 0 rgba(255,255,255, 0.5), -3px 0 rgba(255,255,255, 0.5), 0 3px rgba(255,255,255, 0.5), 0 -3px rgba(255,255,255, 0.5);
padding: 0 1em;
margin: 0;
font-size: 72px;
transition-duration: 0.6s;
}

h1.bigtitle {
	font-size: 100px;
}

h2 {
font-family: 'Open Sans', sans-serif;
text-align: center;
text-shadow: 2px 0 0 rgba(255,255,255, 0.3), -2px 0 0 rgba(255,255,255, 0.3), 0 2px 0 rgba(255,255,255, 0.3), 0 -2px 0 rgba(255,255,255, 0.3), 1px 1px rgba(255,255,255, 0.3), -1px -1px 0 rgba(255,255,255, 0.3), 1px -1px 0 rgba(255,255,255, 0.3), -1px 1px 0 rgba(255,255,255, 0.3);
padding:0 1em;
margin: 0 0 0 0;
font-size: 26px;
text-transform: uppercase;
transition-duration: 0.6s;
}

@media screen and (max-width: 600px) {
	h1 {
	font-size: 50px;
	}

	h2 {
	font-size: 16px;
	}
	
	h1.bigtitle {
	font-size: 60px;
	}
}

h3 {
	font-family: 'Delius', cursive;
	text-align:center;
	padding: 0.5em;
	font-weight:bold;
}

h4 {
	font-family: 'Delius', cursive;
	text-align:center;
	padding: 0.5em;
	margin:0 0 1em 0;
	font-size: 22px;
}

h4.contact {
	margin:0;
}


@media screen and (max-width: 400px) {
h4.contact {
		font-size: 18px;
}
	
}

body {
  width:2000px;
  max-width:100%;
  margin: 0;
  padding: 0;
  font-family: 'Open Sans', sans-serif;
  background-image:url("media/img/motif.png");
  background-attachment:fixed;
}

.ovcolor {
	background-color: rgba(255,255,255,0.3);
}


/* Styles icones */
.icofa {
	display: flex;
	font-size: 75px;
	color: black;
	height: 80px;
	width: 80px;
	justify-content: center;
	align-items: center;
	transition-duration: 0.6s;
}

.icofaImg {
	height: 80px;
	width: 80px;
	transition-duration: 0.6s;
}




@media screen and (max-width: 600px) {
.icofa {
	font-size: 55px;
	height: 60px;
	width: 60px;
	
}
.icofaImg {
	height: 60px;
	width: 60px;

}

}

@media screen and (max-width: 400px) {
.icofa {
	font-size: 40px;
	height: 45px;
	width: 45px;
	
}
.icofaImg {
	height: 45px;
	width: 45px;

}
}

/*--- Roundpoint ----*/
.roundpoint {
	height: 8px;
	width:8px;
	background-color:#f29109;
	border-radius:4px;
	position:relative;
	z-index:+1;
	bottom: -8px;
}



/*--- curseur ----*/
.pointer {
	cursor: pointer;
}





/*--- button 01 ----*/
.butcont {
	display:flex;
	cursor: pointer;
	height: 50px;
	width: 100px;
	margin: 1em 0 0 0;
	border-radius:5px;
	border-style: solid;
	border-width: 3px;
	border-color: #ffffff;
	transition-duration: 0.45s;
	justify-content: center;
	align-items: center;
}

.butcont.larg {
	width: 166px;
}

.butcont:hover{
	width: 110px;
	background-color:#f29109;
	border-style: solid;
	border-color: #f29109;
}

.butcont.blubut:hover{
	background-color:#00aaa9;
	border-color: #00aaa9;
}

.butcont.larg:hover {
	width: 180px;
}

.but01{
	display: flex;
	cursor: pointer;
	height: 100%;
	width: 100%;
	border-style: dashed;
	background-color:#ffffff;
	font-family:'Delius', cursive;
	font-size: 23px;
	color: #f29109;
	text-shadow: 1px 1px rgba(255,255,255, 0.3), -1px -1px 0 rgba(255,255,255, 0.3), 1px -1px 0 rgba(255,255,255, 0.3), -1px 1px 0 rgba(255,255,255, 0.3);
	border-radius:5px;
	border-width: 2px;
	border-color: #f29109;
	transition-duration: 0.45s;
	justify-content: center;
	
}

.but01.blubut {
	color: #00aaa9;
	border-color: #00aaa9;
}

.but01:hover{
	background-color:#f29109;
	font-size: 25px;
	color: #ffffff;
	text-shadow: 1px 1px rgba(255,255,255, 0.3), -1px -1px 0 rgba(255,255,255, 0.3), 1px -1px 0 rgba(255,255,255, 0.3), -1px 1px 0 rgba(255,255,255, 0.3);
	border-color: #ffffff;
}

.but01.blubut:hover {
	background-color:#00aaa9;
}


/*--- button 02 ----*/
.butcont2 {
	display:flex;
	cursor: pointer;
	height: 50px;
	width: 100px;
	margin: 1em 0 0 0;
	background-color:#ffffff;
	border-radius:5px;
	border-style: solid;
	border-width: 3px;
	border-color: #ffffff;
	transition-duration: 0.45s;
	justify-content: center;
	align-items: center;
}

.butcont2:hover{
	height: 55px;
	width: 130px;
}



.but02{
	display: flex;
	text-align: center;
	cursor: pointer;
	height: 100%;
	width: 100%;
	border-style: dashed;
	background-color:#ffffff;
	font-family:'Delius', cursive;
	font-size: 23px;
	color: #f29109;
	text-shadow: 1px 1px rgba(255,255,255, 0.3), -1px -1px 0 rgba(255,255,255, 0.3), 1px -1px 0 rgba(255,255,255, 0.3), -1px 1px 0 rgba(255,255,255, 0.3);
	border-radius:5px;
	border-width: 2px;
	border-color: #f29109;
	transition-duration: 0.45s;
	justify-content: center;
	
}

.but02:hover{
	font-size: 28px;
}

/*--- button 03 ----*/
.butcont3 {
	display:flex;
	cursor: pointer;
	margin: 1em 0 0 0;
	background-color:#ffffff;
	border-radius:5px;
	border-style: solid;
	border-width: 2px;
	border-color: #ffffff;
	transition-duration: 0.3s;
	justify-content: center;
	align-items: center;
}

.butcont3:hover{
	background-color:#00aaa9;
	border-color: #00aaa9;
	transform: scale(1.1);
}

.but03{
	display: flex;
	text-align: center;
	cursor: pointer;
	height: 50px;
	width: 172px;
	border-style: dashed;
	background-color:#ffffff;
	font-family:'Delius', cursive;
	font-size: 23px;
	color: #00aaa9;
	border-radius:5px;
	border-width: 2px;
	border-color: #00aaa9;
	transition-duration: 0.3s;
	justify-content: center;
	}

.but03:hover{
	background-color:#00aaa9;
	color: #ffffff;
	text-shadow: 1px 1px rgba(255,255,255, 0.3), -1px -1px 0 rgba(255,255,255, 0.3), 1px -1px 0 rgba(255,255,255, 0.3), -1px 1px 0 rgba(255,255,255, 0.3);
	border-color: #ffffff;
}

/*--- button 04 ----*/
.butcont4 {
	display:flex;
	cursor: pointer;
	margin: 1em 0 0 0;
	background-color:#ffffff;
	border-radius:5px;
	border-style: solid;
	border-width: 2px;
	border-color: #ffffff;
	transition-duration: 0.3s;
	justify-content: center;
	align-items: center;
}

.margNul {
 margin: 0;
}

.butcont4:hover{
	background-color:#f29109;
	border-color: #f29109;
	transform: scale(1.1);
}

.but04{
	display: flex;
	text-align: center;
	cursor: pointer;
	height: 50px;
	width: 172px;
	border-style: dashed;
	background-color:#ffffff;
	font-family:'Delius', cursive;
	font-size: 23px;
	color: #f29109;
	border-radius:5px;
	border-width: 2px;
	border-color: #f29109;
	transition-duration: 0.3s;
	justify-content: center;
	
}

.but04:hover{
	background-color:#f29109;
	color: #ffffff;
	text-shadow: 1px 1px rgba(255,255,255, 0.3), -1px -1px 0 rgba(255,255,255, 0.3), 1px -1px 0 rgba(255,255,255, 0.3), -1px 1px 0 rgba(255,255,255, 0.3);
	border-color: #ffffff;

}

/*Menu Responsive*/
.logosit {
	max-height:180px;
    align-self: flex-start;
	position: absolute;
	transition-duration: 0.6s;
 }

@media screen and (max-width: 600px) {
	.logosit {
	max-height:130px;

 }
  }

@media screen and (max-width: 400px) {
	.logosit {
	max-height:120px;

 }
  }

.topnav {
  overflow: hidden;
  display:flex;
  justify-content:flex-end;
  align-items:center;
  padding: 0;
  width: 100%;
  min-height: 100px;

}

.topnav a {
  display: block;
  color: black;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
  font-size: 17px;
}

.topnav a:hover {
  color: #f29109;
}

.topnav a.activeNav {
  color: #f29109;
}

.topnav .icon {
  display: none;
  
}

@media screen and (max-width: 850px) {
  .topnav a:not(:first-child) {display: none;}
  .topnav a.icon {
    display: block;
  }
  
  }


@media screen and (max-width: 850px) {

  .topnav.responsive {
	  flex-flow:column wrap;
	  justify-content:center;
  }
  
  .topnav.responsive .icon {
    position: absolute;
    right: 0;
    top: 0;

  }
  .topnav.responsive a {
    float: none;
    display: block;
    text-align: center;

  }
  
}

/*menu custom*/
.menubloc {
	display:flex;
	justify-content: space-between;
	background-color: #ffffff;
}

.icomenu {
	font-size: 23px;
}




/*Header*/
.header {
	display:flex;
	background-image:url("media/img/Résines 2020 web-062.jpg");
	background-position:center;
	background-size: cover;
	background-repeat: no-repeat;
	background-attachment:fixed;
	width:100%;
	height:60%;
	padding:0;
	margin:0;
	flex-flow:column wrap;
	align-items:center;
	justify-content: center;
}

/*Video full screen header*/
.headerVid {
	display:flex;
	flex-flow: row wrap;
	align-items:center;
	justify-content: center;
	background-color:white;

}



/*FlexBlocs et bloctext*/
.flexbloc {
	width:100%;
	margin:0;
	padding:0 0;
	display:flex;
	flex-flow:row wrap;
	background-color:white;
	align-content: flex-start;
	justify-content:center;
	align-items:center;
}

.flexbloc.histor {
	width:100%;
	margin:0;
	padding:0 0;
	display:flex;
	flex-flow:column nowrap;
	background-color:white;
	align-content: flex-start;
	justify-content:center;
	align-items:center;
}

.flexblocL {
	width:100%;
	margin:0;
	padding:0 0;
	display:flex;
	flex-flow:column nowrap;
	background-color:white;
	align-content: flex-start;
	justify-content: center;
	align-items: center;
}


@media screen and (max-width: 949px) {
.flexblocL {
	max-width:500px;

}

}



.flexbloc.whbg {
	background-color:rgba(255,255,255, 0.9);
}

.flexbloc.whalphbg {
	background-color:rgba(255,255,255, 0);
}



.whbg {
	background-color:rgba(255,255,255, 0.9);
	width:100%;
}

.flexbloc.alphbg {
	background-color:rgba(255,255,255, 0);
	flex-flow:column wrap;
	align-content: center;
	margin:0;
	padding:0;

}

.flexbloc.roundrow {
	background-color:rgba(255,255,255, 0);
	flex-flow:raw wrap;
	align-content: center;
	margin:0;
	padding:0;
	max-width:1280px;



}

.flexbloc.Sl {
	flex-flow: column wrap;
	background-color: rgba(255,255,255, 0.9);
	align-content: center;
	max-width:100%;
}

.flexbloc.col {
	flex-flow: column wrap;
	background-color: rgba(255,255,255, 0.9);
	align-content: center;
	max-width:100%;
}


.blocMenL{
	flex-flow: column nowrap;
	background-color: rgba(255,255,255, 1);
	max-width:100%;
	width:820px;
	margin:auto;
}

.flexTround{
	max-width:90%;
	margin:1em 0 0 0;
	padding:0;
	display:flex;
	flex-flow:column wrap;
	background-color:rgba(255,255,255, 0);
	justify-content:flex-start;
	align-items:flex-start;
}

.flexTround.right {
	align-items:flex-end;
}

.flexTround.Ltop{
	margin: 0;
	flex-flow:row nowrap;

}

.spaceRTround {
	width:90px;
}

.blocspace {
	min-height:200px;
}

.bloctext  {
	display: flex;
	max-width:1200px;
	margin:1em 0;
	flex-flow: column wrap;
	justify-content:center;
	align-items:center;
}

.bloctext.solo  {
	max-width:1200px;
	margin:1em;
	flex-flow: row wrap;
	background-color: white;
	justify-content:center;
}




.bloctext.histor  {
	max-width:1200px;
	margin: 0.5em 1em 0em 1em;
	flex-flow: column nowrap;
	background-color: white;

}



.bloctext.soloL  {
	max-width:1200px;
	margin:1em;
	flex-flow: column nowrap;
	background-color: white;

}

.bloctext.solo.L  {
	justify-content: flex-start;
}

.bloctext.solo.R {
	justify-content: flex-end;
}


.roundTrow {
	display:flex;
	flex-flow:row;
	height:180px;
	max-width:780px;
}

.Trowbtt {
	display:flex;
	flex-flow:row;
	max-width:780px;
}

.bloctext.blocTround.L {
	max-width:900px;
	margin: 80px 60px 0px 60px;
	background-color: white;
}

.bloctext.blocTround.Ltop {
	max-width:900px;
	margin: 80px 80px 0px 80px;
	background-color: white;
	flex-flow: column nowrap;

}

@media screen and (max-width: 600px) {
.bloctext.blocTround.Ltop {
		margin: 40px 40px 0px 40px;
	}

}

.bloctext.blocTround.R {
	max-width:900px;
	margin: 80px 80px 0px 80px;
	background-color: white;
}

@media screen and (max-width: 600px) {
.bloctext.blocTround.R {
		margin: 40px 40px 0px 40px;
	}

}

.bloctext.blocTround.R.colV {
	max-width:900px;
	flex-flow: row wrap;
	background-color: white;
}

.bloctextcol  {
	display: flex;
	max-width:500px;
	margin:1em 0;
	flex-flow: column wrap;
	justify-content:center;
	align-items:center;
}


.bloctextcolL  {
	display: flex;
	max-width:500px;
	margin:1em 0;
	flex-flow: column nowrap;
	justify-content:center;
	align-items:center;
}


.bloctext.wlogo {
	max-width: 980px;
	margin: 0 0 2em 0;
}







/*Vignette Partenaires*/

.partflexbox {
	display: flex;
	flex-flow: row wrap;
	justify-content: center;
	align-items: center;
	max-width: 95%;
	width: 1080px;
	margin: 0 auto;
}

.partboxcont {
	display: flex;
	flex-flow: row wrap;
	align-items: center;
	padding: 0;
	margin: 3em 3em 1.5em 3em;
	transition-duration: 0.3s;
	max-width:920px;
	background-color: white;
	box-shadow: 0px 2px 2px rgba(60,60,60,0.3);
}

.partboximg {
	margin:0;
	height: 0;
	width: 100%;

	
}

.partboxttl {
	padding:1em 2em 0 120px;
	margin:0;
	height: 62px;
	display: flex;
	justify-content: center;
	width:100%;

}

.partboxtxt {

	padding:1em 2em 2em 2em;
	margin:0;


}

/*
.partbox::after {
	content:"";
	clear:both;
	display: table;

}*/


.parttxtlist {
	padding: 0 45px;
}

@media screen and (max-width: 500px) {
.parttxtlist {
	padding: 0 20px;
}
}


p.parttxt {
	font-family: 'Open Sans', sans-serif;
	font-size: 14px;
	text-align: justify;
	text-justify: inter-word;
}

p.parttxt.Lalign {
	font-family: 'Open Sans', sans-serif;
	font-size: 14px;
	text-align: left;
	text-justify: inter-word;
}

.imgpart {
	position:relative;
	background-image: url("media/img/Résines 2020 web-025.jpg");
	background-position:center;
	background-size: contain;
	background-repeat: no-repeat;
	background-color: white;
	width: 150px;
	height: 150px;
	margin: 0 0.5em 0 0;
	float:left;
	top:-40px;
	left:-40px;
	border-style: none;
	border-color: white;
/*	border-width: 10px;*/
	box-shadow: 0px 2px 2px rgba(60,60,60,0.3);
}

h5.partttl {
	font-family: 'Delius', cursive;
	font-size: 20px;
	text-align: center;
	margin:0;
	align-self:center;

}

@media screen and (max-width: 420px) {
h5.partttl {
	font-size: 16px;

}
}


h5.partttl.acc {
	font-size: 16px;
	padding: 0 2em;
	color: #303030;

}



/* Module Partenaire sur page accueil*/
.blocpart {
	display: flex;
	width:242px;
	background-color: white;
	margin: 1em;
	flex-flow: column wrap;
	justify-content:space-evenly;
	align-items:center;
	height:280px;
	transition-duration: 0.3s;
	
}

/* Zoom In Part*/

.blocpart:hover {
	transform: scale(1.1);
	cursor:pointer;
}


.logopart{
	width: 180px;
	padding: 0.5em 0 0 0;
}





/*Vignette équipe*/
p.roundtxt {
	display: flex;
	flex-flow:row wrap;
	text-align: center;
	padding:1em;
	justify-content: center;
	align-items: center;
	margin-bottom: 2em;

}

p.roundcontTtl{
	display: flex;
	padding:0 0.5em;
	justify-content: center;
	font-weight:bold;
	font-family: 'Delius', cursive;

}

@media screen and (max-width: 420px) {
	p.roundtxt {
	margin-bottom: 0;
}
}

.roundrowTtl {
	display:flex;
	justify-content: space-between;
	width:90%;
	align-self:center;
	flex-flow:row nowrap;
	padding-top: 10px;
}

.roundrowName {
	display:flex;
	justify-content: flex-start;
	width:45%;
	align-self:flex-start;
	flex-flow:row wrap;
	
}

.roundrowFunc {
	display:flex;
	justify-content: flex-end;
	width:55%;
	flex-flow:row wrap;
	align-self:flex-start;

}

.roundcontbloc {
	display:flex;
	width:250px;
	height:450px;
	border-radius: 20px;
	border: 18px solid;
	border-color: rgba(255,255,255, 1);
	background-color: rgba(255,255,255,1);
	flex-flow: column nowrap;
	margin:1em;
	box-shadow: 0px 2px 2px rgba(60,60,60,0.3);


}


.roundconttxt {
	width:100%;
	height:180px;
	background-color: rgba(255,255,255, 1);
	border-radius: 0 0 150px 150px;
	align-self:flex-end;


}

.roundcontimg {
	background-image:url("media/img/portrait.jpg");
	background-repeat: no-repeat;
	background-position: top;
	background-attachment: scroll;
	background-size: cover;
	width:190px;
	height:190px;
	border-radius: 100px;
	align-self:center;
}



@media screen and (max-width: 420px) {
.roundcontbloc {
	width:220px;

}

.roundconttxt {
	width:220px;
	height:340px;

}

.roundcontimg {
	width:130px;

}

.roundrowTtl {
	width:100%;

}

}



/*Video*/
.blocvid {
	display: flex;
	width: 100%;
	justify-content: center;
}

.vid {
	width:2000px;
	max-width:99%;
	height:70vh;
	}



/*Bloctitles*/

.bloctitle {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	background-color: #f29109;
	justify-content:center;
	padding:1em;
}

.bloctitle.Sl {
	background-color: #f29109;
}

.bloctitle.Slprod {
	background-color: #f29109;
	padding:3px 0;
}

.bloctitle.Slprodend {
	background-color: #ffffff;
	padding:0.5em;
}


.bloctitle.empt {
	background-color: white;
	padding:2em;
}

.bloctitleAlph {
	display: flex;
	background-color: rgba(255,255,255, 0);
	justify-content:center;
}



.reversbloctitle {

	background-color: white;
	padding:1em;
	width: 200px;
	box-shadow: 0px 2px 2px rgba(60,60,60,0.3);
}


.roundtitle {
	display:flex;
	background-image:url("media/img/bgroundor.png");
	background-position:center;
	background-size: cover;
	background-repeat: no-repeat;
	height:160px;
	width:160px;
	margin:0;
	padding:0;
	position:absolute;
	z-index:+1;
	justify-content:center;
	align-items:center;
	transition-duration: 0.6s;
	
}

@media screen and (max-width: 600px) {
	.roundtitle {
		height:100px;
		width:100px;
	}

}

.roundtitle.blutt {
	background-image:url("media/img/bgroundblu.png");

}

h3.titleround {
	color:white;
	font-size:20px;
	display:flex;
 	max-height:140px;
	max-width:140px;
	margin:0;
	padding:0;
	justify-content:center;
	align-items:center;
	}
	
@media screen and (max-width: 600px) {
	h3.titleround {
	font-size:14px;
	max-height:80px;
	max-width:80px;
	}

}

.topround {
	background-color:rgba(255,255,255, 0);
    height:90px;
	margin:0;
	padding:0;
	
}

.roundTcol {
	display:flex;
	flex-flow:column;
	justify-content:flex-end;

}

.bottround {
	display:flex;
	background-color: #f29109;
	height:90px;
	max-width:70vw;
	text-align:left;
	justify-content: flex-end;


}

h3.rounTbott{
	text-align:left;
	width:600px;
	margin: 0;
}

.coltitle {
	text-align: center;
}

h3.coltitle {
	margin: inherit;
	margin-block-start: 0.5em;
    margin-block-end: 0.5em;
}

h3.coltitleWsub {
	margin: inherit;
	margin-block-start: 0;
    margin-block-end: 0;

}

h3.coltitle.histor {
	margin: inherit;
	margin-block-start: 0;
    margin-block-end: 0;
	color:#303030;
}

h3.coltitle#act01txttop {
	padding-top: 2.2em;

}

@media screen and (max-width: 950px) {
h3.coltitle#act01txttop {
padding-top: 0;
}
}



h3.colsubtitle {
	margin: inherit;
	margin-block-start: 0em;
    margin-block-end: 0em;
	padding-top:0;
	padding-bottom:1em;
	font-weight: normal;
	text-transform: uppercase; 
	font-size: 15px;
	font-weight:normal;
	text-decoration: underline;
}

h3.titlebloc {
	color:white;
	font-size:28px;
	text-align: center;
	border-style: dashed;
	border-width: 3px;
	border-color: white;
	padding:0.5em;
	margin:0;
}


h3.reverstitlebloc {
	color:#f29109;
	font-size:28px;
	text-align: center;
	border-style: dashed;
	border-width: 3px;
	border-color: #f29109;
	padding:0.5em;
	margin:0;
}



p.titlebloc {
	color:white;
	font-size:22px;
	text-align: center;
	padding:0.5em;
	margin:0;
}

.coltext {
	display: flex;
	flex-flow: column wrap;
	text-align: center;
	padding:0 2em;
	justify-content: center;
	align-items: center;
}

p.coltext {
	display: flex;
	flex-flow: column wrap;
	text-align: center;
	padding:0.25em 2em;
	justify-content: center;
	align-items: center;
}

p.coltext.Valign {
	text-align: left;

}

p.coltext.Tjusti {
	text-align: justify;

}


p.coltext.Tjusti#act01txttop {
	padding-top: 1.8em;

}

@media screen and (max-width: 950px) {
p.coltext.Tjusti#act01txttop {
	padding-top: 0;
}
}



p.coltext.Tround {
	display: flex;
	flex-flow: column wrap;
	text-align: center;
	padding:0.25em 2em;
	justify-content: center;
	align-items: center;
}

@media screen and (max-width: 450px) {
p.coltext.Tround {
	padding:0.25em;
}
}

p.coltext.nottl {
	display: flex;
	flex-flow: column wrap;
	text-align: center;
	padding:2em 2em 0 2em;
	justify-content: center;
	align-items: center;
}

@media screen and (max-width: 1190px) {
p.coltext.nottl {

	padding:0 2em 0 2em;

}
}



/*Coltext L*/
.coltextLcont {
	max-width: 950px;

}

.coltextL {
	display: flex;
	flex-flow: column wrap;
	text-align: center;
	padding:0.25em 0;
	justify-content: center;
	align-items: center;
	
}

.coltextL.Tjusti {
	text-align: justify;
	align-items: flex-start;
	justify-content: flex-start;
	padding-right:2em;
}

@media screen and (max-width: 950px) {
.coltextL {
	padding:0.5em 2em;
}

}


.coltext.roundT {
	text-align: center;
	background-color:rgba(255,255,255, 1);
	padding:64px 40px;
}

.coltext.roundT.colV{
	text-align: center;
	background-color:rgba(255,255,255, 1);
	padding:2em 1em;
}
@media screen and (max-width: 450px) {
.coltext.roundT.colV{
	padding:1em 0.5em;
}

}

.coltext.roundT.colH{
	text-align: center;
	background-color:rgba(255,255,255, 1);
	padding:1em 2em;
}
@media screen and (max-width: 450px) {
.coltext.roundT.colH{
	padding:1em 0.5em;
}

}

.colV {
	max-width: 256px;
}

.logoTxt {
	max-width: 180px;
	max-height: 180px;
}


/* Bloc et col Images */
.blocimg {
  display: flex;
  justify-content: center;
  max-width:100%;
  padding:1em 0;
}

.blocimg.wlogo {
	padding:0;
}

.blocimgcol {
  display: flex;
  justify-content: center;
  max-width:100%;
  padding:1em 1em;
}

.colimg {
  width:450px;
  min-width: 200px;
  max-width:100%;
  max-height:100%;
  height:253,28px;
  transition-duration: 0.8s;
}

.colimgcolV {
  width:580px;
  max-width:100%;
 /*  padding: 1em 1em;*/
}
/*
.colimg .colH {
  width:860px;
  max-width:100%;
  height: 450px;
  max-height:100%;
  padding: 1em 1em;

}*/

.colimgcolH {
  width:860px;
  max-width:100%;
/*  height: 450px;
  max-height:100%;*/

}




/* -----Slideshow Styles----- */
/*.Slides {display: none}

.Slides2 {display: none}

.Slides3 {display: none}*/

.Slimg {
   width: 100%;
	}
	
.Slmulti {
   display: flex;
   width: 100%;
   max-width: 740px;
   flex-flow: row wrap;
   justify-content:center;
   align-content: center;
   
	}

.Slmultitxt {
   display: flex;
   color: #ffffff;
   margin: 0.5em;
   width: 200px;
   height: 220px;
   text-align:center;
   background-image:url("media/img/Résines 2020 web-120.jpg");
   background-position: center;
   background-size: cover;
   background-repeat: no-repeat;
   flex-flow: row wrap;
   justify-content:center;
   align-content: flex-end;   
	}

.Slmultitxt:hover {
	cursor: pointer;
}

/* Slideshow container */
.slideshowbox {
  display: flex;
	width: 800px;
    max-width: 95%;
  justify-content:center;
  align-items:center;
}

.Sllidot {
	text-align:center;
	margin: 1em 0;
}

/* Next & previous buttons */
.prev, .next {
  cursor: pointer;
  width: 60px;
  height: 40px;
  color: #f29109;
  font-weight: bold;
  font-size: 28px;
  transition: 0.6s ease;
  border-radius: 20px 0 0 20px;
  user-select: none;
  text-align: center;
}

/* Position the "next button" to the right */
.next {
  border-radius: 0 20px 20px 0;
}

/* On hover, add a black background color with a little bit see-through */
.prev:hover, .next:hover {
  background-color: rgba(242,145,9,0.8);
  color: white;
}

/* The dots/bullets/indicators */
/*.dotSl {
  cursor: pointer;
  height: 15px;
  width: 15px;
  margin: 0 2px;
  background-color: rgba(242,145,9,0.4);
  border-radius: 50%;
  display: inline-block;
  transition: background-color 0.6s ease;
}

.active, .dotSl:hover {
  background-color: rgba(242,145,9,0.8);
}

.dotSl2 {
  cursor: pointer;
  height: 15px;
  width: 15px;
  margin: 0 2px;
  background-color: rgba(242,145,9,0.4);
  border-radius: 50%;
  display: inline-block;
  transition: background-color 0.6s ease;
}

.active, .dotSl2:hover {
  background-color: rgba(242,145,9,0.8);
}

.dotSl3 {
  cursor: pointer;
  height: 15px;
  width: 15px;
  margin: 0 2px;
  background-color: rgba(242,145,9,0.4);
  border-radius: 50%;
  display: inline-block;
  transition: background-color 0.6s ease;
}

.active, .dotSl3:hover {
  background-color: rgba(242,145,9,0.8);
}*/

/* Fading animation */
.fadeSl {
  -webkit-animation-name: fadeSl;
  -webkit-animation-duration: 1.5s;
  animation-name: fadeSl;
  animation-duration: 1.5s;
}

@-webkit-keyframes fadeSl {
  from {opacity: .4} 
  to {opacity: 1}
}

@keyframes fadeSl {
  from {opacity: .4} 
  to {opacity: 1}
}

/* On smaller screens, decrease text size */
@media only screen and (max-width: 300px) {
  .prev, .next,.text {font-size: 11px}
}
/* -----Slideshow Styles end----- */




/* ----- Actualités page d'Accueil ----- */
.actuflexbox {
	display: flex;
	flex-flow: row wrap;
	justify-content: center;
	align-items: center;
	max-width: 1080px;
	margin: 0 auto;
}

.actuboxcont {
	display: flex;
	flex-flow: column wrap;
	align-items: center;
	width: 320px;
	max-width: 100%;
	padding: 0;
	margin: 1em;
	transition-duration: 0.3s;
	height: 550px;
	
}

@media screen and (max-width: 350px) {
.actuboxcont {
	width: 260px;
	margin: 1em 0.5em;
}

}

.actuboxcont:hover {
	transform: scale(1.1);
}

.actutop {
	background-color: #ffffff;
	width: 80px;
	height: 80px;
	position: absolute;
	z-index: -1;
	margin: 0;
	padding: 0;
	border-radius: 40px;
	box-shadow: 1px 2px 6px rgba(60,60,60,0.6);
}

.actupin {
	background-color: #00aaa9;
	width: 28px;
	height: 28px;
	position: absolute;
	z-index: +1;
	margin: 14px 0 0 0;
	padding: 0;
	border-radius: 20px;
	border: solid rgba(0,0,0,0.1);
	box-shadow: 1px 2px 6px rgba(60,60,60,0.6);
}


.actubox {
	display: flex;
	flex-flow: column wrap;
	align-items: center;
	border-radius: 15px;
	background-color: white;
	padding: 1em;
	margin: 40px 0 0 0;
	box-shadow: 0px 2px 2px rgba(60,60,60,0.3);
	max-width: 90%;
	height:100%;
}


.actuimg {
	width: 318px;
}

.actuimgbox {
	border-radius: 5px 5px;
	background-image: url("media/img/Résines 2020 web-025.jpg");
	background-position:center;
	background-size: cover;
	background-repeat: no-repeat;
	max-width: 100%;
	width: 318px;
	height: 200px;

}


.actutxtbox {
	padding: 0 1em 1em 1em;
	display: flex;
	flex-flow: column nowrap;
	justify-content: center;
	align-items: center;
}

/*--- actubtn d'ap btn 03 ----*/

.actubtnspace {
		display:flex;
		flex-grow:3;
		flex-flow:column nowrap;
		justify-content: center;
}

.actubtncont {
	display:flex;
	cursor: pointer;
	margin:0 ;
	background-color:#ffffff;
	border-radius:5px;
	border-style: solid;
	border-width: 2px;
	border-color: #ffffff;
	transition-duration: 0.3s;
	justify-content: center;


	
}

.actubtncont:hover {
	background-color:#00aaa9;
	border-color: #00aaa9;
	transform: scale(1.1);
}

.actubtn {
	display: flex;
	text-align: center;
	cursor: pointer;
	height: 36px;
	width: 150px;
	border-style: dashed;
	background-color:#ffffff;
	font-family:'Delius', cursive;
	font-size: 23px;
	color: #00aaa9;
	border-radius:5px;
	border-width: 2px;
	border-color: #00aaa9;
	transition-duration: 0.3s;
	justify-content: center;

	
}

.actubtn:hover {
	background-color:#00aaa9;
	color: #ffffff;
	border-color: #ffffff;
}


h6 {
	margin: 0;
	font-size: 12px;
	text-transform: uppercase;
	color: #00aaa9;
	border-style: dashed;
	border-width: 0 0 3px 0;
	border-color: #00aaa9;
	
}

.actuttl {
	font-family: 'Delius', cursive;
	margin: 1em 0 1em 0;
	font-size: 20px;
	text-align: center;
}

.acturefs {
	display: flex;
	justify-content: space-between;
	width: 96%;
	padding-left: 2%;
	padding-right: 2%;

}

.actutxt {
	font-family: 'Open Sans', sans-serif;
	font-size: 14px;
	text-align: justify;
	text-justify: inter-word;
}
/* ----- Actualités page d'Accueil - end ----- */


/* ----- Actualités page Actualités ----- */
.artclflexbox {
	display: flex;
	flex-flow: row wrap;
	justify-content: center;
	align-items: center;
	max-width: 95%;
	width: 1080px;
	margin: 0 auto;
}

.artclboxcont {
	display: flex;
	flex-flow: row wrap;
	align-items: center;
	padding: 0;
	margin: 1em 2em;
	transition-duration: 0.3s;
}


.artclbox {
	content:"";
	clear:both;
	display: table;
	border-radius: 15px;
	background-color: white;
	padding:2em;
	margin:0;
	box-shadow: 0px 2px 2px rgba(60,60,60,0.3);

}


.artclbox::after {
	content:"";
	clear:both;
	display: table;

}

.imgartcl{
	border-radius: 5px 5px;
	background-image: url("media/img/Résines 2020 web-025.jpg");
	background-position:center;
	background-size: cover;
	background-repeat: no-repeat;
	width: 293px;
	height: 216px;
	margin: 0 0.5em 0 0;
	float:left;
}


h6.actuthm {
	float:left;
	margin-left:2em;


}

h6.actuday {
	float:right;
	margin-right:2em;
}

.artclttl {
	font-family: 'Delius', cursive;
	padding: 2em auto;
	font-size: 20px;
	text-align: center;
	margin: 2em 0 1em 0;
}


.artclpin {
	background-color: #00aaa9;
	width: 28px;
	height: 28px;
	position: absolute;
	z-index: +1;
	margin: 0 0 0 -25px;
	padding: 0;
	border-radius: 20px;
	border: solid rgba(0,0,0,0.1);
	box-shadow: 1px 2px 6px rgba(60,60,60,0.6);
	
}

.artcltop {
	background-color: #ffffff;
	width: 80px;
	height: 80px;
	position: absolute;
	z-index: -1;
	margin: 0 0 0 -40px;
	padding: 0;
	border-radius: 40px;
	box-shadow: 1px 2px 6px rgba(60,60,60,0.6);
	
}

/* ----- Responsive arctl- Actualités ----- */
@media only screen and (max-width: 1110px) {
.artclboxcont {
	margin: 0.5em 1em;
	}

.artclbox {
	padding: 1em;
	content:"";
	clear:none;
	display: block;
	}

.imgartcl {
	width: 100%;
	height: 400px;
	margin:0;
	}

.artclrefs{
	display: flex;
	justify-content: space-between;
	width: 96%;
	padding-left: 2%;
	padding-right: 2%;
	padding-top: 0.5em;
	}
	
.artclttl {
	width:100%;
	margin: 1em 0 ;
	padding:1em auto;
	float:left;
	}


}

/* ----- Actualités page Actualités ----- */




/*Overlay vignettes partenaires*/

.ovpart {
  height: 100%;
  width: 0;
  position: fixed;
  z-index: 8;
  top: 0;
  left: 0;
  background-color: rgb(0,0,0);
  background-color: rgba(0,0,0, 0.9);
  overflow-x: hidden;
  transition: 0.5s;
}


.Ovpart-content {
  display: flex;
  flex-flow: column wrap;
  justify-content: center;
  align-items: center;
  min-height:90vh;
  margin-top: 30px;
  width: 100%;

}

.ovpart a {
  padding: 8px;
  text-decoration: none;
  font-size: 36px;
  color: #818181;
  display: block;
  transition: 0.3s;
}

.ovpart a:hover, .ovprod a:focus {
  color: #f1f1f1;
}

.ovpart .closebtn {
  position: absolute;
  top: 15px;
  right: 30px;
  font-size: 40px;
}



/*Overlay Img*/
.ovprod {
  height: 100%;
  width: 0;
  position: fixed;
  z-index: 8;
  top: 0;
  left: 0;
  background-color: rgb(0,0,0);
  background-color: rgba(0,0,0, 0.9);
  overflow-x: hidden;
  transition: 0.5s;
}

.ovprod-content {
  display: flex;
  flex-flow: column nowrap;
  justify-content: center;
  align-items: center;
  width: 100%;
  text-align: center;
  margin-top: 30px;
}

.ovprod a {
  padding: 8px;
  text-decoration: none;
  font-size: 36px;
  color: #818181;
  display: block;
  transition: 0.3s;
}

.ovprod a:hover, .ovprod a:focus {
  color: #f1f1f1;
}

.ovprod .closebtn {
  position: absolute;
  top: 15px;
  right: 30px;
  font-size: 40px;
}

@media screen and (max-height: 450px) {
  .ovprod a {font-size: 20px}
  .ovprod .closebtn {
  font-size: 30px;
  top: 10px;
  right: 20px;
  }
}

.ovimg {
	display: block;
	max-width: 80%;
	max-height: 1024px;
}
/*Overlay Img end*/


/* Footer*/
.footer {
	width:100%;
	display:flex;
	text-align:center;
	background-color:#ffffff;
	min-height:80px;
	justify-content: center;
	align-items: center;
}

p.footer {
	color: black;
	text-decoration: none;
	font-size: 18px;
	font-weight: bold;
}