/*****   FONT   *****/
@font-face {
font-family:'LatoRegular';
src:url('/RessourcesCentrales/fonts/Lato/Regular/lato-regular-webfont.eot');
src:url('/RessourcesCentrales/fonts/Lato/Regular/lato-regular-webfont.eot?#iefix') format('embedded-opentype'),
url('/RessourcesCentrales/fonts/Lato/Regular/lato-regular-webfont.woff') format('woff'),
url('/RessourcesCentrales/fonts/Lato/Regular/lato-regular-webfont.ttf') format('truetype'),
url('/RessourcesCentrales/fonts/Lato/Regular/lato-regular-webfont.svg#Lato') format('svg');
font-weight:normal;
font-style:normal;
}

@font-face {
font-family:'LatoLight';
src:url('/RessourcesCentrales/fonts/Lato/Light/lato-light-webfont.eot');
src:url('/RessourcesCentrales/fonts/Lato/Light/lato-light-webfont.eot?#iefix') format('embedded-opentype'),
url('/RessourcesCentrales/fonts/Lato/Light/lato-light-webfont.woff') format('woff'),
url('/RessourcesCentrales/fonts/Lato/Light/lato-light-webfont.ttf') format('truetype'),
url('/RessourcesCentrales/fonts/Lato/Light/lato-light-webfont.svg#LatoLight') format('svg');
font-weight:normal;
font-style:normal;
}

@font-face {
font-family:'LatoBold';
src:url('/RessourcesCentrales/fonts/Lato/Bold/lato-bold-webfont.eot');
src:url('/RessourcesCentrales/fonts/Lato/Bold/lato-bold-webfont.eot?#iefix') format('embedded-opentype'),
url('/RessourcesCentrales/fonts/Lato/Bold/lato-bold-webfont.woff') format('woff'),
url('/RessourcesCentrales/fonts/Lato/Bold/lato-bold-webfont.ttf') format('truetype'),
url('/RessourcesCentrales/fonts/Lato/Bold/lato-bold-webfont.svg#LatoBold') format('svg');
font-weight:normal;
font-style:normal;
}

@font-face {
font-family:'PlayballRegular';
src:url('/RessourcesCentrales/fonts/Playball/Regular/playball-regular-webfont.eot');
src:url('/RessourcesCentrales/fonts/Playball/Regular/playball-regular-webfont.eot?#iefix') format('embedded-opentype'),
url('/RessourcesCentrales/fonts/Playball/Regular/playball-regular-webfont.woff') format('woff'),
url('/RessourcesCentrales/fonts/Playball/Regular/playball-regular-webfont.ttf') format('truetype'),
url('/RessourcesCentrales/fonts/Playball/Regular/playball-regular-webfont.svg#PlayballRegular') format('svg');
font-weight:normal;
font-style:normal;
}


html{
font-size:16px;
}

body {
margin:0;
padding:0;
background-color:#FFFFFF;
font-family:LatoRegular, Verdana, Geneva, sans-serif;
color:#373435;
}

h1, h2, h3, h4, h5, h6 {
font-family:PlayballRegular, Verdana, Geneva, sans-serif;
text-transform:uppercase;
line-height:1;
margin-top:1rem;
}

h1 {
font-size:3.625rem;
}

h2 {
font-size:2.625rem;
}

h3 {
font-size:2rem;
}

h4 {
font-size:1.5rem;
}

h5 {
font-size:1.25rem;
}

h6 {
font-size:1.125rem;
}

a, a:link, a:visited, a:focus, a:hover, a:active {
color:#f57e06;
text-decoration:none;
-webkit-transition:all 300ms ease;
-moz-transition:all 300ms ease;
-ms-transition:all 300ms ease;
-o-transition:all 300ms ease;
transition:all 300ms ease;
}

a:hover, a:focus, a:active {
color:#f04936;
}

a img {
opacity:1;
-webkit-transition:all 300ms ease;
-moz-transition:all 300ms ease;
-ms-transition:all 300ms ease;
-o-transition:all 300ms ease;
transition:all 300ms ease;
}

a:hover img, a:focus img, a:active img {
opacity:0.8;
-webkit-transition:all 300ms ease;
-moz-transition:all 300ms ease;
-ms-transition:all 300ms ease;
-o-transition:all 300ms ease;
transition:all 300ms ease;
}

.bouton {
background-color:#FFFFFF;
font-size:1.125rem;
text-transform:uppercase;
border:2px solid #f58434;
padding:0.5rem 1.25rem;
-webkit-border-radius:20px 20px 20px 20px;
border-radius:20px 20px 20px 20px;
display:inline-block;
}

.bouton:hover, .bouton:focus, .bouton:active  {
border:2px solid #f04936;
}

.bouton2 {
background-color:#f58434;
color:#FFFFFF;
font-size:1rem;
text-transform:uppercase;
border:2px solid #f58434;
padding:0.5rem 1.25rem;
-webkit-border-radius:20px 20px 20px 20px;
border-radius:20px 20px 20px 20px;
display:inline-block;
-webkit-transition:all 300ms ease;
-moz-transition:all 300ms ease;
-ms-transition:all 300ms ease;
-o-transition:all 300ms ease;
transition:all 300ms ease;
cursor:pointer;
}

.bouton2:hover, .bouton2:focus, .bouton2:active  {
color:#f04936;
-webkit-transition:all 300ms ease;
-moz-transition:all 300ms ease;
-ms-transition:all 300ms ease;
-o-transition:all 300ms ease;
transition:all 300ms ease;
}

ul {
margin:0;
padding:0;
list-style:none;
}

div.clear {
clear:both;
height:0;
font-size:0;
line-height:0;
margin:0;
padding:0;
border:0;
}

.gauche {
text-align:left;
}

.droite {
text-align:right;
}

.centrer {
text-align:center;
}

label {
font-weight:bold;	
}

.column:last-child:not(:first-child), .columns:last-child:not(:first-child) {
float:left;
}

select {
margin:0;
}

.relative {
position:relative;
}

.ra-pagination ul {
list-style-type:none;
margin:0.75rem 0;
padding:0;
}

.ra-pagination ul li {
position:relative;
float:left;
padding:0 0.25rem;
}

li.iconefichier img {
vertical-align:bottom;
padding-right:0.5rem;
}

iframe {
max-width:100%;
}

.smallCaps {
text-transform:inherit !important;
}

p {
line-height:1.4;
}

.espacementGauche {
padding-left:1.5rem;
}

.espacementDroite {
padding-right:1.5rem;
}

.espacementTop {
padding-top:1.5rem;
}

.uppercase {
text-transform:uppercase;
}


/******************************************************/
/*******************     bandeau     ******************/
/******************************************************/
.ms-slide .ms-slide-bgcont, .ms-slide .ms-slide-bgvideocont {
overflow:visible !important;
}

.ms-view, .ms-slide-layers {
overflow:visible !important;
}

div#bandeau {
padding-bottom:2rem;
}

div.infoBandeau {
background-color:#FFFFFF;
max-width:500px;
padding:0.5rem 0.5rem 0 0.5rem;
border-radius:200% 200% 0 0 / 250px 250px 0 0;
}

div.infoBandeau div.bordure {
border:2px solid #F04936;
border-width:2px 2px 0 2px;
padding:3rem 3rem 0 3rem;
border-radius:200% 200% 0 0 / 250px 250px 0 0;
}

div.infoBandeau h4 {
text-align:center;
}

div.infoBandeau h4:after {
content:"";
display:block;
margin:auto;
padding:10px 0px 0px 0px;
width:180px;
border-bottom:2px solid #F04936;
}

div.infoBandeau p {
margin-top:1rem;
margin-bottom:0;
padding-bottom:2rem;
text-align:center;
}

div.liensBandeau {
text-align:center;
background-color:#F04936;
height:66px;
}

div.liensBandeau a {
margin:0.75rem 0 0 0;
}


/******************************************************/
/*******************     header     *******************/
/******************************************************/
div#header {
padding:0;
border-top:8px solid #373435;
padding:1.25rem 0 1.5rem 0;
text-transform:uppercase;
}

div#header i {
font-size:1.375rem;
}

div#header div.small-12:nth-child(2) {
text-align:center;
}

div#header div.small-12:nth-child(3) {
text-align:right;
}

/*------------     header-menu     ------------*/
/*---------------------------------------------*/
div#menu {
border-top:1px solid #cdcccc;
margin-bottom:0;
}

div#main-menu ul {
margin:0;
padding:0;
list-style:none;
}

div#main-menu ul li {
margin:0;
padding:0;
width:14.28%;
text-align:center;
}

div#main-menu ul li a {
font-size:1.125rem;
color:#373435;
text-transform:uppercase;
display:inline-block;
margin:0;
padding:1rem 0 0 0;
}

div#main-menu a:hover, div#main-menu a:focus, div#main-menu a:active {
color:#f04936; 	
}

div#main-menu div.flecheSousMenu {
color:#afaeae;
line-height:0;
font-size:1.375rem;
}

body.body-services div#main-menu ul li.mnuServices a, 
body.body-forfaits div#main-menu ul li.mnuForfaits a, 
body.body-restaurant div#main-menu ul li.mnuRestaurant a, 
body.body-hebergement div#main-menu ul li.mnuHebergement a, 
body.body-auberge div#main-menu ul li.mnuAuberge a, 
body.body-nous-joindre div#main-menu ul li.mnuNousJoindre a {
color:#f04936;
}

div#main-menu ul li ul {
width:22rem;
background-color:#f57e06;
}

div#main-menu ul li ul li {
width:100%;
text-align:left;
}

div#main-menu ul li ul li a {
color:#FFFFFF !important;
padding:0.5rem 1rem;
text-transform:inherit;
display:block;
}

div#main-menu ul li ul li a:hover, div#main-menu ul li ul li a:focus, div#main-menu ul li ul li a:active {
color:#373435 !important;
}


/* Menu mobile */ 
#header .row.mobile-menu {
max-width:100%;
padding:0;
margin-top:1.25rem;
}

div#header .row.mobile-menu .column {
padding:0;
}

div#mobile-menu {
text-align:left;
}

div#mobile-menu .slicknav_menu {
background-color:#f04936;
}

div#mobile-menu  .slicknav_btn {    
background-color:#f04936;
padding:0.375rem;
margin:0;
}

div#mobile-menu .slicknav_menu .slicknav_menutxt {
text-shadow:none;
}

div#mobile-menu ul.slicknav_nav ul {
margin-left:1rem;
}

div#mobile-menu ul.slicknav_nav ul li {
width:100%;	
}

div#mobile-menu ul.slicknav_nav a {
color:#FFFFFF;
text-transform:uppercase;
margin-left:0;
display:inline-block;	
}

div#mobile-menu .slicknav_nav a:hover, div#mobile-menu .slicknav_nav a:focus, div#mobile-menu .slicknav_nav a:active {
background-color:rgba(255,255,255,0.4);	
}


/************************************************************/
/*******************     main-content     *******************/
/************************************************************/
div.conteneurTitre {
background:url(../images/design/backTitre.jpg) no-repeat top center;
margin-bottom:2.5rem;
}

div.conteneurTitre h1 {
color:#FFFFFF;
padding:1rem 0;
}

body.body-accueil div.conteneurTitre {
background:none;
}

body.body-accueil div.conteneurTitre h1#titrePage {
margin:4rem 0 1rem 0;
padding-bottom:1.5rem;
position:relative;
color:#373435;
}

body.body-accueil div.conteneurTitre h1::before {
content:"";
position:absolute;
left:0;
bottom:0;
height:1px;
width:180px;
border-bottom:1px solid #f04936;
}

div#main-content h2 {
margin:2rem 0 0.5rem 0;
padding-bottom:1.5rem;
position:relative;
color:#373435;
}

div#main-content h2::before {
content:"";
position:absolute;
left:0;
bottom:0;
height:1px;
width:180px;
border-bottom:1px solid #f04936;
}

body.body-nous-joindre div#main-content h2 {
max-width:100%;
margin:0;
}

body.body-nous-joindre div#main-content h2:before {
border-bottom:inherit;
}

div#main-content {
padding-bottom:2rem;
min-height:300px;
font-size:1.125rem;
}

div#main-content h1, div#main-content h2, div#main-content h3, div#main-content h4, div#main-content h5, div#main-content h6 {
text-transform:inherit;
}

div#main-content .emphase {
font-family:LatoBold, Verdana, Geneva, sans-serif;
color:#f04936;
font-size:1.25rem;
}

div#main-content .emphase2 {
font-size:1.625rem;
}

div#main-content ul {
margin:0 0 0 2rem;
}

div#main-content ul li::before {
content: "\2022";
color:#f04936;
display:inline-block; 
width:1rem;
margin-left:-1rem;
}

input::placeholder, textarea::placeholder {
color:#b4b5b6;
}

[type="text"], textarea {
border:2px solid #373435;
}

[type="text"]:focus, [type="text"]:active, textarea:focus, textarea:active {
border:2px solid #f04936;
}

div.reseauxSociaux {
margin-bottom:2rem;
}

/*-----  Pour voir les autres ratios possible : https://www.pushaune.com/blog/tutoriels/rendre-les-videos-youtube-et-vimeo-responsives/  -----*/
.video-container {
position:relative;
padding-bottom:56.25%; /* ratio 16/9 */
height:0;
overflow:hidden;
clear:both;
}

.video-container iframe, .video-container object, .video-container embed {
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
}

div#main-content ul.listePageEnfant {
display:inline-block;
margin:0 0 2rem 1rem;
width:100%;
}

div#main-content ul.listePageEnfant li {
position:relative;
float:left;
width:50%;
}

table {
border-collapse:collapse;
}

table thead {
background-color:#f57e06;
color:#FFFFFF;
}

table.listeTableauAccueil td {
width:25%;
vertical-align:top;
}

table tbody {
border:none;
background-color:none;
}

table.listeTableauAccueil td img {
margin-bottom:1rem;
}

table.listeTableauAccueil td p {
line-height:1;
min-height:4.5rem;
padding:0 0.25rem;
}

table.listeTableauRestaurant td {
width:33.33%;
vertical-align:top;
}

table.listeTableauRestaurant td img {
margin-bottom:1rem;
}

table.listeTableauRestaurant td p {
line-height:1;
min-height:3.375rem;
padding:0 0.25rem;
}


/*******************************************************/
/*******************     Chalets     *******************/
/*******************************************************/
div.listeChalets {
margin-bottom:1.5rem;
}

div.listeChalets div.conteneur{
margin-bottom:1.5rem;
}

div#main-content div.listeChalets h2 {
max-width:100%;
line-height:1;
margin-top:0;
}

body.body-chalets-details div#main-content div.listeChalets {
margin-top:3rem;
}

body.body-chalets-details div#main-content div.listeChalets h2.titreChalet {
padding-top:1.5rem;
}

body.body-chalets-details div#main-content div.listeChalets h2.titreChalet:before {
content:"";
position:absolute;
top:0;
bottom:0;
height:1px;
width:180px;
border-top:1px solid #f04936;
}

div.listeChalets h2 span {
font-family:LatoRegular, Verdana, Geneva, sans-serif;
font-size:1.125rem;
display:block;
}

div.listeChalets h3 {
color:#f04936;
font-size:1.25rem;
font-family:LatoBold, Verdana, Geneva, sans-serif;
}

div.listeChalets div.conteneur div.columns:first-child {
padding-left:0;
padding-right:1.875rem;
}

div.listeChalets ul {
line-height:1.2;
}

div.listeChalets a.bouton {
margin-top:1rem;
}



/*******************************************************/
/*******************     Annonces     ******************/
/*******************************************************/
div#main-content div.affichageAnnonce {
position:relative;
background:url(../images/design/backAnnonce.png) no-repeat top center;
min-height:325px;
max-width:284px;
text-align:center;
color:#FFFFFF;
padding:0 0.75rem;
}

div#main-content div.affichageAnnonce h2 {
max-width:inherit;
color:#FFFFFF;
margin:0;
padding:2.5rem 0 1rem 0;
}

div#main-content div.affichageAnnonce h2:before {
max-width:inherit;
color:#FFFFFF;
border-bottom:none;
}

div#main-content div.affichageAnnonce p {
line-height:1.1;
height:115px;
}

div#main-content div.affichageAnnonce div.backLogo {
position:absolute;
top:30px;
left:85px;
}


/*------------     Formulaire de contact     ------------*/
/*-------------------------------------------------------*/
/* Erreurs de saisie */
.messages-box.error {
background-color:#de4343;
border-color:#c43d3d;
}

.messages-box {
background-size:2.5rem;
background-image:linear-gradient(135deg, rgba(255, 255, 255, .05) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .05) 50%, rgba(255, 255, 255, .05) 75%, transparent 75%, transparent);
box-shadow:inset 0 -1px 0 rgba(255,255,255,.4);
width:100%;
border:1px solid;
color:#FFFFFF;
padding:1rem;
text-shadow:0 1px 0 rgba(0,0,0,.5);
animation:animate-bg 5s linear infinite;
margin:0 0 1rem 0;
text-align:left;
}

@keyframes animate-bg {
from {
background-position:0 0;
}

to {
background-position:-5rem 0;
}
}

input[type=text].invalid, textarea.invalid {
border:1px solid #DE4343;
margin-bottom:0;
}

.error-message {
display:inline-block;
background-color:#DE4343;
color:#FFFFFF;
width:100%;
margin-bottom:0.875rem;
padding:0.25rem 0.5rem;
font-size:85%;
}


/*------------     Pour le contenu dynamique     ------------*/
/*-----------------------------------------------------------*/
/* Pages */
div.contenuPage {
padding:0;
margin-bottom:2.5rem;		
}

.image-flottante-droite {
border:none;
padding:0 0 0.375rem 0.375rem;
background:none;
float:right;
margin:0 0 0.375rem 0.625rem;
}

.image-flottante-gauche {
border:none;
padding:0 0.375rem 0.375rem 0;
background:none;
float:left;
margin:0 0.625rem 0.375rem 0;
}

table.tableau-invisible, table.tableau-invisible tbody, table.tableau-invisible tr:nth-of-type(even), table.tableau-invisible tr:nth-of-type(odd) {
border:none;
background:none;
}

hr {
clear:both;
margin:0 0 0.625rem 0;
padding:0;
height:0;
font-size:0;
border:none;
background-color:#FFFFFF;
}

.texte-discret {
font-size:0.875rem;
color:#888888;	
font-style:italic;
}

td.texte-discret {
font-size:0.625rem;
color:#FFFFFF;	
}

/* documents */
ul.liste-documents {
list-style-type:none;	
margin-bottom:2.5rem;	
}

li.document {	
margin-bottom:0.125rem;
margin-top:0;
color:#96BBC2;
}

ul.liste-documents li.description {	
color:#414E56;
line-height:1.25rem;
font-family:LatoLight, Verdana, Geneva, sans-serif;	
margin-bottom:1rem;
}

/* Pages enfants */
.blocEnfants {
margin-bottom:2.5rem;
}

div.enfant {
margin:1rem 0;
}

div.enfant a {
color:#FFFFFF;
opacity:1;
}

div.enfant a:hover, div.enfant a:focus {
color:#FFFFFF;
opacity:0.8;
}

div.backgroundImageEnfant {	
min-height:17.5rem;
display:block;
background-size:cover !important;		
}

div.backgroundImageEnfant .film {
background-color:rgba(51,51,51,0.5);
min-height:17.5rem;
padding-top:5rem;	
}

div.backgroundCouleurEnfant {
min-height:17.5rem;
background-color:#f04936;
padding-top:6.25rem;	
}

div#main-content h2.titreEnfant {
font-size:1.375rem;
text-align:center;
max-width:80%;
margin:auto;
border:1px solid #FFFFFF;
overflow:hidden;
height:4rem;
padding:0.25rem 0.625rem;
letter-spacing:1px;
line-height:2.4;
display:block;
}

h2.titreEnfant:after {
display:none;
}

h2.titreEnfant span {
display:inline-block;
vertical-align:middle;
line-height:1.2;
}

div.row.blocEnfants .columns {
float:none;
display:inline-block;
vertical-align:top;	
}

div.row.blocEnfants {
text-align:center;
}

div.enfant p.contenuSecondaire {
display:none;
}

/*------------     Page 404     ------------*/
/*------------------------------------------*/
.body-404 {
background-color:#F1F0F8;
text-align:center;
}
.body-404 img {
width:450px;
margin:3.75rem 0 1.25rem 0;
}
.body-404 p {
text-align:center;
font-size:2rem;
color:#1F1F1F;
}
.body-404 a {
color:#1F1F1F;
font-size:1.25rem;
}
.body-404 a:hover, .body-404 a:active, .body-404 a:focus {
color:#687B80;
}


/******************************************************/
/*****************     Google Map     *****************/
/******************************************************/
div#googleMap {
background:url(../images/design/map2.jpg) no-repeat top center;
height:480px;
text-align:center;
}

div#googleMap h1 {
color:#FFFFFF;
text-transform:inherit;
min-height:116px;
margin:5.5rem 0 0 0;
display:inline-block;
}

div#googleMap a.bouton {
margin:9.25rem 0 0 0;
}


/******************************************************/
/*******************     Footer     *******************/
/******************************************************/
div#infoFooter {
padding:4.25rem 0 3.5rem 0;
background:url(../images/design/arbre1.png) no-repeat bottom left, url(../images/design/arbre2.png) no-repeat bottom right;
}

div#infoFooter div.small-12:first-child {
text-align:center;
}

div#infoFooter h1 {
font-family:LatoBold, Verdana, Geneva, sans-serif;
font-size:1.75rem;
margin:3.5rem 0;
}

div#infoFooter h3 {
font-family:LatoBold, Verdana, Geneva, sans-serif;
font-size:1.125rem;
margin-top:0.5rem;
}

div#infoFooter p {
margin-bottom:0.5rem;
}

div#infoFooter i {
font-size:1.375rem;
}

div#infoFooter div.small-12:first-child a {
color:#f57e06;
text-transform:uppercase;
}

div#infoFooter div.small-12:first-child a:hover, div#infoFooter div.small-12:first-child a:focus, div#infoFooter div.small-12:first-child a:active {
color:#f04936;
}

div#infoFooter h5 {
font-family:LatoRegular, Verdana, Geneva, sans-serif;
font-size:1rem;
margin:0.5rem 0 0.25rem 0;
}

div#infoFooter ul {
margin:0 0 0 1.25rem;
text-transform:uppercase;
}

div#infoFooter a {
color:#373435;
}

div#infoFooter a:hover, div#infoFooter a:focus, div#infoFooter a:active {
color:#f04936;
}

footer {
background-color:#373535;
color:#FFFFFF;
padding:1.375rem 0;
}

footer div.row div.small-12:last-child {
text-align:right;
}
