/* Les éléments HTML en général
-------------------------------- */
* {
	margin:0;
	padding:0;
	outline:none;
	box-sizing:border-box;
		-webkit-box-sizing:border-box;
		-moz-box-sizing:border-box;
}

@font-face {
		font-family:'Texgyreadventor';
		src:url('font/texgyreadventor-regular.eot');
		src:url('font/texgyreadventor-regular.eot?#iefix') format('embedded-opentype'),
				url('font/texgyreadventor-regular.woff') format('woff'),
				url('font/texgyreadventor-regular.ttf') format('truetype');
		font-weight:normal;
		font-style:normal;
}
/**/
@font-face {
		font-family:'Texgyreadventor';
		src:url('font/texgyreadventor-bold.eot');
		src:url('font/texgyreadventor-bold.eot?#iefix') format('embedded-opentype'),
				url('font/texgyreadventor-bold.woff') format('woff'),
				url('font/texgyreadventor-bold.ttf') format('truetype');
		font-weight:bold;
		font-style:normal;
}
/**/
html, body {
	width:100%;
	background:#FFF url('site/fond-noel-2.jpg') no-repeat center top; background-attachment:fixed; background-size:cover;
	font-family:Arial, sans-serif;
	font-size:13px;
	font-weight:normal;
	color:#000;
	text-align:center;
}

a {color:#039; text-decoration:none;}
a:hover {color:#f00; text-decoration:underline;}

h1 {font-weight:bold;}
h2 {font-weight:bold; color:#ef94e6}

p { }

img {border:0;}

/* Les classes spécifiques
-------------------------------- */
.iNew {margin-left:5px;}
.dpn {display:none;}

.clear:after {content:".";	display:block; height:0; clear:both; visibility:hidden;}
br.clear {clear:both; margin-top:-15px;}

/* Les ID spécifiques
-------------------------------- */
/* La HP
-------------------------------- */
#Bebepassion {display:block; clear:both; width:1000px; height:100%; margin:0 auto; text-align:left;}
#PubH {clear:both; width:100%; height:90px; text-align:right; background:transparent;}
#PubH div.Lag728x90 {float:right; text-align:right; background-color:#FFF;}


/*-------- Header --------*/
#top {display:block; clear:both; float:left; width:100%; margin:0 auto; text-align:center;}
#header {display:block; clear:both; position:relative; width:100%; height:115px; padding:10px 0; text-align:center; background:transparent; z-index:1; border-top:5px solid #939;}
#hleft {position:relative; float:left; width:540px; height:90px; overflow:hidden; z-index:2;}
#hleft h1 {position:absolute; top:0px; left:0; width:inherit; height:inherit; background:transparent url('site/logo-bebepassion-n.png') no-repeat left top; text-indent:-5000px; z-index:10;}
#hleft #clogo {position:absolute; top:0; left:0; width:inherit; height:inherit; z-index:50;}
#hleft #clogo a {position:absolute; top:0; left:0; width:inherit; height:inherit; background:transparent url('site/px.png') no-repeat left top; text-indent:-5000px; z-index:50;}
#hright {position:relative; float:left; width:460px; height:90px; overflow:hidden; z-index:2;}
#hright h2 {position:absolute; top:0; left:0; width:inherit; height:inherit; background:transparent url('site/tagline-n.png') no-repeat left top; text-indent:-5000px; z-index:10;}

/*-------- Nav Top --------*/
#navigation {display:block; clear:both; float:left; width:100%; margin:0 auto; text-align:center;}
#navi {display:inline-block; clear:both; width:100%; height:auto; margin:0 auto; padding:8px 0 4px; border-top:2px solid #C9C; border-bottom:2px solid #C9C;}
#laNav {display:inline-block; clear:both; float:left; width:100%; font-family:arial, sans-serif; width:100%; z-index:100; text-align:center;}
#laNav ul {display:inline-block; margin:0 auto; list-style-type:none;}
#laNav ul li {display:inline-block; float:left;}
#laNav ul li a, .menu ul li a:visited {display:inline-block; text-decoration:none; padding:0 6px 0 7px; text-align:center; color:#939; font-family:'Texgyreadventor', Arial, sans-serif; font-size:1.1em; text-transform:uppercase; border-right:1px dotted #939; overflow:hidden;}

#laNav ul li.first a {background:transparent; padding-left:0;}
#laNav ul li.last a {background:transparent; padding-right:0; border-right:none;}
#laNav ul li.actif {background:url('site/nav-actif-bg.png') no-repeat 50% 90%;}
#laNav ul li.actif a {font-weight:bold;}
#laNav ul li:hover a {color:#C9C;}

#Page {clear:both; float:left; width:100%; background:#FFF;}

/* La Partie haute
-------------------------------- */
#Corps {clear:both; float:left; width:100%; margin-top:10px;}

#Left {display:inline-block; clear:both; float:left; width:540px;}
#Middle {display:inline-block; float:left; width:160px; padding:0 9px;}
#Right {display:inline-block; float:left; width:300px;}

#Quad {float:left; width:100%; height:400px; background:#FFF url('site/hpquad.jpg') no-repeat top right; border-radius:5px;}
#Quad img {float:left; margin-right:15px; border:0;}
#Quad a {display:block; text-decoration:none; font-family:'Texgyreadventor', Arial, sans-serif; color:#039; text-align:left;}
#Quad a:hover {text-decoration:underline;}
#QuadC {float:left; width:100%; height:165px; overflow:hidden;} /*carousel*/
#carousel {list-style-type:none;}
#carousel li {}
	.quadc_i {border:1px solid #000 !important; box-shadow:2px 2px 4px 0 rgba(161,73,161,0.9); margin:0 0 5px;}
	.quadc_c {font-size:0.8em; font-weight:normal; color:#609 !important;}
	.quadc_t {font-size:1.3em; font-variant:small-caps;}
	.quadc_tx {padding:2px 0; font-size:1em; line-height:1.3em; padding-right:10px;}
	.quadc_tx strong {font-weight:normal;}

#QuadN {float:left; width:100%; height:236px; overflow:hidden;} /*nip*/
#QuadN .nip {float:left; width:270px; height:116px; padding-top:15px; overflow:hidden;}
.nip1, .nip3 {padding-right:10px;}
.nip2, .nip4 {padding-left:10px;}
.nip p {font-family:'Texgyreadventor', Arial, sans-serif; font-size:0.85em; line-height:1.3em; text-align:justify; background-color:rgba(255, 255, 255, 0.5); padding:3px 5px 2px 0 !important;}
.nip .quadn_c {font-size:0.9em; font-weight:normal; color:#609 !important;}
.nip .quadn_t {font-size:1em;}
.nip .quadn_i {border:1px solid #000 !important; box-shadow:2px 2px 4px 0 rgba(161,73,161,0.9); margin:0 15px 10px 0;}

#Edito {clear:both; float:left; width:100%; height:195px; margin:20px 0 0; padding:0 20px 0; border:1px solid #E2BDE2; border-radius:5px;}
#Edito p.etit {clear:both; display:inline-block; margin:-16px 0 0; padding:0 5px 10px; color:#A149A1; background-color:#FFF; font-family:'Texgyreadventor', Arial, sans-serif; font-size:1.3em;}
#Edito p.etxt {clear:both; float:left; font-family:'Texgyreadventor', Arial, sans-serif; font-size:0.9em; line-height:1.3em;}
#Edito p.etxt strong {font-weight:normal;}
#Edito p.efin {clear:both; float:right; font-family:'Texgyreadventor', Arial, sans-serif;}

#relais1, #relais2 {clear:both; width:100%; overflow:hidden;}
#relais1 div, #relais2 div {width:100%; padding:10px 0;}
#relais1 div img, #relais2 div img {border:1px solid #E2BDE2 !important; border-radius:5px;}
#relais1 {height:400px;}
#relais2 {margin:20px 0 0;}

#sNav {clear:both; display:block; width:100%; padding:4px 0; border:0; background:#E2BDE2; text-align:center; border-radius:5px;}
#sNav ul {margin:0 auto; list-style-type:none;}
#sNav ul li {display:inline;}
#sNav ul li a {font-size:8pt; font-weight:bold; color:#A149A1; text-decoration:none; border-left:solid 1px #F9F0F9; padding:0 15px;}
#sNav ul li:first-child a {border-left:none;}
#sNav ul li a:hover {color:#F9F0F9;}

#Date {clear:both; float:left; width:100%; padding:6px 0;}

#SepD {clear:both; float:left; width:100%; height:10px; border-top:3px solid #CCE6FF;}
#IntroScroll {clear:both; float:left; background:#FFF url('site/entete_txt.gif') no-repeat bottom right; width:100%; height:105px; overflow:hidden;}
div[id=IntroScroll] {height:109px !important;}
#IntroScroll marquee {height:83px; width:200px; font-size:11px; font-weight:bold; color:#000; font-style:normal;}
#IntroScroll ul {list-style-type:none;}
#IntroScroll li {margin-bottom:10px;}
#IntroScroll a  {font-size:11px; font-weight:normal;  font-style:normal; color:#06c; text-decoration:underline;}
#IntroScroll span  {font-size:11px; font-weight:normal;  font-style:normal;}

#P300x250 {float:left; width:100%; height:250px; margin:3px 0 0;}
#P300x250 div.Lag300x250 {float:left; text-align:left; background-color:#FFF;}

#Indis {clear:both; float:left; width:100%; margin:20px 0 0; padding:0 20px 6px; border:1px solid #E2BDE2; border-radius:5px;}
#Indis p.itit {clear:both; display:inline-block; margin:-16px 0 0; padding:0 5px 5px; color:#A149A1; background-color:#FFF; font-family:'Texgyreadventor', Arial, sans-serif; font-size:1.3em;}
#Indis ul {text-align:left; list-style-position:inside;}
#Indis ul li {padding:2px 10px 2px 10px; color:#9AB;}
#Indis ul li a {font-size:9pt; font-weight:normal; color:#000; text-decoration:none;}
#Indis ul li:hover {color:#A149A1;}

#G300x60 {clear:both; float:left; width:100%; margin-top:10px;}

#Newsletter {clear:both; float:left; width:100%; font-family:arial; border:1px solid #E2BDE2; margin-top:10px; padding:5px 5px 0 5px; background:#E2BDE2 url('site/bg-nl.gif') no-repeat top left; border-radius:5px;}
#Newsletter span {float:left; font-weight:bold;}
#Newsletter form {float:left; margin:4px 0; padding:4px 0;}
#Newsletter input.adr_mail {padding-left:18px; background:#f1f0ed url('site/aro.gif') no-repeat 4px center;}

/* La Partie Basse
-------------------------------- */
#Menu {clear:both; float:left; width:100%; margin-top:10px; background:#FFF;}
#MenuA, #MenuD {float:left; width:247px;}
#MenuB, #MenuC {float:left; width:253px;}
#MenuA div, #MenuB div, #MenuC div, #MenuD div {clear:both; width:240px; margin:0 auto 10px; text-align:left; border:solid 1px #A149A1; border-radius:5px;}
#MenuA div {float:left; margin:0 0 10px;}
#MenuD div {float:right; margin:0 0 10px;}
#Menu h2 {clear:both; padding:3px 0; text-align:center; background:#E2BDE2 url('site/h3_bg_hp.gif') no-repeat top right; border-bottom:solid 1px #A149A1;}
#Menu h2 {font-family:'Texgyreadventor', Arial, sans-serif; font-size:11pt; font-weight:bold; text-decoration:none; color:#609;}
#Menu ul {padding:5px 0; list-style-type:none;}
#Menu ul li {padding:2px 5px 2px 10px;}
#Menu ul li a  {font-size:9pt; font-weight:normal; color:#000;}
#Menu ul li a:hover  {text-decoration:underline;}

#Info {clear:both; float:left; width:100%; text-align:center; margin-top:10px;}

#LiensB1, #LiensB2 {clear:both; float:left; width:100%; text-align:center; padding:10px 0;}
#LiensB1 {margin:5px 0; border-top:1px dashed #EEE; border-bottom:1px dashed #EEE;}
#LiensB2 {padding-top:0; border-bottom:1px dashed #EEE;}
#LiensB1 ul, #LiensB2 ul {list-style-type:none;}
#LiensB1 li, #LiensB2 li {display:inline; margin:0 5px;}
#LiensB1 a, #LiensB2 a {font-size:10px; font-weight:normal; color:#000; font-style:normal;}

#CopyR {clear:both; text-align:center; font-size:7pt; font-weight:normal;padding:10px;}
#Tracker {clear:both; text-align:center; font-size:5pt;}

#LiensP {clear:both; float:left; width:100%; text-align:center; padding:3px 0; border-top:1px dashed #EEE;}
#LiensP ul {list-style-type:none;}
#LiensP li {display:inline; margin:0 3px;}
#LiensP a {font-size:10px; font-weight:normal; color:#AAA; font-style:normal;}

#TrackerId {}
#Prez {}
#Foot {}

#bnews {width:230px; height:100px; overflow:hidden;}
#bnews div {height:100px; overflow:hidden; border:none; }
#bnews h1, #bnews h2, #bnews p {background:none; border:none; padding:1px 0; font-size:9pt; font-weight:normal;color:#000; text-align:left;}

/* le carousel
-------------------------------- */
.jcarousel-container {position:relative; width:540px; border-bottom:none;}
.jcarousel-clip {z-index:2; position:relative; width:540px; height:auto; overflow:hidden;}
.jcarousel-list {z-index:1; position:relative; top:0; left:0; overflow:hidden;}
.jcarousel-item {position:relative; float:left; width:540px; height:auto; list-style:none;}

.jcarousel-next,
.jcarousel-prev {
	z-index:3; position:absolute; display:none; top:0px; right:0px; width:16px; height:16px; cursor:pointer; background:#CF77CF url('site/nav_quad.gif') no-repeat 100% 0;
}
.jcarousel-next:hover {background-position:100% -16px; background-color:#F8A0F8;}

.jcarousel-prev {right:20px; background-position:0 0;}
.jcarousel-prev:hover {background-position:0 -16px; background-color:#F8A0F8;}

.jcarousel-prev-disabled,
.jcarousel-prev-disabled:hover,
.jcarousel-next-disabled,
.jcarousel-next-disabled:hover {
	cursor:default; background-position:0 -32px; background-color:#FFC8FF;
}

.jcarousel-next-disabled,
.jcarousel-next-disabled:hover {background-position:100% -32px;}


/* #Media Queries
-------------------------------- */
/* Smaller than standard 960 (devices and browsers) */
@media only screen and (min-width:1000px) {
}

@media only screen and (min-width:960px) and (max-width:999px) {
	#Bebepassion {width:950px;}
	#hright {width:410px;}
	#hright h2 {background:transparent url('site/tagline.png') no-repeat right top;}
	#laNav ul li a, .menu ul li a:visited {font-size:1em;}
	#Left {width:500px;}
	.jcarousel-container {width:500px;}
	.jcarousel-clip {width:500px;}
	.jcarousel-item {width:500px;}
	#QuadN .nip {width:250px;}
	#Middle {display:inline-block; width:150px; padding:0 4px;}
	#Right {width:300px;}
	#MenuA, #MenuD {float:left; width:233px;}
	#MenuB, #MenuC {float:left; width:240px;}
	#MenuA div, #MenuB div, #MenuC div, #MenuD div {width:230px;}}

/* Smaller than standard 960 (devices and browsers) */
@media only screen and (min-width:800px) and (max-width:959px) {
	#Bebepassion {width:800px;}
	#hright {width:260px;}
	#hright h2 {background:transparent url('site/tagline-small.png') no-repeat right top;}
	#laNav ul li a, .menu ul li a:visited {font-size:0.8em;}
	#Left {width:490px; margin-right:10px}
	.jcarousel-container {width:490px;}
	.jcarousel-clip {width:490px;}
	.jcarousel-item {width:490px;}
	#QuadN .nip {width:245px;}
	#Middle {display:none;}
	#Right {width:300px;}
	#MenuA, #MenuD {float:left; width:197px;}
	#MenuB, #MenuC {float:left; width:203px;}
	#MenuA div, #MenuB div, #MenuC div, #MenuD div {width:195px;}
}

/* Tablet Portrait size to tablette (devices and browsers) */
/* @media only screen and (min-width:760px) and (max-width:799px) {*/
@media only screen and (max-width:799px) {
	html, body {font-size:12px;}
	#Bebepassion {width:760px;}
	#hright {width:220px;}
	#hright h2 {background:transparent url('site/tagline-small.png') no-repeat right top;}
	#laNav ul li a, .menu ul li a:visited {font-size:0.8em;}
	#Left {width:450px; margin-right:10px}
	.jcarousel-container {width:450px;}
	.jcarousel-clip {width:450px;}
	.jcarousel-item {width:450px;}
	#QuadN .nip {width:225px;}
	#Middle {display:none;}
	#Right {width:300px;}
	#MenuA, #MenuD {float:left; width:187px;}
	#MenuB, #MenuC {float:left; width:193px;}
	#MenuA div, #MenuB div, #MenuC div, #MenuD div {width:185px;}
}

/* Tablet Landscape size (devices and browser) */
@media only screen and (min-width:480px) and (max-width:759px) {
}

/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
@media only screen and (max-width:479px) {
}