/* CSS Ornicarinks  */

article,  details, figcaption, figure, footer, header, hgroup, nav, section { display: block; }
audio, canvas, video { display: inline-block; *display: inline; *zoom: 1; }
audio:not([controls]) { display: none; }
[hidden] { display: none; }

html { font-size: 100%; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%;    width: 100%;
    height: 100%;}
html, button, input, select, textarea { font-family: 'Elsie Swash Caps', cursive; color: #222; }
body { margin: 0;   position: relative;
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 2px;
	overflow: auto;
	}

  

/* Le texte */
p{font-size: 0.8em; line-height: 1.4;text-align: justify;}
h1 { font-size: 21px;color: white;font-family: 'Montserrat Alternates', sans-serif; }
h2 { font-size: 12px;font-family: 'Montserrat Alternates', sans-serif; }
h3 { font-size: 10px; font-family: 'Montserrat Alternates', sans-serif; color:white}
/* p {font-size: 15px;font-family: 'Montserrat Alternates', sans-serif; } */


a.type1 { color: red; }
a.type1:hover { color: yellow;}

.txtAccueil {
font-size: 12px; color:black;line-height: 1.4;text-align: justify;
}


::-moz-selection { background: #fe57a1; color: #fff; text-shadow: none; }
::selection { background: #fe57a1; color: #fff; text-shadow: none; }


abbr[title] { border-bottom: 1px dotted; }
b, strong { font-weight: bold; }
blockquote { margin: 1em 40px; }
dfn { font-style: italic; }
hr { display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0; }
ins { background: #ff9; color: #000; text-decoration: none; }
mark { background: #ff0; color: #000; font-style: italic; font-weight: bold; }
pre, code, kbd, samp { font-family: monospace, serif; _font-family: 'courier new', monospace; font-size: 1em; }
pre { white-space: pre; white-space: pre-wrap; word-wrap: break-word; }

q { quotes: none; }
q:before, q:after { content: ""; content: none; }
small { font-size: 85%; }
sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }
sup { top: -0.5em; }
sub { bottom: -0.25em; }

ul, ol { margin: 1em 0; padding: 0 0 0 40px; }
dd { margin: 0 0 0 40px; }
nav ul, nav ol { list-style: none; list-style-image: none; margin: 0; padding: 0; }

img { border: 0; -ms-interpolation-mode: bicubic; vertical-align: middle; }
svg:not(:root) { overflow: hidden; }
figure { margin: 0; }

form { margin: 0; }
fieldset { border: 0; margin: 0; padding: 0; }

label { cursor: pointer; }
legend { border: 0; *margin-left: -7px; padding: 0; white-space: normal; }
button, input, select, textarea { font-size: 100%; margin: 0; vertical-align: baseline; *vertical-align: middle; }
button, input { line-height: normal; }
button, input[type="button"], input[type="reset"], input[type="submit"] { cursor: pointer; -webkit-appearance: button; *overflow: visible; }
button[disabled], input[disabled] { cursor: default; }
input[type="checkbox"], input[type="radio"] { box-sizing: border-box; padding: 0; *width: 13px; *height: 13px; }
input[type="search"] { -webkit-appearance: textfield; -moz-box-sizing: content-box; -webkit-box-sizing: content-box; box-sizing: content-box; }
input[type="search"]::-webkit-search-decoration, input[type="search"]::-webkit-search-cancel-button { -webkit-appearance: none; }
button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; }
textarea { overflow: auto; vertical-align: top; resize: vertical; }
input:valid, textarea:valid {  }
input:invalid, textarea:invalid { background-color: #f0dddd; }

table { border-collapse: collapse; border-spacing: 0; }
td { vertical-align: top; }

aside{ margin: 0.5em 0; padding: 0.5em 0; padding-left: 1em}

aside li {
   padding-right: 0.2em; 
    color: black
}

aside li h3 { font-size: 12px;color: black;font-family: monospace,serif; }
aside h4 { font-size: 20px;color: black; font-family: monospace,serif; }

aside p {padding-right: 1em; font-size: 12px; color: black;font-family: monospace,serif; }
 
 
.chromeframe { margin: 0.2em 0; background: #ccc; color: black; padding: 0.2em 0; }


/* pour google */
pre { display: block; background-color: #333; padding:10px; border-radius:5px;}
pre .nocode { background-color: none; color: #000 }
pre .str { color: #ffa0a0 } /* string  - pink */
pre .kwd { color: #f0e68c; font-weight: normal }
pre .com { color: #87ceeb; font-style: italic } /* comment - skyblue */
pre .typ { color: #98fb98 } /* type    - lightgreen */
pre .lit { color: #cd5c5c } /* literal - darkred */
pre .pun { color: #fff }    /* punctuation */
pre .pln { color: #fff }    /* plaintext */
pre .tag { color: #f0e68c; font-weight: normal } /* html/xml tag    - lightyellow */
pre .atn { color: #bdb76b; font-weight: normal } /* attribute name  - khaki */
pre .atv { color: #ffa0a0 } /* attribute value - pink */
pre .dec { color: #98fb98 } /* decimal         - lightgreen */

/* Specify class=linenums on a pre to get line numbering */
ol.linenums { margin-top: 0; margin-bottom: 0; color: #AEAEAE } /* IE indents via margin-left */
li.L0,li.L1,li.L2,li.L3,li.L5,li.L6,li.L7,li.L8 { list-style-type: none }
/* Alternate shading for lines */
li.L1,li.L3,li.L5,li.L7,li.L9 { }

@media print {
  pre { background-color: none }
  pre .str, code .str { color: #060 }
  pre .kwd, code .kwd { color: #006; font-weight: normal }
  pre .com, code .com { color: #600; font-style: italic }
  pre .typ, code .typ { color: #404; font-weight: normal }
  pre .lit, code .lit { color: #044 }
  pre .pun, code .pun { color: #440 }
  pre .pln, code .pln { color: #000 }
  pre .tag, code .tag { color: #006; font-weight: normal }
  pre .atn, code .atn { color: #404 }
  pre .atv, code .atv { color: #060 }
}

*{
	font-family: 'Montserrat Alternates', sans-serif;
}



pre, pre span{
	font-size: 14px;
	font-family: monospace,serif;
}


#element_to_pop_up { 
    background-color:#fff;
    border-radius:15px;
    color:#000;
    display:none; 
    padding:20px;
    min-width:400px;
    min-height: 180px;
}


  /* ---------------------------------------- ACCUEIL----------------------- */
  
/* --------------------------------- Retour haut de page ------------------------------------- */

#retour  {
position:relative;
text-align:center;
    height: 50px;

}


#retour a{
 text-decoration:none; 
color:#BC0302;
font-size: 12px;
font-weight:bold;
}
#retour a:hover {
 text-decoration:none; 
color:#63CFAD;
font-size: 12px;
font-weight:bold;
}
  
/* Containers
background-color: #EFEBDE;
----------------------------------------------------------------------------------------------------*/

.container_base{
position: relative;
display: block; 

margin-left: auto;
margin-right: auto;
 margin-top: 50px;;
width: 60%;
z-index: 900;   
 
}
.container_news{
position: relative;
display: block; 
margin-left: auto;
margin-right: auto;
 margin-top: 70px;;
width: 53%;
z-index: 900;   
background: #EFEBDE url(../img/design/noise.png) repeat top left;
padding:50px;
     -webkit-border-radius:5px;
  -moz-border-radius:5px;
  -o-border-radius:5px;
  -ms-border-radius:5px;
  border-radius:5px; 
}
.container_news h1{
color:black;
font-size: 12px;

}

.container_news h1{
color:black;
}

.container_news a{
 text-decoration:none; 
color:#BC0302;
font-size: 12px;
font-weight:bold;
}
.container_news a:hover {
 text-decoration:none; 
color:#63CFAD;
font-size: 12px;
font-weight:bold;
}
.container_erreur{
position: relative;
display: block; 
margin-left: auto;
margin-right: auto;
top: 20%;
width: 53%;
z-index: 900;   
background: #EFEBDE url(../img/design/noise.png) repeat top left;
padding:50px;
     -webkit-border-radius:5px;
  -moz-border-radius:5px;
  -o-border-radius:5px;
  -ms-border-radius:5px;
  border-radius:5px; 
  text-align:center;
}
.container_erreur p{

  text-align:center;
}

.container_erreur a{
 text-decoration:none; 
color:#BC0302;
font-size: 12px;
font-weight:bold;
  text-align:center;
}
.container_erreur a:hover {
 text-decoration:none; 
color:#63CFAD;
font-size: 12px;
font-weight:bold;
  text-align:center;
}
.container_12 {
position: relative;
display: block; 
background: #EFEBDE url(../img/design/noise.png) repeat top left;
margin-left: auto;
margin-right: auto;
 margin-top: 50px;;
width: 60%;
z-index: 900;   
     -webkit-border-radius:5px;
  -moz-border-radius:5px;
  -o-border-radius:5px;
  -ms-border-radius:5px;
  border-radius:5px;   
 
  ; 
}

.container_actu {
position: relative;

background-color: #EFEBDE;
	margin-left: auto;
	margin-right: auto;
-webkit-border-radius:5px;
  -moz-border-radius:5px;
  -o-border-radius:5px;
  -ms-border-radius:5px;
  border-radius:5px;    
	width: 800px;;
	height:600px;
 z-index: 900;   
}

.container_actu  ul li{
 display: inline-block;  
 margin:200px;
}

.container_13 {
position: relative;


	margin-left: auto;
	margin-right: auto;
        margin-top: 20px;;
		 margin-bottom: 5px;;
  
        -webkit-border-radius:5px;
  -moz-border-radius:5px;
  -o-border-radius:5px;
  -ms-border-radius:5px;
  border-radius:5px;    
	width: 70%;
     
       
        z-index: 900;
       
}


/* ------- Navigation principale ----------- */
#navCollection li {  
   margin: 5px;
	width:100px;
	height:130px;
 display: inline-block;
z-index: 3000;
opacity: 0.9;
}
#navCollection :hover {
opacity: 1;
cursor: pointer;
}
#navCollection figcaption{
    position:relative;
    color:white;
    text-align: center;
	top:0px;
	font-size: 12px;
font-weight:bold;
	height:15px;
}

/* ------- Navigation principale ----------- */
div.parentAccueil {

   
     position: relative;
    margin-left: auto;
  margin-right: auto;
  margin-bottom: px;
left:50px;
   width:70%;
   height:300px;;
   
}
div.parentActu{
 position: relative;
    margin-left: auto;
  margin-right: auto;

   width:70%;
   height:150px;;
   
}

div.parent {
   margin-top:50px;
   margin-bottom:50px;
   left:-20px;
    position:relative;
   text-align: center;
   width:100%;
}


#navOrnicarinks li {  

 margin-top:20px;
	width:100px;
	height:80px;
    display: inline-block;
z-index: 3000;
}

#navOrnicarinks :hover {
opacity: 0.8;
cursor: pointer;
}
#navOrnicarinks figcaption{
position:relative;
    font-size: 10px;
    color:white;	
top:5px;
}

img.imageOrnicarinks{
   cursor: pointer;

}
img.imageOrnicarinksActive{
   cursor: pointer;
border:2px solid #DE4900;

           -webkit-border-radius:5px;
  -moz-border-radius:5px;
  -o-border-radius:5px;
  -ms-border-radius:5px;
  border-radius:5px;  
     -moz-box-shadow: 0px 0px 7px #000;	
   -webkit-box-shadow: 0px 0px 7px #000; 
   border-radius: 7x; 

}
/* ------- Navigation  infos Projet / qui /equipe /actus ----------- */
#navInfos {
   position:relative;
   width:400px;
font-size: 14px;
 margin-left: auto;
  margin-right: auto;
 margin-top: 50px;
text-align:center;
 z-index: 3000; 
}
#navInfos a:link { text-decoration:none;color: white; text-shadow: 0.1em 0.1em 0.2em #5C9A8C;}
#navInfos a:visited { text-decoration:none;color: white;text-shadow: 0.1em 0.1em 0.2em #5C9A8C;}
#navInfos a:hover { color: #DE4900; text-shadow: 0.1em 0.1em 0.2em #5C9A8C;}
#navInfos a:active { text-decoration:none;color: white; text-shadow: 0.1em 0.1em 0.2em #5C9A8C;}


/* --------------------------------- FIN -ACCUEIL ------------------------------------- */


#headerSite {
   position: relative;
font-size: 20px;

  height:30px;
    width:50%;

  z-index: 1000;
}



#header {
   position: relative;
	 margin-left: auto;
  margin-right: auto;
     top: -20px;

    width:60%;
   background-color: #DE4900;
   border-style:solid;
border-width:medium;
	border-color:#D5C246;

  z-index: 1000;
  text-align:center;
  
  -webkit-border-radius:3px;
  -moz-border-radius:3px;
  -o-border-radius:3px;
  -ms-border-radius:3px;
   border-radius:3px;     

   -moz-box-shadow: 0px 0px 7px #000;	
   -webkit-box-shadow: 0px 0px 7px #000; 
   border-radius: 7x; 
}
#header h1 {
position:relative;
font-size: 20px;
/* font-family: Montserrat, serif; */
color:white;
z-index: 1001;
}
#headerPage {
   position: relative;

    top:0px;
  height:50px;
    width:250px;
	 margin-left: auto;
  margin-right: auto;
   /*background-image: url(../img/design/Petitcadre2.png);*/

  z-index: 1000;
  text-align:center;
}
#headerPage h1 {
position:relative;
font-size: 20px;
top:15px;
color:white;
z-index: 1001;
}

.decoHeader {
   position: relative;
 background-image: url(../img/design/deco.png);
   top:50px;
  height:93px;
    width:358px;
	 margin-left: auto;
  margin-right: auto;
left:50%;
  z-index: 1000;
  text-align:center;
}




    
#ascensorBuilding{
	overflow:hidden;
      /*   background-color: #63C9AF; */
}

#ascensorBuilding section:first-child article h1 {
    background-color: #63C9AF;
	font-size: 30px;
}

section{
overflow:auto;
/* background-color: #63C9AF; */
}

section article{
	margin-top: 40px;
	margin-bottom: 40px;
	padding: 20px;
}

/* --------------------------------- Retour haut de page ------------------------------------- */
#navAdresse {
position:relative;
width:80%;
left: 15%;
margin-right: auto;
text-align:center;
z-index: 3000; 
}
#navAdresse p {
font-size: 12px;
color: white;
}

/* --------------------------------- Mentions association Ornicarinks ------------------------------------- */


#navMentions {
position:relative;
width:200px;

text-align:center;
 margin-left: auto;
  margin-right: auto;
 z-index: 3000; 
}
#navMentions a {

font-size: 12px;
color: white;

}


    /*   Pictos Accueil / facebook / contact  */

#navigationPictos{

margin-left:-10px;
position: fixed;
list-style: none;

width:50px; 
z-index:1200;
bottom:60px;
}
#navigationPictos li :hover{
opacity:0.7;
cursor: pointer;

}
#navigationPictos li {

margin-top:10px;
}
#navigationPictos figcaption{
height:20px;
margin-top:-10px;
left:-7px;
    font-size: 10px; 
    color:white;
    text-align: center;
	text-shadow: 0.1em 0.1em 0.2em #5C9A8C
}




.imagePortrait{
position:relative;


left:-20px;
float:left;
	

 
}
.imageNews{
position:relative;
  -moz-border-radius:5px;
  -o-border-radius:5px;
  -ms-border-radius:5px;
   border-radius:5px;  

left:-20px;
float:left;
	

 
}



img.imageActu{
position:relative;
    cursor: pointer;

	
    margin-bottom: 15px;
	margin-top:25px;
	float:right;
	margin-left:20px;
    border:3px solid #FFFFFF;
          -webkit-border-radius:5px;
  -moz-border-radius:5px;
  -o-border-radius:5px;
  -ms-border-radius:5px;
   border-radius:5px;     

   -moz-box-shadow: 0px 0px 10px #000;	
   -webkit-box-shadow: 0px 0px 10px #000; 
   border-radius: 10px; 
}
img.imageActu:hover{
  opacity:0.5;
}

img.imageGauche{
	float:left;
	margin-right:20px;
	    cursor: pointer;
    margin-bottom: 15px;
	

        border:3px solid #FFFFFF;
          -webkit-border-radius:5px;
  -moz-border-radius:5px;
  -o-border-radius:5px;
  -ms-border-radius:5px;
   border-radius:5px;    
      -moz-box-shadow: 0px 0px 10px #000;	
   -webkit-box-shadow: 0px 0px 10px #000; 
   border-radius: 10px; 

} 
img.imageGauche:hover{
  opacity:0.5;
}

img.image{
position:relative;
    cursor: pointer;

	
    margin-bottom: 15px;
	float:right;
	margin-left:20px;
    border:3px solid #FFFFFF;
          -webkit-border-radius:5px;
  -moz-border-radius:5px;
  -o-border-radius:5px;
  -ms-border-radius:5px;
   border-radius:5px;     

   -moz-box-shadow: 0px 0px 10px #000;	
   -webkit-box-shadow: 0px 0px 10px #000; 
   border-radius: 10px; 
}

img.imageVideo{
position:relative;
cursor: pointer;
margin: 5px;

	
border:3px solid #FFFFFF;
          -webkit-border-radius:5px;
  -moz-border-radius:5px;
  -o-border-radius:5px;
  -ms-border-radius:5px;
   border-radius:5px;     

   -moz-box-shadow: 0px 0px 10px #000;	
   -webkit-box-shadow: 0px 0px 10px #000; 
   border-radius: 10px; 
}
img.imageVideo:hover{
opacity:0.7;
}

img#imageDroite{
position:relative;
cursor: pointer;
margin: 25px;
width: 50%;
float:right;
	
border:3px solid #FFFFFF;
          -webkit-border-radius:5px;
  -moz-border-radius:5px;
  -o-border-radius:5px;
  -ms-border-radius:5px;
   border-radius:5px;     

   -moz-box-shadow: 0px 0px 10px #000;	
   -webkit-box-shadow: 0px 0px 10px #000; 
   border-radius: 10px; 
}
img#imageDroite:hover{
  opacity:0.5;
}
img.imageGroupe{
   cursor: pointer;
	
    margin-bottom: 15px;
	float:right;
	margin-left:20px;
    border:3px solid #FFFFFF;
          -webkit-border-radius:5px;
  -moz-border-radius:5px;
  -o-border-radius:5px;
  -ms-border-radius:5px;
   border-radius:5px;     

   -moz-box-shadow: 0px 0px 10px #000;	
   -webkit-box-shadow: 0px 0px 10px #000; 
   border-radius: 10px; 
}

.imageMenu{
   cursor: pointer;
	
    margin-bottom: 8px;
	float:right;
	margin-left:10px;

}

figcaption{

position:relative;	
   top:-50px;
   font-size : .8em;
   padding : 6px 8px;
 
   display :block;
   text-align :center;
  
 

}

.imgBt:hover{
    
    opacity:0.8;
}
.encartLiensArticles{
 margin-top: 60px;
float:right;
 margin-right: 0px;
 position:relative;
  width:800px;

}
 

 .encartImages2 {
 margin-top: 0px;

 margin-right: 70px;
 
  width:500px;
   /*border:3px solid #FFFFFF;

  -webkit-border-radius:5px;
  -moz-border-radius:5px;
  -o-border-radius:5px;
  -ms-border-radius:5px;
   border-radius:5px;     

   -moz-box-shadow: 0px 0px 10px #000;	
   -webkit-box-shadow: 0px 0px 10px #000; 
   border-radius: 10px; 
   opacity:0.8;   
   opacity:.8; 
  mozilla firefox
   
      background-image: url(../images/texture_papier2.jpg);
   
   */
}







 .encartContact {
     position: relative;
 margin-top: 150px;
 margin-left: 30%;
 width:30%;
   background-image: url(../images/texture_papier2.jpg);
  border:3px solid #FFFFFF;
  background-color: #85C4E4;
  -webkit-border-radius:5px;
  -moz-border-radius:5px;
  -o-border-radius:5px;
  -ms-border-radius:5px;
   border-radius:5px;     
text-align:center;
   -moz-box-shadow: 0px 0px 10px #000;	
   -webkit-box-shadow: 0px 0px 10px #000; 
   border-radius: 10px; 
   opacity:0.5;   
   opacity:.8; /*mozilla firefox*/
}
 .encartContact li  { color: white; padding-left:-10px; }

.encartContact h4  { color: black;font-size: 14px; }

.encartContact a :hover {
    color:white;
	font-size: 15px;
	font-family: monospace,serif;
}
.encartContact a {
    
	font-size: 12px;
        color:black;
	font-family: monospace,serif;
}
.encartContact h3 {
    
	font-size: 12px;
        color:black;
	font-family: monospace,serif;
}
.encartParcours {
     position: relative;
 margin-top: 80px;
 margin-right: 70px;
 width:100%;
   background-image: url(../images/texture_papier2.jpg);
  border:3px solid #FFFFFF;
  background-color: #85C4E4;
  -webkit-border-radius:5px;
  -moz-border-radius:5px;
  -o-border-radius:5px;
  -ms-border-radius:5px;
   border-radius:5px;     

   -moz-box-shadow: 0px 0px 10px #000;	
   -webkit-box-shadow: 0px 0px 10px #000; 
   border-radius: 10px; 
   opacity:0.5;   
   opacity:.8; /*mozilla firefox*/
}
 .encartParcours li  { color: white; padding-left:-10px; }

.encartParcours h4  { color: black; text-align: center; }


  .encartVideo {

  width:200px;
  height: 150px;
  border:3px solid #FFFFFF;
  background-color: #5A310C;
  -webkit-border-radius:5px;
  -moz-border-radius:5px;
  -o-border-radius:5px;
  -ms-border-radius:5px;
   border-radius:5px;     
   opacity:.8; /*mozilla firefox*/
   -moz-box-shadow: 0px 0px 10px #000;	
   -webkit-box-shadow: 0px 0px 10px #000; 
   border-radius: 10px; 
   opacity:0.8;
}
.encartVideo h2 {
    top:100px;
    font-size: 15px;color: white; 
    
}



 #contenuCadre {
  position: relative;
  margin-left: 50%;
 margin-top:50px;
  

  z-index:500000;
  
}

#contenuApropos h1{
font-size:25px;
	
 color:white;   
    
}

#contenuDesign {
  position: absolute;
  float:right;
 margin-top: 50px;
 

  
  left: 80%;
 
  z-index:1;
} 


#contenuVideo {
  position: relative;
   margin-top: 50px;
   	 margin-left: auto;
  margin-right: auto;
display:block;
  width: 70%;
  height:300px;
  left: 50px;
 
} 
#contenuVideoTexte {
  position: relative;
  

  width: 80%;
  height:100%;
  margin-top:10px;
  margin-bottom:10px;
  left: 10%;
 
} 

#contenuSection {
  position: relative;
  margin-left: auto;
  margin-top: 30px;

  width: 80%;
  height:100%;
  left: 10%;
  padding-right: 18em;
} 
#contenuSection  h3{
   font-size: 26px;color: white;  
}
#contenuSection p {
    font-size: 15px;
	color:white; 
	
}

#contenuAccueil {
  position: relative;
  margin-left: auto;
  margin-top: 10px;

  width: 80%;
  height:100%;
  left: 10%;
  padding-right: 18em;
} 

#contenuAccueil p {
    font-size: 13px;
	color:black; 

}
#contenuAccueil h1 {
    font-size: 21px;
	color:black; 
text-align:center;
}
#contenuAccueil a{
 text-decoration:none; 
color:#BC0302;
font-size: 12px;
font-weight:bold;
}
#contenuAccueil a:hover {
 text-decoration:none; 
color:#63CFAD;
font-size: 12px;
font-weight:bold;
}
#contenuEquipe {
  position: relative;
  margin-left: auto;
margin-right: auto;

height:80%;
width:80%;
} 

#contenuEquipe p {
    font-size: 12px;
	color:black; 

 

  padding-right: 6em;
}
#contenuEquipe h1 {
    font-size: 21px;
	color:black; 
text-align:center;
}



#contenuAccueil li {
    font-size: 13px;
	color:black; 
	

}

#contenu {
  position: relative;
  margin-left: auto;
  margin-top: 30px;

  width: 70%;
  height:100%;
  left: 12%;
  padding-right: 15em;
  font-size: 12px;color:black; 
 
} 



#contenu  h1{
   font-size: 13px;color:white; 
  
}
#contenu  h2{
   font-size: 16px;color: white; 
  
}
#contenu  h3{
   font-size: 26px;color: white;  
}

#contenu a{
 text-decoration:none; 
color:#BC0302;
font-size: 12px;
font-weight:bold;
}
#contenu a:hover {
 text-decoration:none; 
color:#63CFAD;
font-size: 12px;
font-weight:bold;
}
#contenu  p{
   font-size: 14px;
   color:#FFFFFF; 
   text-align:center;
  
}

#contenuArticles {
  position: relative;
  margin-left: auto;
  margin-top: 30px;
  width: 80%;
  height:100%;
  left: 10%;
  padding-right: 18em;
  
} 
#contenuArticles  h2{
   font-size: 13px;color: #94CBC6; 
  
}
#contenuArticles  h3{
   font-size: 26px;color: white;  
}



#contenuActu {
  position: absolute;


  width: 200px;
  height:300px;


} 
#contenuActu figure {
  position: relative;
margin-left:100px;


} 
#contenuActu  p{
 font-size: 11px;color: #94CBC6; 
}

#contenuSvideo{
  position: relative;
  margin-left: auto;
  margin-top: 200px;
  width: 80%;
  height:50%;
  left: 10%;
  padding-right: 18em;
} 
#contenuSvideo  h3{
   font-size: 26px;color: #94CBC6; 
  
}







@media only screen and (min-width: 35em) {
  

}

.ir { display: block; border: 0; text-indent: -999em; overflow: hidden; background-color: transparent; background-repeat: no-repeat; text-align: left; direction: ltr; *line-height: 0; }
.ir br { display: none; }
.hidden { display: none !important; visibility: hidden; }
.visuallyhidden { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; }
.visuallyhidden.focusable:active, .visuallyhidden.focusable:focus { clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto; }
.invisible { visibility: hidden; }
.clearfix:before, .clearfix:after { content: ""; display: table; }
.clearfix:after { clear: both; }
.clearfix { *zoom: 1; }

@media print {
  * { background: transparent !important; color: black !important; box-shadow:none !important; text-shadow: none !important; filter:none !important; -ms-filter: none !important; } 
  a, a:visited { text-decoration: underline; }
  a[href]:after { content: " (" attr(href) ")"; }
  abbr[title]:after { content: " (" attr(title) ")"; }
  .ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; } 
  pre, blockquote { border: 1px solid #999; page-break-inside: avoid; }
  thead { display: table-header-group; } 
  tr, img { page-break-inside: avoid; }
  img { max-width: 100% !important; }
  @page { margin: 0.5cm; }
  p, h2, h3 { orphans: 3; widows: 3; }
  h2, h3 { page-break-after: avoid; }
}



#footer{
    position:fixed;
  background:#DE4900;
    bottom:-20px;
    height:50px;
    width:100%;
    
    margin-bottom: 20px;
   margin-left: auto;
margin-right: auto;

z-index: 999;

}



footer#footer ul{
list-style:none;

}

footer#footer li{
display:inline
}

footer#footer a{
font-family: 'Montserrat Alternates', sans-serif;
color:black;
font-size:12px;
text-decoration:none;
padding:0 5px
}

footer#footer a:hover{
color:white;
}

footer#footer .copyright{
color:#FF519C;
text-align:center;
font-size:.8em;
margin-top: 70px;
}





#facebook_button {
 background-color:#3399cc;
 background-image:url(../images/picto_facebook.png);

 background-repeat:no-repeat;
 background-position:5px 50%;

}

#navigation{
    position: relative;
 
 left: -20px;
    
}
#navigation li {
  
position: relative;
list-style: none;
display: inline-block;
       
}

#navigation li a {
        text-shadow: 0 2px 1px rgba(0,0,0,0.5);
        display: inline;
        text-decoration: none;
        color: #FFFFFF;
        font-size: 12px;
        font-family: 'Josefin Slab', serif;
        margin: 10px;
       
        
}



#navigation li a:hover {
        margin-top: 2px;
        color: #ECE86C;
     cursor: pointer;
}

#navigation li.active {
        font-style: italic;
        color: #FFFFFF;
}

#navigation li.active a {
    color: #FFFFFF;
}




.imageBG{
    display: block;
          position: absolute;
      width: 450px;
      height: 533px;
      background-image: url(../img/design/radis.png);
  bottom: 0px;
 left:700px;
 opacity: 0.9;
   
      z-index: 0;
}
.imageBG2{
    display: block;
          position: absolute;
      width: 400px;
      height: 397px;
      background-image: url(../img/design/atelier.png);
  bottom: 0px;
 left:700px;
 opacity: 0.9;
   
      z-index: 0;
}

.EnfantsTrombone {
        display: block;
          position: absolute;
      width: 200px;
      height: 167px;
      background-image: url(../images/enfantsTrombone2.png);
  bottom: 0px;
 left:0px;
 opacity: 0.3;
   
      z-index: 0;
    
}





/*--Making IE6 Understand Fixed Positioning--*/
*html #fade {
	position: absolute;
}
*html .popup_block {
	position: absolute;
}

	





           /* ---------------------------------------------------------   MEDIA QUERY   -------------------------------    */ 
															
															/* Resize images selon résolution */

			/* ---------------------------------------------------------résolution mobile-------------------------------    */ 
			
    
@media screen and (min-width: 200px) and (max-width: 659px)  {


        .logo_container{

position: relative;
width: 200px;
height:75px;

background: url(../img/logos/logoSmall.png), no-repeat;
margin-left: auto;
margin-right: auto;

z-index: 100;          
}

        .logo_container404{

position: relative;
width: 200px;
height:75px;

background: url(../img/logos/logoSmall.png), no-repeat;
margin-left: auto;
margin-right: auto;
top:30%;
z-index: 100;          
}

}
	
	
 
/* --------------------------------------------------------résolution écran moyen------------------------------------- */ 

@media screen and (min-width: 660px) {

.logo_container{
position: relative;
width: 800px;
height:150px;
background: url(../img/logos/logoMedium2.png), no-repeat;
margin-left: auto;
margin-right: auto;
z-index: 100;
left:-20px;
           
}
.logo_container404{
position: relative;
width: 400px;
height:150px;
background: url(../img/logos/logoMedium.png), no-repeat;
margin-left: auto;
margin-right: auto;
top:30%;
z-index: 100;
left:-20px;         
}

.menu_container{
position: relative;
width: 305px;
height:50px;
margin-left: auto;
margin-right: auto;
z-index: 500;           
}


.menu_containerFooter{
position: absolute;
width: 305px;;
height:50px;
margin-left: auto;
margin-right: auto;
z-index: 10000;           
}


}
 	
	
	
/* ----------------------------------------------------------------résolution grand écran------------------------------------------------ */    

@media screen and (min-width: 1200px) {

.logo_container{
position: relative;
width: 1100px;
height:150px;
background: url(../img/logos/logoLarge.svg), no-repeat;
margin-left: auto;
margin-right: auto;
z-index: 100;          
}
.logo_container404{
position: relative;
width: 400px;
height:150px;
background: url(../img/logos/logoMedium.png), no-repeat;
margin-left: auto;
margin-right: auto;
top:30%;
z-index: 100;
left:-20px;         
}	
}