/********************************************
   GENERAL
********************************************/
html {font-size: 100%;} 

body {margin:0; background: #fff url(../images/indexbg.jpg) repeat-x top center;font-family:Arial, Helvetica, sans-serif;font-size: .9em; color:#2b2b2b;} 

h1 {font: bold  1.4em Tahoma, Arial, sans-serif; margin:15px 0 0 200px;color: #000; }
h2 { font: bold 1.3em Tahoma, Arial, sans-serif; margin: 10px 0 5px 0px; color:#48c3c4;}
h2 span { text-transform:uppercase;}
a {color: #902e40;}
a:hover { color: #000; }
img { border:none; }
#content p {margin:10px; font-size: 1.1em;}
strong {color: #000;}

.align-center {text-align:center ;}
.align-right {text-align:right;}
.align-left {text-align:left;}
.float-left {float:left; display: inline;}
.float-right {float:right;display: inline;}
.clear {clear:both; height: 0.1%;}

/*BOX*/
#content {width:100%; margin-right:auto; margin-left:auto; }
#logo {max-width:150px; height:auto;float: left; display: inline;}
.love {max-width:12px; height:auto;}
.thumb {  background:#EEEEEE; border: 1px solid  #D4D4D4; padding: 15px;}
.vignette { margin: 2.2%; background:#EEEEEE; border: 1px solid  #D4D4D4; padding: 2%;width: 41%;}

#test {background: yellow; height: 10px;}
/*NUMERO*/

.titre_promo{font: bold  1.2em Tahoma, Arial, sans-serif; clear: both;}
.num_promo{font: bold  1.8em Tahoma, Arial, sans-serif;color:#902e40;}
.num_promo a{text-decoration: none;color:#902e40;}
.num_tarif{font-size:.8em; margin-bottom:7%;}
.flap  {max-width: 48px; height: auto;margin:0 5% 10% 0;}

/* Hotesse*/
#hotesse { margin: 1% 0 5% 5%; background: #635657;-moz-border-radius:5px;-webkid-border-radius:5px;-o-border-radius:5px;border-radius:5px; width: 50%; float:right; display: inline;}
#hotesse .image{background:#EEEEEE; border: 1px solid  #7b2837; padding: 2%; text-align: center; }
#hotesse a{text-decoration:none;}
#hotesse_top{text-transform: uppercase; color: #fff;font-weight: bold; font-size: 20px; padding: 5px 0 0 10px;letter-spacing: -1px; background:#2b2b2b;-moz-border-radius:5px 5px 0 0;-webkid-border-radius:5px 5px 0 0;-o-border-radius:5px 5px 0 0;border-radius:5px 5px 0 0;}
.linkround {margin:0 auto; padding:3% 0 5% 0;width: 80%; clear: both;}
.linkround a {margin: 10px auto; background:#e8e8e8; text-transform: uppercase; color: #c6283b;font-weight: bold; font-size: 1.5em; text-align: center; padding: 2px 0 0 0; margin: 10px 10px 0 0 ; letter-spacing: -1px;-moz-border-radius:5px 5px 5px 5px;-webkid-border-radius:5px 5px 5px 5px;-o-border-radius:5px 5px 5px 5px;border-radius:5px 5px 5px 5px;border: 2px solid  #000;padding: 5px;}
.linkround a:hover {background:#f8cfd4; color:#c6283b;border: 1px solid  #000;}
#numero{ margin: 0 1% 0 0; background:#2b2b2b;-moz-border-radius:5px;-webkid-border-radius:5px;-o-border-radius:5px;border-radius:5px;font: bold 1.2em Tahoma, Arial, sans-serif; color:#fff; text-align: center; padding: auto; width: 40%; float: left; display: inline; min-height: 50px;}
#numero p {color: #fff; font-size: 1em;}
#ici {float: right; display: inline;  text-align: center; margin: -1.5% 1% 1% 0;}
#ici a{font-size:2em;color:#ffb751; letter-spacing: -.025em; font-weight: normal; line-height: .8em;}
#ici a:hover{color:yellow;}
#ici span {font-size:.5em; letter-spacing: normal;}


/*FOOTER*/
#footer {padding:0; margin:0 auto; text-align:center;} 
#bg-footer{margin:0px ; padding:0px ; background: url(../images/bgfooter.jpg); clear: both;}
#copyright, #mention-legale a {font-size:.1.2em;color:#656565;font-weight: normal;text-decoration: none;}
#mention-legale a :hover {color:#902e40;}
#mention-legale {float: left; display:inline; text-align:left;margin: 10px 0 20px 15px;padding:0;}
#copyright {float: right; display:inline; text-align:right;margin:10px 15px 20px 0;padding:0;}
#job {width:325px;background:#c4435b;color:#fff;}

#slider {width: 96%; position: relative; overflow: hidden; -moz-border-radius:5px 5px 5px 5px;-webkid-border-radius:5px 5px 5px 5px;-o-border-radius:5px 5px 5px 5px;border-radius:5px 5px 5px 5px;background:#EEEEEE; border: 1% solid  #D4D4D4; padding: 2%;}

#sliderContent {width: 69%; margin: 0.5%;float: right; display: inline;}
.sliderNumero  { width: 29%; float: left; display: inline; margin-top: 1%;}
.sliderImage {position: relative;display: none; }
.sliderImage span  {position: absolute; font: 1.2em Arial, Helvetica, sans-serif;padding: 2%;width: 96%;background-color: #000;filter: alpha(opacity=60);-moz-opacity: 0.6; -khtml-opacity: 0.6;opacity: 0.6; color: #fff;display: none;}

.top {top: 0;left: 0;}
ul, li { list-style-type: none; margin:0; padding: 0;}
img {width:100%; height: auto;}


@media (min-width: 769px) {
#content, #footer { max-width: 1024px;}
}

@media (min-width: 769px) and  (max-width: 1000px) {
.titre_promo {font-size: 1.1em;}
.num_promo {font-size:1.6em;}
.flap  {max-width: 40px;}
}

@media (min-width: 769px) and  (max-width: 850px) {
.sliderImage span {font-size: 1.1em;}
.titre_promo {font-size: 1em; }
.num_promo {font-size:1.4em;}
.flap  {max-width: 35px;}
#hotesse {float:none; display:block; width: 100%; margin:0;}
.vignette { margin: 1.1%; padding: 1%; width: 20.5%;}
.linkround {padding:1% 0 2.5% 0;}
#numero p {font-size: .9em;}

}

@media (min-width: 621px) and  (max-width: 768px) {
h1{ font-size:1.3em; margin:15px 0 0 15px;}
.sliderImage span {font-size: 1em;}
.titre_promo {font-size:.9em; }
.num_promo {font-size:1.2em;}
.flap  {max-width: 30px;}
#hotesse {float:none; display:block; width: 100%; margin:0;}
.vignette { margin: 1%; padding: 1%; width: 20.5%;}
.linkround {padding:1% 0 2.5% 0;}
#numero p {font-size: .85em;}
}

@media (min-width: 481px) and  (max-width: 620px) {
#sliderContent {width: 100%; }
h1 {font-size:1.2em;margin:15px 0 0 15px}
.sliderNumero {width: 100%; float:none; display:block; margin:0 auto 0 auto;}
.num_promo,.sliderImage span {font-size: 1.1em;}
.titre_promo {font-size:.85em; }
.num_tarif{font-size:.6em;}
.flap  {max-width: 20px;}
#hotesse, #numero {float:none; display:block; width: 100%; margin:0;}
.vignette { margin: 2.2%; background:#EEEEEE; border: 1px solid  #D4D4D4; padding: 2%;width: 41%;}
.left {float:left; display: inline; width: 33.33%;}
}

@media (max-width: 480px) {
h1 {font-size:1.1em; margin:15px 0 0 15px;}
p{font-size: .9em;}
#content, #footer { min-width: 290px;}
#sliderContent {width: 100%; }
.sliderNumero {width: 290px; float:none; display:block; margin:0 auto 0 auto;}
.sliderImage span {font-size: .65em;}
.titre_promo {margin: 2%;}
#hotesse_top{font-size: 15px;}
#hotesse, #numero{float:none; display:block; width: 100%; margin:0;}
.vignette { margin: 2%; background:#EEEEEE; border: 1px solid  #D4D4D4; padding: 2%;width: 41%;}
.linkround a{font-size: 1.2em;}
#copyright, #mention-legale{float: none; display: block; margin:0 auto;text-align: center;}
}