/* Internet Explorer */
 @-webkit-viewport {
     width: device-width;
}
 @-moz-viewport {
     width: device-width;
}
 @-ms-viewport {
     width: device-width;
}
 @-o-viewport {
     width: device-width;
}
 @viewport {
     width: device-width;
}
 @-ms-viewport {
     width: auto !important;
}
/* GENERAL */
 @font-face {
     font-family: "Naja";
     src: url("fonts/Naja/Naja.eot");
     src: url("fonts/Naja/Naja.eot?#iefix") format("embedded-opentype"), url("fonts/Naja/Naja.woff") format("woff"), url("fonts/Naja.svg#Naja") format("svg"), url("fonts/Naja/Naja.ttf") format("truetype");
     font-weight: normal;
     font-style: normal;
}
@font-face {
  font-family: 'IndieFlower';
  src: url('fonts/IndieFlower/IndieFlower.eot?#iefix') format('embedded-opentype'),  url('fonts/IndieFlower/IndieFlower.woff') format('woff'), url('fonts/IndieFlower/IndieFlower.ttf')  format('truetype'), url('fonts/IndieFlower/IndieFlower.svg#IndieFlower') format('svg');
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'CoolCrayon';
  src: url('fonts/CoolCrayon/CoolCrayon.eot?#iefix') format('embedded-opentype'),  url('fonts/CoolCrayon/CoolCrayon.woff') format('woff'), url('fonts/CoolCrayon/CoolCrayon.ttf')  format('truetype'), url('fonts/CoolCrayon/CoolCrayon.svg#CoolCrayon') format('svg');
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'LifeSavers';
  src: url('fonts/LifeSavers/LifeSavers.eot?#iefix') format('embedded-opentype'),  url('fonts/LifeSavers/LifeSavers.woff') format('woff'), url('fonts/LifeSavers/LifeSavers.ttf')  format('truetype'), url('fonts/LifeSavers/LifeSavers.svg#LifeSavers-Bold') format('svg');
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'JMHTypewriter';
  src: url('fonts/JMHTypewriter/JMHTypewriter.eot?#iefix') format('embedded-opentype'),  url('fonts/JMHTypewriter/JMHTypewriter.woff') format('woff'), url('fonts/JMHTypewriter/JMHTypewriter.ttf')  format('truetype'), url('fonts/JMHTypewriter/JMHTypewriter.svg#JMHTypewriter') format('svg');
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'BonVoyage';
  src: url('fonts/BonVoyage/BonVoyage.eot?#iefix') format('embedded-opentype'),  url('fonts/BonVoyage/BonVoyage.woff') format('woff'), url('fonts/BonVoyage/BonVoyage.ttf')  format('truetype'), url('fonts/BonVoyage/BonVoyage.svg#KBonVoyage') format('svg');
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'Bolica';
  src: url('fonts/Bolica/Bolica.eot?#iefix') format('embedded-opentype'),  url('fonts/Bolica/Bolica.woff') format('woff'), url('fonts/Bolica/Bolica.ttf')  format('truetype'), url('fonts/Bolica/Bolica.svg#Bolica') format('svg');
  font-weight: normal;
  font-style: normal;
}
 @font-face {
     font-family: "JosefinSlab";
     src: url("fonts/JosefinSlab/JosefinSlab-Regular.eot?") format("eot"), url("fonts/JosefinSlab/JosefinSlab-Regular.woff") format("woff"), url("fonts/JosefinSlab/JosefinSlab-Regular.svg#JosefinSlab") format("svg"), url("fonts/JosefinSlab/JosefinSlab-Regular.ttf") format("truetype");
     font-weight: normal;
     font-style: normal;
}
 @font-face {
     font-family: "Milloyste";
     src: url("fonts/Milloyste.otf") format("opentype");
     font-weight: normal;
     font-style: normal;
}
 @font-face {
     font-family: "WellBred";
     src: url("fonts/WellBred.otf") format("opentype");
     font-weight: normal;
     font-style: normal;
}
 @font-face {
     font-family: "Mightyful";
     src: url("fonts/Mightyful.ttf") format("truetype");
     font-weight: normal;
     font-style: normal;
}

 body {
     padding: 0px !important;
     margin: 0px 0px 0px 0px !important;
     color: #000;
     font-family: "JMHTypewriter", sans-serif;
     font-size: 16px;
     background: #FFF url(../design/fonds/bg.gif);
     cursor: url('../design/icones-site/arrow.cur'), default;
}




/* MODIFICATIONS SMARTPHONE BODY*/
 @media (max-width: 480px) {
     body {
         font-family: "arial", sans-serif;
         font-size: 16px;
         font-weight: 200;
    }
}
/* FIN MODIFICATIONS SMARTPHONE BODY*/
 a {
     outline: none !important;
     -webkit-transition: back 0.2s ease-out;
     -moz-transition: all 0.2s ease-out;
     -o-transition: all 0.2s ease-out;
     -ms-transition: all 0.2s ease-out;
}
 a:focus, a:hover, a:active {
     outline: none !important;
     text-decoration: none;
     cursor: url('../design/icones-site/select.cur'), pointer;
}
 h1, h2, h3, h4, h5, h6 {
     font-family: "IndieFlower";
}

/* LOADER */

.loader{
	display:none;
	background: #fff url('../design/fonds/bg.gif');
	opacity: 0.95;
	cursor: url('../design/icones-site/arrow.cur'), default;
	height: 100%;
	left: 0;
	position: fixed;
	top: 0;
	width: 100%;
	z-index: 9999;
}
.loader p {
	display: block;
	position: relative;
	top: 45%;
	left: 45%;
	height: 60px;
	width: 60px;
	background: url('../design/fonds/loader.gif');
	background-size: cover;
}

.loader p:before {
	display: block;
	position: relative;
	top: 80px;
	left: -30px;
	width: 200px;
	color: #3477A9;
	font-size: 30px;
	content:" ";
}

 @media (max-width: 480px) {
 	.loader{
	background: #fff url('../design/fonds/bg.gif');
	opacity: 0.9;
}
 	.loader p {
	display: block;
	position: relative;
	height: 40px;
	width: 40px;
	}
 }
 
 .progress-bar {
      background-color: #2196f3;
      position: absolute;
      bottom: 0px;
      position: fixed;
      height: 5px;
      left: 0;
    }
    
     .progress-bar-texte {
      background-color: #A84C1B;
      position: absolute;
      bottom: 0px;
      position: fixed;
      height: 3px;
      left: 0;
    }
    
     @media (max-width: 480px) {
 	 .progress-bar {
      background-color: #2196f3;
      bottom: 0px;
      position: fixed;
      height: 3px;
      left: 0;
    }
    
         .progress-bar-texte {
      background-color: #A84C1B;
      position: absolute;
      bottom: 50px;
      position: fixed;
      height: 3px;
      left: 0;
    }
}
			
/* CONTAINER-PAGE */
 .container-page {
     display: inline-block;
     width: 80%;
     margin: 115px 10% 80px 10%;
     background: none;
}
 @media (max-width: 1200px) {
     .container-page {
         width: 94%;
         margin: 115px 3% 80px 3%;
    }
}
 @media (max-width: 991px) {
     .container-page {
         width: 100%;
         margin: 115px 0px 50px 0px;
    }
     body {
         background: #FFF;
    }
}
 @media (max-width: 767px) {
     .container-page {
         width: 100%;
         margin: 45px 0px 30px 0px;
    }
}
 @media (max-width: 480px) {
     .container-page {
         width: 100%;
         margin: 0px 0px 30px 0px;
    }
     .container-page.bis {
         width: 100%;
         margin: 0px 0px 0px 0px;
    }
}
/* CONTAINERS COULEUR */
 .container-neutre {
     display: block;
}
 .container-filmo-com {
     display: inline-block;
     background: #B58A66 url(../design/fonds/com.jpg) repeat;
     width: 100%;
     padding: 10px 0 20px 0;
     margin-bottom: -10px;
}
 .container-filmo-com.fignole {
     display: inline-block;
     background: #B58A66 url(../design/fonds/com.jpg) repeat;
     width: 100%;
     padding: 30px 50px 10px 40px;
     margin-bottom: -10px;
}
 @media (max-width: 767px) {
     .container-filmo-com {
         padding: 10px 0 30px 0;
         margin-bottom: -10px;
    }
     .container-filmo-com.fignole {
         padding: 10px 10px 0px 10px;
         margin-bottom: -40px;
    }
}
 @media (max-width: 480px) {
     .container-filmo-com {
         padding: 0px 0px 10px 0px;
    }
     .container-filmo-com.fignole {
         padding: 20px 0px 50px 0px;
    }
}
 .bg-theme {
     background: #CDDF08;
}
 .container-couleur-0 {
     display: inline-block;
     background: #000;
     margin-bottom: -10px;
     width: 100%;
     min-height: 240px;
}
 .container-couleur-f {
     display: inline-block;
     width: 100%;
     background: #fff;
     padding: 60px 40px 20px 40px;
}
 @media (max-width: 767px) {
     .container-couleur-f {
         padding: 20px 20px 20px 20px;
    }
}
/* BANNIERE */
 .banniere {
     background: #3A76A8 url(../design/bannieres/banniere-1.jpg);
     height: 200px;
     width: 100%;
     display: inline-block;
}
 .banniere p {
     font-family: "BonVoyage", sans-serif;
     color: #C3E8F8;
     font-weight: 800;
     font-size: 80px;
     text-align: right;
     margin: 10px 5% -40px 0;
}
 .banniere span p {
     font-family: "BonVoyage", sans-serif;
     color: #fff;
     font-weight: 400;
     font-size: 60px;
     font-style: normal;
     text-align: right;
     margin: 0px 5% 0 0;
}
 @media (max-width: 767px) {
     .banniere {
         background: #3A76A8 url(../design/bannieres/banniere-2.jpg) no-repeat;
         height: 95px;
    }
     .banniere p {
         font-size: 60px;
         margin: -10px 20px -30px 0;
         letter-spacing: -1px;
    }
     .banniere span p {
         font-size: 35px;
         letter-spacing: -1px;
         margin: 0px 20px 0 0;
    }
}
 @media (max-width:520px) {
     .banniere {
         background: #fff url(../design/bannieres/banniere-3.jpg) no-repeat;
         height: 80px;
    }
     .banniere p {
         font-size: 29px;
         margin: 6px 5px -10px 0;
         color: #fff;
         font-weight: 800;
    }
     .banniere span p {
         font-size: 22px;
         margin: 0px 10px 0 0;
         font-weight: 800;
    }
}
/* BANNIERE-ERREUR */
 .banniere.erreur {
     background: #fff url(../design/bannieres/banniere-erreur-1.jpg);
     height: 200px;
}
 @media (max-width: 767px) {
     .banniere.erreur {
         background: #fff url(../design/bannieres/banniere-erreur-2.jpg) no-repeat;
         height: 95px;
    }
}
 @media (max-width: 480px) {
     .banniere.erreur {
         background: #fff url(../design/bannieres/banniere-erreur-3.jpg) no-repeat;
         height: 80px;
    }
}
/* BANNIERE-OPUS */
 .banniere.opus p {
     color: #fff;
}
 .banniere.opus span p {
     color: #fff;
}
 .banniere.opus {
     background: #3B060E url(../design/bannieres/banniere-opus-1.jpg);
     height: 200px;
}
 @media (max-width: 767px) {
     .banniere.opus {
         background: #3B060E url(../design/bannieres/banniere-opus-2.jpg) no-repeat;
         height: 95px;
    }
}
 @media (max-width: 480px) {
     .banniere.opus {
         background: #000 url(../design/bannieres/banniere-opus-3.jpg) no-repeat;
         height: 80px;
    }
}
/* BANNIERE-MAGIE */
 .banniere.magie p {
     color: #B81D2D;
     font-weight: 800;
     font-size: 30px;
     margin: 15px 5% -10px 0;
}
 .banniere.magie span p {
     color: #fff;
     font-weight: 400;
     font-size: 80px;
     margin: 0px 5% 0 0;
} 

 .banniere.magie {
     background: #000 url(../design/bannieres/banniere-magie-1.jpg);
     height: 200px;
}
 @media (max-width: 767px) {
     .banniere.magie {
         background: #000 url(../design/bannieres/banniere-magie-2.jpg) no-repeat;
         height: 95px;
    }
     .banniere.magie p {
     font-size: 20px;
     margin: 5px 5% -30px 0;
}
 .banniere.magie span p {
     font-size: 70px;
     margin: 0px 5% 0 0;
}
}
 @media (max-width: 480px) {
     .banniere.magie {
         background: #000 url(../design/bannieres/banniere-magie-3.jpg) no-repeat;
         height: 80px;
    }
   	.banniere.magie p {
   		display: none;
     font-size: 20px;
     margin: 5px 5% -30px 0;
   	}
 .banniere.magie span p {
     font-weight: 800;
     font-size: 30px;
     margin: 0px 5% 0 0;
}
}

/* BANNIERE-ECRITURE */
 .banniere.ecriture p {
 	display: block;
     color: #F2F3ED;
     font-weight: 800;
     font-size: 30px;
     margin: 15px 5% -10px 0;
}
 .banniere.ecriture span p {
 	display: block;
     color: #F0E3D3;
     font-weight: 600;
     font-size: 80px;
     margin: 0px 5% 0 0;
} 

 .banniere.ecriture {
     background: #000 url(../design/bannieres/banniere-ecriture-1.jpg);
     height: 200px;
}
 @media (max-width: 767px) {
     .banniere.ecriture {
         background: #000 url(../design/bannieres/banniere-ecriture-2.jpg) no-repeat;
         height: 95px;
    }
     .banniere.ecriture p {
     font-size: 20px;
     margin: 5px 5% -30px 0;
}
 .banniere.ecriture span p {
     font-size: 70px;
     margin: 0px 5% 0 0;
}
}
 @media (max-width: 480px) {
     .banniere.ecriture {
         background: #000 url(../design/bannieres/banniere-ecriture-3.jpg) no-repeat;
         height: 80px;
    }
   	.banniere.ecriture p {
   		display: none;
     font-size: 20px;
     margin: 5px 5% -30px 0;
   	}
 .banniere.ecriture span p {
 	display: none;
     font-weight: 800;
     font-size: 30px;
     margin: 0px 5% 0 0;
}
}

/* BANNIERE-ECOUTER */
 .banniere.ecouter p {
     color: #C3E8F8;
     font-weight: 800;
     font-size: 40px;
     margin: 35px 5% -25px 0;
}
 .banniere.ecouter span p {
     color: #fff;
     font-weight: 400;
     font-size: 85px;
     margin: 0px 5% 0 0;
} 
 @media (max-width: 767px) {
     .banniere.ecouter p {
     font-size: 22px;
     margin: 3px 5% -30px 0;
}
 .banniere.ecouter span p {
     font-size: 60px;
     margin: 5px 5% 0 0;
}
}

 @media (max-width: 480px) {
   	.banniere.ecouter p {
   		display: none;
     font-size: 20px;
     margin: 5px 5% -30px 0;
   	}
 .banniere.ecouter span p {
 	display: block;
     font-weight: 400;
     font-size: 40px;
     margin: 20px 5% 0 0;
}
}

/* CONTAINER-SONS */
 .container-sons {
    background: #FFF url(../design/fonds/sons.jpg) repeat;
     display: inline-block;
     width: 100%;
     height: auto;
     margin-bottom: 0px;
}



/* ARIANE */
 .ariane {
     display: inline-block;
     width: 100%;
     height: auto;
     line-height: 21px;
     padding: 5px 20px;
     text-align: center;
     font-size: 12px;
     font-weight: 300;
     font-family: "Helvetica";
     margin-top: -5px;
}
 .ariane.opus {
     background: #fff;
     color: #000;
}
 .ariane.opus a {
     color: #555;
     font-weight: 500;
}
 .ariane.opus a:hover {
     color: #000;
     font-weight: 500;
}
 .ariane.opus .fa {
     color: #999;
     font-size: 8px;
     font-weight: 400;
     margin: auto 4px;
}
 @media (max-width: 767px) {
     .ariane {
         display: none;
    }
}
/* PRESENTATION */
 .top {
     padding: 0px 0px 0px 0px;
     margin-bottom: -5px;
     display: inline-block;
     width: 100%;
     background: url(../design/fonds/chapeaux.jpg);
     background-position: top right;
     background-size: 35% 100%;
}
 .presentation {
     position: relative;
     padding: 40px 40px 0px 40px;
 	background: #fff;
 	}

 .presentation p {
     line-height: 20px;
}

.bouge-pas-de-la p{
	 width: calc(100% - 180px);
	 float: right;
}
.bouge-de-la p{
	 width: 100%;
	 display:inline-block;
	 line-height: 25px;
}
 .presentation .mep {
     text-align: ;
}
 .presentation .mep p {
     font-family: "BonVoyage";
     display: inline-block;
     font-size: 43px;
     font-weight: 500;
     line-height: 40px;
     margin: 0px auto 25px auto;
}
.presentation .mep img{
     float: left;
     width: 150px;
     margin: 30px 0px 0px 0px;     
}
 .bonjour {
     display: inline-block;
     float: left;
     margin: 0px 25px 20px 0;
background: #;     
}
 .chapeaux {
     display: inline-block;
     text-align: center;
     margin-top: 80px;
}
 .chapeaux iframe {
     border: 0px;
}
 .pastille img {
     display: none;
     margin-bottom: 20px;
     width: 100px;
     height: 100px;
     border-radius: 50%;
     box-shadow: 5px 5px 7px 0px rgba(0, 0, 0, 0.3);
}
 @media (max-width: 991px) {
     .chapeaux {
         margin-top: 120px;
    }
     .presentation .mep p {
         font-size: 38px;
         margin: 0px auto 20px auto;
    }
    .bouge-pas-de-la p{
	 width: calc(100% - 170px);
}
     .presentation .mep img{
     width: 140px;
}

}

 @media (max-width: 850px) {
     .presentation .mep p {
         font-size: 32px;
         margin: 0px auto 5px auto;
    }
        .bouge-pas-de-la p{
	 width: calc(100% - 160px);
}
         .presentation .mep img{
     width: 130px;
  } 
  }  
  
 @media (max-width: 767px) {
     .top {
         padding: 40px 20px 15px 20px;
         background: #fff;
    }
     .presentation {
         padding: 0px;
    }
     .presentation .mep p {
         font-size: 34px;
         line-height: 30px;
         float: none;
         margin: 0px 0px 10px 0px;
    }
     .presentation .mep img{
     width: 130px;
          margin: 20px 0px 0px 0px;     

  } 
  
   .bonjour {
     margin: 0px 30px 25px 0;
}
     .chapeaux {
         padding: 40px;
         margin: 0px;
         background: #fff url(../design/fonds/chapeaux.jpg);
    }
}
 @media (max-width: 480px) {
     .top {
         padding: 20px 20px 10px 20px;
         margin-bottom: -10px;
    }

     .presentation .mep p {
         font-size: 38px;
         line-height: 32px;
         margin: 15px auto 40px 15px;
    }
         .presentation .mep img{
     width: 130px;
          margin: 20px 0px 0px 0px;     

  } 
    .bouge-pas-de-la p{
	 width: 100%;
	 display: inline-block;
	 float: none;
}
   .bonjour {
     margin: 0px 0px 5px 0;
}

}

 @media (max-width: 360px) {
     .top {
         padding: 10px 20px 10px 20px;
         margin-bottom: -10px;
    }

     .presentation .mep p {
         font-size: 34px;
         line-height: 32px;
         margin: 15px 0px 20px 10px;
    }
         .presentation .mep img{
     width: 90px;
          margin: 20px 0px 0px 0px;     

  } 
    .bouge-pas-de-la p{
	 width: 100%;
	 display: inline-block;
	 float: none;
}
   .bonjour {
     margin: 5px 0px 5px 0;
}

}
/* MERCI DE VOTRE VISITE */
 .votre-visite {
     background: #fff;
     margin: 20px auto;
     width: 100%;
     text-align: right;
}
 .votre-visite img {
     width: 70%;
}
 @media (max-width: 480px) {
     .votre-visite img {
         width: 100%;
    }
}
/* HAUT-RUBRIQUE */
 .haut-rubrique {
     position: relative;
     padding: 40px 40px 30px 40px;
     display: inline-block;
     width: 100%;
     background: #eee;
     margin-bottom: 0px;
}
 .haut-rubrique p {
     line-height: 20px;
     margin: 0px auto 10px auto;
     text-indent: 0px;
}
 .haut-rubrique span p {
     font-family: "BonVoyage";
     font-size: 45px;
     line-height: 40px;
     margin: auto auto 20px 0px;
}
 .haut-rubrique img {
     float: right;
     width: 140px;
     margin: 0px 0px 10px 30px;
}
 .haut-rubrique>span img {
     float: right;
     width: 100px;
     margin: -10px 0px 10px 30px;
}
 @media (max-width: 480px) {
     .haut-rubrique {
         padding: 10px 20px 20px 20px;
    }
     .haut-rubrique span p {
         font-size: 45px;
         line-height: 30px;
         margin: 15px auto 13px 0;
    }
     .haut-rubrique p {
         line-height: 20px;
    }
     .haut-rubrique img {
         width: 50px;
         margin: 5px -10px 10px 5px;
    }
     .haut-rubrique>span img {
         width: 40px;
         margin: 0px -10px 10px 5px;
    }
}
 @media (max-width: 360px) {
     .haut-rubrique span p {
         font-size: 35px;
         line-height: 30px;
         margin: 15px auto 13px 0;
    }
}
/* FACETIE */
 .facetie {
     padding: 30px 30px 20px 30px;
     display: inline-block;
     width: 100%;
     background: #fff;
     margin-top: -10px;
}
 .facetie h1 {
 	font-family: "BonVoyage";
     font-size: 45px;
     line-height: 50px;
     margin: 0px auto 20px 0px;
}
 .facetie p {
     line-height: 22px;
}
 @media (max-width: 480px) {
     .facetie {
         padding: 20px 20px;
    }
     .facetie h1 {
         font-size: 35px;
         line-height: 30px;
         margin: 0px auto 70px 0px;
    }
}
/* A-MON-PROPOS */
 .a-mon-propos {
     display: block;
     height: 100%;
     padding: 5px 0px 5px 30px;
     margin: 0px;
     background: #fff;
     color: #000;
}
 .a-mon-propos p {
     line-height: 20px;
     text-indent: 30px;
}
 .a-mon-propos span p {
 	display: inline-block;
     font-family: "BonVoyage";
     font-size: 45px;
     font-weight: 500;
     margin: 3px auto 20px -30px;
}
 .a-mon-propos img {
     width: 180px;
     float: right;
     margin: 0px 0px 20px 20px;
     -ms-transform: rotate(3deg);
     -webkit-transform: rotate(3deg);
     transform: rotate(3deg);
     background: #fff url(../design/fonds/.jpg);
     background-position: top left;
     background-size: cover;
     border: 1px solid #ddd;
     padding: 10px;
     border-radius: 3px;
     box-shadow: 5px 10px 5px 0px rgba(0, 0, 0, 0.3);
}

 .a-mon-propos span img {
 	width: 150px;
     float: none;
     -ms-transform: none;
     -webkit-transform: none;
     transform: none;
     background: none;
     box-shadow: none;
     margin: -35px auto 0px 180px;
     border: none;
}

 @media (max-width: 991px) {
     .a-mon-propos {
         padding: 5px 20px 5px 0px;
    }

     .a-mon-propos img {
         float: left;
         margin: 0px 30px 20px 10px;
         -ms-transform: rotate(-3deg);
         -webkit-transform: rotate(-3deg);
         transform: rotate(-3deg);
    }
     .a-mon-propos span img {
	margin: -35px auto 0px 180px;
}
    
}
 @media (max-width: 767px) {
     .a-mon-propos {
         padding: 30px 20px 10px 20px;
    }
         .a-mon-propos p {
     line-height: 20px;
     text-indent: 20px;
}
 .a-mon-propos span p {
     margin: 3px auto 20px -20px;
}
         .a-mon-propos span img {
     	margin: -25px auto 0px 170px;
    }


}
 @media (max-width: 590px) {
     .container-couleur-f {
         padding: 0px;
         border-radius: 0px;
    }
     .a-mon-propos {
         padding: 30px 20px 20px 20px;
    }
     .a-mon-propos img {
         width: 120px;
         margin: 0px 20px 5px 0px;
         -ms-transform: none;
         -webkit-transform: none;
         transform: none;
         border-radius: 3px;
         padding: 4px;
         box-shadow: 5px 10px 5px 0px rgba(0, 0, 0, 0.3);
    }
         .a-mon-propos span img {
         margin: -25px auto 0px 160px;
    }
}
 @media (max-width: 480px) {
     .a-mon-propos {
         padding: 20px 20px 20px 20px;
    }
     .a-mon-propos span img {
     	width: 130px;
         margin: -30px auto 0px 160px;
    }
             .a-mon-propos p {
     line-height: 20px;
     text-indent: 0px;
}     
.a-mon-propos span p {
	display: block;
	text-indent: 0px;
         font-size: 35px;
         font-weight: 500;
         line-height:27px;
     margin: 3px auto 20px 0;
    }
 
}
/* CURSUS-BOX */
 .cursus-box {
     position: absolute;
     bottom: 0;
     width: 100%;
     height: auto;
     padding: 5px 10px 0px 10px;
     background: #F5F6E3;
     opacity: 0.91;
     color: #000;
     display: block;
     border-radius: 0 0 10px 10px;

}
 .cursus-box p {
     font-family: "Verdana";
     font-size: 13px;
     font-weight: 300;
     line-height: 13px;
     text-align: left;
}
 .cursus-box h4 {
     font-family: "BonVoyage";
     font-size: 30px;
     margin: 10px auto 5px 0px;
}
 .cursus-box .bas-droite {
     font-family: "IndieFlower";
     letter-spacing: 1px;
     font-weight: 400;
     float: right;
     margin-top: -20px;
     font-size: 16px;
}
 .cursus-box .bas-droite span {
     position: absolute;
     bottom: 18px;
     right: 67px;
     font-size: 20px;
     font-weight: 800;
     color: #462C53;
}
 .cursus-box .bas-droite img {
     display: inline-block;
     width: 50px;
     height: 50px;
     border-radius: 50%;
     margin: 10px 0px 5px 40px;
     box-shadow: 5px 10px 15px 0px rgba(0, 0, 0, 0.3);
     border: 0px solid #c00;
}
 .astral {
     height: 170px;
     background: url(../design/bio/cursus/astral.jpg);
     background-size: 100%;
}
 .scolaire {
     height: 170px;
     background: url(../design/bio/cursus/scolaire.jpg);
     background-size: 100%;
}
 .musicale {
     height: 170px;
     background: url(../design/bio/cursus/musicale.jpg);
     background-size: 100%;
}
 .communiquer {
     height: 170px;
     background: url(../design/bio/cursus/communiquer.jpg);
     background-size: 100%;
}

     .astral, .scolaire, .communiquer, .musicale {
         border-radius: 10px;
         margin-bottom: 2px;
    }
 .communiquer img {
     border-radius: 0px;
     box-shadow: none;
     margin: 2px auto auto 0px;
}
 @media (max-width: 992px) {
 	     .astral, .scolaire, .communiquer, .musicale {
         margin-top: 3px;
         margin-right:4px;
         width: 49%;
    }
     .astral {
         border-bottom: 0px solid #fff;
    }
     .scolaire {
         border-bottom: 0px solid #fff;
         border-left: 0px solid #fff;
    }
     .communiquer {
         border-left: 0px solid #fff;
    }
}
 @media (max-width: 767px) {
     .astral, .scolaire, .musicale, .communiquer {
         border: 0;
         margin:0;
         width: 100%;
    }
        .scolaire, .musicale {
         border-radius: 0px;
    }
         .astral {
         border-radius: 10px 10px 0 0;
    }    
        
       .communiquer {
         border-radius: 0 0 10px 10px;
    }
        .communiquer .cursus-box {
         border-radius: 0 0 10px 10px;
    }
    
     .cursus-box {
         padding: 15px 20px 0px 20px;
         border-radius: 0;
    }
     .cursus-box h4 {
         font-size: 30px;
         margin: 0px auto 5px 0px;
    }
     .cursus-box .bas-droite {
         font-size: 16px;
    }
     .cursus-box .bas-droite span {
         right: 85px;
         bottom: 18px;
    }
     .cursus-box .bas-droite img {
         margin: 15px 0px 5px 50px;
         border: 1px solid #8E12AF;
    }
}
/* CHARLIE */
 .charlies {
     display: block;
     padding: 0px;
     margin: 0px;
     text-align: center;
     width: 300px;
     height: 210px;
}
 .charlies-gif {
     display: block;
     width: 300px;
     height: 175px;
     margin: 0px;
     background: #AF7184;
}
 .charlies-gif.orange {
     background: #E03104;
}
 .charlies-gif.poppins {
     background: #E59450;
}
 .charlies-gif.poppins>img {
     height: 175px;
}
 .charlies img {
     height: 175px;
}
 .charlies ul {
     display: inline-block;
     width: 300px;
     height: 25px;
     text-align: center;
     margin: 15px 0px 0px -37px;
     font-family: "IndieFlower";
     font-size: 16px;
}
 .charlies li {
     float: left;
     margin: 0px 9px auto 1px;
     line-height: 20px;
     background: #D77A83;
     padding: 3px 10px 0px 8px;
     border-radius: 5px;
     color: #fff;
}
 .charlies a li {
     background: #D8C3C5;
     color: #000;
}
 .charlies a li:hover {
     background: #D77A83;
     color: #fff;
}
 .charlies a {
     text-decoration: none;
}

/* PENSEES */
 .pensees {
     position: relative;
     display: inline-block;
     width: 100%;
     padding: 20px 20px;
     margin-top: -10px;
     background: #000 url(../design/fonds/rideau-noir.jpg) repeat;
     background-size: 300% 100%;
     background-position: 0px 0px;
     border-top: 0px solid #ddd;
     color: #fff;
     -webkit-transition-duration: 4s;
     -moz-transition-duration: 4s;
     transition-duration: 4s;
}

.pensees:hover {

     background: #000 url(../design/fonds/rideau-noir.jpg) repeat;
     background-size: 200% 100%;
     background-position: 60% 0px;
     -webkit-transition-duration: 7s;
     -moz-transition-duration: 7s;
     transition-duration: 7s;
}

 .pensees .passees {
     position: relative;
     margin-top: 20px;
     margin-right: 20px;
     float: right;
     color: #fff;
     font-family: "IndieFlower";
     font-style: normal;
     font-weight: 400;
     font-size: 15px;
     letter-spacing: 1px;
     -webkit-transition-duration: 0.5s;
     -moz-transition-duration: 0.5s;
     transition-duration: 0.5s;

}
 .pensees .passees>span>i {
     font-size: 20px;
     position: absolute;
     bottom: -5px;
     right: -30px;
     color: #fff;
}
 .pensees:hover .passees i {
     -webkit-transition-duration: 0.5s;
     -moz-transition-duration: 0.5s;
     transition-duration: 0.5s;
     color: #fff;
}
 .pensees p {
 	font-size: 40px;
     line-height: 35px;
     font-weight: 600;
     margin: 10px auto 3px auto;
     font-family: "Bolica";
     text-align: center;

}
 .pensees span > p {
     font-weight: 600;
     font-size: 26px;
     text-align: center;
}
 .pensees img {
     display: inline-block;
     float: left;
     margin: 0px 20px auto auto;
     width: 100px;
}
 
 @media (max-width: 767px) {
     .pensees {
         padding: 10px 20px ;
         margin-top: 0px;
         border-bottom: 0px solid #ddd;
    }
         .pensees .passees {
         position: relative;
         margin-top: 15px;
         font-style: normal;
         margin-right: 20px;
    }
 }

 @media (max-width: 480px) {
         .pensees {
         color: #fff;
         padding: 5px 20px 10px 20px;
         margin-bottom: 0px;
         border-bottom: 2px solid #ddd;
    }

	.pensees img {
		display: none;
	}
     .pensees p {
         font-size: 26px;
         font-weight: 600;
         line-height: 22px;
         margin: 10px 0 -5px 0;
         text-align: left;

    }
     .pensees span p {
         font-size: 22px;
         font-weight: 600;
         text-align: left;
    }
     .pensees img {
         margin: 0px 10px auto auto;
         width: 90px;
    }
     .pensees .passees {
         position: relative;
         color: #fff;
         margin-top: 30px;
         font-size: 13px;
         font-style: normal;
         font-weight: 600;
         margin-right: 25px;
    }
     .pensees .passees>span>i {
         position: absolute;
         bottom: -8px;
         right: -25px;
         font-size: 20px;
         color: #fff;
    }
}

/* DERNIERES PENSEES */
 .dernieres-pensees {
     width: auto;
     background: #fff;
     padding: 20px;
     margin-top: 0px;
     font-style: normal;
}
 .dernieres-pensees h1 {
 	font-family: "BonVoyage";
     font-size: 35px;
     line-height: 35px;
     margin: 0px auto 30px 0px;
     font-style: normal;
}
 .dernieres-pensees p {
     margin: 15px auto 2px auto;
     line-height: 18px;
}
 .dernieres-pensees b {
     font-weight: 600;
}
 @media (max-width: 480px) {
     .dernieres-pensees {
         padding: 0px;
    }
     .dernieres-pensees h1 {
     font-size: 30px;
     line-height: 25px;
     margin: 0px auto 30px 0px;
}
     .dernieres-pensees b {
         font-weight: 800;
         font-size: 16px;
         line-height: 14px;
    }
}
/* PORTRAIT-CHINOIS */
 .portrait-chinois {
     display: inline-block;
     width: 100%;
     background: #fff;
     padding: 20px 40px 40px 40px;
     margin-top: -10px;
     border-top: 2px solid #ddd;
}
 .portrait-chinois a, .portrait-chinois a:hover {
     color: #000;
}
 .portrait-chinois p {
     line-height: 20px;
     text-indent: 30px;
}
 .portrait-chinois h2 {
     font-family: "BonVoyage";
     font-size: 45px;
     margin: 3px auto 10px 0px;
}
 .portrait-chinois img {
	width: 200px;
     float: right;
     margin: 0px 0px 30px 20px;
     -ms-transform: rotate(5deg);
     -webkit-transform: rotate(5deg);
     transform: rotate(5deg);
     border-radius: 50%;
     box-shadow: 5px 10px 5px 0px rgba(0, 0, 0, 0.3);
}
 .reponses {
     display: inline-block;
     width: 100%;
     height: auto;
     margin: -5px auto -10px auto;
}
 .sous-reponses {
 	font-family: "IndieFlower";
     display: inline-block;
     float: left;
     width: 44%;
     margin: 10px auto 10px 5%;
     padding: 5px;
     text-align: center;
     background: url(../design/fonds/sous-reponses.png);
     background-size: 100% 100%;
     border-radius: 0px;
     -webkit-transition-duration: 0.5s;
     -moz-transition-duration: 0.5s;
     transition-duration: 0.5s;
}
 .sous-reponses:hover {
     background: url(../design/fonds/sous-reponses-2.png);
     background-size: 100% 100%;
     -webkit-transition-duration: 0.3s;
     -moz-transition-duration: 0.3s;
     transition-duration: 0.3s;
}
 .sous-reponses img {
     display: inline-block;
     float: left;
     width: 60px;
     height: 60px;
     border-radius: 50%;
     margin: 0px 0px 0px 10px;
     box-shadow: 5px 10px 15px 0px rgba(0, 0, 0, 0.3);
     border: 0px;
          -ms-transform: rotate(0deg);
     -webkit-transform:rotate(0deg);
     transform: rotate(0deg);
     
}
 .sous-reponses p {
     margin: 20px auto auto 15px;
     line-height: 20px;
     font-weight: 600;
     color: #000;
}
 .sous-reponses a, sous-reponses a:hover {
     color: #000;
}

 @media (max-width: 991px) {
     .portrait-chinois {
         border-top: 0px;
         padding-top: 20px;
    }
}
 @media (max-width: 767px) {
     .portrait-chinois {
         padding: 40px 20px;
         margin: -30px auto 0px auto;
    }
     .portrait-chinois p {
     text-indent: 0px;
}
     .portrait-chinois img {
         width: 200px;
         height: 165px;
         margin: 0px 0px 30px 20px;
    }
     .sous-reponses img {
     display: inline-block;
     float: left;
     width: 60px;
     height: 60px;
     border-radius: 50%;
     margin: 0px 0px 0px 10px;
     box-shadow: 5px 10px 15px 0px rgba(0, 0, 0, 0.3);
     border: 0px;
}
 .sous-reponses p {
     margin: 10px auto auto 15px;
     line-height: 20px;
}
}
 @media (max-width: 480px) {
     .portrait-chinois img {
         float: none;
         margin: 0px auto 20px auto;
         border: 2px solid #FFFFD0;
                   -ms-transform: rotate(0deg);
     -webkit-transform:rotate(0deg);
     transform: rotate(0deg);
    }
     .portrait-chinois {
         padding: 10px 20px 10px 20px;
         margin-top: 0px;
    }
     .portrait-chinois h2 {
         margin: 3px auto 10px -5px;
         font-size: 35px;
    }
         .sous-reponses {
         display: inline-block;
         float: left;
         width: 44%;
         margin: 10px auto 10px 5%;
         padding: 5px;
         text-align: center;
         background: none;
         border-radius: 0px;
         box-shadow: none;
    }
     .sous-reponses:hover {
         box-shadow: none;
         background: none;
    }
	.sous-reponses img {
         float: none;
         margin: 0px;
         border: 5px solid #fff;
         width: 70px;
         height: 70px;
    }
    .sous-reponses:hover img {
         border: 5px solid #C7D318;
    }
     .sous-reponses p {
         margin: 10px auto 0px auto;
         font-size: 15px;
         line-height: 16px;
         font-weight: 300;
    }

}
/* QUESTIONNAIRE */
 .questionnaire {
     display: block;
     padding: 20px 30px 20px 20px;
     margin-bottom: 0px;
     text-align: left;
     line-height: 20px;
     background: #fff;
}
 .questionnaire h1 {
 	font-family: "BonVoyage";
     font-size: 35px;
     line-height: 35px;
     margin: -20px auto 20px 0px;
}
 .questionnaire span {
     color: #001A27;
     display: block;
     margin-bottom: 5px;
}
 .questionnaire b {
     color: #000;
     font-weight: 600;
}
 @media (max-width: 767px) {
     .questionnaire {
         padding: 20px 10px 20px 10px;
    }
}
 @media (max-width: 480px) {
     .questionnaire h1 {
         font-size: 35px;
         line-height: 35px;
         margin: -20px auto 20px 0px;
    }
     .questionnaire b {
         color: #000;
         font-weight: 800;
         font-size: 17px;
    }
}
/* FILMOGRAPHIE */
 .filmographie {
     position: relative;
     display: inline-block;
     margin: 15px 0px;
     padding: 0px 0px 0px 20px;
}
 .sous-filmo {
     position: relative;
     display: block;
     float: left;
     margin: 0px 5px 5px 0px;
     padding: 20px;
     width: 49%;
     border-radius: 5px;
     -webkit-transition-duration: 1.5s;
     -moz-transition-duration: 1.5s;
     transition-duration: 1.5s;
     opacity: 0.8;
}
 .sous-filmo.large {
     padding: 20px;
     width: 99%;
}
 .filmographie .sous-filmo h2, .filmographie .sous-filmo h4 {
     color: #fff;
     font-size: 50px;
     font-weight: 800;
     line-height: 45px;
     letter-spacing: -1px;
     margin: 0px auto 25px auto;
}
 .sous-filmo p {
     line-height: 20px;
     font-weight: 400;
}
 @media (max-width: 991px) {
     .filmographie {
         margin: 15px 0 0 0;
         padding: 0px 0px 0px 20px;
         width: 100%;
    }
     .sous-filmo {
         width: 48%;
    }
}
 @media (max-width: 767px) {
     .filmographie {
         margin: 15px 0 0 0;
         padding: 0px 20px 0px 20px;
    }
     .sous-filmo, .sous-filmo.large {
         margin: 2px 0px;
         width: 100%;
    }
}
 @media (max-width: 480px) {
     .filmographie {
         margin: 0px;
         padding: 0px;
         width: 100%;
    }
     .sous-filmo {
         margin: 0px;
         padding: 20px;
         width: 100%;
         border-radius: 0px;
    }
     .filmographie .sous-filmo h2, .filmographie .sous-filmo h4 {
         font-size: 50px;
         line-height: 45px;
         margin: 0px auto 25px auto;
    }
     .sous-filmo p {
         line-height: 20px;
         margin-top: -10px;
    }
}
 .voir-filmo {
     position: absolute;
     right: 10px;
     bottom: 0px;
     height: 30px;
     background: none;
     font-size: 20px;
     color: #CDDF08;
     -webkit-transition-duration: 1.5s;
     -moz-transition-duration: 1.5s;
     transition-duration: 1.5s;
     opacity: 1;
}
 .sous-filmo:hover .voir-filmo {
     color: #fff;
     -webkit-transition-duration: 1.5s;
     -moz-transition-duration: 1.5s;
     transition-duration: 1.5s;
     opacity: 1;
}
 .bg-2 {
     background: #086091 url(../design/filmo/longs-metrages-2.png) no-repeat;
     background-position: 95% 7%;
     color: #fff;
}
 .bg-2:hover {
     background: #CDDE07 url(../design/filmo/longs-metrages.png) no-repeat;
     background-position: 95% 7%;
     -webkit-transition-duration: all 1.5s;
     -moz-transition-duration: all 1.5s;
     transition-duration: all 1.5s;
}
 .bg-3 {
     background: #4C21CB url(../design/filmo/courts-metrages-2.png) no-repeat;
     background-position: 95% 7%;
     color: #fff;
}
 .bg-3:hover {
     background: #CDDE07 url(../design/filmo/courts-metrages.png) no-repeat;
     background-position: 95% 7%;
     -webkit-transition-duration: 1.5s;
     -moz-transition-duration: 1.5s;
     transition-duration: 1.5s;
}
 .bg-4 {
     background: #8E12AF url(../design/filmo/documentaires-2.png) no-repeat;
     background-position: 95% 7%;
     color: #fff;
}
 .bg-4:hover {
     background: #CDDE07 url(../design/filmo/documentaires.png) no-repeat;
     background-position: 95% 7%;
     -webkit-transition-duration: 1.5s;
     -moz-transition-duration: 1.5s;
     transition-duration: 1.5s;
}
 .bg-5 {
     background: #D6402B url(../design/filmo/theatre-2.png) no-repeat;
     background-position: 95% 5%;
     color: #fff;
}
 .bg-5:hover {
     background: #CDDE07 url(../design/filmo/theatre.png) no-repeat;
     background-position: 95% 5%;
     -webkit-transition-duration: 1.5s;
     -moz-transition-duration: 1.5s;
     transition-duration: 1.5s;
}
 .bg-6 {
     background: #EF752C url(../design/filmo/musique-2.png) no-repeat;
     background-position: 95% 10%;
     color: #fff;
}
 .bg-6:hover {
     background: #CDDE07 url(../design/filmo/musique.png) no-repeat;
     background-position: 95% 10%;
     -webkit-transition-duration: 1.5s;
     -moz-transition-duration: 1.5s;
     transition-duration: 1.5s;
}
 .bg-7 {
     background: #E0A600 url(../design/filmo/divers-2.png) no-repeat;
     background-position: 95% 10%;
     color: #fff;
}
 .bg-7:hover {
     background: #CDDE07 url(../design/filmo/divers.png) no-repeat;
     background-position: 95% 10%;
     -webkit-transition-duration: 1.5s;
     -moz-transition-duration: 1.5s;
     transition-duration: 1.5s;
}
 .bg-2:hover, .bg-3:hover, .bg-4:hover, .bg-5:hover, .bg-6:hover, .bg-7:hover {
     color: #333;
     -webkit-transition-duration: 0.3s;
     -moz-transition-duration: 0.3s;
     transition-duration: 0.3s;
}
/* INFORMATIONS */
 .informations {
     position: relative;
     display: inline-block;
     font-size: 20px;
     margin-bottom: 0px;
     margin-top: 15px;
     padding: 0px 20px;
}
/* INFOS PERSO */
 .infos-perso {
     display: inline-block;
     width: 100%;
     margin: 0px auto 0px auto;
}
 .communication {
     display: inline-block;
     width: 90%;
     margin: 20px 5% 0px 5%;
}
 .infos-box-col {
     display: inline-block;
     height: 70px;
     width: 100%;
     margin-bottom: 3px;
     border-radius: 5px;
     text-align: center;
     background: #fff;
}
 .etiquette {
     position: relative;
     font-family: "Verdana";
     display: block;
     background: #F0F6EF;
     padding: 20px 2px 0px 2px;
     width: 70%;
     height: 100%;
     margin-left: 30%;
          -webkit-transition-duration: 1s;
     -moz-transition-duration: 1s;
     transition-duration: 1s;
}

 .etiquette.bio {
     width: 70%;
     height: 100%;
     margin-left: 20%;
}

 .etiquette img {
     width: 20px;
     position: absolute;
     top: 10px;
     right: 10px;
}
 .infos-box-col .etiquette p {
     font-size: 14px;
     letter-spacing: -1px;
     line-height: 15px;
     color: #61717B;
     font-weight: 300;
}
 .infos-box-col .etiquette h3, .infos-box-col .etiquette h5 {
     font-size: 18px;
     font-weight: 500;
     margin: -5px auto 0px auto;
     color: #222;
}
.infos-box-col .etiquette.bio.alternative h3 {
     font-size: 18px;
     font-weight: 500;
     margin: -5px auto 0px auto;
     color: #222;
}


 .infos-box-col .icon-wrapper {
     display: block;
     float: left;
     width: 20%;
     height: 55px;
     padding-top: 10px;
     margin-left: 10px;
     font-size: 50px;
     text-align: center;
     text-shadow: 4px 7px 7px #ddd;
     color: #171B4C;
     -webkit-transition-duration: 1s;
     -moz-transition-duration: 1s;
     transition-duration: 1s;
}
 .infos-box-col .icon-wrapper.rouge {
     color: #BB363B;
}
 .infos-box-col .icon-wrapper-fa {
     display: block;
     float: left;
     width: 20%;
     height: 55px;
     padding-top: 5px;
     margin-left: 10px;
     font-size: 50px;
     text-align: center;
     text-shadow: 4px 7px 7px #ddd;
     color: #171B4C;
     -webkit-transition-duration: 1s;
     -moz-transition-duration: 1s;
     transition-duration: 1s;
}
 .infos-box-col:hover .icon-wrapper, .infos-box-col:hover .icon-wrapper-fa, .infos-box-col.large:hover .icon-wrapper {
     color: #C7D318;
     -webkit-transition-duration: 1s;
     -moz-transition-duration: 1s;
     transition-duration: 1s;
}
 .infos-box-col:hover .etiquette {
     background-color: #F9FFF8;
          -webkit-transition-duration: 1s;
     -moz-transition-duration: 1s;
     transition-duration: 1s;
}
 @media (max-width: 991px) {
     .infos-box-col {
         width: 49%;
         margin-right: 5px;
         margin-bottom: 5px;
    }
     .infos-box-col.large {
         width: 98.5%;
         margin-left: 0px;
    }
     .infos-box-col.large .etiquette {
         width: 85.5%;
         margin-left: 14.5%;
    }
     .infos-box-col.large .icon-wrapper {
     display: block;
     float: left;
     width: 10%;
     height: 55px;
     padding-top: 10px;
     margin-left: 10px;
     font-size: 50px;
     text-align: center;
     text-shadow: 4px 7px 7px #ddd;
     color: #171B4C;
     -webkit-transition-duration: 1s;
     -moz-transition-duration: 1s;
     transition-duration: 1s;
}
 .etiquette.bio {
     width: 70%;
     height: 100%;
     margin-left: 25%;
}
}
 @media (max-width: 767px) {
     .infos-box-col {
         width: 100%;
         margin: 0px 0px 2px 0px;
         text-align: center;
    }
     .infos-box-col.large {
         width: 100%;
    }
    .infos-box-col.large .icon-wrapper {
     width: 15%;
     margin-left: 5px;
 }
         .infos-box-col.large .etiquette {
         width: 70%;
         margin-left: 20%;
    }
     .etiquette.bio {
     width: 70%;
     margin-left: 20%;
}
     .infos-box-col .icon-wrapper {
         width: 15%;
         margin-left: 5px;
    }
     .infos-box-col .icon-wrapper .fa {
         margin-top: -30px;
    }
     .etiquette {
         margin-left: 20%;
    }
     .infos-box-col .etiquette h3, .infos-box-col .etiquette h5, .infos-box-col .etiquette.bio.alternative h3{
         font-size: 18px;
         font-weight: 600;
    }
}
 @media (max-width: 480px) {
     .communication {
         width: 100%;
         margin: 15px 0 0 0;
    }
     .informations {
         margin-bottom: 0px;
         margin-top: 0px;
         padding: 0px;
    }
     .infos-perso {
         margin: -10px auto 0px auto;
    }
     .infos-box-col {
         width: 100%;
         margin: auto 0px 0px 0px;
         border-radius: 0px;
         border-bottom: 2px solid #ddd;
    }
     .infos-box-col.large .etiquette {
         width: 70%;
         margin-left: 25%;
    }
     .infos-box-col .icon-wrapper {
         margin-left: 5px;
    }
     .etiquette, .etiquette.bio {
         margin-left: 25%;
    }


}
 @media (max-width: 370px) {
.infos-box-col .etiquette.bio.alternative h3 {
         font-size: 14px;
         font-weight: 900;
         margin: -5px auto 5px auto;
    }

}
/* TABLEAU NEWS */
 .tableau-news {
 	display: block;
     width: 100%;
     margin: 20px 0px;
}
 .tableau-news-2 {
     width: 50%;
     margin: 20px 0px;
}
 .tableau-news p, .tableau-news-2 p {
     font-family: "IndieFlower";
     font-size: 20px;
     letter-spacing: 0px;
     margin: 0px auto;
     font-weight: 500;
     color: #000;
}
 .news {
     margin: 0px 0px 0px 0px;
     padding: 10px 10px 5px 10px;
     border-right: 1px solid #eeeeee;
     border-left: 1px solid #eeeeee;
     background: #fff;
     display: inline-block;
     width: 100%;
}
 .titre-news {
     display: inline-block;
     margin: 0px;
     font-family: "American typewriter";
     font-weight: 400;
     font-size: 25px;
     line-height: 22px;
     color: #8C304C;
}
 .auteur-news {
     font-family: "American typewriter";
     margin: 0px 0px 0px 0px;
     font-weight: 500;
     font-size: 16px;
     line-height: 17px;
     color: #555;
}
 .sortie-news {
     font-family: "BonVoyage";
     margin: 5px 0px 0px 0px;
     font-weight: 500;
     font-size: 15px;
     color: #3C2E05;
}
 .actu-news {
     font-family: "BonVoyage";
     margin: 10px 0px 10px 0px;
     font-weight: 500;
     font-size: 15px;
     line-height: 17px;
     color: #927C38;
     text-align: left;
}
 .news>a>li {
     display: inline-block;
     width: 100%;
     padding: 5px;
     list-style: none;
     border-bottom: 1px solid #eeeeee;
}
 .news>a>li:hover {
     background: #C7D318;
    border-radius: 8px;
     -webkit-transition-duration: 1.5s;
     -moz-transition-duration: 1.5s;
     transition-duration: 1.5s;

     
}
 .news>li {
     width: 100%;
     padding: 5px;
     list-style: none;
     border-bottom: 1px solid #eeeeee;
}
 .news img {
     width: 80px;
     display: inline-block;
     margin: 0 15px 5px 0;
     float: left;
     border-radius: 5%;
     box-shadow: 5px 10px 15px 0px rgba(0, 0, 0, 0.3);
}
 @media (max-width: 991px) {
     .tableau-news {
         margin: 20px 0px 0px 0px;
    }
     .tableau-news-2 {
         width: 100%;
         margin: 25px 0px 0px 0px;
         padding: 0px 20px;
    }
     .titre-news {
     font-size: 35px;
     line-height: 22px;
}
}
 @media (max-width: 767px) {
     .tableau-news {
         margin: 20px 0px 0px 0px;
         padding: 0px 0px;
    }
     .tableau-news-2 {
         margin: -5px 5px 0px 0px;
         padding: 0px 20px;
    }
}
 @media (max-width: 480px) {
     .tableau-news {
         margin: 5px 0px 5px 0px;
         padding: 0px;
    }
     .tableau-news .nav.nav-tabs li, .tableau-news-2 .nav.nav-tabs li {
         text-align: center;
         width: 50%;
    }
     .tableau-news-2 {
         margin-top: -25px;
         margin-bottom: -6px;
         padding: 0px;
    }
     .titre-news {
         font-size: 30px;
         line-height: 24px;
    }
}
 @media (max-width: 320px) {
     .titre-news {
         font-size: 22px;
         line-height: 18px;
    }
}

/* footer-ecouter */
 .footer-ecouter {
     display: inline-block;
     float: left;
     width: 50%;
     height: auto;
     padding: 20px 20px 20px 20px;
     margin-top: 0px;
     color: #000;
     background: #F8F8F8;
     border-bottom: 1px solid #ccc;
     border-right: 1px solid #ccc;
     border-left: 0px solid #8C304C;
     -webkit-transition-duration: 1s;
     -moz-transition-duration: 1s;
     transition-duration: 1s;
      hoverflow: hidden;
}
 .footer-ecouter.sans-actu {
     width: 100%;
}
 .footer-ecouter.fin {
     width: 100%;
     border: 0px dotted #8C304C;
     padding: 10px 20px 0px 20px;
}
     .footer-ecouter.fin h4 {
     margin-top: 30px;
}
 .footer-ecouter.fin img {
     float: left;
     margin: 5px 20px 5px 20px;
}
 .footer-ecouter:hover {
     -webkit-transition-duration: 3s;
     -moz-transition-duration: 3s;
     transition-duration: 3s;
     background: #CDDE07;
}
 .footer-ecouter h4 {
 	font-family: "BonVoyage";
     font-size: 45px;
     line-height: 30px;
     font-weight: 600px;
     margin-bottom: 10px;
}
 .footer-ecouter p {
 	float: left;
     margin-bottom: 5px;
     line-height: 20px;
     width: calc(100% - 190px);
}
 .footer-ecouter img {
     float: right;
     width: 150px;
     height: 200px;
     margin: 5px 20px 5px 20px;
     border-radius: 0%;
}
 .footer-ecouter.sans-actu img {
     float: left;
     width: 150px;
     height: 200px;
     margin: 5px 20px 5px 20px;
     border-radius: 0%;
}
 @media (max-width: 870px) {
     .footer-ecouter p {
 	float: none;
     margin-bottom: 5px;
     width: 100%;
}
 }
 @media (max-width: 767px) {
     .footer-ecouter {
     	float: none;
     	width: 100%;
         padding: 20px 20px 10px 20px;
         margin-top: 0px;
    } 
    
     .footer-ecouter h4 {
     	display: block;
     font-size: 45px;
     line-height: 30px;
     font-weight: 600px;
     margin-top: 30px;
}
     .footer-ecouter p {
 	float: none;
     margin-bottom: 5px;
     width: 100%;
}
 .footer-ecouter img {
     float: left;
     width: 150px;
     height: 200px;
     margin: 0px 5px 0px 15px;
     border-radius: 0%;
}
 }
    
@media (max-width: 600px) {
	     .footer-ecouter, .footer-ecouter.fin {
         padding: 20px 20px 20px 20px;
    } 
     .footer-ecouter p {
         line-height: 20px;
    }
     .footer-ecouter h4 {
         margin-bottom: 15px;
    }
}
 @media (max-width: 480px) {
 	.footer-ecouter h4, .footer-ecouter.fin h4  {
         font-size: 35px;
         line-height: 30px;
         font-weight: 500;
         margin: 10px auto 15px 0px;
    }
     .footer-ecouter img, .footer-ecouter.fin img, .footer-ecouter.sans-actu img  {
         float: left;
         width: 140px;
         height:190px;
         margin: 5px 10px 0px 10px;
    }

     .footer-ecouter p {
         line-height: 20px;
    }
}

/* FOOTER-BIO */
 .footer-bio {
     display: inline-block;
     width: 100%;
     padding: 20px 20px 20px 20px;
     margin-top: 0px;
     color: #000;
     border-bottom: 1px solid #ccc;
     border-right: 0px dotted #8C304C;
     -webkit-transition-duration: 1s;
     -moz-transition-duration: 1s;
     transition-duration: 1s;
     background: #FBFFFE;
}
 .footer-bio.index {
     display: inline-block;
     width: 50%;
     padding: 20px 20px 20px 20px;
     margin-top: 0px;
     color: #000;
     -webkit-transition-duration: 1s;
     -moz-transition-duration: 1s;
     transition-duration: 1s;
     background: #FBFFFE;
}
 .footer-bio.index.sans-actu {
     width: 100%;
}
 .footer-bio:hover {
     -webkit-transition-duration: 3s;
     -moz-transition-duration: 3s;
     transition-duration: 3s;
     background: #CDDE07;
}
 .footer-bio h4, .footer-bio h5, .footer-bio h6 {
 	font-family: "BonVoyage";
     font-size: 45px;
     line-height: 30px;
     font-weight: 600px;
     margin-bottom: 10px;
}
 .footer-bio p {
 	 float: right;
     margin-bottom: 5px;
     line-height: 20px;
     width: calc(100% - 175px);
}
 .footer-bio.index p {
 	float: right;
     margin-bottom: 5px;
     line-height: 20px;
     width: calc(100% - 175px);
}
 .footer-bio img {
     float: left;
     width: 150px;
     margin: 5px 25px 5px 0px;
     border-radius: 0%;
     box-shadow: 5px 10px 18px 0px rgba(0, 0, 0, 0.3);
}
 @media (max-width: 870px) {
     .footer-bio p, .footer-bio.index p {
 	float: none;
     margin-bottom: 5px;
     width: 100%;
}
 }

@media (max-width: 767px) {
     .footer-bio.index {
         padding: 20px 20px 20px 20px;
         margin-top: 0px;
         width: 100%;
    } 
 }
    
@media (max-width: 600px) {
     .footer-bio p {
         line-height: 20px;
    }
     .footer-bio h4 {
         margin-bottom: 15px;
    }
}
 @media (max-width: 480px) {
 	.footer-bio h4 {
         font-size: 35px;
         line-height: 30px;
         font-weight: 500;
         margin: 10px auto 15px 0px;
    }
     .footer-bio img {
         float: left;
         width: 140px;
         margin: 5px 20px 8px 0px;
    }
     .footer-bio p {
         line-height: 20px;
    }
}
/* COLONNE-BIO */
 .col-bio {
     display: inline-block;
     margin: 20px 0px 15px 0px;
     padding: 10px 20px;
     border-radius: 5px;
     -webkit-transition-duration: 1.5s;
     -moz-transition-duration: 1.5s;
     transition-duration: 1.5s;
     background: #fff;
}
 .col-bio:hover {
     -webkit-transition-duration: 1.5s;
     -moz-transition-duration: 1.5s;
     transition-duration: 1.5s;
     background: #CDDF08;
}
 .col-bio h1 {
     font-size: 30px;
     margin: 10px auto 15px auto;
     font-weight: 400;
     color: #0E0E0E;
}
 .col-bio h4 {
     font-size: 30px;
     margin: 10px auto 15px auto;
     font-weight: 400;
     color: #000;
}
 .col-bio p {
     line-height: 22px;
     margin-bottom: 0px;
     font-size:16px;
     color: #555;
}
 .col-bio img {
     float: left;
     width: 150px;
     margin: 5px 15px 5px 0px;
     border-radius: 0%;
     box-shadow: 5px 10px 18px 0px rgba(0, 0, 0, 0.3);
}
/* SUITE */
 .suite {
     font-family: "IndieFlower";
     display: inline-block;
     float: right;
     font-size: 16px;
     line-height: 20px;
     color: #000;
     -webkit-transition-duration: 1s;
     -moz-transition-duration: 1s;
     transition-duration: 1s;
     margin-top: 7px;
     margin-bottom: 25px;
     letter-spacing:1px;


}

 .suite i {
 	position: relative;
 	bottom: -3px;
     font-size: 18px;
     line-height: 20px;
     color: #000;
     margin-left: 15px;
}
 .footer-bio:hover .suite, .footer-bio:hover .suite i {
     -webkit-transition-duration: 1s;
     -moz-transition-duration: 1s;
     transition-duration: 1s;
     color: #fff;
     font-weight: 300;
}

 .footer-ecouter:hover .suite, .footer-ecouter:hover .suite i {
     -webkit-transition-duration: 1s;
     -moz-transition-duration: 1s;
     transition-duration: 1s;
     color: #fff;
     font-weight: 300;
}

 .col-bio .suite {
 	     -webkit-transition-duration: 1s;
     -moz-transition-duration: 1s;
     transition-duration: 1s;
     color: #000;
     margin-bottom: 0px;
     font-weight: 300;
}
 .footer-bio .suite,  .footer-ecouter .suite  {
 	     -webkit-transition-duration: 1s;
     -moz-transition-duration: 1s;
     transition-duration: 1s;
     color: #000;
     margin-bottom: 0px;
     font-weight: 300;
}

 .col-bio .suite i {
     font-size: 18px;
     color: #000;
     margin-left: 15px;
     -webkit-transition-duration: 1s;
     -moz-transition-duration: 1s;
     transition-duration: 1s;
}
 .col-bio:hover .suite, .col-bio:hover .suite i {
     color: #fff;
     -webkit-transition-duration: 1s;
     -moz-transition-duration: 1s;
     transition-duration: 1s;
     font-weight: 300;
}
/* SUITE-2 */
 .suite-2 {
     font-family: "IndieFlower";
     float: right;
     width: 200px;
     font-size: 16px;
     line-height: 20px;
     float: right;
     color: #000;
     -webkit-transition-duration: 1s;
     -moz-transition-duration: 1s;
     transition-duration: 1s;
     margin: 7px 0px 25px auto;
     letter-spacing:1px;
}
 .suite-2 i {
 	position: relative;
 	bottom: -3px;
     font-size: 18px;
     line-height: 20px;
     color: #000;
     margin-left: 15px;
}
 .footer-bio .suite-2 {
 	     -webkit-transition-duration: 1s;
     -moz-transition-duration: 1s;
     transition-duration: 1s;
     color: #000;
     margin-bottom: 0px;
     font-weight: 300;
}
 .footer-bio:hover .suite-2, .footer-bio:hover .suite-2 i {
     -webkit-transition-duration: 1s;
     -moz-transition-duration: 1s;
     transition-duration: 1s;
     color: #fff;
     font-weight: 300;
}

/* TABLEAU LISTING */
 .tableau-listing {
     background: #fff;
     display: inline-block;
     margin: 0px auto;
}
 .tableau-listing ul {
     display: inline-block;
     margin-bottom: 0px;
}
 .tableau-listing .nav-tabs p {
     font-family: "IndieFlower";
     padding: 0px;
     margin: 0px;
     font-size: 22px;
     font-weight: 500;
}
 .tableau-listing .nav-tabs>li .fa {
     float: left;
     margin: -3px 10px auto auto;
     font-size: 35px;
}
 .tableau-listing .nav-tabs {
     display: inline-block;
     padding-top: 10px;
     padding-left: 30px;
     border-bottom: 2px solid #8C304C;
     width: 100%;
     text-align: center;
}
 .tableau-listing .nav-tabs>li {
     float: left;
     width: 300px;
     margin-left: 20px;
}
 .tableau-listing .nav-tabs>li>a {
     border: 1px solid #555;
     border-bottom-color: #8C304C;
     border-radius: 10px 10px 0 0;
     background-color: #CDDE07;
     color: #fff;
     -webkit-transition-duration: 0.3s;
     -moz-transition-duration: 0.3s;
     transition-duration: 0.3s;
     height: 49px;
}
 .tableau-listing .nav-tabs>li>a>p {
     color: #000;
}
 .tableau-listing .nav-tabs>li>a:hover {
     color: #CDDE07;
     border-color: #555;
     border-bottom-color: #8C304C;
     background-color: #fff;
     -webkit-transition-duration: 0.3s;
     -moz-transition-duration: 0.3s;
     transition-duration: 0.3s;
}
 .tableau-listing .nav-tabs>li.active>a, .tableau-listing .nav-tabs>li.active>a:hover, .tableau-listing .nav-tabs>li.active>a:focus {
     color: #555;
     background-color: #fff;
     border: 1px solid #8C304C;
     border-bottom-color: #fff;
     margin-bottom: -1px;
     height: 50px;
}
 .tableau-listing .nav-tabs>li.active>a>p>span, .tableau-listing .nav-tabs>li.active>a:hover>p>span, .tableau-listing .nav-tabs>li.active>a:focus>p>span {
     color: #fff;
}
 @media (max-width: 767px) {
     .tableau-listing .nav-tabs p {
         padding: 0px;
         margin: 5px auto 5px 20px;
         font-size: 22px;
         font-weight: 600;
    }
     .tableau-listing .nav-tabs>li .fa {
         margin: 0px 10px auto 0px;
         font-size: 40px;
    }
     .tableau-listing .nav-tabs {
         display: inline-block;
         width: 100%;
         padding: 10px 0 20px 0;
         text-align: center;
         background: #fff;
         border-bottom: 0px;
    }
     .tableau-listing .nav-tabs>li {
         width: 97%;
         display: inline-block;
         margin: auto 2% auto 1%;
    }
     .tableau-listing .nav-tabs>li>a {
         border: 0px solid #ddd;
         border-radius: 5px;
         background-color: #CDDE07;
         color: #fff;
         display: inline-block;
         width: 100%;
         padding-top: 5px;
         box-shadow: 5px 5px 8px 0px rgba(0, 0, 0, 0.3);
    }
     .tableau-listing .nav-tabs>li>a>p {
         color: #fff;
    }
     .tableau-listing .nav-tabs>li.active>a>p, .tableau-listing .nav-tabs>li:hover>a>p {
         color: #000;
    }
     .tableau-listing .nav-tabs>li>a:hover {
         color: #CDDE07;
         border: 0px solid #ddd;
         background-color: #fff;
    }
     .tableau-listing .nav-tabs>li.active>a, .tableau-listing .nav-tabs>li.active>a:hover, .tableau-listing .nav-tabs>li.active>a:focus {
         color: #555;
         background-color: #fff;
         border: 0px solid #ddd;
         box-shadow: 5px 5px 8px 0pxx rgba(0, 0, 0, 0.3);
         display: none;
    }
}
 @media (max-width: 480px) {
     .tableau-listing .nav-tabs {
         text-align: center;
         padding: 10px 0 10px 0;
         
    }
     .tableau-listing .nav-tabs>li {
         width: 97%;
         margin: auto 2% auto 1%;
    }
     .tableau-listing .nav-tabs>li>a {
         border: 1px solid #ddd;
         border-radius: 10px;
         height: auto;
    }
     .tableau-listing .nav-tabs>li.active>a, .tableau-listing .nav-tabs>li.active>a:hover, .tableau-listing .nav-tabs>li.active>a:focus {
         border: 1px solid #ddd;
         height: auto;
    }
     .tableau-listing .nav-tabs>li .fa {
         float: left;
         margin-bottom: 0px;
         padding: 0px;
         font-size: 35px;
    }
     .tableau-listing .nav-tabs p {
         padding: 0px;
         margin: 10px auto 0px auto;
         font-size: 18px;
         font-weight: 600;
         color: #fff;
         display: inline-block;
    }
}
/* COULEURS LISTING */
 .listing ul .alternance-1 li, .listing .alternance-1 li, .listing .alternance-1.no-hover li, .listing .alternance-1.no-hover:hover li {
     background: #FFFFF3;
     -webkit-transition-duration: 1s;
     -moz-transition-duration: 1s;
     transition-duration: 1s;
}
 .listing ul .alternance-2 li, .listing .alternance-2 li, .listing .alternance-2.no-hover li, .listing .alternance-2.no-hover:hover li {
     background: #FBFFFB;
     -webkit-transition-duration: 1s;
     -moz-transition-duration: 1s;
     transition-duration: 1s;
}
 .listing .alternance-1.no-hover li:hover .voir, .listing .alternance-2.no-hover li:hover .voir {
     display: none;
}
 .listing .alternance-1 li:hover, .listing .alternance-2 li:hover {
     background: #CDDE07;
     -webkit-transition-duration: 2s;
     -moz-transition-duration: 2s;
     transition-duration: 2s;
}
 .listing li:hover .voir {
     color: #fff;
     -webkit-transition-duration: 0.9s;
     -moz-transition-duration: 0.9s;
     transition-duration: 0.9s;
}
 .titre {
     color: #8C304C;
}
 .auteur, .resume, .sortie {
     color: #000;
}
 .casting, .infos {
     color: #555;
}
 .voir {
     font-size: 25px;
     color: #CDDE07;
     float: right;
     position: absolute;
     top: 10px;
     right: 10px;
     -webkit-transition-duration: 2s;
     -moz-transition-duration: 2s;
     transition-duration: 2s;
}
 .titre {
     font-family: "American typewriter", "Times New Roman", "Times", serif;
     font-size: 45px;
     letter-spacing: -1px;
     line-height: 40px;
     font-weight: 400;
     margin: 5px 0px 0px 0px;
}
 .titre h2 {
     font-family: "American typewriter", "Times New Roman", "Times", serif;
     font-size: 45px;
     letter-spacing: -1px;
     line-height: 40px;
     font-weight: 400;
     margin: 5px 0 0 0;
}
 .auteur {
     font-size: 20px;
     font-weight: 400;
     line-height: 20px;
}
 .auteur h3 {
     font-family: "Geneva", "Tahoma", sans-serif;
     font-size: 20px;
     font-weight: 400;
     line-height: 20px;
     margin: 0;
}
 .casting {
     font-size: 13px;
     font-weight: 300;
     line-height: 15px;
     margin: 5px 0px 0px 0px;
}
 .resume {
 	font-family: "Trebuchet MS", sans-serif;
     display: block;
     font-size: 15px;
     font-weight: 300;
     line-height: 17px;
     margin: 7px 0px 5px 0px;
}
 .sortie {
     display: none;
     font-size: 14px;
     font-weight: 400;
     text-align: right;
     margin: 5px 0px 0px 0px;
}
 .infos {
     font-size: 14px;
     font-weight: 400;
     line-height: 14px;
     font-style: italic;
     text-align: right;
     position: absolute;
     bottom: 10px;
     right: 10px;
}
.award {
	display: none;
}
/* listing */
 .listing {
     background: #fff;
     margin-bottom: 0px;
     padding-bottom: 50px;
}
 .listing.etroit {
     position: relative;
     background: #fff;
     margin-bottom: 0px;
     margin-top: 0px;
     padding: 20px 50px 50px 50px;
}
 .listing p {
     font-family: "BonVoyage";
     font-size: 40px;
     margin: 35px 0px 10px 0px;
     color: #000;
}
 .listing img {
     float: left;
     margin: 0px 25px 0px 0px;
     width: 170px;
     border-radius: 0%;
     box-shadow: 3px 3px 18px 0px rgba(0, 0, 0, 1);
}
 .listing.etroit.magie {
     position: relative;
     background: #fff;
     margin-bottom: 0px;
     margin-top: 0px;
     padding: 20px 150px 50px 150px;
}
 .listing.magie img {
     float: left;
     margin: 10px 25px 10px 10px;
     width: 130px;
     height: 170px;
     border-radius: 10%;
     box-shadow: 3px 5px 10px 0px rgba(0, 0, 0, 0.4);
}

 .listing.ecriture img {
     float: left;
     width: 150px;
     margin: 10px 25px 10px 10px;
     padding: 20px 20px 40px 35px;
     border-radius: 5px;
     background: url(../design/fonds/cahier.png);
     background-size: cover;
     box-shadow: 2px 5px 10px 0px #ccc;
}
 .hip-hop img {
     border: 0px solid;
     width: 22px;
     height: 22px;
     background: transparent;
     box-shadow: none;
}
 .listing ul {
     padding: 20px 50px 0px 50px;
}
 .listing span li {
     cursor: url('../design/icones-site/select.cur'), pointer;
}
 .listing ul li, .listing li {
     display: inline-block;
     list-style: none;
     -webkit-transition-duration: 3s;
     -moz-transition-duration: 3s;
     transition-duration: 3s;
     background: #fff;
     margin-bottom: 0px;
     padding-right: 20px;
     border-bottom: 0px dotted #ccc;
     width: 100%;
     font-family: "Geneva", "Tahoma", sans-serif;
     position: relative;
}
 @media (max-width: 991px) {
     .listing ul {
         padding: 20px 20px 0px 20px;
    }
     .listing ul li {
         padding: 0px 10px 0px 0px;
    }
     .listing img {
         margin: 0px 15px 0px 0px;
    }
}
 @media (max-width: 767px) {
     .listing {
         padding: 20px 0px 50px 0px;
    }
     .listing.etroit {
         padding: 20px 0px 50px 0px;
    }
     .listing.etroit.magie {
     padding: 20px 0px 50px 0px;
}
     .listing ul {
         padding: 0px 0px 0px 0px;
    }
     .listing ul li {
         padding: 0px 10px 0px 0px;
         position: relative;
    }
     .listing .alternance-1 li:hover, .listing .alternance-2 li:hover {
         background: #CDDE07;
         -webkit-transition-delay: 0.3s;
         -moz-transition-delay: 0.3s;
         -ms-transition-delay: 0.3s;
         -o-transition-delay: 0.3s;
         transition-delay: 0.3s;
         -webkit-transition-duration: 2s;
         -moz-transition-duration: 2s;
         transition-duration: 2s;
    }
     .listing p {
         font-size: 35px;
         margin: 35px 0px 10px 5px;
    }
     .listing img {
         margin: 0px 15px 0px 0px;
    }
     .listing .voir {
         font-size: 25px;
         top: 10px;
         right: 10px;
    }
     .listing .titre {
         font-size: 35px;
         line-height: 30px;
         margin: 10px 0px 0px 0px;
    }
     .listing .titre h2 {
         font-size: 35px;
         line-height: 30px;
         margin: 10px 0px 0px 0px;
    }
     .listing .auteur {
         font-size: 18px;
         line-height: 20px;
         margin: 0px 0px 5px 0px;
    }
     .listing .auteur h3 {
         font-size: 18px;
         line-height: 20px;
         margin: 0px 0px 5px 0px;
    }
     .listing .resume {
         text-align: justify;
    }
     .listing .sortie {
         display: none;
    }
     .listing .infos {
         font-size: 12px;
         font-weight: 400;
         margin: 10px 0 0 0;
         position: absolute;
         bottom: 5px;
         right: 10px;
    }
}
 @media (max-width: 480px) {
     .listing ul li {
         padding: 0 5px 0 0;
    }
     .listing, .listing.etroit {
         padding: 0px 0px 30px 0px;
    }
     .listing p {
         font-size: 30px;
         margin: 35px 0px 10px 5px;
    }
     .listing.etroit>p {
         font-size: 26px;
         margin: 35px 10px 10px 5px;
    }
     .listing img {
         width: 80px;
         margin: 0px 10px 0px 3px;
    }

 .listing.magie img {
    margin: 8px 15px 8px 5px;
     width: 100px;
     height: 130px;
     border-radius: 10%;
     box-shadow: 3px 3px 18px 0px rgba(0, 0, 0, 1);
}

 .listing.ecriture img {
     width: 90px;
         margin: 5px 10px 5px 0px;
     padding: 10px 10px 25px 20px;
     border-radius: 5px;
     background: url(../design/fonds/cahier.png);
     background-size: cover;
     box-shadow: 2px 5px 10px 0px #ccc;
}
     .hip-hop img {
         position: absolute;
         top: 50px;
         right: 10px;
         width: 22px;
         height: 22px;
    }
     .listing .voir {
         font-size: 15px;
         position: absolute;
         top: 5px;
         right: 5px;
    }
     .listing .titre {
         font-size: 25px;
         line-height: 18px;
         font-weight: 400;
         margin-top: 5px;
    }
     .listing .titre h2 {
         font-size: 25px;
         line-height: 18px;
         font-weight: 400;
         margin-top: 5px;
    }
     .listing .titre.bing {
         font-size: 24px;
         line-height: 18px;
         font-weight: 400;
         margin-top: 5px;
    }
     .listing .auteur {
         font-size: 15px;
         line-height: 13px;
         font-weight: 400;
         margin-top: 2px;
    }
     .listing .casting {
         font-size: 12px;
         line-height: 12px;
         font-weight: 400;
         margin-top: -4px;
    }
     .listing .resume {
         display: none;
         text-align: left;
    }
     .listing .resume.extra {
         display: block;
         font-size: 12px;
         line-height: 12px;
         margin: 0px 0px 5px 0px;
    }
    .listing .resume.extra-2 {
         display: block;
         font-size: 12px;
         line-height: 12px;
         margin: 10px 0px 5px 0px;
    }
    .listing .resume.extra-3 {
         display: block;
         font-size: 12px;
         line-height: 12px;
         margin: 3px 0px 3px 0px;
    }
     .listing .infos {
         font-size: 11px;
         margin: 5px 0 0 0;
         position: absolute;
         bottom: 2px;
         right: 5px;
    }
}
/* LISTING-AFFICHES */
 .listing-affiches {
     position: relative;
     height: auto;
     width: 100%;
     padding: 20px 20px 40px 20px;
     margin-bottom: 0px;
     background: #fff;
     text-align: center;
     font-size: 0px;
}
 @media (max-width: 480px) {
     .listing-affiches {
         padding: 20px 20px 40px 20px;
         background: #fff url('../design/fonds/bg.gif');
    }
}
 .affiche {
     overflow: hidden;
     text-align: center;
     position: relative;
     display: inline-block;
     height: 300px;
     width: 225px;
     margin-right: -1px;
}
 .affiche img {
     position: absolute;
    /* important */
     top: 0px;
     left: 0px;
     height: 300px;
     width: 225px;
     border: 0px;
}
 .affiche .over-affiche {
     font-family: "Helvetica";
     font-weight: 200;
     background-color: #fff;
     position: absolute;
    /* important */
     top: 0px;
     left: 0px;
     z-index: 100;
     -webkit-transition: all 0.5s ease-in;
     -moz-transition: all 0.5s ease-in;
     -o-transition: all 0.5s ease-in;
     -ms-transition: all 0.5s ease-in;
     transition: all 0.5s ease-in;
     opacity: 0;
     width: 225px;
     height: 300px;
     margin-left: -225px;
     padding: 5px;
}
 .affiche:hover .over-affiche {
     opacity: 0.95;
     position: absolute;
    /* important */
     top: 0px;
     left: 0px;
     -webkit-transition: all 0.9 ease-in;
     -moz-transition: all 0.9 ease-in;
     -o-transition: all 0.9 ease-in;
     -ms-transition: all 0.9 ease-in;
     transition: all 0.9 ease-in;
     transform: translateX(225px);
     -webkit-transform: translateX(225px);
     width: 225px;
     height: 300px;
     padding: 5px;
}
 .voir-affiche {
     position: absolute;
     top: 7px;
     right: 7px;
     background: none;
     font-size: 20px;
     color: #CDDE07;
     -webkit-transition-duration: 1s;
     -moz-transition-duration: 1s;
     transition-duration: 1s;
}
 .titre-affiche {
     font-family: "American Typewriter", "Times New Roman", "Times", serif;
     letter-spacing: -1px;
     font-size: 25px;
     line-height: 23px;
     font-weight: 400;
     padding-top: 10px;
     color: #8C304C;
}
 .auteur-affiche {
     font-size: 17px;
     line-height: 18px;
     color: #2E2E2E;
     padding-top: 0px;
}
 .resume-affiche {
 	font-family: "Trebuchet MS";
     display: block;
     font-size: 15px;
     line-height: 14px;
     font-weight: 300;
     color: #000;
     padding: 10px 3px 0px 3px;
     text-align: justify;
     letter-spacing: 0px;
}
 .casting-affiche {
     font-size: 14px;
     line-height: 14px;
     color: #444;
     padding-top: 10px;
}
 .infos-affiche {
     font-size: 14px;
     font-weight: 200;
     color: #5E5E5E;
     position: absolute;
     bottom: 5px;
     right: 10px;
     font-style: italic;
}
/* INFOS-SLIDE*/
 .infos-slide {
     background: #000;
     color: #fff;
     padding-top: 20px;
     padding-bottom: 20px;
     line-height: 25px;
     height: auto;
}
 .resume-slide {
     margin: 10px 20px 40px 20px;
     text-align: left;
}
 .resume-slide h2 {
     font-family: "American Typewriter", "Times New Roman", "Times", serif;
     font-size: 40px;
     font-weight: 500;
     line-height: 35px;
     margin: 0px auto 0px 0px;
     text-align: left;
}
 .resume-slide h3 {
     font-family: "American Typewriter", "Times New Roman", "Times", serif;
     font-size: 25px;
     font-weight: 500;
     line-height: 25px;
     margin: 5px auto -5px 0px;
     text-align: left;
}
 .resume-slide p {
     font-family: "JMHTypewriter";
     color: #fff;
     font-size: 16px;
     line-height: 20px;
}
 .resume-slide .centrage img {
     float: right;
     margin: 0px 0px 10px 20px;
     width: 200px;
     border-radius: 2px;
}
 .resume-slide img {
     float: right;
     margin: 0px 0px 10px 20px;
     width: 150px;
     border-radius: 2px;
}
 .generique-slide {
     text-align: left;
     margin: 20px 20px;
     min-height: 150px;
     color: #fff;
}
 .generique-slide p {
     font-family: "JMHTypewriter";
     color: #fff;
     font-size: 16px;
     line-height: 22px;
     margin: 5px auto;
}
 .generique-slide b {
     font-size: 16px;
     font-weight: 600;
}
 .generique-slide span p {
     font-family: "BonVoyage";
     text-align: left;
     margin: 15px auto 10px 0px;
     color: #fff;
     font-size: 25px;
}
 .generique-slide b3 {
     font-size: 18px;
     line-height: 50px;
}
 .argument-slide {
     text-align: left;
     margin: 10px 30px;
}
 .argument-slide span p {
     font-family: "BonVoyage";
     text-align: left;
     margin: 0px auto 15px 0px;
     color: #fff;
     font-size: 25px;
}
 .argument-slide p {
     font-family: "JMHTypewriter";
     color: #fff;
     font-size: 16px;
     line-height: 22px;
     margin: 10px auto;
}
 .photos-slide {
     display: inline-block;
     background: #000;
     margin: 10px 0px;
}
 .photos-slide img {
     width: 100%;
     padding: 0px 40px;
     margin: 5px auto 10px auto;
}
 .photos-slide p {
     font-family: "JMHTypewriter";
     color: #fff;
     font-size: 14px;
     line-height: 14px;
     margin: 0px 25px;
}
 .slideopus .videos {
     width: 100%;
     display: inline-block;
     margin: 10px auto;
     background: #000;
     padding: 10px 50px;
}
 .videos-pub {
     width: 100%;
     display: inline-block;
     margin: 0;
     background: #030321;
     padding: 20px;
     -webkit-border-radius: 10px;
     -moz-border-radius: 10px;
     -ms-border-radius: 10px;
     -o-border-radius: 10px;
     border-radius: 10px;
     outline: 0;
     -webkit-box-shadow: 20px 10px 9px rgba(0, 0, 0, .5);
     box-shadow: 20px 10px 9px rgba(0, 0, 0, .5);
}
 @media (max-width: 991px) {
     .infos-slide {
         padding-top: 20px;
    }
     .generique-slide {
         min-height: 0px;
    }
     .argument-slide {
         margin: 10px 20px;
    }
     .resume-slide .centrage img {
         margin: 20px 0px 10px 20px;
    }
     .photos-slide img {
         padding: 0px 0px;
    }
     .slideopus .videos {
         padding: 10px 20px;
    }
}
 @media (max-width: 900px) {
     .centrage {
         text-align: center;
    }
     .resume-slide .centrage img {
         float: none;
         margin: 0px auto 20px auto;
    }
     .resume-slide img {
         float: right;
         margin: 0px 0px 10px 20px;
         width: 100px;
         border-radius: 0px;
    }
     .generique-slide, .generique-slide span p {
         text-align: center;
    }
}
/* MODIFICATIONS SMARTPHONE SLIDE*/
 @media (max-width: 480px) {
     .resume-slide {
         margin: 5px 20px 30px 20px;
    }
     .resume-slide p, .generique-slide p, .argument-slide p {
         font-family: "JMHTypewriter";
         font-size: 18px;
         line-height: 20px;
    }
     .generique-slide b {
         font-size: 19px;
         font-weight: 800;
    }
     .photos-slide p {
         font-family: "JMHTypewriter";
         font-size: 13px;
         line-height: 13px;
    }
     .generique-slide b3 {
         font-size: 18px;
         line-height: 10px;
    }

     .infos-slide {
         padding-top: 0px;
         padding-bottom: 0px;
    }
     .resume-slide h2 {
         font-size: 35px;
    }
     .argument-slide span p {
         text-align: left;
         margin: 15px auto 15px 0px;
         color: #fff;
         font-size: 25px;
    }
        /* FIN MODIFICATIONS SMARTPHONE SLIDE*/
     .resume-slide .centrage img {
         width: 95%;
         border-radius: 0px;
    }
     .resume-slide img {
         float: right;
         margin: 0px 0px 10px 10px;
         width: 100px;
         border-radius: 0px;
    }
     .slideopus .videos {
         padding: 10px 0px;
    }
}
 .jukebox-slide {
     width: 100%;
     display: inline-block;
     margin: -10px auto 10px auto;
}
 .jukebox-slide a span {
     font-family: "IndieFlower";
     font-size: 14px;
     font-weight: 200;
     color: #fff;
     border: 2px solid #CDDE07;
     background: #000;
     padding: 5px 10px;
     border-radius: 15px;
     display: block;
     width: 80%;
     margin: 5px 10%;
}
 .jukebox-slide a span:hover {
     color: #000;
     background: #CDDE07;
     border: 2px solid #CDDE07;
}
 @media (max-width: 480px) {
     .jukebox-slide a span {
         margin: 0px 10% 15px 10%;
    }
}
/* FICHE FILM - PRESENTATION */
/* RESUME-FILM */
 .resume-film {
     position: relative;
     display: block;
     width: 100%;
     margin: 0px;
     padding: 30px 40px 10px 40px;
     background: #fff;
     color: #000;
     text-align: left;
}
 .resume-film h1 {
     font-family: "American Typewriter";
     font-size: 80px;
     line-height: 60px;
     margin: 0px auto 5px 0px;
}
 .resume-film h2 {
     font-family: "American Typewriter";
     font-size: 28px;
     line-height: 25px;
     margin: 0px auto 20px 0px;
}
 .resume-film p {
     line-height: 21px;
     margin: 0px auto 10px 0px;
}
 .resume-film .centrage img {
     float: right;
     margin: 0px 0px 10px 20px;
     width: 300px;
     border-radius: 5px;
     box-shadow: 5px 3px 10px 0px rgba(0, 0, 0, 0.3);
}
 .prix {
     display: block;
     margin: 20px auto 0px auto;
}
 .prix p {
     font-family: "American Typewriter";
     font-size: 17px;
     line-height: 20px;
     color: #927C38;
     font-weight: 400;
     text-align: left;
     margin: 8px auto;
}
 .prix img {
     width: 250px;
     margin-top: -15px;
}

 @media (max-width: 991px) {
     .resume-film h1 {
         font-size: 60px;
         line-height: 50px;
         margin: 0px auto 5px 0px;
    }
}
 @media (max-width: 767px) {
     .centrage {
         text-align: center;
    }
     .resume-film .centrage img {
         float: none;
         margin: 0px auto 20px auto;
    }
     .resume-film {
         padding: 20px 20px 20px 20px;
         background: #fff;
         color: #000;
    }
}
 @media (max-width: 480px) {
     .resume-film {
         padding: 10px 10px 10px 10px;
         background: #000;
         color: #fff;
    }
     .resume-film .centrage {
         margin: auto -10px;
    }
     .resume-film .centrage img {
         width: 95%;
         border-radius: 0px;
         padding-top:30px;
    }
     .resume-film h1 {
         font-size: 40px;
         line-height: 30px;
         margin: 0px auto 5px 0px;
    }
     .resume-film h2 {
         font-size: 20px;
    }
     .resume-film .prix p {
         color: #F9E192;
    }
     .prix img {
     width: 60%;
     margin-top: -15px;
}
}
 .resume-film .etat {
     display: block;
     font-family: "Trebuchet MS";
     font-size: 15px;
     text-align: left;
     color: #1B75DF;
     font-weight: 400;
     margin-top: 20px;
}
 .listing .etat {
     display: block;
     font-family: "Trebuchet MS";
     font-size: 14px;
     line-height: 13px;
     text-align: left;
     color: #1B75DF;
     font-weight: 500;
     margin-top: 10px;
}
 .affiche .etat {
     display: block;
     font-family: "Trebuchet MS";
     font-size: 14px;
     text-align: left;
     color: #1B75DF;
     font-weight: 500;
     margin: 15px auto auto 5px;
}
 .news .etat p {
     display: block;
     font-family: "Trebuchet MS";
     min-width: 0px;
     font-size: 14px;
     line-height:16px;
     text-align: right;
     color: #1B75DF;
     font-weight: 500;
     margin: 5px auto auto auto;
     font-style: italic;
}
 .news .etat img {
     display: block;
	width: 50%;
	box-shadow: none;
	margin-top:-15px;
	
}

 @media (max-width: 991px) {
     .news .etat img {
	width: 25%;
	margin-top:-15px;
	}
}
 @media (max-width: 767px) {
     .news .etat img {
	width: 150px;
	margin-top:-15px;
	}
}
/* MODIFICATIONS SMARTPHONE ETAT*/
 @media (max-width: 480px) {
     .resume-film .etat {
         color: #5CCBE4;
         text-align: right;
         font-size: 16px;
    }
     .listing .etat {
         font-size: 12px;
         font-weight: 400;
         margin-top: 2px;
    }
     .news .etat p{
         font-size: 15px;
         text-align: right;
         font-style: italic;
    }
         .news .etat img {
	width: 150px;
	margin-top:-15px;
	}
}
/* FIN MODIFICATIONS SMARTPHONE ETAT*/

/* GENERIQUE-FILM #27060E*/
 .generique-film {
     width: 100%;
     padding: 10px 40px 10px 40px;
     background: #fff;
     color: #000;
     text-align: left;
     margin-bottom: 0px;
     margin-top: -20px;
}
 .generique-film span p {
     font-family: "BonVoyage";
     font-size: 30px;
     line-height: 25px;
     font-weight: 500;
     margin: 30px auto 20px 0px;
}
 .generique-film p {
     line-height: 22px;
     margin: 0px auto 15px 0px;
}
 .generique-film b {
     font-weight: 600;
}
 .generique-film b2 {
     font-size: 16px;
     display: block;
     margin: 15px auto 0px auto;
     font-weight: 300;
}
 .generique-film b2 span {
     font-size: 16px;
     font-weight: 300;
}
 @media (max-width: 767px) {
     .generique-film {
         padding: 20px 20px 20px 20px;
         background: #fff;
         color: #000;
         text-align: center;
    }
}
 @media (max-width: 480px) {
     .generique-film {
         padding: 5px 5px 10px 5px;
         background: #000;
         color: #fff;
         border-bottom: 0px solid #4E1215;
    }
     .generique-film b {
         font-weight: 600;
         font-size: 18px;
    }
}
/* CONTAINER COMMUNICATION */
 .container-communication {
     width: 100%;
     display: inline-block;
     padding: 20px 10px 10px 10px;
     background: #fff;
     text-align: center;
     border-radius: 0;
     margin: 0;
     border-top: 1px solid #4E1215;
}
 @media (max-width: 480px) {
     .container-communication {
         padding: 0;
    }
}
/* VIDEOS */
 .videos {
     width: 80%;
     display: inline-block;
     padding: 0;
     text-align: center;
     border-radius: 5px;
     background: #000;
}
 .jukebox {
     width: 100%;
     margin-bottom: -10px;
     display: inline-block;
     color: #fff;
}
 .jukebox ul {
     width: 100%;
}
 .jukebox ul a li {
     font-family: "IndieFlower";
     font-size: 14px;
     font-weight: 200;
     color: #fff;
     background: #000;
     width: auto;
     padding: 5px 10px;
     border-radius: 15px 0 0 15px;
     border: 2px solid #CDDE07;
     margin: 5px 5px 8px 5px;
     text-align: center;
}
 .jukebox ul a li:hover {
     color: #000;
     background: #CDDE07;
     border: 2px solid #CDDE07;
}
 @media (max-width: 767px) {
     .videos {
         width: 100%;
         border-radius: 5px;
         margin: 0px;
         padding: 20px 60px;
         background: #000;
    }
     .jukebox {
         text-align: center;
         margin-bottom: 0px;
    }
     .jukebox ul a li {
         display: inline-block;
         width: auto;
         font-family: "IndieFlower";
         font-size: 14px;
         font-weight: 200;
         color: #fff;
         background: #000;
         padding: 5px 10px;
         border-radius: 15px;
         margin: 5px 5px 8px 5px;
    }
}
 @media (max-width: 480px) {
     .videos {
         padding: 20px 0;
         border-radius: 0;
         margin-bottom: -10px;
    }
     .jukebox {
         background: #000;
    }
}
/* CRITIQUES */
 .critiques {
     padding: 20px 0 0 0;
     width: 100%;
     display: inline-block;
}
 .critiques.padding {
     margin: 250px 0px;
}
 .critiques h1 {
     font-size: 40px;
     margin: 0px auto 10px 20px;
}
 .critiques ul {
     width: 100%;
     padding: 0;
}
 .critiques ul li {
     position: relative;
     list-style: none;
     display: inline-block;
     width: 49%;
     min-height: 60px;
     padding: 0px 20px 0px 20px;
     margin: 10px 0px 5px 0px;
     border-radius: 5px;
     text-align: left;
     color: #000;
}
 .critiques ul li.large {
     position: relative;
     list-style: none;
     display: inline-block;
     width: 98%;
     min-height: 60px;
     padding: 20px 20px 0px 20px;
     margin: 0px 0px 5px 0px;
     border-radius: 5px;
     text-align: left;
     color: #000;
}
 .critiques ul li img {
     float: left;
     margin: 0px 15px 5px 0px;
     width: 40px;
     height: 40px;
     box-shadow: 5px 3px 10px 0px rgba(0, 0, 0, 0.3);
     border-radius: 50%;
}
 .critiques ul li p {
     font-family: "Courier", "Tahoma", sans-serif;
     font-size: 15px;
     font-weight: 200;
     line-height: 14px;
     margin: 0px auto 10px auto;
}
 .critiques ul li span {
     float: right;
     margin-top: -7px;
     font-size: 14px;
     font-weight: 300;
     color: #111;
}
 @media (max-width: 767px) {
     .critiques {
         padding: 0;
    }
     .critiques ul {
         padding: 10px 20px;
    }
     .critiques ul li, .critiques ul li.large {
         width: 100%;
         padding: 0;
    }
     .critiques ul li img {
         margin: 0 15px 0 0;
    }
}
 @media (max-width: 480px) {
     .critiques {
         background: #fff;
         padding: 0px 5px 0px 5px;
    }
     .critiques ul {
         padding: 10px 0px 1px 0px;
         border-top: 1px solid #CAE9F7;
    }
     .critiques ul li, .critiques ul li.large {
         padding: 0px 2px 0px 2px;
         border-radius: 0px;
         border-bottom: 1px solid #CAE9F7;
    }
     .critiques ul li img {
         margin: 0px 15px 5px 0px;
         width: 40px;
         height: 40px;
         border-radius: 50%;
    }
}
/* GALERIE-PHOTOS */
 .container-70-100 {
     display: inline-block;
     float: left;
     padding: 0px;
     margin-top: 0px;
     width: 70%;
     height: auto;
}
 .galerie-photos {
     display: inline-block;
     float: left;
     position: relative;
     padding: 30px 60px 0px 60px;
     margin: 0px;
     text-align: center;
     width: 100%;
     height: auto;
     cursor: url('../design/icones-site/select.cur'), pointer;
}
 .copyright-photos {
     display: inline-block;
     position: abolute;
     bottom: 20px;
     left: 20px;
     color: #fff;
     font-size: 14px;
     font-weight: 300;
}
 .galerie-photos a {
     color: #000;
     -webkit-transition-duration: 0.5s;
     -moz-transition-duration: 0.5s;
     transition-duration: 0.5s;
}
 .galerie-photos:hover a {
     color: #CDDE07;
     -webkit-transition-duration: 0.5s;
     -moz-transition-duration: 0.5s;
     transition-duration: 0.5s;
}
 .galerie-photos .plus i {
     font-size: 45px;
     margin-left: 20px;
}
 .galerie-photos .plus {
     display: inline-block;
     font-size: 20px;
}
 .galerie-photos span img {
     display: inline-block;
     height: 150px;
     width: auto;
     margin: 0px 15px 20px auto;
     border-radius: 5px;
     -ms-transform: rotate(-2deg);
     -webkit-transform: rotate(-2deg);
     transform: rotate(-2deg);
}
 .galerie-photos.suspects span img {
     display: inline-block;
     width: 33%;
     height: auto;
     margin-bottom: 20px;
     border-radius: 5px;
     -ms-transform: rotate(-2deg);
     -webkit-transform: rotate(-2deg);
     transform: rotate(-2deg);
}
 .galerie-photos.droite span img {
     display: inline-block;
     height: auto;
     width: 80%;
     margin: 25px auto 20px auto;
     border-radius: 5px;
     -ms-transform: rotate(-2deg);
     -webkit-transform: rotate(-2deg);
     transform: rotate(-2deg);
}
 @media (max-width: 767px) {
     .container-70-100 {
         width: 100%;
    }
     .galerie-photos {
         width: 100%;
         margin-top: -20px;
    }
     .galerie-photos.droite span img {
         margin: 0px auto 20px auto;
    }
}
 @media (max-width: 480px) {
     .galerie-photos {
         padding: 0;
         margin-top: 0px;
         background:#000;
    }
     .galerie-photos span img {
         width: 100%;
         height: auto;
         border-radius: 0px;
         -ms-transform: none;
         -webkit-transform: none;
         transform: none;
    }
     .galerie-photos.droite span img {
         height: auto;
         width: 100%;
         margin: -20px auto 20px auto;
         border-radius: 0px;
         -ms-transform: none;
         -webkit-transform: none;
         transform: none;
    }
     .galerie-photos i {
         font-size: 45px;
         margin: 10px auto 5px auto;
    }
     .galerie-photos a {
         color: #fff;
    }
}
/* DOSSIER DE PRESSE*/
 .dossier-de-presse {
     display: inline-block;
     width: 100%;
     text-align: center;
     padding: 0;
     margin-top: 25px;
     margin-bottom: 0px;
     border-top: 0px solid #4E1215;
     background: #fff;
}
 .dossier-de-presse li {
     display: inline-block;
     list-style: none;
     width: auto;
     font-family: "IndieFlower";
     font-size: 14px;
     font-weight: 600;
     color: #fff;
     background: #000;
     padding: 4px 20px;
     margin-right: 0;
     border-radius: 30px 30px 30px 30px;
     border: 2px solid #CDDE07;
     -webkit-transition-duration: 0.5s;
     -moz-transition-duration: 0.5s;
     transition-duration: 0.5s;
}
 .dossier-de-presse li:hover {
     color: #000;
     background: #CDDE07;
     border: 2px solid #CDDE07;
     -webkit-transition-duration: 0.5s;
     -moz-transition-duration: 0.5s;
     transition-duration: 0.5s;
}
 .dossier-de-presse li i {
     font-size: 20px;
     margin-right: 10px;
     text-shadow: 0px 0px 0px #ddd;
}
 @media (max-width: 480px) {
     .dossier-de-presse {
         text-align: center;
         padding-top: 0px;
         margin-top: 0px;
         margin-bottom: -12px;
         background: #000;
         height:30px;
    }
     .dossier-de-presse:hover {
         background: #;
    }
     .dossier-de-presse li {
     	 display: none;
         width: 0;
         height: 0;
         margin-left: -10%;
         margin-right: 5%;
         margin-bottom: 10px;
         padding-bottom: 0;
         border-radius: 30px;
         border: 1px solid #CDDE07;
         background: none;
         color: #fff;
         font-size: 14px;
    }
     .dossier-de-presse li:hover {
         color: #000;
         background: CDDE07;
         border: 1px solid #CDDE07;
    }
     .dossier-de-presse li i {
         font-size: 40px;
         margin-right: 20px;
         text-shadow: 0px 0px 0px #ddd;
    }
}

/* PAGE EXTERIEURE*/
 .page-exterieure {
 	position: relative;
     display: inline-block;
     width: 100%;
     text-align: left;
     padding: 	20px 20px 10px 20px;
     margin : 0px 0 0px 0;
     background: #086091;
     color: #fff;
     -webkit-transition-duration: 3s;
     -moz-transition-duration: 3s;
     transition-duration: 3s;
      cursor: url('../design/icones-site/select.cur'), pointer;

}
 .page-exterieure a {
     color: #fff;
}
 .page-exterieure a:hover  {    
 	color: #CDDE07;
     -webkit-transition-duration: 3s;
     -moz-transition-duration:  3s;
     transition-duration: 3s;
 }
 .page-exterieure img {
	position: absolute;
	top:-20px;
	left: 20px;
     width: 90px;
     box-shadow: 5px 3px 10px 0px rgba(0, 0, 0, 0.3);
     border-radius: 45%;
}
 .page-exterieure p {
     margin: 0px auto 15px 120px;
}


 @media (max-width: 767px) {
 	 .page-exterieure {
     padding: 	0px 0px;
     margin : 0px 0 0px 0;
}
 .page-exterieure img {
 	position: relative;
 	float: left;
 	top:10px;
 	left: 10px;
     margin: 0 25px 0 10px;
     width: 70px;
     box-shadow: 5px 3px 10px 0px rgba(0, 0, 0, 0.3);
     border-radius: 50%;
}
 .page-exterieure a, .page-exterieure a:hover {    
 	color: #fff;
 }
 .page-exterieure p {
     margin: 0px auto auto auto;
     padding: 20px;
     background: #086091;
     text-align: center;
     border-top: 1px dotted #fff;
}
 .page-exterieure p:hover  {    
 	background: #CDDE07;
     -webkit-transition-duration: 3s;
     -moz-transition-duration:  3s;
     transition-duration: 3s;
 }
}

 @media (max-width: 480px) {


}

/* REZO-SOCIO */
 .rezo-socio {
     display: inline-block;
     padding: 15px 40px 0px 40px;
     background: #B1B9CB;
     width: 100%;
     margin-top: -10px;
     border-top: 1px solid #7E8289;
     text-align: center;
     color: #1B3061;
          -webkit-transition-duration: 2s;
     -moz-transition-duration:  2s;
     transition-duration: 2s;
}
 .rezo-socio:hover  {    
 	background: #CDDE07;
     -webkit-transition-duration: 2s;
     -moz-transition-duration:  2s;
     transition-duration: 2s;
 }

 .rezo-socio img {
     width: 70px;
     margin-bottom: 12px;
}
 @media (max-width: 480px) {
 .rezo-socio {
     margin-bottom:-10px;
     padding: 15px 40px 10px 40px;
}

}


/* REALISATION */
 .realisation {
     display: inline-block;
     padding: 25px 40px 25px 40px;
     background: #fff;
     width: 100%;
     margin-top: 0px;
     border-top: 1px solid #4E1215;
}
 .realisation.regul {
     margin-top: -8px;
}
 .realisation h1 {
     font-size: 40px;
     margin: 0px auto 10px 0px;
}
 .realisation p {
     line-height: 21px;
     margin-bottom: 15px;
}
 .realisation span p {
     line-height: 22px;
     margin: 0 auto 15px auto;
     font-style: italic;
}
 .realisation span p b, .realisation b {
     font-weight:600;
}
 .realisation img {
     width: 120px;
     float: left;
     margin: 0px 15px 10px 0px;
     border-radius: 2%;
     box-shadow: 5px 20px 18px -5px rgba(0, 0, 0, 0.9);
}
 .realisation span img {
     width: 180px;
     float: left;
     margin: 0px 15px 10px 0px;
     border-radius: 2%;
     box-shadow: 5px 20px 18px -5px rgba(0, 0, 0, 0.9);
}
 @media (max-width: 767px) {
     .realisation {
         padding: 30px 20px 10px 20px;
    }
     .realisation.regul {
         margin-top: 0px;
    }
}
 @media (max-width: 480px) {
     .realisation {
         margin-top: 5px;
         padding: 20px 20px 10px 20px;
    }
     .realisation p {
         line-height: 20px;
         margin-bottom: 15px;
    }
     .realisation span p {
         line-height: 20px;
         margin: 0 auto 15px auto;
         font-style: italic	;
    }
     .realisation span p b, .realisation p b {
         font-weight:400;
    }
}
/* AUTRES-FILM #35424D */
 .autres-films {
     display: inline-block;
     width: 100%;
     padding: 0px 30px 30px 30px;
     margin-top: 0px;
     text-align: left;
     background: #fff;
     border-top: 1px solid #4E1215;
}
 .autres-films img {
     display: inline-block;
     height: 200px;
     width: 150px;
     margin-right: 5px;
     margin-bottom: 5px;
     border-radius: 2px;
     box-shadow: 5px 10px 18px -5px rgba(0, 0, 0, 0.9);
}
 .autres-films p {
     font-family: "BonVoyage";
     text-align: left;
     margin: 15px auto;
     font-size: 30px;
     color: #000;
}
 @media (max-width: 767px) {
     .autres-films img {
         width: 30%;
         height: auto;
    }
}
 @media (max-width: 480px) {
     .autres-films {
         padding: 5px 0px 5px 0px;
         background: #000 url(../design/fonds/autres-films.jpg) no-repeat;
         background-position: 80% 80%;
    }
     .autres-films p {
         text-align: left;
         margin: 15px 20px 15px 10px;
         font-size: 28px;
         line-height: 25px;
         color:#fff;
    }
     .autres-films img {
         width: 49%;
         height: auto;
         margin: 0px;
         border-radius: 0px;
         box-shadow: none;
    }
}
 @media (max-width: 360px) {
     .autres-films {
         padding: 5px 0px 5px 0px;
         background: #000 url(../design/fonds/autres-films.jpg) no-repeat;
         background-position: 88% 90%;
    }
     .autres-films img {
         width: 48%;
         height: auto;
    }
}
 @media (max-width: 320px) {
     .autres-films {
         padding: 5px 0px 5px 0px;
         background: #000 url(../design/fonds/autres-films.jpg) ;
         background-size: cover;
    }
     .autres-films img {
         width: 48%;
         height: auto;
    }
}
    
/* RECHERCHER */
 .rechercher {
     width: 100%;
     margin: 10px 0 0px 0;
}
 .rechercher.erreur {
     width: 100%;
     margin: 15px 0 15px 0;
}
 .rechercher h1 {
     font-size: 25px;
     line-height: 22px;
     margin: 0px auto 20px 0px;
}
.rechercher.nouveau {
     background: #fff;
     width: 100%;
     padding: 20px 50px;
     margin-top: -10px;
}
 @media (max-width: 480px) {
     .rechercher.nouveau {
     background: #fff;
     width: 95%;
     margin: -10px 5% auto 0%;
     padding: 20px 20px;
	}
	     .rechercher h1 {
         font-size: 23px;
         line-height: 25px;
         margin: 0px auto 10px 0px;
    }
}

 .rechercher .form-control {
     display: block;
     width: 100%;
     height: 34px;
     padding: 6px 12px 6px 12px;
     font-size: 15px;
     text-align: center;
     color: #000;
     background-color: #fff;
     border: 1px solid #eee;
     border-radius: 50px;
     font-family: "Courier", "Helvetica", "Arial", sans-serif;
}
 .rechercher .input-group-btn .btn {
     background: #171B4C;
     height: 34px;
     padding-top: 3px;
     border-radius: 0 50px 50px 0;
     margin-left: 0px;
     -webkit-transition-duration: 2s;
     -moz-transition-duration: 2s;
     transition-duration: 2s;
}
 .rechercher .input-group-btn .btn:hover {
     background: #CDDF08;
     -webkit-transition-duration: 2s;
     -moz-transition-duration: 2s;
     transition-duration: 2s;
     cursor: url('../design/icones-site/select.cur'), pointer;
}
 .rechercher .input-group-btn .btn i {
     font-size: 26px;
     color: #fff;
     -webkit-transition-duration: 2s;
     -moz-transition-duration: 2s;
     transition-duration: 2s;
}
 .rechercher .input-group-btn .btn:hover i {
     color: #000;
     -webkit-transition-duration: 2s;
     -moz-transition-duration: 2s;
     transition-duration: 2s;
}


/* RESULTATS */
 .resultats {
     padding: 40px 50px;
     width: 100%;
     background: #fff;
     color: #111;
}
 .resultats h1 {
     display: inline-block;
     font-family: "BonVoyage";
     font-size: 45px;
     line-height: 40px;
     margin: 0px auto 30px 0px;
}

 .resultats b2 {
     display: inline-block;
     font-size: 45px;
     color: #FF8404;
     font-style: italic;
}
 .resultats p {
     font-size: 16px;
     line-height: 19px;
     margin-bottom: 20px;
}
 .resultats a {
     font-family: "American Typewriter";
     font-size: 24px;
     font-weight: 500;
     color: #2C0249;
}

 .resultats a:hover {
     color: #627C00;
}
 .resultats b3 {
     font-size: 16px;
     color: #FF8404;
     font-weight: 100px;
}
 .resultats span {
     font-size: 15px;
     color: #787C67;
}
 @media (max-width: 767px) {
     .resultats {
         padding: 50px;
    }
}
 @media (max-width: 480px) {
     .resultats {
         padding: 20px 15px;
         width: 100%;
    }

    /* MODIFICATIONS SMARTPHONE RESULTATS*/
     .resultats h1 {
         font-family: "BonVoyage";
         font-size: 30px;
         line-height: 25px;
    }
     .resultats b2 {
         font-size: 30px;
    }
     .resultats a {
         font-size: 18px;
    }
     .resultats b3 {
         font-size: 13px;
    }
     .resultats span {
         font-size: 12px;
         line-height: 12px;
    }
     .resultats p {
         font-size: 13px;
         line-height: 14px;
         margin-bottom: 18px;
         font-weight: 100;
    }
}
/* FIN MODIFICATIONS SMARTPHONE RESULTATS*/

/* CITATION */
 .citation {
     width: 100%;
     background: #fff;
     text-align: center;
}
 .citation p {
     line-height: 20px;
     margin: 0px auto 0px auto;
     padding-top: 40px;
}
 .citation span {
     font-size: 15px;
     font-style: italic;
     color: #111;
}
 @media (max-width: 480px) {
     .citation p {
         font-size: 15px;
         line-height: 14px;
         padding-top: 20px;
    }
     .citation span {
         font-size: 14px;
    }
}

/* FENETRE RECHERCHE COMPONENT*/
 .c-quick-search>.btn {
     background: #f7fafb;
     float: right;
     margin: 32px 70px -80px auto;
     font-size: 25px;
}
 .c-page-on-scroll .c-quick-search>.btn {
     margin: 8px 70px -80px auto;
     font-size: 25px;
}

/* FORMULAIRE MODAL */
 .formulaire {
     background: transparent;
     text-align: center;
}
 .formulaire .form-control {
     margin: 0 0 5px 0;
     background-color: #ffe;
     color: #232DA0;
     font-size: 15px;
     border-radius: 10px;
     font-family: "Courier";
}
 .formulaire .btn {
     position: relative;
     background-color: #F7D021;
     border: 3px solid #232DA0;
     border-radius: 10px;
     width: 100%;
     height: 50px;
     font-family: "IndieFlower";
     text-align: center;
     font-size: 20px;
     font-weight: 400;
     color: #232DA0;
     cursor: url('../design/icones-site/select.cur'), pointer;
}
 .formulaire .btn:hover {
     background-color: #232DA0;
     color: #FDF842;
}
 .formulaire i {
     font-size: 40px;
}
 .formulaire .envoyer {
     position: absolute;
     left: 20px;
     bottom: -15px;
}
 .formulaire.confirme {
 	display: block;
 	position: absolute;
 	width: 90%;
 	left: 5%;
 	bottom:20%;
     text-align: center;
 }
 .formulaire.confirme h2 {
     color: #232DA0;
     font-size: 30px;
     line-height: 33px;
     font-weight: 600;
}

 .merci {
     display: inline-block;
     font-family: "Naja";
     color: #232DA0;
     font-size: 50px;
}
 .merci:before {
     content: "\0063";
}


/* FOOTER */
 .footer {
     position: relative;
     clear: left;
     display: inline-block;
     width: 100%;
     padding: 0 0 0 0;
     background: #fff;
     margin-bottom: 0px;
     margin-top: 0px;
}
 .footer .evolution img {
     display: block;
     width: 80%;
}
 .evolution {
 	display: inline-block;
     width: 100%;
     height: auto;
     background: #fff;
     margin-top: 0px;
     padding: 0px;
}
 @media (max-width: 991px) {
     .footer {
         border-radius: 0px;
    }
}
 @media (max-width: 767px) {
     .footer .evolution img {
         width: 100%;
    }
}
 @media (max-width: 480px) {
     .evolution {
         margin-top: -10px;
         padding-top: 15px;
    }
}
/* FOOTER-LIST */
 .footer-list ul {
     width: 100%;
     border: 0px solid #fff;
}
 .footer-list ul a li {
     list-style: none;
     width: 100%;
     padding: 5px;
     margin: 0 0 0 0;
     display: inline-block;
     border-bottom: 1px solid #eee;
     color: #000;
}
 .footer-list li h1 {
     display: inline-block;
     margin: 15px 0 0 0;
     font-size: 20px;
     font-weight: 400;
     line-height: 20px;
}
 .footer-list li h2 {
     margin: 0 0 0 0;
     font-size: 14px;
     font-weight: 100;
     line-height: 14px;
}
 .footer-list ul li img {
     float: left;
     margin: 10px 15px 10px 10px;
     width: 50px;
     height: 50px;
     border-radius: 5%;
}
/* FOOTER LINE-LIST */
 .line-list ul {
     width: 100%;
     border: 0px solid #fff;
     display: inline-block;
}
 .line-list ul a li {
     list-style: none;
     float: left;
     width: auto;
     padding: 5px;
     margin: 0 5px 5px 0;
     display: block;
     border: 2px solid #eee;
     color: #000;
}
/* COPYRIGHT */
/* BASE */
 .copyright {
     display: inline-block;
     width: auto;
     font-size: 14px;
     margin: 15px auto 5px 20px;
     color: #555;
}
 .copyright span:before {
     font-weight: 400;
     content: "\00a9  jean-paul bernard";
}
 .base {
     display: inline-block;
     width: 100%;
     height: 25px;
     background: #fff url(../design/fonds/pave-mosaique.jpg) repeat;
     margin-top: 0px;
     margin-bottom: 0px;
     border-radius: 0 0 15px 15px;
}
 .base.no {
     height: 20px;
     background: #fff;
}
 @media (max-width: 991px) {
     .copyright {
         margin: 30px auto 5px 20px;
    }
     .base {
         border-radius: 0;
    }
}
 @media (max-width: 480px) {
     .copyright {
         font-size: 13px;
    }
}
/* GO2TOP */
 .go2top {
     display: inline-block;
     position: fixed;
     bottom: 10px;
     right: 10px;
     cursor: url('../design/icones-site/select.cur'), pointer;
     opacity: 0.5;
     filter: alphaopacity=50;
}
 .go2top>i {
     color: #89939e;
     font-size: 50px;
     font-weight: 100;
}
 .go2top:hover {
     opacity: 0.8;
     filter: alphaopacity=80;
}
 @media (max-width: 480px) {
     .go2top {
         bottom: 5px;
         right: 10px;
    }
}
/* COMPLEMENT-MAGIE */
 .complement-magie {
     display: inline-block;
     padding: 20px 40px 20px 40px;
     background:#fff;
     margin-bottom: -10px;
}
 .complement-magie img {
 	float: left;
     margin: 0 15px 15px 0;
     width: 100px;
     border-radius: 0;
     box-shadow: 5px 5px 7px 0px rgba(0, 0, 0, 0.3);
}

 .complement-magie p span {
 	font-style: italic;
}
 @media (max-width: 480px) {
     .complement-magie {
     padding: 10px 0px;
}
 .complement-magie p {
 	line-height: 20px;
}
}

 .rab {
     padding: 20px 40px 20px 40px;
     background:#BFFF40 url(../design/fonds/magie.jpg) repeat;
     color: #fff;
     cursor: url('../design/icones-site/select.cur'), pointer;
     border-radius: 5px;
     box-shadow: 5px 5px 7px 0px rgba(0, 0, 0, 0.3);
}
 .rab img {
    width: 100%;
    border: 5px solid #000;
     border-radius: 5px;
     box-shadow: 5px 5px 7px 0px rgba(0, 0, 0, 0.3);
}

 .rab p span {
    font-size: 18px;
    line-height: 16px;
}

 @media (max-width: 767px) {
 	 .rab {
     padding: 20px;
     cursor: url('../design/icones-site/select.cur'), pointer;
     border-radius:0;
     box-shadow: none;
     text-align: center;
     margin: 0 -40px;
}
     .rab img {
     	float: none;
    width: 40%;
}

}

 @media (max-width: 480px) {
 	 .rab {
     background: url(../design/fonds/magie.jpg) repeat;
     color: #fff;
     border-radius:0;
     margin: 0;
}
     .rab img {
    width: 70%;
}
}

/* TEXTE */

 .texte {
     background: url(../design/fonds/textes.jpg) repeat;
}
 .corps {
     text-align: justify;
     padding: 0;
     line-height: 22px;
      	width:480px;
 	margin: 30px auto;
}

 .corps p {
 	margin: 8px auto 8px auto;
 	text-indent: 30px;

}
 .corps span p {
 	margin: 0px auto 0px auto;
 	text-indent: 30px;
}

 .texte h1 {
 	font-family: "JMHTypewriter", sans-serif;
 	font-size: 40px;
     line-height: 40px;
     margin: 0 auto;
     text-align: left;
}
.texte h2 {
 	font-family: "JMHTypewriter", sans-serif;
 	font-size: 15px;
 	font-style: italic;
 	font-weight: 200;
 	margin: 10px auto 0 0;
}
.texte h3 {
 	font-family: "JMHTypewriter", sans-serif;
 	margin: 30px auto 10px 0;
}
 .texte h4 {
 	font-family: "JMHTypewriter", sans-serif;
 	text-align: center;}
 .exergue {
 	     font-size: 14px;
 	     line-height: 16px;
 	     margin: 20px 30px 0 auto;
}
 .exergue p {
     text-align: right;
     font-style: italic;
     margin: 0 0 4px auto;
}

 .exergue p span{
	font-weight: 600;
}

 .theatre b {
 	display: block;	
 	margin: 7px auto 0 auto;
}
 .theatre p {
     font-style: italic;
     margin: 10px auto;
     text-indent: 0;
}

.copyright-texte {
	display: block;
	text-align: left;
     font-style: italic;
     font-size: 12px;
     margin-top: 10px;
}

.texte-hasard {
	text-align: right;
	font-size: 16px;
     margin: 40px 40px 100px auto;
     cursor: url('../design/icones-site/select.cur'), pointer;
}

 @media (max-width: 500px) {
 	 .texte {
     background:#fff;
     font-size: 17px;
}
.texte-hasard {
	margin: 40px 0 100px auto;
}
 .texte p {
 	margin: 10px auto 5px auto;
 	text-indent: 20px;
 	font-weight: 400;
}
 .texte span p {
 	margin: 2px auto 2px auto;
 	text-indent: 20px;
}
 .texte h1{
 	font-size: 38px;
 	line-height:34px;
}
 .texte h1 span{
 	font-size: 32px;
 	line-height:30px;
 	margin: 0 auto 30px auto;
}
 .texte h2 {
 	margin: 10px 5px 0 auto;
 	text-align: right;
 	}
 	
 .texte h3 {
 	font-size: 25px;
 	}

.texte h4 {
 	font-size: 23px;
}
b {
 	font-weight: 800;
}
 .exergue {
 	display: none;
     margin-top :-15px;
     margin-bottom: 20px;
}
 .exergue p {
     margin: 0 0 4px auto;
}
 .exergue p span{
	font-weight: 800;
}

 .corps {
     line-height: 20px;
      	width:100%;
}
 .poesie {
     text-align:left;
}

 .theatre {
 	width:100%;
}

 .theatre b {
 	font-size:18px;
}
 .theatre p {
 	text-indent: 0;;
}
}

/* SIGNATURE */
 .signature img {
 	width: 140px;
     float: left;
     margin: -25px auto 0px 400px;
}
 @media (max-width: 767px) {
     .signature img {
     	float: right;
 	width: 140px;
     margin: -5px 25px 0px auto;
}
}
 @media (max-width: 480px) {
     .signature img {
     	float: right;
 	width: 120px;
     margin: -20px 0px 0px auto;
}
}

/* SIGNATURE-2 */
 .signature-2 img {
 	width: 140px;
     float: right;
     margin: 0px 100px 0px auto;
}
 @media (max-width: 767px) {
     .signature-2 img {
     	float: right;
 	width: 140px;
     margin: -5px 25px 0px auto;
}
}
 @media (max-width: 480px) {
     .signature-2 img {
     	float: right;
 	width: 120px;
     margin: -20px 0px 0px auto;
}
}
/* STYLE */
 .entete {
     display: none;
}
 li {
     list-style: none;
}
 .stabylo a {
     color: #000;
     font-weight: 100;
     padding-left: 3px;
     padding-right: 3px;
     background: url(../design/fonds/stabylo-vert.png);
     background-size: 100% 100%;
     -webkit-transition-duration: 1s;
     -moz-transition-duration: 1s;
     transition-duration: 1s;
}
 .stabylo a:hover {
     color: #000;
     background: url(../design/fonds/stabylo-rose.png);
     background-size: 100% 100%;     
     -webkit-transition-duration: 3s;
     -moz-transition-duration: 3s;
     transition-duration: 3s;
}
 .stabylo-cuir a {
     color: #fff;
     font-weight: 100;
     padding:5px 10px;
     background: url(../design/fonds/stabylo-cuir.png);
     background-size: 100% 100%;
     -webkit-transition-duration: 1s;
     -moz-transition-duration: 1s;
     transition-duration: 1s;
}
 .stabylo-cuir a:hover {
     color: #ccc;
     font-weight: 100;
     background: url(../design/fonds/stabylo-cuir.png);
     background-size: 100% 100%;
     -webkit-transition-duration: 1s;
     -moz-transition-duration: 1s;
     transition-duration: 1s;
}

 .bg-0 {
     background: #000;
}
 .bg-1 {
     background: #FFF;
}
 .clear {
     clear: all;
}
 .invisible {
     display: none;
     height: 0;
}
 .inline-block {
     display: inline-block;
}
 .center {
     text-align: center;
}
 .left {
     float: left;
}
 .right {
     float: right;
}
 .no-padding {
     padding: 0px;
}
 .padding-0-5 {
     padding: 0px 5px 0px 5px;
}
 .padding-0-20 {
     padding: 0px 20px 0px 20px;
}
 .rotate-5 {
     -ms-transform: rotate(5deg);
     -webkit-transform: rotate(5deg);
     transform: rotate(5deg);
}
 .rotate-10 {
     -ms-transform: rotate(10deg);
     -webkit-transform: rotate(10deg);
     transform: rotate(10deg);
}
 .rotate--5 {
     -ms-transform: rotate(-5deg);
     -webkit-transform: rotate(-5deg);
     transform: rotate(-5deg);
}
 .test {
     width: 100%;
     display: inline-block;
     height: auto;
}
 .serrer {
     letter-spacing: -1px;
}
/* HOUDINI */
 @media (max-width: 991px) {
     .houdini-991 {
         display: none;
    }
}
 @media (max-width: 767px) {
     .houdini-767 {
         display: none;
    }
}
 @media (max-width: 480px) {
     .houdini-480 {
         display: none;
    }
}
 @media (max-width: 320px) {
     .houdini-320 {
         display: none;
    }
}
/* ZORRO */
 .zorro-991 {
     display: none;
}
 @media (max-width: 991px) {
     .zorro-991 {
         display: block;
    }
}
 .zorro-767 {
     display: none;
}
 @media (max-width: 767px) {
     .zorro-767 {
         display: block;
    }
}
 .zorro-480 {
     display: none;
}
 @media (max-width: 480px) {
     .zorro-480 {
         display: block;
    }
}
 .zorro-320 {
     display: none;
}
 @media (max-width: 320px) {
     .zorro-320 {
         display: block;
    }
}
/* ZOORO-HOUDINI */
 .zorro-houdini-480-767 {
     display: none;
}
 @media (max-width: 767px) {
     .zorro-houdini-480-767 {
         display: block;
    }
}
 @media (max-width: 480px) {
     .zorro-houdini-480-767 {
         display: none;
    }
}
 .zorro-houdini-767-991 {
     display: none;
}
 @media (max-width: 991px) {
     .zorro-houdini-767-991 {
         display: block;
    }
}
 @media (max-width: 767px) {
     .zorro-houdini-767-991 {
         display: none;
    }
}

 .zorro-houdini-480-767{
     display: none;
}
 @media (max-width: 767px) {
     .zorro-houdini-480-767 {
         display: block;
    }
}
 @media (max-width: 480px) {
     .zorro-houdini-480-767 {
         display: none;
    }
}
/* ICONES PERSOS */
 [class*='icone-']:before {
     display: inline-block;
     font-family: 'Naja';
     font-style: normal;
     font-weight: normal;
     line-height: 1;
     -webkit-font-smoothing: antialiased;
     -moz-osx-font-smoothing: grayscale 
}
 .icone-1-fermer:before {
     content: '\0041';
}
 .icone-1-fleche-cercle-bas:before {
     content: '\0042';
}
 .icone-accueil:before {
     content: '\0043';
}
 .icone-1-fleche-cercle-haut:before {
     content: '\0044';
}
 .icone-ballons:before {
     content: '\0045';
}
 .icone-calendrier:before {
     content: '\0046';
}
 .icone-carte-de-visite:before {
     content: '\0047';
}
 .icone-cv:before {
     content: '\0048';
}
 .icone-dossier-de-presse:before {
     content: '\0049';
}
 .icone-envoyer-message:before {
     content: '\004a';
}
 .icone-filmographie:before {
     content: '\004b';
}
 .icone-fleche-bas-droit:before {
     content: '\004c';
}
 .icone-fleche-bas-gauche:before {
     content: '\004d';
}
 .icone-fleche-bas:before {
     content: '\004e';
}
 .icone-fleche-cercle-droite:before {
     content: '\004f';
}
 .icone-fleche-droite-2:before {
     content: '\0050';
}
 .icone-fleche-cercle-gauche:before {
     content: '\0051';
}
 .icone-fleche-droite-3:before {
     content: '\0052';
}
 .icone-fleche-droite:before {
     content: '\0053';
}
 .icone-fleche-gauche:before {
     content: '\0054';
}
 .icone-fleche-haut:before {
     content: '\0055';
}
 .icone-happy:before {
     content: '\0056';
}
 .icone-infos-plus:before {
     content: '\0057';
}
 .icone-infos:before {
     content: '\0058';
}
 .icone-lapin:before {
     content: '\0059';
}
 .icone-main-bas:before {
     content: '\005a';
}
 .icone-main-droite:before {
     content: '\0061';
}
 .icone-menu:before {
     content: '\0062';
}
 .icone-merci:before {
     content: '\0063';
}
 .icone-message:before {
     content: '\0064';
}
 .icone-panneau-droite:before {
     content: '\0065';
}
 .icone-pigeon:before {
     content: '\0066';
}
 .icone-rechercher:before {
     content: '\0067';
}
 .icone-plus:before {
     content: '\0068';
}
 .icone-soleil:before {
     content: '\0069';
}
 .icone-telecharger:before {
     content: '\006a';
}
 .icone-telephone:before {
     content: '\006b';
}
 .icone-voir:before {
     content: '\006c';
}
 .icone-voir-2:before {
     content: '\006d';
}
 .icone-up:before {
     content: '\006e';
}