


/*********************** RESET *****************************/
/*===========================================================*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
}

img, video, object, embed {
	display: block;
	width:100%;
	margin: 0 auto;
}

a {
	text-decoration: none;
	color: inherit;
}

.clearfix:before,
.clearfix:after {
    content: " "; 
    display: table;
}

.clearfix:after {
    clear: both;
}

li {
	list-style-type: none;
}

h1, h2, h3 {
	font-weight:normal;
}
button, .button{
	appearance:none;
	-moz-appearance:none; /* Firefox */
	-webkit-appearance:none; /* Safari and Chrome */
	background:transparent;
	margin:0; 
	padding:0;
	border:none;
	border-radius:0;
	line-height:normal; 
}
/*****	btn croix clean input text	********/
.btn-clean{
	display:none;
	background-size: 115%;
	background-position: 3% 94%;
	width: 1rem;
	height: 1.2rem;
}

.btn-clr-rouge{
	background-color: #d70505;
	color: #fff;
	margin: 2% 0;
	padding: 2% 0;
	width: 70%;
	cursor: pointer;
	-webkit-box-shadow: 0 0 0;
	-moz-box-shadow: 0 0 0;
	-o-box-shadow: 0 0 0;
	-ms-box-shadow: 0 0 0;
	box-shadow: 0 0 0;
	text-shadow: 0 0 0;
}

.btn-clr-bleu{
	background-color: rgba(0,120,255,1);
	color: #fff;
	border: 0;
	padding: 2% 0;
	width: 100%;
	cursor: pointer;
	-webkit-box-shadow: 0 0 0;
	-moz-box-shadow: 0 0 0;
	-o-box-shadow: 0 0 0;
	-ms-box-shadow: 0 0 0;
	box-shadow: 0 0 0;
	text-shadow: 0 0 0;
}


/*********************** FIN RESET *****************************/

/*********************** MEDIA QUERIES *****************************/

html {
	min-height:100%; 
	line-height:1.333; 
	font-size: 62.5%;
	font-family: arial, sans-serif;
    width: 100%;
    -webkit-text-size-adjust: none;
    -moz-text-size-adjust: none;
    -o-text-size-adjust: none;
    -ms-text-size-adjust: none;
    text-size-adjust: none;
}
/*================ Devices les plus petits --> inf�rieur � Iphone  =============*/
@media (min-width: 240px) and (max-width: 320px)
{
	html {
		font-size:11px;
	}
}
/*=================== Devices sup�rieur --> type StarOne =========================*/
@media (min-width: 321px) and (max-width: 399px)
{
	html {
		font-size:13px;
	}
}

/*================== Devices sup�rieur ++ --> type galaxy Note ===========================*/
@media (min-width: 400px) and (max-width: 767px)
{
	html {
		font-size:14px;
	}
}

/*====================== Devices type tablettes --> Ipad ====================================*/
@media (min-width: 768px) and (max-width: 1024px)
{
	html {
		font-size:27px;
	}
}

/*====================== Desktop ====================================*/
@media (min-width: 1025px)
{
	html {
		font-size:33px;
	}
}

/*====================== tab landscape ====================================*/

/*Ipad*/
@media (min-width: 768px) and (max-width: 1024px) and (min-aspect-ratio: 4/3)
{
	html {
		font-size:22px;
	}
}
/*Android*/
@media (min-width: 1025px) and (max-width: 1400px) and (min-aspect-ratio: 4/3)
{
	html {
		font-size:28px;
	}
}
/*********************** FIN MEDIA QUERIES *****************************/



/*********************** style global *****************************/
body {
	width:100%;
	height:100%;
	position: relative;
}
small{
	font-size:0.8rem;
}
.content {
	width:100%;
	position:relative;
	overflow:hidden;
	box-sizing: border-box;
	/*padding-top: 5.2rem;*/
}

.fix-nav-home .content {
	padding-top: 0;
}
.ellipsis {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  display:inline-block;
  position:absolute;
}
/* multi line ellipsis - default line clamp 2 lines*/
.ml-ellipsis {
  overflow : hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}
[class*=-wrapInBlk]{
	display:inline-block;
	vertical-align:top;
}


/*********************** font-style *****************************/
/*
--------- font-size name:-------------
M --> medium
X --> Large
XX --> larger
S --> Small
SS --> Smaller
MS --> Medium Small
bld --> Bold
------------------------------------
*/

[class*=bld]{
	font-weight:bold;
}
[class*=lgter]{
	font-weight:lighter;
}
[class*=upc]{
	text-transform:uppercase;
}
[class*=udl]{
	text-decoration:underline;
}
[class*=ft-M]{
	font-size:1.2rem;
	line-height:1.2rem;
}
[class*=ft-MS]{
	font-size:1rem;
	line-height:1rem;
}
[class*=ft-MSS]{
	font-size:.9rem;
	line-height:.9rem;
}
[class*=ft-MX]{
	font-size:1.5rem;
	line-height:1.5rem;
}
[class*=ft-X]{
	font-size:1.7rem;
	line-height:1.7rem;
}
[class*=ft-XX]{
	font-size:2.8rem;
	line-height:2.8rem;
}
[class*=ft-XXX]{
	font-size:5rem;
	line-height:5rem;
}
[class*=ft-XXXX]{
	font-size:13rem;
	line-height:13rem;
}
[class*=ft-XS]{
	font-size:1.6rem;
	line-height:1.6rem;
}
[class*=ft-S]{
	font-size:0.8rem;
	line-height:0.8rem;
}
[class*=ft-SS]{
	font-size:0.6rem;
	line-height:0.6rem;
}
/*---------- VERTICAL ALIGN   ----------*/
/*===================================== */
/* to align verticaly elements with unknowned height */
/* example */
/*	<div class="v-align-wrap">
		<div class="v-align"></div>
	</div> 
*/
/*===================================== */
.v-align-wrap {font-size:0;}
.v-align-wrap:before {content: ""; display: inline-block; height: 100%; vertical-align: middle;}
.v-align {display: inline-block; vertical-align: middle; letter-spacing: normal; word-spacing:normal;}

/*---------- FLOAT   ----------*/
.fl-left {float:left;}
.fl-right {float:right;}
.fl-clear {clear:both; line-height:1px; height:0; font-size:1px;}
.fl-cf:before, .fl-cf:after {content: " "; display: table;}
.fl-cf:after {clear: both;}

/*---------- ALIGNEMENT   ----------*/
.txt-center{
	text-align: center;
}


/*---------- ARROW   ----------*/
[class*="arrow"]{
	border-style: solid;
	border-width: 0.2rem 0.2rem 0 0;
	display: inline-block;
	height: 0.7rem;
	width: 0.7rem;
}

/*---------- TRIANGLE   ----------*/
[class*="triangle"]:before{
	content: " ";
	width: 0;
	height: 0;
	display:inline-block;
	border-style: solid;
	border-width: 0 0.5rem 0.5rem 0.5rem;
	border-color: transparent transparent #2c3241 transparent ;
	position:absolute;
}
[class*="triangle"]{
	width: 1rem;
	height: 0.5rem;
	display:inline-block;
	vertical-align: middle;
}
/*---------- DOUBLE TRIANGLE   ----------*/
.doubleTriangle:before{
	content: " ";
	width: 0;
	height: 0;
	display:inline-block;
	border-style: solid;
	border-width: 0 0.5rem 0.5rem 0.5rem;
	border-color: transparent transparent #2c3241 transparent ;
	position:absolute;
}
.doubleTriangle:after{
	content: " ";
	width: 0;
	height: 0;
	display:inline-block;
	border-style: solid;
	border-width: 0.5rem 0.5rem 0rem 0.5rem;
	border-color: #2c3241 transparent transparent transparent ;
	margin-top:0.7rem;
	position:absolute;
}
.doubleTriangle{
	width: 1rem;
	height: 0.5rem;
	display:inline-block;
	vertical-align: middle;
}




/*---------- TURN   ----------*/
[class*="turnUp"]{
	transform: rotate(0deg);
	-ms-transform: rotate(0deg);
	-webkit-transform: rotate(0deg);
	-moz-transform: rotate(0deg);
}
[class*="turnRight"]{
	transform: rotate(90deg);
	-ms-transform: rotate(90deg);
	-webkit-transform: rotate(90deg);
	-moz-transform: rotate(90deg);
}
[class*="turnDown"]{
	transform: rotate(180deg);
	-ms-transform: rotate(180deg);
	-webkit-transform: rotate(180deg);
	-moz-transform: rotate(180deg);
}
[class*="turnLeft"]{
	transform: rotate(270deg);
	-ms-transform: rotate(270deg);
	-webkit-transform: rotate(270deg);
	-moz-transform: rotate(270deg);
}
[class*="arrow-turnUp"]{
	transform: rotate(-45deg);
	-ms-transform: rotate(-45deg);
	-webkit-transform: rotate(-45deg);
	-moz-transform: rotate(-45deg);
}
[class*="arrow-turnRight"]{
	transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	-webkit-transform: rotate(45deg);
	-moz-transform: rotate(45deg);
}
[class*="arrow-turnDown"]{
	transform: rotate(135deg);
	-ms-transform: rotate(135deg);
	-webkit-transform: rotate(135deg);
	-moz-transform: rotate(135deg);
}
[class*="arrow-turnLeft"]{
	transform: rotate(-135deg);
	-ms-transform: rotate(-135deg);
	-webkit-transform: rotate(-135deg);
	-moz-transform: rotate(-135deg);
}


/*---------- HEADER --> (header-v2.ftl) ----------*/

header {
	margin: 0;
	position: fixed;
	width: 100%;
	z-index: 110;
	top:0;
}
header b{
    display: inline-block;
    margin: 1.5% 0 0;
    text-align: center;
    width: 100%;
    font-weight:normal;
}
.header {
	width: 96%;
	margin: 0 2%;
	position: relative;
	height: 3.2rem;
	font-size:0;
	z-index: 100;
}
.header .titre-page-recto{
	width: 60%;
	margin: 0;
    text-align: center;
    padding-left:20%;
}
.header button + .titre-page-recto{
    padding-left:0;
}
.header button, .header .right-button{
	width: 20%;
	text-align:right;
	margin-left:-1px;/* fix a bug in android tablet*/
}
.header button:first-child{
	text-align:left;
}
#overlay img:first-child{
	width:40%;
	margin-top:50%;
}
#overlay .loader{
	display: block;
	left: 45%;
	width: 10%;
	top: 30%;
	margin: 0 auto;
}
nav[role="navigation"] {
	width: 99.5%;
	margin-top:3.2rem;
	border-width:1px;
	border-style:solid;
	display: inline-block;
	position: relative;
	z-index: 60;
}
.fix-nav-home nav[role="navigation"]{
	margin-top: -0.2rem;
}
.fix-nav-home #page{
	padding-top: 3.4rem;
}
.fix-nav-contact nav[role="navigation"]{
	margin-top: 0;
}
.fix-nav-contact #page{
	padding-top: 3.2rem;
}
nav[role="navigation"] ul li {  
	display:inline-block;
	vertical-align: middle;
	margin: 0.2rem 0;
	/*width: 22.45%;*/
	width: 20%;	
	box-sizing:border-box;
	border-left:1px solid #ccc;
	height:2rem;
	line-height: 2rem;
}
nav[role="navigation"] ul li.home {  
	margin: 0;
	width: 10%;
	height: 2rem;
	border-left-width: 0px;
	background-image:url("../../images/pictos/sprite-nav.png");
	background-repeat: no-repeat;
	background-position: 40% -3.1rem;
	background-size: 1.8rem;
}
nav[role="navigation"] ul .home.current {  
	background-position: 35% 0rem;
}
nav[role="navigation"] ul li a {  
	display: block;
	/*width:100%;*/
	height:100%;
	text-align: center;
	color: #787883;
} 
nav[role="navigation"] ul li a span { 
	vertical-align:middle;
	display:inline-block;
	text-align: left;
}
nav[role="navigation"] ul li.lines {  
	line-height: 1rem;
}
nav[role="navigation"] ul li.onglet-bons-plans, nav[role="navigation"] ul li.onglet-recherche{
	width: 22%;
}
nav[role="navigation"] ul li.onglet-dm{
	width: 23%;
}

nav[role="navigation"] ul li.onglet-hotel{
	width: 13%;
}

nav[role="navigation"] ul li.onglet-sous-menu{
	width: 10%;
}

nav[role="navigation"] ul#sous-menu li{
	
}

.btn-menu {
	brder-left: 1px solid #ccc;
	display: inline-block;
	padding: 0 0 0 18%;
	vertical-align: middle;
	width: 100%;
	position: relative;
	right: 0;
	z-index: 99;
}

.btn-menu span {
	border: 1px solid #787883;
	display: block;
	margin-bottom: 12%;
	transform: rotate(0deg);
	width: 70%;
	-ms-transform: rotate(0deg);
	-webkit-transform: rotate(0deg);
}

.btn-menu span:first-child {
	margin-top: 0.25rem;
}

#sous-menu {
	background-color: #fff;
	display: none;
	width: 45%;
	position: absolute;
	top: 2.5rem;
	right: 0;
	z-index: 60;
	border-top: 1px solid #ccc;
}

#sous-menu li {
	display: block;
	position: relative;
	width: 100%;
	height: 3rem;
	line-height: 3rem;
	margin: 0;
}

#sous-menu li:before {
	content: '';
	display: block;
	width: 90%;
	height: 1px;
	background: #ccc;
	position: absolute;
	bottom: 0;
	left: 5%;
}

#sous-menu li:last-child:before {
	background: none;
	height: 0;
}

#sous-menu li a {
	display: block;
	
	padding: 0 0 0 8%;
	position: relative;
	font-size: 1rem;
	text-align: left;
}

/*********************** fin style global *****************************/

[class^=sprite-rating]{
	background-image:url("../../images/pictos/sprite-avis.png");
	background-repeat: no-repeat;
	display: inline-block;
	width: 13px;
	height: 14px;
	margin-right:-0.2rem;
	background-size:12px;
	vertical-align: middle;
}

.sprite-rating-high{
	background-position: 0 0;
}
.sprite-rating-middle{
	background-position: 0 -15px;
}
.sprite-rating-low{
	background-position: 0 -29px;
}
.sprite-rating-middlelow{
	background-position: 0 -43px;
}
.sprite-rating-middlehigh{
	background-position: 0 -57px;
}
[class*=sprite-common]{
	background-image:url("../../images/pictos/sprite-common.png");
	background-repeat: no-repeat;
}
[class*=sprite-sl]{
	background-image:url("../../images/pictos/sprite-sl.png");
	background-repeat: no-repeat;
}
.sprite-commonTel{
	background-position: right 0;
	background-size: 2.5rem;
	height:3rem;
}
.sprite-eco{
	background-image:url("../../images/sprite-ecotour.png");
	background-position: 0 0;
	background-size: 2.2rem;
	background-repeat: no-repeat;
}
h1{
	display: inline-block;
	font-size:1.7rem;
	width:100%;
}
.back-button {
	left: 0;
	padding: 0.8rem 0.5rem 1rem 1rem;
	background:url("../../images/btn/retour-button.png") no-repeat;
    background-size: contain;
}
.disc li{
	list-style-type:disc !important;
	list-style-position: inside;
}
.etoile{
	display: inline-block;
	width: 1.5rem;
	height: 1.5rem;
	font-size:1.7rem;
	margin-right:0.1rem;
}
.block-etoile{
	font-size:0;
}
/*------------------------------------------ Fin header--------------------------------------------*/
	
/*--------------------------------------------footer---------------------------------*/

footer {
	position: relative;
	width: 100%;
	padding: 2%;
	margin-top: 2%;
	display:inline-block;
	z-index:1;
	box-sizing:border-box;
}
#triangle-footer{
	position:absolute;
	top: 0;
	left: 2%;
	width: 0;
	height: 0;
	border-left: .9rem solid transparent;
	border-right: .9rem solid transparent;
	border-top: .9rem solid #f0f0f0;
}
.classique {
	width: 100%;
	/*border-width:0 0 1px 0;
	border-style:dotted;*/
	padding:3% 0 3% 0;
}	

.classique a{
	padding-left:2%;
	line-height: 1.7rem;
}
.classique a span:first-child{
	vertical-align: middle;
}
.classique a.appstore{
		position:relative;
		margin: 0 3% 0 0;
	}
.classique a.appstore:after{
		content:"";
		background:url("../../images/pictos/menu-sprite.png") no-repeat;
	    display: inline-block;
	    vertical-align: middle;
		background-size: 7rem auto;
	    height: 1.7rem;
	    width: 5rem;
	}
.classique a.windowsStore:after{
	  	background-position: -2rem -22.7rem;
	}
.classique a.windowsPhone:after {
	  	background-position: -2rem -20.8rem;
	}
.classique a.android:after {
	  	background-position: -2rem -18.8rem;
	}
.classique a.iphone:after{
	background-position: -2rem -11.8rem;
	}

/******** nous-acceptons **********/
#block-nous-acceptons{
	padding:0;
	font-size:0;
	position:relative;
}
#block-nous-acceptons .nous-acceptons{
	margin: 0.5rem 0;
	}

#block-nous-acceptons p+p{
	font-size:0.8rem;
	line-height:0.8rem;
}	
#block-nous-acceptons p+p:before{
	content: "";
	position: relative;
	display: inline-block;
	width: 1.8rem;
	height: 1.2rem;
	background-image: url("../../images/pictos/sprite_nous_acceptons.png");
	background-size: 1.8rem;
	top: 0.4rem;
	}	
/* Absolute position is needed because in tab version the element are inline*/
#block-nous-acceptons p+p:nth-child(odd){
	position: absolute;
	left:65%;
	}	
#block-nous-acceptons .cheque-vac{
	top: 1.6rem;
	}
#block-nous-acceptons .virement{
	top: 2.9rem;
	}
		
#block-nous-acceptons .carte:before{
	background-position: 40% 7.4%;
	}
#block-nous-acceptons .cheque-vac:before{
	background-position: 64% 27%;
	}
#block-nous-acceptons .espece:before{
	background-position: 40% 50%;
	}
#block-nous-acceptons .cheque-banc:before{
	background-position: 40% 73%;
	}
#block-nous-acceptons .virement:before{
	background-position: 40% 93%;
	}

#footer-infos{
	font-size:0;
	margin:5% 0;
}
#footer-infos li{
	display:inline-block;
	vertical-align:top;	
	width:25%;/*not 25% fix bug galaxy s2*/
	box-sizing:border-box;
	padding:0;
	height:1.8rem;
	font-size:0.8rem;
	line-height:1rem;
}
.footer-puce{
	display:inline-block;
	vertical-align:top;	
	width: 1rem;
	height: 1rem;
	background-image: url(../../images/pictos/puce-footer.png);
	background-repeat: no-repeat;
	background-position:center center;
	background-size: .3rem;
}
#footer-infos li:last-child{
	border-width:0;
	width:28%;
}
#footer-infos li:first-child{
	width:20%;
}
#footer-infos li span.triangle-turnRight:before{
	border-width: 0 0.3rem 0.3rem 0.3rem;
	margin-left:0.4rem;
}
#footer-infos li p{
	display:inline-block;
	vertical-align:top;
	width:80%;
	padding: 0;
	text-align: left;
}
.fp-footer .mention_footer{
	color: #fff;
}
.fp-footer .mention_footer a{
	text-decoration: underline;
}
/*--------------------------------------------Fin footer---------------------------------*/

/*--------------------------------------------Customs inputs---------------------------------*/

/*text*/

.custom-inputs[type="text"],
.custom-inputs[type="tel"]{
    border:none;
}

/*radio*/

.custom-inputs[type="radio"], .custom-inputs[type="checkbox"] {
	position: absolute;
	opacity: 0;
	width: 2rem;
	height: 2rem;
	margin: 0;
	z-index:20;
}

.custom-inputs[type="radio"] + label, .custom-inputs[type="checkbox"] + label {
	position: relative;
	font-size: 1.4rem;
	display: inline-block;
	width: 2rem;
	height: 2rem;
	vertical-align: top;
}

.custom-inputs[type="radio"] + label:before, .custom-inputs[type="checkbox"] + label:before {
	position:absolute;
	left:0;
	top:0;
	content:"";
    display: inline-block;
    height: 2rem;
    width: 2rem;
    border-radius:1rem;
    margin: 0;
    vertical-align: middle;
    background-color:#f0f1f3;
    box-sizing:border-box;
    border:1px solid #2c3241;
}

.custom-inputs[type="radio"]:checked + label:before, .custom-inputs[type="checkbox"]:checked + label:before{
	background-image:url("../../images/pictos/sprite-common.png");
	background-repeat: no-repeat;
	background-position: -0.2rem -5.9rem;
	background-size: 2.5rem;
	background-color:#36b0b4;
	border:none;
}

/*select*/

.select-container{
    position: relative;
    zoom: 1;
}

.select-container .select-placeholder {
    overflow:hidden;
    z-index:2;
}

.select-container .select-placeholder.disabled {
    color: #999;
}

.select-container select {
    width:100%;
    height:100%;
    color:#000000;
    margin:0 !important;
    padding:0 !important;
    position:absolute;
    top:0;
    left:0;
    z-index:3;
    opacity:0;
}

/*-----------------------------------popup tel-------------------------------------*/

#popup-tel {
  margin:auto 7%;
  font-size:0;
  top: 12rem;
  width: 86%;
}
#popup-tel b {
  display: inline;
}
#popup-tel h3{
  text-align: center;
  padding:2% 0;
}
#popup-tel p {
  margin: 0 auto;
  line-height:1.4rem;
  padding: 3% 5%;
  text-align: justify;
  border-bottom: 1px solid;
}
#popup-tel p b {
  white-space: nowrap
}

.popup button,
#popup-tel button, #popup-tel a{
	padding: 2% 0;
	display: inline-block;
	vertical-align:top;
	box-sizing: border-box;
	width:42%;
	text-align: center;
	margin:2% 0% 2% 6%;
}

#popup-tel button.ok{
	margin-left: 28%;
}

/****Popup bouttons speciaux Tel******/

.ajax-temp-hide{
	visibility:hidden;
}
.ajax-info-template{
	display:none;
	visibility:hidden;	
}

/*-----------------------------------POPUP GLOBAL-------------------------------------*/

[id^="popup-"]{
 	position: fixed;
	z-index: 200;
    opacity:0;
 	 visibility: hidden;
 	-webkit-transition-property: opacity, visibility;
  	-webkit-transition-duration: 0.5s , 0s ;
  	-webkit-transition-delay: 0s, 0.6s;
 	-moz-transition-property: opacity, visibility;
  	-moz-transition-duration: 0.5s , 0s ;
  	-moz-transition-delay: 0s, 0.6s;
  	-o-transition-property: opacity, visibility;
  	-o-transition-duration: 0.5s , 0s ;
  	-o-transition-delay: 0s, 0.6s;
  	-ms-transition-property: opacity, visibility;
  	-ms-transition-duration: 0.5s , 0s ;
  	-ms-transition-delay: 0s, 0.6s;
  	transition-property: opacity, visibility;
  	transition-duration: 0.5s , 0s ;
  	transition-delay: 0s, 0.6s;
}

[id^="popup-"].visible{
	 opacity:1;
 	visibility: visible;
 	-webkit-transition-property: visibility , opacity;
  	-webkit-transition-duration: 0s , 0.5s;
  	-webkit-transition-delay: 0.5s, 0.6s;
  	-moz-transition-property: visibility , opacity;
  	-moz-transition-duration: 0s , 0.5s;
  	-moz-transition-delay: 0.5s, 0.6s;
  	-o-transition-property: visibility , opacity;
  	-o-transition-duration: 0s , 0.5s;
  	-o-transition-delay: 0.5s, 0.6s;
  	-ms-transition-property: visibility , opacity;
  	-ms-transition-duration: 0s , 0.5s;
  	-ms-transition-delay: 0.5s, 0.6s;
  	transition-property: visibility , opacity;
  	transition-duration: 0s , 0.5s;
  	transition-delay: 0.5s, 0.6s;
}

/*-----------------------------------popup common-------------------------------------*/
.popup-common{
	width:100%;
	top:5%;
}

/*.popup-common .close{
	display: block;
	position: absolute;
	margin: 2% 1% 0 0;
	top: 0;
	right: 0;
}*/
.popup-common .close{
	margin: 4% 0 0 3%;
}
.popup-common h3{
	text-align: center;
	padding: 2% 0;
}


/*-----------------------------------popup telechargement-------------------------------------*/

#popup-telechargement{
	right: 0rem;
	top: 0rem;
	width: 97.3%;
	height:95%;
	margin: 1%;
	border: 0.2rem solid #E1E1DF;
  	background: url("../../images/bg/bg-telechargement.jpg") no-repeat, #0064dc;
	background-position: 0 bottom;
	background-size: 100%;
}

#popup-telechargement img{
	margin-top:1rem;
	width:55%;
}

#popup-telechargement p{
	color: #FFF;
    font-size: 1.7rem;
    margin: 2rem auto;
    padding: 3% 9%;
    text-align: center;
}

#popup-telechargement button{
    display: block;
    position:absolute;
    font-size: 0.9rem;
    margin: 1% 1% 0 0;
    background:none;
    border:none;
    color:#fff;
    top:0;
    right:0;
}

#popup-telechargement  a.appstore{
	display: inline-block;
	position:relative;
	margin: 1%;
	height: 2.3rem;
	width: 6.7rem;
}
#popup-telechargement  a.telecharger{
	font-size: 1.4rem;
	padding: 4% 0%;
	color: #fff;
	top: 2rem;
	width: 4%;
	position: relative;
}
#popup-telechargement  a.telecharger:after {
	content: "";
	width: 0.7rem;
	height: 0.7rem;
	border-left-width: 2px;
	border-left-style: solid;
	border-bottom-width: 2px;
	border-bottom-style: solid;
	transform:rotate(-135deg);
	-ms-transform:rotate(-135deg); /* IE 9 */
	-webkit-transform:rotate(-135deg); /* Opera, Chrome, and Safari */
	display: inline-block;
	position: relative;
	left: 1%;
}
#popup-telechargement p+div{
	width: 22.1rem;
	margin: auto;
	margin-top:3rem;
}

#popup-telechargement a.appstore span {
	position:absolute;
	background: url("../../images/pictos/menu-sprite.png") no-repeat;
	background-position: -2rem -11.5rem;
	display: inline-block;
	vertical-align: middle;
	background-size: 10.2rem auto;
	left:0;
	margin: 0;
	width: 6.7rem;
	height: 2.4rem;
}
#popup-telechargement a.windowsStore{
	  	display:none
	}
#popup-telechargement a.windowsPhone span {
	  	background-position: -3.3rem -30.4rem;
	}
#popup-telechargement a.android span {
	  	background-position: -3.3rem -27.5rem;
	}
#popup-telechargement a.iphone span {
	  	background-position: -3.3rem -17.2rem;
	}

#popup-telechargement div+p {
	color: #fff;
	font-size: 1.4rem;
	margin: 0 auto 85% auto;
	text-align: center;
}
#popup-telechargement div+p:after, #popup-telechargement div+p+p:after{
	content: "";
	width: 0.6rem;
	height: 0.6rem;
	border-left-width: 2px;
	border-left-style: solid;
	border-bottom-width: 2px;
	border-bottom-style: solid;
	transform:rotate(-135deg);
	-ms-transform:rotate(-135deg); /* IE 9 */
	-webkit-transform:rotate(-135deg); /* Opera, Chrome, and Safari */
	display: inline-block;
	position: relative;
	left: 1%;
}

/*---------- OVERLAY  ----------*/
/*---------- All elements class that contains -overlay ------*/
[class*="-overlay"]{
		display:block;
		position: fixed;
		z-index: 30;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		background: rgba(0,0,0,0.5);
		opacity:0;
	 	visibility: hidden;
	 	-webkit-transition-property: opacity, visibility;
	  	-webkit-transition-duration: 0.5s , 0s ;
	  	-webkit-transition-delay: 0s, 0.6s;
	 	-moz-transition-property: opacity, visibility;
	  	-moz-transition-duration: 0.5s , 0s ;
	  	-moz-transition-delay: 0s, 0.6s;
	  	-o-transition-property: opacity, visibility;
	  	-o-transition-duration: 0.5s , 0s ;
	  	-o-transition-delay: 0s, 0.6s;
	  	-ms-transition-property: opacity, visibility;
	  	-ms-transition-duration: 0.5s , 0s ;
	  	-ms-transition-delay: 0s, 0.6s;
	  	transition-property: opacity, visibility;
	  	transition-duration: 0.5s , 0s ;
	  	transition-delay: 0s, 0.6s;
	  	
	  	/* because [id^="popup-"] has border-radius the <div id="popup-overlay"> in overlay-v2.ftl has border radius*/
	  	/* so we reset it -- TODO: change name of popup-overlay to common-overlay and remove unecesary CSS*/
	  	-webkit-border-radius: 0rem;
		-moz-border-radius: 0rem;
		-o-border-radius: 0rem;
		-ms-border-radius: 0rem;
		border-radius: 0rem;
}
	
[class*="-overlay"].visible{
		opacity:1;
	 	visibility: visible;
	 	-webkit-transition-property: visibility , opacity;
	  	-webkit-transition-duration: 0s , 0.5s;
	  	-webkit-transition-delay: 0s, 0s;
	  	-moz-transition-property: visibility , opacity;
	  	-moz-transition-duration: 0s , 0.5s;
	  	-moz-transition-delay: 0s, 0s;
	  	-o-transition-property: visibility , opacity;
	  	-o-transition-duration: 0s , 0.5s;
	  	-o-transition-delay: 0s, 0s;
	  	-ms-transition-property: visibility , opacity;
	  	-ms-transition-duration: 0s , 0.5s;
	  	-ms-transition-delay: 0s, 0s;
	  	transition-property: visibility , opacity;
	  	transition-duration: 0s , 0.5s;
	  	transition-delay: 0s, 0s;
}
.mini-overlay{
	position:absolute;
	margin-top:0;
	margin-left:0;
	z-index: 29;
}
.mini-overlay img{
	width:10%;
	margin: 0.5rem auto;
}	
.mini-overlay p{
	margin: 4rem 0 auto;
	padding:0 5%;
	text-align:center;	
}	
/*----------------------------------Bons plans au départ de Paris--------------------------------------*/
.content #titleBP{
	margin:2%;
	padding: 1% 0 2% 0;
	border-bottom-width:1px;
	border-bottom-style:solid;
	clear: both;
}

.content #titleBP h1{
	text-transform:uppercase;
	display:inline;
	font-size: 1rem;
	letter-spacing: -0.1rem;
}

.content #titleBP p{
	display:inline-block;
	vertical-align: baseline;
	font-size: 0.9rem;
}

.content #titleBP p.city-btn{
	position:relative;
	float: right;
	text-transform: uppercase;
	border-width: 1px;
	border-style: solid;
	border-radius: 3px;
	padding: 0px 2px;
	font-size: 0.9rem;
	margin-top: 0rem;
	width: 6rem;
	height: 1.1rem;
	padding: .15rem 0 .15rem .3rem;
}
.content #titleBP p.city-btn > span{
	width: 7px;
	height: 7px;
	margin: .1rem 5px 0 0;
}

#villeDepartSelect {
	width: 100%;
	height: 100%;
	color: #000000;
	margin: 0 !important;
	padding: 0 !important;
	position: absolute;
	top: 2px;
	left: 1px;
	z-index: 3;
	opacity: 0;
}


/*****************/
/* cookies       */
/*****************/
#bloc-cookie{position: fixed; bottom: 0; margin: 0; z-index: 999;}
.flright {float:right;}
.cookie-bar {margin: 0 auto; padding: 1%;}
.cookie-bar p {margin: 0; padding: 0; color:#000; font-size: 0.7rem;font-family: Arial, helvetica, sans-serif}
.cookie-bar p a {color:#000; text-decoration: underline;}
.cookie-bar p a:hover {color:#f3f3f3;}
.cookie-bar_wrap {min-height: 2.8rem;background-color: #e0e0e0;line-height: 1rem;/*position:fixed;z-index:9999;*/}
.cookie-bar_wrap.show {display: block;}
.cookie-bar_wrap {display: none;}

.cookie-bar,
.cookie-bar .v-align-wrap {height: 100%;}

.cookie-bar_text {max-width: 84%}

.btn-simple {width: 3rem;height: 2rem; text-align: center; color:#fff; border:none; outline:none; text-transform: uppercase; font-size: 0.82rem; font-weight: bold; vertical-align: middle;padding: 0;line-height: 2rem; margin-right: 8px;}
.btn-simple:hover {cursor: pointer;}  
.btn-ect {background-color: #d70505;}
.btn-ect:hover {background-color: #e74228;}

/* correction smartphone */
@media (max-width: 400px) 
{
	.cookie-bar p {font-size: 0.9rem;}
	.btn-ect {margin-top: 4%}
}


/*---------- BLOC ADSENSE --> (adsense.ftl) ----------*/
/*---------- see adsense.ftl for color style ----------*/


/**************** adsense *************/
#adsense-wrapper{
	padding: 2%;
	float: left;
	box-sizing: border-box;
	display:none;
	margin-top:2%;
}

/*************** TEL ONLY *****************/
.tab-only,
.tab-portrait-only,
nav[role="navigation"] ul li.tab-only{
	display:none;
}
#boloss{}

/*****************/
/* Breadcrumb       */
/*****************/	
.kv-breadcrumb{
    padding: .5rem;
    background-color: #fff;
}
.kv-breadcrumb div{
 	display: inline-block;
}

.kv-breadcrumb h1{
 	display: inline;
 	font-family: arial,arial;
    font-size: 1rem;
    font-weight: 400;
    color: #38302b;
    padding:0;
    text-align:left;
    text-transform: initial;
}
.kv-breadcrumb--last:before{
	content: '|';
	margin-right:4px;
}
.kv-breadcrumb h1:before{
	content: '|';
	margin-right:4px;
}
.kv-breadcrumb a{
    font-family: arial,arial;
    font-size: 1rem;
    font-weight: 400;
    color: #38302b;
	text-decoration: none;
}
.kv-breadcrumb p{
	font-family: arial;
    font-weight: 1rem;
    display: inline-block;
    vertical-align: top;
    color: #38302b;
}

.kv-breadcrumb-separate:after{
	content: '|';
}
.kv-breadcrumb-backButton{
    color: #38302b;
    font-family: arial;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1rem;
}


.kv-breadcrumb-backButton span{
    transform: rotate(225deg);
    -ms-transform: rotate(225deg);
    -webkit-transform: rotate(225deg);
    -moz-transform: rotate(225deg);
       border-style: solid;
    border-width: 1px 1px 0 0;
    display: inline-block;
    vertical-align: top;
       height: 0.6rem;
   	width: 0.6rem;
    margin-top: .1rem;
}
