/* Table of Content
==================================================
	#Font-Face
	#Site Styles
	#Media Queries */

/* #Font-Face
================================================== */
@import url('../fonts/geologica/stylesheet.css');
@import url('../fonts/sora/stylesheet.css');

/* #Site Styles
================================================== */
:root {
	--font-family-base: 'Geologica';
	--font-family-heading: 'Sora';
	--font-family-icon: 'icomoon';
	--font-size-base: 20px;
	--line-height-base: 1.5;
	--width-base: 1145px;
	--width-large: 1220px;
	--color-black: #000;
	--color-white: #fff;
	--primary-color: #aa8860;
	--secondary-color: #84827d;
	--color-gray: #ddd;
	--color-light: #f5f5f5;
	--line-height-heading: 1.1;
	--font-size-h1: 80px;
	--font-size-h2: 48px;
	--font-size-h3: 24px;
	--font-size-h4: 20px;
	--font-size-h5: 18px;
	--font-size-h6: 16px;
	--font-weight-bold: 700;
	--font-weight-semibold: 600;
	--font-weight-medium: 500;
	--font-weight-regular: 400;
	--font-weight-light: 300;
	--font-weight-extralight: 200;
	--font-weight-thin: 100;
	--base-duration: all 0.3s;
}

/* ### general ### */
* { margin: 0; padding: 0; box-sizing: border-box; }
html,
body { font-family: var(--font-family-base); font-size: var(--font-size-base); font-weight: var(--font-weight-thin); line-height: var(--line-height-base); color: var(--secondary-color); }
body { background: var(--color-black); }
img { display: block; max-width: 100%; border: 0; }
ul,
li { list-style: none; }
a { display: inline-block; text-decoration: none; }
:focus { outline: none; }
h1,
h2,
h3,
h4,
h5,
h6 { margin-bottom: 20px; font-family: var(--font-family-heading); font-weight: var(--font-weight-bold); line-height: var(--line-height-heading); color: var(--primary-color); }
h1 { font-size: var(--font-size-h1); }
h2 { font-size: var(--font-size-h2); }
h3 { font-size: var(--font-size-h3); }
h4 { font-size: var(--font-size-h4); }
h5 { font-size: var(--font-size-h5); }
h6 { font-size: var(--font-size-h6); }

/* ### global classes ### */
.clear { visibility: hidden; clear: both; height: 0; line-height: 0; }
.center { margin: 0 auto; position: relative; max-width: 1200px; }
.centered { padding-right: calc((100% - var(--width-base)) / 2); padding-left: calc((100% - var(--width-base)) / 2); }
.centered-lg { padding-right: calc((100% - var(--width-large)) / 2); padding-left: calc((100% - var(--width-large)) / 2); }
.holder { display: flex; flex-wrap: wrap; }
.button { padding: 12px 37px; display: inline-block; font-family: var(--font-family-base); font-size: var(--font-size-base); font-weight: var(--font-weight-light); text-align: center; text-transform: uppercase; color: var(--primary-color); border: 1px solid var(--primary-color); border-radius: 50px; background-color: var(--color-black); transition: var(--base-duration); }
.button:hover { color: var(--color-black); background-color: var(--primary-color); }
.link { display: inline-block; font-weight: var(--font-weight-light); text-transform: uppercase; color: var(--primary-color); transition: var(--base-duration); }
.link i { margin-top: -4px; margin-right: 20px; display: inline-block; font-size: 38px; vertical-align: middle; }
.link:hover { color: var(--secondary-color); }

/* ### wrapper ### */
#wrapper { position: relative; display: block; width: 100%; min-height: 100%; overflow: clip; }

/* ### main container ### */
#mainCntr { width: 100%; }

/* ### header box ### */
.headerBox { padding: 23px 15px; position: fixed; top: 0; left: 0; z-index: 9; width: 100%; text-align: center; transition: var(--base-duration); }
.headerBox .menu { position: absolute; top: -23px; right: -100%; z-index: 1; opacity: 0; visibility: visible; width: 662px; height: calc(100vh + 23px); border-radius: 40px 0 0 40px; background-color: rgba(0, 0, 0, 0.9); transition: var(--base-duration); }
.headerBox .menu:before { position: absolute; top: 0; left: 100%; z-index: -1; width: 100vw; height: 100%; background-color: rgba(0, 0, 0, 0.9); content: ''; }
.headerBox .wrap { margin: 0 auto; position: relative; max-width: 1400px; }
.headerBox.sticky { transform: translateY(-110px); }
.headerBox.is-active { background-color: rgba(0, 0, 0, 0.8); }
.headerBox.active .menu { right: 0; opacity: 1; visibility: visible; }
.headerBox.active { transform: translateY(0) !important; }

/* ### menu box ### */
.menuBox { padding: 120px 95px 100px 112px; position: absolute; top: 0; left: 0; width: 100%; height: 100vh; text-align: left; overflow-y: auto; }
.menuBox .contact { margin-bottom: 112px; padding-bottom: 17px; font-weight: var(--font-weight-bold); border-bottom: 1px solid var(--primary-color); }
.menuBox .contact a { margin-left: 8px; color: var(--secondary-color); }
.menuBox .contact i { margin-right: 6px; display: inline-block; }
.menuBox ul { padding-bottom: 137px; border-bottom: 1px solid var(--primary-color); }
.menuBox ul > li { margin-bottom: 38px; }
.menuBox ul > li:last-child { margin-bottom: 0; }
.menuBox ul > li > a { font-family: var(--font-family-heading); font-size: 40px; font-weight: var(--font-weight-thin); text-transform: uppercase; color: var(--primary-color); transition: var(--base-duration); }
.menuBox ul > li > a i { margin-top: -5px; margin-left: 40px; display: inline-flex; align-items: center; justify-content: center; opacity: 0; visibility: hidden; width: 65px; height: 65px; font-size: 20px; color: var(--color-white); vertical-align: middle; border: 1px solid var(--color-white); border-radius: 50%; transition: var(--base-duration); }
.menuBox ul > li > a:hover { color: var(--color-white); }
.menuBox ul > li > a:hover i { opacity: 1; visibility: visible; }
.menuBox .visit { padding-top: 71px; }
.menuBox .visit span { margin-bottom: 37px; display: block; font-weight: var(--font-weight-light); letter-spacing: -0.2px; text-transform: uppercase; }
.menuBox .visit .button { padding: 12px 37px 12px 80px; position: relative; }
.menuBox .visit .button i { position: absolute; top: 50%; left: 20px; font-size: 40px; transform: translateY(-50%); }

/* ### mobileMenu ### */
.mobileMenu { position: absolute; top: 50%; right: 0; z-index: 20; display: flex; align-items: center; width: 100px; height: 32px; transform: translateY(-50%); transition: 0.2s; cursor: pointer; }
.mobileMenu span { position: absolute; top: 50%; right: 0; display: block; width: 37px; height: 1px; border-radius: 5px; background: var(--primary-color); transition: 0.2s; }
.mobileMenu span:before,
.mobileMenu span:after { position: absolute; left: 0; display: block; width: 100%; height: 1px; border-radius: 5px; background-color: var(--primary-color); transition-duration: 0.2s, 0.2s; content: ''; }
.mobileMenu span:before { top: -10px; }
.mobileMenu span:after { bottom: -10px; }
.mobileMenu i { font-size: 16px; font-style: normal; text-transform: uppercase; color: var(--primary-color); }
.mobileMenu i.hide { display: none; }
.mobileMenu.active span { background: none; }
.mobileMenu.active span:before,
.mobileMenu.active span:after { transition-delay: 0s, 0.2s; }
.mobileMenu.active span:before { top: 0; transform: rotate(45deg); }
.mobileMenu.active span:after { bottom: 0; transform: rotate(-45deg); }
.mobileMenu.active i.hide { display: block; }
.mobileMenu.active i.show { display: none; }
.menuBox::-webkit-scrollbar { display: none; width: 0 !important; }

/* ### content container ### */
#contentCntr { width: 100%; }

/* ### hero box ### */
.heroBox { padding-top: 219px; position: relative; display: flex; align-items: center; min-height: 920px; }
.heroBox .text { position: relative; z-index: 1; color: var(--primary-color); }
.heroBox h1 { margin-bottom: 0; letter-spacing: -1px; color: inherit; }
.heroBox span { padding-top: 2px; position: relative; display: block; font-size: 36px; letter-spacing: 10px; text-align: right; text-transform: uppercase; }
.heroBox span:after { position: absolute; top: 0; right: 0; width: 67%; height: 1px; background-color: var(--primary-color); content: ''; }
.heroBox .image { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
.heroBox .image img { width: 100%; height: 100%; object-fit: cover; }

/* ### about box ### */
.aboutBox { padding-top: 62px; padding-bottom: 50px; display: flex; flex-wrap: wrap; }
.aboutBox .heading { padding-right: 50px; width: 40%; }
.aboutBox h2 { margin-bottom: 43px; }
.aboutBox span { display: block; font-weight: var(--font-weight-light); text-transform: uppercase; }
.aboutBox .text { padding-top: 30px; padding-left: 5px; width: 60%; line-height: 1.9; }

/* ### function box ### */
.functionBox { position: relative; z-index: 1; }
.functionBox .slider { padding-top: 182px; padding-left: 250px; position: relative; }
.functionBox .js-function-slider { z-index: 1; }
.functionBox .slide { margin-right: 22px; width: 502px; }
.functionBox .item { position: relative; display: block; width: 100%; border-radius: 40px; overflow: hidden; }
.functionBox .item img { opacity: 0.5; width: 100%; }
.functionBox .text { padding-left: 130px; position: absolute; bottom: 40px; left: 0; width: 100%; font-weight: var(--font-weight-light); text-transform: uppercase; color: var(--color-white); }
.functionBox .text i { margin-left: 10px; display: inline-block; font-size: 10px; vertical-align: middle; }
.functionBox .text:before { position: absolute; top: 50%; left: 0; width: 110px; height: 1px; background-color: var(--color-white); content: ''; }
.functionBox .gap { padding-top: 54px; padding-left: 26px; position: relative; z-index: 1; }
.functionBox h3 { margin-bottom: 54px; font-family: var(--font-family-base); letter-spacing: 2.5px; text-transform: uppercase; }
.functionBox .wrap { display: flex; flex-wrap: wrap; align-items: center; }
.functionBox .left { padding-right: 30px; width: 60%; line-height: 1.6; }
.functionBox .left p a { text-decoration: underline; color: var(--secondary-color); }
.functionBox .left p a:hover { text-decoration: none; }
.functionBox .right { width: 40%; text-align: right; }
.functionBox .shape { position: absolute; top: 41px; left: -308px; z-index: -1; width: 525px; pointer-events: none; }
.functionBox .slider-btn { position: absolute; top: 26px; right: -53px; display: flex; align-items: center; }
.functionBox .slick-list { margin-right: -500px; }

/* ### image box ### */
.imageBox { padding-bottom: 68px; pointer-events: none; }
.imageBox .image { position: relative; }
.imageBox .image:before { position: absolute; top: 0; left: 0; z-index: 1; width: 100%; height: 100%; background: radial-gradient(closest-side, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 20%, rgba(0, 0, 0, 1) 100%); content: ''; }
.imageBox img { opacity: 0.2; width: 100%; height: 555px; object-fit: cover; }

/* ### design box ### */
.designBox { padding-bottom: 50px; position: relative; background-color: var(--color-light); }
.designBox .holder { margin-left: auto; max-width: 880px; }
.designBox .wrap { margin-top: -232px; position: relative; z-index: 1; display: inline-block; width: 100%; }
.designBox .heading { padding-top: 69px; position: absolute; top: 0; left: 0; width: 44%; }
.designBox .text { padding-top: 72px; line-height: 1.65; }
.designBox .text p a { text-decoration: underline; color: var(--secondary-color); }
.designBox .text p a:hover { text-decoration: none; }
.designBox .paragraph { padding-right: 20px; padding-left: 20px; }
.designBox .image-small { padding-top: 272px; width: 35%; }
.designBox .image-small img { width: 100%; border-radius: 40px; }
.designBox .image-big { padding-left: 42px; width: 65%; }
.designBox .image-big img { width: 100%; border-radius: 40px; }

/* ### quality box ### */
.qualityBox { padding: 63px 15px 120px; text-align: center; background-color: var(--color-light); }
.qualityBox h3 { font-family: var(--font-family-base); letter-spacing: 2.5px; text-transform: uppercase; color: var(--secondary-color); }
.qualityBox img { margin: 0 auto; }

/* ### project box ### */
.projectBox { padding: 219px 15px 100px; }
.projectBox .heading { margin: 0 auto 93px; position: relative; z-index: 2; display: flex; max-width: 1155px; color: var(--primary-color); }
.projectBox h1 { margin-bottom: 8px; letter-spacing: -1px; color: inherit; }
.projectBox span { padding-top: 2px; position: relative; display: block; font-size: 36px; letter-spacing: 10px; text-align: right; text-transform: uppercase; }
.projectBox span:after { position: absolute; top: 0; right: 0; width: 77%; height: 1px; background-color: var(--primary-color); content: ''; }
.projectBox .wrap { margin: 0 auto; position: relative; z-index: 2; max-width: 1390px; }
.projectBox .holder { margin: 0 -10px; }
.projectBox .column { margin-bottom: 20px; padding: 0 10px; width: 33.33%; }
.projectBox .item { position: relative; display: block; width: 100%; border-radius: 40px; overflow: hidden; }
.projectBox .item img { opacity: 0.5; width: 100%; }
.projectBox .text { padding: 0 10px; position: absolute; bottom: 40px; left: 0; width: 100%; font-weight: var(--font-weight-light); text-align: center; text-transform: uppercase; color: var(--color-white); }
.projectBox .text i { margin-left: 10px; display: inline-block; font-size: 10px; vertical-align: middle; }
.projectBox .bg { position: absolute; top: 0; left: 0; width: 100%; height: 555px; }
.projectBox .bg:before { position: absolute; top: 0; left: 0; z-index: 1; width: 100%; height: 100%; background: radial-gradient(closest-side, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 20%, rgba(0, 0, 0, 1) 100%); content: ''; }
.projectBox .bg img { opacity: 0.6; width: 100%; height: 100%; object-fit: cover; }

/* ### excited box ### */
.excitedBox { padding-top: 90px; padding-bottom: 285px; position: relative; display: flex; flex-wrap: wrap; }
.excitedBox .heading { padding-right: 30px; position: relative; z-index: 1; width: 54%; }
.excitedBox h2 { margin-bottom: 32px; letter-spacing: -1px; }
.excitedBox span { margin-bottom: 63px; display: block; font-weight: var(--font-weight-light); text-transform: uppercase; }
.excitedBox .button { padding: 12px 37px 12px 75px; position: relative; }
.excitedBox .button i { position: absolute; top: 50%; left: 30px; font-size: 22px; transform: translateY(-50%); }
.excitedBox .image { margin-top: 112px; margin-left: auto; position: relative; z-index: 1; width: 46%; border-radius: 40px; overflow: hidden; }
.excitedBox .image img { width: 100%; }
.excitedBox .shape { margin-left: -900px; position: absolute; bottom: 140px; left: 50%; width: 525px; pointer-events: none; }

/* ### getting box ### */
.gettingBox { padding-top: 180px; position: relative; text-align: center; }
.gettingBox .box { margin: 0 auto; padding: 100px 80px 75px; position: relative; z-index: 1; max-width: 499px; border-radius: 40px 40px 0 0; background-color: var(--color-black); }
.gettingBox .box .button { padding: 12px 37px 12px 80px; position: relative; }
.gettingBox .box .button i { position: absolute; top: 50%; left: 20px; font-size: 40px; transform: translateY(-50%); }
.gettingBox .box h2 { margin-bottom: 36px; line-height: 1.25; letter-spacing: -1px; }
.gettingBox .box span { margin-bottom: 89px; display: block; font-weight: var(--font-weight-light); text-transform: uppercase; }
.gettingBox .bg { position: absolute; top: 0; left: 0; opacity: 0.5; width: 100%; height: 100%; }
.gettingBox .bg img { width: 100%; height: 100%; object-fit: cover; }

/* ### banner box ### */
.bannerBox { padding-top: 150px; padding-bottom: 116px; position: relative; display: flex; align-items: flex-end; min-height: 776px; }
.bannerBox .text { position: relative; z-index: 1; color: var(--color-white); }
.bannerBox h1 { margin-bottom: 9px; letter-spacing: -1px; color: inherit; }
.bannerBox span { padding-top: 10px; position: relative; display: block; font-size: 36px; letter-spacing: 10px; text-align: right; text-transform: uppercase; }
.bannerBox span:after { position: absolute; top: 0; right: 0; width: 67%; height: 1px; background-color: var(--color-white); content: ''; }
.bannerBox .image { position: absolute; top: 0; left: 0; opacity: 0.5; width: 100%; height: 100%; }
.bannerBox .image img { width: 100%; height: 100%; object-fit: cover; }

/* ### look box ### */
.lookBox { padding-top: 81px; padding-bottom: 228px; display: flex; flex-wrap: wrap; }
.lookBox .image { padding-top: 23px; position: relative; width: 54.4%; }
.lookBox .image img { width: 100%; border-radius: 40px; }
.lookBox .small-image { padding: 25px; position: absolute; right: -75px; bottom: -200px; width: 425px; border-radius: 60px; background-color: var(--color-black); }
.lookBox .text { padding-left: 81px; width: 45.6%; }
.lookBox .text h2 { margin-bottom: 35px; line-height: 1.25; letter-spacing: -1px; }
.lookBox .text span { margin-bottom: 40px; display: block; font-weight: var(--font-weight-light); text-transform: uppercase; }
.lookBox .text p { line-height: 1.7; }

/* ### gallery box ### */
.galleryBox { padding: 100px 15px 395px; position: relative; }
.galleryBox .wrap { margin: 0 auto; position: relative; max-width: 1396px; }
.galleryBox .holder { margin: 0 -10px 82px; }
.galleryBox .column { padding: 0 10px; width: 33.33%; }
.galleryBox .item { margin-bottom: 20px; position: relative; display: block; width: 100%; border-radius: 40px; overflow: hidden; }
.galleryBox .item:after,
.galleryBox .item:before { position: absolute; top: 0; left: 0; z-index: 1; opacity: 0; visibility: hidden; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.2); transition: var(--base-duration); content: ''; }
.galleryBox .item:after { z-index: 2; background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.75) 100%); }
.galleryBox .item img { width: 100%; transition: var(--base-duration); }
.galleryBox .item .text { padding: 0 15px; position: absolute; bottom: 30px; left: 0; z-index: 3; opacity: 0; visibility: hidden; width: 100%; text-align: center; transition: var(--base-duration); }
.galleryBox .item .text .button { padding: 12px 25px 12px 15px; background-color: transparent; }
.galleryBox .item .text .button i { margin-right: 10px; display: inline-block; }
.galleryBox .item .text .button:hover { background-color: var(--primary-color); }
.galleryBox .item:hover:before,
.galleryBox .item:hover:after,
.galleryBox .item:hover .text { opacity: 1; visibility: visible; }
.galleryBox .item:hover img { transform: scale(1.05); }
.galleryBox .content { margin: 0 auto; position: relative; z-index: 1; display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; max-width: 830px; }
.galleryBox .content .button { margin-top: 38px; padding: 12px 37px 12px 80px; position: relative; }
.galleryBox .content .button i { position: absolute; top: 50%; left: 20px; font-size: 40px; transform: translateY(-50%); }
.galleryBox .content h2 { margin-bottom: 42px; letter-spacing: -1px; }
.galleryBox .content .back { font-weight: var(--font-weight-light); text-transform: uppercase; color: var(--secondary-color); }
.galleryBox .content .back i { margin: 8px auto 0; display: flex; align-items: center; justify-content: center; width: 65px; height: 65px; font-size: 22px; color: var(--secondary-color); border: 1px solid var(--secondary-color); border-radius: 50%; background-color: var(--color-black); }
.galleryBox .shape { position: absolute; bottom: -53px; left: -93px; width: 471px; pointer-events: none; }

/* ### visit box ### */
.visitBox { padding-top: 45px; padding-bottom: 430px; position: relative; }
.visitBox .left { padding-top: 187px; padding-right: 43px; width: 43%; }
.visitBox h2 { margin-bottom: 68px; line-height: 1.25; letter-spacing: -1px; }
.visitBox p { margin-bottom: 70px; }
.visitBox .button { min-width: 250px; }
.visitBox .right { margin-right: -112px; padding-left: 30px; width: calc(57% + 112px); }
.visitBox .image { padding-bottom: 83px; position: relative; }
.visitBox .image img { opacity: 0.5; width: 100%; border-radius: 40px; }
.visitBox .text { margin-left: auto; padding-right: 130px; max-width: 370px; font-size: 24px; font-weight: var(--font-weight-extralight); line-height: 1.25; letter-spacing: -0.5px; text-align: center; text-transform: uppercase; color: var(--color-white); }
.visitBox .text span { margin-top: 38px; padding: 0 5px; position: relative; display: inline-block; font-size: 20px; font-weight: var(--font-weight-thin); text-transform: capitalize; color: var(--primary-color); background-color: var(--color-black); }
.visitBox .text span:after { position: absolute; top: 13px; left: -27px; z-index: -1; width: 198px; height: 1px; background-color: var(--primary-color); content: ''; }
.visitBox .small-image { padding: 25px; position: absolute; bottom: -196px; left: -198px; width: 425px; border-radius: 60px; background-color: var(--color-black); pointer-events: none; }
.visitBox .small-image img { opacity: 1; border-radius: 40px; }
.visitBox .shape { margin-left: -681px; position: absolute; bottom: -61px; left: 50%; z-index: -1; pointer-events: none; }

/* ### footer box ### */
.footerBox { padding-top: 110px; padding-bottom: 30px; }
.footerBox .holder { margin: 0 -15px; padding-bottom: 57px; }
.footerBox .column { padding: 0 15px; width: 33.33%; }
.footerBox .logo { margin-bottom: 15px; }
.footerBox address { margin-bottom: 32px; padding-left: 60px; position: relative; font-size: 16px; font-weight: var(--font-weight-light); font-style: normal; line-height: 1.95; color: var(--primary-color); }
.footerBox address i { position: absolute; top: 6px; left: 20px; font-size: 20px; }
.footerBox ul > li { line-height: 1.6; }
.footerBox ul > li > a { padding-left: 60px; position: relative; font-size: 16px; font-weight: var(--font-weight-light); color: var(--primary-color); }
.footerBox ul > li > a i { position: absolute; top: 2px; left: 20px; font-size: 20px; }
.footerBox ul > li > a:hover { text-decoration: underline; }
.footerBox .social-media { padding-top: 37px; padding-left: 60px; }
.footerBox .social-media strong { margin-bottom: 10px; display: block; text-transform: uppercase; color: var(--primary-color); }
.footerBox .social-media a { margin-left: 5px; font-size: 30px; color: var(--primary-color); transition: var(--base-duration); }
.footerBox .social-media a:hover { color: var(--color-white); }
.footerBox .title { margin-bottom: 29px; font-weight: var(--font-weight-bold); text-transform: uppercase; color: var(--primary-color); }
.footerBox .title i { margin-right: 12px; display: inline-block; }
.footerBox .week { margin: 0 auto; padding-top: 22px; max-width: 220px; }
.footerBox .timing { margin-bottom: 15px; display: flex; font-size: 16px; font-weight: var(--font-weight-light); text-transform: uppercase; color: var(--primary-color); }
.footerBox .timing span { padding-right: 13px; display: block; width: 39px; text-align: right; color: var(--secondary-color); }
.footerBox .timing:last-child { margin-bottom: 0; }
.footerBox .content { margin-left: auto; padding-top: 22px; max-width: 320px; }
.footerBox .gap { padding-left: 38px; }
.footerBox .partner-logo { margin-bottom: 34px; }
.footerBox p { font-size: 16px; font-weight: var(--font-weight-light); line-height: 1.95; color: var(--primary-color); }
.copyright { margin: 0 auto; padding-top: 29px; max-width: 916px; font-size: 16px; text-align: center; color: var(--primary-color); border-top: 1px solid var(--primary-color); }
.copyright i { margin-right: 5px; display: inline-block; font-size: 28px; vertical-align: middle; }

/* ### slick arrows ### */
.slick-arrow { display: flex; align-items: center; justify-content: center; width: 65px; height: 65px; font-size: 18px; color: var(--primary-color); border: 1px solid var(--primary-color); border-radius: 50%; background-color: transparent; cursor: pointer; }
.slick-arrow.prev-arrow { margin-right: 100px; }
.slick-arrow.slick-disabled { color: var(--secondary-color); border: 1px solid var(--secondary-color); }
.slick-counter { position: absolute; top: 45px; right: 45px; font-weight: var(--font-weight-light); color: var(--color-white); }

/* #Media Queries
================================================== */
@media only screen and (max-width: 1250px) {
	.centered-lg { padding-right: 15px; padding-left: 15px; }
	.visitBox .shape { margin-left: 0; position: absolute; left: 15px; }
	.functionBox .slider-btn { right: 0; }
	.slick-arrow.prev-arrow { margin-right: 50px; }
	.slick-counter { right: 74px; }
}

@media only screen and (max-width: 1200px) {
	.centered { padding-right: 15px; padding-left: 15px; }
	.menuBox { padding: 40px 140px 100px 80px; }
	.menuBox .contact { margin-bottom: 50px; }
	.menuBox ul { padding-bottom: 50px; }
	.menuBox ul > li { margin-bottom: 20px; }
	.menuBox ul > li > a i { width: 50px; height: 50px; font-size: 15px; }
	.menuBox .visit { padding-top: 60px; }
	.heroBox { min-height: 700px; }
	.functionBox .slider { padding-left: 0; }
	.imageBox img { height: 400px; }
	.designBox .heading { padding-top: 40px; }
	.excitedBox .image { margin-top: 0; }
	.excitedBox .shape { margin-left: 0; left: 0; }
	.bannerBox { min-height: 600px; }
	.visitBox .left { padding-top: 100px; padding-right: 0; }
	.visitBox .small-image { bottom: -270px; left: -190px; }
}

@media only screen and (max-width: 991px) {
	.heroBox { padding-top: 150px; min-height: 500px; }
	.aboutBox .heading { padding-right: 30px; }
	.aboutBox .text { padding-top: 0; }
	.designBox .heading { margin-bottom: 30px; position: unset; width: 100%; }
	.designBox .link { font-size: 18px; }
	.designBox .link i { margin-right: 10px; font-size: 24px; }
	.designBox .image-small { padding-top: 150px; }
	.qualityBox { padding-top: 40px; padding-bottom: 80px; }
	.projectBox { padding-bottom: 50px; }
	.projectBox .column { width: 50%; }
	.gettingBox { padding-top: 100px; }
	.excitedBox { padding-top: 50px; padding-bottom: 150px; }
	.excitedBox .shape { bottom: 20px; left: -100px; width: 325px; }
	.bannerBox { padding-bottom: 80px; }
	.galleryBox .column { width: 50%; }
	.galleryBox .column:last-child { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; width: 100%; }
	.galleryBox .column:last-child .item { width: 49%; height: auto; }
	.lookBox { padding-bottom: 50px; }
	.lookBox .image { padding-bottom: 150px; width: 100%; }
	.lookBox .text { padding-left: 0; width: 100%; }
	.lookBox .small-image { right: 0; bottom: 50px; width: 270px; }
	.visitBox .left { margin-bottom: 50px; padding-top: 0; width: 100%; }
	.visitBox .right { padding-left: 0; width: 100%; }
	.visitBox h2 { margin-bottom: 30px; }
	.visitBox p { margin-bottom: 30px; }
	.visitBox .text { padding-right: 0; max-width: 240px; }
	.visitBox .small-image { bottom: -150px; left: -15px; }
	.visitBox .shape { bottom: 0; }
	.footerBox .column { margin-bottom: 30px; width: 50%; }
	.footerBox .column:last-child { width: 100%; }
	.footerBox .content { max-width: 100%; }
}

@media only screen and (max-width: 767px) {
	:root {
		--font-size-base: 16px;
		--font-size-h1: 48px;
		--font-size-h2: 36px;
	}
	.link i { margin-right: 10px; font-size: 24px; }
	.headerBox { padding: 15px; text-align: left; }
	.headerBox .menu { width: 300px; }
	.headerBox .logo img { max-width: 140px; }
	.headerBox.sticky { transform: translateY(-79px); }
	.menuBox { padding: 95px 20px 80px; }
	.menuBox .contact { margin-bottom: 20px; }
	.menuBox ul { padding-bottom: 20px; }
	.menuBox ul > li { margin-bottom: 10px; }
	.menuBox ul > li > a { font-size: 20px; }
	.menuBox ul > li > a i { margin-left: 10px; width: 30px; height: 30px; font-size: 10px; }
	.menuBox .visit { padding-top: 20px; }
	.menuBox .visit span { margin-bottom: 20px; }
	.menuBox .visit .button { padding: 12px 25px 12px 60px; }
	.menuBox .visit .button i { font-size: 28px; }
	.heroBox { padding-top: 150px; padding-bottom: 100px; min-height: auto; }
	.heroBox span { font-size: 24px; }
	.aboutBox .heading { margin-bottom: 20px; padding-right: 0; width: 100%; }
	.aboutBox .text { width: 100%; }
	.aboutBox h2 { margin-bottom: 20px; }
	.functionBox .slider { padding-top: 140px; }
	.functionBox .left { margin-bottom: 25px; padding-right: 0; width: 100%; }
	.functionBox .right { width: 100%; text-align: left; }
	.functionBox .slide { width: 300px; }
	.functionBox h3 { margin-bottom: 25px; }
	.functionBox .gap { padding-top: 100px; padding-left: 0; }
	.functionBox .text { padding-left: 40px; }
	.functionBox .text:before { width: 30px; }
	.functionBox .shape { top: 0; left: -200px; width: 325px; }
	.imageBox img { height: 300px; }
	.designBox .image-small { margin-bottom: 40px; padding-top: 0; width: 100%; }
	.designBox .image-big { padding-left: 0; width: 100%; }
	.designBox .text { padding-top: 30px; }
	.qualityBox { padding-top: 30px; padding-bottom: 50px; }
	.projectBox { padding-top: 150px; padding-bottom: 30px; }
	.projectBox .column { width: 100%; }
	.projectBox .heading { margin-bottom: 50px; }
	.projectBox span { font-size: 24px; }
	.projectBox span:after { width: 100%; }
	.projectBox .bg { height: 400px; }
	.excitedBox { padding-top: 30px; }
	.excitedBox .heading { margin-bottom: 40px; padding-right: 0; width: 100%; }
	.excitedBox span { margin-bottom: 30px; }
	.excitedBox .image { width: 100%; }
	.gettingBox { padding-top: 80px; }
	.gettingBox .box { padding: 50px 25px; }
	.gettingBox .box span { margin-bottom: 40px; }
	.gettingBox .box .button { padding: 12px 25px 12px 60px; }
	.gettingBox .box .button i { font-size: 28px; }
	.bannerBox { min-height: auto; }
	.bannerBox span { font-size: 24px; }
	.bannerBox span:after { width: 85%; }
	.galleryBox { padding-top: 50px; padding-bottom: 100px; }
	.galleryBox .content h2 { margin-bottom: 25px; }
	.galleryBox .column { width: 100%; }
	.galleryBox .item .text { bottom: 20px; }
	.galleryBox .content { display: block; text-align: center; }
	.galleryBox .content .button { padding: 12px 25px 12px 60px; }
	.galleryBox .content .button i { font-size: 22px; }
	.galleryBox .column:last-child { display: block; width: 100%; }
	.galleryBox .column:last-child .item { width: 100%; }
	.galleryBox .holder { margin-bottom: 30px; }
	.galleryBox .shape { bottom: -30px; width: 300px; }
	.lookBox { padding-bottom: 30px; }
	.visitBox { padding-bottom: 100px; }
	.visitBox .image { padding-bottom: 20px; }
	.visitBox .small-image { margin: -100px auto 0; position: relative; bottom: auto; left: auto; width: 330px; pointer-events: unset; }
	.visitBox .text { margin: 0 auto; }
	.visitBox .shape { width: 330px; }
	.footerBox { padding-top: 50px; padding-bottom: 20px; }
	.footerBox .column { margin-bottom: 20px; width: 100%; }
	.footerBox .column:last-child { margin-bottom: 0; }
	.footerBox .week { margin: 0; }
	.slick-arrow { width: 50px; height: 50px; font-size: 14px; }
	.functionBox .slider-btn { right: auto; left: 50%; transform: translateX(-50%); }
	.slick-counter { top: 38px; right: auto; left: 50%; transform: translateX(-50%); }
}