/*********************************************
 GLOBAL
*********************************************/
html {height:100%;}
body {margin:0px;padding:0px;font-family:"Open Sans", Verdana;font-size:16px;color:#FFF;background-color:#000;min-height:100%;}
h1 {font-family: "Oswald";font-size:3.0em;line-height:1.4em;font-weight:normal;margin:.5em 0 .8em 0;color:#FFF;position:relative;}
h2 {font-family: "Oswald";font-size:2.2em;line-height:1.6em;font-weight:normal;margin:.5em 0;color:#FFF;}
h3 {font-family: "Open Sans";font-size:1.4em;line-height:1.6em;font-weight:normal;margin:.5em 0;color:#FFF;}
h4 {font-size:11px;line-height:1.6em;font-weight:bold;}
h1::after {content:'_________';display:block;width:100%;color:rgba(255,255,255,.9);margin:0;padding:0;top:10px;left:0;font-size:1.3em;margin-top: -.7em;}
p {line-height:2em;color:inherit;margin: 1em 0; opacity:.8;}
a {color:#FFF; text-decoration:underline; cursor:pointer;}
hr {border: 0; height: 0; border-top: 1px solid rgba(0, 0, 0, 0.3); border-bottom: 1px solid rgba(255, 255, 255, 0.3);}
em {font-style:italic;}
b, strong {font-weight:600;}
ul, ol { margin: 1em 0; padding: 0;}
ul li, ol li { line-height: 2em; margin-left: 25px; }
ul li { list-style: disc outside; }
ol li { list-style: decimal outside; }
img { max-width:100%; }

/*********************************************
 TEMPLATE SPECIFIC
*********************************************/
#tubular-container {position:absolute; top:0; z-index: -1!important;}
.footer{width:100%;text-align:center;padding: 25px 30px;background-color:#151515; color:#666;border-top:1px solid #000;font-size:14px;position: relative; z-index:2; box-sizing:border-box; }
.footer a{color:#666; text-decoration:none;cursor:pointer;transition: all 0.3s ease-out;}
.footer a:hover{color:#FFF;}
.sticky { top: 20px; }

/*********************************************
 TEMPLATE
*********************************************/
/* CONTENT */
.content { position:relative;z-index:3;margin-left:400px;}
.content .first{ height:100vh; display:flex; justify-content:center; flex-flow:column; }
.content .first .overlay {width:100%;height:100%;background-color:#273142;position:absolute;left:0;top:0;z-index:-1;opacity:.4;}
.content .first .overlay::after {content:'';width:100%;height:100%;background-color:rgba(0,0,0,.5);position:absolute;left:0;top:0;z-index:-1;}
.content .first .logo img {max-width:50%;}
.content .background{background:#273142;}
.content .background > div:nth-of-type(even) {background:rgba(0,0,0,.60);}
.content .background > div:nth-of-type(odd) {background:rgba(0,0,0,.30);}
.content .mobile_bar { display:none; z-index:5; background:#273142; width:100%; top:0; font-size:18px; height:50px; line-height:50px; border-bottom:1px solid rgba(255,255,255,.2); white-space:nowrap; overflow:hidden; }
.content .mobile_bar .hamburger { display:inline-block; background:rgba(0,0,0,.5); font-size:22px; width:50px; text-align:center; margin-right:10px; border-right:1px solid rgba(255,255,255,.2); }

.content .content {width: 100%; max-width: 100%; margin:0; padding:80px 7%; box-sizing:border-box; }
.builder_content > section > .grid-container { width: 86%; max-width: 100%; margin: 0 auto; }
.builder_content > section:first-of-type { padding-top: 80px; }
.builder_content > section:last-of-type { padding-bottom: 80px; }

/* NAVIGATION STYLE */
.navigation {display:block;position:fixed;height:100vh;width:400px;top:0;left:0;z-index:4;text-align:right;box-sizing:border-box;transition: left 500ms ease;}
.navigation::after {content:'';display:block;background:#273142;width:110%;height:100%;position:absolute;top:0;left:-5%;z-index:-1;transform:skew(1.5deg);box-shadow:0 0 30px 0 rgba(0,0,0,.3);border-right:1px solid rgba(0,0,0,.5);}
.navigation ul,.navigation li {padding:0;margin:0;list-style:none;}
.navigation li {margin-top:30px;line-height: 1.4em;}
.navigation a {transition:color 0.2s ease;color:rgba(255,255,255,.6);display:block;font-weight:400;padding:14px 0;position:relative;text-decoration:none;font-size:16px;letter-spacing:0.05em;}
.navigation a i {float:left;color:#FFF;font-size:20px;margin-top:-3px;}
.navigation img {float:left;}
.navigation a::before, .navigation a::after {border-radius:2px;bottom:0;content:'';height:3px;position:absolute;right:0;width:100%;}
.navigation a::before {background:rgba(255,255,255,.1);}
.navigation a::after {background-image:linear-gradient(to right, #FC0, #b74e91); transition:max-width 0.2s ease; max-width:0;}
.navigation a:hover {color:#FFF;}
.navigation a.active {color:#FFF;}
.navigation a.active::after {max-width:100%;}
.navigation .main-menu { margin-bottom:25px; }
.navigation .hide_scroll { position:relative;width:100%;height:100%; overflow:hidden; }
.navigation .centralize { max-height:100%;overflow-y:scroll;overflow-x:hidden;padding:25px 40px 25px 35px;width:calc(100% + 20px);box-sizing:border-box; }
/* NAVIGATION SUB MENU */
.navigation label { cursor:pointer;}
.navigation input[type="checkbox"] { display:none;}
.navigation .main-menu .sub-menu { display:none;}
.navigation .main-menu li > input[type="checkbox"]:checked + .sub-menu {display:block;}
.navigation .main-menu .drop-icon { position:absolute;right:-25px;top:15px; }

/*********************************************
 MENU ANIMATIONS DELAYS
*********************************************/
.navigation .brand { transition-delay: 400ms; animation-delay: 400ms; }
.navigation .main-menu > li:nth-child(1) { transition-delay: 600ms; animation-delay: 600ms; }
.navigation .main-menu > li:nth-child(2) { transition-delay: 800ms; animation-delay: 800ms; }
.navigation .main-menu > li:nth-child(3) { transition-delay: 1000ms; animation-delay: 1000ms; }
.navigation .main-menu > li:nth-child(4) { transition-delay: 1200ms; animation-delay: 1200ms; }
.navigation .main-menu > li:nth-child(5) { transition-delay: 1400ms; animation-delay: 1400ms; }
.navigation .main-menu > li:nth-child(6) { transition-delay: 1600ms; animation-delay: 1600ms; }
.navigation .main-menu > li:nth-child(7) { transition-delay: 1800ms; animation-delay: 1800ms; }
.navigation .main-menu > li:nth-child(8) { transition-delay: 2000ms; animation-delay: 2000ms; }
.navigation .main-menu > li:nth-child(9) { transition-delay: 2200ms; animation-delay: 2200ms; }
.navigation .main-menu > li:nth-child(10) { transition-delay: 2400ms; animation-delay: 2400ms; }
.navigation .main-menu > li:nth-child(11) { transition-delay: 2600ms; animation-delay: 2600ms; }
.navigation .main-menu > li:nth-child(12) { transition-delay: 2800ms; animation-delay: 2800ms; }
.navigation .main-menu > li:nth-child(13) { transition-delay: 3000ms; animation-delay: 3000ms; }
.navigation .main-menu > li:nth-child(14) { transition-delay: 3200ms; animation-delay: 3200ms; }
.navigation .main-menu > li:nth-child(15) { transition-delay: 3400ms; animation-delay: 3400ms; }
.navigation .main-menu > li:nth-child(16) { transition-delay: 3600ms; animation-delay: 3600ms; }
.navigation .main-menu > li:nth-child(17) { transition-delay: 3800ms; animation-delay: 3800ms; }
.navigation .main-menu > li:nth-child(18) { transition-delay: 4000ms; animation-delay: 4000ms; }
.navigation .main-menu > li:nth-child(19) { transition-delay: 4200ms; animation-delay: 4200ms; }
.navigation .main-menu > li:nth-child(20) { transition-delay: 4400ms; animation-delay: 4400ms; }

/*********************************************
 SOCIAL
*********************************************/
.social{position:fixed;right:0;top:150px;z-index:5}
.social a{position:relative;left:0;font-size:18px;display:block;width:40px;height:40px;text-align:center;color:#fff;background:#ddd;box-shadow:0 0 1px 100px rgba(255,255,255,0.3) inset;transition:all .3s ease-out;}
.social a.facebook{background:#3B5998}
.social a.twitter{background:#2DADDC}
.social a.mybusiness{background:#C53727}
.social a.instagram{background:radial-gradient(circle farthest-corner at 35% 90%, #fec564, transparent 50%), radial-gradient(circle farthest-corner at 0 140%, #fec564, transparent 50%), radial-gradient(ellipse farthest-corner at 0 -25%, #5258cf, transparent 50%), radial-gradient(ellipse farthest-corner at 20% -50%, #5258cf, transparent 50%), radial-gradient(ellipse farthest-corner at 100% 0, #893dc2, transparent 50%), radial-gradient(ellipse farthest-corner at 60% -20%, #893dc2, transparent 50%), radial-gradient(ellipse farthest-corner at 100% 100%, #d9317a, transparent), linear-gradient(#6559ca, #bc318f 30%, #e33f5f 50%, #f77638 70%, #fec66d 100%);}
.social a.pinterest{background:#E60023}
.social a.linkedin{background:#0077B5}
.social a.tripadvisor{background:#00A680}
.social a.houzz{background:#7CC04B}
.social a.tiktok{background:#EF2950}
.social a.oeil_de_france{background:#EFAB29}
.social a.oeil_de_france img{width: 50%;padding: 25%;}
.social i{line-height:40px;}
.social a:first-child{border-radius: 5px 0 0 0;}
.social a:last-child{border-radius: 0 0 0 5px;}
.social a:hover{background:#A2CA70;color:#fff;text-decoration:none;opacity:1;box-shadow:0 0 1px 0 rgba(255,255,255,0.6) inset}

/*********************************************
 MEDIA QUERIES
*********************************************/
@media only screen and (max-width: 1400px) and (min-width: 1200px) {
	.navigation { width:340px; }
	.content { margin-left: 340px; }
	.navigation .centralize { padding: 25px 30px 25px 25px; }
}
@media only screen and (max-width: 1199px) and (min-width: 1024px) {
	.navigation { width:300px; }
	.content { margin-left: 300px; }
	.navigation a { letter-spacing: 0; }
	.navigation .centralize { padding: 25px 20px 25px 15px; }
}
@media only screen and (max-width: 1023px) {
	.navigation {width:350px; max-width:100%; left:-100%;}
	.navigation.visible {left:0%;}
	.navigation::after {width:100%;left:0;z-index:-1;transform:none;}
	.content { margin-left: 0; }
	.content .mobile_bar { display:block; }
	.social { display:none; }
}
@media only screen and (max-width: 1024px) {
	h1 { font-size:2.5em; }
	h2 { font-size:2em;}
}
@media only screen and (max-width: 479px) {
	h1 { font-size:2em; }
	h2 { font-size:1.6em;}
}