@font-face {
    font-family: 'playlist';
    src: url('fonts/playlist.woff2') format('woff2'),
         url('fonts/playlist.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}
@font-face {
    font-family: 'amatic_scbold';
    src: url('fonts/amaticsc-bold.woff2') format('woff2'),
         url('fonts/amaticsc-bold.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}
@font-face {
    font-family: 'amatic_scregular';
    src: url('fonts/amaticsc-regular.woff2') format('woff2'),
         url('fonts/amaticsc-regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}

/**----------------- 
 * GLOBAL RESET 
-----------------**/
*, html, body, iframe, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h5, h5, h6, pre, form, label, fieldset, input, p, blockquote, table, th, td, audio, video { 
	margin:0; padding:0; outline:0; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; 
}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, img { display:block; }
table { border-collapse:collapse; border-spacing:0; }
table td { vertical-align:top; }
iframe, fieldset, img, a img { border:0 none; }
address, caption, cite, code, dfn, th, var { font-style:normal; font-weight:normal; text-align:left; } 
h1, h2, h3, h5, h5, h6 { font-size:100%; }
blockquote:before, blockquote:after, q:before, q:after { content:''; content:none; }
html>body * a { position:relative; }  /* Gets links displaying over a PNG background */
a { outline:none; } /* Gets rid of Firefox's dotted borders */
textarea, table, td, th, code, pre, samp { word-wrap: break-word; /* passage à la ligne forcé */
   -webkit-hyphens: auto; -moz-hyphens: auto; hyphens: auto; /* césure propre */
}
input, select { vertical-align:middle; }
ol, ul, li { list-style:none; }
strong, b { font-weight:normal; font-family:helvetica,Arial,sans-serif; }
iframe { padding:0; margin:0; }
em, i { font-style:italic; }
img { width: 100%; margin:0; padding:0; }

/**======================================================
   GENERIQUE
====================================================== */
html, body { height: 100%; }
body { width:100%; background:#ffffff; font:1em/1.5em helvetica, arial,sans-serif; color:#000000; text-align:center; }

h1 { margin: 0.3em 0 0 0.1em; font: bold 4em / 1.5em 'playlist', helvetica, arial, sans-serif; color: #96bd70; }
h2 { margin: 0.3em 0 0.3em; font: 2.8em / 1em 'amatic_scregular', helvetica, arial, sans-serif; color: #96bd70; }
h3 { display:inline; padding: 0; margin:0; color: #96bd70; font: normal 2.5em / 1.5em 'playlist', helvetica, arial, sans-serif; }
h4 { padding: 0.2em 0; color: #96bd70; font: normal 1em / 1em 'amatic_scbold',helvetica, arial, sans-serif; }
h5 { font: bold 1em / 1em helvetica, arial, sans-serif; }
h6 { font: normal 1em / 1em helvetica, arial, sans-serif; }

a { font: bold 1em / 1em helvetica, arial, sans-serif;color: #96bd70; text-decoration: underline; }
a:focus { font: bold 1em / 1em helvetica, arial, sans-serif;color: #96bd70; text-decoration: underline; }
a:hover { font: bold 1em / 1em helvetica, arial, sans-serif;color: #96bd70; text-decoration: none; }

h2 a { margin: 0.3em 0 0.3em; font: 0.5em / 0.5em 'amatic_scregular', helvetica, arial, sans-serif; color: #96bd70; text-decoration: underline; }
h2 a:focus, h2 a:hover { margin: 0.3em 0 0.3em; font: 0.5em / 0.5em 'amatic_scregular', helvetica, arial, sans-serif; color: #96bd70; text-decoration: none; }
h2.lien { margin: 0; font: 2.8em / 0.5em 'amatic_scregular', helvetica, arial, sans-serif; }

p { margin: 1em 0; }
img { width:100%; max-width:800px; /*padding: 0.5em 0 0.5em 0;*/ }
hr { display:block; margin:1em 0; padding:0; border:none; background-color:#010101; color:#ff6600; font-size:1px; height:1px; line-height:1px; }

.wrapper { max-width:100%; text-align:center; margin: 0 auto; box-sizing:initial; padding:0;  }

.smaller { font-size: 0.85em; }
.Left { float:none; margin: 0; width:100%; text-align:justify; }
.Right { float:none; margin: 0; width:100%; text-align:justify;}
.Centre { /*width:100%;*/ text-align:center; font-size: 3.5em; }
.hidden { visibility: hidden; }
.notdisplay { display: none; }
.clear-float, .clearing { clear: both; }

.clear-fix:after {
    visibility: hidden;
    display: block;
    font-size: 0;
    content: " ";
    clear: both;
    height: 0;
}

.clear-fix { zoom: 1; }


/**======================================================
   SLIDE
====================================================== */

#slide2, #slide3, #slide4, #slide5  {
	width:100%;
	height:100%;
	min-height: 500px;
	/*padding-top:100px;*/
	padding: 1em; 
	margin:0 auto 0 auto; 
	text-align:left;
}

#slide0, #slide00  {
	width:100%;
	height:100%;
}
#slide0 img { max-width:none; padding:0 !important; width:100%; height:auto; }

#slide00 { max-width:none; padding:0 !important;  }

#slide1 { text-align:center; min-width:100%; min-height:160px; padding:1em 0 1em 0; background-color:#ffffff; }
#slide1 img { margin: 0 auto 1em auto; width: 100%; max-width: 280px; padding:0;  }

#slide2 {
    background: url(images/slide2-bg.png) center 0 no-repeat fixed;
	background-color:#b6d19c;
}
#slide3 {
	background: url(images/slide1-bg.png) center 0 no-repeat fixed;
	background-color:#ffffff;
}

#slide4 {
	background: url(images/slide2-bg.png) center 0 no-repeat fixed;
	background-color:#b6d19c;
}

#slide5 {
	background: url(images/slide1-bg.png) center 0 no-repeat fixed;
	background-color:#ffffff;
}

#slide6 {
	background-color:#b6d19c;
}

.slide_insideblanc {
	max-width: 980px;
	margin: 0 auto;
	padding:2em;
    background-color: rgb(255, 255, 255); /* alternative solide */
    background-color: rgba(255, 255, 255, 0.8);
}


.slide_insidevert {
	max-width: 980px;
	margin: 0 auto;
	padding:2em;
    background-color: rgb(255, 255, 255); /* alternative solide */
    background-color: rgba(255, 255, 255, 0.5);
}

.slide_insidephotos {
	max-width: 980px;
	margin: 0 auto;
	padding:2em;
    background-color: rgb(182, 209, 156); /* alternative solide */
    background-color: rgba(182, 209, 156, 0.3);
}


/**======================================================
   MAIN, CONTENT
====================================================== */
#main { width:100%; text-align:center; }

.texte { padding:0 2% 0 2%; text-align:left; }

.item {
    -webkit-box-flex: 0 0 auto;
    -moz-box-flex: 0 0 auto;
    -webkit-flex: 0 0 auto;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    margin: 1em 1%;
    padding: 0;
    width: 23%;
    text-align: center;
}

.item img {
    margin: 0 auto;
    padding: 1em;
    width: 80%;
    background-color: #fff;
    border: 3px solid #fff;
    border-radius: 1em;
}

.item h3 { font: 1.3em / 1.4em , georgia, times, serif; }
.item a { color: #000; text-decoration: none; }
.item a:hover img, .item a:focus img { border-color: #b6d19c; }

.imgRight { width:100%; }
.imgRight30 { width:100%; }
.clear { clear:both; }

/**======================================================
   FOOTER
====================================================== */
#slide6 { width:100%; text-align:center; padding:1em; color:#ffffff; font-size:1em; line-height:1.5em; /*border-top: 1em solid #b6d19c; background-color: #b6d19c;*/ height:100%; }

.slide_insidebottom {
    font: normal 1.8em / 1.8em 'amatic_scregular', helvetica, arial, sans-serif; color: #ffffff;
	max-width: 980px;
	margin: 0 auto;
	padding:1em;
	height:4em; ;
}

.slide_insidebottom a { font: normal 1em / 1em 'amatic_scregular', helvetica, arial, sans-serif; color: #ffffff; text-decoration: underline; }
.slide_insidebottom a:focus { font: normal 1em / 1em 'amatic_scregular', helvetica, arial, sans-serif; color: #ffffff; text-decoration: underline; }
.slide_insidebottom a:hover { font: normal 1em / 1em 'amatic_scregular', helvetica, arial, sans-serif; color: #ffffff; text-decoration: none; }

/**=====================================================
   ECRANS smartphones paysage
====================================================== */
@media (min-width:480px) {


}
/**=====================================================
   ECRANS taille moyenne : tablettes, petits notebooks
====================================================== */
@media (min-width:640px) {
.imgRight { width:40%; float:left; margin: 0 1em 0 0; }
.imgRight30 { width:40%; float:left; margin: 0 1em 0 0; }
.tableau { display: -webkit-flex; display: flex; }
.Left { margin: 0 1em 1em 0; /*width:45%; */}
.Right {  margin: 0 0 1em 1em; /*width:48%;*/ }
img { width:100%; max-width:800px; padding: 0 0 0.5em 0; }
#slide0 img, #slide00 img { width:100% !important; max-width:none; padding:0; }
}

@media (min-width:960px) {
.wrapper { /*max-width:1280px;*/ width:100%; }
.imgRight { width:40%; float:left; margin: 0 1em 0 0; }
.imgRight30 { width:40%; float:left; margin: 0 1em 0 0; }

}

@media (min-width:1080px) {

}

/**=====================================================
   ECRANS + grands
====================================================== */
@media (min-width:1280px) {

.wrapper { /*max-width:1400px;*/ width:100%; }

}
