/*Général
-------------------------------------------------------------------------*/
* {
	border: 0;
	outline: none;
	margin: 0;
	padding: 0;
	font-size: 12px;
	font-family: Arial, Helvetica, sans-serif;
	font-style: normal;
	line-height: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	text-decoration: none;
	}

ul, li {
	list-style: none;
	}

strong {
	font-weight: bold;
	}

table {
	border-collapse: collapse;
	}

td {
	vertical-align:top;
	padding: 0;
	}

body {
	margin: 0;
	text-align: center;
	background: url(gifs/opale-renovation_01.jpg) repeat-x top #a9d1e0;
	}
	
	#container {
		text-align: left;
		width: 995px;
		margin: 0 auto;
		}



/*TEXTE
--------------------------------------------------------------------------*/
h1, h2, h2, h3, h5, h6, h7, p {
	text-align: left;
	font-family: Arial, Helvetica, sans-serif;
	}

h3 {
	font-size: 18px;
	padding: 0;
	margin: 0 15px;
	color: #000;
	}

h1 {
	font-size: 16px;
	font-weight: bold;
	background: url(gifs/opale-renovation_17.jpg) no-repeat;
	width: 558px;
	height:26px;
	padding: 15px 0 0 20px;
	margin: 0;
	color: #023570;
	}

h2 {
	font-size: 14px;
	font-weight: bold;
	margin: 0 15px;
	padding: .5em 0;
	color: #023570;
	clear: both;
	}

p {
	font-size: 12px;
	margin: 0 10px 0 20px;
	text-align: justify;
	padding-bottom: .66em;
	color: #555;
	line-height: 1.5em;
	}

	.impt {
		color: #942c2c;
		}
		
	.link {
	text-align: right;
	}
	
	.link a:link, .link a:visited{
	font-weight: bold;
	text-decoration: underline;
	color: #023570;
	background: url(gifs/01.gif) no-repeat left .5em;
	padding-left: 10px;
	}
	
	.link a:hover, .link a:active{
	text-decoration: none;
	}

/*--------------------------------------------------------------------------*/
.imag{
border: 1px solid #7aaac9;
float: left;
margin: 5px 15px 5px 0;
}

.imag2{
border: 1px solid #7aaac9;
float: right;
margin: 5px 0 5px 15px;
}

.imag0{
border: 1px solid #7aaac9;
}
/*--------------------------------------------------------------------------*/




/*Liens
-------------------------------------------------------------------------*/
a, a:link, a:visited, a:active {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #023570;
	font-weight: bold;
	text-decoration: underline;
	}

a:hover {
	text-decoration: none;
	color: #023570;
	}

a:focus {
	outline: 0;
	}



#footer a, #footer a:link, #footer a:visited, #footer a:active {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #023570;
	font-weight: normal;
	text-decoration: none;
	}

#footer a:hover {
	text-decoration: underline;
	color: #023570;
	}
/*--------------------------------------------------------------------------*/




/* Class 
--------------------------------------------------------------------------*/
.scrollbarre {
	overflow:auto;
}
/*--------------------------------------------------------------------------*/




/*=Newsletter 
--------------------------------------------------------------------------*/
.email_news {
	font-family: Geneva,Arial,Helvetica;
	font-size:11px;
	color: #3f5155;
	background-color:#ffffff;
	border: #3f5155 1px solid;
	padding:2px;
}

.bouton_news {
background: url(gifs/opale-renovation_41.jpg) no-repeat;
height: 18px;
width: 38px;
cursor: pointer;
border: 0;
}
/*--------------------------------------------------------------------------*/




/*=LIGHTBOX
--------------------------------------------------------------------------*/

#lightbox{
	background-color:#eee;
	padding: 10px;
	border-bottom: 2px solid #666;
	border-right: 2px solid #666;
	}
#lightboxDetails{
	font-size: 0.8em;
	padding-top: 0.4em;
	}	
#lightboxCaption{ float: left; }
#keyboardMsg{ float: right; }
#closeButton{ top: 5px; right: 5px; }

#lightbox img{ border: none; clear: both;} 
#overlay img{ border: none; }

#overlay{ background-image: url(gifs/overlay.png); }

* html #overlay{
	background-color: #333;
	back\ground-color: transparent;
	background-image: url(blank.gif);
	filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="gifs/overlay.png", sizingMethod="scale");
	}
/*--------------------------------------------------------------------------*/


/*BDD AUTO
-------------------------------------------------------------------------*/
.numpage {
}
.numpage_selec {
	color:#ff0000;
}
.bt_suivant{
}
.bt_precedent{
}
.liste_cat{
}
.fichierbin{
}
.photo{
}
/*-------------------------------------------------------------------------*/




/*NAV
-------------------------------------------------------------------------*/
#index {    /* "lien" sera notre conteneur, ici la balise div */
    width: 202px;  /* changer la largeur ici */
    height: 25px; /* changer la hauteur ici */
    background: url(gifs/over_16.jpg) no-repeat left top;    /* placement de l'image over */
}

#index a {    /* définition du lien qui occupera toute la place du conteneur */
    display: block;
    width: 100%;
    height: 100%;
    background: url(gifs/opale-renovation_16.jpg) no-repeat left top;    /* placement de l'image du menu */
    color: #000;
}

#index a:hover {    /* masquage de l'image1 au survol */
    background: transparent none;
}


#menuiserie-pvc {    /* "lien" sera notre conteneur, ici la balise div */
    width: 202px;  /* changer la largeur ici */
    height: 25px; /* changer la hauteur ici */
    background: url(gifs/over_19.jpg) no-repeat left top;    /* placement de l'image over */
}

#menuiserie-pvc a {    /* définition du lien qui occupera toute la place du conteneur */
    display: block;
    width: 100%;
    height: 100%;
    background: url(gifs/opale-renovation_19.jpg) no-repeat left top;    /* placement de l'image du menu */
    color: #000;
}

#menuiserie-pvc a:hover {    /* masquage de l'image1 au survol */
    background: transparent none;
}


#menuiserie-bois {    /* "lien" sera notre conteneur, ici la balise div */
    width: 202px;  /* changer la largeur ici */
    height: 25px; /* changer la hauteur ici */
    background: url(gifs/over_21.jpg) no-repeat left top;    /* placement de l'image over */
}

#menuiserie-bois a {    /* définition du lien qui occupera toute la place du conteneur */
    display: block;
    width: 100%;
    height: 100%;
    background: url(gifs/opale-renovation_21.jpg) no-repeat left top;    /* placement de l'image du menu */
    color: #000;
}

#menuiserie-bois a:hover {    /* masquage de l'image1 au survol */
    background: transparent none;
}


#menuiserie-alu {    /* "lien" sera notre conteneur, ici la balise div */
    width: 202px;  /* changer la largeur ici */
    height: 25px; /* changer la hauteur ici */
    background: url(gifs/over_22.jpg) no-repeat left top;    /* placement de l'image over */
}

#menuiserie-alu a {    /* définition du lien qui occupera toute la place du conteneur */
    display: block;
    width: 100%;
    height: 100%;
    background: url(gifs/opale-renovation_22.jpg) no-repeat left top;    /* placement de l'image du menu */
    color: #000;
}

#menuiserie-alu a:hover {    /* masquage de l'image1 au survol */
    background: transparent none;
}


#amenagement-interieur {    /* "lien" sera notre conteneur, ici la balise div */
    width: 202px;  /* changer la largeur ici */
    height: 25px; /* changer la hauteur ici */
    background: url(gifs/over_23.jpg) no-repeat left top;    /* placement de l'image over */
}

#amenagement-interieur a {    /* définition du lien qui occupera toute la place du conteneur */
    display: block;
    width: 100%;
    height: 100%;
    background: url(gifs/opale-renovation_23.jpg) no-repeat left top;    /* placement de l'image du menu */
    color: #000;
}

#amenagement-interieur a:hover {    /* masquage de l'image1 au survol */
    background: transparent none;
}


#construction-veranda {    /* "lien" sera notre conteneur, ici la balise div */
    width: 202px;  /* changer la largeur ici */
    height: 25px; /* changer la hauteur ici */
    background: url(gifs/over_24.jpg) no-repeat left top;    /* placement de l'image over */
}

#construction-veranda a {    /* définition du lien qui occupera toute la place du conteneur */
    display: block;
    width: 100%;
    height: 100%;
    background: url(gifs/opale-renovation_24.jpg) no-repeat left top;    /* placement de l'image du menu */
    color: #000;
}

#construction-veranda a:hover {    /* masquage de l'image1 au survol */
    background: transparent none;
}


#porte-de-garage {    /* "lien" sera notre conteneur, ici la balise div */
    width: 202px;  /* changer la largeur ici */
    height: 25px; /* changer la hauteur ici */
    background: url(gifs/over_26.jpg) no-repeat left top;    /* placement de l'image over */
}

#porte-de-garage a {    /* définition du lien qui occupera toute la place du conteneur */
    display: block;
    width: 100%;
    height: 100%;
    background: url(gifs/opale-renovation_26.jpg) no-repeat left top;    /* placement de l'image du menu */
    color: #000;
}

#porte-de-garage a:hover {    /* masquage de l'image1 au survol */
    background: transparent none;
}


#porte-entree {    /* "lien" sera notre conteneur, ici la balise div */
    width: 202px;  /* changer la largeur ici */
    height: 25px; /* changer la hauteur ici */
    background: url(gifs/over_27.jpg) no-repeat left top;    /* placement de l'image over */
}

#porte-entree a {    /* définition du lien qui occupera toute la place du conteneur */
    display: block;
    width: 100%;
    height: 100%;
    background: url(gifs/opale-renovation_27.jpg) no-repeat left top;    /* placement de l'image du menu */
    color: #000;
}

#porte-entree a:hover {    /* masquage de l'image1 au survol */
    background: transparent none;
}


#pose-escalier {    /* "lien" sera notre conteneur, ici la balise div */
    width: 202px;  /* changer la largeur ici */
    height: 38px; /* changer la hauteur ici */
    background: url(gifs/over_28.jpg) no-repeat left top;    /* placement de l'image over */
}

#pose-escalier a {    /* définition du lien qui occupera toute la place du conteneur */
    display: block;
    width: 100%;
    height: 100%;
    background: url(gifs/opale-renovation_28.jpg) no-repeat left top;    /* placement de l'image du menu */
    color: #000;
}

#pose-escalier a:hover {    /* masquage de l'image1 au survol */
    background: transparent none;
}


#opale-toiture {    /* "lien" sera notre conteneur, ici la balise div */
    width: 202px;  /* changer la largeur ici */
    height: 26px; /* changer la hauteur ici */
    background: url(gifs/over_29.jpg) no-repeat left top;    /* placement de l'image over */
}

#opale-toiture a {    /* définition du lien qui occupera toute la place du conteneur */
    display: block;
    width: 100%;
    height: 100%;
    background: url(gifs/opale-renovation_29.jpg) no-repeat left top;    /* placement de l'image du menu */
    color: #000;
}

#opale-toiture a:hover {    /* masquage de l'image1 au survol */
    background: transparent none;
}


#contact {    /* "lien" sera notre conteneur, ici la balise div */
    width: 202px;  /* changer la largeur ici */
    height: 25px; /* changer la hauteur ici */
    background: url(gifs/over_36.jpg) no-repeat left top;    /* placement de l'image over */
}

#contact a {    /* définition du lien qui occupera toute la place du conteneur */
    display: block;
    width: 100%;
    height: 100%;
    background: url(gifs/opale-renovation_36.jpg) no-repeat left top;    /* placement de l'image du menu */
    color: #000;
}

#contact a:hover {    /* masquage de l'image1 au survol */
    background: transparent none;
} 
/*--------------------------------------------------------------------------*/




/*MODELE
-------------------------------------------------------------------------*/
#gri {
background: #f8f8f8;}

#barry {
background: white;}

#lettre {
background: url(gifs/opale-renovation_25.jpg) no-repeat;
width: 215px;
height: 114px;
position: relative;}

#lettre table{
position:absolute;
bottom: 15px;
left: 30px;
}
/*--------------------------------------------------------------------------*/





/*INDEX
-------------------------------------------------------------------------*/

/*--------------------------------------------------------------------------*/





/*PAGES
-------------------------------------------------------------------------*/
.password {
width: 90%;
margin: 20px auto;}
.password td{
text-align: center;
width: 50%;
color: #555;
}

.qsd {
width: 100%;
}
.qsd td {
text-align: center;}
/*--------------------------------------------------------------------------*/



/*CONTACT
-------------------------------------------------------------------------*/

#contact_body {
width:  70%;
margin: 0 auto;
}

#contact_body p {
text-align: justify;
margin: 0;}

fieldset{
border: 1px solid #888;
padding: 5px 0;
margin-top: 10px;}

fieldset legend{
	line-height: 16px;
	text-align: left;
	color: #306851;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 13px;
	font-weight: bold;
	margin: 0 15px;
}

fieldset input{
border: 1px solid #aaa;}

fieldset label{}

fieldset textarea{
border: 1px solid #aaa;
vertical-align: text-top;}


	fieldset input:focus {
		border: 1px solid #306851;
		background: #fff;
	}
	
	fieldset textarea:focus {
		border: 1px solid #306851;
		background: #fff;
		}
		
#contact_body fieldset p{
margin-right: 100px;
text-align: right;}

input.contact_envoyer{
cursor: pointer;
text-align: center;
color: #fff;
font-weight: bold;
margin: 1em 0 .5em;
padding: .5em 1em;
background: #306851;
border: 0;}
/*--------------------------------------------------------------------------*/




/*footer
--------------------------------------------------------------------------*/
#hdp {
text-align: right;}

#footer {
padding: 5px;
text-align: center;
color: #555;}
/*--------------------------------------------------------------------------*//********************************************************************* Balise ****************************************************************/
form {
	padding: 0px;
	margin: 0px;
}

td {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-style: normal;
	line-height: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	color: #000000;
	text-decoration: none;
}

body {
	margin-left: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
}

/******************************************************************** Lien ******************************************************************/
a {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #000000;
	text-decoration: none;
}
a:link {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #000000;
	text-decoration: none;
}
a:hover {
	text-decoration: underline;
	color: #000000;
}
a:active {
	text-decoration: none;
	color: #000000;
}


/********************************************************************** Class **************************************************************/
.scrollbarre {
	overflow:auto;
}

/********************************************************************** Newsletter **************************************************************/
.email_news {
	font-family:Geneva,Arial,Helvetica;
	font-size:11px;
	color:#000000;
	background-color:#ffffff;
	border-bottom:#bbbbbb 1px solid;
	border-top:#bbbbbb 1px solid;
	border-left:#bbbbbb 1px solid;
	border-right:#bbbbbb 1px solid;
}

.bouton_news {
	font-family:Geneva,Arial,Helvetica;
	font-size:12px;
	color:#ffffff;
	background-color:#585858;
	border-bottom:#585858 1px solid;
	border-top:#585858 1px solid;
	border-left:#585858 1px solid;
	border-right:#585858 1px solid;
}

/**********************************************************BDD AUTO **************************************/
.numpage {
}
.numpage_selec {
	color:#ff0000;
}
.bt_suivant{
}
.bt_precedent{
}
.liste_cat{
}
.fichierbin{
}
.photo{
}
/**********************************************************************************************************/



/*********************************************************LIGHTBOX*****************************************/

#lightbox{
	background-color:#eee;
	padding: 10px;
	border-bottom: 2px solid #666;
	border-right: 2px solid #666;
	}
#lightboxDetails{
	font-size: 0.8em;
	padding-top: 0.4em;
	}	
#lightboxCaption{ float: left; }
#keyboardMsg{ float: right; }
#closeButton{ top: 5px; right: 5px; }

#lightbox img{ border: none; clear: both;} 
#overlay img{ border: none; }

#overlay{ background-image: url(gifs/overlay.png); }

* html #overlay{
	background-color: #333;
	back\ground-color: transparent;
	background-image: url(blank.gif);
	filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="gifs/overlay.png", sizingMethod="scale");
	}
	
/**********************************************************************************************************/
	
	
	#base {
	width: 630px;
	padding-right: 150px;
	height: 21px;
	line-height: 21px;
	text-align: right;
	color: #fff;
	font-size: 14px;
	font-weight: bold;
	background: url(gifs/images/opale-renovation_07.jpg) no-repeat;}
	
	#jm {
	width: 277px;
	height: 59px;
	background: url(gifs/images/opale-renovation_13.jpg) no-repeat;
	position: relative;}
	
		#jm a:link, #jm a:visited {
		position: absolute;
		right: 55px;
		top: 30px;
		text-decoration: underline;
		color: #000066;}
		
		#jm span {
		margin-left: 15px;}
	
	#info {
	width: 473px;
	padding-right: 30px;
	height: 59px;
	background: url(gifs/images/opale-renovation_14.jpg) no-repeat;
	color: #942C2C;
	text-align: center;}
	
		#info span {
		display: block;
		padding: 3px;
		color: #fff;
		font-size: 14px;
		font-weight: bold;
		}
	
	#jo {
	background: url(gifs/images/opale-renovation_15.jpg) no-repeat;
	width: 215px;
	height: 59px;
	position: relative;}
	#jm span {
	display: block;
	padding: 3px;
	color: #fff;
	font-weight: bold;
}
		#jo span {
	display: block;
	padding: 3px;
	color: #fff;
	font-weight: bold;
	position:absolute;
	left: -19px;
}
	
		#jo a:link, #jo a:visited {
		position: absolute;
		right: 55px;
		top: 30px;
		text-decoration: underline;
		color: #000066;}
		
	#bcont {
	width: 215px;
	height: 214px;
	background: url(gifs/images/opale-renovation_35.jpg) no-repeat;}
	
		#bcont p{
		text-align: center;
		padding-top: 30px;
		margin-left: -3px;}
	
#nav {
background: url(gifs/images/nav_16.jpg) no-repeat;
width: 202px;
height: 289px;}

#nav li a:link, #nav li a:visited{
display: block;
padding: 6px 15px;
#padding: 5px 15px;
color:#000066;
}

* html #nav li{
height: 25px;
}

* html #nav li.big{
height: 38px;
}

* html #nav li a:link, * html #nav li a:visited{
height: 1%;
padding: 2px 15px 0;
}

#new {
background: url(gifs/images/opale-renovation_32.jpg) no-repeat;
width: 289px;
height: 120px;
padding-top: 115px;
text-align: center;
color: #000066;
font-style: italic;
font-weight: bold;
font-size: 14px;
}

#new .impt {
font-style: italic;
font-weight: bold;
font-size: 14px;
}
.sd {
	float: right;
	margin-bottom: 15px;
	margin-left: 15px;
}
.biggy {
	font-size: 16px;
	font-weight: bold;
	color: darkblue;
}