html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
	display: block;
}

:focus {
    outline: -webkit-focus-ring-color auto 0px !important;
}

@font-face {
	font-family: "Abel";
	src: url("/fonts/Abel-Regular.ttf") format("truetype");
}

@font-face {
	font-family: "Montserrat Bold";
	src: url("/fonts/Montserrat-Bold.ttf") format("truetype");
}

@font-face {
	font-family: "Montserrat Italic";
	src: url("/fonts/Montserrat-Italic.ttf") format("truetype");
}

@font-face {
	font-family: "Montserrat Regular";
	src: url("/fonts/Montserrat-Regular.ttf") format("truetype");
}

@font-face {
	font-family: "Montserrat Light";
	src: url("/fonts/Montserrat-Light.ttf") format("truetype");
}

@font-face {
	font-family: "Onelove";
	src: url("/fonts/onelove.otf") format("truetype");
}

body {
	line-height: 1;
	font-family: 'Montserrat Regular';
	font-size: 1rem;
	color: #004980;
	margin: 0;
	padding: 0;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
div:after,
header:after,
footer:after,
nav:after,
ul:after {
    display: block;
    content: "";
    visibility: hidden;
    height: 0px;
    clear: both;
}
div, nav, header {
	box-sizing: border-box;
}

p {
	line-height: 1.4;
	margin: 10px 0;
	color: #000;
}

a {
	text-decoration: none;
	color: inherit;
}

strong {
	font-family: Montserrat Bold;
}

.text-center {
	text-align: center !important;
}

button {
	appearance: none;
	-moz-appearance: none;
	-webkit-appearance: none;
}

.mt-20 { margin-top: 20px !important; }
.mt-30 { margin-top: 30px !important; }
.mt-40 { margin-top: 40px !important; }

/* ------------------ RESET END --------------- */

.row-header {
	position: absolute;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 173px;
	z-index: 8;
}

header {
	position: absolute;
	top: 0px;
	left: 50%;
	transform: translateX(-50%);
	width: 100%;
	max-width: 1260px;
	margin: 0 auto;
	padding: 45px 10px 10px;
	z-index: 9;
}

.logo-header {
	position: relative;
	float: left;
	width: 265px;
	margin-right: 175px;
}

.row {
	position: relative;
	height: auto;
	width: auto
}

nav {
	position: relative;
	float: left;
	margin-top: 30px;
}

nav ul {
	list-style: none;
}

nav ul li {
	position: relative;
	display: inline-block;
	vertical-align: top;
	text-align: center;
	font-family: Montserrat Bold;
	color: #FFF;
	padding: 10px 0 5px;
	cursor: pointer;
	transition: all .3s;
	margin: 0 20px;
	border-bottom: transparent solid 2px;
}

nav ul li:hover,
nav ul li.active {
	border-bottom: #fff solid 2px;
}

nav ul li.text-red:hover {
	border-bottom: #b81a5d solid 2px;
}

footer {
	position: relative;
	padding: 20px;
	background: #004980;
	color: #fff;
}

.col-footer {
	position: relative;
	float: left;
	text-align: left;
	padding: 10.5px 50px 10.5px 0px;
}

.container {
	position: relative;
	max-width: 1260px;
	margin: 0 auto;
}

.top-banner {
	position: relative;
	background-position: center fixed;
	background-size: cover;
	background-repeat: no-repeat;
	padding-bottom: 150px;
	background-attachment: fixed;
}

.content-error-banner {
	position: absolute;
	top: 50%;
	left: 50%;
	min-width: 600px;
	height: auto;
	transform: translate(-50%, -50%);
	text-align: left;
}

.h1-error {
	font-family: Montserrat Bold;
	font-size: 9rem;
	color: #fff;
	line-height: 1;
}

.h2-error {
	font-family: Montserrat Regular;
	font-size: 1.8rem;
	color: #fff;
	line-height: 1.4;
}

.content-top-banner {
	position: absolute;
	top: 50%;
	left: 50%;
	min-width: 1260px;
	height: auto;
	transform: translate(-50%, -50%);
	margin: 0 auto;
}

.h1-top-banner {
	position: relative;
	font-family: Abel;
	font-size: 3rem;
	color: #FFF;
	text-transform: uppercase;
	margin-bottom: 15px;
}

.h1-top-banner.evenements {
	font-size: 4.7rem;
}

.ss-titre-banner {
	font-size: 6rem;
}

.h2-top-banner {
	position: relative;
	font-family: Montserrat Regular;
	font-size: 2rem;
	color: #FFF;
	text-align: left;
	background-image: url('../img/loc-jaune.svg');
	background-position: center left;
	background-size: 38px auto;
	background-repeat: no-repeat;
	padding: 12px 0 12px 60px;
}

p.text-top-banner {
	font-family: Montserrat Regular;
	font-size: 1.4rem;
	color: #FFF;
}

button.btn-beige {
	position: relative;
	display: inline-block;
	font-family: Montserrat Bold;
	text-transform: uppercase;
	color: #ecc4aa;
	text-align: center;
	border: #ecc4aa solid 1px;
	border-radius: 25px;
	padding: 10px 20px;
	background:  transparent;
	margin-right: 20px;
	cursor: pointer;
	transition: all .3s;
}

button.btn-beige:hover {
	background: #ecc4aa;
	color: #004980;
}

button.btn-blue {
	position: relative;
	display: inline-block;
	font-family: Montserrat Bold;
	text-transform: uppercase;
	color: #004980;
	text-align: center;
	border: #004980 solid 1px;
	border-radius: 25px;
	padding: 10px 20px;
	background:  transparent;
	margin-right: 20px;
	cursor: pointer;
	transition: all .3s;
}

button.btn-blue:hover {
	background: #004980;
	color: #FFF;
}

button.btn-red {
	position: relative;
	display: inline-block;
	font-family: Montserrat Bold;
	text-transform: uppercase;
	color: #B81A5D;
	text-align: center;
	border: #B81A5D solid 1px;
	border-radius: 25px;
	padding: 10px 20px;
	background:  transparent;
	margin-right: 20px;
	cursor: pointer;
	transition: all .3s;
}

button.btn-red:hover {
	background: #B81A5D;
	color: #FFF;
}

.box-rs-top-banner {
	position: absolute;
	bottom: -100px;
	right: 0px;
	z-index: 2;
}

.rs-top-banner {
	position: relative;
	text-align: center;
	margin-bottom: 10px;
	cursor: pointer;
	transition: all .3s;
}

.rs-top-banner:hover {
	opacity: .7;
}

.container-borded {
	position: relative;
	max-width: 1260px;
	margin: -100px auto 0;
	background: #FFF;
	border-radius: 40px;
	min-height: 450px;
	padding: 80px;
	z-index: 3;
}

.container-full-width {
	position: relative;
	width: 100%;
}

.h1-red {
	position: relative;
	font-family: Abel;
	font-size: 2.5rem;
	color: #B81A5D;
	text-align: center;
	margin-bottom: 50px;
}

.row-studio-blue {
	min-height: 759px;
	background-image: url('../img/bg-blue-studio.svg');
	background-position: -30% top;
	background-repeat: no-repeat;
	background-size: 50% auto;
	margin-top: -150px;
	padding-top: 150px;
}

.col-2 {
	position: relative;
	float: left;
	width: 50%;
	min-height: 1px;
	overflow: hidden;
}

.content-v-center {
	position: absolute;
	top: 50%;
	right: 0;
	transform: translateY(-50%);
}

.content-v-center-left {
	padding-right: 80px;
}

.content-v-center-right {
	padding-left: 80px;
}

.h1-classic {
	position: relative;
	text-align: left;
	font-family: Abel;
	font-size: 6rem;
	text-transform: uppercase;
	color: #004980;
}

.sous-titre {
	font-family: Abel;
	text-transform: none;
	color: #B81A5D;
	font-size: 2.2rem;
	line-height: 1;
}

.row-studio-pink {
	min-height: 759px;
	background-image: url('../img/bg-pink-studio.svg');
	background-position: 130% top;
	background-repeat: no-repeat;
	background-size: 50% auto;
	padding-bottom: 100px;
}

.row-video-home {
	margin-bottom: 100px;
}

.row-orange {
	background: linear-gradient(#ecc4aa, transparent);
}

.row-blue-gradient {
	background: linear-gradient(#b3c9d9, transparent);
}

.sous-titre-bleu {
	position: relative;
	text-align: center;
	color: #004980;
	font-family: Montserrat Bold;
	font-size: 1.4rem;
	margin-top: 5px;
}

ul.materiel {
	list-style: none;
	position: relative;
	float: none;
	padding-left: 30px;
	margin: 50px auto;
	width: 800px;
}

ul.materiel li {
	position: relative;
	text-align: left;
	margin-bottom: 15px;
	font-family: Montserrat Regular;
	color: #000;
	/*list-style-image: url("../img/check-materiels.svg");*/
	background-image: url("../img/check-materiels.svg");
	background-repeat: no-repeat;
	background-position: left center;
	background-size: 16px;
	padding-left: 30px;
}

.col-3 {
	position: relative;
	float: left;
	width: 33.33%;
}

.icon-coordo {
	position: relative;
	display: inline-block;
	height: 60px;
	width: 45px;
	text-align: center;
	padding: 12px 0px;
	vertical-align: top;
}

.icon-coordo img {
	height: 35px;
}

.content-coordo {
	position: relative;
	display: inline-block;
	font-family: Montserrat Bold;
	text-align: left;
	padding: 6px 0px 6px 10px;
	line-height: 1.5;
	vertical-align: top;
}

.encart-cours {
	position: relative;
	display: inline-block;
	width: 50%;
	height: auto;
	min-height: 160px;
	vertical-align: top;
	margin: 20px 0px;
}

.icon-cours {
	position: relative;
	float: left;
	height: 110px;
	width: 110px;
	text-align: left;
}

.icon-cours img {
	height: 110px;
}

.content-cours {
	position: relative;
	float: left;
	font-family: Montserrat Regular;
	color: #000;
	padding: 29px 0 29px 20px;
	line-height: 1.5;
	width: 440px;
}

.mb-40 {
	margin-bottom: 40px;
}

span.italic {
	font-family: Montserrat Regular;
	font-style: italic;
	color: #000;
}

.row-red {
	background: url('../img/line-red.jpg') repeat-x center center;
}

.row-blue {
	background: url('../img/line-blue.jpg') repeat-x center center;
}

.h2-tarifs {
	position: relative;
	display: inline-block;
	padding: 10px 20px;
	text-align: center;
	color: #FFF;
	font-family: Montserrat Bold;
	font-size: 1.5rem;
	text-transform: uppercase;
}

.bg-red {
	background: #b81a5d;
}

.bg-blue {
	background: #004980;
}

.text-red {
	color: #b81a5d !important;
}

.text-blue {
	color: #004980 !important;
}

.col-left {
	padding-right: 25px;
}

.col-right {
	padding-left: 25px;
}

.table-tarifs {
	position: relative;
	width: auto;
	border: #b81a5d solid 1px;
	text-transform: uppercase;
	text-align: center;
	margin: 20px 0;
}

.table-blue {
	border: #004980 solid 1px;
}

.line-table {
	position: relative;
}

.col-table {
	position: relative;
	float: left;
	padding: 15px;
	font-family: Montserrat Bold;
	color: #000;
}

.col-table.entete {
	color: #b81a5d;
	background: rgba(184, 26, 93, .1);
}

.col-table.entete-blue {
	color: #004980;
	background: rgb(0, 73, 128, .1);
}

.event-img {
	position: relative;
	float: left;
	height: 390px;
	width: 390px;
	text-align: center;
}

.event-img img {
	max-height: 100%;
	width:  auto;
}

.event-content-box {
	position: relative;
	float: left;
	width: 660px;
	min-height: 390px;
	margin-left: 50px;
}

.event-content {
	position: absolute;
	top: 50%;
	left: 0;
	width: 100%;
	transform: translateY(-50%);
}

.h2-small {
	position: relative;
	font-family: Abel;
	font-size: 3.1rem;
	color: #004980;
	text-align: left;
	margin-bottom: 20px;
	text-transform: uppercase;
}

.h3-small-red {
	position: relative;
	text-align: left;
	font-family: Montserrat Bold;
	color: #b81a5d;
	margin-bottom: 20px;
}

ul.list-classic {
	list-style: inside;
	color: #000;
}

ul.list-classic li {
	margin-bottom: 10px;
}

.contact-form {
	position: relative;
	margin-top: 100px;
}

.line-form {
	position: relative;
	margin-bottom: 15px;
}

input[type='text'],
input[type='email'] {
	position: relative;
	width: 100%;
	box-sizing: border-box;
	border: none;
	border-bottom: #004980 solid 1px;
	padding: 10px 0;
	background: #FFF;
	font-family: Montserrat Regular;
  font-size: 1rem;
}

textarea {
	position: relative;
	width: 100%;
	height: 200px;
	box-sizing: border-box;
	border: none;
	border-bottom: #004980 solid 1px;
	padding: 10px 0;
	background: #FFF;
	font-family: Montserrat Regular;
  font-size: 1rem;
}

::placeholder {
  color: #ccc;
  font-family: Montserrat Regular;
  font-size: 1rem;
}

input[type="submit"] {
	position: relative;
	display: inline-block;
	font-family: Montserrat Bold;
	text-transform: uppercase;
	color: #004980;
	text-align: center;
	border: #004980 solid 1px;
	border-radius: 25px;
	padding: 10px 40px;
	background:  transparent;
	margin-right: 20px;
	cursor: pointer;
	transition: all .3s;
}

input[type="submit"]:hover {
	background: #004980;
	color: #FFF;
}

input[type="checkbox"] {
	display: none;
}
input[type="checkbox"] + label {
	line-height: 1.2;
	cursor: pointer;
	font-size: .8rem;
	position: absolute;
	top:  0px;
	left: 30px;
}
input[type="checkbox"] + label::before {
	content:'';
	border: 1px solid #013347;
	margin-right: 10px;
	padding: 0 9px;
	margin-left: -30px;
}
input[type="checkbox"]:checked + label::before {
  	/*background-color: #c2a77a;*/
  	content:'✔';
 	padding: 0 3.9px;
 	margin-right: 10px;
 	color: #013347 !important;
}

p.small {
	max-width: 650px;
	margin: 10px auto;
}

.bt-top {
	display: none;
	position: fixed;
	bottom: 90px;
	right: 20px;
	height: 40px;
	width: 40px;
	text-align: center;
	z-index: 9;
	cursor: pointer;
}

.bloc-text-col-home {
	width: 630px;
}

.col-moyens-paiement {
	position: relative;
	display: inline-block;
	vertical-align: top;
	text-align: left;
	color: #004980;
	font-family: Montserrat Bold;
	padding: 20px 0px;
}

.height-725 {
	height: 725px;
}

.height-790 {
	height: 790px;
}

.credits {
	transition: all .3s;
	padding-bottom: 5px;
}

.credits:hover {
	padding-bottom:  5px;
	border-bottom: #fff solid 2px;
}

.nav-mobile {
	display: none;
}

.menu-mobile {
	display: none;
}

.ss-titre-blue {
	font-size: 3.1rem;
}

.line-height-60 {
	line-height: 60px;
}

.line-form-cgv {
	height: 35px;
}

.only-on-mobile {
	display: none;
}

.msg {
	position: relative;
	padding: 20px;
	margin-bottom: 30px;
	text-align: center;
	color: #FFF;
}

.msg.ok {
	background: rgba(63, 191, 63, .6);
	border: #3FBF3F solid 1px;
}

.msg.ko {
	background: rgb(191, 63, 63, .6);
	border: #BF3F3F solid 1px;
}

.cookieinfo {
	color: #FFF !important;
}

.cookieinfo-close {
	background: #B81A5D !important;
	color: #FFF !important;
}

.row-evenements {
	position: relative;
}

.bg-blue-evenements {
	position: absolute;
	top: 400px;
	left: 0px;
	background-image:  url('../img/bg-blue-studio.svg'); 
	background-repeat: no-repeat;
	background-position: top right;
	background-size: cover;
	height: 700px;
	width: 575px;
	z-index: 3;
}

.bg-pink-evenements {
	position: absolute;
	bottom: 50px;
	right: 0;
	background-image:  url('../img/bg-pink-studio.svg'); 
	background-repeat: no-repeat;
	background-position: top left;
	background-size: cover;
	height: 700px;
	width: 500px;
}

.col-video {
	padding: 10px;
}

.img-tarif {
	position: relative;
	display: inline-block;
	width: 48%;
	margin: 1%;
}

.img-tarif-teen {
	position: relative;
	width: 100%;
	margin-bottom: 15px;
}

.col-img {
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
}


@media (max-width: 1500px) {

	body {
		width: 100%;
	}

	header {
		padding: 45px 20px 10px;
	}

	.content-top-banner {
		width: 90%;
		min-width: 0;
	}

	.top-banner {
		background-position: 45% center;
	}

	.container-borded {
		max-width: 90%;
	}

	.content-v-center {
		padding: 0 40px;
	}

	.bloc-text-col-home {
		width: 100%;
	}

	.col-footer {
		padding: 10.5px 50px 10.5px 0px;
		font-size: .8rem;
	}

	.event-img {
		width: 35%;
		height: 300px;
	}

	.event-img img {
		max-width: 100%;
	}

	.event-content-box {
		width: 60%;
		margin-left: 5%;
		min-height: 300px;
	}

	.height-725 {
		height: 610px;
	}

	.height-790 {
		height: 610px;
	}

	.max-100 {
		max-height: 100%;
	}

	.inverse {
		transform:scaleX(-1);
	}

}












@media (max-width: 850px) {

	nav {
		display: none;
	}

	.row-header {
		height: 105px;
	}

	header {
		padding: 20px;
	}

	.nav-mobile {
		display: block;
		position: relative;
		float: right;
		padding: 14px 20px;
	}

	.logo-header {
		margin-right: 0px;
		width: 115px;
	}

	.logo-header img {
		width: 100%;
		height: auto;
	}

	.item-nav-mobile {
		position: relative;
		float: left;
		font-family: Montserrat Bold;
		padding: 10px 0 5px;
		color: #fff;
	}

	.mb-20 {
		margin-bottom: 20px;
	}

	.container-borded {
		padding: 20px 30px;
	}

	.row-studio-blue {
		margin-top: -40px;
		padding-top: 25px;
		background-size: 130%;
    	background-position: center -75px;
	}

	.row-studio-pink {
		padding-bottom: 50px;
	}

	.col-2 {
		float: none;
		width: auto;
	}

	.col-3 {
		float: none;
		width: 80%;
		margin: 10px auto;
	}

	.col-3.text-center {
		text-align: left !important;
	}

	.top-banner {
		background-position: 65% center;
	}

	.top-banner-home-mobile {
		background-image: url('../img/home-banner-mobile.jpg') !important;
	}

	.top-banner-planning-mobile {
		background-image: url('../img/planning-banner-mobile.jpg') !important;
	}

	.top-banner-evenements-mobile {
		background-image: url('../img/evenements-banner-mobile.jpg') !important;
	}

	.top-banner-contact-mobile {
		background-image: url('../img/contact-banner-mobile.jpg') !important;
	}

	.h1-top-banner {
		font-size: 2rem;
	}

	.h1-top-banner.evenements {
		font-size: 2rem;
	}

	.ss-titre-banner {
		font-size: 4rem;
	}

	.h2-top-banner {
	    position: relative;
	    font-family: Montserrat Regular;
	    font-size: 1.5rem;
	    color: #FFF;
	    text-align: left;
	    background-image: url(../img/loc-jaune.svg);
	    background-position: center left;
	    background-size: 25px auto;
	    background-repeat: no-repeat;
	    padding: 12px 0 12px 30px;
	}

	p.text-top-banner {
		font-size: 1.2rem;
	}

	.content-top-banner {
		top: 45%;
	}

	.menu-mobile {
		display: none;
		position: fixed;
		top: 0px;
		left: 0px;
		width: 100%;
		height: 100%;
		background: #004980;
		z-index: 9;
		padding: 20px;
	}

	.content-menu-mobile {
		position: absolute;
		top: 50%;
		width: 88%;
		transform: translateY(-50%);
	}

	.logo-menu-mobile {
		position: relative;
		width: auto;
		text-align: center;
		margin-bottom: 50px;
	}

	.item-menu-mobile {
		position: relative;
		font-family: Montserrat Bold;
		color: #fff;
		padding: 10px 0;
		text-align: center;
	}

	.close-menu {
		position: absolute;
		top: 20px;
		right: 20px;
		text-align: center;
		font-size: 1.8rem;
		color: #FFF;
		z-index: 999;
	}

	ul.materiel {
		width: 100%;
		box-sizing: border-box;
		padding-right: 20px;
	}

	.h1-classic {
		font-size: 4rem;
	}

	.col-perrine {
		height: 790px !important;
	}

	.h1-red {
		font-size: 2rem;
	}

	.mt-0 {
		margin-top:  0px !important;
	}

	.logo-home-color {
		margin: 50px auto !important;
		width: 75% !important;
	}

	.icon-coordo {
		width: 35px;
	}

	.icon-coordo img {
		max-width: 100%;
	}

	.content-coordo {
		width: 230px;
	}

	.encart-cours {
		display: block;
		width: 100%;
	}

	.icon-cours {
		float: none;
		width: 100%;
		text-align: center;
		height: auto;
	}

	.icon-cours img {
		width: 120px;
		height: auto;
	}

	.content-cours {
		float: none;
		width: 100%;
		padding: 10px 0px;
		text-align: center;
	}

	.ss-titre-blue {
		font-size: 2rem;
		line-height: 1;
	}

	.line-height-60 {
		line-height: 40px;
	}

	.container {
		padding: 0 20px;
	}

	.pt-40 {
		padding-top: 40px !important;
	}

	.img-on-mobile {
		width: 100%;
	}

	.col-moyens-paiement {
		display: block;
		width: 100% !important;
		text-align: left;
		margin: 0 auto 30px auto;
	}

	.type-paiement {
		width: 75% !important;
	}

	.text-center-on-mobile {
		text-align: center;
	}

	.event-img {
		float: none;
		width: auto;
		text-align: center;
	}

	.event-content-box {
		float: none;
		height: auto;
		width: auto;
	}

	.event-content {
		position: relative;
		width: auto;
		height: auto;
		top: 0px;
		transform: none;
	}

	.top-banner-80 {
		background-position: 80% center;
	}

	.line-form-cgv {
		height: 160px;
	}

	.col-left {
		padding-right: 0px;
	}

	.col-right {
		padding-left: 0px;
	}

	.min-height-80 {
		min-height: 80px;
	}

	.min-height-100 {
		min-height: 100px;
	}

	.min-height-130 {
		min-height: 130px;
	}

	.hide-on-mobile {
		display: none !important;
	}

	.only-on-mobile {
		display: block;
	}

	.mr-0 {
		margin-right: 0px !important;
	}

	.col-footer {
		float: none !important;
		text-align: center !important;
		padding: 10.5px 0px !important;
		line-height: 1.5;
	}

	.bt-top {
		bottom: 35px;
	}

	.bg-blue-evenements {
		width: auto;
	}

	.img-tarif {
		position: relative;
		display: inline-block;
		width: 100%;
		margin: 0 0 20px;
	}

}
