/*--------computer--------*/

@media screen and (min-device-width: 900px),
       screen and (min-width: 900px)
 {
 
 #smartphone { display: none; }


body         { background-color: #EEEEEE; color: #404040;  font-family: Arial ,Helvetica , Tunga, Microsoft Sans Serif  }

table        { vertical-align:top;}


.designation {font-size: 0.5em}
.commentaire       {  font-size: 0.8em; font-family: Arial ,Helvetica , Tunga, Microsoft Sans Serif ; text-align: justify; word-spacing:1px; color: #FFFFFF ; font-weight: none; valign: top; padding: 2px}
.arriereplan { background-color: #EEEEEE;}
.imgmargedroite {margin-right: 10px; margin-top:5px;  }
.imgmargegauche {margin-left: 50px; margin-top:5px; }

.popperlink {position:absolute;visibility:hidden;font-style: normal;background: black;padding: 0px; }


.tabtitre      {  color: #404040 ; font-size: 1.5em; font-weight: bold; text-align: center; }



.top         { text-align:center;text-decoration: none }
.titres       { color: #FFFFFF }

a { text-decoration: none; cursor:pointer; cursor:hand; }
a:link       {  font-size: 0.80em; color: #000080;font-weight: bold }
a:visited    { color: #800080;  font-size:0.80em; font-weight: bold }
a:active { color: #cc0000}
a:hover { color: #cc0000}

a.lien  { text-decoration: none; cursor:pointer;  cursor:hand;}
a.lien:link       {  font-size: 0.80em; color: #000080;font-weight: normal }
a.lien:visited    { color: #800080;  font-size: 0.80em;font-weight: normal}
a.lien:hover { color: #cc0000}
a.lien:active { color: #cc0000}

.jour 		 {font-size: 0.95 em;font-weight: bold;color: #404040}
.lieu		 {font-size: 1.5 em;font-weight: bold;color: #404040;align:left;width:90%;}
li			 {  font-size: 0.95em; color: #404040 }
ul           {  font-size: 0.9em; color: #FFFFFF }




/*-------- Image et legende--------*/
.imgmargedroite {margin-right: 10px; margin-top:5px }

//a img {
//color:#000
//border:2px solid #000
//}

.image {
	float: right;z-index:1; 
	margin-left: 10px;
	margin-right: 10px;
	margin-top: 5px;
	//border:5px;
	//bordercolor:  #404040;

	width: 8%;		
	}
#inside li {
    list-style-position: inside;
	float: left; z-index:1;
	margin-left: 10px;
	//margin-top: 1px;
	
	width: 95%;
	}
	
a.image { cursor:pointer; cursor:hand;}
a.image:link       {   color: #404040; }
a.image:visited    { color: #FFFFFF;   }
a.image:active { color: #cc0000}
a.image:hover { color: #cc0000}	
	
//a { text-decoration: none; cursor:pointer; cursor:hand; }
//a:link       {  font-size: 0.85em; color: #404040;font-weight: bold }
//a:visited    { color: #FFFFFF;  font-size:0.85em; font-weight: bold }
//a:active { color: #cc0000}
//a:hover { color: #cc0000}


/*-------- Fin Image et legende--------*/

	
/*-------- Popup image evenement--------*/
.popup_evenement_img { background-color: #000000 ;color: #FFFFFF;font-size: 0.97em; font-family: Arial ,Helvetica , Tunga, Microsoft Sans Serif  }
.popup_legende_img {position: relative;top: 40px ; color: #FFFFFF;font-size: 1em;text-align: center;margin-left: 25px;margin-right: 25px;}
.popup_img {position: relative;  top: 100px ; border: solid 2px #FFF;height: expression((this.offsetHeight>this.offsetWidth) ? 
      Math.min(parseInt(this.offsetHeight), 600 ) : true);}	
	
/*-------- Fin Popup image evenement--------*/


}




/*-------- Configuration smartphones--------*/
       


@media screen and (max-device-width: 899px),
       screen and (max-width: 899px)
 {

 
 #computer { display: none; }
 
 
 body         { background-color: #EEEEEE; color: #404040;  font-family: Arial ,Helvetica , Tunga, Microsoft Sans Serif  }

table        { vertical-align:top;}


.designation {font-size: 0.5em}
.commentaire       {  font-size: 0.8em; font-family: Arial ,Helvetica , Tunga, Microsoft Sans Serif ; text-align: justify; word-spacing:1px; color: #FFFFFF ; font-weight: none; valign: top; padding: 2px}
.arriereplan { background-color: #EEEEEE;}
.imgmargedroite {margin-right: 10px; margin-top:5px;  }
.imgmargegauche {margin-left: 10px; margin-top:5px; }

.popperlink {position:absolute;visibility:hidden;font-style: normal;background: black;padding: 0px; }


.tabtitre      {  color: #404040 ; font-size: 1.5em; font-weight: bold; text-align: center; }



.top         { text-align:center;text-decoration: none }
.titres       { color: #FFFFFF }

a { text-decoration: none; cursor:pointer; cursor:hand; }
a:link       {  font-size: 0.80em; color: #000080;font-weight: bold }
a:visited    { color: #800080;  font-size:0.80em; font-weight: bold }
a:active { color: #cc0000}
a:hover { color: #cc0000}

a.lien  { text-decoration: none; cursor:pointer;  cursor:hand;}
a.lien:link       {  font-size: 0.95em; color: #000080;font-weight: normal }
a.lien:visited    { color: #800080;  font-size: 0.80em;font-weight: normal}
a.lien:hover { color: #cc0000}
a.lien:active { color: #cc0000}

.jour 		 {font-size: 2em;font-weight: bold;color: #404040}
.lieu		 {font-size: 0.98em;font-weight: bold;color: #404040;align:left;width:90%;}
li			 {  font-size: 0.95em; color: #404040 }
ul           {  font-size: 0.9em; color: #FFFFFF }




/*-------- Image et legende--------*/
//a img {
//color:#000
//border:2px solid #000
//}

.image {
	float: right;z-index:1; 
	margin-left: 10px;
	margin-right: 50px;
	margin-top: 5px;
	//border:5px;
	//bordercolor:  #404040;

	width: 8%;		
	}
#inside li {
    list-style-position: inside;
	float: left; z-index:1;
	margin-left: 2px;
	//margin-top: 1px;
	
	width: 95%;
	}
	
a.image { cursor:pointer; cursor:hand;}
a.image:link       {   color: #404040; }
a.image:visited    { color: #FFFFFF;   }
a.image:active { color: #cc0000}
a.image:hover { color: #cc0000}	
	
//a { text-decoration: none; cursor:pointer; cursor:hand; }
//a:link       {  font-size: 0.85em; color: #404040;font-weight: bold }
//a:visited    { color: #FFFFFF;  font-size:0.85em; font-weight: bold }
//a:active { color: #cc0000}
//a:hover { color: #cc0000}


/*-------- Fin Image et legende--------*/

	
/*-------- Popup image evenement--------*/
.popup_evenement_img { background-color: #000000 ;color: #FFFFFF;font-size: 0.97em; font-family: Arial ,Helvetica , Tunga, Microsoft Sans Serif  }
.popup_legende_img {position: relative;top: 40px ; color: #FFFFFF;font-size: 1em;text-align: center;margin-left: 25px;margin-right: 25px;}
.popup_img {position: relative;  top: 100px ; border: solid 2px #FFF;height: expression((this.offsetHeight>this.offsetWidth) ? 
      Math.min(parseInt(this.offsetHeight), 600 ) : true);}	
	
/*-------- Fin Popup image evenement--------*/


}