.cf:before,
.cf:after {
    content: " "; /* 1 */
    display: table; /* 2 */
}

.cf:after {
    clear: both;
}

#wrap {
	width:80%;
	margin:auto;
	background-color:black;
	/*border: thin blue solid ;*/
}
#pagephoto {
	width:100%;
	
}
#duo {
	width:80%;
	margin:auto;
	/*border: thin black solid ;*/
}
#duoc {
	width:60%;
	margin:auto;
}
#mono {	
	width:40%;
	margin:auto;
}
#cadre {
	width:90%;
	padding:10px;
	margin:auto;
	background-color:white;
}
#dedicace {
	width:55%;
	margin:auto;
}


#texte {	
	width:40%;
	margin:auto;
	font-family:Arial, Helvetica, sans-serif;
	font-size:small;
	text-align:center;
	color: white;
}

#photocentre {
	width: 40%;
	margin:auto;
	/*border: thin black solid ;*/

}

#photocentre1 {
	width: 20%;
	margin:auto;
	/*border: thin red solid ;*/

}

.photo {
	width:48%;
}
.photo100{
	width:100%;
}

.photo60{
	width:60%;
}
.photo25 {
	width:24%;
}

.photo30{
	width:33%;
}

#menu {
	width:30%;	
	margin:auto;
	/*background-color:aqua;*/
}
#bouton {
position:relative;
bottom:-3px;
width:160px;
height:72px;
margin-left:auto;
margin-right:auto;

}

.posi {
    position:relative;
	bottom:10px;
	margin-left:8px;	
}
#lien1 {
	display:inline;
	
}

#lien2 {
	display:none;
	
}


@media screen and (max-width:800px)
{
	#duo, #duoc, #photocentre, #photocentre1 {	
	width:100%;	
}
body {
	background-color:black;
}
#texte {
	width:80%;
}
  
#texteintro {
	width:100%;
	font-size:small;
	
	color:green;
}
  #colonne {
	width:22em;
  }
#wrap {
	width:100%;
	
}
#cadre {
	width:100%;
	background-color:white;
}
#dedicace {
	width:100%;
}
#menu {
	width:80%;
	
	
}
.photo100, .photo30, .photo
{
	width:100%;
	padding: 4px;
	border: thin white solid ;
}
.photo25 {
	width:47%;
	border: medium white solid ;

}

#lien2 {
	display:inline;
	
}

#lien1 {
	display:none;
	
}

}