@charset "UTF-8"; 

@font-face {font-family: 'Lato'; font-style: normal; font-weight: 300; src: url('../fonts/Lato.woff') format('woff')}
@font-face {font-family: 'Cormorant'; font-style: normal; font-weight: normal; src: url('../fonts/Cormorant.woff2') format('woff2')}
@font-face {font-family: 'Playfair'; font-style: normal; font-weight: normal; src: url('../fonts/Playfair.woff2') format('woff2')}
@font-face {font-family: 'Signature'; font-style: normal; font-weight: normal; src: url('../fonts/Signature.woff2') format('woff2')}
@font-face {font-family: 'Florentino'; font-style: normal; font-weight: normal; src: url('../fonts/Florentino.woff2') format('woff2')}
@font-face {font-family: 'FontAwesome'; font-weight:normal; font-style:normal; src:url('../fonts/fontawesome.woff') format('woff')}								
					
* {padding: 0; margin: 0; box-sizing: border-box}
html, body, div, span, object, iframe,h1, h2, h3, h4, h5, h6, blockquote, pre, abbr, address, cite, code,del, dfn, em, img, ins, kbd, q, samp, small, b, strong, p strong, p b, sub, sup, var, i, dl, dt, dd, ol, ul, li,fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video {margin: 0; padding: 0; border: 0 none; outline: 0; vertical-align: baseline; background-color: transparent; text-decoration:none; font-weight:400} 
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section {display: block}					
html {font-size:100%; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; color:#333; scrollbar-width: thin; scrollbar-color: #000 #d1c286; background-color:#fcfcfc; overflow-x:hidden; overflow-y: scroll}					
html::-webkit-scrollbar {width:10px}
html::-webkit-scrollbar-track {background-color: #d1c286}
html::-webkit-scrollbar-thumb {background-color: #333}
body {min-height: 100vh; max-width: 100%; *zoom: 1; position: relative; display: block}
body::before, 
body::after {content: ""; display: table}
body::after {clear: both}
/* ============= Body ============= */
select {-webkit-appearance: none; -moz-appearance: none; appearance: none; outline: none}
select::-ms-expand {display: none}				
ul, li {list-style: none}
img {border:0; page-break-inside:avoid; max-width:100%!important; height: auto; vertical-align:middle}
a {text-decoration: underline dotted #d1c286; cursor:pointer}
a:active, 
a:focus, 
a:link,
a:visited {color: inherit; outline:0; text-decoration:none}	
button::-moz-focus-inner{border:0} 
html,body,span,ul,li,input,textarea,button {font-family: 'Cormorant'; font-weight: normal; font-style: normal; text-transform:uppercase}	
h1,h2,h3,h4,h5,h6 {font-family: 'Florentino'; font-weight: bold; font-style: normal; text-transform:uppercase}	
/* -------- */
p,
p a {font-size:20px; letter-spacing:0.05em; line-height:1.5; text-transform:none; text-align:center; hyphens: auto; word-wrap: break-word}					
p a {font-size:100%; border-bottom:1px dotted rgba(0,0,0,0.8)}
p a:hover {border-bottom:1px solid #d1c286}	
@media all and (min-width:576px) {	
	p,
	p a {font-size:22px; letter-spacing:0.1em}}				
/* -------- */	
a.btn {padding:13px 0; line-height:1.3; margin: 0 auto; color: #fff; background-color:#d1c286; border-radius: 2px; position: relative; text-decoration: none}
a.btn span {margin-left:0.75rem; font:normal 13px "Lato"; letter-spacing:0.15em; display: inline-block; transition: all .35s ease-out}
a.btn span,
a.btn i {backface-visibility: hidden; transform: translateZ(0); perspective: 1000px}
a.btn i {top:14px; transition: all .35s ease-out; color: #fff}
a.btn i.before {margin-left:-20px; transform-origin: left center; position: absolute}
a.btn i.after {transform: translateX(75%) scaleX(0.1); transform-origin: right center;  opacity: 0; position: absolute}
a.btn:hover span {transform: translateX(-10px)}
a.btn:hover i.before {opacity: 0; transform: translateX(-75%) scaleX(0.1)}
a.btn:hover i.after {color: #fff; opacity: 1; transform: translateX(0) scaleX(1)}

/* =================================================================== */
/* HEADER - Section
/* =================================================================== */		

header {top:0; left:0; width: 100%; position: relative; overflow: hidden}
/* -------------------------------------------------------- Logo */
.logo {top:0; padding:0.85rem 1.7rem; line-height:0; flex: 1 0 auto; display: inline-flex; flex-direction: column; position: absolute; z-index:600}
.logo h2 {top:4rem; margin-left:0.2rem; font:normal 9px 'Lato'; letter-spacing: 0.2em; position: absolute}
.logo h3 {font:normal 33px 'Playfair'; letter-spacing: 0.075em; line-height:1.5}
@media all and (min-width:576px) {
	.logo {padding:0.7rem 3.5rem}
	.logo h2 {font-size:11px}
	.logo h3 {font-size:37px; letter-spacing: 0.125em; line-height:1.4}}
@media all and (min-width:1024px) {	
	.logo {padding:1.1rem 3.5rem}
	.logo h2 {top:4.1rem; font-size:9px; letter-spacing: 0.215em}
	.logo h3 {font-size:35px; letter-spacing: 0.05em; line-height:1.3}}
@media all and (min-width:1200px) {	
	.logo {padding:1.1rem 5rem}}	
@media all and (min-width:1359px) {	
	.logo {padding:1.1rem 7.5rem}}			
/* -------------------------------------------------------- nav menu */
nav {position: sticky; top: 0; width: 100%}
#navbar {height:100px; background-color:#fcfcfc; box-shadow: 0 1px 0 rgba(0,0,0,0.05); z-index:55555}
#navbar ul {margin: 0; padding: 0; display: none; background-color:#fcfcfc}
#navbar ul::before,
#navbar ul::after {content: ""; display: table}
#navbar ul::after {clear: both}
#navbar ul > li > a span {padding: 1.1rem 0; font:normal 15px "Lato"; letter-spacing:0.15em; width: 100%; text-align: center; position: relative; display: inline-block; z-index:55556}
#navbar ul > li > a span:hover {color: #c0a963}
#navbar ul > li > a:hover::after {width: 100%}
#navbar ul > li.dropdown {position: relative}
#navbar ul > li.dropdown:hover .dropdown-menu {top: 100%; opacity: 1; visibility: visible; display: block}
#navbar ul > li.dropdown .dropdown-menu {margin: 0 auto; top: 500%; transition: all 250ms; opacity: 0; visibility: hidden; display: none; position: relative}
#navbar ul > li.dropdown .dropdown-menu li {width: 100%}
#navbar ul > li.dropdown .dropdown-menu li a > span {padding:10px 0; width: 100%; display: block; text-align: center}
#navbar ul > li.dropdown .dropdown-menu li a > span::after {display: none}
#navbar input[type=checkbox]{display: none}
#navbar input[type=checkbox]:checked ~ #menu {padding-top:5rem; border-top: 1px solid rgba(0,0,0,0.1); min-height:100vh; display: block}
#navbar .menu-icon {padding-right:25px; height:100px; display: flex; align-items: center; justify-content: flex-end; position: relative; user-select: none; cursor: pointer; z-index:602}
#navbar .menu-icon .navicon {width:35px; height:5px; background-color: #333; display: block; position: relative; transition: background .2s ease-out}
#navbar .menu-icon .navicon::before,
#navbar .menu-icon .navicon::after {background-color: #333; content: ''; display: block; height: 100%; position: absolute; transition: all .2s ease-out; width: 100%}
#navbar .menu-icon .navicon::before {top: 10px}
#navbar .menu-icon .navicon::after {top: -10px}
#navbar .menu-btn {display: none}
#navbar .menu-btn:checked ~ .menu-icon .navicon {background-color: transparent}
#navbar .menu-btn:checked ~ .menu-icon .navicon::before {transform: rotate(-45deg)}
#navbar .menu-btn:checked ~ .menu-icon .navicon::after {transform: rotate(45deg)}
#navbar .menu-btn:checked ~ .menu-icon:not(.steps) .navicon::before,
#navbar .menu-btn:checked ~ .menu-icon:not(.steps) .navicon::after {top: 0}	
#navbar .display a span {margin:2rem auto 0; padding:10px 50px 12px; color: #fff; background-color: #d1c286; width: auto; transition: background 1s ease; border-radius:3px; text-align: center; display: table; position: relative}
#navbar .display a span:hover {background-color: #c0a963; color: #fff}
#navbar .social {margin:3.5rem auto 0; text-align:center; display: table}
#navbar .social a.brouiller,
#navbar .social a {margin-right:1rem; font-size:23px; color:#d1c286; display: inline}
#navbar .social a.brouiller:hover,
#navbar .social a:hover {color:#c0a963}
#navbar .social a.brouiller:last-of-type,
#navbar .social a:last-of-type {margin-right: 0}
#navbar .social a.brouiller::after {display:none; content: attr(data-name) "@" attr(data-domain) "." attr(data-tld)}
#booking,
#phone {display:none}
@media all and (min-width:576px) {
	#navbar .menu-icon {padding-right:60px}
	#navbar input[type=checkbox]:checked ~ #menu {padding-top:6rem}
	#navbar ul > li > a span {padding:1.5rem 0; font-size:17px}} 
@media all and (min-width:1024px) {	
	#navbar ul {display: block!important; width: 100%; text-align:right; line-height:100px}
	#navbar ul > li {position: relative; display:inline-block}
	#navbar ul > li > a span {padding:0 0.7rem; font-size:12px}
	#navbar ul > li > a span:hover {color: #000}	
	#navbar ul > li > .line::after {margin: auto; width:0; height:0.15rem; bottom: 0; left: 0; right: 0; background-color: #d1c286; transition: 0.1s; content: ''; position: absolute}
	#navbar ul > li.dropdown:hover .dropdown-menu {top: 100%; line-height:35px; box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.05)}
	#navbar ul > li.dropdown .dropdown-menu {top: 150%; width:160px; padding: 1rem 0 1.25rem; margin: -0.15rem auto 0 0.5rem; border-top:0.2rem solid #d1c286; background-color:#fcfcfc; position: absolute; box-shadow: none; transition: 0.5s}
	#navbar ul > li.dropdown .dropdown-menu li {width: 100%; line-height:0}
	#navbar ul > li.dropdown .dropdown-menu li a > span {padding:0; margin-left:1.5rem; display: inline-block; text-align:left}
	#navbar ul > li.dropdown .dropdown-menu li a > span:hover {color: #d1c286}
	#navbar input[type=checkbox]:checked ~ #menu {padding-top:0}
	#navbar .menu-icon,
	#navbar .display,
	#navbar .social {display: none}
	#booking,
	#phone {display: block}	
	#booking > a {margin: 0 0.65rem 0 0.2rem; color: #555; display: inline-flex}	
	#booking > a > .booking {font:normal 37px 'Signature'; letter-spacing: 0.05em; transition: .7s; text-transform:none}	
	#booking > a > .booking::after {padding-left:0.7rem; top:0.2rem; font-size:1.5rem; transition: .7s; color:#777; position:relative; content: "\2192"}
	#booking > a > .booking:hover,
	#booking > a > .booking:hover::after {transform: scale(1.1, 1.05); color: #d1c286}	
	#phone > a > i {padding:9px 11px; margin: 0 2.5rem 0 auto; border-radius:25px; background-color: #d1c286; color: #fff; transition: background 1s ease; display: inline-flex}
	#phone > a > i:hover {background-color: #c0a963}}
@media all and (min-width:1200px) {
	#navbar ul {width:95%}
	#navbar ul > li > .line::after {height:0.2rem}
	#navbar ul > li.dropdown .dropdown-menu {margin:-0.2rem auto 0 0.8rem; width:175px}
	#booking > a {margin: 0 0.6rem 0 0}
	#booking > a > .booking::after {padding-left:1rem; font-size:1.5rem}	
	#phone > a > i {margin: 0}}	
@media all and (min-width:1359px) {
	#navbar ul {width:93%}
	#navbar ul > li > a span {padding:0 1.1rem; letter-spacing:0.2em}
	#booking > a {margin: 0 1.15rem 0 0}}	
/* -------------------------------------------------------- nav page */
.nav {position: fixed ! important; top: 0; width: 100%} 
/* -------------------------------------------------------- Hero */
.hero-header {height:160px; opacity:0.95; background: url(../img/divider/hero.webp) center center no-repeat; background-size: cover}
.hero {padding:2.8rem 0; margin: 100px auto 0; width: 100%}
.hero-head {padding-top:1.25rem; text-align:left}
.hero-head ol {margin-left:0.15rem; padding: 0; list-style: none}
.hero-head ol li {line-height:0; display:inline; position:relative}
.hero-head ol li span,
.hero-head ol li a span {font:normal 15px 'Lato'; letter-spacing:0.025em; color: #777; transition: all 0.2s ease; text-decoration: none; text-transform:none}
.hero-head ol li a span.active {border-bottom:1px dotted #ccc}
.hero-head ol li a span.active:hover {border-bottom:1px solid #777}
.hero-head h1 {margin-top:0.5rem; font:bold 17px 'Florentino'; letter-spacing:0.035em; text-shadow: 1px 2px 0px #e8e4e1}
.topLinkLi + .topLinkLi::before {padding: 0 0.40rem 0 0.25rem; top:0; font-size:20px; color:#777; content: " • "; display: inline-block; position: relative}	
@media all and (min-width:576px) {
	.hero-header {height:210px}
	.hero-head {padding-top:3rem}
	.hero-head ol li span,
	.hero-head ol li a span {font-size:18px}
	.hero-head h1 {font-size:23px}
	.topLinkLi + .topLinkLi::before {font-size:20px}}
@media all and (min-width:992px) {
	.hero-header {height:250px}
	.hero-head {padding-top:4rem}
	.hero-head ol li span,
	.hero-head ol li a span {font-size:20px}	
	.hero-head h1 {margin-top:0.6rem; font-size:27px; letter-spacing:0.025em; text-shadow: none}
	.topLinkLi + .topLinkLi::before {top:-0.05rem}}
@media all and (min-width:1200px) {
	.hero-header {height:300px; background: url(../img/divider/hero.webp) center top 70% no-repeat}
	.hero-head {padding-top:6.5rem}}	
	
/* =================================================================== */
/* MAIN - Index
/* =================================================================== */					
					
main,
footer {top:0; left:0; position:relative; overflow: hidden}	
/* -------------------------------------------------------- widthPage */					
#widthPage-0,#widthPage-1,#widthPage-2,#widthPage-3,#widthPage-4,#widthPage-5,#widthPage-6,#widthPage-7,#widthPage-8,#widthPage-9,#widthPage-10,#widthPage-11 {width:80%; margin:auto; position:relative}
@media all and (min-width:992px) {
	#widthPage-0,#widthPage-1,#widthPage-2,#widthPage-3,#widthPage-4,#widthPage-5,#widthPage-6,#widthPage-7,#widthPage-8,#widthPage-9,#widthPage-10,#widthPage-11 {width:890px}}	
@media all and (min-width:1200px) {
	#widthPage-0,#widthPage-1,#widthPage-2,#widthPage-3,#widthPage-4,#widthPage-5,#widthPage-6,#widthPage-7,#widthPage-8,#widthPage-9,#widthPage-10,#widthPage-11 {width:1100px}}							
/* -------------------------------------------------------- flexBox */																																											
.flex {width:100%; display:flex; flex-flow: row wrap; align-items:center; justify-content:center; margin:0 auto; position:relative}
@media all and (min-width:992px) {
	.flex {width:100%; flex-flow:nowrap; align-items:flex-start}
	.flexReverse {flex-direction: row-reverse}}
/* ============= */ 						
.flexOrder-1 {order:1; flex:100%; max-width:100%}
.flexOrder-2 {order:2; flex:100%; max-width:100%}
.flexOrder-3 {order:1; flex:58%; max-width:58%}
.flexOrder-4 {order:1; flex:42%; max-width:42%}
.flexOrder-5 {order:1; flex:100%; max-width:100%}
.flexOrder-6 {order:1; flex:100%; max-width:100%}
.flexOrder-7 {order:1; flex:100%; max-width:100%}
.flexOrder-8 {order:1; flex:100%; max-width:100%}
.flexOrder-9 {order:2; flex:100%; max-width:100%}
.flexOrder-10 {order:2; flex:100%; max-width:100%}
.flexOrder-11 {order:1; flex:100%; max-width:100%}
.flexOrder-12 {order:1; flex:100%; max-width:100%}
.flexOrder-13 {order:1; flex:100%; max-width:100%}
.flexOrder-14 {order:2; flex:100%; max-width:100%}
.flexOrder-15 {order:1; flex:100%; max-width:100%}
@media all and (min-width:767px) {
	.flexOrder-3,
	.flexOrder-4 {order:1; flex:31%; max-width:31%}
	.flexOrder-5 {order:1; flex:38%; max-width:38%}}	
@media all and (min-width:992px) {
	.flexOrder-1 {order:1; flex:50%; max-width:50%}
	.flexOrder-2 {order:2; flex:50%; max-width:50%}
	.flexOrder-3,
	.flexOrder-4,
	.flexOrder-5 {order:1; flex:18.5%; max-width:18.5%}
	.flexOrder-6 {order:1; flex:33.3333333333%; max-width:33.3333333333%}
	.flexOrder-8 {order:1; flex:58.3333333333%; max-width:58.3333333333%}
	.flexOrder-9 {order:2; flex:41.6666666667%; max-width:41.6666666667%}
	.flexOrder-10 {order:2; flex:20%; max-width:20%}
	.flexOrder-11 {order:1; flex:40%; max-width:40%}
	.flexOrder-12 {order:2; flex:66.6666666667%; max-width:66.6666666667%}
	.flexOrder-13 {order:2; flex:33.3333333333%; max-width:33.3333333333%}
	.flexOrder-14 {order:1; flex:66.6666666667%; max-width:66.6666666667%}
	.flexOrder-15 {order:1; flex:25%; max-width:25%}	
	.flexOrder-16 {order:1; flex:43.5%; max-width:43.5%}}	
/* -------------------------------------------------------- Intro */	
.intro {padding-top:3.5rem; position:relative; text-align:center; clear: both}
.intro h2 {margin-top:0.35rem; font-size:24px; font-weight: 700; letter-spacing: 0.05em; line-height: 1.2}
.intro h2 span {font:700 32px 'Florentino'; letter-spacing:0.03em; display: block; position: relative}
.intro h2 span::after {bottom:-1.75rem; width:50px; height: 2px; background-color: #d1c286; left: 50%; transform: translateX(-50%); position: absolute; content: ""; display: block}
.intro h3 {margin:3.5rem 0 2rem; font:normal 13px 'Lato'; letter-spacing: 0.135em; color: #888}
.intro p {text-align:justify}
.intro p.cours-p {margin:1.25rem auto 0; width:250px; text-align:center}
.intro a.btn {margin-top:2.5rem; width:220px; text-align:center; display: table}
@media all and (min-width:576px){
	.intro {padding:3.95rem 0 0.5rem}
	.intro p.cours-p {margin:1rem auto 0; width:100%}
	.intro a.btn {margin-top:2.75rem}}	
@media all and (min-width:992px){
	.intro h2 {font-size:28px}	
	.intro h2 span {font-size:36px}
	.intro p {margin:2.5rem auto 0; text-align:center; width:705px}
	.intro p.cours-p {margin:0.25rem auto 0}}
/* -------------------------------------------------------- Nice */	
.nice-select {padding:8px 0 8px 16px; width:100%; border: 1px solid #d1c286; color:#777; border-radius: 1px; text-align: left; vertical-align: middle; background:none; margin: 0 auto; position: relative; cursor: pointer}
.nice-select:focus {outline: none}
.nice-select::before {left:0.7rem; background: url('../img/cours/cadeau/temps.png') no-repeat left center; background-size: 20px 20px; width: 20px; height: 20px; transform: scale(1); content: ""; position: absolute}
.nice-select::after {top:9px; right:12px; color:#d1c286; content: '\25BC'; position: absolute; transition: .25s all ease; pointer-events: none}
.nice-select:hover::after {color: #d1c286}
.nice-select.open::after {transform: rotate(-180deg)}
.nice-select.open .list {opacity: 1; pointer-events: auto; transform: scale(1) translateY(0)}
.nice-select .list {margin-top:0.07rem; width:100%; background-color:#f7f5ef; border: 1px solid #bbb; box-shadow:1px 1px 3px #888; box-sizing: border-box; opacity: 0; padding: 0; top: 100%; left: 0; pointer-events: none; position: absolute; overflow: hidden; transition: transform .30s; transform: scale3d(1, 0, 1); transform-origin: 50% 0; z-index: 13}	
.nice-select .list:hover .option:not(:hover) {background-color: transparent !important} 
.nice-select .option {padding:10px 0 12px 15px; text-indent:1.35rem; outline: none; transition: all 0.25s}						
.nice-select .option:hover, 
.nice-select .option.focus, 
.nice-select .option.selected.focus {background-color: #eee} 	
.nice-select span,
.nice-select .option {font:normal 15px 'Lato'; text-transform:none}
.nice-select span {margin-left:1.35rem; position:relative}
@media all and (min-width:576px) {
	.nice-select {width:100%; padding:9px 0 12px 16px}
	.nice-select::before {margin-left:0.25rem; background-size: 25px 25px; width: 25px; height: 25px}
	.nice-select::after {right:15px; font-size:20px}
	.nice-select span,
	.nice-select .option {font-size:17px; letter-spacing:0.1em; text-indent:2.3rem}
	.nice-select span {margin-left:2.3rem}}
@media all and (min-width:992px) {
	.nice-select {padding:8px 0 9px 16px}
	.nice-select::before {margin-left:0; background-size: 20px 20px; width: 20px; height: 20px}
	.nice-select::after {right:5px; font-size:15px}
	.nice-select span,
	.nice-select .option {font-size:15px; letter-spacing:0.05em; text-indent:1.35rem}
	.nice-select span {margin-left:1.35rem}}
@media all and (min-width:1200px) {
	.nice-select::after {top:8px; right:16px; font-size:17px}
	.nice-select .option {text-indent:1.6rem}
	.nice-select span {margin-left:1.6rem}}	
/* -------------------------------------------------------- Euro */		
.euro {margin:1.25rem 0 0.8rem 0.6rem}
.euro__1 {margin:1.25rem 0 1.5rem 0.3rem}
.euro__2 {margin:1rem 0 0 0.3rem}
.euro sup {margin:0 0.25rem 0 0.05rem; top:-0.2rem; font-size:18px; font-weight:700; vertical-align: super; color:#d8b872; position:relative}
.euro span,
.euro #priceDiv,
.euro #priceDiv1,
.euro #priceDiv3,
.euro #priceDiv5,
.euro #priceDiv6 {font:bold 22px 'Lato'; color:#d8b872}
.euro .priceTTC {font:normal 10px 'Lato'; letter-spacing:0.05em; color: #888}
@media all and (min-width:576px) {
	.euro {margin:1.75rem 0 1rem 0.6rem}
	.euro__1 {margin:2rem 0 2rem 0.6rem}
	.euro__2 {margin:1.5rem 0 0 0.6rem}
	.euro sup {font-size:22px}
	.euro span,
	.euro #priceDiv1,
	.euro #priceDiv2,
	.euro #priceDiv3,
	.euro #priceDiv5,
	.euro #priceDiv6 {font-size:29px}
	.euro #priceDiv {font-size:30px}
	.euro .priceTTC {font-size:12px}}
@media all and (min-width:992px) {
	.euro {margin:1.35rem 0 0.7rem 0.3rem}
	.euro__1 {margin:0.8rem 0 1rem 0.6rem}
	.euro__2 {margin:1rem 0 0 0.6rem}
	.euro sup {font-size:18px}
	.euro span,
	.euro #priceDiv1,
	.euro #priceDiv2,
	.euro #priceDiv3,
	.euro #priceDiv5,
	.euro #priceDiv6 {font-size:22px}
	.euro #priceDiv {font-size:23px}
	.euro .priceTTC {font-size:10px}}
@media all and (min-width:1200px) {
	.euro__1 {margin:1.5rem 0 1.5rem 0.6rem}
	.euro__2 {margin:1.25rem 0 0 0.6rem}}	
	/* -------------------------------------------------------- Témoignages */	
#testimonial {padding:3.5rem 0 3.95rem; margin-top:3.95rem; background-color:#f7f5ef; width: 100%; text-align:center; display: flex; background-origin: content-box; background-position: 100% 100%; z-index:1}
#testimonial .heading div {font:normal 12px 'Lato'; letter-spacing:0.1em}
#testimonial .heading h2 {margin: 0.3rem 0 1.25rem; font-size:19px; letter-spacing: 0.05em}
#testimonial .testimony-slide p.nom {font:bold 13px 'Lato'; letter-spacing: 0.05em; color:#777; text-transform:uppercase}
#testimonial .testimony-slide p.nom a {font-size:13px; letter-spacing: 0.05em;; color: #c2af65}
#testimonial .testimony-slide blockquote {width:270px; padding: 0; margin: 1.35rem auto 2.25rem; position: relative}
#testimonial .testimony-slide blockquote p {left:-0.5rem; letter-spacing: 0.03em; display: inline-flex; position:relative}
#testimonial .testimony-slide blockquote span {left:0.5rem; top:1.5rem; font:normal 80px 'Florentino'; line-height:0; color:#555; display: inline-flex; position:relative}
#testimonial .testimony-slide blockquote a {font-size:20px; text-transform:none; position: relative}
#testimonial a.btn {margin-top:0.5rem; width:260px; text-align:center; display: table}
#testimonial a.btn span {letter-spacing:0.08em}
.owl-theme .owl-dot {font:normal 12px 'Lato'; color:#aaa; counter-increment: slides-num; display: inline-block}
.owl-theme .owl-dot.active::before {right:0.45rem; top:0.35rem; width: 100%; content:counter(slides-num); display: inline-block; vertical-align: middle; position: absolute}
.owl-theme .owl-dot::after {left:50%; top:32%; height:14px; width:0.25px; background-color:#aaa; transform: rotate(34deg); position: absolute; content:""}
.owl-theme .owl-dots {width:39px; height:39px; top:0; left:50%; transform: translate(-50%,-85%); background-color:#edece6; border-radius:50%; counter-reset:slides-num; position: relative}
.owl-theme .owl-dots::after {margin-left:0.7rem; margin-top:1.1rem; font:normal 12px 'Lato'; color:#aaa; content:counter(slides-num); display: inline-block; vertical-align: middle}			
.owl-theme .owl-nav [class*=owl-]{font-size:27px; margin-left:35px; margin-right:35px; color:#ccc; display:inline-block; cursor:pointer}
.owl-theme .owl-nav [class*=owl-]:hover {color:#d1c286; text-decoration:none}
.owl-theme .owl-nav .disabled {opacity:1; cursor:default}
@media all and (min-width:576px) {
	#testimonial {padding:3.95rem 0 4.5rem; margin-top:4.5rem}
	#testimonial .heading div {font-size:15px}
	#testimonial .heading h2 {margin:0.6rem 0 1rem; font-size:25px}
	#testimonial .testimony-slide p.nom a,
	#testimonial .testimony-slide p.nom {font-size:15px; letter-spacing: 0.07em}	
	#testimonial .testimony-slide blockquote {margin:2rem auto 2.5rem; width:550px}
	#testimonial .testimony-slide blockquote span {left:0; font-size:100px}
	#testimonial .testimony-slide blockquote a {font-size:22px}
	#testimonial a.btn {width:280px}}
/* -------------------------------------------------------- Etoiles */		
.aviStars {margin-top:1.5rem; display: inline-flex; position: relative; z-index:20}
.aviStars::before {padding: 0 80px 0 0; background: url(../img/divider/icon-review-star-empty.png) 0 0 repeat-x; height:16px; background-size:16px; background-position: center center; content: ""; display: block}
.aviStars__stars {background: url(../img/divider/icon-review-star.png) 0 0 repeat-x; background-size:16px; height:16px; top: 0; left: -999999px; text-indent: -999999px; background-position: left center; position: absolute}
.aviStars__stars--1 {left: 0; width: 16px}
.aviStars__stars--1\.5 {left: 0; width: 24px}
.aviStars__stars--2 {left: 0; width: 32px}
.aviStars__stars--2\.5 {left: 0; width: 40px}
.aviStars__stars--3 {left: 0; width: 48px}
.aviStars__stars--3\.5 {left: 0; width: 56px}
.aviStars__stars--4 {left: 0; width: 64px}
.aviStars__stars--4\.5 {left: 0; width: 72px}
.aviStars__stars--5 {left: 0; width: 80px}
@media all and (min-width:576px) {
	.aviStars {margin-top:2rem}}
/* -------------------------------------------------------- Parallax */
#parallax {padding:6rem 0; width: 100%; height:auto; opacity:0.8; background: url(../img/info/img_bg_5.jpg) no-repeat center center; background-size: cover; position: relative; overflow: hidden}
.payoff {height:100%; width:100%; position: relative}							
.payoff .contactText {padding:1.5rem 0 2.5rem; background-color: rgba(252,252,252,0.9); width:100%; margin:0 auto; text-align: center}		
.payoff .contactText > img {margin-top:0.7rem; width:55px; max-width:100%; height:auto}							
.payoff .contactText .h6 {margin-top:0.75rem; font:normal 12px 'Lato'; letter-spacing:0.1em; color: #555}
.payoff .contactText h2 {margin-top:0.35rem; font-size:18px; letter-spacing:0.025em; line-height:1.35}
.payoff .contactText h2 a {border-bottom:1px dotted #555}
.payoff .contactText h2 a:hover {border-bottom:1px solid #333}
.payoff .wrapCol {width:100%; margin:1.5rem 0}
@media all and (min-width:576px) {	
	 #parallax {padding:7rem 0}
	 .payoff .contactText {padding:2rem 0 3.5rem}		
	 .payoff .contactText > img {width:80px}							
	 .payoff .contactText .h6 {font-size:15px}
	 .payoff .contactText h2 {font-size:25px}
	 .payoff .wrapCol {margin:2.5rem 0}}						
@media all and (min-width:992px) {				
	 #parallax {padding:5rem 0}
	.payoff .contactText {padding:1rem 0 2.5rem}
	.payoff .contactText > img {width:55px}							
	.payoff .contactText .h6 {font-size:12px}
	.payoff .contactText h2 {font-size:18px}																			
	.payoff .wrapCol {margin: 0 1.5rem}}	
@media all and (min-width:1200px) {		
	 #parallax {padding:6rem 0}							
	 .payoff .wrapCol {margin: 0 2.5rem}}
/* -------------------------------------------------------- INFO */
.infoPage {padding:3.5rem 0 4.5rem; background-color:#d1c286; color: #fff; text-shadow: 1px 0 #aaa; text-align: center; position:relative}
.infoPage h2 {font-size:21px; letter-spacing: 0.02em; line-height:1.5; font-weight:bold}
.infoPage p {margin:1.5rem auto 2.5rem; letter-spacing:0.025em; text-align:justify}
.infoPage a {border-bottom:1px dotted #fff}
.infoPage a:hover {border-bottom:1px solid #aaa}
.infoPage_Right a.btn,
.infoPage_Left a.btn {margin:0.5rem auto; width:280px; background-color:#dace9e; border-bottom:0px dotted #dace9e; text-align:center; display: table}
.infoPage_Right a.btn:hover,
.infoPage_Left a.btn:hover {border-bottom:0px solid #dace9e}
@media all and (min-width:576px) {	
	.infoPage {padding:3rem 0 4.5rem}
	.infoPage h2 {margin-top:0.5rem}
	.infoPage p {width:480px; text-align:center}}
@media all and (min-width:992px) {	
	.infoPage {padding:3.95rem 0 5rem}
	.infoPage h2 {font-size:24px; margin-top:0}
	.infoPage p {margin:1.1em auto 2.75rem; line-height: 1.8; width:800px}
	.infoPage_Left a.btn {margin:0 0.85rem 0 auto}	
	.infoPage_Right a.btn {margin:0 auto 0 0.85rem}}
@media all and (min-width:1200px) {	
	.infoPage {padding:4.5rem 0 5.5rem}
	.infoPage_Left a.btn,
	.infoPage_Right a.btn {margin-top:0.8rem}}	
/* -------------------------------------------------------- Intro */	
.cgv__one {padding-top:3.5rem; position:relative; text-align:center; clear: both}
.cgv__one h3 {font:normal 16px 'Lato'; letter-spacing: 0.05em; line-height:0.5; text-transform:none; color:#888}
.cgv__one h2 {margin-top:0.5rem; font:bold 28px 'Florentino'; letter-spacing: 0.025em;}
.cgv__one h2 span{font:italic 20px 'Florentino'; display:block}
.cgv__one .hr {padding-bottom:0.2em; margin:0.5rem auto 2rem -2rem; width:50px; border-bottom:2px solid #d5c791; position: relative; display: inline-block}
.cgv__one .hr::after {margin-left:2rem; width:50px; border-bottom:2px solid #d5c791; display: block; content: ""}
.cgv__one p {text-align:justify}
.cgv__one .p1 {padding:1.25rem 0 1.5rem; font-size:16px; text-transform:none; text-align:justify}
.cgv__one-legal {margin-bottom:1.25rem}
@media all and (min-width:576px){
	.cgv__one h3 {font-size:18px}
	.cgv__one h2 {font-size:30px}
	.cgv__one h2 span {font-size:22px}
	.cgv__one .hr {margin:1rem auto 2.5rem}
	.cgv__one .p1 {padding:1.5rem 0}}	
@media all and (min-width:992px){
	.cgv__one {padding-top:4.5rem}
	.cgv__one h3 {font-size:20px; letter-spacing:0.1em; text-transform:uppercase}
	.cgv__one h2 {margin-bottom:2.25rem; font-size:25px; line-height:2}
	.cgv__one h2 span {font-size:25px; font-style:normal; font-weight:bold; display:inline-block}
	.cgv__one .hr {display:none}
	.cgv__one .p1 {padding:2rem 0}}
@media all and (min-width:1200px){
	.cgv__one {padding-top:5rem}}	
/* -------------------------------------------------------- Intro */	
.touslescours {margin-top:-0.5rem}
.titleGallery {padding-top:3.5rem; width: 100%; text-align:center; z-index:1}
.titleGallery h2 {font:normal 18px 'Lato'; letter-spacing: 0.015em; text-transform:none; color:#777}
.titleGallery h3 {margin-top:0.25rem}
.titleGallery h3 span {display:block}
.titleGallery h3 span:nth-child(1) {font:bold 33px 'Florentino'; letter-spacing: 0.035em; line-height:1.5}
.titleGallery h3 span:nth-child(2) {font:normal 16px 'Lato'; letter-spacing: 0.05em; line-height:1.5; color:#8e8e8e}
.titleGallery .border {margin:-0.6rem 0 0.7rem; border-bottom:1px dotted #baa348; width:100%; position:relative}
.titleGallery a.btn {background-color:#333; width:100%; text-align:center; display: table}
.titleGallery .pd-top {margin-top:3.95rem}
.liste {padding:0.35rem 2rem 2.5rem; margin:2.25rem 0 0.25rem; background-color:#f4f3ee; text-align:left}
.liste h2 {margin:1.5rem 0 0.5rem; font:bold 20px 'Cormorant'; letter-spacing:0.035em; color:#333}
.liste p {margin-bottom:1rem; line-height:1.25; text-align:justify}
.liste ol {margin-left:2.25rem}
.liste ol li {padding:3px 0; font-size:20px; letter-spacing:0.02em; text-indent:3px; text-transform: none; list-style-type: decimal-leading-zero}
.liste a {border-bottom:1px dotted #555}
.liste a:hover {border-bottom:1px solid #aaa}
@media all and (min-width:576px){
	.touslescours {margin-top:0}
	.titleGallery {padding-top:3.95rem}
	.titleGallery h2 {font-size:19px; letter-spacing: 0.05em}
	.titleGallery h3 span:nth-child(1) {font-size:38px}
	.titleGallery h3 span:nth-child(2) {font-size:18px}
	.titleGallery .pd-top {margin-top:5rem}
	.liste {padding:1.5rem 3.95rem 3.25rem; margin:3rem 0 0}
	.liste h2 {margin:1.5rem 0 0.75rem; font-size:22px; letter-spacing:0.05em}
	.liste p {margin-bottom:1.25rem; line-height:1.35}
	.liste ol {margin-left:3.5rem}
	.liste ol li {padding:6px 0; font-size:22px; letter-spacing:0.05em}}
@media all and (min-width:992px){
	.titleGallery h2 {font-size:17px; letter-spacing: 0.12em; text-transform:uppercase}
	.titleGallery h3 span {display:inline}
	.titleGallery h3 span:nth-child(1),
	.titleGallery h3 span:nth-child(2) {font:bold 25px 'Florentino'; letter-spacing:-0.005em; line-height:1.75; text-transform:none; color:#333}
	.titleGallery .pd-top {margin-top:4.5rem}
	.liste {padding:1.5rem 5rem 3.25rem}
	.liste h2 {margin:1.5rem 0 0.75rem; font-size:20px; letter-spacing:0.02em}
	.liste ol {margin-left:5rem}}	
@media all and (min-width:1200px){
	.touslescours {margin-top:0.5rem}}	
/* -------------------------------------------------------- Selection Galerie */	
.gallery {padding-top:1.2rem; display: flex; flex-wrap: wrap; margin: 0; text-align:left}
.gallery .gallery__item {flex: 0 1 calc(100% / 1); padding: 0; margin-bottom:1.15rem}
.gallery .gallery__item > figure {transition: 0.3s ease-in-out; background: linear-gradient(#edece6) no-repeat; padding: 14px 0 14px 20px; margin-top:50px; background-size: 25%}
.gallery .gallery__item > figure:hover .gallery__image::after {transform: rotateZ(0deg); opacity: 1}
.gallery .gallery__item > figure:hover .gallery__btns {opacity: 1}
.gallery .gallery__image {border: 1px solid #d1c286; border-radius: 1px; padding: 10px; margin-top:-50px; transition: 0.3s ease-in-out; position: relative}
.gallery .gallery__image::after {content: ''; background-color: rgba(255,255,255,0.7); top:10px; right:10px; bottom:10px; left:10px; opacity: 0; transition: 0.5s ease-in-out; position: absolute}
.gallery .gallery__image img {box-shadow: 0 10px 20px rgba(0,0,0,0.1)}
.gallery .gallery__image .gallery__btns {top:50%; left:50%; transform: translate(-50%, -50%); opacity: 0; transition: 0.3s ease-in-out; z-index: 1; position: absolute}
.gallery .gallery__image .gallery__btns > a {padding:35px; font:bold 12px 'Lato'; letter-spacing:0.05em; line-height:1.5; border: 1px solid #d1c286; text-align: center; position: relative; overflow: hidden; display: block}
.gallery .gallery__image .gallery__btns > a::after {left:-200%; top: -50%; width:160%; height:200%; transform: skew(-45deg); background-color: #fff; transition: 0.7s all; content: ''; z-index: -1; position: absolute}
.gallery .gallery__image .gallery__btns > a:hover::after {left:-30%}
.gallery .gallery__image .gallery__btns > a:last-child {margin-bottom: 0}
.gallery .gallery__description {top:0.8rem; padding: 0.6rem 0.5rem 0; margin-left:23.95%; max-width:500px; min-height:235px; border: 1px solid #d1c286; border-radius: 1px; position: relative}
.gallery .gallery__description h2 {margin:0.15rem 0 0 0.5rem; font:bold 16px 'Florentino'; letter-spacing:0.015em; line-height:1.65;  color:#333; text-transform: uppercase}
.gallery .gallery__description h2 span {font:normal 17px 'Lato'; letter-spacing:0.035em; color:#888; text-transform: none; display:block}
.gallery .gallery__description h3 {margin-left:0.5rem; font-size: 16px; letter-spacing:0; line-height:1.65;  color:#333; text-transform: uppercase}
.gallery .gallery__description h3 span {font:normal 17px 'Lato'; letter-spacing:0.05em; color:#888; text-transform: none; display:block}
.gallery .gallery__description .postCol {margin:0 auto; padding:8px 0 8px 10px; width:95%; line-height:0; border:1px solid #d1c286; border-radius: 1px}
.gallery .gallery__description .postCol .postInfo {font:normal 15px 'Lato'; display:inline; text-transform: none; vertical-align: top}				
.gallery .gallery__description .postCol img {width:20px; margin:0 0.15rem; display:inline; position: relative}
.gallery .gallery__description a {margin-left:0.5rem; bottom:1rem; font-size:19px; letter-spacing:0.02em; border-bottom:1px dotted #f6f6f3; position:absolute; display:block; text-transform: none; z-index:11}
.gallery .gallery__description a::after {margin-left:0.36rem; font-size:15px; color:#5e5e5e; content: "\2192"; display: inline; position:relative}
.gallery .gallery__description a:hover {border-bottom:1px dotted #777}	
@media all and (min-width:576px) {
	.gallery {padding-top:2rem}
	.gallery .gallery__description {padding:1rem 2rem 0; min-height:300px; margin-left:25%}
	.gallery .gallery__description h2 {font-size:25px; letter-spacing:0.05em; line-height:1.35}
	.gallery .gallery__description h2 span {font-size:22px}
	.gallery .gallery__description h3 {font-size:24px; letter-spacing:0.025em; line-height:1.5}
	.gallery .gallery__description h3 span {margin-bottom:-0.2rem; font-size:22px}	
	.gallery .gallery__image .gallery__btns > a {padding:120px; font-size:22px}
	.gallery .gallery__description .postCol {width:100%}
	.gallery .gallery__description .postCol .postInfo {margin-left:0.5rem; top:0.1rem; font-size:17px; letter-spacing:0.1em; position:relative}
	.gallery .gallery__description .postCol img {margin-left:0.5rem; width:25px}
	.gallery .gallery__description a {bottom:1.35rem; font-size:22px}}
@media all and (min-width:992px) {
	.gallery {padding-top:1.35rem}
	.gallery .gallery__item > figure {padding: 15px 0 9px 10px}
	.gallery .gallery__item {flex: 0 1 calc(100% / 3)}
	.gallery .gallery__item:nth-child(1),
	.gallery .gallery__item:nth-child(4),
	.gallery .gallery__item:nth-child(7),
	.gallery .gallery__item:nth-child(10),
	.gallery .gallery__item:nth-child(13),
	.gallery .gallery__item:nth-child(16) {padding-right:7px}
	.gallery .gallery__item:nth-child(2),
	.gallery .gallery__item:nth-child(5),
	.gallery .gallery__item:nth-child(8),
	.gallery .gallery__item:nth-child(11),
	.gallery .gallery__item:nth-child(14),
	.gallery .gallery__item:nth-child(17) {padding: 0 5px}
	.gallery .gallery__item:nth-child(3),
	.gallery .gallery__item:nth-child(6),
	.gallery .gallery__item:nth-child(9),
	.gallery .gallery__item:nth-child(12),
	.gallery .gallery__item:nth-child(15),
	.gallery .gallery__item:nth-child(18) {padding-left:7px}
	.gallery .gallery__description {top:0.5rem; padding:0.7rem 0.7rem 0; min-height:235px}
	.gallery .gallery__description h2 {margin:0.3rem 0 0 0.3rem; font-size:15px; letter-spacing:0.025em; line-height:1.5}
	.gallery .gallery__description h2 span {font-size:16px}
	.gallery .gallery__description h3 {margin-left:0.25rem; font-size:14px}
	.gallery .gallery__description h3 span {font-size:16px}	
	.gallery .gallery__image .gallery__btns > a {padding:30px; font-size:12px}
	.gallery .gallery__description .postCol .postInfo {margin-left:0.15rem; top:0; font-size:15px; letter-spacing:0.05em}
	.gallery .gallery__description .postCol img {margin-left:0; width:20px}
	.gallery .gallery__description a {margin-left:0.3rem; bottom:1.25rem; font-size:19px}}
@media all and (min-width:1200px) {
	.gallery .gallery__item > figure {padding: 13px 0 13px 20px}
	.gallery .gallery__item:nth-child(1),
	.gallery .gallery__item:nth-child(4),
	.gallery .gallery__item:nth-child(7),
	.gallery .gallery__item:nth-child(10),
	.gallery .gallery__item:nth-child(13),
	.gallery .gallery__item:nth-child(16) {padding-right:13px}
	.gallery .gallery__item:nth-child(2),
	.gallery .gallery__item:nth-child(5),
	.gallery .gallery__item:nth-child(8),
	.gallery .gallery__item:nth-child(11),
	.gallery .gallery__item:nth-child(14),
	.gallery .gallery__item:nth-child(17) {padding: 0 6px}
	.gallery .gallery__item:nth-child(3),
	.gallery .gallery__item:nth-child(6),
	.gallery .gallery__item:nth-child(9),
	.gallery .gallery__item:nth-child(12),
	.gallery .gallery__item:nth-child(15),
	.gallery .gallery__item:nth-child(18) {padding-left:13px}
	.gallery .gallery__description {top:0.8rem}
	.gallery .gallery__description h3 {font-size:15px}
	.gallery .gallery__description h3 span {font-size:16px}}	
/* -------------------------------------------------------- FAQ CGV  */			
.faqs {position: relative; margin:0}
.faqs h2 {padding:1.3rem 0 1.2rem 0.25rem; font-size:15px; letter-spacing:0.035em; line-height:1.6; border-top:1px dotted rgba(0,0,0,0.52); display: block}
.faqs h2:hover {color:#d5c791}
.faqs h2::after {right:0.25rem; font:normal 35px 'Lato'; line-height:0.5; content:"-"; color:#555; transition:all .35s; position:absolute}								
.faqs input[type=radio]:checked ~ h2::after {font-size:22px; line-height:1; content:"+"}					
.faqs label {cursor: pointer}	
.faqs input {display: none}						
.faqs input[type="radio"]:checked ~ div[id^="content_"] {padding:1rem 0.39rem 1.5rem 1.3rem; height:auto; max-height:100%}
.faqs input[type="radio"]:checked ~ div[id^="content_"]::before {width:39px}
.faqs div[id^="content_"] {padding:0; height:auto; max-height:0; width:100%; position:relative; overflow:hidden}
.faqs div[id^="content_"]::before {left:1.24rem; top:0; width:0; height:2px; background-color:#d5c791; content:""; position:absolute}			
.faqs div ul {margin:1rem 0}
.faqs div ul li {padding-left:1.06rem; font-size:20px; letter-spacing:0.05em; line-height:1.5; text-indent:-16px; text-transform:none; text-align:justify; hyphens: auto; word-wrap: break-word}
.faqs div ul li::before {font-size:22px; margin-right:8px; color:#d5c791; content: "\00BB"}
.faqs div p {margin:1rem 0}	
.faqs div p,
.faqs div p a {text-align:justify}	
.faqs div p a:hover {border-bottom:1px solid #aaa}															
.faqs div p.faq-cgv {margin-bottom:0.5rem}
.faqs div h3 {margin:2rem 0 -0.5rem; font:normal 16px 'Cormorant'; letter-spacing:0.05em; color:#000}
.faqs div ol {margin-top:1rem; list-style: none; color:#585858}
.faqs div ol li {padding-left:1.06rem; padding-bottom:0.39rem; font-size:20px; letter-spacing:0.02em; line-height:1.5; text-indent:-16px; text-transform:none; text-align:justify; hyphens: auto; word-wrap: break-word}
.faqs div ol li::before {font-size:22px; margin-right:8px; color:#d5c791; content: "\00BB"}	
.faqs__cvg .ppp {padding:1.3rem 0 3.5rem; font-size:18px; color:#888; border-top:1px dotted rgba(0,0,0,0.52); text-align:justify}	
.faqs__mention {padding-bottom:1rem; color:#585858}				
@media all and (min-width:576px) {	
	.faqs__mention {padding-bottom:2rem}
	.faqs__cvg .ppp {padding:2rem 0 4rem; font-size:19px}
	.faqs h2 {font-size:18px}		
	.faqs div h3 {margin:2rem 0 -0.5rem; font-size:20px}
	.faqs div ol li,
	.faqs div ul li {font-size:22px; letter-spacing:0.1em}}
/* -------------------------------------------------------- Paiement */	
.pay {padding-bottom:1.2rem; margin:0; width: 100%; position: relative; z-index:1; clear: both}	
.pay h2 {border:1px solid rgba(0,0,0,0.1); display: block}
.pay h2 span {padding-top:0.1rem; font:500 17px 'CormorantGaramond_500'; letter-spacing:0.02em; vertical-align:middle}
.pay h2 > img {margin-right:0.7rem; padding:0.502rem 0.7rem 0.25rem 0.79rem; width:57px; border-right:1px solid rgba(0,0,0,0.1); background-color:#e1d5a7; max-width: 100%}																				
.pay > div:nth-of-type(1),
.pay > div:nth-of-type(2),
.pay > div:nth-of-type(3) {margin:1rem 0 2.5rem} 
.pay p {margin:1rem 0; line-height:1.5; text-align:justify}
.pay .payMrg {margin-top:1.5rem} 
.pay ul {padding:0; list-style: none}
.pay ul li {font-size:20px; letter-spacing:0.05em; line-height:1.5; text-align:justify; text-transform: none}
.pay ul li span {font-size:17px}
.pay ul li::before {padding-bottom:0.5rem; font-size:22px; line-height:1.39; margin-right:13px; color:#c2af65; font-weight:700; vertical-align:middle; content: "\00BB"}										
@media all and (min-width:576px) {
	.pay h2 span {font-size:20px}
	.pay > div:nth-of-type(1),
	.pay > div:nth-of-type(2),
	.pay > div:nth-of-type(3) {margin:1.25rem 0 3.5rem} 
	.pay ul li {font-size:22px; letter-spacing:0.1em}
	.pay ul li span {font-size:19px}}
@media all and (min-width:992px) {
	.pay .payMrg {margin-top:1.8rem}}
/* -------------------------------------------------------- Twenty */
#Twenty {margin-top:4.25rem; background-color: #f7f5ef; width:100%; position:relative; z-index: 0}
.sectTwenty {position:relative; z-index: 1}
.sectTwenty > div:nth-of-type(1) {margin-top:3.95rem}
.sectTwenty > div:nth-of-type(1) img {width:100%; margin: auto; position: relative; display: block}
.sectTwenty > div:nth-of-type(2) h2 {margin-top:2.25rem; font:bold 26px 'Florentino'; text-transform:none}	
.sectTwenty > div:nth-of-type(2) .big {margin:1.5rem 0 0.5rem; width:11.25rem; border-bottom:1px solid #d1c286}
.sectTwenty > div:nth-of-type(2) .small {margin: 0.5rem 0 1.35rem; width:9rem; border-bottom:1px solid #d1c286}					
.sectTwenty > div:nth-of-type(2) h3 {font:normal 14px 'Lato'; letter-spacing:0.05em}
.sectTwenty > div:nth-of-type(2) p {margin-top:1.75rem; padding-bottom:3rem; text-align:justify}
@media all and (min-width:576px) {
	#Twenty {margin-top:4.5rem}
	.sectTwenty > div:nth-of-type(1) {margin-top:5rem}
	.sectTwenty > div:nth-of-type(2) h2 {font-size:30px}	
	.sectTwenty > div:nth-of-type(2) {margin-top:0.5rem} 
	.sectTwenty > div:nth-of-type(2) .big {margin:1.5rem 0 0.5rem; width:12.25rem}
	.sectTwenty > div:nth-of-type(2) .small {margin: 0.5rem 0 1.5rem; width:10.25rem}					
	.sectTwenty > div:nth-of-type(2) h3 {font-size:15px}
	.sectTwenty > div:nth-of-type(2) p {margin-top:2rem; padding-bottom:3.95rem}}
@media all and (min-width:992px) {
	#Twenty {margin-top:10rem}
	.sectTwenty > div:nth-of-type(1) {margin-top:-5rem}
	.sectTwenty > div:nth-of-type(1) img {left:1rem; width:80%; box-shadow: -50px 50px #d1c286; margin: auto; position: relative; display: block}
	.sectTwenty > div:nth-of-type(2) {margin-top:1.5rem; padding:0 2.5rem 0 3.5rem} 
	.sectTwenty > div:nth-of-type(2) .big {margin:1.75rem 0 0.5rem}					
	.sectTwenty > div:nth-of-type(2) p {padding-bottom:5.5rem}}
@media all and (min-width:1200px) {
	#Twenty {margin-top:10.5rem}
	.sectTwenty > div:nth-of-type(1) img {width:70%}		
	.sectTwenty > div:nth-of-type(2) {margin-top:2.5rem; padding:0 8.5rem 0 3.95rem} 
	.sectTwenty > div:nth-of-type(2) p {padding-bottom:7.5rem}}	
/* -------------------------------------------------------- Contact Page */	
#contact {padding:5.75rem 0 3.95rem; width:80%; margin:0 auto; position:relative}
#contact h3 {font:normal 100px 'Signature'; line-height:0; color:#3e3e3e; text-align: center; text-transform:none}
#contact h3 span {display: none}																							
#contact p {margin-top:1.5rem; color:#d1c286}
#contact p a {font:bold 11px 'Florentino'; letter-spacing:0.07em; border-bottom:1px dotted #d5c791; text-transform:uppercase}
#contact p a:hover {border-bottom:1px solid #555}		
#contact form {padding-top:1.5rem; width:100%; margin:0 auto; overflow: hidden}
#contact form input:not([type="checkbox"]) {padding:1.25rem 0.2rem 1.5rem}
#contact form textarea {padding:1.3rem 0.2rem 0}
#contact form input:not([type="checkbox"]),
#contact form textarea {border-bottom:1px solid #ccc; border-left:none; border-top:none; border-right:none; transition: border-bottom 0.35s; background-color: transparent; outline: none; line-height: normal; border-radius: 0; appearance: none}
#contact form .select select:focus,
#contact form input:not([type="checkbox"]):focus,
#contact form textarea:focus {border-bottom-color:#000}
#contact form input,
#contact form textarea {font-size:19px; letter-spacing: 0.025em; line-height:1.6; text-transform:none; width: 100%}		
#contact form input::placeholder,
#contact form textarea::placeholder {color: #555; font-style: italic}
#contact form select {padding: 0 0.2rem; font:italic 19px 'Cormorant'; color:#747372; flex: 1; background-color:#fcfcfc; appearance:none; outline:0; box-shadow:none; border:0!important; background-image: none; cursor:pointer}
#contact form select::-ms-expand {display: none}
#contact form select:focus {box-shadow: 0 0 8px rgba(0,119,204,0.2); outline: none}
#contact form select option {color:#3a414e; font-size:17px; letter-spacing:0.1em}
#contact form .select {width: 100%; height:4.5em; line-height:4.5; border-radius: .25em; border-bottom: 1px solid #bbb; color:#747372;transition: border-color 0.3s, box-shadow 0.3s; box-sizing: border-box; border-top:none; border-right:none; border-left:none; position: relative; display: flex; overflow: hidden}
#contact form .select::after {padding: 0 1em; content: '\25BC'; position: absolute; top: 0; right: 0; cursor:pointer; pointer-events:none; transition:.25s all ease}
#contact form .select:focus-within::after {transform: rotate(180deg)}
#contact form .col_2 {width:100%}
#contact form .col_2 > div {position: relative}
#contact form .checkbox {margin-top:1rem; padding-left:0.106rem; line-height:1.5; text-align: justify; hyphens: auto; word-wrap: break-word}					
#contact form .checkbox [type="checkbox"]:not(:checked),
#contact form .checkbox [type="checkbox"]:checked {position: absolute; left: 0; opacity:0}
#contact form .checkbox [type="checkbox"]:not(:checked) + label,
#contact form .checkbox [type="checkbox"]:checked + label {padding-left:1.5rem; font-style: italic; color: #777; text-transform:none; position: relative; cursor: pointer}
#contact form .checkbox [type="checkbox"]:not(:checked) + label::before,
#contact form .checkbox [type="checkbox"]:checked + label::before {top:0.2rem; left: 0; width:0.85rem; height:0.85rem; border:1px solid #ccc; background-color:#fff; border-radius: .205em; box-shadow: inset 0 1px 3px rgba(0,0,0,0.106); transition: all .35s; content:""; position: absolute}
#contact form .checkbox [type="checkbox"]:not(:checked) + label::after,
#contact form .checkbox [type="checkbox"]:checked + label::after {top:0.75rem; left:0.12rem; font-size:11px; content:"✕"; position: absolute; line-height: 0; transition: all .25s}
#contact form .checkbox [type="checkbox"]:not(:checked) + label::after {opacity: 0; transform: scale(0) rotate(45deg)}
#contact form .checkbox [type="checkbox"]:checked + label::after {opacity: 1; transform: scale(1) rotate(0)}
#contact form .checkbox label {font-size:15px; letter-spacing: 0.035em}
#contact form .checkbox label a {border-bottom:1px dotted #555}
#contact form .checkbox label a:hover {border-bottom:1px solid #777}	
#contact form .checkbox .note {margin-top:1rem; padding-left:0.16rem; padding-bottom:0.8rem; font-size:14px; letter-spacing: 0.05em; line-height:1.6; color: #888; border-bottom:1px solid #ccc; text-transform:none; font-style: italic; text-align:left; position: relative; hyphens: auto; word-wrap: break-word}					
#contact form button.btn_mail {margin-top:1rem; font:normal 12px 'Lato'; letter-spacing:0.25em; line-height:0.9; transition: all 0.35s; border: none; outline: none; display: inline-flex; cursor: pointer; position: relative}
#contact form button.btn_mail::after {content: ''; position: absolute; z-index: -1; transition: all 0.35s}
#contact form button.btn_mail::before {font-family:'FontAwesome'; text-transform: none}
#contact form button.btn_sep {padding:0.9rem 2rem 0.9rem 5rem}
#contact form button.btn_sep::before {background-color:#d1c286; color:#fff; border-right: 2px solid #d1c286}
#contact form button.btn_sep:hover::before {background-color:#fff; color:#555; border-right: 2px solid #d1c286}
#contact form button.btn_submit {background-color:#fff; color:#555; border: 2px solid #d1c286}
#contact form button.btn_submit:hover {background-color:#d1c286; border: 2px solid #d1c286}
#contact form button.btn_submit::before {font-size:15px; line-height:2.6; width:2.8rem; height: 100%; left: 0; top: 0; position: absolute}
#contact form button.icon_send::before {content: "\f1d8"}	
@media all and (min-width:576px) {	
	#contact {padding:6.5rem 0 5rem}
	#contact h3 {font-size:120px}																						
	#contact p {margin-top:1.5rem}
	#contact p a {font-size:12px}
	#contact form {padding-top:2.5rem}
	#contact form button.btn_mail {font-size:13px}
	#contact form button.btn_sep {padding:0.9rem 2.5rem 0.9rem 5.5rem}
	#contact form .checkbox label {font-size:17px}
	#contact form .checkbox .note {font-size:16px}}
@media all and (min-width:767px) {	
	#contact form {padding-top:2.5rem}
	#contact form .col_2 {display: flex; justify-content: space-between}
	#contact form .col_2 > div {flex-basis: calc(50% - 1.6rem)}}					
@media all and (min-width:992px) {		
	#contact {padding:3.95rem 0 5rem}
	#contact h3 {padding-left: 0.395rem; font: normal 11px 'Lato'; letter-spacing: 0.1em; display:inline; text-align:left; text-transform:uppercase}	
	#contact h3 span {padding: 0 0.395rem; display: inline}
	#contact p {margin-top:0; display:inline; text-align:left; color:#333}
	#contact p a {font: normal 11px 'Lato'; letter-spacing: 0.125em; border-bottom:none}
	#contact p a:hover {border-bottom:1px solid #555}	
	#contact form {padding-top:1.35rem}
	#contact form input,
	#contact form textarea,
	#contact form .select select {font-size:22px}
	#contact form .checkbox {padding-top:0.5rem}
	#contact form .checkbox label,
	#contact form .select select option {font-size:19px}
	#contact form .checkbox .note {padding-bottom:0.75rem; margin-top:1.5rem; font-size:18px}
	#contact form .col_2 > div {flex-basis: calc(50% - 2rem)}
	#contact form button.btn_mail {margin-top:1.5rem}}
@media all and (min-width:1200px) {	
	#contact {padding:5rem 0 5.5rem; width:70%}
	#contact form {padding-top:1.5rem}}	
/* -------------------------------------------------------- Contact Info */
.contact-cours {padding:5rem 0; width: 100%; height:auto; background-color: #f7f5ef; background-size: cover; position: relative; overflow: hidden}
.contact-info .contactText {padding:1.5rem 0 2rem; background-color: #fff; opacity:0.9; width:100%; margin:0 auto; text-align: center}		
.contact-info .contactText > img {margin-top:0.7rem; width:50px; max-width:100%; height:auto}	
.contact-info .contactText h3 {margin-top:1rem; font:normal 10px 'Lato'; letter-spacing:0.1em; color: #777}
.contact-info .contactText address {margin-top:1rem; font-size:13px; letter-spacing:0.02em; line-height:1.7; color: #000; display: block; font-style: normal}
.contact-info .contactText address .tel {font-size:17px; letter-spacing: 0.1em}
.contact-info .contactText address .tel:hover,
.contact-info .contactText address .email:hover {border-bottom:1px solid #777}
.contact-info .wrapCol {width:100%; margin:1.5rem 0}
@media all and (min-width:576px) {	
	.contact-info .contactText {padding:2.5rem 0 3rem}		
	.contact-info .contactText > img {width:70px}	
	.contact-info .contactText h3 {font-size:15px}
	.contact-info .contactText address {font-size:17px; letter-spacing:0.05em}
	.contact-info .contactText address .tel {font-size:21px; line-height:2.5}
	.contact-info .wrapCol {margin:2.5rem 0}}
@media all and (min-width:992px) {					
	.contact-cours {padding:3.95rem 0}
	.contact-info .contactText {padding:2rem 0 1.75rem}
	.contact-info .contactText > img {margin-top:0; width:39px}							
	.contact-info .contactText h3 {margin-top:0.5rem; font-size:10px}
	.contact-info .contactText address {font-size:13px}
	.contact-info .contactText address .tel {top:-0.3rem; font-size:17px; line-height:0; color: #333; position:relative}
	.contact-info .wrapCol {margin: 0 1rem}}
@media all and (min-width:1200px) {		
	.contact-cours {padding:4.5rem 0}
	.contact-info .contactText {padding:2.5rem 0 2.25rem}		
	.contact-info .contactText address {font-size:16px}
	.contact-info .contactText address .tel {font-size:20px}																		
	.contact-info .wrapCol {margin: 0 2rem}}			
	
/* =================================================================== */
/* FOOTER - Section
/* =================================================================== */
	
footer {width:100%; background-color: rgba(244,243,241,0.5); z-index:1}
/* -------------------------------------------------------- section Contact */
.footer {padding-bottom:3.5rem; text-align:left; position: relative; z-index:5; clear: both}
.footer .contact {margin:2rem 0 3rem}
.footer .contact h2 span {text-align:center; display:block}
.footer .contact h2 span:nth-of-type(1) {font:normal 31px 'Playfair'; letter-spacing:0.025em; line-height:2.1; color:#3e3e3e}
.footer .contact h2 span:nth-of-type(2) {font:normal 20px 'Lato'; letter-spacing:0.25em; line-height:0; color:#aaa}
.footer .contact > div {padding-bottom:0.2em; margin:1.5rem auto 1.75rem; left:45%; transform: translateX(-55%); position: relative}
.footer .contact .inline-block {width:60px; display: inline-block; border-bottom:2px solid #d1c286}
.footer .contact .inline-block::after {margin-left:2rem; width:60px; border-bottom:2px solid #d1c286; display: block; content: ""}
.footer .contact p {text-align:justify}
.footer .contact p.karine {padding-bottom:2.5rem}
.footer a.btn {width:100%; text-align:center; display: table}
.footer h3 {padding-bottom:0.35rem}
.footer h3 span {font:normal 43px 'Signature'; letter-spacing:0.02em; text-transform:none}
.footer h3 .h3-one {margin-left:-0.25rem}
.footer h3 .h3-two {margin-left:-0.25rem}
.footer h3 .h3-three {margin-left:-0.5rem}
.footer ul {list-style: none}
.footer ul li {font:normal 12px 'Lato'; letter-spacing:0.075em; line-height:3; position: relative}
.footer ul li > a:hover {color: #d1c286}
.footer .links {padding-left:0.7rem}
.footer .phone {padding-left:0.7rem; padding-top:2.25rem; position:relative}
.footer .phone ul li {font:normal 19px 'Cormorant'; letter-spacing: 0.035em; line-height: 1.65; text-transform: none; hyphens: auto; word-wrap: break-word}
.footer .phone #phoneNumber {padding-top:0.6rem}
.footer .phone #phoneNumber > a {margin-left:0.2rem; display: inline-flex}	
.footer .phone #phoneNumber > a > span {font:normal 16px 'Lato'; letter-spacing:0.05em; transition: .7s}	
.footer .phone #phoneNumber > a > span::after {top:3px; padding-left:0.7rem; font-size:1.5rem; transition: .7s; color:#636363; content: "\2192"; position: relative}
.footer .phone #phoneNumber > a > span:hover,
.footer .phone #phoneNumber > a > span:hover::after {margin-left:0.5rem; transform: scale(1.1); color: #d1c286}	
@media all and (min-width:576px) {
	.footer .contact h2 span:nth-of-type(1) {font-size:37px; letter-spacing:0.05em}
	.footer .contact h2 span:nth-of-type(2) {font-size:22px}}	
@media all and (min-width:767px) {
	.footer .contact {margin-bottom:2.5rem}
	.footer .contact > div {margin:2.25rem auto 2.5rem}
	.footer h3 {padding-bottom:0}
	.footer .phone {padding-left:0; padding-top:0}
	.footer a.btn {margin-bottom:0.5rem}}		
@media all and (min-width:992px) {
	.footer {padding:4.5rem 0 3.5rem}
	.footer .contact {margin-top:-2.25rem; margin-bottom:0}	
	.footer .contact h2 {padding-bottom:2.35rem; width:340px; border-bottom:1px solid #d1c286}
	.footer .contact h2 span {text-align:left}
	.footer .contact h2 span:nth-of-type(1) {font-size:32px}
	.footer .contact > div,
	.footer .contact .inline-block,
	.footer .contact .inline-block::after  {display: none}
	.footer .contact p.karine {padding:1.25rem 0 1.5rem; width:340px; font-size:17px; letter-spacing:0; line-height:1.35}
	.footer h3 {margin-top:0rem}
	.footer ul {margin-top:0.5rem}
	.footer a.btn {padding:10px 0; margin:0 auto 0 0; width:180px; line-height:1.3}
	.footer a.btn span {font-size:12px}
	.footer a.btn i {top:11px}	
	.footer .links {padding-left:0}
	.footer .phone {padding-top:0}
	.footer .phone ul li {margin-top:0.3rem; font-size:17px; letter-spacing: 0.05em; line-height: 1.35}
	.footer .phone #phoneNumber {padding-top:0}
	.footer .phone #phoneNumber > a > span {font-size: 15px}}
@media all and (min-width:1200px) {	
	.footer {padding:4.5rem 0 3.95rem}
	.footer .contact h2,
	.footer .contact p.karine {width:380px}}
/* -------------------------------------------------------- section Copyright */	
.footerCopy {padding:1rem 0; margin:0 auto; color:#555; background-color:rgba(237,236,230,0.5)}						
.footerCopy p {font-size:12px; letter-spacing:0.1em; line-height:1.7; text-align:center; text-transform:uppercase}	
.footerCopy p .date {font-size:14px}		 
.footerCopy p .link {display:block}
.footerCopy p .link a,
.footerCopy p a {font-size:100%; border-bottom:1px dotted #777; text-transform:uppercase}	
@media all and (min-width:576px) {						
	.footerCopy p {font-size:13px; margin:0 auto; width:500px}	
	.footerCopy p .date {font-size:16px}
	.footerCopy p .link {display:inline-block}}
@media all and (min-width:992px) {
	.footerCopy {padding:0.75rem 0}
	.footerCopy p {font-size:12px; width:100%}}	
/* -------------------------------------------------------- Back to Top Button */
#back-to-top {bottom:3.5rem; right:0.5rem; width:36px; height:36px; transform:translateY(18px); border-radius:50%; background-color:#3f3f3f; color: #fff; border: none; transition: opacity 0.4s ease, visibility 0.4s ease, transform 0.4s ease; display: flex; align-items: center; justify-content: center; position: fixed; z-index: 998; cursor: pointer; opacity: 0; visibility: hidden}
#back-to-top i {margin-bottom:0.2rem; font-size:1rem}
#back-to-top i::after {display: inline-block; content: "\2191"; transition: all .15s ease-out}
#back-to-top i:hover::after {transform: translateY(-7px)}
#back-to-top.visible {opacity: 1; visibility: visible; transform: translateY(0)}
@media all and (min-width:576px) {	
	#back-to-top {width:50px; height:50px; transform:translateY(25px)}
	#back-to-top i {font-size:1.2rem}}
@media all and (min-width:992px) {	
	#back-to-top {bottom:1.5rem; right:1.5rem}}
	
/* =================================================================== */
/* Merci - Section
/* =================================================================== */	

.thank {display:flex; flex:1; flex-direction:column; align-items:center; justify-content:center; width:100%; height:100vh}
.thank .thank_svg {width:50px; position: relative; display:inline-block}
.thank .thankyou {text-align:center}
.thank .thankyou h3 {font:normal 50px 'Cormorant'}
.thank .thankyou p {color:#777}
.thank .thankyou p.redirect {margin-top:2rem; line-height:1.5; text-align:center}
.thank .thankyou p.redirect a {font-size:32px; border-bottom:none; color:#555}
.thank .thankyou p.redirect a em {font-size:16px; line-height:1.25; display:block}
.thank .thankyou p.redirect a em:hover,
.thank .thankyou p.redirect a:hover {border-bottom:1px dotted #d1c286; color:#d1c286}
.thank .thankyou p.redirect .numberCircle {margin:0.8rem 0.35rem 0; font-size:21px; color:#fff; border-radius:50%; width:3rem; height:3rem; line-height:2em; background-color:#d1c286; display: inline-block}																			
@media all and (min-width:992px) {	
	.thank {margin-top:-2rem}
	.thank .thankyou p.redirect {line-height:1.75}
	.thank .thankyou p.redirect a {font-size:20px; border-bottom:1px dotted #555; color:#333}
	.thank .thankyou p.redirect a em {font:normal 20px 'Cormorant'; letter-spacing:0; display:inline}
	.thank .thankyou p.redirect .numberCircle {margin:1.5rem 0.35rem 0}}	
		
/* =================================================================== */
/* FONT - Section
/* =================================================================== */		
									
.fa {display:inline-flex; font:normal normal normal 15px/1 FontAwesome; font-size:inherit; text-rendering:auto; -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale}
.fa-volume-control-phone::before {content: "\f2a0"}
.fa-facebook-f::before {content: "\f09a"}
.fa-instagram::before {content: "\f16d"}
.fa-linkedin::before {content: "\f0e1"}	
.fa-envelope::before {content:"\f0e0"}
.fa-arrow::before {content:"\2192"}
.fa-comment::before {content: "\f075"; color:#ece9e0; text-shadow: -1px 0 #d1c286, 0 1px #d1c286, 1px 0 #d1c286, 0 -1px #d1c286}
.fa-checks::before {content: "\f00c"; color:#f2f2f2; text-shadow: -1px 0 #d1c286, 0 1px #d1c286, 1px 0 #d1c286, 0 -1px #d1c286}