/* CSS styles by DanielSan ( danielsandesign@gmail.com )*/

/* Feuille de styles pour le template en général */


/* DEBUT Balises générales */

html, body {
	background-color: #00A0C6;
	margin: 0px;
	padding: 0px;
	background-repeat: no-repeat;
	background-position: center center;
	height: 100%;
	font-family: Arial, Helvetica, "Liberation Sans", FreeSans, sans-serif;
	font-size: 12px;
	color: #3F3F3F;
}

	body.template_general { /* un arriere plan différent pour les pages de description des produits */
	background-image: url(../img_template/arriere-plan.jpg);
	}
	
	body.template_boutique { /* un arriere plan différent pour les pages de description des produits */
		background-image: url(../img_template/arriere-plan_boutique.jpg);
	}

img {
	border: 0px;
}

div { border: 0px solid red;}

p, ul, li {margin: 0px; padding: 0px; display: block;}

p.p_normal {margin-top: 15px;}
ul.ul_normal {margin-top: 15px;}
li.li_normal {
	display: list-item;
	margin-top: 10px;
	margin-left: 30px;
	list-style-type: disc;
}

li { list-style-type: none;}

fieldset {
	clear: both;
	border-top-left-radius: 4px 4px;
	border-top-right-radius: 4px 4px;
	border-bottom-right-radius: 4px 4px;
	border-bottom-left-radius: 4px 4px;
}

input {
	border-top-left-radius: 4px 4px;
	border-top-right-radius: 4px 4px;
	border-bottom-right-radius: 4px 4px;
	border-bottom-left-radius: 4px 4px;
}

/* FIN balises générales*/
 
 
#page { /* cadre de la page pour centrer le contenu en hauteur et largeur */
	position:absolute;
	left: 50%;
	margin-left: -427px;
	top: 50%;
	margin-top: -255px;
	width: 855px;
	height: 570px;
}

h1 { /* Titre du site */
	position: absolute;
	top: 0px;
	left: 0px;
	width: 200px;
	padding: 0px;
	margin: 0px;
	font-size: 25px;
	font-weight: normal;
	color: #3F3F3F;
	text-align: right;
}

	h1 a {
		text-decoration: none;
		color: #3F3F3F;
	}

h2 { /* titre de la page */
	color: #000000;
}

h3 {
	border-bottom: 1px solid #027ABB;
	clear: both;
}

/* DEBUT du menu de gauche */
 
ul#menu {
	position: absolute;
	margin: 0px;
	padding: 0px;
	width: 215px;
	overflow: hidden;
	left: 2px;
	top: 95px;
}

	ul#menu li {
		list-style-type: none;
		display: block;
		margin: 0px;
		padding: 0px;
	}

	ul#menu li.invisible {
		display: none;
	}

		ul#menu a {
			display: block;
			width: 218px;
			padding-left: 200px; /* fait sortir le texte du lien du cadre */
			height: 60px;
			text-align: right;
			font-size: 14px;
			font-style: italic;
			font-weight: bold;
			color: #4F4F4F;
			text-decoration: none;
			background-repeat: no-repeat;
			background-position: top left; /* fait apparaitre la partie gauche du bouton */
		}

			ul#menu a:hover {
				background-position: top right; /* fait apparaitre la partie droite du bouton */
				width: 113px; /* fait entrer le texte du lien dans le cadre */
				height: 50px;
				color: #027ABB;
				padding-left: 95px;
				padding-right: 10px;
				padding-top: 10px;
			}

				.porte-cartes_aluminium {
					background-image: url(../img_template/porte-cartes_aluminium.jpg);
				}

				.porte-cartes_plastique {
					background-image: url(../img_template/porte-cartes_plastique.jpg);
				}

				.porte-cartes_signe-astrologique {
					background-image: url(../img_template/porte-cartes_signe-astrologique.jpg);
				}

				.porte-cartes_metallise {
					background-image: url(../img_template/porte-cartes_metallise.jpg);
				}

				.porte-cartes_gravure {
					background-image: url(../img_template/porte-cartes_gravure.jpg);
				}

				.porte-cartes_cuir {
					background-image: url(../img_template/porte-cartes_cuir.jpg);
				}

				.porte-cartes_serie-limitee {
					background-image: url(../img_template/porte-cartes_serie-limite.jpg);
				}

/* FIN du menu de gauche */
 
 
/* DEBUT du contenu */
  
h2 {
	position: absolute;
	left: 240px;
	top: 25px;
	display: block;
	margin: 0px;
	padding: 0px;
	width: 550px;
	font-size: 22px;
	text-align: left;
	font-weight: bold;
	font-style: italic;
}

	h2 strong {
		font-weight: normal;
		font-style: normal;
		font-size: 18px;
	}


#contenu { /* s'applique pour les pages autres que la description du produit */
	position: absolute;
	left: 238px;
	top:66px;
	width: 553px;
	height: 404px;
}

	#contenu strong {
		color: #027ABB;
	}
	
	#contenu.bg_page {
		background-image: url(../img_template/arriere-plan_page.jpg);
		background-repeat: no-repeat;
		background-position: top left;
	}

#contenu-article {
	margin: 25px;
	width: 495px;
	height: 350px;
	padding-right: 10px;
	overflow: auto;
}

#contenu-article.id_contactez-nous {
		background-image: url(../images/telephone.jpg);
		background-repeat: no-repeat;
		background-position: bottom right;
}


.gd_vignette {
	background-image: url(../img_template/gd_vignette.jpg);
	background-repeat: no-repeat;
	background-position: center center;
	width: 200px;
	height: 146px;
	padding: 23px 23px 26px 22px;
	float: left;
}

	.gd_vignette h3 {
		width: 200px;
		text-align: center;
		border: none;
		font-size: 18px;
		font-weight: bold;
		margin: 0px 0px 5px 0px;
		padding: 0px;
		color: #027ABB;
	}
	
	
		a.accueil_personnalisation_gravure-laser {
			display: block;
			background-image: url(../porte-cartes/aluminium/porte-cartes_gravure_personnalisee.jpg);
			background-repeat: no-repeat;
			background-position: right top;
			height: 110px;
			width: 100px;
			padding-right: 90px;
			padding-top: 10px;
			text-align: left;
			text-decoration: none;
			color: #3F3F3F;
		}
			a.accueil_personnalisation_gravure-laser:hover {
			background-position: right bottom;
			}
	
	
		a.accueil_personnalisation_doming {
			display: block;
			background-image: url(../porte-cartes/personnalisation/signe-astrologique/doming_signe-astro_diapo.gif);
			background-repeat: no-repeat;
			background-position: right bottom;
			height: 110px;
			width: 100px;
			padding-right: 90px;
			padding-top: 10px;
			text-align: left;
			text-decoration: none;
			color: #3F3F3F;
		}
	
		a.accueil_frais-de-port {
			display: block;
			background-image: url(../images/frais-de-port.jpg);
			background-repeat: no-repeat;
			background-position: center bottom;
			height: 120px;
			text-align: center;
			text-decoration: none;
			color: #3F3F3F;
		}
	
		a.accueil_made-in-france {
			display: block;
			background-image: url(../images/porte-cartes_made-in-france.jpg);
			background-repeat: no-repeat;
			background-position: right bottom;
			height: 89px;
			width: 84px;
			padding-right: 100px;
			padding-top: 10px;
			text-align: left;
			text-decoration: none;
			color: #3F3F3F;
		}
			a.accueil_made-in-france:hover {
			background-position: right top;
			}
	
		a.accueil_paypal {
			display: block;
			background-image: url(../images/logo_paypal_GD.jpg);
			background-repeat: no-repeat;
			background-position: center bottom;
			height: 116px;
			width: 0px;
			text-align: left;
			text-decoration: none;
			color: #3F3F3F;
			padding-left: 174px;
			margin-left: 12px;
			overflow: hidden;
		}
			a.accueil_paypal:hover {
			background-position: center top;
			}
			

/* DEBUT du menu en bas */
 
ul#menu-infos {
	margin: 0px;
	padding: 0px;
	position: absolute;
	left: 80px;
	top: 487px;
	width: 640px;
	height: 71px;
	overflow: hidden;
	text-align: center;
}

	#menu-infos li {
		display: block;
		float: left;
	}

		#menu-infos li.titre-liste { /* s'occupe du titre "Plus d'infos ?" */
			margin-top: 28px;
			margin-right: 20px;
			text-align: left;
			width: 60px;
		}

		#menu-infos a {
			display: block;
			width: 71px;
			height: 71px;
			line-height: 200px; /* fait sortir le texte du lien hors du cadre, comme le menu est en overflow: hidden ... */
			cursor: help;
		}


			#liens_votre-panier, /* arrieres plans des boutons */
			#liens_professionnels,
			#liens_carddeal,
			#liens_frais-port,
			#liens_personnalisation,
			#liens_cgv,
			#liens_copyright,
			#liens_contactez-nous {
				background-repeat: no-repeat;
				background-position: top center;
			}


			#liens_votre-panier {
				background-image: url(../img_template/votre-panier.jpg);
			}

			#liens_professionnels {
				background-image: url(../img_template/professionnels.jpg);
			}

			#liens_carddeal {
				background-image: url(../img_template/carddeal.jpg);
			}

			#liens_frais-port {
				background-image: url(../img_template/frais-port.jpg);
			}

			#liens_personnalisation {
				background-image: url(../img_template/personnalisation.jpg);
			}

			#liens_cgv {
				background-image: url(../img_template/cgv.jpg);
			}

			#liens_copyright {
				background-image: url(../img_template/copyright.jpg);
			}

			#liens_contactez-nous {
				background-image: url(../img_template/contactez-nous.jpg);
			}

				#liens_votre-panier:hover, /* changement des arrieres plans des boutons */
				#liens_professionnels:hover,
				#liens_carddeal:hover,
				#liens_frais-port:hover,
				#liens_personnalisation:hover,
				#liens_cgv:hover,
				#liens_copyright:hover,
				#liens_contactez-nous:hover {
					background-position: bottom center;
				}
				
				
#bouton-votre-sac {
	display: block;
	position: absolute;
	left: 785px;
	top: 170px;
	width: 94px;
	height: 94px;
	overflow: hidden;
	line-height: 200px;
	background-image: url(../img_template/bouton-votre-sac.jpg);
	background-repeat: no-repeat;
	background-position: bottom center;
	cursor: help;
}

	#bouton-votre-sac:hover {
		background-position: top center;
	}

.center-b {
	text-align: center;
	font-weight: bold;
	font-size: 14px;
	margin: 50px;
}


ul.puce_coche {
	margin-left: 70px;
}

	ul.puce_coche li {
		display: list-item;
		list-style-image: url(http://carddeal.com/images/coche.gif);
	}

#bas-de-page { /* cadre de la page pour centrer le contenu en hauteur et largeur */
	position:absolute;
	left: 50%;
	margin-left: -427px;
	top: 50%;
	margin-top: 280px;
	width: 855px;
	text-align: center;
	font-size: 10px;
}