/*Eléments principaux de la page */ 
 
body
{
	background-color: #6699FF; /* Le fond de la page sera bleu */
    color: BLUE; /* Le texte de la page sera bleu */
	
} 

#bloc_page
{
	
	margin: auto;
}

mark
{
	background-color: #CC0000;
	color: blue;
}
 
P
{
	color: blue;
	font-size: small;
}

strong
{
	font-weight: bold;
}

section h1, footer h1, nav a
{
	font-family: "Times New Roman";
	font-weight: bold;
} 

h1
{
	color: blue;
	font-size: 30px;
}
/*la propriété CSS text-transform: uppercase; (que nous n'avons pas vue auparavant) pour faire en sorte
que mes titres soient toujours écrits en majuscules. Cette propriété transforme en effet le texte en majuscules (elle peut aussi faire
l'inverse avec lowercase).*/

a  /* Liens par défaut (non survolés) */
{
   list- style-type: none;
   text-decoration: none;
   color: red;
   font-style: italic;
   font-size: 20px;
}

a:focus /* Quand le visiteur sélectionne le lien */
{
    background-color: #FFCC66;
}

a:hover /* Apparence au survol des liens */
{
   text-decoration: underline;
   color: green;
}

a:active /* Quand le visiteur clique sur le lien */
{
    background-color: #FFCC66;
}

nav ul 
{
   list- style-type: none;
      font-size: 20px;
}

nav li
{
   list- style-type: none;
   text-decoration: none;
}

/* Header */
header


#titre_principal

{
	display: inline-block;
	background-color: white;
	border: 3px solid BLUE;
	border-radius: 8px;
	box-shadow: 6px 6px 6px black;
	vertical-align: top;
}

#Agence, #Logos, #Gerante, #contact
{
	display: inline-block;
	vertical-align: top; 
	text-align:center;
	padding: 10px;

}

#Agence
{
	width: 300px;
	display: inline-block;
	margin-bottom: 0px;
} 

#Logos
{
	width: 155px;
	display: inline-block;
	margin-bottom: 0px;
	text-align: center;
} 

#Gerante
{
	width: 320px;
	display: inline-block;
	margin-bottom: 0px;
	font-size: 1.2em;
}

#contact
{
	width: 200px;
	height: 25px;
	right: 5px;
	bottom: 15px;
	background-color: #CCFFFF;
	border: 1px solid blue;
	border-radius: 5px;
	font-size: 1.2em;
	text-align: center;
	padding: 3px 8px 0px 8px;
	color: white;
	text-decoration: none;
} 

/* Section */
section


#Localisation

{
	display: inline-block;
	background-color: white;
	border: 3px solid BLUE;
	border-radius: 8px;
	box-shadow: 6px 6px 6px black;
	margin-top: 30px;
	vertical-align: top;
} 

#Ville, #Ref, #Prix
{
	display: inline-block;
	vertical-align: top; 
	text-align:center;
	padding: 10px;

} 

#Intro
{
	
	display: inline-block;
	margin-bottom: 0px;
} 

#Ville
{
	width: 320px;
	display: inline-block;
	margin-bottom: 0px;
} 

#Ref
{
	width: 150px;
	display: inline-block;
	margin-bottom: 0px;
} 

#Prix
{
	width: 300px;
	display: inline-block;
	margin-bottom: 0px;
}


/* Section2 */
section2


#Descriptif

{
	display: inline-block;
	background-color: white;
	border: 3px solid BLUE;
	border-radius: 8px;
	box-shadow: 6px 6px 6px black;
	margin-top: 30px;
	vertical-align: top;
	text-align:left;
	font-size: 20px;

}

#Detail, #Complet
{
	display: inline-block;
	vertical-align: top; 
	text-align:left;
	padding: 10px;
	border-radius: 8px;

}

#Detail
{
	left: 5px;
	width: 75px;
	display: inline-block;
	margin-bottom: 10px;
	font-size: 11px;
} 

#Complet
{
	
	display: inline-block;
	margin-bottom: 100px;
	font-size: 18px;
} 

DPE
{
	width: 840px;
}

#DPE
{
	position: fixed;
	right: 5px;
	text-align: right;
	font-size: 18px;
	margin-right: 10px;
	padding: 10px;
}


/* Section3 */
section3


#Diaporama

{
	display: inline-block;
	background-color: white;
	border: 3px solid BLUE;
	border-radius: 8px;
	box-shadow: 6px 6px 6px black;
	margin-top: 30px;
	vertical-align: top;
	font-size: 20px;
}
 
 
 /* Section4 */ 
 section4  
 
 
#Photos

{
	display: inline-block;
	background-color: white;
	border: 3px solid BLUE;
	border-radius: 8px;
	box-shadow: 6px 6px 6px black;
	margin-top: 30px;
	vertical-align: top;
}

/* Footer */

footer
{  
	display: inline-block;
	vertical-align: top; 
	text-align:center;
	padding: 10px;
	margin: auto;
	margin-top: 30px; 
	text-align: center;
		
}

#Print	
{
	display: inline-block;
	vertical-align: top;
	width: 200px;
	border: 2px solid blue;
	background-color: #99FFFF;
	text-align: center;
	font-size: 20px;
	border-radius: 8px;
	box-shadow: 6px 6px 6px black;
	font-size: 0.8em; 
}


#Retour
{
	display: inline-block;
	vertical-align: top;
	width: 200px;
	border: 2px solid blue;
	background-color: #99FFFF;
	text-align: center;
	font-size: 20px;
	border-radius: 8px;
	box-shadow: 6px 6px 6px black;
	font-size: 0.8em; 
}

#Accueil
{
	display: inline-block;
	vertical-align: top;
	width: 200px;
	border: 2px solid blue;
	background-color: #99FFFF;
	text-align: center;
	font-size: 20px;
	border-radius: 8px;
	box-shadow: 6px 6px 6px black;
	font-size: 0.8em; 
}
 

.arrondie {
	-moz-border-top-left-radius: 0px;
	-moz-border-top-right-radius: 25px;
	-moz-border-bottom-right-radius: 0px;
	-moz-border-bottom-left-radius: 25px;
	-webkit-border-top-left-radius: 0px;
	-webkit-border-top-right-radius: 25px;
	-webkit-border-bottom-right-radius: 0px;
	-webkit-border-bottom-left-radius: 25px;
	border-top-left-radius: 0px;
	border-top-right-radius: 25px;
	border-bottom-right-radius: 0px;
	border-bottom-left-radius: 25px;
    
}
.arrondie2 {
	-moz-border-top-left-radius: 25px;
	-moz-border-top-right-radius: 0px;
	-moz-border-bottom-right-radius: 25px;
	-moz-border-bottom-left-radius: 0px;
	-webkit-border-top-left-radius: 25px;
	-webkit-border-top-right-radius: 0px;
	-webkit-border-bottom-right-radius: 25px;
	-webkit-border-bottom-left-radius: 0px;
	border-top-left-radius: 25px;
	border-top-right-radius: 0px;
	border-bottom-right-radius: 25px;
	border-bottom-left-radius: 0px;
    
}
 
#menu {

color: blue;
padding: 0;
list-style: none;	 

display: inline-block;
	vertical-align: top; 
	text-align:center;

	margin: auto;
	margin-top: 30px; 
	text-align: center;
	
}
#menu li {
display: inline; /* affichage horizontal */
color: blue;
}
#menu li a {
padding: 5px 20px;
margin: 0;
background: #CCFFFF;
color: blue;
border: 2px solid #0033FF;
text-decoration: none;
text-decoration: none;
        -moz-border-radius: 10px 0 10px 0;
        -webkit-border-radius: 10px 0 10px 0;
        border-radius: 10px 0 10px 0;        
        -webkit-border-top-left-radius: 10px; /* pour Chrome */
        -webkit-border-top-right-radius: 0; /* pour Chrome */
      
}
#menu li a:hover, #menu li a:focus {
background: #FFCC99;
color: blue;
text-decoration: none;
        -moz-border-radius: 0 10px 0 10px;
        -webkit-border-radius: 0 10px 0 10px;
        border-radius: 0 10px 0 10px;        
        -webkit-border-top-left-radius: 0; /* pour Chrome */
        -webkit-border-top-right-radius: 10px; /* pour Chrome */
}
 .arrondi {     -moz-border-radius: 0;     -webkit-border-radius: 10px;     -khtml-border-radius: 0;     border-radius: 10px;     behavior: url(border-radius.htc); 
}


.button {
	display: inline-block;
   border-top: 1px solid #96d1f8;
   background: #66CCFF;
   background: -webkit-gradient(linear, left top, left bottom, from(#0066FF), to(#99FFFF));
   background: -webkit-linear-gradient(top, #0066FF, #99FFFF);
   background: -moz-linear-gradient(top, #0066FF, #99FFFF);
   background: -ms-linear-gradient(top, #0066FF, #99FFFF);
   background: -o-linear-gradient(top, #0066FF, #99FFFF);
   padding: 13.5px 25px;
   -webkit-border-radius: 16px;
   -moz-border-radius: 16px;
   border-radius: 16px;
   behavior: url(chemin/PIE.htc);
   -webkit-box-shadow: rgba(0,0,0,1) 0 1px 0;
   -moz-box-shadow: rgba(0,0,0,1) 0 1px 0;
   box-shadow: rgba(0,0,0,1) 0 1px 0;
   text-shadow: rgba(0,0,0,.4) 0 1px 0;
   color: white;
   font-size: 14px;
   font-family: Georgia, serif;
   text-decoration: none;
   vertical-align: middle;
   -webkit-border-radius: 16px 0 16px 0;
	margin-top: 10px;
   }
.button:hover {
   border-top-color: blue;
   display: inline-block;
   background: #FF99FF;
   background: -webkit-gradient(linear, left top, left bottom, from(#99FFFF), to(#FF99FF));
   background: -webkit-linear-gradient(top, #99FFFF, #FF99FF);
   background: -moz-linear-gradient(top, #99FFFF, #FF99FF);
   background: -ms-linear-gradient(top, #99FFFF, #FF99FF);
   background: -o-linear-gradient(top, #99FFFF, #FF99FF);
   -webkit-border-radius: 0 16px 0 16px;
   margin-top: 10px;
   color:blue;
   }
.button:active {
   border-top-color: #1b435e;
   display: inline-block;
   background: #0099FF;	
   margin-top: 10px;
   }	
   
.button2 {
   border-top: 1px solid blue;
   background: #66CCFF;
   background: -webkit-gradient(linear, left top, left bottom, from(#33FFCC), to(#33CCCC));
   background: -webkit-linear-gradient(top, #66CCFF, #99FFFF);
   background: -moz-linear-gradient(top,  #66CCFF, #99FFFF);
   background: -ms-linear-gradient(top, #66CCFF, #99FFFF);
   background: -o-linear-gradient(top,  #66CCFF, #99FFFF);
   padding: 5.5px 18px;
   -webkit-border-radius: 16px;
   -moz-border-radius: 16px;
   border-radius: 16px;
   -webkit-box-shadow: rgba(0,0,0,1) 0 1px 0;
   -moz-box-shadow: rgba(0,0,0,1) 0 1px 0;
   box-shadow: rgba(0,0,0,1) 0 1px 0;
   text-shadow: rgba(0,0,0,.4) 0 1px 0;
   color: blue;
   font-size: 12px;
   font-family: Georgia, serif;
   text-decoration: none;
   vertical-align: middle;
   -webkit-border-radius: 16px 16px 16px 16px;

   }
.button2:hover {
   border-top-color: blue;
   background: #FF99FF;
   
   color:blue;
   }
.button2:active {
   border-top-color: #1b435e;
   background: #66CCFF;
   }