/* CSS Document */

/* Site gaycamer.com // ? 2008 GAYCAMER */

/* NORMALISATION
-------------------------------------------------------- */

/* Normalise les marges et le remplissage */
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, label, input, p, blockquote, th, td, form {
	margin: 0;
	padding: 0;
}

/* Normalise les tailles de polices pour les en-t?tes */
h1, h2, h3, h4, h5, h6 {
	font-size: 100%;
	font-weight: normal;
}

/* Supprime list-style pour les listes */
ul, ol {
	list-style: none;
}

/* Normalise les styles et graisses de fontes : font-style et font-weight sont "normal" */
address, caption, cite, code, dfn, em, strong, th, var {
	font-style: normal;
	font-weight: normal;
}

/* Supprime les bordures dans les tableaux */
table {
	border-collapse: collapse;
	border-spacing: 0;
}

/* Supprime les bordures dans les ?l?ments fieldset et img */
fieldset, img {
	border: 0;
}

/* Aligne le texte ? gauche dans caption et th */
caption, th {
	text-align: left;
}

/* Petite astuce pour apprendre aux utilisateurs ? cliquer sur les intitul?s */
label:hover {
	cursor: pointer;	
}

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

/* PAGE
-------------------------------------------------------- */

html {
	background: #242424 url(/img/background.jpg) repeat-x 0 0;
}

body {
	position: relative; /* important! */
	width: 760px;
	margin: 0 auto;
	/* padding-top: 130px; espace r?serv? ? la banni?re pub 728*90px */
	padding-top: 30px;
	font: 1em "Trebuchet MS", "Lucida Grande", "Lucida Sans Unicode", Verdana, sans-serif;
	color: #fff;
} 

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

/* HEADER
-------------------------------------------------------- */

#logo_ext { /* logo page d'accueil */
	height: 80px;
	background: transparent url(/img/hp/logo.jpg) no-repeat 0 0;	
}

#logo_ext h1, #logo_ext blockquote {
	position: absolute;
	text-indent: -9999px;
}

#logo_ext img {
	position: absolute;
	left: -30px;
	top: 175px;
	z-index: 100;
}

#connexion_hp h2 {
	position: absolute;
	text-indent: -9999px;
}

#connexion_hp form {
	padding-left: 284px;
	padding-top: 5px;
	height: 36px;
	background: transparent url(/img/hp/acces-membres.gif) no-repeat 0 0;	
}

#connexion_hp label {
	line-height: 31px;
	font-size: 0.8em;
	font-weight: bold;
	padding-right: 5px;
}

#connexion_hp input#log_pseudo {
	width: 135px;
}

#connexion_hp input#log_password {
	width: 85px;
}

input#log_submit {
	width: 49px;
	height: 30px;
	line-height: 45px;
	background: transparent url(/img/hp/bt-ok.gif) no-repeat 0 0;
	border: 0;
	color: #141414;
	font-size: 0;
	vertical-align: middle;
	cursor: pointer;
}

input#log_submit:hover {
	background-position: 0 -30px;
	color: #8c9517; 
}

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

/* CONTENT UPDATE (temporaire, le temps que les profils soient mis ? jour)
-------------------------------------------------------- */

#content_update {
	position: relative;
	width: 760px;
	height: 444px; /* Pour IE qui ne reconnait pas min-height */
	border-top: 1px solid #505050;
}

html>body #content_update { /* Pour les autres navigateurs qui int?grent min-height */
	height: auto;
	min-height: 444px; 
} 

#content_update h2 {
	padding-left: 284px;
	padding: 35px 0 20px 284px;	
	color: #c1d000;
	font-style: italic;
	font-size: 1.35em;
}

#content_update img {
	position: absolute;
	left: 0;
	top: 0;
}

#content_update form {
	padding-left: 284px;
	width: 476px;
	font-size: 0.9em;
}

#content_update strong {
	font-weight: bold;
}

#content_update p {
	padding-top: 4px;
	padding-bottom: 4px;
}

#content_update p.info {
	padding-top: 10px;
	padding-bottom: 20px;
}

#content_update label {
	float: left;
	display: block;
	width: 200px;
	padding-bottom: 2px;
}

#content_update input#cgu {
	margin-right: 5px;
	vertical-align: middle;
}

#content_update select#pays, #content_hp select#ville {
	min-width: 150px;
	max-width: 260px;
}

/* bouton "je valide" */
#content_update button#valide {
	margin: 20px 0 20px 200px;
	width: 112px;
	height: 62px;	
	line-height: 65px;
	background: transparent url(/img/bt-je-valide.png) no-repeat 0 0;
	border: 0;
	color: #141414;
	font-size: 0;
	vertical-align: middle;
	cursor: pointer;
}

#content_update button#valide:hover {
	background-position: 0 -62px;
	color: #869000;
}

#content_update a:link {
	color: #fff;
	text-decoration: underline;
}

#content_update a:visited {
	color: #fff;
	text-decoration: underline;
}

#content_update a:hover, #content_hp a:active {
	color: #c1d000;
	text-decoration: underline;
}

#content_update a.javascript {
	color: #000;
}

#content_update a.javascript:hover {
	text-decoration: none;
}

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

/* CONTENT HP
-------------------------------------------------------- */

#content_hp {
	position: relative;
	height: 444px; /* Pour IE qui ne reconnait pas min-height */
	background: transparent url(/img/hp/background-content.png) no-repeat 0 0;
}

html>body #content_hp { /* Pour les autres navigateurs qui int?grent min-height */
	height: auto;
	min-height: 444px; 
} 

#content_hp h2 {
	margin-left: 284px;
	width: 476px;
	height: 70px;
	color: #c1d000;
	font-style: italic;
	font-size: 1.35em;
	line-height: 70px;
}

#content_hp img {
	position: absolute;
	left: 0;
	top: 0;
}

#content_hp form {
	padding-left: 284px;
	width: 476px;
	font-size: 0.9em;
}

#content_hp p {
	padding-top: 4px;
	padding-bottom: 4px;
}

#content_hp p#p_email {
	font-style: italic;
}

#content_hp label {
	float: left;
	display: block;
	width: 200px;
	padding-bottom: 2px;
}

#content_hp input#cgu {
	margin-right: 5px;
	vertical-align: middle;
}

#content_hp select#pays, #content_hp select#ville {
	min-width: 150px;
	max-width: 260px;
}

#content_hp button#submit {
	margin: 10px 0px 20px 200px;
	width: 150px;
	height: 62px;
	line-height: 65px;
	background: transparent url(/img/hp/bt-inscription.png) no-repeat 0 0;
	border: 0;
	color: #141414;
	font-size: 0;
	vertical-align: middle;
	cursor: pointer;
}

#content_hp button#submit:hover {
	background-position: 0 -62px;
	color: #869000;  
}

#content_hp a:link {
	color: #fff;
	text-decoration: underline;
}

#content_hp a:visited {
	color: #fff;
	text-decoration: underline;
}

#content_hp a:hover, #content_hp a:active {
	color: #c1d000;
	text-decoration: underline;
}

#content_hp a.javascript {
	color: #000;
}

#content_hp a.javascript:hover {
	text-decoration: none;
}

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

/* CONTENT PAGES PUBLIQUES
-------------------------------------------------------- */

/* contenu page de confirmation d'enregistrement */
#content_register {
	position: relative;
	width: 760px;
	height: 444px;
	border-top: 1px solid #505050;
}

#content_register h2 {
	padding-left: 284px;
	margin-bottom: 40px;	
	color: #c1d000;
	font-style: italic;
	margin-top: 35px;
	font-size: 1.35em;
}

#content_register form {
	padding-left: 284px; /* place pour la photo */
	margin-right: 20px;
	font-size: 0.9em;
}

#content_register p {
	margin: 25px 0 25px 0;
}

#content_register strong {
	font-weight: bold;
}

/* bouton "je remplis mon profil" */
#content_register button#profil, #content_ext button#profil {
	margin: 20px 0px 20px 120px;
	width: 211px;
	height: 62px;
	line-height: 65px;
	background: transparent url(/img/bt-je-remplis.png) no-repeat 0 0;
	border: 0;
	color: #141414;
	font-size: 0;
	vertical-align: middle;
	cursor: pointer;
}

#content_register button#profil:hover {
	background-position: 0 -62px;
	color: #869000; 
}

#content_register img {
	position: absolute;
	left: 0;
	top: 0;
}

/* bouton "je valide" */
#content_register button#valide {
	margin: 0;
	width: 112px;
	height: 62px;
	line-height: 65px;
	background: transparent url(/img/bt-je-valide.png) no-repeat 0 0;
	border: 0;
	color: #141414;
	font-size: 0;
	vertical-align: middle;
	cursor: pointer;
}

#content_register button#valide:hover {
	background-position: 0 -62px;
	color: #869000;
}

#content_ext {
	position: relative;
	width: 760px;
	height: 444px; /* Pour IE qui ne reconnait pas min-height */
	border-top: 1px solid #505050;
}

html>body #content_ext { /* Pour les autres navigateurs qui int?grent min-height */
	height: auto;
	min-height: 444px; 
} 

#content_ext strong {
	font-weight: bold;
}

#content_ext h2, #content_ext h3 {
	padding-left: 284px;
	margin-bottom: 20px;	
	color: #c1d000;
	font-style: italic;
}

#content_ext h2 {
	margin-top: 35px;
	font-size: 1.35em;
}

#content_ext h3 {
	font-size: 1.05em;
}

p.requis { /* info champs obligatoires */
	font-style: italic;
	margin-bottom: 20px;
	padding-left: 284px;
	font-size: 0.9em;
}

span.asterisque {
	color: #c1d000;
}

#content_ext form p {
	clear: left;
}

/* mise en forme des labels */
#content_ext label.label, #content_ext span.label { 
	float: left;
	width: 200px;
	padding-bottom: 2px;
}

/* mise en forme des cases ? cocher */
#content_ext label.checkbox {
	float: left;
	margin-left: 200px;
	padding-bottom: 2px;
}

span.checkbox {
	float: left;
	display: block;
	padding-bottom: 10px;
}

span.checkbox_column {
	float: left;
	display: block;
	width: 138px;
	padding-bottom: 10px;
}

span.label {
	width: 200px;
	float:left;
}

#content_ext img {
	position: absolute;
	left: 0;
	top: 0;
}

#content_ext form {
	padding-left: 284px; /* place pour la photo */
	padding-bottom: 20px;
	font-size: 0.9em;
}

#content_ext form img {
	position: relative; /* photo portrait dans le flux */
	width: 166px;
	border: 1px solid #505050;
	margin-bottom: 10px;
}

#content_ext select {
	width: 250px;
}

#content_ext form p {
	padding: 4px 0 4px 0;
}

#content_ext #maxlength {
	padding-left: 200px;
}

#content_ext #annonce_rejet {
	margin-bottom: 10px;
	padding: 7px 10px 7px 10px;
	border: 2px solid #fff;
	text-align: justify;
}

#content_ext p.rejet {
	font-style: italic;
}

/* bouton "je continue" */
#content_ext button#etape {
	margin: 20px 0px 20px 200px;
	width: 148px;
	height: 62px;
	line-height: 65px;
	background: transparent url(/img/bt-je-continue.png) no-repeat 0 0;
	border: 0;
	color: #141414;
	font-size: 0;
	vertical-align: middle;
	cursor: pointer;
}

#content_ext button#etape:hover {
	background-position: 0 -67px;
	color: #869000; 
}

/* bouton "je valide" */
#content_ext button#valide {
	margin: 20px 0 20px 200px;
	width: 112px;
	height: 62px;
	line-height: 65px;
	background: transparent url(/img/bt-je-valide.png) no-repeat 0 0;
	border: 0;
	color: #141414;
	font-size: 0;
	vertical-align: middle;
	cursor: pointer;
}

/* bouton "je t?l?charge la photo" */
#content_ext button#telecharge {
	margin: 20px 0 20px 0;
	width: 228px;
	height: 62px;
	line-height: 65px;
	background: transparent url(/img/bt-je-telecharge.png) no-repeat 0 0;
	border: 0;
	color: #141414;
	font-size: 0;
	vertical-align: middle;
	cursor: pointer;
}

/* bouton "j'acc?de au site" */
button#acces {
	margin: 20px 0 20px 0;
	width: 168px;
	height: 62px;
	line-height: 65px;
	background: transparent url(/img/bt-j-accede.png) no-repeat 0 0;
	border: 0;
	color: #141414;
	font-size: 0;
	vertical-align: middle;
	cursor: pointer;
}

#content_ext button#valide:hover, #content_ext button#telecharge:hover, button#acces:hover {
	background-position: 0 -62px;
	color: #869000; 
}

#content_ext a:link, #content_register a:link {
	color: #fff;
	text-decoration: underline;
}

#content_ext a:visited, #content_register a:visited {
	color: #fff;
	text-decoration: underline;
}

#content_ext a:hover, #content_ext a:active, #content_register a:hover, #content_register a:active {
	color: #c1d000;
	text-decoration: underline;
}

#content_ext p.legende {
	margin-bottom: 20px;
}

#content_ext table th {
	width: 140px;
	height: 20px;
	font-weight: bold;
}

#content_ext table {
	margin-bottom: 20px;
}

#content_register p.confirm {
	margin-left: 284px;
	font-size: 14px; 
} 

#content_register ul#change_email {
	padding-left: 300px;
	font-size: 14px; 
	list-style-type: disc;
}


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

/* VERIFICATION DES FORMULAIRES
-------------------------------------------------------- */

.LV_valid {
	 display: none;
}
	
.LV_invalid {
	display: block;
	width: 460px; 
	margin: 8px 0 0 0;
	padding: 5px 8px 5px 8px;
	color: #000;
	background-color: #c1d000;
}

.erreur {
	margin: 2px 0 2px 0;
	padding: 5px 8px 5px 8px;
	color: #000;
	background-color: #c1d000;
}

select.validation-failed, input.validation-failed, textarea.validation-failed {
	/* border: 1px solid #c1d000; */
	/* background-color: #c1d000; */
}

.validation-advice {
	margin: 10px 0px 2px 0px;
	padding: 5px 8px 5px 8px;
	color : #000;
	background-color: #c1d000;
}

.custom-advice {
	margin: 4px 0;
	padding: 5px;
	padding-left: 7px;
	padding-right: 7px;
	background-color: #0769cc;
	color : #ffffff;
	font-weight: normal;
}

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

/* FOOTER
-------------------------------------------------------- */

#footer_hp, #footer_ext {
	position: relative;
	width: 760px;
	height: 170px;
	text-align: center;
}

#footer_hp {
	background: transparent url(/img/hp/background-footer.png) no-repeat 0 0;
}

#footer_ext {
	background: transparent url(/img/background-footer-ext.png) no-repeat 0 0;
}

ul#menu_ext {
	height: 26px;
	line-height: 25px;
	background-color: #1c1c1b;
	border-top: 1px solid #505050;	
	border-bottom: 1px solid #505050;
}

ul#menu_ext li {
	display: inline;
	font-size: 0.75em;
	font-weight: bold;
	padding-left: 8px;
	padding-right: 8px;
}

#footer_hp a:link, #footer_hp a:visited, #footer_ext a:link, #footer_ext a:visited {
	color: #fff;
	text-decoration: none;
}

#footer_hp a:hover, #footer_hp a:active, #footer_ext a:hover, #footer_ext a:active {
	color: #c1d000;
	text-decoration: none;
}

#footer_hp h3, #footer_ext h3 {
	position: absolute;
	left: 0;
	top: 96px;
	width: 760px;
	color: #c1d000;
	font-size: 0.75em;
}

ul#reseau_gaycamer {
	position: absolute;
	left: 0;
	top: 108px;
	width: 760px;
}

ul#reseau_gaycamer li {
	display: inline;
	font-size: 0.75em;
	padding-left: 5px;
	padding-right: 5px;
}

#footer_hp p, #footer_ext p {
	position: absolute;
	left: 0;
	top: 36px;
	width: 760px;
	font-size: 0.7em;
	color: #505050;
	text-align: right;	
}

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

/* BUTTONS
-------------------------------------------------------- */

button.b100, button.b150, button.b200, button.b250, button.b300 {
	margin: 10px 0 20px 0;
	height: 62px;
	padding-bottom: 18px;
	border: 0;
	color: #fff;
	font-size: 100%;
	font-weight: bold;
	text-align: center;
	cursor: pointer;
}

button.b100 {
	width: 100px;
	background: transparent url(/img/bg-button-100.png) no-repeat 0 0;
}

button.b150 {
	width: 150px;
	background: transparent url(/img/bg-button-150.png) no-repeat 0 0;
}

button.b200 {
	width: 200px;
	background: transparent url(/img/bg-button-200.png) no-repeat 0 0;
}

button.b250 {
	width: 250px;
	background: transparent url(/img/bg-button-250.png) no-repeat 0 0;
}

button.b300 {
	width: 300px;
	background: transparent url(/img/bg-button-300.png) no-repeat 0 0;
}

button.b100:hover, button.b150:hover, button.b200:hover, button.b250:hover, button.b300:hover {
	background-position: 0 -62px; 
}

button.margin1 {
	margin: 20px 20px 20px 430px;
}

button.margin2 {
	margin: 20px 20px 20px 200px;
} 

button.margin3 {
	margin: 20px 20px 20px 50px;
}

button.margin4 {
	margin: 20px 20px 20px 284px;
}   

#content_ext input#submit {
	float: left;
	margin: 10px 0 20px 0;
	width: 250px;
	height: 62px;
	padding-bottom: 18px;
	background: transparent url(/img/bg-button-250.png) no-repeat 0 0;
	border: 0;
	color: #fff;
	font-size: 100%;
	font-weight: bold;
	text-align: center;
	cursor: pointer;
	text-transform: uppercase;
}

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