

h1,h2,h3,h4,h5,h6,p,form,ul,li { padding:0px; margin:0px; }
html,body { width:100%; height:100%; padding:0px; margin:0px; }
* { outline:none !important; }

body {
	font-family:'Open Sans', sans-serif; 
	font-size:16px;
	min-width:320px;
}

.visible-mobile { display:none; }

.container { width:100%; min-width:320px; max-width:1100px; overflow:visible; }

.btn-contact { display:inline-block; padding:0px 30px; height:48px; line-height:48px; background-color:#565f65; color:#fff !important; text-transform:uppercase; text-decoration:none !important; font-size:18px; }

.img-slider { position:relative; display:block; overflow:hidden; width:100%; height:auto; text-align:center; }
.img-slider img { /* height:100%; width:auto; margin:auto; */ }
[data-featherlight] { cursor:pointer; }

.navbar { position:fixed; left:0px; top:0px; right:0px; margin:0px; padding:0px; z-index:100; background-color:#fff; /* rgba(0,0,0,0.7); */ color:#333; border-radius:0; border:none; /* border-bottom:solid 1px #becccf; */ box-shadow:0px 0px 10px #666; }
.navbar .container { position:relative; overflow:visible; padding-left:0px; padding-right:0px; display:table; table-layout:fixed; }
.navbar .navbar-logo { display:table-cell; width:370px; height:87px; line-height:87px; vertical-align:middle; text-align:left; z-index:102; background-color:#fff; padding-left:20px; }
.navbar .navbar-logo .logo { max-width:100%; height:auto; max-height:100%; }
.navbar .navbar-logo #logo-oberkampf { display:none; }
.navbar .navbar-logo #logo-promoteurs { display:block; }
.navbar .navbar-title { display:none; }
.navbar .navbar-buttons { display:table-cell; width:100%; text-align:right; padding-right:20px; z-index:101; white-space:nowrap; height:87px; line-height:87px; vertical-align:middle; }
.navbar .navbar-buttons a { position:relative; display:inline-block; height:60px; line-height:60px; padding:0px 15px; text-decoration:none; text-transform:uppercase; color:#231f20; text-decoration:none; font-family:'Open Sans'; font-size:15px; font-weight:bold; }
.navbar .navbar-buttons a.active span { padding-bottom:5px; border-bottom:solid 4px #a29681; }
.navbar .navbar-buttons img { margin:auto; display:none; }
.navbar .navbar-actions { display:none; }
.navbar .btn-menu { /* position:absolute; top:0px; right:0px; */ width:87px; height:87px; line-height:87px; text-align:center; vertical-align:middle; font-size:32px; background-color:#fff; color:#000; border:none; border-radius:0; display:none; }

header .img-slider { width:100%; /* height:0px; padding-bottom:33.333333333%; margin-top:87px; */ height:auto; background-color:#fff; text-align:center; }
header .img-slider img { height:auto; width:auto; max-width:100%; max-height:100%; margin:auto; }
header .baseline { background-color:#a29681; color:#fff; font-family:'ITC Avant Garde Std Md'; font-size:20px; line-height:1.4em; text-align:center; padding:20px 0px; }
header .baseline strong { display:block; font-size:1.4em; }
header .baseline a { text-decoration:underline !important; color:#fff !important; }
header #logo-oberkampf { position:absolute; left:50%; top:120px; margin-left:-85px; }
header div.highlight { display:block; overflow:hidden; width:360px; font-family:'ITC Avant Garde Std Bold'; font-size:18px; color:#fff; text-shadow:0px 1px 4px rgba(0,0,0,0.9); line-height:1.3em; position:absolute; top:160px; left:50%; margin-left:120px; }

header .patch-offre {
	position: absolute;
    width: 11.5vw;
    top: 14.9vw;
    left: 38vw;
}

section { position:relative; width:100%; overflow:visible; padding:40px 0px 40px 0px; margin-bottom:0px; overflow:hidden; }
section div.container { /* margin:30px auto; */ /* display:table; */ table-layout:fixed; }
section div.container .container-column { display:table-cell; width:50%; height:100%; padding:20px; vertical-align:middle; }
div.container .container-column img.responsive { width:100%; height:auto; }
section div.content { display:table; table-layout:fixed; width:100%; height:100%; padding:0px; margin-bottom:30px; }
section div.content .content-col { display:table-cell; width:50%; height:100%; padding:0px; vertical-align:middle; box-sizing:border-box; }
section div.content div.content-col > div { width:100%; }
section div.content div.content-col:first-child { padding-right:15px; }
section div.content div.content-col:last-child { padding-left:15px; }
section h1 { font-size:30px; color:#565f65; margin-bottom:40px; font-weight:bold; }
section h1 span { padding-bottom:5px; border-bottom:solid 4px #565f65; }
section h2 { font-size:20px; color:#231f20; margin-bottom:20px; font-weight:bold; }
section p { margin-bottom:40px; }
section ul { padding:0px 0px 0px 20px; }
section ul li { margin-bottom:15px; }

footer { white-space:nowrap; padding:0px; margin-bottom:30px; }
footer.credits { background-color:#ececeb; margin-top:30px; }
footer.credits .container { padding:0px 20px; }
footer.credits div.phone { display:inline-block; width:50%; height:128px; line-height:128px; text-align:left; font-family:'ITC Avant Garde Std Demi'; font-size:30px; color:#a29681; vertical-align:top; }
footer.credits div.phone a { color:#a29681; text-decoration:none; }
footer.credits div.logo { display:inline-block; width:50%; height:128px; line-height:128px; text-align:right; }
footer.credits div.logo img { display:inline-block; }
footer.credits div.logo div.promoteurs { display:inline-block; font-family:'ITC Avant Garde Std Bk'; font-size:14px; color:#231f20; text-align:center; line-height:1; vertical-align:middle; }
footer.credits div.logo div.promoteurs span { display:block; margin-bottom:5px; }
footer.mentions { font-family:Arial; font-size:12px; color:#231f20; text-align:center; white-space:normal; }
footer.mentions a { color:#231f20 !important; text-decoration:underline !important; }
footer.mentions p { display:block; overflow:hidden; text-align:left; margin-bottom:20px; font-size:11px; color:#231f20;  }
#mentions-legales { background-color:#fff; padding:30px 30px; font-size:11px; color:#231f20; }
#mentions-legales h2 { font-size:20px; margin-bottom:20px; }
#mentions-legales p { margin-bottom:20px; font-size: 1vw;}
.mentions-lightbox { display:none; }

#error-message { position:fixed; left:0px; bottom:0px; right:0px; line-height:1em; overflow:hidden; z-index:999999; text-align:center; font-size:18px; font-weight:300; background-color:#c70f12; color:#fff; padding:20px; transform:translateY(100%); opacity:0; transition:all 0.5s ease; }
#error-message.open { transform:translateY(0); opacity:1; }

.slideshow { position:relative; display:block; overflow:hidden; }
.slideshow .slides-pagination { display:block; overflow:hidden; width:100%; height:30px; line-height:30px; z-index:11; text-align:center; }
.slideshow .slides-pagination a { display:inline-block; width:16px; height:16px; vertical-align:middle; margin:0px 10px; border-radius:50%; border:solid 2px #a29681; background-color:transparent; cursor:default; }
.slideshow .slides-pagination a.current { background-color:#a29681; }

.featherlight .featherlight-content { padding:40px 10px 10px 10px; border-radius:8px; }
.featherlight .featherlight-close-icon { right:20px; top:10px; background-color:#fff; }
.featherlight .featherlight-previous span { display:none; }
.featherlight .featherlight-next span { display:none; }

.animate { transition:all 1s ease; opacity:0; }
.animate.animate-in-view { opacity:1; }
.animate-from-left { transform:translateX(-100%); }
.animate-from-left.animate-in-view { transform:translateX(0); }
.animate-from-right { transform:translateX(100%); }
.animate-from-right.animate-in-view { transform:translateX(0); }
.animate-from-top { transform:translateY(-100%); }
.animate-from-top.animate-in-view { transform:translateY(0); }
.animate-from-bottom { transform:translateY(100%); }
.animate-from-bottom.animate-in-view { transform:translateY(0); }

.visuel { display:block; overflow:hidden; width:100%; white-space:nowrap; }
.visuel img { display:inline; float:left; width:50%; vertical-align:top; }
.visuel img:first-child { width:100%; display:block; margin-bottom:5px; }
.visuel#visuel-prestations1 img { width:48.33948339483395%; }
.visuel#visuel-prestations1 img:first-child { width:100% !important; }
.visuel#visuel-prestations1 img:last-child { width:50.7380073800738%; float:right; }

.sticky-bar { position:fixed; left:0px; bottom:0px; right:0px; padding:12px 10px; text-align:center; overflow:hidden; background-color:#a29681; color:#fff !important; font-size:16px; font-weight:bold; text-decoration:none !important; display:none; z-index:90; }


/****** Quartier ******/
section#quartier {  }


/****** Résidence ******/
section#residence { background-color:#ececeb; padding-bottom:30px; }
section#residence h1 { color:#a29681; text-align:center; }
section#residence h1 span { border-bottom:solid 4px #a29681; }
section#residence div.content-col { text-align:center; /* padding:0px 0px 20px 0px; */ vertical-align:top; /* margin-left:0px; */ }
section#residence div.content-col > div { width:100%; height:100%; background-color:#fff; border:solid 1px #fff; }
section#residence div.content-col > div p { padding:0px 20px; margin-bottom:30px; }
section#residence div.content-col:first-child { padding-right:15px; }
section#residence div.content-col:last-child { padding-left:15px; }
section#residence div.content-col p { /* padding:20px; */ }
section#residence div.content-col h2 { margin:30px 0px; }
section#residence div.content-col .btn-contact { background-color:#a29681; margin-bottom:30px; }


/****** Appartements ******/
section#appartements {  }
section#appartements h1 {  }
section#appartements .text-2 h2 { text-align:right !important; }
section#appartements .text-2 p { text-align:right !important; padding-left:30px; }
section#appartements .prix { padding:30px; background-color:#ececeb; text-align:center; overflow:hidden; margin-top:20px; }
section#appartements .prix h4 { font-size:20px; font-weight:bold; margin-bottom:30px; text-align:center !important; }
section#appartements .prix ul { list-style-type:none; padding:0px; text-align:center; margin-bottom:30px; }
section#appartements .prix ul li { margin-bottom:0px; padding:5px 10px; }
section#appartements .prix ul li:nth-child(odd) { background-color:#fff; }
section#appartements .prix th { text-align:center; font-size:12px; }
section#appartements .prix td { text-align:center; font-size:12px; }
section#appartements .prix .mentions { font-size:12px; font-style:italic; text-align:left !important; margin-bottom:20px; }
section#appartements .prix h2 { text-align:center !important; }


/****** Prestations ******/
section#prestations { background-color:#ececeb; }
section#prestations h1 { color:#a29681; }
section#prestations h1 span { border-bottom:solid 4px #a29681; }
section#prestations div.content div.content-col { background-color:#fff; padding:30px; vertical-align:middle; margin:0px; }
section#prestations div.content div.content-col.visual { padding:5px !important; }
/* section#prestations div.content div.content-col:first-child { vertical-align:top; }
section#prestations div.content div.content-col:last-child { text-align:right; }
section#prestations div.content div.content-col:last-child h2 { text-align:right; } */
section#prestations div.content-col h2 { margin:0px 0px 20px 0px; }
section#prestations ul li { margin-bottom:10px; }
section#prestations #prestations-interieurs div.content-col:first-child { padding:30px !important; vertical-align:top; }
section#prestations #prestations-interieurs div.content-col:last-child { padding:5px !important; }
section#prestations #prestations-entrees div.content-col:first-child { padding:5px !important; }
section#prestations #prestations-entrees div.content-col:last-child { padding:30px !important; text-align:right; }
section#prestations #prestations-entrees p { padding-left:40px; }


/****** Évènement + carte ******/
section#evenement {  }
section#evenement div.content { display:block; margin-left:auto; margin-right:auto; }
section#evenement div.content.map { width:100%; height:0px; padding-bottom:50%; overflow:hidden; margin-bottom:30px; }
section#evenement div.content.lancement { max-width:600px; background-color:#565f65; color:#fff; padding:30px; }
section#evenement div.content.lancement h2 { color:#fff; padding:0px; margin:0px 0px 20px 0px; text-align:center; }
section#evenement div.content.lancement p { margin:0px; text-align:center; }
section#evenement div.content.lancement p strong { }
section#evenement div.content.map .map-popup { /* max-width:280px; border-radius:8px; background-color:#f5f6f6; padding:20px; */ font-family:'Open Sans'; font-size:12px; text-align:center !important; }
section#evenement div.content.map .map-popup strong { font-size:14px; font-weight:bold; color:#565f65; }
section#evenement div.content.map .gm-style-iw.custom {
   width: 280px !important;
   top: unset !important;
   bottom: 0px !important;
   left: 0px !important;
   border-radius: 8px;
   background-color: #fff;
   box-shadow: 0 0px 10px rgba(178, 178, 178, 0.6);
   border:solid 2px solid #ccc;
   /* display: none; */
   text-align: center !important;
   /* background-color:#f5f6f6; */
   padding:20px 15px;
}
.gm-style-container {
	width:280px !important;
}


/****** Contact ******/
section#contact { background-color:#ececeb; }
section#contact h1 { color:#a29681; text-align:center; text-transform:uppercase; margin-bottom:50px; }
section#contact h1 span { border-bottom:solid 4px #a29681; }
section#contact div.content { max-width:700px; margin-left:auto; margin-right:auto; }
section#contact p.confirmation { text-align:center; font-size:20px; color:#ee0000; }
.form-group { display:inline; float:left; width:50%; margin-bottom:20px; padding:0px 20px; }
.form-group .control { width:100%; }
.form-group .form-control { border-radius:0px; box-shadow:none; }
.form-group input::placeholder { color:#555; font-size: clamp(16px, calc(1rem + 0.5vw), 21px);}
.form-group.max { width:100%; display:table; }
.form-group.max .control-label { display:table-cell; /* width:200px; */ text-transform:uppercase; font-weight:normal; }
.form-group.max .control { display:table-cell; width:auto; }
.form-group.optin { margin-top:20px; }
.form-group.error label { color:#ee0000; }
.form-group.error .form-control { border:solid 1px #ee0000; }
.form-submit { margin:30px 0px; text-align:center; }
.form-mentions { font-size:12px; padding:0px 20px; }
.btn-send { display:inline-block; width:220px; height:48px; line-height:48px; text-align:center; vertical-align:middle; color:#fff; background-color:#a29681; border:none; font-size:20px; }


@media (max-width: 991px) {
		
		header div.highlight { display:none; }
		
		.navbar .navbar-logo { width:107px; line-height:unset; }
		.navbar .navbar-logo .logo { max-width:100%; height:auto; max-height:100%; }
		.navbar .navbar-logo #logo-oberkampf { display:inline-block; }
		.navbar .navbar-logo #logo-promoteurs { display:none; }
		.navbar .navbar-buttons { width:100%; }
		
}


@media (max-width: 768px) {

		body { font-size:14px; }
		.visible-mobile { display:block; }
		
		.animate-from-left { transform:translateX(0); }
		.animate-from-right { transform:translateX(0); }
		.animate-from-top { transform:translateY(0); }
		.animate-from-bottom { transform:translateY(0); }
		
		header .img-slider { padding-bottom:0; height:auto; margin-top:87px; }
		header .img-slider img { width:100%; }
		header .baseline { font-size:16px; }
		header #logo-oberkampf { display:none; }
		
		section div.container { display:block; }
		section div.container .container-column { display:block; width:100%; clear:both; }
		section div.content { display:block; padding:0px; }
		section div.content div.content-col { display:block; width:100%; padding-left:0px !important; padding-right:0px !important; text-align:center !important; margin-bottom:30px; }
		section div.content div.content-col:last-child { margin-bottom:0px; }
		section div.content div.content-col .img-responsive { width:100%; }
		section h1 { text-align:center !important; }
		section h1 span { /* padding-bottom:0px !important; border:none !important; */ }
		section h2 { text-align:center !important; }
		section .btn-contact { margin:auto; }
		
		section#residence div.content-col { padding-left:0px !important; padding-right:0px !important; }
		
		section#appartements .text-2 h2 { text-align:center !important; }
		section#appartements .text-2 p { text-align:center !important; padding:0px 30px; }
		
		section#evenement div.content.map { height:0px; padding-bottom:90%; }
		section#evenement div.content.lancement { padding:30px 0px; }
		section#evenement div.content.lancement h2 { padding-left:20px; padding-right:20px; }
		
		section#prestations #prestations-entrees p { padding:0px 30px; }
		
		.form-group { width:100%; }
		
		footer.credits div.phone { display:block; width:100%; height:80px; line-height:80px; text-align:center; }
		footer.credits div.logo { display:block; width:100%; text-align:center; }
		
		.sticky-bar { display:block; }

	header .patch-offre {
		width: 30vw;
		top: 67vw;
		left: 36vw;
	}
		
}

@media (max-width: 767px) {
	
		.navbar .btn-menu { display:block; }
		.navbar .navbar-logo { width:87px; padding:10px; }
		.navbar .navbar-logo img { height:100%; }
		.navbar .navbar-buttons { display:block; position:fixed; left:0px; top:87px; right:0px; width:100%; height:calc(100% - 87px); padding:0px; background-color:#ddd; transform:translateX(100%); opacity:1; transition:all 0.8s ease; }
		.navbar .navbar-buttons.menu-open { top:87px; transform:translateX(0); opacity:1; }
		.navbar .navbar-buttons a { display:block; background-color:#ddd; border-top:solid 1px #efefef; text-align:left; font-weight:500; font-size:1.5em; }
		.navbar .navbar-buttons a.active span { border:none; padding:0px; }
		.navbar .navbar-buttons p.mentions { position:absolute; left:0px; bottom:0px; right:0px; }
		.navbar .navbar-buttons p.mentions img { display:block; margin:20px auto; max-width:80%; height:auto; }
		.navbar .navbar-title { display:table-cell; width:100%; vertical-align:middle; font-size:15px; line-height:1.2em; font-family:'ITC Avant Garde Std Bold'; color:#565f65; }
		.navbar .navbar-actions { display:table-cell; width:87px; text-align:right; }
		.navbar .navbar-actions a { width:87px; text-align:center; }
		
		.navbar .navbar-buttons .promoteurs { position:absolute; left:0px; bottom:0px; right:0px; }
		.navbar .navbar-buttons .promoteurs { display:inline-block; font-family:'ITC Avant Garde Std Bk'; font-size:14px; color:#231f20; text-align:center; line-height:1; vertical-align:middle; }
		.navbar .navbar-buttons .promoteurs img { display:block; margin:10px auto; max-width:80%; height:auto; }
		.navbar .navbar-buttons .promoteurs span { display:block; margin-bottom:5px; }

		#mentions-legales p { font-size: 3vw; }
	
}

@media (max-width: 639px) {
	
		header .baseline { font-size:calc(12px + ((100vw - 320px) / 100)); line-height:1.3em; }
		header .baseline strong { font-size:1.1em; }
		
		.navbar .navbar-title { font-size:14px; }
		.navbar .navbar-actions { width:50px; }
		.navbar .navbar-actions a { width:50px; }
		
		section h1 { font-size:22px !important; margin-bottom:30px !important; text-transform:uppercase; }
		section h1 span { border:none !important; }
		
		section#appartements .prix { padding:30px 0px; }
		section#evenement div.content.map { height:0px; padding-bottom:100%; }
	
}

@media (max-width: 460px) {
	
		section#appartements .prix .table-responsive table { width:100% !important; }
		section#appartements .prix th,
		section#appartements .prix td { font-size:10px; padding:8px 4px; }
		section#appartements .prix th.extra, 
		section#appartements .prix td.extra { display:none; }
		
}

@media (max-width: 319px) {
	
		header .baseline { font-size:12px; }
		
}


/**
* 		Animations
**/

