/* CSS Document */

/* COLORS: 
vert #8cc63e  vertObscur #648E3D  ====  orange #f37f2c ==== blue #39B2DE  blue over #2692C8 ==== Gris #949494 Gris0bscur #8f8f8f grisNoir #333*/  

/* 01. CSS de base */
/* 01.1 POPUP tooltip */
/* 01.2 header*/
/* 01.3 sous-menu */
/* 01.4 menu mobil */
/* 01.5 footer */
/* 01.06 elements pages */

/* 02. Accueil  *
/* 02.1 MAP  */
/* 02.2 new boxReservation */
/* 02.2.5 pop up login reservation */
/* 02.3 accueil elements */
/* 02.4 msg cookies */

/* 03 Page comment */

/* 04 Page combien */
/* 04.1 forfaits */
/* 04.2 description forfaits */
/* 04.3 calculateur */
/* 04.4 elements page combien */

/* 05. page contact */

/* 06 page conexion */

/* 07 page calculateur */

/* 08 page inscription */

/****** 09 responsive ******/


/******** 01. CSS de base ******/
body{
	background-color:#333; 
	color: #444;
	font-family:Arial, Helvetica, sans-serif;
	font-size:16px;
	font-weight:normal;
	overflow-x:hidden; 
}
h1{font-size: 1.6em; font-weight: normal; margin: 0; padding: 0;}
h2{font-size: 1.3em; font-weight: normal; margin: 0; padding: 0;}
h3{font-size: 1.3em; font-weight: normal; margin: 0; padding: 0;}
h4{font-size: 1.1em; font-weight: normal; margin: 0; padding: 0;}
.txtBlanc{color: #fff;} 
.txtVert{color: #8cc63e;}
.txtVertC{color: #c6db91;} 
.txtBlue{color: #39B2DE;} 
.txtOrange{color: #f37f2c;} 
.txtOrangeO{color: #d16443;}
.txtGris{color: #444;}
.txtGrisN{color: #999;}
.txtGrisO{color: #222;}
.txtGrisC{color: #d4e0e8;}
.txtMini{font-size: .8em;}
.bgGris{background-color: #f2f2f2;}
.bgGrisObs{background-color: #8f8f8f;}
.bgNoirCl{background-color: #333;}
.bgBlanc{background-color: #fff;}
.bgVert{background-color: #8cc63e;}
.bgVertA20{background-color: rgba(168, 201, 89, .2);}
.bgOrange{background-color: #E26440;}
.bgBlue{background-color: #39B2DE;}
.bgGrisNoir{background-color: #646464;}
.bgRouge{background-color: #f66;}
a{
	color: #39b2de;
	font-weight: normal;
    text-decoration: none;
    outline: none;
}
a:hover{
	color: #2692C8;
	text-decoration: none;
}
p{
	line-height: 1.5em;
	margin: .5em 0;
	hyphens: none ;
}
.mobile{display: block;}
.tablet{display: none;}
.desktop{display: none;}
.invisible{opacity:0;}
.hidden{display: none!important;}
.video{
	height:0;
	overflow:hidden;
	padding-bottom:56%;
	position:relative;
	margin: 0;
}
	.video iframe, .video object, .video embed, .video video{
		height:100%;
		left:-1px;
		position:absolute;
		top:0;
		width: 100%;
	}
.left{float: left;}
.right{float: right;}
.clear{clear:both;}
#sb-site{overflow:hidden;}
.conteneur{
	background-color: #fff;
	left: 0;
	overflow: hidden;
	position: relative;
	-moz-transition-duration: .5s;
	-ms-transition-duration: .5s;
	-webkit-transition-duration: .5s;
	transition-duration: .5s;
	-moz-transition-timing-function: linear;
	-ms-transition-timing-function: linear
	-webkit-transition-timing-function: linear
    transition-timing-function: linear;
    z-index:1;
}
.menuMobileVisible{
	left: 225px;
}
.elmResponsive{
	width: 100%;
}
/* 01.1 POPUP tooltip */
.tooltip{
	font-size:13px;
	display:none; 
	padding:5px;
} 
.tooltip a{
	text-decoration:none; 
	color:#3498DB;
} 
.tooltip a:hover{color::;color:#2980B9;}
.vinCarte{cursor:pointer;}
/* fin POPUP tooltip */
/* 01.2 header */
.top{ 
	background:#60646D; 
	display:block;
	height:40px; 
	width:100%; 
} 
nav, #map, .mobNone{display:none;}
nav, .rs, .lineTop{float:right;} 
.conTop{
	overflow: hidden;
	max-width:940px;
	margin:auto;
} 
.lineTop{
	background:#B2B2B2;
	height:30px;
	margin:5px;
	width:2px;
}
.top nav ul{
	font-size:.8em;	
	list-style:none;
	margin: 0; 
	padding: 0;
}
.top nav li{float:left;}
.top nav a{
	font-size:.1.2em;
	color:#FFF; 
	padding:10px 15px; 
	text-decoration:none; 
	display:block;
}
.top nav a:hover{ border-bottom:4px solid #7d7d7d;}
.rs{margin-top: 9px;    margin-right: 6px;}
a.lang{
	color:#FFF;
	display:block; 
	float:left; 
	font-weight:bold; 
	height:20px; 
	padding:2px 10px 0;
	text-decoration:none; 
	width:20px; 
}
header .icon-facebook, 
header .icon-tweet,
header .icon-instagram {
	color: #fff; 
	margin: 0 .25em;
}
header .icon-facebook, 
header .icon-tweet {
	font-size: 0.9em; 
}
header .icon-instagram {
	font-size: 1em; 
}	
.menuTop{
	position:relative; 
	top:0; 
	width:100%; 
	z-index:8;
}
.icon-menu{
	color: #fff;
	font-size: 1.7em;
}
.topWhite{
	background:#fff;
	display:table; 
	/*opacity: 0.92;filter: alpha(opacity=92);  For IE8 and earlier */
	opacity: 1;
	width:100%; 
}
.headerLogoBtn{
	margin:.8em auto; 
	max-width:920px;
	overflow: hidden;
	padding:0 .6em;
}
#logo{float:left; margin-top: 5px;}
.logoComm{display:block; width:120px; }
#abonnez{float:right;}
#abonnez a{
	-moz-border-radius:8px;
	-ms-border-radius:8px;
	-webkit-border-radius:8px;
	background:#39B2DE;
	border-radius:8px;
	color:#FFF;display:block;
	font-size: .8em;
	font-weight:bold;
	padding:9px;
	text-decoration:none;
}
#abonnez a:hover{background:#2692C8;}

/* 01.3 sous-menu */
.subMenuBase{
	background:#60646D; 
	display:none; 
	font-size:14px; 
	height:70px; 
	opacity: 0.95;filter: alpha(opacity=95);
	position:fixed; 
	top:40px; 
	width:100%;
	z-index:10; 
}
.submenu{
	font-weight:bold;
	margin-top:26px;
	margin:auto; 
	max-width:940px;
	text-align:center; 
} 
.submenu ul li{display:inline;}
.submenu a{
	border-right:1px solid #DBDBDB;
	color:#DBDBDB;
	padding:8px 10px; 
	text-decoration:none;
}
.submenu a:hover{ color:#FFF;} 
.submenu .lastborder{border-right:0;} 
.shadow_sub{
	background:url(../img/BASE/shadow_sub.png) repeat-x;
	height:12px; 
	width:100%; 
}
/* fin sous-menu */
/* 01.4 menu mobil */
.bugerMenu {
	cursor: pointer;
	display:block;
	float: left;
    padding: 5px;
    width: 52px;
}
.menuMobile{
	background-color: #333;
	height: auto;
	left: 0;
	position: fixed;
	top: 0;
	width: 225px;
	z-index: 0;
}
.menuMobile ul{
	list-style: none;
	margin: 0; 
	overflow: hidden;
	padding: 0;
}
.menuMobile li{
	border-bottom: 1px solid #444;
	list-style: none;
	padding-bottom: 1px;
}
.menuMobile a{
	border-left: 3px solid #333;
	display: block;
	color: #fff;
	padding:1em 0 1em .7em; 
	width: 100%
}
.menuMobile a:hover{
	background-color: #444;
	border-left: 3px solid #39B2DE;
}
/* fin menu mobil */
/* fin header */
/* 01.5 footer */
.footer_top .margeResponsive{margin: 0 auto; padding-top: 2em;}
.footer_top {
	background:#60646D;
	display:block;
	font-size:14px;
	width:100%;
}
.footer_top_in a{
	color:#DBDBDB;
	text-decoration:none;
}
.footer_top_in a:hover{color:#fff;}
.footer_col{
	border-right:1px solid #DBDBDB; 
	float:left;
	margin:1em .5em;
	overflow: hidden; 
	width:100%; 
}
.last_col{ border:none; margin-right: 0;}
.footer_col br{ margin:3px 0;}
.footer_col h3{ margin-bottom:6px;color:#FFF;}
.footer_bottom {
	background:#f5f5f5; 
	color:#949494; 
	display:table; 
	font-size:12px;
	width:100%; 
} 
.footer_bottom_in{ 
	max-width:940px; 
	margin:.5em auto 1em;
	padding: .5em;
}
.footer_left{float:left;}
.footer_right{float:right;}
.footer_left a{
	color:#949494;
	text-decoration:none;
}
.footer_left a:hover{color:#60646D;}
/* fin footer */
/* 01.06 elements pages */
.margeResponsive{
	display: block;
	overflow: hidden;
	max-width: 940px;
	padding: 0 .6em;
	position: relative;
	margin: 1em auto;
}
.margeSection{margin-top: 2em;}
.margeInterSection{margin-top: 1.5em;}
.pages #wrapper{margin: 0;}
.offreSpecial{ 
	border:1px solid #8cc63e;
	border-radius:8px; 
	padding:15px; 
	text-align:center; 
	margin-top:30px;
}
.entete{margin-top: -1em; overflow: hidden; position: relative;}
.entete .margeResponsive{margin: 0 auto;}
.entete .shadow{display: none; margin: 0; position: absolute; top:0; z-index: 10;}
.entete .shadow_b{display: none; bottom: 0; margin: 0; position: absolute; z-index: 5;}
/* titres */
.titre{
	display: block;
	height: auto;
	margin: 1em 0 1.5em;
	position: relative;
	width: 100%;
}
.titre h1{
	color: #8cc63e; 
    font-weight: bold;
    padding: 0;
    position: relative;
    text-align: center;
    z-index: 2;
}
/* fin titres */
.listFunction{
	margin: 0;
	padding: 0;
	list-style: none;
}
.listFunction li{
	margin: .5em 0;
	width: 100%;
}
.listFunction span{ display: table-cell; vertical-align: middle;}
.icon{
	font-size: 4.5em;
	padding-right: .15em
}

.liAvantages{
	list-style: none;
	padding: 0;
	margin: 0;
}
.liAvantages li{
	float:left;
	min-height:50px; 
	margin: .5em 0; 
	width:100%; 
}
.liAvantages span{ display: table-cell; vertical-align: middle;}
.icon-nike{font-size: 3em; padding-right: .3em;}
.autoMobil .imgAutoMobil{ 
	display: block;
	margin: 0 auto; 
	max-width: 445px; 
	width: 100%; 
}
.regle_info{
	color:#39B2DE;
	cursor:pointer;
	font-weight:bold;
}
.regle_info:hover{color:#2692C8;}
.regle_cont{font-weight:normal; padding: 10px;}
.infos2niveau, #plusFAQ{
	display: none;
	margin: 1em 0;
}
.infos2niveau p{padding-left: 2em;}
/* fin elements pages */
/* fin CSS base */

/* 02 Accueil */
/* 02.1 MAP  */
#map{
	border-top: 1px solid #dcdcdc;
	border-bottom: 1px solid #dcdcdc;
	height:370px;
	margin: 0 0 1em; 
	width:100%; 
} 
.shadow{
	background:url(../img/BASE/shadow_carte.png) repeat-x;
	height:15px; 
	width:100%; 
} 
.shadow_b{
	background:url(../img/BASE/shadow_carteb.png) repeat-x;
	height:15px; 
	width:100%; 
}
/* 02.2 new boxReservation */
.outSide{
	margin-right: -300px;
	margin-top:150px;
}
.reservBoxOut{
	right: -297px!important;
}
.transition{
	-moz-transition:.5s ease;
    -webkit-transition:.5s ease;
    transition:.5s ease;
}
.reservBox{
	display:block;
	overflow:hidden;
	position:absolute;
	top:5em;
	right:0;
	width:340px;	
}
	#menuResevBox{
		position:absolute;
		left:.2em;
		top:.6em;
	}
	#menuResevBox .icon-menu{
		color: #8cc63e;
		cursor:pointer;
	    background-color: white;
	    border-radius: 5px;
	    border: 2px solid #8cc63e;
	    font-size: 2em;
	    line-height: 1.3em;
	    padding: .3em .37em .4em;
	}
	/**** menu villes ***/
	#villeID{
		background:#FFF; 
		border-bottom-left-radius: 8px;
		border-top-left-radius: 8px; 
		display:none; 
		padding:4px 0 2px 4px;
		float:left;
		margin-top:50px;
		width:38px;
	}
	.ville {
		background:#8cc63e;
		color:#FFF;
		cursor:pointer;
		font-size:12px;
		font-weight:bold; 
		margin-bottom:2px;
		padding:3px;
		text-align:center;
	}
	.bvtop{border-top-left-radius: 6px;} 
	.bvbot{border-bottom-left-radius: 6px;}
	.vActive{ background:#39B2DE;} 
	/**** end menu villes ***/
 
	/** section reserver **/
	#map a{ text-decoration:none;}
	#reserver{
		background:#fff;
		border:2px solid #8cc63e;
		border-radius:5px; 
		display:block;
		float:right;
		font-size: 16px;
		width:86.5%;
		width: calc(100% - 46px);
		-moz-transition:.3s ease-in-out;
		-webkit-transition:.3s ease-in-out;
		z-index: 100;
	}
	#reserver .burgerReservBox{
		color: #8cc63e;
		cursor:pointer;
	    border-radius: 5px;
	    font-size: 1.5em;
	    font-weight: 600;
	    line-height: 1.3em;
	    padding: .4em .4em .4em;
	    position:absolute;
	    right:1.4em;
	    top:0;
	}
	.boxTitle .action{
		color: #8cc63e;
		cursor: pointer;
		border-radius: 5px;
		font-size: 1.3em;
		line-height: 1.3em;
		padding: .6em;
		position: absolute;
		right: -3px;
		top: 0;
	} 
	.date{ width:80px;}
	.buttonRes{ 
		background:#39B2DE; 
		border-top-left-radius: 5px;
		border-top-right-radius: 5px;
		border:0; 
		color:#fff; 
		cursor: pointer; 
		font-size:14px;
		padding:10px;
	}
	.buttonRes:hover{ background:#2692C8;} 
	.buttonDis{
		background:#39B2DE;
		border-radius:8px; 
		border:0;
		color:#FFF;
		cursor:pointer;
		font-weight:bold;
		padding:10px;
	}
	.buttonDis:hover{background:#2692C8;}
	input.choisir{ 
		-moz-border-radius: 4px;
		-webkit-border-radius: 4px;
		background:#8dc63f; 
		border-radius: 4px;
		border:none; 
		color:#FFF; 
		cursor: pointer;
		font-weight: bold;
		padding:2px; 
	}
	input.choisir:hover{ background:#7C9E3D;} 
	.legenCont{line-height:12px; display:none;} 
	#legen{
		color:#39B2DE;
		cursor:pointer;
		display:block;
		margin-bottom:5px;
	}
	#legen:hover{color:#2692C8;}
	#close{
		-moz-border-radius: 8px;
		-webkit-border-radius: 48px;
		background:#39B2DE;
		border-radius:8px;
		border:none;
		color:#FFF;
		cursor:pointer;
		float:right;
		font-weight:bold;
		padding:2px 4px;
	}
	#close:hover{background:#2692C8;}
	.ui-dialog{z-index: 99999 !important ;}
	.clsInfoWindow { 
		width: auto; 
		height: auto; 
		line-height:1.35; 
		overflow:none; 
	}
	.btnChoose input{		-moz-border-radius: 8px;
		-webkit-border-radius: 48px;
		background: #39B2DE; 
		border-radius:8px;
		color: #fff; 
		display: block; 
		font-weight:bold;
		margin-top: 10px;
		padding: 8px; 
		text-align: center; 
	}
	.btnChoose input:hover{background: #2692C8;}
	.Options{ padding-top: 2px; }
	.AvailableKm { padding-top: 3px; }
	.clsInfoWindow span.NoHighlight { display: none; }
	.clsInfoWindow span.Highlight {
		-moz-border-radius: 4px;
		-webkit-border-radius: 4px;
		background:#09F; 
		border-radius: 4px;
		margin:0 4px;
		padding:0 3px; 
	}
	span.Highlight {color:#FFF; font-weight: bold; }
	.lienExtRes{
		color: #39B2DE; 
		text-decoration: none; 
		cursor: pointer;
	}
	.lienExtRes:hover{color: #2692C8;} 
	.hco{min-height:0;} 
	.WarningText{color: #E26440;}

	/** fin reserver **/
	.amlabels {
		height: 43px;
		width: 28px;
		padding-top: 0px;
		cursor: pointer;
	}
	#RememberMe{
		display:inline-block!important;
		opacity:1;
		width:auto;
	}
	#LoginDialog .ui-button{
		background-image: none;
	    background: #39B2DE;
	    border-radius: 8px;
	    border: none;
	    color: #fff;
	    font-size: 14px;
	}

.close{
	height:40px!important;
	width:40px!important;
	overflow:hidden!important;
}
.close .mainMenuReservTool{
	border:none;
	height:40px!important;
	margin:-4px -3px; 
	width:40px!important;
}
.reservationTools{
	font-weight: 400;
	overflow:auto;
	position:relative;
}
.reservationTools .rowSection{
	border-bottom: 1px solid #ccc;
	overflow:hidden;
	position:relative;
	padding:.5em 5%;
	width: 90%;
}
.rowMenu{
	color:#8cc63e;
	cursor:pointer;
	position:absolute;
	right:.2em;
	top:.4em;
	padding:.5em;
}
.openClose{
	width: 100%;
    cursor: pointer;
    display: block;
    height: 50px;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 2000;
}
.icon-menu.rowMenu{
	right:.2em;
	top:.3em;
	padding:.1em;
}
.contentRow{margin-top: 1em;}
.cityName{font-size: 1.7em;}
.rowTitle{
	font-size: 1.1em;
	margin:.2em 0;
}
.txtGrisC2, .reservationTools{color:#222;}
.reservationTools h4{font-size: 16px;}
.reservSec{
	background: url(../img/BASE/lignes_dates_reserv.png) 4.5% 3.8em no-repeat;
}
.resevationTimeDate, .local-longueDistance{margin:0 0 0 1em;}
.reservationTools input, .reservationTools select{
	border: 1px solid #8cc63e;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	font-size: 1em;
}
.calendarImputs.depart{margin-bottom:27px;}
.calendarImputs.return {margin-bottom:.5em;}
.calendarImputs .date{
	width:95px;
}
.calendarImputs .time,.calendarImputs .sec{
	width:45px;
}
#Destination{margin-bottom: 1em;}
.txtPromoSolei{margin: 0 0 1em 0;}
/* message error dates */
#textError .icon-alerte{
	font-size: 2em;
	float:left;
	margin:.1em .2em 2em 0;
}
/* end message error dates */

.clicable{cursor:pointer;}
.local-longueDistance .txtElm {margin-left: 2em}
	
.btnsOptionsReserv{
	list-style: none;
	margin:1em 0;
	overflow:hidden;
	padding:0;
}
.btnOptionR{
	border: 1px solid #8cc63e;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	color: #8cc63e;
	display:block;
	float:left;
	height:15px;
	margin-right: 2%;
	overflow:hidden;
	padding:7px 7px 10px;
	position:relative;
}
.scroll .btnOptionR{
	margin-right: 2.1%;
}
.btnOptionR:last-child{
	margin-right: 0;
}
.btnOptionR input{
	height: 40px;
    display:block!important;
    left: -1px;
    opacity:0;
    position: absolute;
    top: -1px;
    width: 40px;
}
.btnOptionR span{
	font-size: 20px;
	margin:-2px;
}
.buttonDis{
	float:right;
	font-weight: 400;
	margin: .5em 0 1em;
	padding:.5em 1.7em;
	border:none;
}
.btnOptionR.active{
	background-color:#8cc63e;
	color:white;
}
.btnOptionR.inactive{opacity:.4;}
.codePostal{
	margin: 0 0 1em;
	position:relative;
}
	#address{
		padding:.3em 2%;
		width:96%;
	}
	.codePostal .icon-search{
		font-size: 1.1em;
		position:absolute;
		right:.3em;
		top:.35em;
	}
	.codePostal #geocode{
		height:1.8em;
		opacity:0;
		position:absolute;
		right:0;
		top:.0;
		width:1.8em;
	}
#selectorCont{
	margin: 0 0 1em;
	padding:.3em 0;
	width:100%;
}
.calcula{margin: 0 0 1em;}
	.calcula .icon-miniCalculateur{
		font-size: 1.5em;
		margin: 0 .2em 0 -.1em;
	}
	.calcula a{
		vertical-align: text-bottom;
	}
.locateurs{margin: 0 0 1em;}
	.locateurs span{font-size: 1.3em}
	.locateurs h4{
		display:inline;
		margin-left: .5em;
		vertical-align: text-bottom;
	}
.nouvelleStation{margin: 0 0 2em;}
	.nouvelleStation .icon-addStation{
		font-size: 1.5em;
		margin: 0 0 0 -.1em;
	}
	.nouvelleStation h4{
		display:inline;
		margin-left: .3em;
		vertical-align: middle;
	}
.legendesSec{padding-bottom: 1em;}
	.ulLegendes{
		font-size: .6em;
		list-style: none;
		margin:none;
		padding:0;
	}
	.ulLegendes li{
		margin:1em 0;
	}
	.ulLegendes span{
		font-size: 2.5em
	}
	.ulLegendes h4{
		display:inline;
		margin-left: .3em;
		vertical-align: top;
	}
	.ulLegendes h4 i{
		vertical-align: top;
	}
	.ulLegendes .txtMini{
		display:inline-block;
		margin-left: 2.5em;
	}
	.iconeLegend{height:22px;}

/* fin new boxReservation */
#plein{
	display:none; 
	position:absolute;
	z-index: 10000000;
}
/* 02.2.5 pop up login reservation */
.ui-dialog-buttonpane {
	border-color: #f5f5f5; 
	padding: 5px;
}
.ui-dialog .ui-dialog-buttonpane button{ 
	background-image: none; 
	background:#39B2DE; 
	border-radius:8px; 
	border: none; 
	color: #fff; 
	font-size: 14px;
}
.ui-dialog .ui-dialog-buttonpane button:hover{background: #2692C8;}
/* end pop up login reservation */
/* fin MAP */
/* 02.3 accueil elents */
/* fin pub MAP */
#pubMap{display:none;}
.skipPromo{display:none;}
/* fin pub MAP */

/*img 2 autos top*/
.imgAutosTop{
	display: block;
	overflow: hidden;
	margin: -1.2em 0 .5em;
	width: 100%;
	max-width: 768px;
}
/* fin img 2 autos top */
/* message automobile quebec */
.autoMobileQC{
	display: none;
	overflow: visible;
	margin-bottom: 2.5em;
}
.autoMobileQC img{
	float: right;
	margin-top: -75px;
	width: 300px;
}
.autoMobileQC h3{
	font-size: 1.5em;
	margin: 0;
}
.autoMobileQC p{
	font-size: 1.1em;
	line-height: 1.2em
}
.elmAutoMobileQC{
	display: none;
}
.quebec .img2sev, .quebec .txtPinAuto{display:none;}
.quebec .elmAutoMobileQC{display:block;}
/* fin message automobile quebec */
/* message automobile paques */
.autoMobilePaques{
	display: block;
	overflow: visible;
	margin: 1em auto 2.5em!important;
	z-index: 2;
}
.autoMobilePaques img{
	float: right;
	margin-top: -80px;
	width: 280px;
}
.autoMobilePaques h3{
	font-size: 1.5em;
	margin: 0 0 0 170px ;
}
.autoMobilePaques p{
	font-size: 1.1em;
	line-height: 1.2em;
	margin: 2em 0 0 170px;
}
.elmAutoMobilePaques{
	display: none;
}
/* fin message automobile paques */
/* teaser app web pour mobiles */
.no_margin{margin:0;}
.boxMobile span{
	border-radius:8px;
	border:1px solid #8cc63e;
	color:#666;
	display:block; 
	margin-bottom:1em;
	margin:auto;
	overflow: hidden;
	max-width: 400px;    
}
.boxMobile img{
	float: left; 
	margin: .5em 0 .5em .5em;
	width:50px;
}
.boxMobile h3{
	float: left;
	color:#8cc63e;  
	margin: .4em 0 0  .4em;
}
.boxMobile p{
	float: left;
	font-size: .9em; 
	margin: 0 0 .4em .5em;
}
/*  fin teaser app web pour mobiles */
/* txt intro acueil */
.txtIntro{margin-top: 1em;}
.txtIntro h1{
	font-size: 1.1em;
	line-height: 1.5em;
	margin: 0;
}
.txtIntro h1 span{
	font-size: 1.4em;
}
/* txt intro acueil */
/* encadres presentation */
.rondCorners{
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	-ms-border-radius: 8px;
	border-radius: 8px;
}
.elms3{
	float: left;
	display: block;
	margin: 0 0 1em;
	overflow: hidden;
	width: 100%;
}
.elm{
	margin: 0 auto;
	overflow: hidden;
	width: 100%;
	max-width: 400px;
	min-width: 230px;
}
.encadresIntroServices .elm{
	height: 13em;
}

.elms3:last-child{margin: 0;}
.color{
	display: block;
	height: 2.5em;
	width: 100%;
	z-index:2;
}
.color h2{
	display: block;
    margin: 0;
    padding: 0.25em 0 0 1em; 
}
.color h3{
	color: #fff;
	display: block;
    margin: 0;
    padding: 0.5em 0 0 1em;
    text-align: center; 
}
.color h2 a{
	color: #fff;
	font-size: .9em;
	font-weight: normal;
	text-decoration: none;
}
.tri{
	border-left:14px solid transparent;
	border-right:14px solid transparent;
	height:0px;
	margin-left:1.4em;
	position: absolute;
	width:0px;
	z-index:2;
}
.triImg{
	margin-left:1.4em;
	margin-top:-1px;
	position: absolute;
	z-index:2;
}
.bgRoseBorder{background-color: #f73a7a; border-bottom: 1px solid white}
.bgBlueBorder{background-color: #00ADEF; border-bottom: 1px solid white} 
.tri_vert{border-top:14px solid #8cc63e;}
.tri_orange{border-top:14px solid #E26440;}
.tri_blue{border-top:14px solid #39B2DE;}
.tri_gris{border-top:14px solid #f2f2f2;}
.elm .elmContenu{
	display: block;
	overflow: hidden;
	width: 100%;
	z-index: 1;	
}
.elmContenu img {
	float: left;
	margin: 1.3em .5em 0 .7em;
	width: 50px;
}
.img2sev img{
	margin: 0;
	width: 100%;
}
.elmContenu p{
	float: left;
	font-size: 0.9em;
	margin: 1.3em .5em 0 .5em;
	width: 70%;
}
/* fin encadres presentation */
/* soustitres */
.sousTitre{
	display: block;
	height: 2em;
	margin-bottom: 2em;
	position: relative;
	width: 100%;
}
.sousTitre .ligne{
	background-color: #8f8f8f;
	display: block;
	height: 1px;
	left: 0;
	position: absolute;
	top:.8em;
	width: 100%;
	z-index: 1;
}
.sousTitre h2{
	background-color: #fff;
    display: table;
    margin: 0.5em auto;
    padding: 0 0.5em;
    position: relative;
    text-align: center;
    z-index: 2;
}
/* fin soustitres */
/* section Comment fonctionne */
.row{
	display: block;
	width: 100%;
	overflow: hidden;
}
.collumn {
	display: block;
	float: left;
	margin: 1em 0 0;
	overflow: hidden; 
	text-align: center;
	width: 50%
}
.functionement .icones{font-size: 6em;}
.functionement .icoTitres {margin-top: .5em;}
.blockLigneTop{margin: 1em 0; }
.blockLigneTop .elm{
	background-color: #fAfAfA;
	border-top: 3px solid #8cc63e; 
	min-height: 7em;
	padding: 1em 0;
	text-align: center;
}
.btnIconesHome, .btnIconesHome:hover{
	color:#8cc63e;
}
/* fin section Comment fonctionne */
/* section offres */
.sectionGris{
	background-color: #fafafa; 
	overflow: hidden;
	width: 100%; 
}
.sectionGris .sousTitre h2{background-color: #fafafa;}
.sectionGris .shadow{ margin: 0 0 1.5em; } 
.sectionGris .shadow_b{ margin: 1.5em 0 0; }
.offres .icones{font-size: 6em;}
.offres .collumn h3{margin-top: -.8em;} 
/* fin section offres */
/* secton communaute */
.communaute{margin:0 auto; max-width: 478px;}
.communaute .collumn{
	margin: 0;
	overflow: hidden;
	padding: 0;
	text-align: left;
	width: 100%;
}
.communaute .communTxt{margin: 15px 0;}
.communaute h3, .communaute p, .communaute a{margin: 16px; }
.communaute p, .communaute a{font-size: .8em; line-height: 110%;}
.communaute img{display: none;}
.orange{
	background-color: #E26440;
	color: #fff;
	height: 100%;
}
.orange h3{font-weight: normal;}
.orange strong{font-size: 1.2em;}
.orange span{font-size: 3em; color: #fff; margin-left: .5em;}
.orange p{border-top: 1px solid #fff; padding-top: 1em}
.communaute .orange .social{
	display: none;
	margin: 0 auto;
	overflow: hidden;
	width: 90px;
}
.orange .social a {
	font-size: 1.5em;
	margin: 0;
	text-align: center;
}
.orange .social span {font-size: 1.5em; margin: 0;}
.orange .social a:first-child span {margin-right:  .3em ;}
.orange .btnCommunaute{
	background:#FFF;
	-moz-border-radius:8px;
	-webkit-border-radius:8px;
	border-radius:8px;
	color:#E56440;
	display:block;
	font-size:14px;
	font-weight:bold;
	margin: 2em 1em 1em; 
	padding:14px;
	text-align:center;
	text-decoration:none;
}
/* fin section communaute */
/* section actualite */
.actualite .collumn {text-align: left; width: 100%}
.actualite p a{font-size: .8em;}
.actualite a:hover{color: #555;}
.onparle{width: 100%}
/* fin section actualite */

/* 02.4 msg cookies */
.cookies{
	bottom: 0;
	display:inline-block;
	position: fixed;
	width:100%;
	vertical-align: middle;
	z-index:3;
}
.cookies div{
	background-color: rgba(0,0,0,.8);
	color:white;
	display: block;
	margin: 0 auto;
	max-width: 940px;
	padding: .4em .6em;
}
.btnCookies{
	border-radius: 50%;
	border: 1px solid white;
	float: left;
	font-size: .8em;
	font-weight: 600;
	padding: .3em .5em .25em .6em;
	margin: .3em 1em 0 0;
	cursor:pointer;
}
.cookies p{font-size: .8em;}
/* fin msg cookies */
/* fin accueil elents */
/* Fin Accueil */



/* 03 Page comment */
.deuxServices .collumn{
	text-align: left;
	width:100%;
	margin-top: 0;
}
.deuxServices  h3{text-align: center; font-size: 1.5em;}
.deuxServices ul{
	list-style: none;
	margin:0;
	padding:0;
	font-weight: normal;
}
.deuxServices li{
	line-height: 1.5em;
	padding-bottom: 1em;
}
.deuxServices  .icon{
	font-size: 4em;
	padding: 0 .3em 0 0;
	float:left;
}

.colVideo{
	width: 100%;
}
.pointAB, .pointA{width: 80%; margin: 0 10%;}
#pageFunction h3{padding:1em 0 .5em;}
#pageFunction ol{
	display:table;
	margin: .5em 0;
	padding-left: 20px;
}
/* fin Page comment */

/* 04 Page combien */
.sectionPromos .margeResponsive{margin: 2em 1em;}
.sectionPromos .elmResponsive{
	display: block;
	margin: 0 auto;
	max-width: 264px; 
}

.sectionPromos .elm a img{border: 1px solid #39B2DE;}
.boxForfait{
	border: 1px solid #8cc63e;
	margin: 1em 0;
	padding: 1em;
}
.sectionDuo a{
	float: left;
	margin-right: 1em;
}
.notesPie{
	font-size: .75em;
	margin: 0 1em;
	padding: 1em;
}
.notesPie .mobile{display: list-item;}
	.imgPromoLD{
		border: 1px solid #8cc63e;
		display: block; 
		margin: 0 auto 2em; 
		padding: 2px 10px;
	}
/* 04.1 forfaits */
.formulesAb{
	position:relative;
	width:100%;
}
.forBox{
	width:100%;
}
.forBox h5{
	font-size: 1em;
	font-weight: normal;
	margin:1em auto ;
	text-align: center;
	width:280px;
}
.forExtended h5{width:100%;}
.forComplete .legendeANom{display: none;}
.forBox .open{display: none;}
.open li{list-style: circle;}
.forBox h4{
	font-size: 1.5em;
	display: inline-block;
	text-align: center;
	width:90%;
	margin-bottom: .5em
}
.forBox h4 span{
	font-size: .9em;
}
.forExtended .open{
	display: block!important;
}
.forExtended .legendeANom{
	display: inline-block;
	margin-top: -1.3em;
	text-align: left;
	width:100%;
}
.gradientVert{	
	background: rgba(91,143,23,1);
	background: -moz-linear-gradient(top, rgba(91,143,23,1) 0%, rgba(255,255,255,1) 30%, rgba(255,255,255,1) 100%);
	background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(91,143,23,1)), color-stop(30%, rgba(255,255,255,1)), color-stop(100%, rgba(255,255,255,1)));
	background: -webkit-linear-gradient(top, rgba(91,143,23,1) 0%, rgba(255,255,255,1) 30%, rgba(255,255,255,1) 100%);
	background: -o-linear-gradient(top, rgba(91,143,23,1) 0%, rgba(255,255,255,1) 30%, rgba(255,255,255,1) 100%);
	background: -ms-linear-gradient(top, rgba(91,143,23,1) 0%, rgba(255,255,255,1) 30%, rgba(255,255,255,1) 100%);
	background: linear-gradient(to bottom, rgba(91,143,23,1) 0%, rgba(255,255,255,1) 30%, rgba(255,255,255,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#5b8f17', endColorstr='#ffffff', GradientType=0 );
}
.forSelected.gradientVert{	
	background: rgba(91,143,23,1);
	background: -moz-linear-gradient(top, rgba(91,143,23,1) 0%, rgba(255,255,255,1) 30%, rgba(255,255,255,1) 100%);
	background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(91,143,23,1)), color-stop(30%, rgba(255,255,255,1)), color-stop(100%, rgba(255,255,255,1)));
	background: -webkit-linear-gradient(top, rgba(91,143,23,1) 0%, rgba(255,255,255,1) 30%, rgba(255,255,255,1) 100%);
	background: -o-linear-gradient(top, rgba(91,143,23,1) 0%, rgba(255,255,255,1) 30%, rgba(255,255,255,1) 100%);
	background: -ms-linear-gradient(top, rgba(91,143,23,1) 0%, rgba(255,255,255,1) 30%, rgba(255,255,255,1) 100%);
	background: linear-gradient(to bottom, rgba(91,143,23,1) 0%, rgba(255,255,255,1) 30%, rgba(255,255,255,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#5b8f17', endColorstr='#ffffff', GradientType=0 );
}
	.forAbonnement{
		border-radius: 5px;
		border: 1px solid #8cc63e;
		min-height:550px;
		margin:2em auto 1em;
		padding: 10px 10px 90px;
		position:relative;
		text-align: center;
		-webkit-transition:.5s ease;
		transition: .5s ease;
		width:280px;
	}
	.forSelected .forOpen{display:inline-block!important;}
	.forSelected .forClose{display:none!important;}
	.forOpen{display:none;}
	.forAbonnement .auto{
		margin: 0 auto 0px;
		width: 220px;
	}
	.forAbonnement .deuxAutos{
		margin: .5em auto 0;
		width: 103%;
	}
	.forAbonnement ul{
		list-style: none;
		margin:0 auto;
		padding:0;
		width:250px;
	}
	.forAbonnement li{
		margin:.5em 0;
		text-align: left;
	}
	.forAbonnement .icon-nike{
		font-size: 1em;
		float:left;
		margin-top: .1em;
	}
	.forAbonnement li p{
		margin-left: 2em;
		vertical-align: top;
		line-height: 1.2em;
	}
	/* forfait de base Auto-mobile */
	.forAbonnement .prixHeure{
		padding:.5em 0;
	}
	.btnAbonner{
		background: #39B2DE;
		border-radius: 5px;
		bottom: 3em;
		-webkit-box-shadow: -2px 5px 5px 0px rgba(50, 50, 50, 0.75);
		-moz-box-shadow: -2px 5px 5px 0px rgba(50, 50, 50, 0.75);
		box-shadow: -2px 5px 5px 0px rgba(50, 50, 50, 0.75);
		color: #FFF;
		font-size: .9em;
		left: 50%;
		margin: 0 0 0 -90px;
		min-width: 180px;
		padding: .7em 0;
		position: absolute;
	}
	.btnPlusInfo{
		background: #39B2DE;
		border-radius: 5px;
		bottom: 2em;
		color: #FFF;
		font-size: .9em;
		left: 50%;
		margin: 0 0 0 -90px;
		padding: .7em 0;
		position: absolute;
		width: 180px;
	}
	.forAbonnement .btnAbonner:hover, .forAbonnement .btnPlusInfo:hover {background-color: #2692C8; color: #fff;}
	.btnFlecheLeft{display:none;}
	/* end forfait de base Auto-mobile */
	/* abonnements complets */
	.tarifBox{
		overflow:auto;
		width:100%;
	}
	.row.forfaits{width:800px;}
	.forfaits .collumn{	
		background-color: rgba(204, 204, 204, .3);
		float: left;
		padding: 3% 1%;
		position: relative;
		width: 23%; 
	}
	.forfaits .collumn:first-child{
		background-color: #fff;
		width: 23%; 
	}
	.forfaits .collumn:first-child .forfait{margin:0;}
		.forfait{
			background-color: #fff;
			border: 1px solid #8f8f8f;
			border-radius: 3px;
			height: 410px;
			margin: 0 auto;
			overflow: hidden;
			position: relative;
			width: 180px; 
		}
		.demos .forfait{min-height: 560px;}
		
		.forfait h3{
			background-color: #fff;
			color: #333;
			line-height: 1.1em;
			text-align: center;
			padding: .3em 0; 
		}
		.forfait h3 .txtMini{font-size: .6em}
		.forfait p{line-height: 1.2em; margin: 0;}
			.forfait .prixHeure{
				border-top: 1px solid #8cc63e;  
			}
			.forfait .prixHeure, .forfait .prixKm{
				border-bottom: 1px solid #8cc63e; 
				font-size:16px; 
				padding: .7em 0;  
			}
			.collumn:first-child .forfait .prixHeure{background-color: rgba(168, 201, 89, .2); color: #333;}
			.forfait .prixHeure{background-color:#8cc63e; color: #fff;}
			.forfait .prixKm{
				height: 50px;
				margin-top: -1.35em;
			}
				.collumn:first-child .prixKm p, .collumn:last-child .prixKm p{margin-top: .4em;}
				.forfait .txtMini{font-size: .7em;}
				.prixHeure .argent{font-size: 2em}
				.prixHeure .dollars{font-size: 1.9em}
				.prixKm .argent, .prixKm .dollars{font-weight: 600;}
				.prixKm .icon-plus{
					background-color: #fff;
					border-radius: 50%;
					border: 1px solid #8cc63e;
					color: #8cc63e;
					display: inline-block;
					font-size: .8em; 
					padding: .25em .3em;
				}
			.collumn .forfait ul{
				list-style: none; 
				margin: 10px 0 0;
				padding: 0;
				width:100%; 
			}
			.forfait li{
				margin:0;
				padding: .3em 0 0; 
				text-align: center;
			}
			.forfait li .txtMini{font-size: .8em;}
			.collumn .forfait li a{color:#8cc63e;display: inline-block;}
			.btnPlusForfait{
				position: absolute;
				bottom: .8em;
				left: 50%;
				margin: 0 0 0 -75px;
				width: 150px;
			}
			.forfaits .populaire{padding: 2.8% 1%;}
			.populaire .forfait{
				border: 3px solid #39B2DE;
				margin-top:-2px; 
			}
			.populaire .prixHeure{
				background-color: #8cc63e;
				border-bottom: 1px solid #648E3D; 
			}
		.tarifExtra{
			font-size: 1.2em;
			text-align: left;
			padding:1em 0 0;
		}
	/* abonnements complets */
	.titreForfait{margin:.5em 0;}
/* fin forfaits */

/* 04.2 description  */

#txtForDescription{
	border:1px solid #39B2DE;
	display:none;
	overflow: visible; 
	padding:2em 1em;
}
.btClose{
	background-color: white;
	border-radius: 50%;
	border:2px solid #39B2DE;
	cursor:pointer;
	display:block;
	font-weight: 600;
	height:19px;
	margin: 0 .5em;
	padding: .3em .55em;
	position: absolute;
	right:1em;
	top:-17px;
	width:10px;
}
.btClose:hover{
	border:2px solid #2692C8;
	color:#2692C8;
}
#txtForDescription div{display:none;}
#txtForDescription .dollars{font-size: 1.5em}
#txtForDescription h3{font-size: 1.6em}
.txtForIntro {margin-top: 2em}
/* fin description forfaits */

/* 04.3 calculateur */
.calculer{
	background-color: rgba(56, 176, 220, .1);
	border-radius: 5px;
	display:block;
	padding: 15px 0;
	float: left;
	vertical-align: top;
	width: 100%;
}
.calcul{
	margin: 0 auto;
	width: 270px;
}
.calculer h3{
	-moz-border-radius-topleft: 10px;
	-moz-border-radius-topright: 10px;
	-webkit-border-top-left-radius: 10px;
	-webkit-border-top-right-radius: 10px;
	border-top-left-radius: 10px;
	border-top-right-radius: 10px; 
	color: white;
	cursor: pointer;
	margin: .5em 0 0;
	padding: .5em 0;
	width:100%;
}
.calcul h5{font-size: .75em; margin:1.2em 0 .5em;}
.triangleActive{
	border-color: #fff transparent transparent transparent;
	border-style: solid;
	border-width: 10px 7.5px 0 7.5px;
	display: inline-block;
	opacity: 1;
	margin:0 10px; 
}
.triangleInactive{
	border-color: transparent transparent transparent #fff;
	border-style: solid;
	border-width: 7.5px 0 7.5px 10px;
	display: inline-block;
	height: 0;
	margin:0 10px; 
	opacity: .5;
	width: 5px;
}
.circle{
	border-radius: 50%;
	border:1px solid #39B2DE;
	margin:0 10px; 
	padding: .2em .5em;
}
.txtVert .circle{border:1px solid #8cc63e; margin:0 10px 0 0; }
.calculer .acc_cont{
	border: 1px solid #39B2DE;
	margin: 0;
	padding: 10px 10px 20px; 
}
.comparer{
	display:block;
	float: left;
	padding: 15px 0;
	vertical-align: top;
	width:100%;
}
.comparer h5{font-size: .8em; margin:1.2em 0 .5em;}
.comparer .formules{
	display:block;
	float: left;
	vertical-align: top;
}
.comparer h3{
	font-size: 1em;
	font-weight: 600;
	padding: .5em 0;
	border-bottom: 1px solid #8cc63e; 
}
.comparer .base{
	text-align: center;
	width:100%;
}
.comparer .completes{
	text-align: center;
	width:100%;
}
.comparer .formule{
	border-radius: 5px;
	border:1px solid #999;
	margin:0 auto;
	width:150px;
}
.contForComp{
	float:left;
	margin:0 0 .6em;
	width:50%;
}
.comparer .txtMini{
	font-size: .7em;
	margin:0.2em 0 .3em;
}
.prixFor{
	border-bottom: 1px solid #8cc63e;
	padding: .1em 0 .3em;
}
.prixFor b{
	font-size: 2em;
	font-weight: normal;
}
.prixAu{padding: .1em 0 .3em;}
.prixAu b{
	font-size: 1.6em;
	font-weight: normal;
}
.calAuto .prixAu b{font-size: 2em;}
.calcMsg{
	clear:both;
	display:inline-block;
	margin: 1em 0 0;
	width: 100%;
}
.calcMsg .extraText{
	border-radius: 5px;
	border:1px solid #999;
	max-width:100%;
}
/* fin calculateur */

/* 04.4 elements page combien */
/* avantages formules Completes */
.avantagesFor{margin: 1em 0;}
.avtTxt{display: none;}
.avantagesFor h3{
	cursor:pointer;
	margin-top:2em;
	vertical-align: middle
}
.avantagesFor h3 span{
	font-size: 2em;
	vertical-align: middle;
}
.avantagesFor samp{
	display:inline-block;
	text-align: right;
	width:100%;
}
/* fin avantages formules Completes */

/* Auto-mobile illimité */
#auto-mobile_illimite .imgLaissezPasser{
	border: 1px solid #91c054;
    border-radius: 13px;
    display: block;
    float: left;
    font-size: 0;
    margin: 0 16px 16px 0;
    width: 250px;
}
#auto-mobile_illimite p{
	display: inline-block;
}
/* fin Auto-mobile illimité */
/* tableau longue distance */
.tableauLD, .tableauRF{
	border-radius: .5em;
	border: 1px solid #8cc63e;
	margin: 0 auto;
	max-width: 478px;
	overflow: hidden;
	position: relative;
}
.tableauLD table, .tableauRF table{border: 1px solid #8cc63e;}
.tableauLD tr{
	width: 25%;
	text-align: center;
}
.tableauRF tr{
	width: 50%;
	text-align: center;
}
.tableauLD h4 span, .tableauRF h4 span{font-size: .8em}
/* fin tableau longue distance */
/* img tableau automobile - communauto */
.imgAutoCommun{
	margin: 0 auto;
    max-width: 100%;
}
/* fin img tableau automobile - communauto */
/* fin elements page combien */
/* fin page combien */

/* 05. page contact */
.boxCont{
	border:1px solid #8cc63e;
	display: block;
	min-height: 380px;
	overflow: hidden;
	padding: 1em;
	width: 95%;
	-moz-width:calc(100% - 34px);
	-webkit-width:calc(100% - 34px);
	-ms-width:calc(100% - 34px);
	width:calc(100% - 34px);
}
.form_ligne {
    background-color: #fff;
    border-radius: .5em;
    display: block;
    font-weight: bold;
    margin: 1.3em 0;
    padding: 1em 0;
    text-align: center;
    text-decoration: none;
    width: 100%;
}
/* fin page contact */


/* 06 page conexion */
.boxConnexion{
	border-radius: .5em; 
	float:left;
	height:360px; 
	margin-bottom:50px;
	overflow: hidden;
	width:100%; 
} 
.titreConnexion{
	color:#fff;
	height:60px;
	width:100%; 
}
.titreConnexion h3{ padding:1em; }
.contConnexion{margin:1em;}
.contConnexion a{
	color:#39B2DE; 
	text-decoration:none;
}
.contConnexion a:hover{color:#2692C8;}
#send{
	-moz-border-radius:.5em;
	-webkit-border-radius:.5em;
	border-radius:.5em;
	border:none;
	cursor:pointer;
	display:block;
	font-weight:bold;
	padding:.5em 1em;
	text-decoration:none;
}
#send:hover{background:#2692C8;} 
.inputCon{ 
	border:1px solid #EBEBEB;
	height:30px; 
	margin: 0 0 1em 0;
	width:100%; 
}
.connexPromoBase{
	float:left; 
	margin-left: 1%;
	overflow: hidden;
	width:100%; 
} 
.motRei{
	color:#E26440; 
	font-size: 12px; 
	margin-top: 10px; 
}
.instructions{display:none;}
/* fin page conexion */

/* 07 page calculateur */
.calCont{font-family:Arial, Helvetica, sans-serif!important;}
.ui-accordion-content{ padding: 0;} 
td{ 
	font-size: .9em;
	color:#999;
	margin: 0; 
	padding:.2em 0;
}
.calFooter{ 
	border-radius:.4em; 
	border-top-right-radius:.4em;
	margin: 10px 0; 
	padding: 7px 0;
	text-align: center; 
}
.calCont h3{ 
	border-top-left-radius:.4em!important;
	border-top-right-radius:.4em!important;
}
.sections{ 
	float:left; 
	margin-bottom: 2em!important; 
	width: 100%; 
}
.section1{ height:370px;}
.section2{ 	height:365px;}
.section2 table{ width: 100%; text-align: center;}
.section2 a,.extraText a{color: #39B2DE;} 
.section2 a:hover,.extraText a:hover{ color: #2692C8;}
#result td { 
	border-bottom:#CCC 1px dashed; 
	height: 41px; 
	padding:0 10px; 
	text-align: center;
}
#result td.last {border-bottom:none;} 
.th { 
	padding:4px; 
	height: 28px;
}
.th:nth-child(odd) { 
	border-top-left-radius:.4em!important;
}
.th:nth-child(even) { 
	border-top-right-radius:.4em!important;
}
.input1 { 
	border: #8cc63e 1px solid; 
	background:#f8f8f8; padding: 4px;
} 
.input2{ width: 120px;}
.calcu { 
	border-radius:.4em; 
	border:none; 
	cursor:pointer; 
	margin: .5em auto 0;
	padding: 8px; 
}
.calcu:hover { background: #2692C8;}
.acc_cont { 
	background:#FFF; 
	border:none; 
	margin:0 auto; 
	padding:0; 
}
.acc_cont table { 
	margin:0; 
	padding:0; 
	width: 100%;
}
.accordion h3 { 
	background:#8cc63e; 
	border-radius:0; 
	border:none; 
	font-weight: bold; 
	height: 22px;
}
.accordion h3 a:link {color:#FFF;} 
.accordion h3:hover { background:#8DC63F;} 
.clear{ clear: both;}
.ld{ font-size: 12px;} 
.info{ 
	font-size: 12px; 
	color: #999; 
	text-align: center;
	margin-top: 8px;
}
.calCont{
	max-width: 670px; 
	margin:auto; 
	padding-top:10px;
}
.extraText{
	background: #fff; 
	border: 1px #eee solid; 
	color: #999; 
	display: none; 
	margin-bottom: 5px;
	margin:auto; padding:20px; 
	max-width: 630px; 
}
.extraText ul{ margin: 20px;} 
.ptit{ font-size: 12px;}
.barre{
    text-align:center;
    position:relative;
    z-index:2;

}
.barre:after{
    content:"";
    position:absolute;
    top:50%;
    left:0;
    right:0;
    border-top:solid 1px #000;
    z-index:-1;
}
/* page calculateur */

/* 08 page inscription */
.onOffLine{
	overflow: hidden;
	position: relative;
	width: 100%;
}
.btnOnOffLine{
	overflow: hidden;
	width: 100%;
}
.btnOnOffLine a{
	display: block;
	float: left;
	font-size: 1.1em;
	margin-right: 1px;
	padding: .3em .53em;
	vertical-align: left;
}
.btnOnLine{border-top-left-radius:.3em; }
.btnOffLine{border-top-right-radius:.3em;}
.btnOnOffLine a:hover{color: #fff;}
.btnOnOffLine .bgGrisObs:hover{background-color: #333;}
.btnOnOffLine .bgVert:hover{background-color: #648E3D;}
.onLine{
	border: 1px solid #8cc63e;
	display: block;
	overflow: hidden;
	padding: 1em;
}
.onLine .elmImg{
	float: left;
	max-width: 15%
}
.onLine .elmTxt{
	float: left;
	max-width: 90%;
	position: relative;
}
.onLine .elmTxt:last-child{max-width: 100%;}
.elmTxt ol{margin: 0; padding-left:1.5em; }
.elmTxt li{padding: .5em 0 0}
.elmTxt ul{margin: .5em 0 0 -1.5em; padding-left:0;}
.elmTxt  .listOpt{
	border-radius: .5em;
	color:#fff; 
	cursor: pointer;
	height: 3.5em;
	margin: .3em;
	overflow: hidden;
	padding: 0;
	position: relative;
	text-align: left;
	width: 255px;
}
.listOpt:hover{background-color: #333;}
.listOpt:first-child:hover{background:#2692C8;}
.opInscription{
	color: #fff;
	display: block;
	font-size: 1em;
	left: 60px;
	margin: 0;
	position: absolute;
	top: .6em;
	line-height: 1.2em;
}
.ins .opInscription{top:1.2em;}
.listOpt span{
	font-size: 2.5em; 
	left: 8px; 
	overflow: hidden;
	position: absolute;
	top: 8px;
	width: 40px;
}
.elmTxt ol:first-child .mobile{display: inline;}
.elmTxt ol:first-child .tablet{display: none;}
.offLine{
	border: 1px solid #8cc63e;
	display: none;
	overflow: hidden;
	padding: 1em;
}
.offLine .elmImg{
	float: left;
	max-width: 15%
}
.offLine .elmTxt{
	float: left;
	margin-bottom: 1em;
	max-width: 90%;
	position: relative;
}
.offLine .elmTxt:last-child{max-width: 100%;}
.offLine ul{margin: 0 0 .5em 0; padding-left:1em;}

.conditions .condition {text-align: center; padding: .5em  0  }
.condition {overflow: hidden;}
.condition .elms3{
	background-color: #fAfAfA;
	border-top:#8cc63e 3px solid;
	padding-top: 1em;
	min-height: 200px;
	margin-bottom: 1em;
}
.conditions .elms3:nth-child(3){margin: 0;}
.condition .elms3 a, .condition .elms3 p{font-size: .9em; padding: 0 .5em; }
.condition .elms3 h4{ padding: 0 .4em; }
.conditions .con2{padding-bottom: 0;}
.conditions h3 {
	display: inline-block; 
	margin: 1em 0 0; 
	padding-bottom: .2em;
	width: 100%
}
.conditions h3:first-child {margin: 0;}
.conditions .txt{
	clear: both;
	display: block; 
	text-align: left; 
	padding:1em 0; 
}
/* end page inscription */

/****** 09 responsive ******/
@media only screen and (min-width : 360px) {
	.sectionPromos .elmResponsive{max-width: 290px; }
	.forAbonnement{width:300px;}
	.comparer .formule{width:160px;}
}
@media only screen and (min-width : 370px) {
	.encadresIntroServices .elm{height: 14.5em;}
}
@media only screen and (min-width : 400px) {
	.mobile{display: none!important;}
	.tablet{display: block;}
	.desktop{display: none;}
	.encadresIntroServices .elm{height: 15em;}
}
@media only screen and (min-width : 768px) {
	.mobile{display: none;}
	.tablet{display: block;}
	.desktop{display: none;}
	#abonnez a{font-size: 1em; padding:13px;}
	#map, .mobNone{display: block;}
	#villeID{display: block;}
	nav, .imgAutosTop, .boxMobile {display: none;}
	#wrapper{margin-top:-15px;}
	/** banner promo pub map **/
	#pubMap{
		background-color: #ff4285;
		display:block;
		height:370px;
		position:absolute;
		top:134px;
		width: 100%;
		z-index: 5;
		-webkit-transition:1s ease-out;
		-moz-transition:1s ease-out;
		-ms-transition:1s ease-out;
		transition:1s ease-out;
	}
	.lifeStylePromoContainer{
		position:relative;
		margin:0 auto;
	}
	.skipPromo{
		font-size: 16px;
		bottom: 1.5em;
		color:white;
		display:block;
		position:absolute;
		right:5em;
		text-decoration: underline;
		z-index: 6;
	}
	.skipPromo:hover{
		color:white;
		text-decoration: underline;
	}

	/** fin banner promo pub map **/
	.txtIntro{margin-top: 2em;}
	.quebec .txtIntroDefault{display:none;}
	.quebec .autoMobileQC{display:block; z-index: 2;}
	.elms3{
		float: left;
		display: block;
		margin: 0 2% 0 0;
		overflow: hidden;
		width: 32%
	}
	.color h2 a {font-size: .8em;}
	.tri{margin-left:1.2em;}
	.elmContenu img {margin: 1.3em .5em 0 .8em; width: 40px;}
	.elmContenu p{margin: 1.3em .5em 0 0;}
	.img2sev img{margin: 0;	width: 100%;}
	.titre h2{font-size: 1.5em; padding: 0 2em; }
	.titre .ligne{top:1em;}
	.sousTitre h2{font-size: 1.5em; padding: 0 2em; }
	.sousTitre .ligne{top:1em;}
	.collumn {width: 25%}
	.deuxServices .collumn {
		width: 46%;
	}
	.deuxServices .collumn:last-child{
		margin-right: 0;
		float:right;
	}
	.colVideo{
		float:left;
		margin-right: 2%;
		width: 48%;
	}
	.deuxServices .pointAB{
		margin-top:27px;
	}
	.functionement .icones, .offres .icones{font-size: 7em;}
	.blockLigneTop .elm {min-height: 133px;}
	.communaute{max-width: 956px; padding: 0;}
	.communaute h3, .communaute p, .communaute a{margin: 12px; }
	.communaute img{display: block;}
	.communaute .collumn{height: 470px; width: 25%; max-width: 235px;}
	.communaute .communTxt{min-height: 205px;}
	.actualite .collumn {width: 50%;}
	.communaute .orange .social{display: block;}
	.onparle{width: 80%;}
	.footer_col{width:31.5%;}
	#pageOu{overflow-y:auto;}
	.btnVilles{
	    padding: 0.3em .8em 0.3em 0.6em;
	}
	.menuVilles .nomVille, .menuVilles .icon-pin{display:inline;}
	.abreviation{display: none;}
	.sectionMap.entete .titre{display:block;}
	.codePostal {display: block;}
	#menuComboBox div{float:left; width: 50%}

	.iconDescription, .ouliens{
		float: left;
		list-style: none; 
		margin: 0; 
		overflow: hidden;
		padding: 0;
		width: 50%;
	}
	.iconDescription li, .ouliens li{
		border-bottom: none; 
		color: #949494;
		padding: .2em 0;
	}
	.iconDescription li:first-child{display: none;}
	.iconDescription li:nth-child(2), .iconDescription li:nth-child(3){display: block;}
	.boxCont{min-height: 472px;}
	.boxConnexion{width:40%;}
	.connexPromoBase{width:59%;}
	.sectionPromos .elmResponsive {max-width: 220px;}
	.sections{ margin-bottom: 0!important; padding: 5px; width: 320px;}
	.section2{ margin-left: 10px;}
	.btnOnOFLine a{font-size: 1.5em; padding: .3em 1em;}
	.onLine .elmImg, .offLine .elmImg{max-width: 10%}
	.onLine .elmTxt, .offLine .elmTxt{max-width: 90%;}
	.elmTxt ol{margin: 0; padding-left:2em; }
	.onLine .elmTxt ul{float: right; margin: 0; padding-left: 2em;}
	.elmTxt ol:first-child .mobile{display: none;}
	.elmTxt ol:first-child .tablet{display: inline;}
	.imgAutoCommun{max-width: 75%;}
	/* page tarifs formules */
	.forfaits .collumn{width: 25%; padding: 7px 0 ;}
	.forfaits .populaire{width: 25%; padding: 6px 0 ;}
	.forfait{width: 96%;}
	.forBox{
		float:left;
		position:relative;
		width:50%;
	}
	.forSelected.gradientVert{	
		background: rgba(91,143,23,1);
		background: -moz-linear-gradient(top, rgba(91,143,23,1) 0%, rgba(255,255,255,1) 20%, rgba(255,255,255,1) 100%);
		background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(91,143,23,1)), color-stop(20%, rgba(255,255,255,1)), color-stop(100%, rgba(255,255,255,1)));
		background: -webkit-linear-gradient(top, rgba(91,143,23,1) 0%, rgba(255,255,255,1) 20%, rgba(255,255,255,1) 100%);
		background: -o-linear-gradient(top, rgba(91,143,23,1) 0%, rgba(255,255,255,1) 20%, rgba(255,255,255,1) 100%);
		background: -ms-linear-gradient(top, rgba(91,143,23,1) 0%, rgba(255,255,255,1) 20%, rgba(255,255,255,1) 100%);
		background: linear-gradient(to bottom, rgba(91,143,23,1) 0%, rgba(255,255,255,1) 20%, rgba(255,255,255,1) 100%);
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#5b8f17', endColorstr='#ffffff', GradientType=0 );
	}
	/* formule base seleted */
	.forBase.forExtended{
		opacity:1;
		overflow:hidden;
		width:65%; 
	}
	.forSelected{min-height:620px;}
	.forComplete.forMinified{
		opacity:.5;
		overflow:hidden;
		width:35%; 
	}
	.forComplete.forMinified:hover{opacity:.9;}
	.forBase .forSelected{
		width:90%;
	}
	.forBase .forSelected ul{
		margin-top: 0;
		width:100%;
	}
	.forBase .forSelected li{
		float:left;
		margin: 0 2% 0 4%; 
		width:44%;
	}
	.forBase .forSelected .icon-nike {margin-top: .5em;}
	.forSelected .auto{
		margin:.5em 0 0 0; 
		display:block;
		width:230px;
	}
	.forBase .forSelected .btnAbonner{
		bottom:80%;
		left:77%;
	}
	.forBase.forMinified .btnFlecheLeft{
		cursor:pointer;
		display:block;
		left:0;
		opacity:.8;
		position:absolute;
		top:45%;
		z-index:2;
	}
	.forBase.forMinified:hover .btnFlecheLeft{opacity:1;}
	/* end formule base seleted */
	/* formule complete seleted */
	.forBase.forMinified{
		opacity:1;
		overflow:hidden;
		width:7.5%;
	}
	.forMinified .base, .forMinified h5{opacity:.3;}
	.forBase.forMinified:hover{opacity:.9;}
	.forComplete.forExtended{
		opacity:1;
		overflow:hidden;
		width:92.5%; 
	}
	.forMinified .base, .forMinified h5{margin-left: -270px}
	.forComplete .forSelected{height:530px; width:95%;}
	.ulOpen{
		left:37%;
		position:absolute;
		top: 2.5em;
		width:280px!important;
	}
	.forComplete .forSelected .btnAbonner{
		bottom:78%;
		left:85%;
	}
	.forBox .forExtended h5{
		text-align: center;
		width:90%;
	}
	.hidenTabletV{display:none;}
	.pBottom{
		bottom: 1em;
		display: none;
		margin: 0;
		position: absolute;
		text-align: center;
		width: 96%;
	}
	 .forSelected .pBottom{display:block;}
	/* end formule complete seleted */
	/* end page tarifs formules */
	.autres .elemFloat{width: 33%; padding: 5px 0 0;}
	.abonnementBase .autres .elemFloat.ab{padding-top: 0;}
	#auto-mobile_illimite p{ display: block;}
	/*calculateur page combien*/
	.calculer{width: 40%;}
	.comparer{margin-left: 2%;	width: 58%;}
}
@media only screen and (min-width : 855px) {
	.bugerMenu {display:none;}
	nav {display: block;}
	.logoComm{ width:160px; }
	.headerLogoBtn{margin:1.3em auto; padding:0 1em;}
	#abonnez a{font-size: 1.2em; padding:15px;}
	.tri{margin-left:1.4em;}	
	.elmContenu img {margin: 1.3em .5em 0 .8em;}
	.elmContenu p{margin: 1.3em .5em 0 0;}
	.color h2 a {font-size: .9em;}
	.img2sev img{margin: 0;	width: 100%;}
	.orange strong{font-size: 1.3em;}
	.communaute{padding: 0 0.6em;}
	.communaute h3, .communaute p, .communaute a{margin: 16px; }
	.communaute p{font-size: .9em}
	.communaute .collumn{ max-width: 235px;}
	.boxCont{min-height: 450px;}
	.sectionPromos .elmResponsive {max-width: 250px;}
}
@media only screen and (min-width : 956px) {
	#wrapper{margin-top:130px;}
	.mobile{display: none;}
	.tablet{display: none;}
	.desktop{display: block;}
	.margeSection{margin-top: 3em;}
	.menuTop{position: fixed;}
	.encadresIntroServices .elm{height: 13em;}
	.img2sev img{margin: 0;	width: 100%;}
	.functionement .icones, .offres .icones{font-size: 9em;}
	.blockLigneTop .elm {min-height: 115px;}
	.orange strong{font-size: 1.5em;}
	.communaute p{font-size: .95em; line-height: 120%;}
	.pages #wrapper{margin-top:130px}
	.entete{margin-top: 0; }
	.entete .shadow_b{display: block; }
	.entete .margeResponsive{margin: 1em auto; padding: 0;}
	.btnVilles{padding: 0.3em 1.4em 0.3em 0.6em;}
	.margeInterSection{margin-top: 2em;}
	.liAvantages li{margin:.5em 0; width:45%;}
	.liAvantages li:nth-child(2n){margin-left: 5%;}
	.entete .margeResponsive{padding: .5em 0 2em;}
	.boxConnexion{width:30%;}
	.connexPromoBase{width:69%;}
	.boxCont{min-height: 390px;}
	.sectionPromos .elmResponsive {max-width: 297px;}
	.popu{width: 45px;}
	/* page tarifs formules */
	.forSelected .auto{width:270px;}
	.forSelected{min-height:550px;}
	.forBase .forSelected .btnAbonner{left:80%;}
	.hidenTabletV{display:inline;}
	/* end page tarifs formules */
	/* calculateur page combien*/
	.comparer .base{width:37%;}
	.comparer .base h5{margin-left: -2.8em;}
	.comparer .calAuto{ margin: 0;}
	.comparer .completes{width:63%;}
}
/****** fin responsive ******/