/**
 * Nom du theme : HomeWanted v1.0
 * Description : Theme du site HomeWanted v1.0.
 * Version : 1.0
 * Auteur : Petit Panda Rouge
 */

/**
 * Balises générales.
 */
 
body {
	font-family: 'Trebuchet MS', Arial, Sans-Serif, 'Century gothic', 'Lucida Grande', Verdana, Calibri;
	font-size: 14px;
	text-align: justify;
	margin: 0;
	padding: 0;
}

/**
 * En-tête.
 */
 
#header {
	background: url('../images/navigation/background.png') repeat-x top #a3ff82;
	border-bottom: 1px solid #254a17;
	overflow: hidden;
}

#logo {
	background: url('../images/logo.png') no-repeat top;
	height: 167px;
	width: 307px;
	margin: 0 10px 10px 20px;
	padding: 0;
	float: left;
}

#subtitle {
	float: right;
	margin: 30px 50px 0 0;
	width: 550px;
	text-align: center;
}

#header_content {
	clear: both;
	width: 920px;
	margin: auto;
}

/**
 * Spécifique à la page d'accueil.
 */
#home_picture {
	float: left;
	background: url('../images/accueil/photo.png') no-repeat top;
	margin: 20px 40px 20px 50px;
	height: 199px;
	width: 279px;
}

#explaination_link {
	float: right;
	background: url('../images/accueil/know_more.png') no-repeat bottom;
	color: #fff;
	display: block;
	font-size: 17px;
	margin: 0 10px 0 0;
	padding: 15px 13px 8px 33px;
}

/**
 * Menu.
 */
 
#navigation {
	padding: 42px 0 0 0;
	margin: 0;
	font-size: 1.2em;
	list-style: none;
}

	#navigation .home a {
		display: block;
		padding: 0.3em 33px 22px 0;
		background: url('../images/navigation/home-defaut.png') no-repeat bottom;
	}
	
	#navigation .home a:hover,
	#navigation .home #current{
		display: block;
		padding: 0.3em 33px 22px 0;
		background: url('../images/navigation/home-actif.png') no-repeat bottom;
	}
	
	#navigation .menu_item {
		padding: 0.3em 8px 0.2em 8px;
		text-transform: uppercase;
		border-left: 1px solid white;
	}
	
		#navigation .menu_item  a:link, 
		#navigation .menu_item  a:focus , 
		#navigation .menu_item  a:visited{
			color: #c1c1c1;
			text-decoration: none;
		}
		
		#navigation .menu_item a:hover {
			color: #a3ff82;
			text-decoration: none;
		}
	
	#navigation #current {
		color: #a3ff82;
	}

/**
 * Comportement des liens par défaut.
 */

a:link, a:focus , a:visited {
	color: #254a17;
	text-decoration: none;
}

a:hover {
	text-decoration: underline;
}

/**
 * Configuration de la page d'accueil.
 */
 
#home_page_content {
	background: url('../images/accueil/homme.png') no-repeat 1em 0.9em ;
	position: relative;
	height: 300px;
	padding: 20px 0 20px 0;
}
	
	#home_page_content .common_prop {
		float: left;
		width: 255px;
		position: absolute;
		padding: 0 0 0 25px;
		top: 40px;
	}
	
	#home_page_content #left_part {
		left: 100px;
	}
	
		#home_page_content #left_part .title {
			background: url('../images/accueil/titre_horloge.png') no-repeat top left;
			height: 70px;
			margin: 0;
		}
		
	#home_page_content #middle_part {
		background: url('../images/separation.png') no-repeat 0 2em;
		left: 390px;
	}
	
		#home_page_content #middle_part .title {
			background: url('../images/accueil/titre_cochon.png') no-repeat top left;
			height: 70px;
			margin: 0;
		}
	
	#home_page_content #right_part {
		background: url('../images/separation.png') no-repeat 0 2em;
		left: 680px;
		height: 250px;
	}
	
		#home_page_content #right_part .title {
			background: url('../images/accueil/titre_croix.png') no-repeat top left;
			height: 70px;
			margin: 0;
		}

/**
 * Configuration de la page de démarche.
 */
 
#picture_demarche {
	background: url('../images/demarche/photo.png') no-repeat;
	height: 380px;
	width: 270px;
}

#text_demarche {
	background-position: 0 90px;
	width: 640px;
}

#select_demarche {
	color: #254a17;
	cursor: pointer;
	float: right;
	font-weight: bold;
}

#details_demarche {
	clear: both;
	overflow: hidden;
	padding: 10px 0 30px 0;
}

	#details_demarche  .tabs-container {
		margin: 20px 10px 0 10px;
		padding: 10px;
		width: 330px;
		height: 250px;
		border: 1px dashed grey;
	}
	
	#details_demarche .tabs-nav {
		list-style: none;
		margin: 0 0 0 20px;
		padding: 0;
	}

		#details_demarche .tabs-nav a.tab-nav-common {
			display: block;
			text-decoration: none;
			padding: 1em 0 0 35px;
			height: 30px;
		}
		
		#details_demarche .tabs-nav a#validation {
			background: url('../images/demarche/validation_defaut.png') no-repeat bottom left;
		}
		
		#details_demarche .tabs-nav a:hover#validation,
		#details_demarche .tabs-nav .tabs-selected a#validation {
			background: url('../images/demarche/validation_actif.png') no-repeat bottom left;
		}
		
		#details_demarche .tabs-nav a#cahier {
			background: url('../images/demarche/cahier_defaut.png') no-repeat bottom left;
		}
		
		#details_demarche .tabs-nav a:hover#cahier,
		#details_demarche .tabs-nav .tabs-selected a#cahier {
			background: url('../images/demarche/cahier_actif.png') no-repeat bottom left;
		}
		
		#details_demarche .tabs-nav a#tarif {
			background: url('../images/demarche/billet_defaut.png') no-repeat bottom left;
		}
		
		#details_demarche .tabs-nav a:hover#tarif,
		#details_demarche .tabs-nav .tabs-selected a#tarif {
			background: url('../images/demarche/billet_actif.png') no-repeat bottom left;
		}
		
		#details_demarche .tabs-nav a#contrat {
			background: url('../images/demarche/stylo_defaut.png') no-repeat bottom left;
		}
		
		#details_demarche .tabs-nav a:hover#contrat,
		#details_demarche .tabs-nav .tabs-selected a#contrat {
			background: url('../images/demarche/stylo_actif.png') no-repeat bottom left;
		}
		
		#details_demarche .tabs-nav a#recherche {
			background: url('../images/demarche/loupe_defaut.png') no-repeat bottom left;
		}
		
		#details_demarche .tabs-nav a:hover#recherche,
		#details_demarche .tabs-nav .tabs-selected a#recherche {
			background: url('../images/demarche/loupe_actif.png') no-repeat bottom left;
		}
		
		#details_demarche .tabs-nav a#visite {
			background: url('../images/demarche/porte_defaut.png') no-repeat bottom left;
		}
		
		#details_demarche .tabs-nav a:hover#visite,
		#details_demarche .tabs-nav .tabs-selected a#visite {
			background: url('../images/demarche/porte_actif.png') no-repeat bottom left;
		}
		
		#details_demarche .tabs-nav a#achat {
			background: url('../images/demarche/bulles_defaut.png') no-repeat bottom left;
		}
		
		#details_demarche .tabs-nav a:hover#achat,
		#details_demarche .tabs-nav .tabs-selected a#achat {
			background: url('../images/demarche/bulles_actif.png') no-repeat bottom left;
		}
	
	/**
	 * The first section is the "How to?".
	 */
	#details_demarche #section-0 {
		text-align: center;
		padding: 130px 0 0 0;
		height: 140px;
	}

/**
 * Configuration de la page des services plus.
 */

#picture_services {
	background: url('../images/servicesplus/photo.png') no-repeat 0 1.5em;
	height: 310px;
	width: 375px;
}

#text_services {
	background-position: 0 90px;
	width: 525px;
}

	#text_services #services_description {
		background: url('../images/servicesplus/all_services.png') no-repeat;
		margin: 30px 50px;
		height: 116px;
	}

/**
 * Configuration de la page des honoraires.
 */
 
#picture_honoraires {
	background: url('../images/honoraires/photo.png') no-repeat 0 1.8em;
	height: 410px;
	width: 250px;
}

#text_honoraires {
	background-position: 0 100px;
	width: 640px;
}

	#text_honoraires #cochon {
		background: url('../images/honoraires/gros_cochon.png') no-repeat bottom right;
		float: right;
		height: 115px;
		width: 140px;
		padding: 30px 0 0 0;
	}
	
	#honoraires_examples {
		padding: 15px 0 0 0;
	}
	
		#honoraires_examples  .tabs-container {
			padding: 10px;
			width: 475px;
			height: 145px;
			clear: left;
			font-size: 11px;
			border: 1px dashed grey;
		}
		
		#honoraires_examples .tabs-nav {
			list-style: none;
			margin: 0 0 0 20px;
			padding: 0;
		}
	
			#honoraires_examples .tabs-nav a.tab-nav-common{
				display: block;
				text-decoration: none;
				float: left;
				padding: 0 10px 0 0;
			}

		/**
		 * The first section is the "How to?".
		 */
		#honoraires_examples #section-0 {
			text-align: center;
			padding: 70px 0 0 0;
			height: 95px;
			width: 495px;
		}
	
/**
 * Configuration de la page des contacts.
 */

#picture_contact {
	background: url('../images/contact/photo.png') no-repeat 0 1.5em;
	height: 400px;
	width: 240px;
}

#text_contact {
	background-position: 0 100px;
	width: 670px;
}

	#text_contact #form_contact {
		background: url('../images/contact/formulaire_rapide.png') no-repeat top left;
		padding: 45px 0 0 0;
		margin: 0 0 0 10px;
		width: 280px;
		float: left;
	}
	
		#text_contact #form_contact .input-style {
			font-family: 'Trebuchet MS', Arial, Sans-Serif, 'Century gothic', 'Lucida Grande', Verdana, Calibri;
			background: url('../images/contact/line_edit.png') no-repeat top left;
			border: none;
			padding: 5px 6px 5px 6px;
			margin: 0 0 2px 0;
		}
		
		#text_contact #form_contact .textarea-style {
			font-family: 'Trebuchet MS', Arial, Sans-Serif, 'Century gothic', 'Lucida Grande', Verdana, Calibri;
			font-size: 0.9em;
			background: url('../images/contact/text_edit.png') no-repeat top left;
			border: none;
			padding: 5px 6px 6px 6px;
			margin: 0 0 4px 0;
		}
		
			#text_contact #form_contact input.error {
				background: url('../images/contact/line_edit_error.png') no-repeat top left;
			}
		
		#text_contact #form_contact textarea {
			height: 70px;
			width: 267px;
		}
		
			#text_contact #form_contact textarea.error {
				background: url('../images/contact/text_edit_error.png') no-repeat top left;
			}
	
		#text_contact #form_contact .form-submit {
			background: url('../images/contact/submit.png') no-repeat top left;
			border: none;
			height: 28px;
			width: 73px;
			color: #c1c1c1;
			float: right;
			margin: 5px 0 0 0;
			padding-bottom: 2px;
			cursor: pointer;
		}

	#text_contact #direct_contact {
		background: url('../images/contact/contact_directe.png') no-repeat top left;
		padding: 45px 0 0 0;
		margin: 0 0 0 50px;
		width: 280px;
		float: left;
	}

	
/**
 * Tab widget commun properties.
 */

.tabs-hide {
	display: none;
}

.tabs-loading em {
    padding: 0 0 0 20px;
    background: url('../images/loading.gif') no-repeat 0 50%;
}

/**
 * Configuration générale des pages.
 */
 
#page_content {
	padding: 20px 0 20px 0;
	overflow: hidden;
}

/**
 * General error and information.
 * Shown as a popup.
 */
#dialog   #error {
	background: url('../images/information/error.png') no-repeat 0 0;
	padding: 0 0 0 55px;
	font-size: 13px;
	height: 100px;
}

#dialog  #information {
	background: url('../images/information/valid.png') no-repeat 0 0;
	padding: 0 0 0 55px;
	font-size: 13px;
	height: 100px;
}
 
/** 
 * Footer.
 */
 
#footer_green {
	clear: both;
	background-color: #a3ff82;
	border-top: 1px solid #254a17;
	padding: 20px 30px 20px 0;
	color: #696969;
	overflow: hidden;
}

	#footer_green #loupe{
		background: url('../images/footer/loupe.png') no-repeat top left;
		height: 90px;
		width: 48px;
		padding: 10px;
		float: left;
	}
	
	#footer_green #links {
		background: url('../images/footer/separation.png') no-repeat 0 1em;
		width: 210px;
		float: right;
		margin: 5px 0 0 35px;
		padding: 0 0 0 40px;
		color: #000000;
	}
	
		#footer_green #links #facebook {
			background: url('../images/footer/facebook.png') no-repeat bottom right;
			display: block;
			float: left;
			height: 32px;
			width: 32px;
			margin: 5px 0 0 20px;
		}
		
		#footer_green #links #wordpress {
			background: url('../images/footer/wordpress.png') no-repeat bottom right;
			display: block;
			float: left;
			height: 32px;
			width: 32px;
			margin: 5px 0 0 10px;
		}
		
		#footer_green #links #viadeo {
			clear: both;
			margin: 45px 0 0 0;
		}
		
			#viadeo ul {
				margin: 5px 0 0 20px;
				list-style: none;
				padding: 0;
				font-size: 0.8em;
			}
			
			#viadeo li {
				background: url('../images/footer/viadeo.png') no-repeat left;
				padding: 5px 0 0 25px;
				display: block;
			}
	
	#footer_green #resume {
		padding: 10px 0 0 0;
		font-size: 0.8em;
		overflow: hidden;
	}
	
#footer_black {
	clear: both;
	background-color: #000;
	border-top: 1px solid #c1c1c1;
	padding: 12px 0 12px 0;
	margin: 0 0 20px 0;
	color: #fff;
	border-top: 1px solid white;
}

	#footer_black #panda {
		float: right;
		background: url('../images/panda.png') no-repeat right;
		padding: 0 20px 18px 0;
		display: block;
	}

/**
 * Classes générales.
 */

/**
 * Défini l'espace en largeur sur lequel le site sera affiché. */ 
.main_part_width {
	width: 970px;
	margin: auto;
}

.align_left {
	float: left;
}

.align_right {
	float: right;
}

.limit_left {
	background: url('../images/separation.png') no-repeat;
	margin: 0 0 0 10px;
	padding: 0 0 0 40px;
}

.text_center {
	text-align: center;
}

.color_green {
	color: #a3ff82;
}
 
/**
 * Tips pour l'affichage de des pointillés quand on clique
 * sur un lien.
 */
:focus {
	outline:none
}