* {
	font-family: Lato, Verdana, Arial, Helvetica, sans-serif;
	font-size: 1em;
	margin: 0;
	outline: medium none;
	padding: 0;
	text-decoration: none;
}

/* blocks widths (percentage and pixels) */

.w10 {
	width: 10%;
}

.w20 {
	width: 20%;
}

.w25 {
	width: 25%;
}

.w30 {
	width: 30%;
}

.w33 {
	width: 33.3333%;
}

.w40 {
	width: 40%;
}

.w50 {
	width: 50%;
}

.w60 {
	width: 60%;
}

.w66 {
	width: 66.6666%;
}

.w70 {
	width: 70%;
}

.w75 {
	width: 75%;
}

.w80 {
	width: 80%;
}

.w90 {
	width: 90%;
}

.w100 {
	width: 100%;
}

.w50p {
	width: 50px;
}

.w100p {
	width: 100px;
}

.w150p {
	width: 150px;
}

.w200p {
	width: 200px;
}

.w300p {
	width: 300px;
}

.w400p {
	width: 400px;
}

.w500p {
	width: 500px;
}

.w600p {
	width: 600px;
}

.w700p {
	width: 700px;
}

.w800p {
	width: 800px;
}

.w960p {
	width: 960px;
}

.mw960p {
	max-width: 960px;
}

.w1140p {
	width: 1140px;
}

.mw1140p {
	max-width: 1140px;
}

.wauto {
	width: auto;
}

/* ----------------------------- */

/* == spacing helpers            */

/* .. use only when needed       */

/* ----------------------------- */

/* spacing helpers
p,m = padding,margin
a,t,r,b,l = all,top,right,bottom,left
s,m,l,n = small(10px),medium(20px),large(30px),none(0)
source https://github.com/stubbornella/oocss/blob/master/core/spacing/space.css
*/

.m-reset,
.ma0 {
	margin: 0;
}

.p-reset,
.pa0 {
	padding: 0;
}

.ma1,
.mas {
	margin: 10px;
}

.ma2,
.mam {
	margin: 20px;
}

.ma3,
.mal {
	margin: 30px;
}

.pa1,
.pas {
	padding: 10px;
}

.pa2,
.pam {
	padding: 20px;
}

.pa3,
.pal {
	padding: 30px;
}

.pa4 {
	padding: 40px;
}

.pa5 {
	padding: 50px;
}

.mt0,
.mtn {
	margin-top: 0;
}

.mt1,
.mts {
	margin-top: 10px;
}

.mt2,
.mtm {
	margin-top: 20px;
}

.mt3,
.mtl {
	margin-top: 30px;
}

.mt4 {
	margin-top: 40px;
}

.mt5 {
	margin-top: 50px;
}

.mr0,
.mrn {
	margin-right: 0;
}

.mr1,
.mrs {
	margin-right: 10px;
}

.mr2,
.mrm {
	margin-right: 20px;
}

.mr3,
.mrl {
	margin-right: 30px;
}

.mb0,
.mbn {
	margin-bottom: 0;
}

.mb1,
.mbs {
	margin-bottom: 10px;
}

.mb2,
.mbm {
	margin-bottom: 20px;
}

.mb3,
.mbl {
	margin-bottom: 30px;
}

.ml0,
.mln {
	margin-left: 0;
}

.ml1,
.mls {
	margin-left: 10px;
}

.ml2,
.mlm {
	margin-left: 20px;
}

.ml3,
.mll {
	margin-left: 30px;
}

.pt0,
.ptn {
	padding-top: 0;
}

.pt1,
.pts {
	padding-top: 10px;
}

.pt2,
.ptm {
	padding-top: 20px;
}

.pt3,
.ptl {
	padding-top: 30px;
}

.pt4 {
	padding-top: 40px;
}

.pt5 {
	padding-top: 50px;
}

.pr0,
.prn {
	padding-right: 0;
}

.pr1,
.prs {
	padding-right: 10px;
}

.pr2,
.prm {
	padding-right: 20px;
}

.pr3,
.prl {
	padding-right: 30px;
}

.pb0,
.pbn {
	padding-bottom: 0;
}

.pb1,
.pbs {
	padding-bottom: 10px;
}

.pb2,
.pbm {
	padding-bottom: 20px;
}

.pb3,
.pbl {
	padding-bottom: 30px;
}

.pb4 {
	padding-bottom: 40px;
}

.pb5 {
	padding-bottom: 50px;
}

.pl0,
.pln {
	padding-left: 0;
}

.pl1,
.pls {
	padding-left: 10px;
}

.pl2,
.plm {
	padding-left: 20px;
}

.pl3,
.pll {
	padding-left: 30px;
}


.ui-content {
	padding:10px;
	box-sizing: border-box;
}

.ui-content.map {
	padding:0px;
}

#header {
	background-image:none;
	background:#000;

	width: 100%;
	background: #000;
	/* border-top: solid 1px #FFF; */
	position: fixed;
	z-index: 997;
	top: -1px;
	left: 0;
	box-shadow: 0px 0px 12px #111;
	height:66px;
	border:0px;
}

#bannerPub {
	position:fixed;
	bottom:64px;
	width:100%;
	text-align:center;
	background:rgba(0,0,0,0.8);
	box-shadow:0 0 10px rgba(0,0,0,0.5);
	z-index:2;
}

#bannerPub .pub {
	width:100%;
	max-width:400px;
	margin:0 auto;
}

#bannerPub .pub img {
	vertical-align:top;
	width:100%;
}

#bannerPub span.close {
	position:absolute;
	top:-18px;
	right:0px;
	background:#333;
	border-radius:100px;
	padding:5px;
	vertical-align:top;
	border:solid 2px #FFF;
	box-shadow:0 0 10px rgba(0,0,0,0.5);
}

#bannerPub span.close img {
	width:20px;
	vertical-align:top;
}

.pub.spot {
	margin:25px auto 0;
	width:100%;
	max-width:500px;
}

.pub.spot img {
	vertical-align:top;
	width:100%;
}

#header .logo {
	display:inline-block;
	padding-top:8px;
	padding-left:8px;
}

#header .logo img {
	width:180px;
	vertical-align:top;
}

.contentMenu {
	padding:0;
	background:none;
}

.contentMenu .menu {
	display:none;
}



.menu {
	position: absolute;
	display: none;
	z-index: 10000;
	margin: 0;
	right: 0px;
	top: 65px;
	background: #000;
	padding: 10px;
	box-shadow: 0px 0px 10px rgba(0,0,0,0.5);
	max-width:250px;
	text-align:left;
}

.menu li {
	display:block;
}

.menu li a {
	display:block;
	color:#FFF !important;
	text-decoration:none;
	font-weight:normal !important;
	text-transform:uppercase;
	padding:10px 5px;
	cursor:pointer;
}

.menu li a b {
	font-weight:normal !important;
}

.menu-smart {
	display:inline-block;
	cursor: pointer;
	background:#222;
	border:solid 1px #666;
	padding:4px 6px;
	border-radius: 3px;
	position:absolute;
	right:10px;
	top:10px;
	z-index:9100;
}

.menu-smart img{
	vertical-align:top;
}

.menu-bg {
	position: absolute;
	width: 100%;
	height: 10000%;
	top: 0px;
	left: 0px;
	background: rgba(0,0,0,0.7);
	z-index: 9000;
}

.annonceList {
	margin-top:25px;
}

.annonceList a {
	display:block;
	padding:10px 0px;
	padding-left:110px;
	position:relative;
	min-height:100px;

	font-weight:normal;
	color:#000;
	text-decoration:none;

	border-bottom:solid 1px #EEE;
}

.annonceList a .annonceImg {
	position:absolute;
	left:0px;
	top:10px;
}


.annonceList a .annonceTxt {
	/*padding-top:10px;*/
}


.annonceList a .annonceTitle {
	color:#000;
	font-weight:bold;
}

.annonceList a .annoncePrice {
	color:#F60;
	font-weight:bold;
	font-size:1.2em;
	padding:5px 0px;
}

.annonceList a .annonceCity {
	color:#666;
	font-weight:normal !important;
	font-size:0.9em;
}

.annonceList a .annonceDate {
	color:#999;
	font-weight:normal !important;
	font-size:0.8em;
}

.annonce .annonceImg {
	width:100%;
	max-width:800px;
	margin:0px auto;
}

.annonce .annonceImg img {
	width:100%;
}

.annonce .annonceDesc {
	margin-top:10px;
	margin-bottom:20px;
}

.annonce .annonceDate {
	margin-bottom:10px;
}

.annonce .annoncePrice {
	color:#F60;
	font-weight:bold;
	font-size:1.6em;
	padding:5px 0px;
}

.annonce .annonceStatus {
	color:#F60;
	font-weight:bold;
	font-size:1.6em;
	padding:5px 0px;
	margin:0px auto;
	text-align:center;
}

.annonce .annonceCity, .annonce .annonceUser, .annonce .annonceTel {
	margin-top:5px;

}

.btnFav {
	float:left;
	padding:5px 8px;
	display:inline-block;
	border:solid 1px #CCC;
	border-radius:3px;
	margin-right:10px;
}

.btnMap {
	float:right;
	padding:5px 8px;
	display:inline-block;
	border:solid 1px #CCC;
	border-radius:3px;
	margin-left:10px;
}


.spotMenu {
	padding:0px;
	border-top:solid 1px #EEE;
	border-bottom:solid 1px #EEE;
	text-align:center;
	overflow: auto;
	white-space: nowrap;
}

.spotMenu a {
	padding:10px 15px;
	text-decoration:none;
	display:inline-block;
	/*margin:0px 2px;*/
	color:#333 !important;
	border-bottom:solid 3px #FFF;
}

.spotMenu a.selected {
	color:#C00 !important;
	border-bottom:solid 3px #C00;
	font-weight:bold;
}


.spotSubMenu {
	padding:5px;
	border-top:solid 1px #EEE;
	border-bottom:solid 1px #EEE;
	text-align:center;
}

.spotSubMenu a {
	padding:5px 10px;
	text-decoration:none;
	display:inline-block;
	margin:0px 2px;
	color:#333 !important;
}

.spotSubMenu a.selected {
	color:#C00 !important;
	font-weight:bold;
}


.spotTxtNonAbo {
	font-size:0.8em;
	color:#D00 !important;
	font-weight:normal;
	padding:10px 0px;
	text-align:center;
	display:block;
	text-decoration:none;
}

.spotObsLine {
	font-size:0.9em;
	padding-top:5px;
	padding-bottom:5px;
}

.spotObsLine:hover {
	background:rgba(0,0,0,0.05);
}


.spotObsLine.head {

}

.spotObsLine.head:hover {
	background:none;
}

.spotObsLine div {
	display:inline-block;
	text-align:center;
	vertical-align:top;
}

.spotObsLine div.img {
	position:relative;
}

.spotObsLine div.img img {
	position:absolute;
	left:3px;
	top:-3px;
}

.spotObsLine div.deg {
	font-size:0.9em;
	color:#AAA;
}


.spotObsLine .bar{
	margin-top:3px !important;
}

.spotObsLine .graph {
	width:25%;
	text-align:center;
	display:inline-block;
	text-align:left;
}

.spotObsLine.head div span {
	display:block;
	font-size:0.9em;
	color:#AAA;
	font-weight:normal;
}

.spotObsLast {
	width:320px;
	margin:0 auto;
	margin-top:15px;
}

.spotObsLast > div {
	display:inline-block;
	vertical-align:top;
}

.spotObsLast .date {
	font-size:0.75em;
	color:#999;
	display:block;
	padding-left:50px;
	margin-top:-6px;
}

.spotObsLast .img {
	width:45px;
}

.spotObsLast .speed {
	font-size:1.8em;
	font-weight:bold;
	padding-top:6px;
	padding-right:10px;
}

.spotObsLast .speed span {
	font-size:0.8em;
	display:inline-block;
	padding-left:7px;
}

.spotObsLast .orientation {
	font-size:1.8em;
	padding-top:6px;
	padding-right:10px;
}


.spotObsLast .minMax {
	font-size:0.8em;
	padding-top:6px;
}


.spotObsLast .panne {
	font-size:0.9em;
	color:#333;
	text-align:center;
}

.spotObsMore {
	margin:20px 0px;
	text-align:center;
}

.spotObsMore a {
	padding:5px 10px;
	text-decoration:none;
	display:inline-block;
	color:#F60 !important;
	border:solid 1px #EEE;
	font-size:0.9em;
}

.spotObsHist {
	margin-top:25px;
	padding:25px 0px;
	border-top:solid 1px #EEE;
	border-bottom:solid 1px #EEE;
	text-align:center;
}

.spotObsHist > div {
	font-size:0.9em;
	margin-bottom:10px;
}


.spotObsHist a {
	padding:5px 10px;
	text-decoration:none;
	display:inline-block;
	color:#333 !important;
	border:solid 1px #EEE;
	font-size:0.9em;
}

.btnLive {
	padding:5px 8px;
	border:solid 1px #EEE;
	border-radius:3px;
	display:inline-block;
}



.spotObsLast .live {
	float:right;
	display:inline-block;
}

.spotObsLast .live span {
	color:#F60;
	font-size:0.7em;
	display:block;
	text-align:center;
}



.spotPrevisLine {
	font-size:0.8em;
	padding:3px 0px;
}

.spotPrevisLine:hover {
	background:rgba(0,0,0,0.05);
}

.spotPrevisLine.head {

}

.spotPrevisLine.head:hover {
	background:none;
}


.spotPrevisLine.head div {
	vertical-align:top;
}

.spotPrevisLine div {
	display:inline-block;
	text-align:center;
}

.spotPrevisLine.head div span {
	display:block;
	font-size:0.9em;
	color:#AAA;
	font-weight:normal;
}


#slideshow {
	margin-top:20px;
}

.spotBtnWebcam {
	padding-top:15px;
}

.spotBtnWebcam a {
	padding:5px 10px;
	text-decoration:none;
	display:inline-block;
	color:#333 !important;
	border:solid 1px #EEE;
	font-size:0.9em;
}

.spotStats {
	font-size:0.9em;
	margin-top:20px;

	padding:0 10px;
}


.spotNear {
	margin-top:15px;
	text-align:center;
}

.spotNear .nearlist {
	padding-top:15px;
}

.spotNear .nearlist a {
	display:inline-block;
	padding:5px 10px;
	text-decoration:none;
	color:#333 !important;
}

.spotNear .nearlist a:hover {
	text-decoration:underline;
	color:#111 !important;
}

.spotNear .nearlist a .dist {
	font-size:0.7em;
	color:#999;
	display:inline-block;
	padding-left:5px;
	font-weight:normal;
}

.footerBtnFullSite {
	margin-top:25px;
	padding:15px;
}

.footerBtnFullSite a {
	padding:5px 10px;
	text-decoration:none;
	display:inline-block;
	color:#333 !important;
	border:solid 1px #EEE;
	font-size:0.9em;
}

.footer {
	padding:15px;
	font-size:0.9em;
	font-weight:normal;
	background:#222;
	padding-bottom:100px;
}

.footer .logo {
	text-align:center;
	margin-bottom:10px;
}

.footer .logo img {
	width:100px;
}

.footer .social {
	text-align:center;
	margin-bottom:10px;
	font-size:0.9em;
}

.footer .social a {
	margin:0px 5px;
	text-decoration:none;
	display:inline-block;
	color:#333 !important;
	font-size:0.9em;
}

.footer .social img {
	width:30px;
}

.footer .brand {
	text-align:center;
	margin-bottom:10px;
	font-size:0.9em;
	color:#FFF;
}

.footer .brand span {
	color:#999;
}

.footer .flags {
	padding: 15px;
	border-bottom:solid 1px #333;
	text-align:center;
	margin-bottom:25px;
}


.footer .flags a {
	display:inline-block;
	padding:5px 15px;
}

.fancybox-skin {
	padding:10px !important;
	background:#111;
}

.layer.favSignup {
	color:#FFF;
	font-size:1em;
	text-align:center;
	font-family: Helvetica, Arial, sans-serif;
}

.layer.favSignup span {
	color:#FFF;
	font-size:1.3em;
	display:block;
	padding-bottom:15px;
}

.layer.favSignup a {
	/*
	padding:5px 10px;
	text-decoration:none;
	display:inline-block;
	color:#F60 !important;
	border:solid 1px #999;
	font-size:0.9em;
	margin-top:20px;
	*/

	border:solid 1px #333;
	margin-top:15px;
}

.layer.addFav, .layer.suppFav {
	color:#FFF;
	font-size:1em;
	text-align:center;
	font-family: Helvetica, Arial, sans-serif;
}

.layer.addFav span, .layer.suppFav span {
	color:#FFF;
	font-size:1.3em;
	display:block;
	padding-bottom:15px;
}





.liveWind {
	padding:15px;
	position:relative;
	text-align:center;
}

.liveWind .circle {
	border-radius:50%;
	width:230px;
	height:230px;
	border:2px solid #EEE;
	position:relative;
	display:inline-block;
}

.liveWind .circle .arrow {
	position:absolute;
	z-index:1;
	width:100%;
	height:100%;
	transform-origin:center center;
	transform: rotate(450deg);
	transition-duration: 2s;
}

.liveWind .circle .arrow svg {
	position:absolute;
	fill: #EEE;
	width:30%;
	height:30%;
	top:35%;
	left:-10%;
	transform: rotate(180deg);
	transform-origin:center center;
}

.liveWind .circle .arrow .pointer {
	position:absolute;
	left:-8px;
	top:calc(50% - 6px);
	z-index:1;
	border-radius:50%;
	width:12px;
	height:12px;
	border:2px solid #DDD;
	background:#F60;

}

.liveWind .circle .dir {
	/*position:absolute;*/
	font-size:1.6em;
	color:#CCC;
	position:absolute;
	width:100%;
	height:100%;
	z-index:5;
}

.liveWind .circle .wind {
	position:absolute;
	text-align:center;
	color:#AAA;
	font-size:2em;
	top:50%;
	left:50%;
	z-index:6;
	transform: translate(-50%, -50%);
	line-height:1;
}

.liveWind .circle .wind .value {
	font-size:3em;
	color:#333;
	display:block;
}

.liveWind .circle .wind span {
	color:#AAA;
	display:block;
	margin-top:-15px;
}

.liveWind .circle .dir span {
	vertical-align:middle;
}

.liveWind .circle .dir .N {
	position:absolute;
	left:calc(50% - 10px);
	top:10px;
}

.liveWind .circle .dir .E {
	position:absolute;
	right:10px;
	top:calc(50% - 10px);
}

.liveWind .circle .dir .O {
	position:absolute;
	left:10px;
	top:calc(50% - 10px);
}

.liveWind .circle .dir .S {
	position:absolute;
	bottom:10px;
	left:calc(50% - 10px);
}

.liveWind .windData {
	vertical-align:top;
	display:inline-block;
	position:relative;
	margin-top:10px;
	padding-top:5px;
	border-top:solid 2px #EEE;
}

/*
.liveWind .windData::before {
	content: "";
	display:block;
	position:absolute;
	left:10px;
	height:100%;
	width:2px;
	border-left:solid 2px #EEE;
}
*/

.liveWind .windData .menuDetails {
	display:none;
}

.liveWind .windData .menuDetails ul {
	list-style: none;
	display:block;
	padding: 0px;
	margin: 0px;
}

.liveWind .windData .menuDetails ul li {
	display:inline-block;
	padding:5px 12px;
	color:#CCC;
}

.liveWind .windData .info {
	padding:5px 15px;
	line-height:1;
	display:inline-block;
}

.liveWind .windData .label {
	color:#CCC;
	font-size:0.8em;
	display:block;
}

.liveWind .windData .value {
	color:#333;
	font-size:1.3em;
	display:inline-block;
}

.liveWind .windData .unit {
	color:#777;
	font-size:1.2em;
	display:inline-block;
	padding-left:5px;
	display:none;
}

.liveWind .windData .orientation {
	display:block;
}

.liveWind .windData .orientation .value.deg {
	padding-right:10px;
}

.liveWind .title {
	padding-bottom:10px;
	color:#F60;
}

.liveWind .windData .title {
	padding-bottom:5px;
	color:#CCC;
	display:block;
	font-size:0.8em;
}


.accountLogout {
	padding:5px 10px;
	text-decoration:none;
	display:inline-block;
	color:#F60 !important;
	border:solid 1px #EEE;
	font-size:0.9em;
}



.btnJeu30ans {
	font-size: 13px;
	font-weight: bold;
	color: #FFF !important;
	text-decoration: none;
	text-transform: uppercase;
	background-color: #F90;
	padding: 12px 15px;
	border-radius:4px;
}

.giftList {

}

.giftList > div {
	position:relative;
	margin:15px 0;
	padding-bottom:30px;
	margin-bottom:30px;
	border-bottom:solid 1px #DDD;
}

.giftList img {

	max-width:350px;
	margin:0 auto;
}

.giftList .pos {
	font-size:1.5em;
	color:#F90;
	padding-bottom:5px;
	font-weight:bold;
}

.giftList .title {
	font-size:1.5em;
}

.giftList .price {
	padding-bottom:15px;
	color:#999;
}

.giftList .price span{
	font-size:1.8em;
	color:#F90;

}

.giftList .desc a {
	text-decoration:underline;
	color:#333;
}

label.ui-input-text {
	margin-bottom:0;
	margin-top:0.7em;
	line-height:1.2;
}


.jeu30ans .ui-btn {
	border:none;
}

.jeu30ans .ui-btn .ui-btn-inner {
    padding: 0.3em 10px 0.3em 40px;
}

.jeu30ans .ui-btn .ui-btn-inner .ui-btn-text {
	font-weight: normal;
    font-size: 0.9em;
}

.sportList > div {
	display:inline-block;
	width:48%;
}

.sportList > div .ui-btn {
	border:none;
}

.sportList > div .ui-btn .ui-btn-inner {
    padding: 0.3em 10px 0.3em 40px;
}

.sportList > div .ui-btn .ui-btn-inner .ui-btn-text {
	font-weight: normal;
    font-size: 0.8em;
}

#error .txt {
	text-align:center;
	margin-top:15px;
	color:#C00;
}

.youtube-video {
	position: relative;
    width: 100%;
	/*max-width:1200px;*/
	margin:0 auto;
    height: 0;
    padding-bottom: 56.25%;
}

.youtube-video iframe {
	position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.paiementMode {

}

.paiementMode .paiementList {
	margin-top:10px;
}

.paiementMode .paiementList a {
	display:block;
	padding:10px;
	margin-left:10px;
	margin-bottom:20px;
	text-decoration:none;
}

.paiementMode .paiementList a .title {
	position:relative;
	color:#333;
	font-size:1.1em;
	margin-bottom:0.5em;
}

.paiementMode .paiementList a .title::before {
  	display: inline-block;
    content: '';
    border-radius: 20px;
    height: 8px;
    width: 8px;
    background-color: #F90;
	position:absolute;
	top:5px;
	top:5px;
	left:-20px;
}

.paiementMode .paiementList a .img img{
	width:150px;
}

.paiementMode .explain {
	max-width:500px;
}


.paiementMode .explain > div {
	display:inline-block;
	width:30%;
	font-size:0.7em;
	font-weight:normal;
	text-align:center;
	color:#AAA;
	vertical-align:top;
}

.paiementMode .explain > div span {
	display:block;
}

.statsHist {
	margin-top:20px;
}

.statsHist > div {
	padding:4px;
}

.statsHist > div:first-child{
	font-weight:bold;
}

.statsHist > div .year {
	width:70px;
	display:inline-block;
	font-weight:bold;
}

.statsHist > div .month {
	display:inline-block;
	width:calc((100% - 70px)/13);
	padding:3px;
	box-sizing: border-box;
}

.statsHist > div .total {
	font-weight:bold;
}

.webcamNear a {
	display:inline-block;
	width:46%;
	max-width:400px;
	padding:5px;
	text-decoration:none;
	vertical-align: top;
}

.webcamNear a img {
	width:100%;
	object-fit: cover;
	aspect-ratio:16/9;
	vertical-align:top;
}

.webcamNear a span.name {
	font-size:0.8em;
	color:#333;
}

.webcamNear a span.dist {
	font-size:0.7em;
	color:#999;
}


.footer-nav {
	width:100%;
	background:#000;
	/*border-top:solid 1px #FFF;*/
	position:fixed;
	z-index:998;
	bottom:-1px;
	left:0;
	color:#999;
	box-shadow: 0px 0px 12px #111;
}


.footer-nav .int {
	padding:5px 2px 15px;
	margin:0 auto;
	text-align:center;

	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}


.footer-nav .mobile {
	display:block;
	padding: 8px 0px;
	margin:0;
	line-height:1;
}

.footer-nav .mobile li {
	display:inline-block;
	width:23%;
	text-align:center;
}

.footer-nav .mobile li a {
	text-decoration:none;
	color:#FFF;
	text-shadow:none;
	font-weight:normal;
	display:block;
}

.footer-nav .mobile li a:visited {
	color:#FFF;
}

.footer-nav .mobile li a.selected {
	color:#F10;
}

.footer-nav .mobile li:hover a {
	color:#F10;
}


.footer-nav .mobile li i {
	font-size:25px;
	padding-bottom: 5px;
}


.page {
	padding-top:66px;
}


.footer-nav .mobile li span {
	display:block;
	font-size:0.8em;
}

.simple-menu {
	margin-top:20px;
}

.simple-menu a {
	display:block;
	padding:15px 15px;
	border-bottom:solid 1px #EEE;
	text-shadow: none;
    font-weight: normal !important;
	color:#333 !important;
	text-decoration:none;
	font-size:1.1em;
	position:relative;
}

.simple-menu a:hover {
	background:#F6F6F6;
	font-weight:bold !important;
}

.simple-menu a:first-child {
	border-top:solid 1px #EEE;
}

.simple-menu a i {
	position:absolute;
	right:20px;
	top: calc(50% - 8px);
}

.simple-title {
	font-weight:bold;
	font-size:1.2em;
	padding:15px;
}

.simple-button {
	display:inline-block;
	padding:10px 20px;
	border:solid 1px #EEE;
	text-shadow: none;
    font-weight: normal !important;
	color:#FFF !important;
	text-decoration:none;
	font-size:1.1em;
	line-height:1.2;
	position:relative;
	background:#C00;
	border-radius:5px;
}


.simple-button:hover {
	background:#B00;
}

.simple-page {
	margin-bottom:100px;
	margin-left:auto;
	margin-right:auto;
	max-width:750px;
}

.simple-page.account .simple-title, .simple-page.passwd .simple-title, .simple-page.signup .simple-title, .simple-page.login .simple-title {
	padding-left:0;
}

.account.infos, .account.passwd, .account.signup, .account.login {
	line-height:1.5;
	padding:15px;
	box-sizing: border-box;
}

.account.infos.update {
	max-width:500px;
}

.account .label, .account .label {
	font-weight:bold;
	font-size:0.9em;
}

input.box, textarea.box {
	box-shadow:none;
	border-radius:5px;
	line-height:1.3;
	padding:10px 15px;
	box-sizing: border-box;
	width:100%;
	border: solid 1px #CCC;
}

.account.fav {
	padding:15px;
	box-sizing: border-box;
}


.account.abo {
	padding:15px;
	box-sizing: border-box;
}


.aboList {
	/*text-align:center;*/
}

.aboList > div {
	padding:15px;
	border-radius:5px;
	border:solid 1px #EEE;
	margin-bottom:15px;
}

.aboList.code > div {
	padding:20px 0px;
	border-radius:5px;
	border:none;
	margin-bottom:15px;
}


.aboList.mode > div {
	padding:20px 0px;
	border-radius:5px;
	border:none;
	margin-bottom:15px;
}

.aboList > div .title {
	border:none;
	text-transform:none;
	font-size:1.1em;
	margin-bottom:0px;
	font-weight:bold;
}

.aboList > div .price {
	margin-top:8px;
	font-style: italic;
}

.aboList > div .price .old-price {
	text-decoration:line-through;
	color:#C00;
	font-weight:normal;
}

.aboList > div .explain {
	margin-bottom:8px;
	font-size:0.9em;
	font-style: italic;
	color:#777;
}

.aboList > div a {
	padding:8px 15px;
	/*font-size:13px;*/
	border-radius:5px;
	display:inline-block;
}




.aboList > div.aboTel {
	background:#F7F7F7;
}

.aboList.mode a .img img{
	width:150px;
}

.aboList.mode a {
	text-decoration:none;
	color:#333;
	position:relative;
}

.aboList.mode a::before {
  	display: inline-block;
    content: '';
    border-radius: 20px;
    height: 8px;
    width: 8px;
    background-color: #C00;
	position:absolute;
	top:15px;
	left:-2px;
}

.aboList.mode .explain > div {
	display:inline-block;
	width:30%;
	max-width:150px;
	font-size:0.9em;
	font-weight:normal;
	text-align:center;
	color:#AAA;
	vertical-align:top;
}

.aboList.mode .explain > div span {
	display:block;
	font-size:0.9em;
}


.abo-v2-code #price {
	color:#333;
	font-weight:bold;
}

.abo-v2-code #price span {
	text-decoration:line-through;
	color:#C00;
	font-weight:normal;
}

.abo-v2-code #reduc {
	color:#333;
	padding:5px;
}


.err {
	color:#D00;
	padding-top:5px;
}

.favList {

}

.favList a, .favList a:visited {
	display:block;
	padding:15px;
	/* margin-bottom:15px;*/
	border-bottom:solid 1px #EEE;
	text-decoration:none;
	color:#333 !important;
	font-weight:normal;
	position:relative;
}

.favList a:hover {
	background-color: rgba(0,0,0,0.05) !important;
}


.favList a:nth-child(even) {
	background-color: rgba(0,0,0,0.03);
}

.favList a .title {
	font-weight:bold;
	font-size:1.1em;
}

.favList a .lastData {
	font-size:0.9em;
	color:#999;
	font-weight:normal;
}

.favList a .infosVent {
	line-height:40px;
}

.favList a .infosVent img {
	vertical-align:top;
	width:40px;
}

.favList a .infosVent .data {
	font-size:1.2em;
}

.favList a .infosVent .unit {
	font-size:0.8em;
	font-weight:normal;
}

.actionBar {
	padding:0;
	position:relative;
	border-bottom:solid 4px #EEE;
	margin-bottom:15px;
}

.actionBar .int {
	padding:0;
}

#partSearch {
	width:100%;
	padding:0;
}

#partSearch i {
	position:absolute;
	font-size:1.2em;
	top:20px;
	left:15px;
}

#partSearch input {
	font-size: 1.1em;
	padding:20px 0px 20px 55px;
	width:100%;
	border: none;
		border-radius: 0;
	box-sizing: border-box;
}


.autocomplete-suggestions {
	border: 1px solid #DDD; background: #FFF; cursor: default; overflow: auto;
	box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.2);
	padding:5px 0px;
}
.autocomplete-suggestion {
	font-size:1.15em;
	padding: 6px 2px 6px 8px;
	white-space: nowrap; overflow: hidden;
}
.autocomplete-selected { background: #F0F0F0; }
.autocomplete-suggestions strong { font-weight: bold; color: #C00; }

.home.withMap .actionBar {
	margin-bottom:0px;
}

.home.withMap .map {
	margin-bottom:0px;
}

.home.withMap .map .leaflet-control-attribution {
	display:none !important;
}

.home a.anchor {
	display: block;
	position: relative;
	top: -70px;
	visibility: hidden;
}

.home .spotList {
	margin-bottom:15px;
	border-top:solid 1px #EEE;
	border-bottom:solid 1px #EEE;
}

.home > .title {
	text-transform:uppercase;
	font-size:1.2em;
	padding-top:15px;
	padding-bottom:5px;
	text-align:center;
	/*margin-bottom:10px;
	border-bottom:solid 1px #CCC;
	*/
}

.home .spotList .head {
	padding:10px 15px;
	position:relative;
	background: #F5F5F5;
	display:block;
	color:#111;
}

.home .spotList .head .title {
	font-size:1.1em;
	font-weight:bold;
}

.home .spotList .head .nb {
	font-weight:normal;
	font-size:0.8em;
	display:inline-block;
	padding-left:7px;
	color:#AAA;
}

.home .spotList .head i {
	font-size:1.2em;
	position:absolute;
	right:15px;
	top:12px;
	color:#C00;
}

.home .spotList .head i.down {
	color:#333;
}

.home .spotList .head i.up {
	display:none;
}

.home .spotList .list {
	padding:10px 10px;
	display:none;
}

.home .spotList.open .list {
	display:block;
}

.home .spotList.open {
	border-bottom: none;
}

.home .spotList.open .head {
	border-bottom:solid 2px #C00;
}

.home .spotList.open .head .title {
	color:#C00;
}

.home .spotList.open .head i.up {
	display:inline-block;
}

.home .spotList.open .head i.down {
	display:none;
}

.home .spotList .list a {
	display:block;
	padding:10px 7px;
	/*padding-right:25px;*/
	color:#666;
	border-bottom: solid 1px #EEE;
	padding-right:80px;
	position:relative;
	font-size:1.1em;
}

.home .spotList .list a:last-child {
	border-bottom:none;
}

.home .spotList .list a:hover {
	background:rgba(0,0,0,0.04);
}

.home .spotList .list a.obs {
	font-weight:bold;
	color:#000;
}

.home .spotList .list a.obs img {
	width:12px;
	margin-left:10px;
}

.home .spotList .list a .infosVent {
	position:absolute;
	right:5px;
	font-size:0.9em;
	font-weight:normal;
	top:12px;
	color: #666;
}

.home .spotList .list a .infosVent .time {
	display:none;
}

.home .spotList .list a .infosVent .unit {
	font-size:0.8em;
	font-weight:normal;
}

.home .spotList .list a .infosVent img {
	width:20px;
	vertical-align: bottom;
}

.simple-page.webcam {
	padding:10px;
}

.simple-page .abo.tel  {
	padding:15px;
}


.simple-page .spot {

}

.simple-page.spot .top {
	background:#F5F5F5;
	padding:15px;
}

.simple-page.spot .top h2 {
	font-size:1.5em;
}

.simple-page.spot .top a {
	background:#FFF;
}

.simple-link {
	color:#333;
	text-decoration:underline;
}



/* The switch - the box around the slider */
.switch {
  position: relative;
  display: inline-block;
  width: 60px;
  height: 28px;
}

/* Hide default HTML checkbox */
.switch input {
  opacity: 0;
  width: 0;
  height: 0;
}

/* The slider */
.slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #ccc;
  -webkit-transition: .4s;
  transition: .4s;
}

.slider:before {
  position: absolute;
  content: "";
  height: 20px;
  width: 20px;
  left: 4px;
  bottom: 4px;
  background-color: white;
  -webkit-transition: .4s;
  transition: .4s;
}

input:checked + .slider {
  background-color: #8bc34a;
}

input:focus + .slider {
  box-shadow: 0 0 1px #8bc34a;
}

input:checked + .slider:before {
  -webkit-transform: translateX(32px);
  -ms-transform: translateX(32px);
  transform: translateX(32px);
}

/* Rounded sliders */
.slider.round {
  border-radius: 34px;
}

.slider.round:before {
  border-radius: 50%;
}


.graphOption {
	position: absolute;
	right: 10px;
	top: 12px;
}

.graphOption .label {
	font-size:0.8em;
	color:#999;
	display:inline-block;
	padding-right:7px;
	vertical-align:sub;
	background:#FFF;
}


.simple-page.fav .btnFavOptions {
	position: absolute;
	right: 10px;
	top: 10px;
}


.leaflet-popup-content-wrapper {
	box-shadow: 0px 0px 10px rgba(0,0,0,0.3);
	text-align:left;
	border-radius: 5px !important;
}

.leaflet-popup-content {
	margin:5px 10px;
}

.leaflet-popup-close-button {
	display:none;
}

.tooltipmap {
	margin:0;
	padding:0;
	padding-left:40px;
	white-space: nowrap;
	position:relative;

}

.tooltipmapcam {
	border:thin 1px #eee;
	background-color:#FFF;
	padding:3px;
	box-shadow: 0px 0px 10px #666;
}


.tooltipmap img {
	width:30px;
	top:3px;
	left:5px;
	position:absolute;
}

.tooltipmap .txtlight {
	font-size:11px;
	color:#777;
}

.tooltipmap .txtredlight {
	font-size:11px;
	color:#C00;
}

.tooltipmap .abo {
	color:#F60;
	display:block;
}

.graphArrows image {

	width:20px;
	height:20px;
	transform: translate(-10px, -10px);
}
.graph {
	position:relative;
}

.graph.obs {
	margin-top:25px;
}

.graph .subTitle {
	font-size:1em;
	overflow: hidden;
	white-space: nowrap;
	color:#666;
	font-size:0.9em;
	position:absolute;
	left:20px;
	top:-5px;
	z-index:10;
}

.graph .subTitle.right {
	color:#F70;
	left:auto;
	right:10px;
}

.btn.btn-icon {
	padding:8px 12px;
	display:inline-block;
	border:solid 1px #CCC;
	border-radius:3px;
	font-size:1.3em;
	color:#333;
	background:#FFF;
	/*margin-right:10px;*/
}

.favListManager {

}

.favListManager .item {
	padding:25px 10px;
	position:relative;
	border-bottom:solid 1px #EEE;
}

.favListManager .item:first-child .actions .btn.up {
	display:none;
}

.favListManager .item:last-child .actions .btn.down {
	display:none;
}

.favListManager .item.selected {
	background:rgba(0,0,0,0.05);
}

.favListManager .item.selected .title {
	color:#F10;
}

.favListManager .item.selected .actions {
	display:block;
}

.favListManager .item .title {
	padding-right:150px;
	font-weight:bold;
}

.favListManager .item .actions {
	position:absolute;
	right:10px;
	top:15px;
	font-size:0.9em;
	display:none;
}

.favListManager .item .actions .btn {
	margin-left:10px;
}

.favListManager .item .actions .btn.btnRemove {
	color:#C00;
}

.webcamList {

}

.webcamList a {
	display:block;
	margin-bottom:20px;
}


.webcamList a .title {
	display:block;
	padding-top:3px;
	color:#333;
}

.pubDefiWind {

}

.pubDefiWind a {
	display:inline-block !important;
	padding:0 !important;
	margin:0 !important;
	color:#000 !important;
	border:none;
}

.menu-left {
	position: fixed;
	display:none;
	left:0;
	top:0px;
	height:100%;
	background:#FFF;
	border-right:solid 1px #EEE;
	width:260px;
}

.menu-left .menu {
	position: relative;
	display:block;
	z-index: 100;
	margin: 0;
	right: 0px;
	top: 65px;
	background: #FFF;
	padding: 5px;
	padding-top:15px;
	box-shadow: none;
	max-width:260px;
	text-align:left;
}

.menu-left .menu li {
	display:block;
}

.menu-left .menu li a {
	display:block;
	color:#333 !important;
	text-decoration:none;
	font-weight:normal !important;
	text-transform:none;
	padding:15px 5px;
	border-radius:10px;
	cursor:pointer;
	font-size:1.2em;
}

.menu-left .menu li a:hover {
	background:#F7F7F7;
	color:#000 !important;
}

.menu-left .menu li a i {
	font-size:1.2em;
	margin-left: 15px;
	width: 45px;
}

.menu-left .menu li.current a {
	background:#EEE;
	color:#111 !important;
	font-weight: bold !important;
}

.menu-left .menu li a b {
	font-weight:normal !important;
}



.col-right {
	position: fixed;
	display:none;
	right:0;
	top:0px;
	height:100%;
	background:#FFF;
	border-left:solid 1px #EEE;
	width:260px;
	padding-top:85px;
}

.col-right > div {
	height:100%;
	scrollbar-width: thin;
	overflow-y: auto;
}

.part {
	margin-bottom:15px;
}

.part .head {
	padding:10px 15px;
	position:relative;
	background: #F5F5F5;
	display:block;
	color:#111;
}

.part .head .title {
	font-size:1.1em;
	font-weight:bold;
}

.part .head .nb {
	font-weight:normal;
	font-size:0.8em;
	display:inline-block;
	padding-left:7px;
	color:#AAA;
}

.part .head i {
font-size:1.2em;
position:absolute;
right:15px;
top:12px;
color:#C00;
}

.part .head i.down {
color:#333;
}

.part .head i.up {
display:none;
}

.part .spotList .list {
padding:10px 10px;
/*display:none;*/
}

.part .spotList.open .list {
display:block;
}

.part .spotList.open {
border-bottom: none;
}

.part .spotList.open .head {
border-bottom:solid 2px #C00;
}

.part .spotList.open .head .title {
color:#C00;
}

.part .spotList.open .head i.up {
display:inline-block;
}

.part .spotList.open .head i.down {
display:none;
}

.part .spotList .list a {
display:block;
padding:10px 7px;
/*padding-right:25px;*/
color:#666;
border-bottom: solid 1px #EEE;
padding-right:80px;
position:relative;
font-size:1.1em;
}

.part .spotList .list a > span {
	font-size:0.9em;
}

.part .spotList .list a:last-child {
border-bottom:none;
}

.part .spotList .list a:hover {
background:rgba(0,0,0,0.08);
}

.part .spotList .list a.obs {
font-weight:bold;
color:#000;
}

.part .spotList .list a.obs img {
width:12px;
margin-left:10px;
}

.part .spotList .list a .infosVent {
position:absolute;
right:5px;
font-size:0.9em;
font-weight:normal;
top:12px;
color: #666;
}

.part .spotList .list a .infosVent .time {
display:none;
}

.part .spotList .list a .infosVent .unit {
font-size:0.8em;
font-weight:normal;
}

.part .spotList .list a .infosVent img {
width:20px;
vertical-align: bottom;
}



.part .nearlist {
	padding-top:15px;
}

.part .nearlist a {
	display:inline-block;
	padding:5px 10px;
	text-decoration:none;
	color:#333 !important;
}

.part .nearlist a:hover {
	text-decoration:underline;
	color:#111 !important;
}


.part .nearlist a .dist {
	font-size:0.7em;
	color:#999;
	display:inline-block;
	padding-left:5px;
	font-weight:normal;
}




@media (orientation: landscape) {
	.footer-nav {
		display:none;
	}
}

@media (min-width: 800px) {
	#bannerPub {
		bottom:0;
	}

	.menu-left {
		display:block;
	}

	.footer-nav {
		display:none;
	}

	.simple-page {
		max-width:100%;
		width: 100%;
        padding-left: 260px;
        box-sizing: border-box;
	}

	.simple-page.home #mapHome {
		height:500px !important;
	}

	.simple-page.spot #mapSpot {
		height:500px !important;
	}

	.simple-page.map {
		max-width:100%;
		width:100%;
	}

	.simple-page.map #map_canvas {
		width:100% !important;
		height: calc(-65px + 100vh) !important;
		margin-left:0;
	}

	.favList a .infosVent {
		position:absolute;
		right:15px;
		top:15px;
	}

	.favList a .graph {
		margin-top:10px;
	}

	.webcamList a {
		display:inline-block;
		width:calc(50% - 3px);
		padding: 5px;
        box-sizing: border-box;
	}

	.webcamList a img {
		aspect-ratio: 1.6;
		object-fit: cover;
		border:solid 2px #FFF;
	}

	.webcamList a:hover img {
		border:solid 2px #999;
	}

	.simple-page.spot #videoObj > div {
		height:560px !important;
	}

	.footer {
		padding-bottom:10px;
		background:#EEE;
		margin:0 auto;
		box-sizing:border-box;
		width: 100%;
        padding-left: 260px;
	}

	.footer .flags {
		padding:0;
		margin-bottom:5px;
		border:none;
		float:right;
	}

	.footer .flags a {
		padding: 2px 5px;
	}

	.footer .flags a img {
		width:30px;
	}

	.footer .logo {
		float:left;
	}

	.footer .brand {
		color:#C00;
	}
}

@media (min-width: 1000px) {
	.simple-page {
		width: calc(100% - 520px);
		max-width:900px;
		padding-left: 0px;
	}

	.simple-page.home .spotList.fav {
		display:none;
	}

	.simple-page.map #map_canvas {
		width:calc(100% - 260px) !important;
		margin-left:260px;
	}

	.col-right {
		display:block;
		box-sizing: border-box;
		padding-right:10px;
	}

	.footer  {
		width: calc(100% - 520px);
		padding-left: 15px;
        /*max-width: 900px;*/
	}
}

@media (min-width: 1520px) {
	.menu-left {
		display:block;
		width:20%;
		max-width:350px;
	}

	.menu-left .menu {
		max-width:350px;
	}

	.col-right {
		display:block;
		width:20%;
		max-width:350px;
	}

	.footer  {
		width: calc(100% - 700px);
        /*max-width: 900px;*/
	}
}