/*html {font-size: 100%;}
body {font-size: 1.5em;}*/
*{margin:0;padding:0;border:none;margin: auto;}

   body {
      font-size: 100%;

    }
/*@font-face {
font-family: 'quicksand';
src: url('quicksand.ttf');
}*/
/*p {
	font-family: quicksand;
}
.no-padding > [class*='col-'] {
    padding-right:0;
    padding-left:0;
			display:inline-block;

}*/

[class*="col-md"]{ /*  [class*="col-"] signifie un attribut class dont la valeur comporte la chaîne col-
 	border: 1px solid red; */ 
	
}  
html, body {

    /*background: url(../images/PortraitWm1.png) no-repeat center fixed;

  Un arrière-plan extensible -webkit-background-size: cover;   
  background-size: cover;*/
}
	
.container {
/*width:100%;*/

} 

#cadrelogo{
	display:inline-block;
	width: 20%;
	
	vertical-align:top;
	position:relative;
	margin:3% 5% 0% 5%; /* border: 3px dotted #9999FF; margin:5% 10% 5% 10%;  haut droite bas gauche*/
	
}
.img_wm {
	float: right;
	/*display: inline-block;*/
	width: 35%;
	/*border: 1px solid blue;*/
	position:relative;
	z-index:1;
	margin-left: 50px;
}
img {
	/*vertical-align:top; 	
		width: 20%;
	margin: auto;*/
}/**/     
/*********************************TEXTE ACCORDEON *********************************/
#accordeons{
	vertical-align:top;
	display:inline-block;
	padding-top:0%;
	padding-left:0%;
	position:relative;
	z-index:2;
	margin-top:4%; /* margin:5% 10% 5% 10%;  haut droite bas gauche*/
/*width:520px;
height:100px;
margin:50px auto 0;
color:#F00;*/

}
.accordeon{
	display:inline-block;
	
	/*border: 3px dotted #9999FF;*/
	font-size: 400%;
 /*z-index:2;*/
	height:50px;
	float:left;
	padding-left:0%;
/*margin:0;20px
padding:0;*/
}
#accordeons h5{
	padding-left:0%;
	
position:relative;
font-weight:normal;
text-shadow:0 1px 0 #bbb;
/*font-size:1.2em;
border-bottom:1px solid #555;
border-top:1px solid #aaa;

background:#888;
background:-webkit-gradient(linear,left top,left bottom,from(#999),to(#888));
background:-webkit-linear-gradient(top,#999,#888);
background:   -moz-linear-gradient(top,#999,#888);
background:    -ms-linear-gradient(top,#999,#888);
background:     -o-linear-gradient(top,#999,#888);
background:        linear-gradient(top,#999,#888);*/

/*border-radius
-webkit-border-radius:3px;
   -moz-border-radius:3px;
        border-radius:3px;*/
/*box-shadow
-webkit-box-shadow:0 0 5px black;
   -moz-box-shadow:0 0 5px black;
        box-shadow:0 0 5px black;*/
margin:0;
/*padding:0;20px*/


		
}
#accordeons h5 a{
display:block;
padding:0px 0 12px 0px;  /*<!-- margin:5% 10% 5% 10%;  haut droite bas gauche-->*/
color:#a4a4a4;
text-decoration:none;
	font-size: 2.5vw;

}
.accordeon:hover{
}
.accordeon div{
position:relative;
background:rgba(0,0,0,.7);
padding:15px;
margin-top:-3px;
color:#eee;
opacity:0;
/*transform*/
-webkit-transform:scaleY(0);
   -moz-transform:scaleY(0);
    -ms-transform:scaleY(0);
     -o-transform:scaleY(0);
        transform:scaleY(0);
/*transform-origin*/
-webkit-transform-origin:50% 0;
   -moz-transform-origin:50% 0;
    -ms-transform-origin:50% 0;
     -o-transform-origin:50% 0;
        transform-origin:50% 0;
/*transition*/
-webkit-transition:all .5s ease;
   -moz-transition:all .5s ease;
    -ms-transition:all .5s ease;
     -o-transition:all .5s ease;
        transition:all .5s ease;

}
.accordeon:hover div{
opacity:1;
/*transform*/
-webkit-transform:scaleY(1);
   -moz-transform:scaleY(1);
    -ms-transform:scaleY(1);
     -o-transform:scaleY(1);
        transform:scaleY(1);
}
.accordeon div p{
padding:5px;
			font-size: 2.1vw;

}
.accordeon div p a{
color:#eee;
text-decoration:none;
border-bottom:1px solid #ccc;
}
.accordeon div p a:hover{
color:white;
border-width:2px;
}
/*********************************TEXTE ACCORDEON *********************************/


/*Lumia 640 XL Résolution d'affichage: HD 720p (1280 x 720) Smartphones (landscape) */	  

	  /*@media screen and (min-width: 200px) and (max-width: 1300px) and (orientation: landscape){  si la largeur d'affichage est de 700 pixels ou plus et si l'écran est en orientation paysage*/
	  @media screen and (max-width: 1780px){  /* and (orientation: landscape)si la largeur d'affichage est sous 1780 pixels */
      #t1 {
         /*font-size: 400%;*/
		
      }
	  /*.t2 {
        font-size: 230%;
		display: inline-block;
		width: 100%;
		vertical-align: top;
		padding-right: 20px; 
background: linear-gradient(to top, rgba(0,153,151,0.6), rgba(0,153,151,0))
		}*/
		
	  .t3 {
        font-size: 300%;
		float: right;
		/*display: inline-block;*/
		width: 40%;
		/*border: 1px solid blue;*/
		vertical-align: top;
		margin-left: 20px;}
	   } /**/
	  @media screen and (max-width: 1000px){  /*si la largeur d'affichage est sous 1000 pixels */
      }
	  @media screen and (max-width: 600px){  /*si la largeur d'affichage est sous 1000 pixels */
      } 
	  
	  @media screen and (max-width: 400px){  /*si la largeur d'affichage est sous 1000 pixels */
#logo{
	display:block;
	width: 80%;
	border: 3px dotted #9999FF;
}
.accordeons{
	display:block;
	width: 100%;
	border: 3px dotted #9999FF;
} 
.accordeon{
	display:block;
	width: 100%;
	border: 3px dotted #9999FF;
	margin-bottom:20%;
} 
	  
	  
	  
	  
	  
	  
	  
	  /*@media screen and (min-width: 1000px) and (max-width: 1300px){  si la largeur d'affichage est de 700 pixels ou plus et si l'écran est en orientation paysage*/
      /*.t2 {
        font-size: 600%;
      } } */
	  /*@media (max-width: 480px) {  /*si la largeur d'affichage est de 480 pixels ou plus
      .t2 {
        font-size: 230%;
      } } */

    /* @media screen and (min-width: 150px) {
     .t1 {
        font-size: 400%;
      }
	  .t2 {
        font-size: 500%;
	  }
    }
    @media screen and (min-width: 480px) {
     .t1 {
        font-size: 400%;
      }
	  .t2 {
        font-size: 500%;
	  }
    }
    @media screen and (min-width: 768px) {
     .t1 {
        font-size: 400%;
      }
	  .t2 {
        font-size: 500%;
	  }
     }

    @media screen and (min-width: 1000px) {
     .t1 {
        font-size: 200%;
      }
	  .t2 {
        font-size: 500%;
	  }
    }
*/

/* #ID_Txt_aujourdhui{permet l'apparition progressive 
	display:none;  
}#ID_Txt_aujourdhui2{
	display:none;
}*/

/*.row{
	border: 1px solid blue; 
	font-size:2em;border: 1px solid red;
} */



/*.col-lg-10{
	border: 1px solid red;
} */




 


/*.col-lg-5{
font-size: 2vw
}  
.col-xs-12{
font-size: 50vw
} */ 

/*.col-xs-12{
font-size:small;
} */
/*[class*="col-lg"]{
	font-size:200%;
font-size: 1em;
font-size: small;
}  
[class*="col-xs"]{
	font-size:100%;
font-size: 1em;
font-size: small;
} */ 

/*définir la cible. En utilisant « > [class*=’col-‘] » nous affirmons vouloir appliquer la classe CSS « no-padding » à toutes classes « col- »*/