p{text-indent:5px}
#conteneur{
	 background:none;
	 margin-left:-13px;

 }
 #position{
 background-color: #2d2d2d;
 }
#vide{
  height:20px;
    }
#text-info{
    margin-left:auto;
    margin-right:auto;
    width:800px;

   }
#fondimage{
        background-color: #fff;
		width:100%;
			   margin-top:0px;
	           }

#corps{
	height: 250px;
   }

.text1{

		color: #CC4E4F;
		font-size: 15px ;
		letter-spacing:8px;
		font-weight: bold;
		line-height: 1.4em;
		margin-top:25px;
		margin-bottom: 1.071em;
		text-transform: uppercase;
		margin-left:auto;
		margin-right:auto;

		font-family: Arial, Helvetica, sans-serif;
	}

.text2{

		color:#3a50ae;/* #BFBFBF;*/
		font-size: 12px ;
		font-weight: bold;
		line-height: 1.071em;
		margin-top:32px;
		margin-bottom: 1.071em;
		text-transform: uppercase;
		margin-left:auto;
		margin-right:auto;

		font-family: Arial, Helvetica, sans-serif;
		letter-spacing:4px;
	}
.text3{

		color: #CC4E4F;
		font-size:0.9em ;
		letter-spacing:8px;
		font-weight: bold;
		line-height: 1.3em;
		margin-top:4%;
		text-transform: uppercase;
		margin-left:auto;
		margin-right:auto;
		font-family: Arial, Helvetica, sans-serif;
		text-align:center;
		background-color:#eda;
		padding:2%;
		max-width:60%;
	}	
.fanfare{text-decoration:none;
          font-size:85%;
		  font-style: italic;
		  }	
.ui360{
	/*pour player fanfare*/
	margin-top:0.2em;
	text-align:left;
	float:left;
	width:100%;
		/*border-bottom: 1px solid red;*/
		border-bottom: 1px solid #808080;
	}

.ui360 a{
	font-size:100%;
	width:80%;

	}
.ui360 a.sm2_link{ /*pour la couleur du souligné du mp3)*/
	border-bottom: 0px solid #808080;
	margin-top:0%;
	}


	/*--pour colorbox---*/
a:link, a:visited{ color:#112233;} 
a{
	color: black; text-decoration: none;
	font-size: 12px; font-family: Arial, Helvetica, sans-serif;
}
h2{font-size:13px; margin:15px 0 0 0;}
#nav{
   width:35em;
    background-color:#2d2d2d; 
	border: solid #3a3e42;
	border-width: 0px 0;
	margin:0 0 0 0;/*pour eviter le décalage avec image du dessous*/
	}
#nav li:hover{
 /*width:7em;35em*/
 max-width:20%;
}
#nav li.sfhover {
       max-width:20%;
}
#nav li ul li{
text-align:left;
 }
#nav li ul li:hover{
	text-align:left;
	 max-width:100%;
	 }
.maintext3{
	background-color:#f5f5f5;
	margin-left:auto;
	margin-right:auto;
	width:95%;
	}
#bienvenue{  
		background-color:#555;/*09a6e0_#299f60*/
		padding:13px;
		width:86%;/*80*/
		margin-left:auto;
		margin-right:auto;
		/*border:1px solid grey;*/
		/*display:none;*/
      }

 #bienvenue p{
       color:#fff;
       /*font-size:1.2em;
	   letter-spacing:1px;*/
        }
 .infobox1{
	position:relative;
	max-width:95%;
	padding-top:30px;/*ajout 100px*/
	height:auto;
	clear: both;
	margin: auto;
	}
#nav a{
		font: 12px Arial, Helvetica, Verdana, sans-serif;
			}
			

.infobox1 p{
	font-family: Arial, Helvetica, sans-serif;
 font-size: 120%; 
 color: #4c4c4c; 
 	letter-spacing:1px;/*ajout*/
 text-decoration: none;
 text-align:left;
 z-index:-1

         }
.infobox1 a{
    line-height: 20px;
      }
.orchestrateur{
	font-size:1.3em;
	line-height:110%
	}	 
#maintext{
  font: 12px/13pt Arial,Helvetica,Verdana,sans-serif;
  text-align:cnter;
	    letter-spacing: 1px;
		width:100%;
	   }
.italique11{
   font-style:italic;
   font-size:0.8em;
      }
.maintext5  li {
      list-style-type:none;/* on annule la puce par défaut*/
  /* background: url("images/visu.png") no-repeat scroll 10px 15px;*/
	background: url("images/exclamation.png") no-repeat scroll 10px 15px;
	background-size:3%;
padding: 15px 10px 10px 45px;/*0 10px 10px 100px*/
}
li.eartraining{
background: url("images/oreille_icon_vert.png") no-repeat scroll 10px 15px;
	background-size:3%;
	}

.playbutton2{
	background: url("images/vinyl_player.png") no-repeat scroll 95% 15px;
	background-size:10%;
      /*padding: 15px 10px 10px 10px;*/
}
.playbutton2 a{
	  /*color:#BD1D49;*/
	  font-style: italic;
	  /*font-size:112%;*/

          }
.playbutton2 a:hover{
	  text-decoration:underline;

          }
.arrangement{
	background: url("images/score.png") no-repeat scroll 90% 95%;
	background-size:15%;
      /*padding: 15px 10px 10px 10px;*/
	  width:95%;
	}
li.score{
background: url("images/tierce3.svg") no-repeat scroll 10px 18px;
	background-size:4%;
	}

	
/*------------------smartphone---------------------------*/

@media only screen and (max-width:768px) {/*768*/

 body {
 background-color:black;
 max-width:80%;
 width:100%;
 text-align:center;
      }
#conteneur{

	   width:120%;
	   background:none;
	  	 margin-left:0px;
		 margin-top: 5%;
	   }
 #vide{
  display:none;
    }
 #corps2{
  margin-top:-12px;
	   }
   
#menudroiteMobilecontainer{
  float:right;
   	   display:block;
	   background-color:#00a185;/*#C03B00*/
	   width:205px;
	   height:16px;
	   margin-top:-10px;
  }
#menudroite{
    display:none;
  }
#menudroiteMobile{
   	   display:block;
	   background-color:#fff;
  }
	   
#text-info{
clear:both;
	   width:100%;
   padding-left:1%;
 margin-top:40px;
	   }
.maintext5{
	   width:98%;/*98%*/
	   padding-left:0%;/*10%*/
	   margin-left:-4%;/*ajjout-4%*/
      font: 15px Verdana,Arial,Geneva,Helvetica,sans-serif;
    letter-spacing: 0;
	   }
 .maintext5  li {
      list-style-type:none;/* on annule la puce par défaut*/
	  background:none;
}

 .maintext3{
    width:85%;
    }
#bienvenue p{
	   font-size:120%;
	   letter-spacing:1px;
	   	      }   


.playbutton2{
	text-align:center;
	background-color:#ffffff;
		
	/*width:870px;*/

	/*margin-top:-75px;*/
	    }
.playbutton2 a img {
	border:none;

}
 #fondimage{
	   display:block;
		height:auto;
	   margin-top:15px;
	   background-color:#956296;/*#956296*/
	
	     }
#corps{
 background-color:#956296;/*#956296couleur interieur du cadre changer aussi à #nav et #nav li et #fondimage*/
	 max-width:100%;
	 height:auto;/*23%*/
	  margin-left:1%;
       }

#position{
	    max-width:100%;
      height:auto;
	     }

#nav{
text-align:left;
	margin-left:-35px;
	    max-width:100%;
      height:auto;
	  	border: solid #3a3e42;
		 background-color:#956296;
	border-width: 0px 0;/*enlever la bordure*/
	
	     }
#nav li {
	float: left;
	padding: 0;
	width:90%;
	background-color:#000;/*couleur fond des titre*/
	background-color:#956296;
	}	   
#nav a {
color:#000;/*pour changer color des titres*/
}
#nav li ul {

background:#999900;
filter:alpha(opacity=90);
-moz-opacity:.90;
margin-left:65px;
}

#nav li ul li{
          background-color:#323232;/*couleur fond des sous ensembles*/
        }
#nav li:hover{

 max-width:30%;/*violet qui recouvre*/
}

#nav li ul li:hover{
text-align:left;
 max-width:100%;
 }

#nav li ul a {
color:#fff;
}
.fanfare{text-decoration:none;
          font-size:75%;
		  }	
.playbutton2{
	max-width:98%;
	}
.ui360 a{
	font-size:70%;
	width:100%;
	top:1px;
	}
.ui360 a.sm2_link{
	margin-left: 18%;
	margin-top: -16%;
	width: 83%;
	}
}
	
	/*------------------smartphone landscape---------------------------*/

@media only screen and (max-width:768px) and (orientation:landscape) {/*768*/


#corps{
 background-color:#956296;
 max-width:100%;
 height:auto;/*30%auto donne trop grand mais 23% un peu èpetit pour landscape*/
  margin-left:1%;
       }
 #vide{
  display:none;
    }
#bienvenue p{
	   /*font-size:0.8em;*/
	   letter-spacing:1px;
	   line-height: 1.4em;
	      }

.maintext5  {
	font-size:0.8em;
         }
.fanfare{text-decoration:none;
          font-size:110%;
		  }	
.text3{
	font-size:1.3em;
	}
.orchestrateur{
	font-size: 1.8em;
	}
 .ui360 a{
	font-size:110%;
	width:100%;
		}	
.ui360 a.sm2_link{
	margin-left: 0%;
	margin-top: 3%;
	width:83%;
	}
}
	
	 	/*----------------------ipad vertical-----------------------*/
@media only screen and (min-width:705px) and (max-width:838px)  {
body {
max-width: 100%;
width: 100%;
text-align: center;
}

#conteneur{
       /*max-width: 94%;*/
	   clear:both;
	   text-align:center;

	   }
#corps{
	max-width:100%;
	border: 1px solid #fff;
	height:auto;/*auto donne trop grand mais 23% un peu èpetit pour landscape*/
	margin-left:3%;
       }

 #position {
       background-color:#956296;
            } 

#nav li:hover{
	max-width:23%;/*violet qui recouvre43*/
}

#nav li ul li:hover{
	text-align:left;
	max-width:100%;
 }

#menudroite{
   	   display:none;
  }
#menudroiteMobilecontainer{
  float:right;
   	   display:block;
	   background-color: #F2F2F2;
	   width:205px;/*195px*/
	   height:18px;
	   margin-right:2%;
	   border-bottom: 1px solid #403f3f;
  }
   

#menudroiteMobile{
   	   display:block;
	   background-color:#fff;
  }

#fondimage {
	height:auto;
	background-color:#956296;/*#956296;*/
}
#text-info{
	clear:both;
    margin-left: auto;
    margin-right: auto;
	   /*width:100%;*//*90%*/
  /* padding-left:3%;*/
		   margin-left:1%;
		   margin-top:77px;
	   }
#bienvenue{
	width:90%;
	
} 
#bienvenue p{
	   font-size:125%;
	   	      }
	   
.maintext5{
	 /*  width:85%;
	   padding-left:10%;*/
	   width: 90%;
		padding-left: 5%;
       font: 15px Verdana,Arial,Geneva,Helvetica,sans-serif;
    letter-spacing: 0;
	   }
.maintext5  li {
      list-style-type:none;/* on annule la puce par défaut*/
  /* background: url("images/visu.png") no-repeat scroll 10px 15px;*/
	background: url("images/exclamation.png") no-repeat scroll 10px 15px;
	background-size:3%;
padding: 15px 10px 10px 45px;/*0 10px 10px 100px*/
}
li.eartraining{
background: url("images/oreille_icon_vert.png") no-repeat scroll 10px 15px;
	background-size:3%;
	}
.ui360 a.sm2_link{
	margin-left: -1%;
	margin-top: 3%;
	width:83%;
	font-size:90%;
	}
}
 	/*----------------------ipad lanscape-----------------------*/

@media only screen and (min-width:768px) and (orientation:landscape) {
body {
text-align:center;

max-width:100%;
}
 #conteneur{
       width:100%;
	   margin-left:auto;
       margin-right:auto;
	   	  	   }

#text-info{
	   width:94%;/*90%*/
       margin-top:5%;
	   }

 #bienvenue {
	width:83%;
	/*margin-left:11%;*/
	margin-left:auto;
	margin-right:auto;

     }
 #bienvenue p{
	   font-size:120%;
	   letter-spacing:1px;
	   	      }     
 #corps{/*le haut fonçé*/
  max-width:110%;
 height:auto;
  margin-left:8%;
       }
  #position{
	   margin-top:20px;
	   }
 #vide{
 display:block;
 height:2em;
    }
#fondimage{
   max-width:100%;
	   margin-top:0px;
	   }
 #nav {
	    width:35em;/*35em*/
	   }

#nav li{/*pour mettre menu gauche vertical ou en ligne*/
	  width:25%;/*25*/
	   }
#menudroite{
   	   display:block;
      }
 #menudroiteMobilecontainer{
   	   display:none;
	   }
 #bienvenue p{
	   font-size:120%;
	   letter-spacing:1px;
	   	      }  
  .maintext3{
	 /*margin-left:9%;*/
	 margin-left:auto;
	 margin-right:auto;
	  /*width:75%;*/
       }
 		  
 .maintext5{
	   width:85%;/*85*/
	   padding-left:6%;/*10*/
    font: 15px Verdana,Arial,Geneva,Helvetica,sans-serif;
	letter-spacing: 1px;
	   }
 .maintext5  li {
      list-style-type:none;/* on annule la puce par défaut*/
  /* background: url("images/visu.png") no-repeat scroll 10px 15px;*/
	background: url("images/exclamation.png") no-repeat scroll 10px 15px;
	background-size:3%;
padding: 15px 10px 10px 45px;/*0 10px 10px 100px*/
}
li.eartraining{
background: url("images/oreille_icon_vert.png") no-repeat scroll 10px 15px;
	background-size:3%;
	}
li.score{
background: url("images/tierce3.svg") no-repeat scroll 10px 18px;
	background-size:4%;
	}
li.plaisir{
	background: url("images/yeahh.svg") no-repeat scroll 10px 18px;
	background-size:4%;
	}
.ui360 a.sm2_link{
	margin-left: -1%;
	margin-top: 2%;
	width:88%;
	}
}
/*----------------------galaxy tab 10.1 portrait-----------------------*/
@media only screen and (min-width:800px) and (orientation:portrait){

.ui360 a.sm2_link{
	margin-left: -1%;
	margin-top: 0%;
	width:83%;
	}
}
/*----------------------galaxy tab 10.1 lanscape-----------------------*/
@media only screen and (max-width:1280px) and (orientation:landscape){

/*.ui360 a.sm2_link{
	margin-left: -1%;
	margin-top: 0%;
	width:83%;
	font-size:100%;
	}*/
}
/*----------------ecran plein ordi-----------------------------*/

@media only screen and (min-width:1025px){
body {
clear:both;
text-align:center;
width: 100%;
	   margin-left:auto;
       margin-right:auto;
}
u   { 

	  font-size:1.2em;
	  	 	       }
 #conteneur{

       margin-right:auto;
	   margin-left:-9px;
	   	margin-top:0px;
	  	   }
  #text-info{/*ajout*/
	   width:93%;/*90%*/
  margin-left:5%;;

	   }
 #corps{
 background-color:#fff;
       width:830px;
	   margin-left:auto;
       margin-right:auto;
	  	   }
 .maintext5{
  font: 13px/14pt Arial,Helvetica,Verdana,sans-serif;
	    letter-spacing: 1px;
		width:91%;/*680px 95%*/
		margin-left:-3%;
	

	   }
 #menudroiteMobilecontainer{
   	   display:none;
	   }

	.inline2{ text-decoration:none;
      }
	  li.eartraining{
background: url("images/oreille_icon_vert.png") no-repeat scroll 10px 15px;
	background-size:3%;
	}
li.score{
background: url("images/tierce3.svg") no-repeat scroll 10px 18px;
	background-size:4%;
	}
li.plaisir{
	background: url("images/yeahh.svg") no-repeat scroll 10px 18px;
	background-size:4%;
	}
 #corps{
 border:none;
 margin-top:2em;
   }
.ui360 a.sm2_link{ /*pour la couleur du souligné du mp3)*/
	/*border-bottom: 0px solid #808080;*/
	margin-top: 0%;
	}

}


/*new----*/
 #nav li a{color:#868585;}
 #nav a:hover{
	 color:#999;
	 background: #eaeaea;
	 }
 #nav li ul{background:#fff;}
	 #nav li ul a:hover{
	 color:#fff;
	 background: #8c8a8a;
	 }
 #nav{background:#fff}
.menudr a:visited{color:#959595}
.menudr a:link{color:#959595}
#menudroite{background-color:#fff}
#position{
	background-color:#fff;
	border-bottom: 2px solid #ccc;
	height: 22px;
	}
#conteneur{
	width:100%;
	}
#nav li:hover{
background: #e6e6e6;
padding-right:0.8em;

}
#fondimage{
	height:auto;
	background:#fff;
	margin-top: 3%;
	}
#fondimage img{	
	/*content:url(https://www.saxophone-nyon.ch/images/sax_site_01.jpg);*/
	/*content:url(https://www.micheldupuis.ch/arrangements/images/score_10.png);*/
	content:url(images/bande_09.jpg);
	  width: 80%;/*50*/
  object-fit: cover;
  margin:auto;
}
.text2{font-size:1.2em;}

/*---pour iphone---*/
  @media only screen and (max-width: 768px){
  
body{ max-width: 98%;}

.menudr a:visited , .menudr a:link {
  color: #fff;
}
#corps {
  background-color: #fff;
  border: 1px solid #fff;
  }
#nav li {
  background-color: #fff;
	}
#position {
  border-bottom: 2px solid #fff;
}
#fondimage img{	
	/*content:url(https://www.saxophone-nyon.ch/images/sax_site_01.jpg);*/
	content:url(images/bande_09.jpg);
	/*content:url(https://www.micheldupuis.ch/arrangements/images/score_10.png);*/
	  width: 100%;
  height: 100%;
  object-fit: cover;
}
}
/* pour élargir le tout*/
 @media only screen and (min-device-width: 1025px){

#corps {
  width: 90%;
	}
#text-info {
	padding-left:0px;
	}

}