@import url("https://fonts.googleapis.com/css2?family=Montserrat:wght@100;300;400&display=swap");
:root { /* typography */ --font-great-vibes: 'Great Vibes', cursive; --font-josefin-sans: 'Josefin Sans'; --font-montserrat: 'Montserrat', sans-serif; /* color theme */ --color-theme: #EEEEEE; --color-s-1: #c88a5a; --color-s-2: #F1F0EC; /* color brand */ --color-theme-page: #fff; --color-theme-shop:#EEEEEE; --color-theme-text: #000; /* color default*/ --color-black: #000; --color-black-75: #000000bf; --color-black-50: #00000080; --color-black-25: #00000040; --color-black-15: #00000026; --color-white: #fff; --color-white-85: #ffffffd9; --color-white-75: #ffffffbf; --color-white-50: #ffffff80; --color-white-25: #ffffff40; --color-gray: #ddd; /* transition */ --transition-fast: all ease-in-out 0.2s; /* thickness */ --light: 100; --medium: 300; --black: 900; }

/*******************************************************
SCSS
        01. Media Query
        02. Container
        03. Flexbox & Grid System
        04. Other
        05. Root

*******************************************************/
/*============== 01. Media Query ===============*/
/*============== 02. Container ===============*/
.grid { padding-right: 1rem; padding-left: 1rem; }

.grid:not(.is-fluid) { margin: 0 auto; }

@media only screen and (min-width: 600px) { .grid:not(.is-fluid) { width: 100%; max-width: 570px; } }

@media only screen and (min-width: 900px) { .grid:not(.is-fluid) { width: 100%; max-width: 860px; } }

@media only screen and (min-width: 1200px) { .grid:not(.is-fluid) { width: 100%; max-width: 1150px; } }

@media only screen and (min-width: 1800px) { .grid:not(.is-fluid) { width: 100%; max-width: 1400px; } }

.grid-sm { margin: 0 auto; padding-right: 1rem; padding-left: 1rem; width: 100%; }

@media only screen and (min-width: 600px) { .grid-sm { max-width: 570px; } }

@media only screen and (min-width: 900px) { .grid-sm { max-width: 860px; } }

@media only screen and (min-width: 1200px) { .grid-sm { max-width: 1150px; } }

@media only screen and (min-width: 1800px) { .grid-sm { max-width: 1400px; } }

.grid-md { margin: 0 auto; padding-right: 1rem; padding-left: 1rem; width: 100%; }

@media only screen and (min-width: 900px) { .grid-md { max-width: 860px; } }

@media only screen and (min-width: 1200px) { .grid-md { max-width: 1150px; } }

@media only screen and (min-width: 1800px) { .grid-md { max-width: 1400px; } }

.grid-lg { margin: 0 auto; padding-right: 1rem; padding-left: 1rem; width: 100%; }

@media only screen and (min-width: 1200px) { .grid-lg { max-width: 1150px; } }

@media only screen and (min-width: 1800px) { .grid-lg { max-width: 1400px; } }

.grid-xl { margin: 0 auto; padding-right: 1rem; padding-left: 1rem; width: 100%; }

@media only screen and (min-width: 1800px) { .grid-xl { max-width: 1400px; } }

/*============== 03. Media Query ===============*/
/*============== 04. Others ===============*/
.description-product span, .description span { position: relative; font-size: 0.6875rem; font-weight: 500; color: var(--color-black); letter-spacing: .09em; text-transform: uppercase; font-family: var(--font-josefin-sans) !important; }

.footer a::after, .header a::after, .description-product span::after, .description span::after { content: ''; display: block; width: 100%; height: 1px; position: absolute; background-color: currentColor; left: 0; bottom: -2px; -webkit-transform: scaleX(0); transform: scaleX(0); -webkit-transform-origin: 100% 0; transform-origin: 100% 0; transition: transform 0.3s cubic-bezier(0.46, 0.03, 0.52, 0.96), -webkit-transform 0.3s cubic-bezier(0.46, 0.03, 0.52, 0.96); }

.footer a:hover::after, .header a:hover::after, .description-product span:hover::after, .description span:hover::after { -webkit-transform: scaleX(1); transform: scaleX(1); -webkit-transform-origin: 0 0; transform-origin: 0 0; }

.border-banner:hover::after { opacity: 1; width: calc(100% - 36px); height: calc(100% - 36px); left: 18px; top: 18px; position: absolute; top: 18px; left: 18px; }

.border-banner::after { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; border: 1px solid var(--color-s-1); opacity: 0; -webkit-transform: scale(1); transform: scale(1); -webkit-transition: all 0.2s cubic-bezier(0.46, 0.03, 0.52, 0.96); transition: all 0.2s cubic-bezier(0.46, 0.03, 0.52, 0.96); }

/******************************************************* 01. Swiper / No load + Splider 02. Fancybox */
/*============== 01. Swiper =============== .swiper-container { @include size(100%, 100%); } .swiper-slide { text-align: center; font-size: 18px; display: flex; justify-content: center; align-items: center; } .swiper-slide img { display: block; @include size(100%, 100%); object-fit: cover; } .swiper-button-next::after { content: url('/src/assets/icon/arrow-white.svg') !important; transform: rotate(180deg); } .swiper-button-prev::after { content: url('/src/assets/icon/arrow-white.svg') !important; } .main__products .swiper-button-next::after { content: url('/src/assets/icon/arrow-black.svg') !important; transform: rotate(180deg); } .main__products .swiper-button-prev::after { content: url('/src/assets/icon/arrow-black.svg') !important; } .swiper-button-next, .swiper-button-prev { padding: 0 2em; } .swiper-pagination-bullet-active { background: var(--color-s-1) !important; @include size(0.5em !important, 0.5em !important); } .swiper-pagination-bullet { @include size(0.5em !important, 0.5em !important); } */
.splide-cover, .splide-cover .splide__track, .splide-cover .splide__track ul { height: 100% !important; width: 100% !important; }

.splide-cover svg { fill: var(--color-white); }

.splide__pagination { display: none !important; }

.splide__arrow { opacity: 1 !important; background: #0000 !important; }

.splide__arrow--prev svg, .splide__arrow--next svg { font-size: 2em !important; }

.splide__arrow--prev svg { -webkit-transform: rotate(0deg) !important; transform: rotate(0deg) !important; }

.splide__arrow--next svg { -webkit-transform: rotate(180deg) !important; transform: rotate(180deg) !important; }

/*============== 01. Fancybox ===============*/
.fancybox-progress { background: var(--color-s-1) !important; }

.fancybox-thumbs__list a::before { border: 3px solid var(--color-s-1) !important; }

* { margin: 0; padding: 0; }

a:link, a:visited, a:active { text-decoration: none; }

html, body { width: 100%; height: auto; }

/* Typography */
h1, h2, h3, h4, h5, h6 { font-family: var(--font-josefin-sans); color: var(--color-black); }

p { font-family: var(--font-montserrat); line-height: 1.714em; }

.epigraph { font-family: var(--font-great-vibes); font-size: var(--epigraph); color: var(--color-s-1); }

a { font-weight: 400; color: var(--color-black); -webkit-transition: var(--transition-fast); transition: var(--transition-fast); font-family: var(--font-montserrat); cursor: pointer; }

a:hover { color: var(--color-s-1); -webkit-transition: var(--transition-fast); transition: var(--transition-fast); }

.description-product h4:hover, .description-product a:hover, .aside-description a:hover { color: var(--color-s-1); -webkit-transition: var(--transition-fast); transition: var(--transition-fast); }

.product__content-info h2 { text-transform: uppercase; font-family: var(--font-josefin-sans) !important; font-weight: 700; color: var(--color-black); letter-spacing: .09em; word-wrap: break-word; }

.product__content-info > span:nth-child(2), .product-meta span { font-weight: 700; text-transform: uppercase; color: var(--color-black); font-size: 30px; letter-spacing: .04em; font-family: var(--font-montserrat); font-weight: 300; letter-spacing: 0; }

/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */
/* Document ========================================================================== */
/** 1. Correct the line height in all browsers. 2. Prevent adjustments of font size after orientation changes in iOS. */
html { line-height: 1.15; /* 1 */ -webkit-text-size-adjust: 100%; /* 2 */ }

iframe { border: 0px !important; }

/* Sections ========================================================================== */
/** Remove the margin in all browsers. */
body { margin: 0; }

/** Render the `main` element consistently in IE. */
main { display: block; }

/** Correct the font size and margin on `h1` elements within `section` and `article` contexts in Chrome, Firefox, and Safari. */
h1 { margin: 0; }

/* Grouping content ========================================================================== */
/** 1. Add the correct box sizing in Firefox. 2. Show the overflow in Edge and IE. */
hr { -webkit-box-sizing: content-box; box-sizing: content-box; /* 1 */ height: 0; /* 1 */ overflow: visible; /* 2 */ }

/** 1. Correct the inheritance and scaling of font size in all browsers. 2. Correct the odd `em` font sizing in all browsers. */
pre { font-family: monospace, monospace; /* 1 */ font-size: 1em; /* 2 */ }

/* Text-level semantics ========================================================================== */
/** Remove the gray background on active links in IE 10. */
a { background-color: transparent; }

/** 1. Remove the bottom border in Chrome 57- 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari. */
abbr[title] { border-bottom: none; /* 1 */ text-decoration: underline; /* 2 */ -webkit-text-decoration: underline dotted; text-decoration: underline dotted; /* 2 */ }

/** Add the correct font weight in Chrome, Edge, and Safari. */
b, strong { font-weight: bolder; }

/** 1. Correct the inheritance and scaling of font size in all browsers. 2. Correct the odd `em` font sizing in all browsers. */
code, kbd, samp { font-family: monospace, monospace; /* 1 */ font-size: 1em; /* 2 */ }

/** Add the correct font size in all browsers. */
small { font-size: 80%; }

/** Prevent `sub` and `sup` elements from affecting the line height in all browsers. */
sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }

sub { bottom: -0.25em; }

sup { top: -0.5em; }

/* Embedded content ========================================================================== */
/** Remove the border on images inside links in IE 10. */
img { border-style: none; }

/* Forms ========================================================================== */
/** 1. Change the font styles in all browsers. 2. Remove the margin in Firefox and Safari. */
button, input, optgroup, select, textarea { font-family: inherit; /* 1 */ font-size: 100%; /* 1 */ line-height: 1.15; /* 1 */ margin: 0; /* 2 */ }

/** Show the overflow in IE. 1. Show the overflow in Edge. */
button, input { /* 1 */ overflow: visible; }

/** Remove the inheritance of text transform in Edge, Firefox, and IE. 1. Remove the inheritance of text transform in Firefox. */
button, select { /* 1 */ text-transform: none; }

/** Correct the inability to style clickable types in iOS and Safari. */
button, [type="button"], [type="reset"], [type="submit"] { -webkit-appearance: button; }

/** Remove the inner border and padding in Firefox. */
button::-moz-focus-inner, [type="button"]::-moz-focus-inner, [type="reset"]::-moz-focus-inner, [type="submit"]::-moz-focus-inner { border-style: none; padding: 0; }

/** Restore the focus styles unset by the previous rule. */
button:-moz-focusring, [type="button"]:-moz-focusring, [type="reset"]:-moz-focusring, [type="submit"]:-moz-focusring { outline: 1px dotted ButtonText; }

/** Correct the padding in Firefox. */
fieldset { padding: 0.35em 0.75em 0.625em; }

/** 1. Correct the text wrapping in Edge and IE. 2. Correct the color inheritance from `fieldset` elements in IE. 3. Remove the padding so developers are not caught out when they zero out `fieldset` elements in all browsers. */
legend { -webkit-box-sizing: border-box; box-sizing: border-box; /* 1 */ color: inherit; /* 2 */ display: table; /* 1 */ max-width: 100%; /* 1 */ padding: 0; /* 3 */ white-space: normal; /* 1 */ }

/** Add the correct vertical alignment in Chrome, Firefox, and Opera. */
progress { vertical-align: baseline; }

/** Remove the default vertical scrollbar in IE 10+. */
textarea { overflow: auto; }

/** 1. Add the correct box sizing in IE 10. 2. Remove the padding in IE 10. */
[type="checkbox"], [type="radio"] { -webkit-box-sizing: border-box; box-sizing: border-box; /* 1 */ padding: 0; /* 2 */ }

/** Correct the cursor style of increment and decrement buttons in Chrome. */
[type="number"]::-webkit-inner-spin-button, [type="number"]::-webkit-outer-spin-button { height: auto; }

/** 1. Correct the odd appearance in Chrome and Safari. 2. Correct the outline style in Safari. */
[type="search"] { -webkit-appearance: textfield; /* 1 */ outline-offset: -2px; /* 2 */ }

/** Remove the inner padding in Chrome and Safari on macOS. */
[type="search"]::-webkit-search-decoration { -webkit-appearance: none; }

/** 1. Correct the inability to style clickable types in iOS and Safari. 2. Change font properties to `inherit` in Safari. */
::-webkit-file-upload-button { -webkit-appearance: button; /* 1 */ font: inherit; /* 2 */ }

/* Interactive ========================================================================== */
/* Add the correct display in Edge, IE 10+, and Firefox. */
details { display: block; }

/* Add the correct display in all browsers. */
summary { display: list-item; }

/* Misc ========================================================================== */
/** Add the correct display in IE 10+. */
template { display: none; }

/** Add the correct display in IE 10. */
[hidden] { display: none; }

/*============== Root typography ===============*/
@media (min-width: 1200px) { :root { --h1-font-size: 3.125rem; --h2-font-size: 2.5rem; --h3-font-size: 1.25rem; --paragraph-font-size: 1.0625rem; --epigraph: 1.75rem; --little-font-size: 1.25rem; } }

@media (min-width: 992px) and (max-width: 1199.98px) { :root { --h1-font-size: 3.125rem; --h2-font-size: 2.5rem; --h3-font-size: 1.25rem; --paragraph-font-size: 1.0625rem; --epigraph: 1.75rem; --little-font-size: 1.25rem; } }

@media (min-width: 768px) and (max-width: 991.98px) { :root { --h1-font-size: 2.5rem; --h2-font-size: 1.875rem; --h3-font-size: 1.25rem; --paragraph-font-size: 1rem; --epigraph: 1.5625rem; --little-font-size: 1.25rem; } }

@media (min-width: 576px) and (max-width: 767.98px) { :root { --h1-font-size: 2.5rem; --h2-font-size: 1.875rem; --h3-font-size: 1.25rem; --paragraph-font-size: 1rem; --epigraph: 1.5625rem; --little-font-size: 1.25rem; } }

@media (max-width: 575.98px) { :root { --h1-font-size: 1.875rem; --h2-font-size: 1.5625rem; --h3-font-size: 1.25rem; --paragraph-font-size: 1rem; --epigraph: 1.25rem; --little-font-size: 1.25rem; } }

h1 { font-size: var(--h1-font-size); }

h2 { font-size: var(--h2-font-size); }

h3 { font-size: var(--h3-font-size); }

p { font-size: var(--paragraph-font-size); }

@font-face { font-family: 'Josefin Sans'; src: url("/src/assets/typography/JosefinSans-Bold.eot"); src: url("/src/assets/typography/JosefinSans-Bold.eot?#iefix") format("embedded-opentype"), url("/src/assets/typography/JosefinSans-Bold.woff2") format("woff2"), url("/src/assets/typography/JosefinSans-Bold.woff") format("woff"), url("/src/assets/typography/JosefinSans-Bold.ttf") format("truetype"); font-weight: bold; font-style: normal; }

@font-face { font-family: 'Josefin Sans'; src: url("/src/assets/typography/JosefinSans-ExtraLight.eot"); src: url("/src/assets/typography/JosefinSans-ExtraLight.eot?#iefix") format("embedded-opentype"), url("/src/assets/typography/JosefinSans-ExtraLight.woff2") format("woff2"), url("/src/assets/typography/JosefinSans-ExtraLight.woff") format("woff"), url("/src/assets/typography/JosefinSans-ExtraLight.ttf") format("truetype"); font-weight: 200; font-style: normal; }

@font-face { font-family: 'Josefin Sans'; src: url("/src/assets/typography/JosefinSans-BoldItalic.eot"); src: url("/src/assets/typography/JosefinSans-BoldItalic.eot?#iefix") format("embedded-opentype"), url("/src/assets/typography/JosefinSans-BoldItalic.woff2") format("woff2"), url("/src/assets/typography/JosefinSans-BoldItalic.woff") format("woff"), url("/src/assets/typography/JosefinSans-BoldItalic.ttf") format("truetype"); font-weight: bold; font-style: italic; }

@font-face { font-family: 'Josefin Sans'; src: url("/src/assets/typography/JosefinSans-ExtraLightItalic.eot"); src: url("/src/assets/typography/JosefinSans-ExtraLightItalic.eot?#iefix") format("embedded-opentype"), url("/src/assets/typography/JosefinSans-ExtraLightItalic.woff2") format("woff2"), url("/src/assets/typography/JosefinSans-ExtraLightItalic.woff") format("woff"), url("/src/assets/typography/JosefinSans-ExtraLightItalic.ttf") format("truetype"); font-weight: 200; font-style: italic; }

@font-face { font-family: 'Josefin Sans'; src: url("/src/assets/typography/JosefinSans-LightItalic.eot"); src: url("/src/assets/typography/JosefinSans-LightItalic.eot?#iefix") format("embedded-opentype"), url("/src/assets/typography/JosefinSans-LightItalic.woff2") format("woff2"), url("/src/assets/typography/JosefinSans-LightItalic.woff") format("woff"), url("/src/assets/typography/JosefinSans-LightItalic.ttf") format("truetype"); font-weight: 300; font-style: italic; }

@font-face { font-family: 'Josefin Sans'; src: url("/src/assets/typography/JosefinSans-Italic.eot"); src: url("/src/assets/typography/JosefinSans-Italic.eot?#iefix") format("embedded-opentype"), url("/src/assets/typography/JosefinSans-Italic.woff2") format("woff2"), url("/src/assets/typography/JosefinSans-Italic.woff") format("woff"), url("/src/assets/typography/JosefinSans-Italic.ttf") format("truetype"); font-weight: normal; font-style: italic; }

@font-face { font-family: 'Josefin Sans'; src: url("/src/assets/typography/JosefinSans-Light.eot"); src: url("/src/assets/typography/JosefinSans-Light.eot?#iefix") format("embedded-opentype"), url("/src/assets/typography/JosefinSans-Light.woff2") format("woff2"), url("/src/assets/typography/JosefinSans-Light.woff") format("woff"), url("/src/assets/typography/JosefinSans-Light.ttf") format("truetype"); font-weight: 300; font-style: normal; }

@font-face { font-family: 'Josefin Sans'; src: url("/src/assets/typography/JosefinSans-MediumItalic.eot"); src: url("/src/assets/typography/JosefinSans-MediumItalic.eot?#iefix") format("embedded-opentype"), url("/src/assets/typography/JosefinSans-MediumItalic.woff2") format("woff2"), url("/src/assets/typography/JosefinSans-MediumItalic.woff") format("woff"), url("/src/assets/typography/JosefinSans-MediumItalic.ttf") format("truetype"); font-weight: 500; font-style: italic; }

@font-face { font-family: 'Josefin Sans'; src: url("/src/assets/typography/JosefinSans-Regular.eot"); src: url("/src/assets/typography/JosefinSans-Regular.eot?#iefix") format("embedded-opentype"), url("/src/assets/typography/JosefinSans-Regular.woff2") format("woff2"), url("/src/assets/typography/JosefinSans-Regular.woff") format("woff"), url("/src/assets/typography/JosefinSans-Regular.ttf") format("truetype"); font-weight: normal; font-style: normal; }

@font-face { font-family: 'Josefin Sans'; src: url("/src/assets/typography/JosefinSans-SemiBold.eot"); src: url("/src/assets/typography/JosefinSans-SemiBold.eot?#iefix") format("embedded-opentype"), url("/src/assets/typography/JosefinSans-SemiBold.woff2") format("woff2"), url("/src/assets/typography/JosefinSans-SemiBold.woff") format("woff"), url("/src/assets/typography/JosefinSans-SemiBold.ttf") format("truetype"); font-weight: 600; font-style: normal; }

@font-face { font-family: 'Josefin Sans'; src: url("/src/assets/typography/JosefinSans-Medium.eot"); src: url("/src/assets/typography/JosefinSans-Medium.eot?#iefix") format("embedded-opentype"), url("/src/assets/typography/JosefinSans-Medium.woff2") format("woff2"), url("/src/assets/typography/JosefinSans-Medium.woff") format("woff"), url("/src/assets/typography/JosefinSans-Medium.ttf") format("truetype"); font-weight: 500; font-style: normal; }

@font-face { font-family: 'Josefin Sans'; src: url("/src/assets/typography/JosefinSans-ThinItalic.eot"); src: url("/src/assets/typography/JosefinSans-ThinItalic.eot?#iefix") format("embedded-opentype"), url("/src/assets/typography/JosefinSans-ThinItalic.woff2") format("woff2"), url("/src/assets/typography/JosefinSans-ThinItalic.woff") format("woff"), url("/src/assets/typography/JosefinSans-ThinItalic.ttf") format("truetype"); font-weight: 100; font-style: italic; }

@font-face { font-family: 'Josefin Sans'; src: url("/src/assets/typography/JosefinSans-SemiBoldItalic.eot"); src: url("/src/assets/typography/JosefinSans-SemiBoldItalic.eot?#iefix") format("embedded-opentype"), url("/src/assets/typography/JosefinSans-SemiBoldItalic.woff2") format("woff2"), url("/src/assets/typography/JosefinSans-SemiBoldItalic.woff") format("woff"), url("/src/assets/typography/JosefinSans-SemiBoldItalic.ttf") format("truetype"); font-weight: 600; font-style: italic; }

@font-face { font-family: 'Josefin Sans'; src: url("/src/assets/typography/JosefinSans-Thin.eot"); src: url("/src/assets/typography/JosefinSans-Thin.eot?#iefix") format("embedded-opentype"), url("/src/assets/typography/JosefinSans-Thin.woff2") format("woff2"), url("/src/assets/typography/JosefinSans-Thin.woff") format("woff"), url("/src/assets/typography/JosefinSans-Thin.ttf") format("truetype"); font-weight: 100; font-style: normal; }

@font-face { font-family: 'Great Vibes'; src: url("/src/assets/typography/GreatVibes-Regular.eot"); src: url("/src/assets/typography/GreatVibes-Regular.eot?#iefix") format("embedded-opentype"), url("/src/assets/typography/GreatVibes-Regular.woff2") format("woff2"), url("/src/assets/typography/GreatVibes-Regular.woff") format("woff"), url("/src/assets/typography/GreatVibes-Regular.ttf") format("truetype"); font-weight: normal; font-style: normal; }

.footer { -ms-grid-row: 3; -ms-grid-column: 1; -ms-grid-column-span: 3; grid-area: Footer; display: -ms-grid; display: grid; grid-template-columns: 1fr; grid-template-rows: auto -webkit-min-content; grid-template-rows: auto min-content; width: 100%; height: 70vh; }

.footer__content > a::after { content: ''; display: none !important; }

.footer__content { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; grid-gap: 2em; background: var(--color-white); }

@media (min-width: 1200px) { .footer__content { padding: 0 20vh; } }

@media (min-width: 992px) and (max-width: 1199.98px) { .footer__content { padding: 0 20vh; } }

@media (min-width: 768px) and (max-width: 991.98px) { .footer__content { padding: 0 20vh; } }

@media (min-width: 576px) and (max-width: 767.98px) { .footer__content { padding: 10vh 2em; } }

@media (max-width: 575.98px) { .footer__content { padding: 10vh 2em; } }

.footer__content p { text-align: center; }

.footer__content img { width: 10em; -webkit-box-align: center; -ms-flex-align: center; align-items: center; }

.footer__standing-bar { height: -webkit-min-content; height: -moz-min-content; height: min-content; -ms-grid-row: 2; grid-row: 2; -ms-flex-item-align: end; -ms-grid-row-align: end; align-self: end; background: var(--color-s-2); }

.footer__standing-bar ul { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; text-decoration: none; list-style: none; grid-gap: 2em; height: 60px; }

@media (min-width: 576px) and (max-width: 767.98px) { .footer__standing-bar ul { height: auto; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; padding: 2em 0; grid-gap: 14px; } }

@media (max-width: 575.98px) { .footer__standing-bar ul { height: auto; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; padding: 2em 0; grid-gap: 14px; } }

@media (min-width: 576px) and (max-width: 767.98px) { .footer__standing-bar ul li { margin: 0.3em 0; } }

@media (max-width: 575.98px) { .footer__standing-bar ul li { margin: 0.3em 0; } }

.footer__standing-bar ul li a { text-decoration: none; color: var(--color-black); text-transform: uppercase; font-size: 0.75rem; line-height: 1.1em; letter-spacing: .09em; font-weight: 700; text-transform: uppercase; }

.footer a { line-height: 1.1em; letter-spacing: .09em; font-family: var(--font-josefin-sans); font-weight: 700; text-transform: uppercase; color: var(--color-black); font-size: 0.75rem; position: relative; }

.footer__links a { font-size: 2em; margin: 0 0.3em; }

.footer__links a::after { display: none; }

.footer__links { display: -webkit-box; display: -ms-flexbox; display: flex; padding: 0 1em; }

.footer__links i { -webkit-transition: var(--transition-fast); transition: var(--transition-fast); }

.footer__links i:hover { -webkit-transition: var(--transition-fast); transition: var(--transition-fast); color: var(--color-s-1); }

.fab { font-size: 1.625rem; }

/*******************************************************

        01. Container Page
        02. Page Internal
            Main
            About
            Shop
            Product
            Brands
            Brand
            Video
            Contact

*******************************************************/
/*============== 01. Container Page ===============*/
.container { display: -ms-grid; display: grid; -ms-grid-columns: (1fr)[3]; grid-template-columns: repeat(3, 1fr); -ms-grid-rows: auto; grid-template-rows: auto; grid-template-areas: "Header Header Header"
 "Main Main Main"
 "Footer Footer Footer"; }

.main__cover-filing h2 { position: absolute; color: var(--color-white); text-transform: uppercase; }

.main__cover-filing img { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; pointer-events: none; -webkit-filter: brightness(0.4); filter: brightness(0.4); }

.main__cover-filing { -ms-grid-row: 1; -ms-grid-column: 1; grid-area: Filing; }

/*============== 02. Page Internal - Main ===============*/
.main { -ms-grid-row: 2; -ms-grid-column: 1; -ms-grid-column-span: 3; grid-area: Main; width: 100%; height: 100%; display: -ms-grid; display: grid; -ms-grid-columns: (auto)[1]; grid-template-columns: repeat(1, auto); -ms-grid-rows: auto; grid-template-rows: auto; grid-template-areas: "cover" "products" "about" "section" "testimonials" "contact" "gallery"; }

.main__cover { -ms-grid-row: 1; -ms-grid-column: 1; grid-area: cover; height: 95vh; }

.main__products { -ms-grid-row: 2; -ms-grid-column: 1; grid-area: products; min-width: 100%; }

.main__about--section, .main__testimonials, .main__contact { -ms-grid-row: 3; -ms-grid-column: 1; grid-area: about; }

.main__text--section { -ms-grid-row: 4; -ms-grid-column: 1; grid-area: section; }

.main__testimonials { -ms-grid-row: 5; -ms-grid-column: 1; grid-area: testimonials; }

.main__contact { -ms-grid-row: 6; -ms-grid-column: 1; grid-area: contact; }

.main__gallery { -ms-grid-row: 7; -ms-grid-column: 1; grid-area: gallery; }

/*============== 01. Page Internal - About ===============*/
.main--about { -ms-grid-row: 2; -ms-grid-column: 1; -ms-grid-column-span: 3; grid-area: Main; display: -ms-grid; display: grid; -ms-grid-columns: (1fr)[1]; grid-template-columns: repeat(1, 1fr); -ms-grid-rows: auto; grid-template-rows: auto; grid-template-areas: "Filing" "About"; }

.main--about .main__about { -ms-grid-row: 2; -ms-grid-column: 1; grid-area: About; }

/*============== 02. Page Internal - Shop ===============*/
.main--shop { -ms-grid-row: 2; -ms-grid-column: 1; -ms-grid-column-span: 3; grid-area: Main; display: -ms-grid; display: grid; -ms-grid-columns: (auto)[1]; grid-template-columns: repeat(1, auto); -ms-grid-rows: auto; grid-template-rows: auto; grid-template-areas: "Filing" "Shop"; background: var(--color-s-2); }

/*============== 02. Page Internal - Product ===============*/
.main--product { -ms-grid-row: 2; -ms-grid-column: 1; -ms-grid-column-span: 3; grid-area: Main; display: -ms-grid; display: grid; -ms-grid-columns: (auto)[1]; grid-template-columns: repeat(1, auto); -ms-grid-rows: auto; grid-template-rows: auto; grid-template-areas: "Filing" "Product"; background: var(--color-s-2); }

.main__product { -ms-grid-row: 2; -ms-grid-column: 1; grid-area: Product; }

/*============== 02. Page Internal - Brands ===============*/
.main--brands { -ms-grid-row: 2; -ms-grid-column: 1; -ms-grid-column-span: 3; grid-area: Main; display: -ms-grid; display: grid; -ms-grid-columns: (auto)[1]; grid-template-columns: repeat(1, auto); -ms-grid-rows: auto; grid-template-rows: auto; grid-template-areas: "Filing" "Brands"; background: var(--color-s-2); }

.main__brands { -ms-grid-row: 2; -ms-grid-column: 1; grid-area: Brands; }

/*============== 02. Page Internal - Brand ===============*/
.main--brand { -ms-grid-row: 2; -ms-grid-column: 1; -ms-grid-column-span: 3; grid-area: Main; display: -ms-grid; display: grid; -ms-grid-columns: (1fr)[1]; grid-template-columns: repeat(1, 1fr); -ms-grid-rows: auto; grid-template-rows: auto; grid-template-areas: "Filing" "Brand"; background: var(--color-s-2); }

.main__brand { -ms-grid-row: 2; -ms-grid-column: 1; grid-area: Brand; }

/*============== 02. Page Internal - Video ===============*/
.main--video { -ms-grid-row: 2; -ms-grid-column: 1; -ms-grid-column-span: 3; grid-area: Main; display: -ms-grid; display: grid; -ms-grid-columns: (1fr)[1]; grid-template-columns: repeat(1, 1fr); -ms-grid-rows: auto; grid-template-rows: auto; grid-template-areas: "Filing" "Video"; background: var(--color-s-2); }

.main__video { -ms-grid-row: 2; -ms-grid-column: 1; grid-area: Video; }

/*============== 02. Page Internal - Contact ===============*/
.main--contact { -ms-grid-row: 2; -ms-grid-column: 1; -ms-grid-column-span: 3; grid-area: Main; display: -ms-grid; display: grid; -ms-grid-columns: (auto)[1]; grid-template-columns: repeat(1, auto); -ms-grid-rows: auto; grid-template-rows: auto; grid-template-areas: "Filing" "Contact" "Map"; }

.main__form { -ms-grid-row: 2; -ms-grid-column: 1; grid-area: Contact; }

.main__map { -ms-grid-row: 3; -ms-grid-column: 1; grid-area: Map; width: 100%; height: 70vh; }

.header { -ms-grid-row: 1; -ms-grid-column: 1; -ms-grid-column-span: 3; grid-area: Header; height: -webkit-min-content; height: -moz-min-content; height: min-content; padding: 1em 0; }

@media (min-width: 576px) and (max-width: 767.98px) { .header { padding: 0px; } }

@media (max-width: 575.98px) { .header { padding: 0px; } }

.header ul { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; grid-gap: 3em; width: 100%; }

@media (min-width: 576px) and (max-width: 767.98px) { .header ul { display: none; } }

@media (max-width: 575.98px) { .header ul { display: none; } }

.header li { text-decoration: none; list-style: none; }

.header img { width: 200px; height: 120px; -o-object-fit: cover; object-fit: cover; }

@media (min-width: 576px) and (max-width: 767.98px) { .header img { width: 100px; height: 120px; } }

@media (max-width: 575.98px) { .header img { width: 100px; height: 120px; } }

.header nav { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -ms-flex-align: center; align-items: center; grid-gap: 2em; }

.header a { line-height: 1.1em; letter-spacing: .09em; font-family: var(--font-josefin-sans); font-weight: 700; text-transform: uppercase; color: var(--color-black); font-size: 0.75rem; position: relative; }

.logo a::after { display: none; }

/*============== 01. Menu - Header ===============*/
@media (min-width: 576px) and (max-width: 767.98px) { .header nav { display: -ms-grid; display: grid; -ms-grid-columns: (1fr)[2]; grid-template-columns: repeat(2, 1fr); -ms-grid-rows: auto; grid-template-rows: auto; padding: 0 1.25rem; } }

@media (max-width: 575.98px) { .header nav { display: -ms-grid; display: grid; -ms-grid-columns: (1fr)[2]; grid-template-columns: repeat(2, 1fr); -ms-grid-rows: auto; grid-template-rows: auto; padding: 0 1.25rem; } }

.button-mobile { display: none; border: 0px; background: none; cursor: pointer; padding: 1em; width: -webkit-max-content; width: -moz-max-content; width: max-content; -ms-grid-column-align: end; justify-self: end; }

@media (min-width: 576px) and (max-width: 767.98px) { .button-mobile { display: block; } }

@media (max-width: 575.98px) { .button-mobile { display: block; } }

.mobile-nav { -webkit-transition: all .5s ease-out; transition: all .5s ease-out; position: absolute; width: 100%; background: var(--color-white); max-height: 280px; z-index: 1; overflow: hidden; height: 0; top: 0px; left: 0px; right: 0px; bottom: 0px; border-top: 1px solid var(--color-s-1); -webkit-transform: translateY(7.7em); transform: translateY(7.7em); -webkit-animation: heightNegative 0.5s ease-in-out both; animation: heightNegative 0.5s ease-in-out both; opacity: 0; }

@media (min-width: 1200px) { .mobile-nav { display: none; } }

@media (min-width: 992px) and (max-width: 1199.98px) { .mobile-nav { display: none; } }

@media (min-width: 768px) and (max-width: 991.98px) { .mobile-nav { display: none; } }

.nav-open { -webkit-animation: heightPositive 1s ease-in-out forwards; animation: heightPositive 1s ease-in-out forwards; opacity: 1; }

@-webkit-keyframes heightPositive { 0% { height: 0%; }
  50% { height: 50%; }
  100% { height: 100%; } }

@keyframes heightPositive { 0% { height: 0%; }
  50% { height: 50%; }
  100% { height: 100%; } }

@-webkit-keyframes heightNegative { 0% { height: 100%; }
  50% { height: 50%; }
  100% { height: 0%; } }

@keyframes heightNegative { 0% { height: 100%; }
  50% { height: 50%; }
  100% { height: 0%; } }

.mobile-nav ul { padding: 0 2em; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; width: auto; height: 100%; grid-gap: 0em !important; -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; }

.mobile-nav ul li { margin: 0.5em 0; }

.logo { width: 100%; text-align: center; }

@media (min-width: 576px) and (max-width: 767.98px) { .logo { text-align: left; } }

@media (max-width: 575.98px) { .logo { text-align: left; } }

.button-mobile svg { width: 70% !important; }

/*============== 02. Brand ===============*/
.nav-brand ul { background: var(--color-white); width: auto; height: 0px; -webkit-transition: var(--transition-fast); transition: var(--transition-fast); opacity: 0; position: absolute; top: 12em; padding: 2em; z-index: 1; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; grid-gap: 0.5em; visibility: hidden; overflow: hidden; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; }

.nav-brand:hover ul { visibility: visible; overflow: hidden; opacity: 1; height: 150px; -webkit-transition: var(--transition-fast); transition: var(--transition-fast); }

.nav-brand img { width: 1.2em !important; height: 1.2em !important; margin: 0 0 0 1em !important; vertical-align: bottom !important; }

.nav-brand::after { content: ''; display: block; width: 60px; height: 60px; position: absolute; }

.lenguaje { border: 0px; display: -webkit-box; display: -ms-flexbox; display: flex; cursor: pointer; }

.lenguaje img { width: 20px !important; height: 15px !important; }

.lenguaje-item { display: -webkit-box; display: -ms-flexbox; display: flex; }

.lenguaje-item button { margin: 0 1em 0 0; }

.button-link { color: var(--color-white); background-color: var(--color-s-1); position: relative; border: 2px solid #fff0; padding: 0.8rem 2rem; font-family: var(--font-josefin-sans); text-transform: uppercase; font-size: 12px; font-weight: 700; letter-spacing: .06em; }

.button-link { color: var(--color-white); background-color: var(--color-s-1); position: relative; border: 2px solid transparent; }

.button-link { position: relative; display: inline-block; vertical-align: middle; width: auto; margin: 0; font-family: "Josefin Sans", sans-serif; font-size: 12px; line-height: 1em; font-weight: 700; text-decoration: none; text-transform: uppercase; letter-spacing: .06em; border-radius: 0; outline: 0; -webkit-box-sizing: border-box; box-sizing: border-box; -webkit-transition: color .2s ease-out, background-color .2s ease-out, border-color .2s ease-out; transition: color .2s ease-out, background-color .2s ease-out, border-color .2s ease-out; padding: 16px 32px; }

.button-link:hover { color: var(--color-white); background-color: var(--color-s-1); }

.button-link:hover::after { width: calc(100% + 10px); height: calc(100% + 10px); border-color: var(--color-s-1); opacity: 1; right: 0px; left: -5px; top: -5px; }

.button-link::after { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; border: 1px solid var(--color-white); opacity: .6; -webkit-box-sizing: border-box; box-sizing: border-box; -webkit-transition: all 0.2s cubic-bezier(0.46, 0.03, 0.52, 0.96); transition: all 0.2s cubic-bezier(0.46, 0.03, 0.52, 0.96); }

.read-more { padding: 0; color: var(--color-white); position: relative; display: inline-block; vertical-align: middle; width: auto; margin: 0; font-family: var(--font-josefin-sans); font-size: 12px; line-height: 1em; font-weight: 700; text-decoration: none; text-transform: uppercase; letter-spacing: .06em; border-radius: 0; outline: 0; -webkit-box-sizing: border-box; box-sizing: border-box; -webkit-transition: color .2s ease-out, background-color .2s ease-out,
 border-color .2s ease-out; transition: color .2s ease-out, background-color .2s ease-out,
 border-color .2s ease-out; background-color: transparent; }

.read-more::after, .read-more::before { content: ''; position: absolute; bottom: 0; left: 0; display: block; width: 100%; height: 1px; background-color: currentColor; -webkit-transform: scaleX(0); transform: scaleX(0); -webkit-transform-origin: 0 0; transform-origin: 0 0; -webkit-transition: 0.3s cubic-bezier(0.46, 0.03, 0.52, 0.96); transition: 0.3s cubic-bezier(0.46, 0.03, 0.52, 0.96); }

.read-more::after { -webkit-transform: scaleX(1); transform: scaleX(1); -webkit-transform-origin: 100% 0; transform-origin: 100% 0; -webkit-transition: 0.3s cubic-bezier(0.46, 0.03, 0.52, 0.96) 0.2s; transition: 0.3s cubic-bezier(0.46, 0.03, 0.52, 0.96) 0.2s; }

.read-more:hover::before { -webkit-transform: scaleX(1); transform: scaleX(1); -webkit-transition: 0.3s cubic-bezier(0.46, 0.03, 0.52, 0.96) 0.2s; transition: 0.3s cubic-bezier(0.46, 0.03, 0.52, 0.96) 0.2s; }

/*============== 01. Brands ===============*/
.main__brands { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; grid-gap: 5em; padding-top: 6.25rem; padding-bottom: 6.25rem; }

.brands { display: -ms-grid; display: grid; -ms-grid-columns: (1fr)[2]; grid-template-columns: repeat(2, 1fr); -ms-grid-rows: auto; grid-template-rows: auto; }

.brands__lightbox { display: -ms-grid; display: grid; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; padding: 0.7em; grid-gap: 0.7em; -ms-grid-columns: (1fr)[4]; grid-template-columns: repeat(4, 1fr); }

@media (min-width: 576px) and (max-width: 767.98px) { .brands__lightbox { -ms-grid-columns: (1fr)[1]; grid-template-columns: repeat(1, 1fr); } }

@media (max-width: 575.98px) { .brands__lightbox { -ms-grid-columns: (1fr)[1]; grid-template-columns: repeat(1, 1fr); } }

.brands__lightbox a { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; }

.brands__lightbox img { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; -webkit-transition: var(--transition-fast); transition: var(--transition-fast); }

.brands__lightbox img:hover { -webkit-filter: grayscale(100%) contrast(80%); filter: grayscale(100%) contrast(80%); -webkit-transition: var(--transition-fast); transition: var(--transition-fast); }

.brands__lightbox a { width: 100% !important; height: 500px; }

.brands img { width: 28.125rem; -ms-flex-item-align: center; -ms-grid-row-align: center; align-self: center; -ms-grid-column-align: center; justify-self: center; }

.brands__info { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; grid-gap: 1em; }

.brands__info h2, .brands__info a { text-transform: uppercase; }

.brands__info a { width: -webkit-max-content; width: -moz-max-content; width: max-content; }

.brands__content { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; }

.main--brands #brands-ide a span { position: absolute; -ms-grid-column-align: center; justify-self: center; -ms-flex-item-align: center; -ms-grid-row-align: center; align-self: center; text-transform: uppercase; color: var(--color-white); font-family: var(--font-josefin-sans); font-size: calc(var(--h3-font-size) + 10px); -webkit-transition: var(--transition-fast); transition: var(--transition-fast); opacity: 0; }

.main--brands #brands-ide a:hover span { -webkit-transition: var(--transition-fast); transition: var(--transition-fast); opacity: 1; z-index: 0; pointer-events: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; }

/*============== 02. Brand ===============*/
.brand { grid-gap: 5em; padding: 5em 0; display: -ms-grid; display: grid; -ms-grid-columns: (1fr)[2]; grid-template-columns: repeat(2, 1fr); }

@media (min-width: 576px) and (max-width: 767.98px) { .brand { -ms-grid-columns: (1fr)[1]; grid-template-columns: repeat(1, 1fr); padding: 5em 0; } }

@media (max-width: 575.98px) { .brand { -ms-grid-columns: (1fr)[1]; grid-template-columns: repeat(1, 1fr); padding: 5em 0; } }

.brand.grid img { -ms-grid-column-align: center; justify-self: center; -ms-flex-item-align: center; -ms-grid-row-align: center; align-self: center; width: 300px; height: 200px; -o-object-fit: contain; object-fit: contain; }

.brand__content { grid-gap: 1em; text-align: justify; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; }

@media (min-width: 576px) and (max-width: 767.98px) { .brand__content { -webkit-box-align: center; -ms-flex-align: center; align-items: center; padding: 0 1em; } }

@media (max-width: 575.98px) { .brand__content { -webkit-box-align: center; -ms-flex-align: center; align-items: center; padding: 0 1em; } }

.brand__content.brand__column { display: block; }

.brand__content.brand__column p { color: var(--color-theme-text); }

.brand.grid > .brand__content.brand__column:nth-child(3) p::first-letter { font-size: 3.125rem; padding: 0 1.5625rem 0 0; font-family: var(--font-great-vibes); color: var(--color-s-1); font-weight: 900; }

.brand__content h3 { text-transform: uppercase; font-size: calc(var(--h3-font-size) + 10px); color: var(--color-theme-text); }

.main__brand { padding: 5em 0 0 0; background: var(--color-theme-page); }

.shop-item span { color: var(--color-theme-text); }

.shop-item a { color: var(--color-theme-text); }

.brand__content p { color: var(--color-theme-text); }

.main__brand .shop-item { display: -ms-grid; display: grid; -ms-grid-columns: (max-content)[4]; grid-template-columns: repeat(4, -webkit-max-content); grid-template-columns: repeat(4, max-content); -ms-grid-rows: auto; grid-template-rows: auto; padding-top: 5em; padding-right: 0; padding-bottom: 5em; padding-left: 0; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; background: var(--color-theme); grid-gap: 1.5em; }

@media (min-width: 768px) and (max-width: 991.98px) { .main__brand .shop-item { -ms-grid-columns: (max-content)[3]; grid-template-columns: repeat(3, -webkit-max-content); grid-template-columns: repeat(3, max-content); } }

@media (min-width: 576px) and (max-width: 767.98px) { .main__brand .shop-item { -ms-grid-columns: (max-content)[2]; grid-template-columns: repeat(2, -webkit-max-content); grid-template-columns: repeat(2, max-content); } }

@media (max-width: 575.98px) { .main__brand .shop-item { -ms-grid-columns: (max-content)[1]; grid-template-columns: repeat(1, -webkit-max-content); grid-template-columns: repeat(1, max-content); } }

/*******************************************************
      01. Main
      02. Form
      03. Contact
*******************************************************/
/*============== 01. Main - Cover ===============*/
.main--contact { width: 100%; height: 100%; background: var(--color-s-2); }

.main--contact h2 { text-transform: uppercase; }

/*============== 02. Form ===============*/
.main__form { display: -ms-grid; display: grid; -ms-grid-columns: (1fr)[2]; grid-template-columns: repeat(2, 1fr); -ms-grid-rows: auto; grid-template-rows: auto; margin: 0 6.25rem; padding: 5em 0; }

@media (min-width: 768px) and (max-width: 991.98px) { .main__form { display: -ms-grid; display: grid; -ms-grid-columns: (1fr)[1]; grid-template-columns: repeat(1, 1fr); -ms-grid-rows: auto; grid-template-rows: auto; margin: 0 0.625rem; } }

@media (min-width: 576px) and (max-width: 767.98px) { .main__form { display: -ms-grid; display: grid; -ms-grid-columns: (1fr)[1]; grid-template-columns: repeat(1, 1fr); -ms-grid-rows: auto; grid-template-rows: auto; margin: 0 0.625rem; } }

@media (max-width: 575.98px) { .main__form { display: -ms-grid; display: grid; -ms-grid-columns: (1fr)[1]; grid-template-columns: repeat(1, 1fr); -ms-grid-rows: auto; grid-template-rows: auto; margin: 0 0.625rem; } }

.main__form .contact-content { padding: 1em; }

/*============== 03. Form ===============*/
.form { padding: 1em; grid-gap: 1em; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; }

.form-two-colums { display: -ms-grid; display: grid; -ms-grid-columns: (1fr)[2]; grid-template-columns: repeat(2, 1fr); -ms-grid-rows: auto; grid-template-rows: auto; grid-gap: 1em; }

@media (min-width: 576px) and (max-width: 767.98px) { .form-two-colums { display: -ms-grid; display: grid; -ms-grid-columns: (1fr)[1]; grid-template-columns: repeat(1, 1fr); -ms-grid-rows: auto; grid-template-rows: auto; } }

@media (max-width: 575.98px) { .form-two-colums { display: -ms-grid; display: grid; -ms-grid-columns: (1fr)[1]; grid-template-columns: repeat(1, 1fr); -ms-grid-rows: auto; grid-template-rows: auto; } }

.form-control { display: -webkit-box; display: -ms-flexbox; display: flex; }

input[type="email"], input[type="number"], input[type="password"], input[type="search"], input[type="tel"], input[type="text"], input[type="url"], textarea { width: 100%; font-family: inherit; font-size: 14px; line-height: 24px; font-weight: 400; color: var(--color-s-1); background-color: var(--color-white); border: 1px solid transparent; border-radius: 0; outline: 0; cursor: pointer; -webkit-transition: color .2s ease-out, background-color .2s ease-out, border-color .2s ease-out; transition: color .2s ease-out, background-color .2s ease-out, border-color .2s ease-out; width: 100%; padding: 1em; }

input[type="email"]::-webkit-input-placeholder, input[type="number"]::-webkit-input-placeholder, input[type="password"]::-webkit-input-placeholder, input[type="search"]::-webkit-input-placeholder, input[type="tel"]::-webkit-input-placeholder, input[type="text"]::-webkit-input-placeholder, input[type="url"]::-webkit-input-placeholder, textarea::-webkit-input-placeholder { color: var(--color-s-1); opacity: 1; font-family: var(--font-montserrat); }

input[type="email"]:-ms-input-placeholder, input[type="number"]:-ms-input-placeholder, input[type="password"]:-ms-input-placeholder, input[type="search"]:-ms-input-placeholder, input[type="tel"]:-ms-input-placeholder, input[type="text"]:-ms-input-placeholder, input[type="url"]:-ms-input-placeholder, textarea:-ms-input-placeholder { color: var(--color-s-1); opacity: 1; font-family: var(--font-montserrat); }

input[type="email"]::-ms-input-placeholder, input[type="number"]::-ms-input-placeholder, input[type="password"]::-ms-input-placeholder, input[type="search"]::-ms-input-placeholder, input[type="tel"]::-ms-input-placeholder, input[type="text"]::-ms-input-placeholder, input[type="url"]::-ms-input-placeholder, textarea::-ms-input-placeholder { color: var(--color-s-1); opacity: 1; font-family: var(--font-montserrat); }

input[type="email"]::placeholder, input[type="number"]::placeholder, input[type="password"]::placeholder, input[type="search"]::placeholder, input[type="tel"]::placeholder, input[type="text"]::placeholder, input[type="url"]::placeholder, textarea::placeholder { color: var(--color-s-1); opacity: 1; font-family: var(--font-montserrat); }

::-moz-selection { color: var(--color-white); background: var(--color-s-1); }

::selection { color: var(--color-white); background: var(--color-s-1); }

.form-control.textarea { height: 10em; }

.form-control .button-link { cursor: pointer; }

/*============== 01. Gallery ===============*/
.main__lightbox { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; padding: 0.7em; grid-gap: 0.7em; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -ms-flex-wrap: wrap; flex-wrap: wrap; }

.main__lightbox a { display: -webkit-box; display: -ms-flexbox; display: flex; width: 25%; height: 70vh; -webkit-box-flex: 999; -ms-flex-positive: 999; flex-grow: 999; width: 25%; height: 70vh; }

@media (min-width: 1200px) { .main__lightbox a { -ms-flex-preferred-size: 20%; flex-basis: 20%; } }

@media (min-width: 992px) and (max-width: 1199.98px) { .main__lightbox a { -ms-flex-preferred-size: 18.75rem; flex-basis: 18.75rem; } }

@media (min-width: 768px) and (max-width: 991.98px) { .main__lightbox a { -ms-flex-preferred-size: 18.75rem; flex-basis: 18.75rem; } }

@media (min-width: 576px) and (max-width: 767.98px) { .main__lightbox a { -ms-flex-preferred-size: 18.75rem; flex-basis: 18.75rem; } }

@media (max-width: 575.98px) { .main__lightbox a { -ms-flex-preferred-size: 18.75rem; flex-basis: 18.75rem; } }

.main__lightbox img { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; -webkit-transition: var(--transition-fast); transition: var(--transition-fast); }

.main__lightbox img:hover { -webkit-filter: grayscale(100%); filter: grayscale(100%); -webkit-transition: var(--transition-fast); transition: var(--transition-fast); }

/*============== 01. Main ===============*/
.main { width: 100%; height: 100%; }

.main__cover-filing { width: 100%; height: 40vh; background: var(--color-black); color: var(--color-white); display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; }

@media (min-width: 576px) and (max-width: 767.98px) { .main__cover-filing { width: 100%; height: 40vh; } }

@media (max-width: 575.98px) { .main__cover-filing { width: 100%; height: 40vh; } }

/*============== 01. Main / Cover ===============*/
.wrap { max-width: 900px; margin: 0 auto; }

.glide__slide { border: 1px solid black; line-height: 100px; margin: 0; text-align: center; }

.main__cover { width: 100%; height: 95vh; overflow: hidden; }

.cover-image { position: absolute; z-index: -1; -webkit-filter: brightness(0.4); filter: brightness(0.4); width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; }

.content-slide { text-align: left; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; grid-gap: 1em; width: 50%; height: 100%; position: relative; margin: 0 auto; right: 15%; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; }

@media (min-width: 768px) and (max-width: 991.98px) { .content-slide { right: 0%; width: 70%; } }

@media (min-width: 576px) and (max-width: 767.98px) { .content-slide { right: 0%; width: 70%; } }

@media (max-width: 575.98px) { .content-slide { right: 0%; width: 70%; } }

.content-slide a { width: -webkit-max-content; width: -moz-max-content; width: max-content; }

.content-slide .title, .content-slide .epigraph { color: var(--color-white); }

.content-slide .entry { color: var(--color-white); font-family: var(--font-josefin-sans); font-weight: 400; font-size: var(--paragraph-font-size); }

/*============== 01. Main / Products ===============*/
.splide__products .splide__slide img { width: 300px; height: 100vh; -o-object-fit: contain; object-fit: contain; -webkit-transform: rotate(-90deg); transform: rotate(-90deg); pointer-events: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; }

.splide__products .splide__slide { -webkit-transition: var(--transition-fast); transition: var(--transition-fast); }

.splide__products .splide__slide:hover { background: var(--color-s-2); -webkit-transition: var(--transition-fast); transition: var(--transition-fast); }

.splide__products .splide__slide > a { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; }

.description-product { position: absolute; bottom: 2em; width: 100%; text-align: center; }

.description-product h4, .description-product a { font-weight: 400; text-transform: uppercase; font-family: var(--font-josefin-sans); font-size: 1.0625rem; line-height: 1.1em; letter-spacing: 0; margin: 25px 0; -webkit-transition: var(--transition-fast); transition: var(--transition-fast); }

/*============== 01. Main / Content - One ===============*/
.main__about--section, .main__testimonials, .main__contact { display: -ms-grid; display: grid; -ms-grid-columns: (1fr)[2]; grid-template-columns: repeat(2, 1fr); -ms-grid-rows: auto; grid-template-rows: auto; height: 100%; }

@media (min-width: 768px) and (max-width: 991.98px) { .main__about--section, .main__testimonials, .main__contact { -ms-grid-columns: (1fr)[1]; grid-template-columns: repeat(1, 1fr); } }

@media (min-width: 576px) and (max-width: 767.98px) { .main__about--section, .main__testimonials, .main__contact { -ms-grid-columns: (1fr)[1]; grid-template-columns: repeat(1, 1fr); } }

@media (max-width: 575.98px) { .main__about--section, .main__testimonials, .main__contact { -ms-grid-columns: (1fr)[1]; grid-template-columns: repeat(1, 1fr); } }

.content-one { position: relative; display: inline-block; width: 100%; }

@media (min-width: 768px) and (max-width: 991.98px) { .content-one { width: 100%; height: 50vh; } }

@media (min-width: 576px) and (max-width: 767.98px) { .content-one { width: 100%; height: 50vh; } }

@media (max-width: 575.98px) { .content-one { width: 100%; height: 50vh; } }

.content-one-img img { display: block; width: 100%; height: 100% !important; -o-object-fit: cover; object-fit: cover; -webkit-filter: brightness(0.4); filter: brightness(0.4); }

@media (min-width: 768px) and (max-width: 991.98px) { .content-one-img img { width: 100%; height: 50vh; } }

@media (min-width: 576px) and (max-width: 767.98px) { .content-one-img img { width: 100%; height: 50vh; } }

@media (max-width: 575.98px) { .content-one-img img { width: 100%; height: 50vh; } }

.content-one-stuffed { display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100% !important; }

.content-one-stuffed .epigraph { font-size: 5em; -webkit-text-stroke: 1px #fff; color: #0000; }

@media (min-width: 576px) and (max-width: 767.98px) { .content-one-stuffed .epigraph { font-size: 3em; } }

@media (max-width: 575.98px) { .content-one-stuffed .epigraph { font-size: 3em; } }

.stuffed { width: 100%; height: 100% !important; position: absolute; top: 0; left: 0; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; overflow: hidden; grid-gap: 1em; z-index: 3; }

.content-one-stuffed { color: var(--color-white); }

.content-one-stuffed h4 { margin: 0 0 10px; opacity: 1; font-weight: 400; letter-spacing: 0; color: inherit; text-transform: uppercase; }

.content-one-img { width: 100%; height: 100% !important; position: relative; display: inline-block; vertical-align: top; overflow: hidden; }

.main__about--section .content-two, .main__testimonials .content-two, .main__contact .content-two { padding: 4em; }

@media (min-width: 768px) and (max-width: 991.98px) { .main__about--section .content-two, .main__testimonials .content-two, .main__contact .content-two { padding: 2em; } }

@media (min-width: 576px) and (max-width: 767.98px) { .main__about--section .content-two, .main__testimonials .content-two, .main__contact .content-two { padding: 2em; } }

@media (max-width: 575.98px) { .main__about--section .content-two, .main__testimonials .content-two, .main__contact .content-two { padding: 2em; } }

.main__about--section .swiper-slide, .main__testimonials .swiper-slide, .main__contact .swiper-slide { width: 100% !important; height: 100% !important; }

.main__about--section .content-two, .main__testimonials .content-two, .main__contact .content-two { background: var(--color-s-2); }

/*============== 01. Main / Video ===============*/
.main__text--section { background-image: url("/src/assets/image/Banner__Home.jpg"); width: auto; height: 70vh; background-size: cover; background-position: center; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; }

@media (min-width: 768px) and (max-width: 991.98px) { .main__text--section { width: auto; height: 50vh; } }

@media (min-width: 576px) and (max-width: 767.98px) { .main__text--section { width: auto; height: 50vh; } }

@media (max-width: 575.98px) { .main__text--section { width: auto; height: 50vh; } }

.main__text--section h2 { color: var(--color-white); font-family: var(--font-josefin-sans); text-transform: uppercase; text-align: center; font-size: var(--h2-font-size); }

/*============== 01. Main / Testimonials ===============*/
.main__testimonials .swiper-container { background: var(--color-s-2); }

.main__testimonials .content-two { padding: 0; }

#swiper-testimonials { background: var(--color-white); height: 100%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; display: flex; justify-content: center; align-items: center; }

.testimonials { padding: 5em; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; display: flex; flex-direction: column; }

@media (min-width: 768px) and (max-width: 991.98px) { .testimonials { padding: 2em; } }

@media (min-width: 576px) and (max-width: 767.98px) { .testimonials { padding: 2em; } }

@media (max-width: 575.98px) { .testimonials { padding: 2em; } }

.testimonials > span { font-family: var(--font-great-vibes); font-size: var(--h2-font-size); color: var(--color-s-1); text-align: left; }

.author-name { text-transform: uppercase; }

.author-job { font-size: 1rem; font-family: var(--font-josefin-sans); font-weight: 400; }

.author { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; display: flex; flex-direction: column; align-items: flex-start; grid-gap: 1em; margin: 2em 0; }

/*============== 01. Main / Contact ===============*/
.contact-content { padding: 5em; background: var(--color-s-2); }

@media (min-width: 768px) and (max-width: 991.98px) { .contact-content { padding: 2em; } }

@media (min-width: 576px) and (max-width: 767.98px) { .contact-content { padding: 2em; } }

@media (max-width: 575.98px) { .contact-content { padding: 2em; } }

@media (min-width: 768px) and (max-width: 991.98px) { .contact-map { width: 100%; height: 50vh; } }

@media (min-width: 576px) and (max-width: 767.98px) { .contact-map { width: 100%; height: 50vh; } }

@media (max-width: 575.98px) { .contact-map { width: 100%; height: 50vh; } }

.stuffed-contact { height: 100%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; grid-gap: 1em; }

.stuffed-contact h4 { font-family: var(--font-josefin-sans); font-weight: 700; text-transform: uppercase; color: var(--color-black); font-size: 1.0625rem; line-height: 1.1em; letter-spacing: 0; margin: 25px 0; word-wrap: break-word; }

.stuffed-contact .button-link { width: -webkit-max-content; width: -moz-max-content; width: max-content; }

.stuffed-column a { margin: 0.5em 0; }

.stuffed-column { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; }

.stuffed-contact h2 { text-transform: uppercase; }

.stuffed-contact > p { font-weight: 400; }

/*============== 01. Main / Gallery ===============*/
.main__gallery { display: -webkit-box; display: -ms-flexbox; display: flex; }

@media (min-width: 576px) and (max-width: 767.98px) { .main__gallery { display: none; } }

@media (max-width: 575.98px) { .main__gallery { display: none; } }

.main__gallery img { width: inherit; height: 100%; -o-object-fit: cover; object-fit: cover; }

.main__gallery a { width: 100%; }

/*============== 01. Shop ===============*/
.main__shop { display: -ms-grid; display: grid; -ms-grid-columns: 1fr 300px; grid-template-columns: 1fr 300px; -ms-grid-rows: auto; grid-template-rows: auto; grid-gap: 2em; padding-top: 6.25rem; padding-bottom: 6.25rem; background: var(--color-s-2); }

@media (max-width: 575.98px) { .main__shop { -ms-grid-columns: (1fr)[1]; grid-template-columns: repeat(1, 1fr); } }

.shop-item { width: 100%; height: -webkit-max-content; height: -moz-max-content; height: max-content; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; grid-gap: 1em; }

.sale-items { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -ms-flex-preferred-size: 0px; flex-basis: 0px; -webkit-box-flex: 999; -ms-flex-positive: 999; flex-grow: 999; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; width: 100%; height: -webkit-max-content; height: -moz-max-content; height: max-content; }

.sale-items a { width: 100%; height: 100%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; }

.sale-items img { width: 9.375rem; height: 15.625rem; -o-object-fit: contain; object-fit: contain; background: var(--color-white); padding: 0 3em; -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; }

@media (min-width: 576px) and (max-width: 767.98px) { .sale-items img { width: 100%; height: 12.5rem; max-width: -moz-available; max-width: -webkit-fill-available; } }

@media (max-width: 575.98px) { .sale-items img { width: 100%; height: 12.5rem; max-width: -moz-available; max-width: -webkit-fill-available; } }

@media (min-width: 576px) and (max-width: 767.98px) { .main__brand .shop-item { display: -webkit-box; display: -ms-flexbox; display: flex; padding: 1em 1em; width: auto; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; } }

@media (max-width: 575.98px) { .main__brand .shop-item { display: -webkit-box; display: -ms-flexbox; display: flex; padding: 1em 1em; width: auto; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; } }

@media (min-width: 576px) and (max-width: 767.98px) { .main__brand .sale-items { padding: 0; } }

@media (max-width: 575.98px) { .main__brand .sale-items { padding: 0; } }

.main__brand .description { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; margin: 1em 0; grid-gap: 1em; }

.description { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; margin: 1em 0; grid-gap: 1em; }

.description h4 { text-transform: uppercase; }

.description h4 a { font-family: var(--font-josefin-sans); }

/*============== 02. Aside ===============*/
.aside-shop h3:nth-child(1) { margin: 0em 0 2em 0; }

.aside-shop h3 { text-transform: uppercase; margin: 2em 0; }

.product-aside-item img { width: 5em; -o-object-fit: contain; object-fit: contain; }

.main__gallery a { height: 200px; }

.product-aside-item { display: -webkit-box; display: -ms-flexbox; display: flex; grid-gap: 1em; }

.aside-description { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; grid-gap: 0.3em; }

.aside-description h4 { text-transform: uppercase; font-family: var(--font-josefin-sans) !important; font-weight: 700; color: var(--color-black); font-size: 0.8125rem; letter-spacing: .09em; word-wrap: break-word; }

.aside-description a { text-transform: inherit; font-family: inherit; font-weight: inherit; color: inherit; font-size: inherit; letter-spacing: inherit; word-wrap: inherit; }

.aside-description span { font-weight: 400; font-size: 0.8125rem; font-family: var(--font-josefin-sans); }

.product-aside { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; grid-gap: 1em; }

.category-aside { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; grid-gap: 0.8em; }

.category-aside a { font-size: 0.875rem; }

.social { font-size: 2em; display: -webkit-box; display: -ms-flexbox; display: flex; grid-gap: 1em; margin: 0 0 1em 0; }

/*============== 03. Product ===============*/
.main__product { display: -ms-grid; display: grid; -ms-grid-columns: (1fr)[2]; grid-template-columns: repeat(2, 1fr); -ms-grid-rows: auto; grid-template-rows: auto; padding-top: 6.25rem; padding-bottom: 6.25rem; }

@media (min-width: 768px) and (max-width: 991.98px) { .main__product { -ms-grid-columns: (1fr)[1]; grid-template-columns: repeat(1, 1fr); } }

@media (min-width: 576px) and (max-width: 767.98px) { .main__product { -ms-grid-columns: (1fr)[1]; grid-template-columns: repeat(1, 1fr); } }

@media (max-width: 575.98px) { .main__product { -ms-grid-columns: (1fr)[1]; grid-template-columns: repeat(1, 1fr); } }

.product__content-info { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; grid-gap: 1em; }

.product__content-info h2 { font-size: var(--h2-font-size); }

.product__content-info span { font-family: var(--font-josefin-sans); }

.product__content-info .button-link { width: -webkit-max-content; width: -moz-max-content; width: max-content; }

.add-product { margin-top: 2em; margin-bottom: 2em; display: -webkit-box; display: -ms-flexbox; display: flex; grid-gap: 1em; }

.product-meta { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; grid-gap: 1em; }

.product-meta span { font-size: 1.125rem; font-weight: 400; }

.product__item--img img { width: 100%; height: 300px; -o-object-fit: contain; object-fit: contain; }

.product__item { display: -webkit-box; display: -ms-flexbox; display: flex; }

.main__product { grid-gap: 3em; }

.product__item--img { -ms-grid-row-align: center; align-self: center; grid-gap: 1em; display: -ms-grid; display: grid; -ms-grid-columns: 65px auto; grid-template-columns: 65px auto; -ms-grid-rows: auto; grid-template-rows: auto; width: 100%; }

@media (min-width: 768px) and (max-width: 991.98px) { .product__item--img { -ms-grid-columns: 1fr; grid-template-columns: 1fr; } }

@media (min-width: 576px) and (max-width: 767.98px) { .product__item--img { -ms-grid-columns: 1fr; grid-template-columns: 1fr; } }

@media (max-width: 575.98px) { .product__item--img { -ms-grid-columns: 1fr; grid-template-columns: 1fr; } }

.gallery-product-two { width: 100%; grid-gap: 1em; display: -webkit-box; display: -ms-flexbox; display: flex; width: 100%; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; grid-gap: 10px; z-index: 1; }

@media (min-width: 768px) and (max-width: 991.98px) { .gallery-product-two { -webkit-box-ordinal-group: 2; -ms-flex-order: 1; order: 1; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; height: 50px; } }

@media (min-width: 576px) and (max-width: 767.98px) { .gallery-product-two { -webkit-box-ordinal-group: 2; -ms-flex-order: 1; order: 1; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; height: 50px; } }

@media (max-width: 575.98px) { .gallery-product-two { -webkit-box-ordinal-group: 2; -ms-flex-order: 1; order: 1; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; height: 50px; } }

#gallery-product img { -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; -ms-flex-preferred-size: 0; flex-basis: 0; border: 1px solid var(--color-s-1); height: 100%; -o-object-fit: cover; object-fit: cover; opacity: .6; -webkit-transition: var(--transition-fast); transition: var(--transition-fast); }

#img-box { -webkit-transition: var(--transition-fast); transition: var(--transition-fast); }

#img-box:hover { -webkit-transform: scale(1.1); transform: scale(1.1); -webkit-transition: var(--transition-fast); transition: var(--transition-fast); }

#gallery-product img:hover { opacity: 1; -webkit-transition: var(--transition-fast); transition: var(--transition-fast); cursor: pointer; }

.main__cover-filing h2 { text-align: center; }

#breadcrumb { text-transform: uppercase; font-size: var(--paragraph-font-size); text-transform: uppercase; }

.breadcrumb-item + .breadcrumb-item::before { display: inline-block; padding-right: .5rem; padding-left: .5rem; color: var(--color-white); content: "/"; }

.breadcrumb { display: -webkit-box; display: -ms-flexbox; display: flex; list-style: none; padding: 1em; }

.breadcrumb li a { color: var(--color-theme); }

/*============== 03. Product - Quanty ===============*/
.quantity { position: relative; }

input[type=number]::-webkit-inner-spin-button, input[type=number]::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }

input[type=number] { -moz-appearance: textfield; }

.quantity input { width: 45px; height: 42px; line-height: 1.65; float: left; display: block; padding: 0; margin: 0; padding-left: 20px; border: 1px solid #eee; }

.quantity input:focus { outline: 0; }

.quantity-nav { float: left; position: relative; height: 42px; }

.quantity-button { position: relative; cursor: pointer; border-left: 1px solid #eee; width: 20px; text-align: center; color: #333; font-size: 13px; font-family: "Trebuchet MS", Helvetica, sans-serif !important; line-height: 1.7; -webkit-transform: translateX(-100%); transform: translateX(-100%); -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; }

.quantity-button.quantity-up { position: absolute; height: 50%; top: 0; border-bottom: 1px solid #eee; }

.quantity-button.quantity-down { position: absolute; bottom: -1px; height: 50%; }

/*============== 01. About ===============*/
.main__about { display: -ms-grid; display: grid; -ms-grid-columns: (1fr)[1]; grid-template-columns: repeat(1, 1fr); -ms-grid-rows: auto; grid-template-rows: auto; background: var(--color-s-2); }

/*============== 02. About - Columns ===============*/
.main__about { padding: 0.5em; grid-gap: 0.5em; }

.about__left-col, .about__right-col { width: 100%; height: 55vh; }

@media (min-width: 576px) and (max-width: 767.98px) { .about__left-col, .about__right-col { width: 100%; height: auto; } }

@media (max-width: 575.98px) { .about__left-col, .about__right-col { width: 100%; height: auto; } }

.about__row { display: -webkit-box; display: -ms-flexbox; display: flex; grid-gap: 0.5em; }

@media (min-width: 768px) and (max-width: 991.98px) { .about__row:nth-child(1) { -ms-flex-wrap: wrap-reverse; flex-wrap: wrap-reverse; } }

@media (min-width: 576px) and (max-width: 767.98px) { .about__row:nth-child(1) { -ms-flex-wrap: wrap-reverse; flex-wrap: wrap-reverse; } }

@media (max-width: 575.98px) { .about__row:nth-child(1) { -ms-flex-wrap: wrap-reverse; flex-wrap: wrap-reverse; } }

@media (min-width: 768px) and (max-width: 991.98px) { .about__row:nth-child(2) { -ms-flex-wrap: wrap; flex-wrap: wrap; } }

@media (min-width: 576px) and (max-width: 767.98px) { .about__row:nth-child(2) { -ms-flex-wrap: wrap; flex-wrap: wrap; } }

@media (max-width: 575.98px) { .about__row:nth-child(2) { -ms-flex-wrap: wrap; flex-wrap: wrap; } }

@media (min-width: 768px) and (max-width: 991.98px) { .about__row:nth-child(3) { -ms-flex-wrap: wrap-reverse; flex-wrap: wrap-reverse; } }

@media (min-width: 576px) and (max-width: 767.98px) { .about__row:nth-child(3) { -ms-flex-wrap: wrap-reverse; flex-wrap: wrap-reverse; } }

@media (max-width: 575.98px) { .about__row:nth-child(3) { -ms-flex-wrap: wrap-reverse; flex-wrap: wrap-reverse; } }

.about__left-col img { width: inherit; height: inherit; -o-object-fit: cover; object-fit: cover; }

.flex-center { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; background: var(--color-white); }

.text-right { text-align: right; }

/*============== 03. About - Colums / Text ===============*/
.about__text { max-width: 65%; }

@media (min-width: 576px) and (max-width: 767.98px) { .about__text { max-width: 100%; padding: 2em; text-align: left; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; grid-gap: 0.5em; } }

@media (max-width: 575.98px) { .about__text { max-width: 100%; padding: 2em; text-align: left; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; grid-gap: 0.5em; } }

.about__text h3 { text-transform: uppercase; font-size: calc(var(--h3-font-size) + 10px); }

@media (min-width: 768px) and (max-width: 991.98px) { .about__text h3 { font-size: var(--h3-font-size); } }

@media (min-width: 576px) and (max-width: 767.98px) { .about__text h3 { font-size: var(--h3-font-size); } }

@media (max-width: 575.98px) { .about__text h3 { font-size: var(--h3-font-size); } }

/*============== 04. About - Colums / Team ===============*/
.main__team { background: var(--color-s-2); }

.main__team #gallery { padding: 0px; }

.main__team #team a { height: 25rem; }

.space { padding: 5em 0; text-align: center; text-transform: uppercase; background: var(--color-white); }

.space h3 { font-size: calc(var(--h3-font-size) + 10px); }

@media (min-width: 768px) and (max-width: 991.98px) { .space h3 { font-size: var(--h3-font-size); } }

@media (min-width: 576px) and (max-width: 767.98px) { .space h3 { font-size: var(--h3-font-size); } }

@media (max-width: 575.98px) { .space h3 { font-size: var(--h3-font-size); } }

/*============== 01. Video ===============*/
.video-row { display: -ms-grid; display: grid; -ms-grid-columns: (1fr)[2]; grid-template-columns: repeat(2, 1fr); -ms-grid-rows: auto; grid-template-rows: auto; grid-gap: 3em; }

@media (min-width: 768px) and (max-width: 991.98px) { .video-row { -ms-grid-columns: (1fr)[1]; grid-template-columns: repeat(1, 1fr); } }

@media (min-width: 576px) and (max-width: 767.98px) { .video-row { -ms-grid-columns: (1fr)[1]; grid-template-columns: repeat(1, 1fr); } }

@media (max-width: 575.98px) { .video-row { -ms-grid-columns: (1fr)[1]; grid-template-columns: repeat(1, 1fr); } }

.main__video { padding: 5em 0; }

.video-col h4 { text-align: center; font-family: var(--font-montserrat); text-transform: uppercase; font-size: 1.5625rem; padding-top: 0; padding-right: 0; padding-bottom: 1.5em; padding-left: 0; }

.main__video { padding: 5em 0; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; grid-gap: 2em; }

.main__video iframe { width: 100%; }
/*# sourceMappingURL=main.css.map */