diff --git a/icons.f2579c3a.svg b/icons.ce988603.svg similarity index 52% rename from icons.f2579c3a.svg rename to icons.ce988603.svg index 29d45f6..246a392 100644 --- a/icons.f2579c3a.svg +++ b/icons.ce988603.svg @@ -1 +1 @@ - \ No newline at end of file + \ No newline at end of file diff --git a/index.4b3b728a.js b/index.4b3b728a.js new file mode 100644 index 0000000..465eb7b --- /dev/null +++ b/index.4b3b728a.js @@ -0,0 +1,2 @@ +function displayImage(e){document.getElementById("imagecontainer");var a=document.querySelectorAll(".sale-watch-preview");a.forEach((function(e){e.classList.remove("activeimage")})),a[e].classList.add("activeimage")} +//# sourceMappingURL=index.4b3b728a.js.map diff --git a/index.4b3b728a.js.map b/index.4b3b728a.js.map new file mode 100644 index 0000000..e3c3497 --- /dev/null +++ b/index.4b3b728a.js.map @@ -0,0 +1 @@ +{"mappings":"AAAA,SAASA,aAAaC,GACGC,SAASC,eAAe,kBAA/C,IACMC,EAAgBF,SAASG,iBAAiB,uBAQhDD,EAAcE,SAAQ,SAAAC,GACpBA,EAAQC,UAAUC,OAAO,c,IAE3BL,EAAcH,GAAUO,UAAUE,IAAI,c","sources":["src/js/sale.js"],"sourcesContent":["function displayImage(imageSrc) {\n const imageContainer = document.getElementById('imagecontainer');\n const imageElements = document.querySelectorAll('.sale-watch-preview');\n // const imageSelected = document.querySelector(`.imageselected-${imageSrc}`);\n \n // const imageActive = document.querySelector('.activeimage');\n\n\n\n // Create a new image element\n imageElements.forEach(element => {\n element.classList.remove('activeimage');\n });\n imageElements[imageSrc].classList.add('activeimage');\n\n\n // imageActive.classList.remove('activeimage');\n // imageSelected.classList.toggle('activeimage');\n \n \n // Clear the contents of the image container\n \n // Append the selected image to the container\n \n}\n"],"names":["displayImage","imageSrc","document","getElementById","imageElements","querySelectorAll","forEach","element","classList","remove","add"],"version":3,"file":"index.4b3b728a.js.map"} \ No newline at end of file diff --git a/index.7667a88a.js b/index.7667a88a.js deleted file mode 100644 index ce5a349..0000000 --- a/index.7667a88a.js +++ /dev/null @@ -1,2 +0,0 @@ -function displayImage(e){var n=document.getElementById("imagecontainer"),t=document.createElement("img");t.src=e,t.alt="Selected Image",n.innerHTML="",n.appendChild(t)} -//# sourceMappingURL=index.7667a88a.js.map diff --git a/index.7667a88a.js.map b/index.7667a88a.js.map deleted file mode 100644 index bb2b7de..0000000 --- a/index.7667a88a.js.map +++ /dev/null @@ -1 +0,0 @@ -{"mappings":"AAAA,SAASA,aAAaC,GACpB,IAAIC,EAAiBC,SAASC,eAAe,kBAEzCC,EAAMF,SAASG,cAAc,OACjCD,EAAIE,IAAMN,EACVI,EAAIG,IAAM,iBAEVN,EAAeO,UAAY,GAE3BP,EAAeQ,YAAYL,E","sources":["src/js/sale.js"],"sourcesContent":["function displayImage(imageSrc) {\n var imageContainer = document.getElementById('imagecontainer');\n // Create a new image element\n var img = document.createElement('img');\n img.src = imageSrc;\n img.alt = 'Selected Image';\n // Clear the contents of the image container\n imageContainer.innerHTML = '';\n // Append the selected image to the container\n imageContainer.appendChild(img);\n}\n"],"names":["displayImage","imageSrc","imageContainer","document","getElementById","img","createElement","src","alt","innerHTML","appendChild"],"version":3,"file":"index.7667a88a.js.map"} \ No newline at end of file diff --git a/index.c8ddc185.css b/index.c8ddc185.css deleted file mode 100644 index a0f0470..0000000 --- a/index.c8ddc185.css +++ /dev/null @@ -1,2 +0,0 @@ -*,:before,:after{box-sizing:border-box}html{tab-size:4;-webkit-text-size-adjust:100%;line-height:1.15}body{margin:0;font-family:system-ui,AppleSystem,BlinkMacSystemFont,Segoe UI,Roboto,Noto Sans,Ubuntu,Cantarell,Helvetica Neue,AppleSystem,BlinkMacSystemFont,Segoe UI,Roboto,Noto Sans,Ubuntu,Cantarell,Helvetica Neue,AppleSystem,BlinkMacSystemFont,Segoe UI,Roboto,Noto Sans,Ubuntu,Cantarell,Helvetica Neue,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif,Apple Color Emoji,Segoe UI Emoji}hr{height:0;color:inherit}abbr[title]{-webkit-text-decoration:underline dotted;text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:ui-monospace,SFMono-Regular,Consolas,Liberation Mono,Menlo,monospace;font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit}button,input,optgroup,select,textarea{margin:0;font-family:inherit;font-size:100%;line-height:1.15}button,select{text-transform:none}button,[type=button],[type=reset],[type=submit]{-webkit-appearance:button}::-moz-focus-inner{border-style:none;padding:0}:-moz-focusring{outline:1px dotted ButtonText}:-moz-ui-invalid{box-shadow:none}legend{padding:0}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}h1,h2,h3,h4,h5,h6,p{margin:0}ul{margin:0;padding:0}img{max-width:100%;height:auto;display:block}html{box-sizing:border-box}*,:before,:after{box-sizing:inherit}a{text-decoration:none}.list{margin:0;padding:0;list-style-type:none}body{letter-spacing:-.28px;margin:0;font-family:Epilogue,sans-serif;font-size:14px;font-style:normal;font-weight:300;line-height:18px}.section{width:100%;margin:auto}.container{width:1280px;margin:0 auto;padding:0 20px}@media screen and (max-width:1176px){.container{width:768px;padding:0 32px}}@media screen and (max-width:767px){.container{width:100%}}:root{--white:#fff;--black:#141414;--dark-green:#1e2827;--light-green:#c6cdd1;--gray:rgba(20,20,20,.5);--light-gray:rgba(20,20,20,.4);--border:rgba(255,255,255,.1)}.header{background:var(--black);padding:36px 0}.header-container{justify-content:space-between;align-items:center;display:flex}.header-logo{width:123px;height:19px}.header-navigation{align-items:center;column-gap:80px;display:flex}.header-navigation-list{align-items:center;gap:40px;display:flex}.header-navigation-list li{align-items:center;display:flex}.header-navigation-link{color:var(--white);text-transform:uppercase;font-family:Epilogue;font-size:9px;font-style:normal;font-weight:400;line-height:12px;transition:transform .25s ease-in-out}.header-navigation-link:hover{transform:scale(1.2)}.header-button{color:var(--white);text-align:center;text-transform:uppercase;background-color:var(--dark-green);border:none;border-radius:8px;padding:18px 36px;font-family:Epilogue;font-size:9px;font-style:normal;font-weight:400;line-height:12px;transition:background-color .25s ease-in-out,color .25s ease-in-out}.header-button:hover{background-color:var(--white);color:var(--dark-green)}.hamburger-container{display:none}@media screen and (max-width:1176px){.header{padding:20px 0}}@media screen and (max-width:767px){.container{width:100%}.header{padding:36px 0}.header-navigation-list,.header-button{display:none}.hamburger-container{justify-content:flex-end;display:flex}}.hamburger{width:100%;height:100%;background:var(--dark-green);z-index:999;padding:36px 20px;transition-property:transform,opacity;transition-duration:.25s,.25s;transition-timing-function:cubic-bezier(.4,0,.2,1),cubic-bezier(.4,0,.2,1);position:fixed;top:0;right:0;transform:translate(0)}.hamburger.is-hidden{transform:translate(100%)}.hamburger-close-icon{fill:var(--white)}.menu-burger-container{align-content:center;justify-content:space-between;display:flex}.hamburger-close{color:var(--white)}.hamburger-menu-list{flex-direction:column;justify-content:center;align-items:center;display:flex;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%)}.hamburger_link{color:var(--white);padding:7px 0;display:block}:root{--white:#fff;--black:#141414;--dark-green:#1e2827;--light-green:#c6cdd1;--gray:rgba(20,20,20,.5);--light-gray:rgba(20,20,20,.4);--border:rgba(255,255,255,.1)}.hero-section{background-color:var(--black);width:100%;padding:80px 0}.hero-title{color:var(--white);letter-spacing:-1.52px;width:unset;margin-bottom:20px;font-family:Epilogue;font-size:38px;font-style:normal;font-weight:600;line-height:40px}@media screen and (min-width:768px){.hero-title{color:var(--white);letter-spacing:-2.4px;font-family:Epilogue;font-size:60px;font-style:normal;font-weight:600;line-height:62px}}@media screen and (min-width:1280px){.hero-title{letter-spacing:-2.4px;width:750px;order:unset;margin-top:0;margin-bottom:0;font-size:60px;font-weight:600;line-height:62px}}.hero-col-1{justify-content:space-between;margin-bottom:43px;display:flex}.hero-col-2{justify-content:space-between;display:flex}.hp-slider-img{width:266px}@media screen and (min-width:768px){.hp-slider-img{width:436px}}@media screen and (min-width:1280px){.hp-slider-img{order:3;align-self:flex-end}}.banner-slider{flex-direction:column;row-gap:20px;display:flex}swiper-container{z-index:0}swiper-slide{height:200px;justify-content:center;align-items:center;display:flex}@media screen and (min-width:768px){swiper-slide{height:255px;background-color:#1e2827;justify-content:center;align-items:center;display:flex}}.slide-control{width:100%;height:32px;justify-content:space-between;align-items:flex-end;display:flex}.button-list{gap:12px;display:inline-flex}.counter-list{color:#fff;gap:6px;display:inline-flex}.slider-range{width:40px;height:100%;position:relative}.slider-range:before{content:"";width:100%;height:1px;background-color:currentColor;position:absolute;top:7px}.control_prev:hover,.control_next:hover,.control_prev:focus,.control_next:focus{color:#fefefe}.control_prev,.control_next{width:32px;height:32px;color:rgba(254,254,254,.6);cursor:pointer;background:rgba(255,255,255,0);border:1px solid;border-radius:8px;justify-content:center;align-items:center;padding:0;transition:color .25s cubic-bezier(.4,0,.2,1);display:flex}@media screen and (min-width:768px){.control_prev,.control_next{width:40px;height:40px}}.chevronleft,.chevronright{stroke:currentColor;justify-content:center;align-items:center;display:flex;transform:translate(-4px)}.slider_option{width:160px;margin:10px auto;font-size:18px;position:relative}.herotext-box{width:282px;margin-left:auto}@media screen and (min-width:768px){.herotext-box{width:248px;margin-top:-40px}}@media screen and (min-width:1280px){.herotext-box{order:2;margin-top:0}}.herotext{color:var(--white);letter-spacing:-.28px;width:282px;font-family:Epilogue;font-size:14px;font-style:normal;font-weight:300;line-height:18px}.hero-text{color:var(--white);font-weight:300;display:inline-flex}.hero-text-tablet{display:none}.hero-watch-div{order:4}.hero-wristwatch{width:auto}.hero-text-hidden{display:none}@media screen and (max-width:1176px){.hero-col-1{flex-wrap:wrap;display:flex}.hero-title{width:100%}.herotext{width:248px;position:absolute;top:464px;right:32px}.hero-watch-div{width:100%;order:unset;margin-top:40px}.hero-col-2{display:block}.hero-wristwatch{width:100%}}@media screen and (max-width:767px){.container{width:100%}.hero-section{padding:40px 0}.hero-title{font-size:38px}.herotext{display:none}.hero-text-hidden{justify-content:flex-end;margin-top:40px;padding-left:70px;display:flex}.herotext-mobile{color:var(--white);letter-spacing:-.28px;font-family:Epilogue;font-size:14px;font-style:normal;font-weight:300;line-height:18px}}:root{--white:#fff;--black:#141414;--dark-green:#1e2827;--light-green:#c6cdd1;--gray:rgba(20,20,20,.5);--light-gray:rgba(20,20,20,.4);--border:rgba(255,255,255,.1)}.about-section{padding:80px 0}.about-col-1{justify-content:space-between;display:flex}.about-title{color:var(--dark-green);letter-spacing:-.8px;font-family:Epilogue;font-size:40px;font-style:normal;font-weight:600;line-height:44px}.about-description:first-child{color:var(--black);letter-spacing:-.28px;width:470px;font-family:Epilogue;font-size:14px;font-style:normal;font-weight:300;line-height:18px}.about-description{color:var(--black);letter-spacing:-.28px;width:380px;font-family:Epilogue;font-size:14px;font-style:normal;font-weight:300;line-height:18px}.about-inner-col2{justify-content:flex-end;gap:40px;display:flex}.about-col-2{width:100%;height:500px;justify-content:flex-end;margin-top:40px;display:flex}@media screen and (max-width:1176px){.about-section{padding:64px 0}.about-description:first-child{width:220px}.about-description{width:250px}.about-inner-col2{gap:20px}}@media screen and (max-width:767px){.about-section{padding:40px 0}.about-col-1{display:block}.about-inner-col2{flex-direction:column;gap:20px;margin-top:40px}.about-description:first-child,.about-description{width:100%}.about-title{font-size:32px}.about-col-2{height:365px}}:root{--white:#fff;--black:#141414;--dark-green:#1e2827;--light-green:#c6cdd1;--gray:rgba(20,20,20,.5);--light-gray:rgba(20,20,20,.4);--border:rgba(255,255,255,.1)}.catalog-image-container{width:276px;height:325px;margin-bottom:0}.catalog-title{color:var(--dark-green);letter-spacing:-.8px;font-family:Epilogue;font-size:40px;font-style:normal;font-weight:600;line-height:44px}.catalog{flex-wrap:wrap;justify-content:space-between;gap:24px;margin-top:64px;margin-bottom:80px;display:flex}.catalog-image{margin-top:26px;margin-bottom:25px}.catalog-item{flex-basis:calc(25% - 24px)}.catalog-captions{background-color:var(--white);margin-top:0}.catalog .item-title{color:var(--black);white-space:nowrap;width:276px;text-overflow:ellipsis;letter-spacing:-.28px;margin-bottom:4px;padding:0;font-family:Epilogue;font-size:14px;font-style:normal;font-weight:400;line-height:18px;overflow:hidden}.catalog .item-price{color:var(--gray);letter-spacing:-.24px;font-family:Epilogue;font-size:12px;font-weight:400;line-height:14px}.heart-item{stroke:var(--black);fill:var(--white);margin-left:230px;transition:fill .25s cubic-bezier(.4,0,.2,1)}.heart-item:hover,.heart-item:focus{fill:red}.button.buy{background-color:var(--dark-green);color:var(--white);font-size:12px;font-weight:400px;border-radius:8px;justify-content:flex-end;align-items:flex-start;margin-top:80px;margin-left:auto;padding:18px 35px;transition:border-color .25s cubic-bezier(.4,0,.2,1),background-color .25s cubic-bezier(.4,0,.2,1);display:flex}.button.buy:hover,.button.buy:focus{border-color:var(--white);background-color:rgba(30,40,39,.8)}.catalog-cover-wrap{width:276px;height:325px;position:relative;overflow:hidden}.catalog-cover-text{background-color:var(--dark-green);background-color:var(--dark-green);height:100%;width:100%;border-radius:8px;padding:20px;transition:transform .25s ease-in-out;position:absolute;top:1px;transform:translateY(100%)}.catalog-cover-text-title{color:var(--white);letter-spacing:-.28px;margin-bottom:10px;font-family:Epilogue;font-size:14px;font-weight:400;line-height:18px}.catalog-cover-text-body{color:rgba(255,255,255,.5);letter-spacing:-.14px;margin-top:20px;margin-bottom:20px;font-family:Epilogue;font-size:14px;font-weight:400;line-height:18px}.catalog-item:hover .catalog-cover-text{transform:translateY(0)}.backdrop{width:100%;height:100%;opacity:1;z-index:9999;background-color:rgba(0,0,0,.2);transition:opacity .25s cubic-bezier(.4,0,.2,1);position:fixed;top:0;left:0}.backdrop.is-hidden .modal{transform:translate(-50%,-50%)scale(0)}.catalog-modal{width:904px;height:694px;background-color:var(--white);border-radius:8px;flex-direction:row;gap:40px;padding:40px;transition:transform .25s cubic-bezier(.4,0,.2,1);display:flex;position:absolute;top:50%;left:50%;overflow-y:auto;transform:translate(-50%,-50%)scale(1)}@media screen and (min-width:768px){.catalog-modal{width:904px;height:694px;top:50%;left:50%}}@media screen and (min-width:1158px){.catalog-modal{width:904px;height:694px;top:50%;left:50%}}.catalog-close{width:24px;height:24px;cursor:pointer;background-color:rgba(0,0,0,0);border:1px solid rgba(0,0,0,0);justify-content:center;align-items:center;padding:0;transition:transform .25s cubic-bezier(.4,0,.2,1),border-radius .25s cubic-bezier(.4,0,.2,1),border-color .25s cubic-bezier(.4,0,.2,1);display:flex;position:absolute;top:20px;right:20px;transform:rotate(0deg)}.catalog-close:hover,.catalog-close:focus{border-color:var(--darkgreen);border-radius:50%;transform:rotate(180deg)}.is-hidden{visibility:none;opacity:0;pointer-events:none}.product-modal-image{width:276px;height:375px;margin-top:0}.modal-catalog-captions{background-color:var(--white);margin-top:0}.modal-item-title{white-space:nowrap;width:276px;text-overflow:ellipsis;margin-bottom:0;padding:0;font-size:14px;overflow:hidden}.modal-item-price{font-size:12px}.form-modal-container{width:100%;height:100%}.form-field{flex-direction:column;display:flex;position:relative}.form-input,.form-textarea{width:100%;border:1px solid rgba(46,47,66,.4);border-radius:8px;margin-top:12px;margin-bottom:24px;padding:12px 16px;font-size:16px;transition:border-color .25s cubic-bezier(.4,0,.2,1)}.form-input:hover,.form-input:focus,.form-textarea:hover,.form-textarea:focus{border-color:var(--black)}.form-textarea{resize:none;height:166px;padding:12px 16px;font-size:16px}.button.button-submit{width:100%;background-color:var(--dark-green);color:var(--white);border:1px solid rgba(0,0,0,0);border-radius:8px;padding:18px 0;font-size:12px;transition:border-color .25s cubic-bezier(.4,0,.2,1),background-color .25s cubic-bezier(.4,0,.2,1)}.button.button-submit:hover,.button.button-submit:focus{border-color:var(--white);background-color:rgba(30,40,39,.8)}.privacy-policy{color:rgba(20,20,20,.4);font-size:12px;text-decoration:none;transition:-webkit-text-decoration .25s cubic-bezier(.4,0,.2,1),-webkit-text-decoration .25s cubic-bezier(.4,0,.2,1),text-decoration .25s cubic-bezier(.4,0,.2,1)}.privacy-policy:hover,.privacy-policy:focus{text-decoration:underline}.submit-note{color:rgba(20,20,20,.4);margin-top:12px;font-size:12px}@media screen and (max-width:1176px){.catalog-section{padding:64px 0}.catalog{margin-bottom:40px}.catalog-modal{width:744px}}@media screen and (max-width:767px){.catalog-section{padding:40px 0}.catalog{justify-content:center}.catalog-title{font-size:32px}.catalog-modal{width:90%;height:95vh;flex-wrap:wrap;justify-content:center;gap:10px;display:flex}.form-modal-container{height:unset}.product-modal-image{width:100%;height:fit-content}.catalog-image{margin-top:0}.submit-note br{display:none}}:root{--white:#fff;--black:#141414;--dark-green:#1e2827;--light-green:#c6cdd1;--gray:rgba(20,20,20,.5);--light-gray:rgba(20,20,20,.4);--border:rgba(255,255,255,.1)}.gallery-section{padding:80px 0}.top-text{color:var(--light-gray);letter-spacing:.72px;margin-bottom:8px;font-family:Epilogue;font-size:12px;font-style:normal;font-weight:300;line-height:14px}.gallery-title{color:var(--dark-green);letter-spacing:-.8px;font-family:Epilogue;font-size:40px;font-style:normal;font-weight:600;line-height:44px}.gallery-item{margin-top:80px}.gallery-item-list{justify-content:space-between;gap:24px;display:flex}@media screen and (max-width:1176px){.gallery-section{padding:64px 0}.catalog{margin-bottom:40px}.gallery-item{margin-top:40px}}@media screen and (max-width:767px){.gallery-section{padding:40px 0}.gallery-title{font-size:32px}.gallery-title br{display:none}.gallery-item-list{flex-direction:column;gap:20px;display:flex}}.sale-section{width:100%;padding:0 0 80px}.sale-column{gap:40px;padding:0 98px;display:flex}.sale-description,.sale-description-details{color:rgba(20,20,20,.5);letter-spacing:-.14px;margin:0 auto;font-family:Epilogue;font-size:14px;font-style:normal;font-weight:400;line-height:18px}.sale-watch:hover{cursor:pointer}.watch-items{width:146px;height:146px;margin:0}.sale-info-container{width:50%}.sale-heading{color:var(--black);letter-spacing:-.64px;color:var(--black);letter-spacing:-.64px;margin-bottom:40px;font-family:Epilogue;font-size:32px;font-style:normal;font-weight:600;line-height:40px}.wrapper{gap:20px;display:flex}.preview-wrapper{width:406px;height:614px;background-color:var(--black);justify-content:center;align-items:center;margin:0;display:flex}.sale-watch-container{flex-direction:column;gap:10px;display:flex}.sale-watch-preview{width:100%;background-color:#141414;margin:0;padding:0}.sale-details-heading{color:var(--black);letter-spacing:-.48px;margin-bottom:0;font-family:Epilogue;font-size:38px;font-style:normal;font-weight:400;line-height:40px}.sale-product-tag{color:rgba(20,20,20,.5);letter-spacing:-.28px;margin-top:8px;font-family:Epilogue;font-size:14px;font-style:normal;font-weight:400;line-height:18px}.current-price-on-sale{color:var(--black);letter-spacing:-.36px;margin:0 auto;font-family:Epilogue;font-size:18px;font-style:normal;font-weight:400;line-height:24px}.actual-price{color:rgba(20,20,20,.5);letter-spacing:-.24px;margin-left:8px;font-family:Epilogue;font-size:12px;font-style:normal;font-weight:400;line-height:14px;-webkit-text-decoration-line:line-through;text-decoration-line:line-through}.sale-details-title{color:var(--black);letter-spacing:-.36px;text-transform:uppercase;border-top:1px solid var(--black);align-items:center;margin:0 auto;padding-top:8px;padding-bottom:8px;font-family:Epilogue;font-size:18px;font-style:normal;font-weight:400;line-height:24px;display:flex;position:relative}.sale-details-title:after{content:"";width:16px;height:2px;background-color:var(--black);position:absolute;right:0}.sale-details{margin-bottom:40px}.sale-details-2{margin-bottom:20px}@media screen and (max-width:1176px){.sale-section{padding:64px 0}.sale-column{flex-direction:column;display:flex}.sale-info-container{width:100%}.sale-column{padding:0 66px}}@media screen and (max-width:767px){.container{width:100%}.sale-section{padding:40px 0}.sale-column{padding:0}.sale-details-heading{font-size:24px}}@media screen and (max-width:430px){.wrapper{justify-content:space-between}.watch-items{width:80px;height:80px;margin:0}.preview-wrapper{width:235px;height:350px}}:root{--white:#fff;--black:#141414;--dark-green:#1e2827;--light-green:#c6cdd1;--gray:rgba(20,20,20,.5);--light-gray:rgba(20,20,20,.4);--border:rgba(255,255,255,.1)}.footer{background:var(--dark-green);padding:104px 0 32px}.footer-container{justify-content:space-between;display:flex}.lower-container{justify-content:space-between;margin-top:100px;display:flex}.footer-navigation{flex-direction:column;gap:40px;display:flex}.footer-logo-container{margin-bottom:40px}.footer-address-list{flex-direction:column;gap:20px;display:flex}.footer-navigation-list{flex-direction:column;gap:18px;display:flex}.footer-navigation-link{color:var(--white);text-transform:uppercase;font-family:Epilogue;font-size:18px;font-style:normal;font-weight:400;line-height:24px}.footer-social-list{justify-content:flex-start;gap:16px;display:flex}.footer-social-item{border:1px solid var(--border);width:40px;height:40px;border-radius:10px;justify-content:center;align-items:center;transition:background-color .25s ease-in-out;display:flex}.footer-social-item:hover{background-color:var(--light-green)}.footer-social-icon{fill:var(--white);display:flex}.footer-social-icon:hover{fill:var(--dark-green)}.lower-text{color:var(--light-green);letter-spacing:-.28px;font-family:Epilogue;font-size:14px;font-style:normal;font-weight:400;line-height:18px}.lower-footer-link{color:var(--light-green);text-align:right;letter-spacing:-.28px;font-family:Epilogue;font-size:14px;font-style:normal;font-weight:400;line-height:18px}.footer-container-5{gap:18px;display:flex}.lowest-container{border-top:1px solid var(--light-green);margin-top:20px}.webmaster{color:var(--light-green);text-align:center;letter-spacing:-.28px;padding-top:20px;font-family:Epilogue;font-size:14px;font-style:normal;font-weight:400;line-height:18px}@media screen and (max-width:767px){.webmaster{font-size:12px}}@media screen and (max-width:767px){.footer{padding:40px 0}.footer-container{flex-wrap:wrap;row-gap:40px;display:flex}.lower-container{flex-direction:column;gap:14px;display:flex}.footer-container-1{width:80%}.footer-container-2{width:20%;justify-content:flex-end}.footer-navigation-link{font-size:14px}.lower-text,.lower-footer-link{font-size:12px}} -/*# sourceMappingURL=index.c8ddc185.css.map */ diff --git a/index.c8ddc185.css.map b/index.c8ddc185.css.map deleted file mode 100644 index faf3e57..0000000 --- a/index.c8ddc185.css.map +++ /dev/null @@ -1 +0,0 @@ -{"mappings":"ACWA,uCAUA,+DAwBA,yYA+BA,0BAcA,sFAQA,4BAUA,iHAkBA,oBAQA,8EAQA,kBAIA,cAcA,yCAeA,mGAgBA,kCASA,0EAWA,+CASA,8CASA,iCAQA,iBAQA,iCAQA,oEAUA,+DASA,oDASA,oEAcA,0BEtSA,6BAUA,sBAKA,6CAMA,2BAIA,oCAMA,uBAIA,8CAMA,sIAUA,gCAKA,qDAOA,qCACI,uCAMJ,oCACI,uBCxEJ,oKAUA,+CAKA,gFAMA,qCAKA,mEAMA,iEAMA,2DAMA,gMAYA,mDAIA,0TAiBA,2EAKA,kCAKA,qCACI,wBAKJ,oCACI,sBAIA,uBAIA,oDAIA,4DAOJ,gSAiBA,+CAIA,wCAIA,uFAMA,oCAKA,iKAWA,+DChKA,oKAUA,sEAOA,4KAYI,oCAZJ,6IAsBI,qCAtBJ,wIAkCA,0EAMA,uDAOA,2BAGI,oCAHJ,4BAOI,qCAPJ,4CAaA,+DAMA,2BAIA,iFAMI,oCANJ,2GAeA,sGASA,0CAKA,qDAOA,uDAMA,8GASA,8FAMA,8QAcI,oCAdJ,oDAqBA,gIAUA,6EASA,2CAII,oCAJJ,4CAUI,qCAVJ,oCAiBA,sJAWA,kEAUA,+BAIA,wBAKA,4BAII,+BAKJ,qCACI,wCAKA,uBAIA,6DAOA,uDAMA,0BAIA,6BAKJ,oCACI,sBAIA,6BAIA,2BAIA,uBAIA,0FAOA,kJCxSJ,oKAUA,8BAIA,wDAKA,iJAUA,2KAWA,+JAWA,iEAMA,2FASA,qCACI,8BAIA,2CAGA,+BAIA,4BAKJ,oCACI,8BAIA,2BAIA,iEAMA,6DAIA,4BAIA,2BC1GJ,oKAYA,kEAMA,mJAUA,+GASA,kDAKA,0CAIA,6DAKA,uPAiBA,kIASA,iHAQA,6CAKA,wUAiBA,iGAOA,+EAMA,2OAaA,2JAUA,kLAWA,gEAKA,oKAYA,kEAIA,0RAiBE,oCAjBF,0DAwBE,qCAxBF,0DAgCA,wXAoBA,mHAOA,yDAMA,2DAMA,mEAKA,iIAUA,iCAIA,6CAOA,iEAMA,oNAaA,wGAOA,yEAUA,yQAaA,qHAMA,8OAOA,sEAKA,oEAMA,qCACE,gCAIA,4BAIA,4BAKF,oCACE,gCAIA,gCAIA,8BAIA,iGASA,mCAIA,mDAKE,4BAIA,8BC1YJ,oKAUA,gCAIA,gKAWA,mJAUA,8BAKA,uEAOA,qCACI,gCAIA,4BAIA,+BAMJ,oCACI,gCAIA,8BAIA,+BAIA,gEC3EJ,0CAKA,kDAMA,+LAwBA,iCAIA,+CAOA,+BAIA,0MAsBA,+BAKA,wIAWA,kEAMA,2EAQA,sKAWA,sKAWA,qKAWA,+OAYA,kTAkBA,mHASA,iCAIA,mCAMA,qCACE,6BAIA,gDAKA,gCAIA,6BAKF,oCACE,sBAIA,6BAIA,uBAIA,sCAKD,oCACC,uCAIC,6CAMA,2CCxOH,oKAUA,0DAKA,6DAKA,6EAMA,+DAMA,0CAIA,iEAMA,oEAMA,2JAUA,qEAMA,iMAYA,8DAIA,mDAKA,iDAIA,kJAUA,0KAWA,0CAKA,0EAKA,oLAWI,oCAXJ,2BAgBA,oCACI,uBAIA,2DAMA,6DAMA,8BAIA,uDAKA,uCAIA","sources":["index.c8ddc185.css","node_modules/modern-normalize/modern-normalize.css","src/sass/index.scss","src/sass/_common.scss","src/sass/_header.scss","src/sass/_herostyles.scss","src/sass/_about.scss","src/sass/_catalog.scss","src/sass/_gallery.scss","src/sass/_sale.scss","src/sass/_footer.scss"],"sourcesContent":["*, :before, :after {\n box-sizing: border-box;\n}\n\nhtml {\n tab-size: 4;\n -webkit-text-size-adjust: 100%;\n line-height: 1.15;\n}\n\nbody {\n margin: 0;\n font-family: system-ui, AppleSystem, BlinkMacSystemFont, Segoe UI, Roboto, Noto Sans, Ubuntu, Cantarell, Helvetica Neue, AppleSystem, BlinkMacSystemFont, Segoe UI, Roboto, Noto Sans, Ubuntu, Cantarell, Helvetica Neue, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji;\n}\n\nhr {\n height: 0;\n color: inherit;\n}\n\nabbr[title] {\n -webkit-text-decoration: underline dotted;\n text-decoration: underline dotted;\n}\n\nb, strong {\n font-weight: bolder;\n}\n\ncode, kbd, samp, pre {\n font-family: ui-monospace, SFMono-Regular, Consolas, Liberation Mono, Menlo, monospace;\n font-size: 1em;\n}\n\nsmall {\n font-size: 80%;\n}\n\nsub, sup {\n vertical-align: baseline;\n font-size: 75%;\n line-height: 0;\n position: relative;\n}\n\nsub {\n bottom: -.25em;\n}\n\nsup {\n top: -.5em;\n}\n\ntable {\n text-indent: 0;\n border-color: inherit;\n}\n\nbutton, input, optgroup, select, textarea {\n margin: 0;\n font-family: inherit;\n font-size: 100%;\n line-height: 1.15;\n}\n\nbutton, select {\n text-transform: none;\n}\n\nbutton, [type=\"button\"], [type=\"reset\"], [type=\"submit\"] {\n -webkit-appearance: button;\n}\n\n::-moz-focus-inner {\n border-style: none;\n padding: 0;\n}\n\n:-moz-focusring {\n outline: 1px dotted ButtonText;\n}\n\n:-moz-ui-invalid {\n box-shadow: none;\n}\n\nlegend {\n padding: 0;\n}\n\nprogress {\n vertical-align: baseline;\n}\n\n::-webkit-inner-spin-button, ::-webkit-outer-spin-button {\n height: auto;\n}\n\n[type=\"search\"] {\n -webkit-appearance: textfield;\n outline-offset: -2px;\n}\n\n::-webkit-search-decoration {\n -webkit-appearance: none;\n}\n\n::-webkit-file-upload-button {\n -webkit-appearance: button;\n font: inherit;\n}\n\nsummary {\n display: list-item;\n}\n\nh1, h2, h3, h4, h5, h6, p {\n margin: 0;\n}\n\nul {\n margin: 0;\n padding: 0;\n}\n\nimg {\n max-width: 100%;\n height: auto;\n display: block;\n}\n\nhtml {\n box-sizing: border-box;\n}\n\n*, :before, :after {\n box-sizing: inherit;\n}\n\na {\n text-decoration: none;\n}\n\n.list {\n margin: 0;\n padding: 0;\n list-style-type: none;\n}\n\nbody {\n letter-spacing: -.28px;\n margin: 0;\n font-family: Epilogue, sans-serif;\n font-size: 14px;\n font-style: normal;\n font-weight: 300;\n line-height: 18px;\n}\n\n.section {\n width: 100%;\n margin: auto;\n}\n\n.container {\n width: 1280px;\n margin: 0 auto;\n padding: 0 20px;\n}\n\n@media screen and (max-width: 1176px) {\n .container {\n width: 768px;\n padding: 0 32px;\n }\n}\n\n@media screen and (max-width: 767px) {\n .container {\n width: 100%;\n }\n}\n\n:root {\n --white: #fff;\n --black: #141414;\n --dark-green: #1e2827;\n --light-green: #c6cdd1;\n --gray: rgba(20, 20, 20, .5);\n --light-gray: rgba(20, 20, 20, .4);\n --border: rgba(255, 255, 255, .1);\n}\n\n.header {\n background: var(--black);\n padding: 36px 0;\n}\n\n.header-container {\n justify-content: space-between;\n align-items: center;\n display: flex;\n}\n\n.header-logo {\n width: 123px;\n height: 19px;\n}\n\n.header-navigation {\n align-items: center;\n column-gap: 80px;\n display: flex;\n}\n\n.header-navigation-list {\n align-items: center;\n gap: 40px;\n display: flex;\n}\n\n.header-navigation-list li {\n align-items: center;\n display: flex;\n}\n\n.header-navigation-link {\n color: var(--white);\n text-transform: uppercase;\n font-family: Epilogue;\n font-size: 9px;\n font-style: normal;\n font-weight: 400;\n line-height: 12px;\n transition: transform .25s ease-in-out;\n}\n\n.header-navigation-link:hover {\n transform: scale(1.2);\n}\n\n.header-button {\n color: var(--white);\n text-align: center;\n text-transform: uppercase;\n background-color: var(--dark-green);\n border: none;\n border-radius: 8px;\n padding: 18px 36px;\n font-family: Epilogue;\n font-size: 9px;\n font-style: normal;\n font-weight: 400;\n line-height: 12px;\n transition: background-color .25s ease-in-out, color .25s ease-in-out;\n}\n\n.header-button:hover {\n background-color: var(--white);\n color: var(--dark-green);\n}\n\n.hamburger-container {\n display: none;\n}\n\n@media screen and (max-width: 1176px) {\n .header {\n padding: 20px 0;\n }\n}\n\n@media screen and (max-width: 767px) {\n .container {\n width: 100%;\n }\n\n .header {\n padding: 36px 0;\n }\n\n .header-navigation-list, .header-button {\n display: none;\n }\n\n .hamburger-container {\n justify-content: flex-end;\n display: flex;\n }\n}\n\n.hamburger {\n width: 100%;\n height: 100%;\n background: var(--dark-green);\n z-index: 999;\n padding: 36px 20px;\n transition-property: transform, opacity;\n transition-duration: .25s, .25s;\n transition-timing-function: cubic-bezier(.4, 0, .2, 1), cubic-bezier(.4, 0, .2, 1);\n position: fixed;\n top: 0;\n right: 0;\n transform: translateX(0);\n}\n\n.hamburger.is-hidden {\n transform: translateX(100%);\n}\n\n.hamburger-close-icon {\n fill: var(--white);\n}\n\n.menu-burger-container {\n align-content: center;\n justify-content: space-between;\n display: flex;\n}\n\n.hamburger-close {\n color: var(--white);\n}\n\n.hamburger-menu-list {\n flex-direction: column;\n justify-content: center;\n align-items: center;\n display: flex;\n position: fixed;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n}\n\n.hamburger_link {\n color: var(--white);\n padding: 7px 0;\n display: block;\n}\n\n:root {\n --white: #fff;\n --black: #141414;\n --dark-green: #1e2827;\n --light-green: #c6cdd1;\n --gray: rgba(20, 20, 20, .5);\n --light-gray: rgba(20, 20, 20, .4);\n --border: rgba(255, 255, 255, .1);\n}\n\n.hero-section {\n background-color: var(--black);\n width: 100%;\n padding: 80px 0;\n}\n\n.hero-title {\n color: var(--white);\n letter-spacing: -1.52px;\n width: unset;\n margin-bottom: 20px;\n font-family: Epilogue;\n font-size: 38px;\n font-style: normal;\n font-weight: 600;\n line-height: 40px;\n}\n\n@media screen and (min-width: 768px) {\n .hero-title {\n color: var(--white);\n letter-spacing: -2.4px;\n font-family: Epilogue;\n font-size: 60px;\n font-style: normal;\n font-weight: 600;\n line-height: 62px;\n }\n}\n\n@media screen and (min-width: 1280px) {\n .hero-title {\n letter-spacing: -2.4px;\n width: 750px;\n order: unset;\n margin-top: 0;\n margin-bottom: 0;\n font-size: 60px;\n font-weight: 600;\n line-height: 62px;\n }\n}\n\n.hero-col-1 {\n justify-content: space-between;\n margin-bottom: 43px;\n display: flex;\n}\n\n.hero-col-2 {\n justify-content: space-between;\n display: flex;\n}\n\n.hp-slider-img {\n width: 266px;\n}\n\n@media screen and (min-width: 768px) {\n .hp-slider-img {\n width: 436px;\n }\n}\n\n@media screen and (min-width: 1280px) {\n .hp-slider-img {\n order: 3;\n align-self: flex-end;\n }\n}\n\n.banner-slider {\n flex-direction: column;\n row-gap: 20px;\n display: flex;\n}\n\nswiper-container {\n z-index: 0;\n}\n\nswiper-slide {\n height: 200px;\n justify-content: center;\n align-items: center;\n display: flex;\n}\n\n@media screen and (min-width: 768px) {\n swiper-slide {\n height: 255px;\n background-color: #1e2827;\n justify-content: center;\n align-items: center;\n display: flex;\n }\n}\n\n.slide-control {\n width: 100%;\n height: 32px;\n justify-content: space-between;\n align-items: flex-end;\n display: flex;\n}\n\n.button-list {\n gap: 12px;\n display: inline-flex;\n}\n\n.counter-list {\n color: #fff;\n gap: 6px;\n display: inline-flex;\n}\n\n.slider-range {\n width: 40px;\n height: 100%;\n position: relative;\n}\n\n.slider-range:before {\n content: \"\";\n width: 100%;\n height: 1px;\n background-color: currentColor;\n position: absolute;\n top: 7px;\n}\n\n.control_prev:hover, .control_next:hover, .control_prev:focus, .control_next:focus {\n color: #fefefe;\n}\n\n.control_prev, .control_next {\n width: 32px;\n height: 32px;\n color: rgba(254, 254, 254, .6);\n cursor: pointer;\n background: rgba(255, 255, 255, 0);\n border: 1px solid;\n border-radius: 8px;\n justify-content: center;\n align-items: center;\n padding: 0;\n transition: color .25s cubic-bezier(.4, 0, .2, 1);\n display: flex;\n}\n\n@media screen and (min-width: 768px) {\n .control_prev, .control_next {\n width: 40px;\n height: 40px;\n }\n}\n\n.chevronleft, .chevronright {\n stroke: currentColor;\n justify-content: center;\n align-items: center;\n display: flex;\n transform: translateX(-4px);\n}\n\n.slider_option {\n width: 160px;\n margin: 10px auto;\n font-size: 18px;\n position: relative;\n}\n\n.herotext-box {\n width: 282px;\n margin-left: auto;\n}\n\n@media screen and (min-width: 768px) {\n .herotext-box {\n width: 248px;\n margin-top: -40px;\n }\n}\n\n@media screen and (min-width: 1280px) {\n .herotext-box {\n order: 2;\n margin-top: 0;\n }\n}\n\n.herotext {\n color: var(--white);\n letter-spacing: -.28px;\n width: 282px;\n font-family: Epilogue;\n font-size: 14px;\n font-style: normal;\n font-weight: 300;\n line-height: 18px;\n}\n\n.hero-text {\n color: var(--white);\n font-weight: 300;\n display: inline-flex;\n}\n\n.hero-text-tablet {\n display: none;\n}\n\n.hero-watch-div {\n order: 4;\n}\n\n.hero-wristwatch {\n width: auto;\n}\n\n.hero-text-hidden {\n display: none;\n}\n\n@media screen and (max-width: 1176px) {\n .hero-col-1 {\n flex-wrap: wrap;\n display: flex;\n }\n\n .hero-title {\n width: 100%;\n }\n\n .herotext {\n width: 248px;\n position: absolute;\n top: 464px;\n right: 32px;\n }\n\n .hero-watch-div {\n width: 100%;\n order: unset;\n margin-top: 40px;\n }\n\n .hero-col-2 {\n display: block;\n }\n\n .hero-wristwatch {\n width: 100%;\n }\n}\n\n@media screen and (max-width: 767px) {\n .container {\n width: 100%;\n }\n\n .hero-section {\n padding: 40px 0;\n }\n\n .hero-title {\n font-size: 38px;\n }\n\n .herotext {\n display: none;\n }\n\n .hero-text-hidden {\n justify-content: flex-end;\n margin-top: 40px;\n padding-left: 70px;\n display: flex;\n }\n\n .herotext-mobile {\n color: var(--white);\n letter-spacing: -.28px;\n font-family: Epilogue;\n font-size: 14px;\n font-style: normal;\n font-weight: 300;\n line-height: 18px;\n }\n}\n\n:root {\n --white: #fff;\n --black: #141414;\n --dark-green: #1e2827;\n --light-green: #c6cdd1;\n --gray: rgba(20, 20, 20, .5);\n --light-gray: rgba(20, 20, 20, .4);\n --border: rgba(255, 255, 255, .1);\n}\n\n.about-section {\n padding: 80px 0;\n}\n\n.about-col-1 {\n justify-content: space-between;\n display: flex;\n}\n\n.about-title {\n color: var(--dark-green);\n letter-spacing: -.8px;\n font-family: Epilogue;\n font-size: 40px;\n font-style: normal;\n font-weight: 600;\n line-height: 44px;\n}\n\n.about-description:first-child {\n color: var(--black);\n letter-spacing: -.28px;\n width: 470px;\n font-family: Epilogue;\n font-size: 14px;\n font-style: normal;\n font-weight: 300;\n line-height: 18px;\n}\n\n.about-description {\n color: var(--black);\n letter-spacing: -.28px;\n width: 380px;\n font-family: Epilogue;\n font-size: 14px;\n font-style: normal;\n font-weight: 300;\n line-height: 18px;\n}\n\n.about-inner-col2 {\n justify-content: flex-end;\n gap: 40px;\n display: flex;\n}\n\n.about-col-2 {\n width: 100%;\n height: 500px;\n justify-content: flex-end;\n margin-top: 40px;\n display: flex;\n}\n\n@media screen and (max-width: 1176px) {\n .about-section {\n padding: 64px 0;\n }\n\n .about-description:first-child {\n width: 220px;\n }\n\n .about-description {\n width: 250px;\n }\n\n .about-inner-col2 {\n gap: 20px;\n }\n}\n\n@media screen and (max-width: 767px) {\n .about-section {\n padding: 40px 0;\n }\n\n .about-col-1 {\n display: block;\n }\n\n .about-inner-col2 {\n flex-direction: column;\n gap: 20px;\n margin-top: 40px;\n }\n\n .about-description:first-child, .about-description {\n width: 100%;\n }\n\n .about-title {\n font-size: 32px;\n }\n\n .about-col-2 {\n height: 365px;\n }\n}\n\n:root {\n --white: #fff;\n --black: #141414;\n --dark-green: #1e2827;\n --light-green: #c6cdd1;\n --gray: rgba(20, 20, 20, .5);\n --light-gray: rgba(20, 20, 20, .4);\n --border: rgba(255, 255, 255, .1);\n}\n\n.catalog-image-container {\n width: 276px;\n height: 325px;\n margin-bottom: 0;\n}\n\n.catalog-title {\n color: var(--dark-green);\n letter-spacing: -.8px;\n font-family: Epilogue;\n font-size: 40px;\n font-style: normal;\n font-weight: 600;\n line-height: 44px;\n}\n\n.catalog {\n flex-wrap: wrap;\n justify-content: space-between;\n gap: 24px;\n margin-top: 64px;\n margin-bottom: 80px;\n display: flex;\n}\n\n.catalog-image {\n margin-top: 26px;\n margin-bottom: 25px;\n}\n\n.catalog-item {\n flex-basis: calc(25% - 24px);\n}\n\n.catalog-captions {\n background-color: var(--white);\n margin-top: 0;\n}\n\n.catalog .item-title {\n color: var(--black);\n white-space: nowrap;\n width: 276px;\n text-overflow: ellipsis;\n letter-spacing: -.28px;\n margin-bottom: 4px;\n padding: 0;\n font-family: Epilogue;\n font-size: 14px;\n font-style: normal;\n font-weight: 400;\n line-height: 18px;\n overflow: hidden;\n}\n\n.catalog .item-price {\n color: var(--gray);\n letter-spacing: -.24px;\n font-family: Epilogue;\n font-size: 12px;\n font-weight: 400;\n line-height: 14px;\n}\n\n.heart-item {\n stroke: var(--black);\n fill: var(--white);\n margin-left: 230px;\n transition: fill .25s cubic-bezier(.4, 0, .2, 1);\n}\n\n.heart-item:hover, .heart-item:focus {\n fill: red;\n}\n\n.button.buy {\n background-color: var(--dark-green);\n color: var(--white);\n font-size: 12px;\n font-weight: 400px;\n border-radius: 8px;\n justify-content: flex-end;\n align-items: flex-start;\n margin-top: 80px;\n margin-left: auto;\n padding: 18px 35px;\n transition: border-color .25s cubic-bezier(.4, 0, .2, 1), background-color .25s cubic-bezier(.4, 0, .2, 1);\n display: flex;\n}\n\n.button.buy:hover, .button.buy:focus {\n border-color: var(--white);\n background-color: rgba(30, 40, 39, .8);\n}\n\n.catalog-cover-wrap {\n width: 276px;\n height: 325px;\n position: relative;\n overflow: hidden;\n}\n\n.catalog-cover-text {\n background-color: var(--dark-green);\n background-color: var(--dark-green);\n height: 100%;\n width: 100%;\n border-radius: 8px;\n padding: 20px;\n transition: transform .25s ease-in-out;\n position: absolute;\n top: 1px;\n transform: translateY(100%);\n}\n\n.catalog-cover-text-title {\n color: var(--white);\n letter-spacing: -.28px;\n margin-bottom: 10px;\n font-family: Epilogue;\n font-size: 14px;\n font-weight: 400;\n line-height: 18px;\n}\n\n.catalog-cover-text-body {\n color: rgba(255, 255, 255, .5);\n letter-spacing: -.14px;\n margin-top: 20px;\n margin-bottom: 20px;\n font-family: Epilogue;\n font-size: 14px;\n font-weight: 400;\n line-height: 18px;\n}\n\n.catalog-item:hover .catalog-cover-text {\n transform: translateY(0);\n}\n\n.backdrop {\n width: 100%;\n height: 100%;\n opacity: 1;\n z-index: 9999;\n background-color: rgba(0, 0, 0, .2);\n transition: opacity .25s cubic-bezier(.4, 0, .2, 1);\n position: fixed;\n top: 0;\n left: 0;\n}\n\n.backdrop.is-hidden .modal {\n transform: translate(-50%, -50%)scale(0);\n}\n\n.catalog-modal {\n width: 904px;\n height: 694px;\n background-color: var(--white);\n border-radius: 8px;\n flex-direction: row;\n gap: 40px;\n padding: 40px;\n transition: transform .25s cubic-bezier(.4, 0, .2, 1);\n display: flex;\n position: absolute;\n top: 50%;\n left: 50%;\n overflow-y: auto;\n transform: translate(-50%, -50%)scale(1);\n}\n\n@media screen and (min-width: 768px) {\n .catalog-modal {\n width: 904px;\n height: 694px;\n top: 50%;\n left: 50%;\n }\n}\n\n@media screen and (min-width: 1158px) {\n .catalog-modal {\n width: 904px;\n height: 694px;\n top: 50%;\n left: 50%;\n }\n}\n\n.catalog-close {\n width: 24px;\n height: 24px;\n cursor: pointer;\n background-color: rgba(0, 0, 0, 0);\n border: 1px solid rgba(0, 0, 0, 0);\n justify-content: center;\n align-items: center;\n padding: 0;\n transition: transform .25s cubic-bezier(.4, 0, .2, 1), border-radius .25s cubic-bezier(.4, 0, .2, 1), border-color .25s cubic-bezier(.4, 0, .2, 1);\n display: flex;\n position: absolute;\n top: 20px;\n right: 20px;\n transform: rotate(0deg);\n}\n\n.catalog-close:hover, .catalog-close:focus {\n border-color: var(--darkgreen);\n border-radius: 50%;\n transform: rotate(180deg);\n}\n\n.is-hidden {\n visibility: none;\n opacity: 0;\n pointer-events: none;\n}\n\n.product-modal-image {\n width: 276px;\n height: 375px;\n margin-top: 0;\n}\n\n.modal-catalog-captions {\n background-color: var(--white);\n margin-top: 0;\n}\n\n.modal-item-title {\n white-space: nowrap;\n width: 276px;\n text-overflow: ellipsis;\n margin-bottom: 0;\n padding: 0;\n font-size: 14px;\n overflow: hidden;\n}\n\n.modal-item-price {\n font-size: 12px;\n}\n\n.form-modal-container {\n width: 100%;\n height: 100%;\n}\n\n.form-field {\n flex-direction: column;\n display: flex;\n position: relative;\n}\n\n.form-input, .form-textarea {\n width: 100%;\n border: 1px solid rgba(46, 47, 66, .4);\n border-radius: 8px;\n margin-top: 12px;\n margin-bottom: 24px;\n padding: 12px 16px;\n font-size: 16px;\n transition: border-color .25s cubic-bezier(.4, 0, .2, 1);\n}\n\n.form-input:hover, .form-input:focus, .form-textarea:hover, .form-textarea:focus {\n border-color: var(--black);\n}\n\n.form-textarea {\n resize: none;\n height: 166px;\n padding: 12px 16px;\n font-size: 16px;\n}\n\n.button.button-submit {\n width: 100%;\n background-color: var(--dark-green);\n color: var(--white);\n border: 1px solid rgba(0, 0, 0, 0);\n border-radius: 8px;\n padding: 18px 0;\n font-size: 12px;\n transition: border-color .25s cubic-bezier(.4, 0, .2, 1), background-color .25s cubic-bezier(.4, 0, .2, 1);\n}\n\n.button.button-submit:hover, .button.button-submit:focus {\n border-color: var(--white);\n background-color: rgba(30, 40, 39, .8);\n}\n\n.privacy-policy {\n color: rgba(20, 20, 20, .4);\n font-size: 12px;\n text-decoration: none;\n transition: -webkit-text-decoration .25s cubic-bezier(.4, 0, .2, 1), text-decoration .25s cubic-bezier(.4, 0, .2, 1);\n}\n\n.privacy-policy:hover, .privacy-policy:focus {\n text-decoration: underline;\n}\n\n.submit-note {\n color: rgba(20, 20, 20, .4);\n margin-top: 12px;\n font-size: 12px;\n}\n\n@media screen and (max-width: 1176px) {\n .catalog-section {\n padding: 64px 0;\n }\n\n .catalog {\n margin-bottom: 40px;\n }\n\n .catalog-modal {\n width: 744px;\n }\n}\n\n@media screen and (max-width: 767px) {\n .catalog-section {\n padding: 40px 0;\n }\n\n .catalog {\n justify-content: center;\n }\n\n .catalog-title {\n font-size: 32px;\n }\n\n .catalog-modal {\n width: 90%;\n height: 95vh;\n flex-wrap: wrap;\n justify-content: center;\n gap: 10px;\n display: flex;\n }\n\n .form-modal-container {\n height: unset;\n }\n\n .product-modal-image {\n width: 100%;\n height: fit-content;\n }\n\n .catalog-image {\n margin-top: 0;\n }\n\n .submit-note br {\n display: none;\n }\n}\n\n:root {\n --white: #fff;\n --black: #141414;\n --dark-green: #1e2827;\n --light-green: #c6cdd1;\n --gray: rgba(20, 20, 20, .5);\n --light-gray: rgba(20, 20, 20, .4);\n --border: rgba(255, 255, 255, .1);\n}\n\n.gallery-section {\n padding: 80px 0;\n}\n\n.top-text {\n color: var(--light-gray);\n letter-spacing: .72px;\n margin-bottom: 8px;\n font-family: Epilogue;\n font-size: 12px;\n font-style: normal;\n font-weight: 300;\n line-height: 14px;\n}\n\n.gallery-title {\n color: var(--dark-green);\n letter-spacing: -.8px;\n font-family: Epilogue;\n font-size: 40px;\n font-style: normal;\n font-weight: 600;\n line-height: 44px;\n}\n\n.gallery-item {\n margin-top: 80px;\n}\n\n.gallery-item-list {\n justify-content: space-between;\n gap: 24px;\n display: flex;\n}\n\n@media screen and (max-width: 1176px) {\n .gallery-section {\n padding: 64px 0;\n }\n\n .catalog {\n margin-bottom: 40px;\n }\n\n .gallery-item {\n margin-top: 40px;\n }\n}\n\n@media screen and (max-width: 767px) {\n .gallery-section {\n padding: 40px 0;\n }\n\n .gallery-title {\n font-size: 32px;\n }\n\n .gallery-title br {\n display: none;\n }\n\n .gallery-item-list {\n flex-direction: column;\n gap: 20px;\n display: flex;\n }\n}\n\n.sale-section {\n width: 100%;\n padding: 0 0 80px;\n}\n\n.sale-column {\n gap: 40px;\n padding: 0 98px;\n display: flex;\n}\n\n.sale-description, .sale-description-details {\n color: rgba(20, 20, 20, .5);\n letter-spacing: -.14px;\n margin: 0 auto;\n font-family: Epilogue;\n font-size: 14px;\n font-style: normal;\n font-weight: 400;\n line-height: 18px;\n}\n\n.sale-watch:hover {\n cursor: pointer;\n}\n\n.watch-items {\n width: 146px;\n height: 146px;\n margin: 0;\n}\n\n.sale-info-container {\n width: 50%;\n}\n\n.sale-heading {\n color: var(--black);\n letter-spacing: -.64px;\n color: var(--black);\n letter-spacing: -.64px;\n margin-bottom: 40px;\n font-family: Epilogue;\n font-size: 32px;\n font-style: normal;\n font-weight: 600;\n line-height: 40px;\n}\n\n.wrapper {\n gap: 20px;\n display: flex;\n}\n\n.preview-wrapper {\n width: 406px;\n height: 614px;\n background-color: var(--black);\n justify-content: center;\n align-items: center;\n margin: 0;\n display: flex;\n}\n\n.sale-watch-container {\n flex-direction: column;\n gap: 10px;\n display: flex;\n}\n\n.sale-watch-preview {\n width: 100%;\n background-color: #141414;\n margin: 0;\n padding: 0;\n}\n\n.sale-details-heading {\n color: var(--black);\n letter-spacing: -.48px;\n margin-bottom: 0;\n font-family: Epilogue;\n font-size: 38px;\n font-style: normal;\n font-weight: 400;\n line-height: 40px;\n}\n\n.sale-product-tag {\n color: rgba(20, 20, 20, .5);\n letter-spacing: -.28px;\n margin-top: 8px;\n font-family: Epilogue;\n font-size: 14px;\n font-style: normal;\n font-weight: 400;\n line-height: 18px;\n}\n\n.current-price-on-sale {\n color: var(--black);\n letter-spacing: -.36px;\n margin: 0 auto;\n font-family: Epilogue;\n font-size: 18px;\n font-style: normal;\n font-weight: 400;\n line-height: 24px;\n}\n\n.actual-price {\n color: rgba(20, 20, 20, .5);\n letter-spacing: -.24px;\n margin-left: 8px;\n font-family: Epilogue;\n font-size: 12px;\n font-style: normal;\n font-weight: 400;\n line-height: 14px;\n -webkit-text-decoration-line: line-through;\n text-decoration-line: line-through;\n}\n\n.sale-details-title {\n color: var(--black);\n letter-spacing: -.36px;\n text-transform: uppercase;\n border-top: 1px solid var(--black);\n align-items: center;\n margin: 0 auto;\n padding-top: 8px;\n padding-bottom: 8px;\n font-family: Epilogue;\n font-size: 18px;\n font-style: normal;\n font-weight: 400;\n line-height: 24px;\n display: flex;\n position: relative;\n}\n\n.sale-details-title:after {\n content: \"\";\n width: 16px;\n height: 2px;\n background-color: var(--black);\n position: absolute;\n right: 0;\n}\n\n.sale-details {\n margin-bottom: 40px;\n}\n\n.sale-details-2 {\n margin-bottom: 20px;\n}\n\n@media screen and (max-width: 1176px) {\n .sale-section {\n padding: 64px 0;\n }\n\n .sale-column {\n flex-direction: column;\n display: flex;\n }\n\n .sale-info-container {\n width: 100%;\n }\n\n .sale-column {\n padding: 0 66px;\n }\n}\n\n@media screen and (max-width: 767px) {\n .container {\n width: 100%;\n }\n\n .sale-section {\n padding: 40px 0;\n }\n\n .sale-column {\n padding: 0;\n }\n\n .sale-details-heading {\n font-size: 24px;\n }\n}\n\n@media screen and (max-width: 430px) {\n .wrapper {\n justify-content: space-between;\n }\n\n .watch-items {\n width: 80px;\n height: 80px;\n margin: 0;\n }\n\n .preview-wrapper {\n width: 235px;\n height: 350px;\n }\n}\n\n:root {\n --white: #fff;\n --black: #141414;\n --dark-green: #1e2827;\n --light-green: #c6cdd1;\n --gray: rgba(20, 20, 20, .5);\n --light-gray: rgba(20, 20, 20, .4);\n --border: rgba(255, 255, 255, .1);\n}\n\n.footer {\n background: var(--dark-green);\n padding: 104px 0 32px;\n}\n\n.footer-container {\n justify-content: space-between;\n display: flex;\n}\n\n.lower-container {\n justify-content: space-between;\n margin-top: 100px;\n display: flex;\n}\n\n.footer-navigation {\n flex-direction: column;\n gap: 40px;\n display: flex;\n}\n\n.footer-logo-container {\n margin-bottom: 40px;\n}\n\n.footer-address-list {\n flex-direction: column;\n gap: 20px;\n display: flex;\n}\n\n.footer-navigation-list {\n flex-direction: column;\n gap: 18px;\n display: flex;\n}\n\n.footer-navigation-link {\n color: var(--white);\n text-transform: uppercase;\n font-family: Epilogue;\n font-size: 18px;\n font-style: normal;\n font-weight: 400;\n line-height: 24px;\n}\n\n.footer-social-list {\n justify-content: flex-start;\n gap: 16px;\n display: flex;\n}\n\n.footer-social-item {\n border: 1px solid var(--border);\n width: 40px;\n height: 40px;\n border-radius: 10px;\n justify-content: center;\n align-items: center;\n transition: background-color .25s ease-in-out;\n display: flex;\n}\n\n.footer-social-item:hover {\n background-color: var(--light-green);\n}\n\n.footer-social-icon {\n fill: var(--white);\n display: flex;\n}\n\n.footer-social-icon:hover {\n fill: var(--dark-green);\n}\n\n.lower-text {\n color: var(--light-green);\n letter-spacing: -.28px;\n font-family: Epilogue;\n font-size: 14px;\n font-style: normal;\n font-weight: 400;\n line-height: 18px;\n}\n\n.lower-footer-link {\n color: var(--light-green);\n text-align: right;\n letter-spacing: -.28px;\n font-family: Epilogue;\n font-size: 14px;\n font-style: normal;\n font-weight: 400;\n line-height: 18px;\n}\n\n.footer-container-5 {\n gap: 18px;\n display: flex;\n}\n\n.lowest-container {\n border-top: 1px solid var(--light-green);\n margin-top: 20px;\n}\n\n.webmaster {\n color: var(--light-green);\n text-align: center;\n letter-spacing: -.28px;\n padding-top: 20px;\n font-family: Epilogue;\n font-size: 14px;\n font-style: normal;\n font-weight: 400;\n line-height: 18px;\n}\n\n@media screen and (max-width: 767px) {\n .webmaster {\n font-size: 12px;\n }\n}\n\n@media screen and (max-width: 767px) {\n .footer {\n padding: 40px 0;\n }\n\n .footer-container {\n flex-wrap: wrap;\n row-gap: 40px;\n display: flex;\n }\n\n .lower-container {\n flex-direction: column;\n gap: 14px;\n display: flex;\n }\n\n .footer-container-1 {\n width: 80%;\n }\n\n .footer-container-2 {\n width: 20%;\n justify-content: flex-end;\n }\n\n .footer-navigation-link {\n font-size: 14px;\n }\n\n .lower-text, .lower-footer-link {\n font-size: 12px;\n }\n}\n\n/*# sourceMappingURL=index.c8ddc185.css.map */\n","/*! modern-normalize v1.1.0 | MIT License | https://github.com/sindresorhus/modern-normalize */\n\n/*\nDocument\n========\n*/\n\n/**\nUse a better box model (opinionated).\n*/\n\n*,\n::before,\n::after {\n\tbox-sizing: border-box;\n}\n\n/**\nUse a more readable tab size (opinionated).\n*/\n\nhtml {\n\t-moz-tab-size: 4;\n\ttab-size: 4;\n}\n\n/**\n1. Correct the line height in all browsers.\n2. Prevent adjustments of font size after orientation changes in iOS.\n*/\n\nhtml {\n\tline-height: 1.15; /* 1 */\n\t-webkit-text-size-adjust: 100%; /* 2 */\n}\n\n/*\nSections\n========\n*/\n\n/**\nRemove the margin in all browsers.\n*/\n\nbody {\n\tmargin: 0;\n}\n\n/**\nImprove consistency of default fonts in all browsers. (https://github.com/sindresorhus/modern-normalize/issues/3)\n*/\n\nbody {\n\tfont-family:\n\t\tsystem-ui,\n\t\t-apple-system, /* Firefox supports this but not yet `system-ui` */\n\t\t'Segoe UI',\n\t\tRoboto,\n\t\tHelvetica,\n\t\tArial,\n\t\tsans-serif,\n\t\t'Apple Color Emoji',\n\t\t'Segoe UI Emoji';\n}\n\n/*\nGrouping content\n================\n*/\n\n/**\n1. Add the correct height in Firefox.\n2. Correct the inheritance of border color in Firefox. (https://bugzilla.mozilla.org/show_bug.cgi?id=190655)\n*/\n\nhr {\n\theight: 0; /* 1 */\n\tcolor: inherit; /* 2 */\n}\n\n/*\nText-level semantics\n====================\n*/\n\n/**\nAdd the correct text decoration in Chrome, Edge, and Safari.\n*/\n\nabbr[title] {\n\ttext-decoration: underline dotted;\n}\n\n/**\nAdd the correct font weight in Edge and Safari.\n*/\n\nb,\nstrong {\n\tfont-weight: bolder;\n}\n\n/**\n1. Improve consistency of default fonts in all browsers. (https://github.com/sindresorhus/modern-normalize/issues/3)\n2. Correct the odd 'em' font sizing in all browsers.\n*/\n\ncode,\nkbd,\nsamp,\npre {\n\tfont-family:\n\t\tui-monospace,\n\t\tSFMono-Regular,\n\t\tConsolas,\n\t\t'Liberation Mono',\n\t\tMenlo,\n\t\tmonospace; /* 1 */\n\tfont-size: 1em; /* 2 */\n}\n\n/**\nAdd the correct font size in all browsers.\n*/\n\nsmall {\n\tfont-size: 80%;\n}\n\n/**\nPrevent 'sub' and 'sup' elements from affecting the line height in all browsers.\n*/\n\nsub,\nsup {\n\tfont-size: 75%;\n\tline-height: 0;\n\tposition: relative;\n\tvertical-align: baseline;\n}\n\nsub {\n\tbottom: -0.25em;\n}\n\nsup {\n\ttop: -0.5em;\n}\n\n/*\nTabular data\n============\n*/\n\n/**\n1. Remove text indentation from table contents in Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=999088, https://bugs.webkit.org/show_bug.cgi?id=201297)\n2. Correct table border color inheritance in all Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=935729, https://bugs.webkit.org/show_bug.cgi?id=195016)\n*/\n\ntable {\n\ttext-indent: 0; /* 1 */\n\tborder-color: inherit; /* 2 */\n}\n\n/*\nForms\n=====\n*/\n\n/**\n1. Change the font styles in all browsers.\n2. Remove the margin in Firefox and Safari.\n*/\n\nbutton,\ninput,\noptgroup,\nselect,\ntextarea {\n\tfont-family: inherit; /* 1 */\n\tfont-size: 100%; /* 1 */\n\tline-height: 1.15; /* 1 */\n\tmargin: 0; /* 2 */\n}\n\n/**\nRemove the inheritance of text transform in Edge and Firefox.\n1. Remove the inheritance of text transform in Firefox.\n*/\n\nbutton,\nselect { /* 1 */\n\ttext-transform: none;\n}\n\n/**\nCorrect the inability to style clickable types in iOS and Safari.\n*/\n\nbutton,\n[type='button'],\n[type='reset'],\n[type='submit'] {\n\t-webkit-appearance: button;\n}\n\n/**\nRemove the inner border and padding in Firefox.\n*/\n\n::-moz-focus-inner {\n\tborder-style: none;\n\tpadding: 0;\n}\n\n/**\nRestore the focus styles unset by the previous rule.\n*/\n\n:-moz-focusring {\n\toutline: 1px dotted ButtonText;\n}\n\n/**\nRemove the additional ':invalid' styles in Firefox.\nSee: https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737\n*/\n\n:-moz-ui-invalid {\n\tbox-shadow: none;\n}\n\n/**\nRemove the padding so developers are not caught out when they zero out 'fieldset' elements in all browsers.\n*/\n\nlegend {\n\tpadding: 0;\n}\n\n/**\nAdd the correct vertical alignment in Chrome and Firefox.\n*/\n\nprogress {\n\tvertical-align: baseline;\n}\n\n/**\nCorrect the cursor style of increment and decrement buttons in Safari.\n*/\n\n::-webkit-inner-spin-button,\n::-webkit-outer-spin-button {\n\theight: auto;\n}\n\n/**\n1. Correct the odd appearance in Chrome and Safari.\n2. Correct the outline style in Safari.\n*/\n\n[type='search'] {\n\t-webkit-appearance: textfield; /* 1 */\n\toutline-offset: -2px; /* 2 */\n}\n\n/**\nRemove the inner padding in Chrome and Safari on macOS.\n*/\n\n::-webkit-search-decoration {\n\t-webkit-appearance: none;\n}\n\n/**\n1. Correct the inability to style clickable types in iOS and Safari.\n2. Change font properties to 'inherit' in Safari.\n*/\n\n::-webkit-file-upload-button {\n\t-webkit-appearance: button; /* 1 */\n\tfont: inherit; /* 2 */\n}\n\n/*\nInteractive\n===========\n*/\n\n/*\nAdd the correct display in Chrome and Safari.\n*/\n\nsummary {\n\tdisplay: list-item;\n}\n","@import './common';\n@import './header';\n@import './herostyles';\n@import './about';\n@import './catalog';\n@import './gallery';\n@import './sale';\n@import './footer';","@import '~node_modules/modern-normalize/modern-normalize.css';\nh1,\nh2,\nh3,\nh4,\nh5,\nh6,\np {\n margin: 0;\n}\n\nul {\n margin: 0;\n padding: 0;\n}\n\nimg {\n display: block;\n max-width: 100%;\n height: auto;\n}\n\nhtml {\n box-sizing: border-box;\n}\n\n*,\n*::before,\n*::after {\n box-sizing: inherit;\n}\n\na{\n text-decoration: none;\n}\n\n.list {\n list-style-type: none;\n padding: 0;\n margin: 0;\n}\n\nbody {\n font-family: 'Epilogue', sans-serif;\n font-size: 14px;\n font-style: normal;\n font-weight: 300;\n line-height: 18px;\n letter-spacing: -0.28px;\n margin: 0;\n}\n\n.section{\n width: 100%;\n margin: auto;\n}\n\n.container {\n width: 1280px;\n margin: 0 auto;\n padding: 0 20px;\n}\n\n\n@media screen and (max-width: 1176px){\n .container {\n width: 768px;\n padding: 0 32px;\n }\n}\n\n@media screen and (max-width: 767px) {\n .container {\n width: 100%;\n }\n}",":root {\n --white: #ffffff;\n --black: #141414;\n --dark-green: #1E2827;\n --light-green: #C6CDD1;\n --gray: rgba(20, 20, 20, 0.50);\n --light-gray: rgba(20, 20, 20, 0.40);\n --border: rgba(255, 255, 255, 0.10);\n}\n\n.header{\n padding: 36px 0;\n background: var(--black);\n}\n\n.header-container{\n display: flex;\n align-items: center;\n justify-content: space-between;\n}\n\n.header-logo{\n width: 123px;\n height: 19px;\n}\n\n.header-navigation{\n display: flex;\n align-items: center;\n column-gap: 80px;\n}\n\n.header-navigation-list{\n display: flex;\n align-items: center;\n gap: 40px;\n}\n\n.header-navigation-list li{\n display: flex;\n align-items: center;\n}\n\n\n.header-navigation-link{\n color: var(--white);\n font-family: Epilogue;\n font-size: 9px;\n font-style: normal;\n font-weight: 400;\n line-height: 12px;\n text-transform: uppercase;\n\n transition: transform 250ms ease-in-out;\n}\n\n.header-navigation-link:hover{\n transform: scale(1.2);\n}\n\n.header-button{\n color: var(--white);\n text-align: center;\n font-family: Epilogue;\n font-size: 9px;\n font-style: normal;\n font-weight: 400;\n line-height: 12px;\n text-transform: uppercase;\n padding: 18px 36px;\n border-radius: 8px;\n background-color: var(--dark-green);\n border: none;\n\n transition: background-color 250ms ease-in-out, color 250ms ease-in-out;\n}\n\n.header-button:hover{\n background-color: var(--white);\n color: var(--dark-green);\n}\n\n.hamburger-container{\n display: none;\n}\n\n\n@media screen and (max-width: 1176px) {\n .header{\n padding: 20px 0;\n }\n}\n\n@media screen and (max-width: 767px) {\n .container {\n width: 100%;\n }\n\n .header {\n padding: 36px 0;\n }\n\n .header-navigation-list, .header-button{\n display: none;\n }\n\n .hamburger-container{\n display: flex;\n justify-content: flex-end;\n }\n}\n\n\n.hamburger{\n width: 100%;\n height: 100%;\n background: var(--dark-green);\n transform: translateX(0);\n z-index: 999;\n position: fixed;\n top: 0;\n right: 0;\n padding: 36px 20px;\n\n transform: translateX(0);\n transition-property: transform, opacity;\n transition-duration: 250ms, 250ms;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1), cubic-bezier(0.4, 0, 0.2, 1);\n}\n\n.hamburger.is-hidden{\n transform: translateX(100%);\n}\n\n.hamburger-close-icon{\n fill: var(--white);\n}\n\n.menu-burger-container{\n display: flex;\n align-content: center;\n justify-content: space-between;\n}\n\n.hamburger-close{\n color: var(--white);\n}\n\n\n.hamburger-menu-list{\n position: fixed;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n}\n\n.hamburger_link{\n color: var(--white);\n padding: 7px 0;\n display: block;\n}",":root {\n --white: #ffffff;\n --black: #141414;\n --dark-green: #1E2827;\n --light-green: #C6CDD1;\n --gray: rgba(20, 20, 20, 0.50);\n --light-gray: rgba(20, 20, 20, 0.40);\n --border: rgba(255, 255, 255, 0.10);\n}\n\n.hero-section {\n background-color: var(--black);\n width: 100%;\n padding: 80px 0;\n\n}\n\n.hero-title {\n color: var(--white);\n font-family: 'Epilogue';\n font-size: 38px;\n font-style: normal;\n font-weight: 600;\n line-height: 40px;\n letter-spacing: -1.52px;\n margin-bottom: 20px;\n width: unset;\n \n\n @media screen and (min-width: 768px) {\n color: var(--white);\n font-family: 'Epilogue';\n font-size: 60px;\n font-style: normal;\n font-weight: 600;\n line-height: 62px; \n letter-spacing: -2.4px;\n}\n\n @media screen and (min-width: 1280px) {\n font-size: 60px;\n font-weight: 600;\n line-height: 62px;\n letter-spacing: -2.4px;\n margin-top: 0;\n margin-bottom: 0;\n width: 750px;\n order: unset; \n }\n}\n\n.hero-col-1{\n display: flex;\n justify-content: space-between;\n margin-bottom: 43px;\n}\n\n.hero-col-2{\n display: flex;\n justify-content: space-between;\n}\n\n\n/* Start of Slider */\n.hp-slider-img{\n width: 266px;\n\n @media screen and (min-width: 768px) {\n width: 436px;\n }\n\n @media screen and (min-width: 1280px){\n order: 3;\n align-self: flex-end; \n }\n}\n\n.banner-slider{ \n display: flex;\n flex-direction: column;\n row-gap: 20px;\n}\n\nswiper-container {\n z-index: 0;\n}\n\nswiper-slide{\n display: flex;\n justify-content: center;\n align-items: center;\n height: 200px;\n\n @media screen and (min-width: 768px) {\n background-color: #1e2827;\n display: flex;\n justify-content: center;\n align-items: center;\n height: 255px;\n }\n}\n\n.slide-control {\n width: 100%;\n display: flex;\n align-items: flex-end;\n justify-content: space-between;\n height: 32px;\n\n}\n\n.button-list{\n display: inline-flex;\n gap: 12px;\n}\n\n.counter-list{\n display: inline-flex;\n color:#fff;\n gap: 6px;\n\n}\n\n.slider-range{\n position: relative;\n width: 40px;\n height: 100%;\n}\n\n.slider-range::before{\n content: \"\";\n position: absolute;\n top: 7px;\n width: 100%;\n height: 1px;\n background-color: currentColor; \n}\n\n.control_prev:hover, .control_next:hover,\n.control_prev:focus, .control_next:focus {\n color: rgba(254, 254, 254, 1);\n\n}\n\n.control_prev, .control_next {\n border-radius: 8px;\n width: 32px;\n height: 32px;\n background: #ffffff00;\n color: rgba(254, 254, 254, 0.60);\n cursor: pointer;\n border: 1px solid currentColor;\n display: flex;\n justify-content: center;\n align-items: center;\n padding: 0;\n transition: color 250ms cubic-bezier(0.4, 0, 0.2, 1);\n\n @media screen and (min-width: 768px) {\n width: 40px;\n height: 40px;\n \n }\n}\n\n.chevronleft, .chevronright {\n stroke: currentColor;\n display: flex;\n justify-content: center;\n align-items: center;\n transform: translateX(-4px);\n}\n\n\n\n.slider_option {\n position: relative;\n margin: 10px auto;\n width: 160px;\n font-size: 18px;\n}\n\n/** End Slider **/\n\n.herotext-box{\n width: 282px;\n margin-left: auto;\n\n @media screen and (min-width: 768px) {\n width: 248px;\n margin-top: -40px;\n \n }\n\n @media screen and (min-width: 1280px) {\n margin-top: 0;\n order: 2;\n \n }\n}\n\n.herotext{\n color: var(--white);\n font-family: 'Epilogue';\n font-size: 14px;\n font-style: normal;\n font-weight: 300;\n line-height: 18px;\n letter-spacing: -0.28px;\n width: 282px;\n}\n\n.hero-text {\n \n color: var(--white);\n font-weight: 300;\n display: inline-flex;\n\n @media screen and (min-width: 768px) { \n }\n}\n\n.hero-text-tablet{\n display: none;\n}\n\n.hero-watch-div{\n order: 4;\n\n}\n\n.hero-wristwatch{\n width: auto;\n}\n\n .hero-text-hidden{\n display: none;\n }\n\n\n@media screen and (max-width: 1176px) {\n .hero-col-1{\n display: flex;\n flex-wrap: wrap;\n }\n\n .hero-title{\n width: 100%;\n }\n\n .herotext{\n position: absolute;\n right: 32px;\n top: 464px;\n width: 248px;\n }\n\n .hero-watch-div{\n width: 100%;\n order: unset;\n margin-top: 40px;\n }\n\n .hero-col-2{\n display: block;\n }\n\n .hero-wristwatch{\n width: 100%;\n }\n}\n\n@media screen and (max-width: 767px) {\n .container {\n width: 100%;\n }\n\n .hero-section{\n padding: 40px 0;\n }\n\n .hero-title{\n font-size: 38px;\n }\n\n .herotext{\n display: none;\n }\n\n .hero-text-hidden{\n display: flex;\n justify-content: flex-end;\n margin-top: 40px;\n padding-left: 70px;\n }\n\n .herotext-mobile{\n color: var(--white);\n font-family: 'Epilogue';\n font-size: 14px;\n font-style: normal;\n font-weight: 300;\n line-height: 18px;\n letter-spacing: -0.28px;\n }\n}",":root {\n --white: #ffffff;\n --black: #141414;\n --dark-green: #1E2827;\n --light-green: #C6CDD1;\n --gray: rgba(20, 20, 20, 0.50);\n --light-gray: rgba(20, 20, 20, 0.40);\n --border: rgba(255, 255, 255, 0.10);\n}\n\n.about-section{\n padding: 80px 0;\n}\n\n.about-col-1{\n display: flex;\n justify-content: space-between;\n}\n\n.about-title{\n color: var(--dark-green);\n font-family: 'Epilogue';\n font-size: 40px;\n font-style: normal;\n font-weight: 600;\n line-height: 44px;\n letter-spacing: -0.8px;\n}\n\n.about-description:first-child {\n color: var(--black);\n font-family: 'Epilogue';\n font-size: 14px;\n font-style: normal;\n font-weight: 300;\n line-height: 18px;\n letter-spacing: -0.28px;\n width: 470px;\n}\n\n.about-description{\n color: var(--black);\n font-family: 'Epilogue';\n font-size: 14px;\n font-style: normal;\n font-weight: 300;\n line-height: 18px;\n letter-spacing: -0.28px;\n width: 380px;\n}\n\n.about-inner-col2{\n display: flex;\n justify-content: flex-end;\n gap: 40px;\n}\n\n.about-col-2{\n margin-top: 40px;\n width: 100%;\n height: 500px;\n display: flex;\n justify-content: flex-end;\n}\n\n\n@media screen and (max-width: 1176px) {\n .about-section{\n padding: 64px 0;\n }\n\n .about-description:first-child{\n width: 220px;\n }\n .about-description{\n width: 250px;\n }\n\n .about-inner-col2{\n gap: 20px;\n }\n}\n\n@media screen and (max-width: 767px) {\n .about-section {\n padding: 40px 0;\n }\n\n .about-col-1{\n display: block;\n }\n\n .about-inner-col2{\n margin-top: 40px;\n gap: 20px;\n flex-direction: column;\n }\n\n .about-description:first-child, .about-description {\n width: 100%;\n }\n\n .about-title{\n font-size: 32px;\n }\n\n .about-col-2{\n height: 365px;\n }\n\n \n\n}",":root {\n --white: #ffffff;\n --black: #141414;\n --dark-green: #1e2827;\n --light-green: #c6cdd1;\n --gray: rgba(20, 20, 20, 0.5);\n --light-gray: rgba(20, 20, 20, 0.4);\n --border: rgba(255, 255, 255, 0.1);\n}\n\n/*catalog styling*/\n\n.catalog-image-container {\n margin-bottom: 0px;\n width: 276px;\n height: 325px;\n}\n\n.catalog-title {\n color: var(--dark-green);\n font-family: 'Epilogue';\n font-size: 40px;\n font-style: normal;\n font-weight: 600;\n line-height: 44px;\n letter-spacing: -0.8px;\n}\n\n.catalog {\n display: flex;\n flex-wrap: wrap;\n justify-content: space-between;\n margin-top: 64px;\n margin-bottom: 80px;\n gap: 24px;\n}\n\n.catalog-image {\n margin-top: 26px;\n margin-bottom: 25px;\n}\n\n.catalog-item {\n flex-basis: calc(100% / 4 - 24px);\n}\n\n.catalog-captions {\n background-color: var(--white);\n margin-top: 0px;\n}\n\n.catalog .item-title {\n color: var(--black);\n margin-bottom: 0;\n padding: 0;\n white-space: nowrap;\n width: 276px;\n text-overflow: ellipsis;\n overflow: hidden;\n font-size: 14px;\n font-family: 'Epilogue';\n font-weight: 400;\n font-style: normal;\n line-height: 18px;\n letter-spacing: -0.28px;\n margin-bottom: 4px;\n}\n\n.catalog .item-price {\n color: var(--gray);\n font-family: 'Epilogue';\n font-size: 12px;\n font-weight: 400;\n line-height: 14px;\n letter-spacing: -0.24px;\n}\n\n.heart-item {\n stroke: var(--black);\n fill: var(--white);\n margin-left: 230px;\n\n transition: fill 250ms cubic-bezier(0.4, 0, 0.2, 1);\n}\n\n.heart-item:hover,\n.heart-item:focus {\n fill: red;\n}\n\n.button.buy {\n background-color: var(--dark-green);\n color: var(--white);\n font-size: 12px;\n font-weight: 400px;\n padding: 18px 35px;\n border-radius: 8px;\n display: flex;\n justify-content: flex-end;\n align-items: flex-start;\n margin-left: auto;\n margin-top: 80px;\n\n transition: border-color 250ms cubic-bezier(0.4, 0, 0.2, 1),\n background-color 250ms cubic-bezier(0.4, 0, 0.2, 1);\n}\n\n.button.buy:hover,\n.button.buy:focus {\n border-color: var(--white);\n background-color: rgba(30, 40, 39, 0.8);\n}\n\n/*for cover wrap*/\n.catalog-cover-wrap {\n position: relative;\n overflow: hidden;\n width: 276px;\n height: 325px;\n}\n.catalog-cover-text {\n position: absolute;\n background-color: var(--dark-green);\n top: 1;\n background-color: var(--dark-green);\n border-radius: 8px;\n transform: translateY(100%);\n transition: transform 250ms ease-in-out;\n height: 100%;\n width: 100%;\n padding: 20px;\n}\n\n.catalog-cover-text-title {\n font-family: 'Epilogue';\n font-size: 14px;\n color: var(--white);\n font-weight: 400;\n margin-bottom: 10px;\n line-height: 18px;\n letter-spacing: -0.28px;\n}\n\n.catalog-cover-text-body {\n font-family: 'Epilogue';\n font-size: 14px;\n font-weight: 400;\n color: rgba(255, 255, 255, 0.5);\n line-height: 18px;\n letter-spacing: -0.14px;\n margin-top: 20px;\n margin-bottom: 20px;\n}\n\n.catalog-item:hover .catalog-cover-text {\n transform: translateY(0);\n}\n\n/*for modal*/\n.backdrop {\n position: fixed;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n background-color: rgba(0, 0, 0, 0.2);\n opacity: 1;\n z-index: 9999;\n transition: opacity 250ms cubic-bezier(0.4, 0, 0.2, 1);\n}\n\n.backdrop.is-hidden .modal {\n transform: translate(-50%, -50%) scale(0);\n}\n\n.catalog-modal {\n position: absolute;\n top: 50%;\n left: 50%;\n width: 904px;\n height: 694px;\n background-color: var(--white);\n border-radius: 8px;\n display: flex;\n flex-direction: row;\n gap: 40px;\n padding: 40px;\n overflow-y: auto;\n\n transform: translate(-50%, -50%) scale(1);\n transition: transform 250ms cubic-bezier(0.4, 0, 0.2, 1);\n\n @media screen and (min-width: 768px) {\n width: 904px;\n height: 694px;\n top: 50%;\n left: 50%;\n }\n\n @media screen and (min-width: 1158px) {\n width: 904px;\n height: 694px;\n top: 50%;\n left: 50%;\n }\n}\n\n.catalog-close {\n position: absolute;\n top: 20px;\n right: 20px;\n padding: 0px;\n justify-content: center;\n display: flex;\n align-items: center;\n width: 24px;\n height: 24px;\n cursor: pointer;\n background-color: transparent;\n border: 1px solid transparent;\n\n transform: rotate(0deg);\n transition: transform 250ms cubic-bezier(0.4, 0, 0.2, 1),\n border-radius 250ms cubic-bezier(0.4, 0, 0.2, 1),\n border-color 250ms cubic-bezier(0.4, 0, 0.2, 1);\n}\n\n.catalog-close:hover,\n.catalog-close:focus {\n border-radius: 50%;\n transform: rotate(180deg);\n border-color: var(--darkgreen);\n}\n\n.is-hidden {\n visibility: none;\n opacity: 0;\n pointer-events: none;\n}\n\n.product-modal-image {\n margin-top: 0px;\n width: 276px;\n height: 375px;\n}\n\n.modal-catalog-captions {\n background-color: var(--white);\n margin-top: 0px;\n}\n\n.modal-item-title {\n margin-bottom: 0;\n padding: 0;\n white-space: nowrap;\n width: 276px;\n text-overflow: ellipsis;\n overflow: hidden;\n font-size: 14px;\n}\n\n.modal-item-price {\n font-size: 12px;\n}\n\n.form-modal-container {\n width: 100%;\n height: 100%;\n}\n\n/*modal-forms*/\n\n.form-field {\n display: flex;\n position: relative;\n flex-direction: column;\n}\n\n.form-input,\n.form-textarea {\n font-size: 16px;\n width: 100%;\n margin-bottom: 24px;\n margin-top: 12px;\n padding: 12px 16px;\n border-radius: 8px;\n border: 1px solid rgba(46, 47, 66, 0.4);\n\n transition: border-color 250ms cubic-bezier(0.4, 0, 0.2, 1);\n}\n\n.form-input:hover,\n.form-input:focus,\n.form-textarea:hover,\n.form-textarea:focus {\n border-color: var(--black);\n}\n\n.form-textarea {\n resize: none;\n padding-left: 16px;\n padding-right: 16px;\n padding-top: 12px;\n padding-bottom: 12px;\n font-size: 16px;\n height: 166px;\n}\n\n.button.button-submit {\n width: 100%;\n background-color: var(--dark-green);\n padding: 18px 0px;\n color: var(--white);\n border-radius: 8px;\n font-size: 12px;\n border: 1px solid transparent;\n\n transition: border-color 250ms cubic-bezier(0.4, 0, 0.2, 1),\n background-color 250ms cubic-bezier(0.4, 0, 0.2, 1);\n}\n\n.button.button-submit:hover,\n.button.button-submit:focus {\n border-color: var(--white);\n background-color: rgba(30, 40, 39, 0.8);\n}\n\n.privacy-policy {\n text-decoration: none;\n color: rgba(20, 20, 20, 0.4);\n font-size: 12px;\n transition: text-decoration 250ms cubic-bezier(0.4, 0, 0.2, 1);\n}\n\n.privacy-policy:hover,\n.privacy-policy:focus {\n text-decoration: underline;\n}\n\n.submit-note {\n color: rgba(20, 20, 20, 0.4);\n font-size: 12px;\n margin-top: 12px;\n}\n\n@media screen and (max-width: 1176px) {\n .catalog-section {\n padding: 64px 0;\n }\n\n .catalog {\n margin-bottom: 40px;\n }\n\n .catalog-modal{\n width: 744px;\n }\n}\n\n@media screen and (max-width: 767px) {\n .catalog-section {\n padding: 40px 0;\n }\n\n .catalog {\n justify-content: center;\n }\n\n .catalog-title {\n font-size: 32px;\n }\n\n .catalog-modal {\n display: flex;\n flex-wrap: wrap;\n width: 90%;\n height: 95vh;\n justify-content: center;\n gap: 10px;\n }\n\n .form-modal-container{\n height: unset;\n }\n\n .product-modal-image{\n width: 100%;\n height: fit-content;\n }\n\n .catalog-image{\n margin-top: 0;\n }\n\n .submit-note br{\n display: none;\n }\n}\n",":root {\n --white: #ffffff;\n --black: #141414;\n --dark-green: #1E2827;\n --light-green: #C6CDD1;\n --gray: rgba(20, 20, 20, 0.50);\n --light-gray: rgba(20, 20, 20, 0.40);\n --border: rgba(255, 255, 255, 0.10);\n}\n\n.gallery-section{\n padding: 80px 0;\n}\n\n.top-text{\n color: var(--light-gray);\n font-family: 'Epilogue';\n font-size: 12px;\n font-style: normal;\n font-weight: 300;\n line-height: 14px;\n letter-spacing: 0.72px;\n margin-bottom: 8px;\n}\n\n.gallery-title{\n color: var(--dark-green);\n font-family: 'Epilogue';\n font-size: 40px;\n font-style: normal;\n font-weight: 600;\n line-height: 44px;\n letter-spacing: -0.8px;\n}\n\n.gallery-item{\n margin-top: 80px;\n}\n\n\n.gallery-item-list{\n display: flex;\n justify-content: space-between;\n gap: 24px;\n}\n\n\n@media screen and (max-width: 1176px) {\n .gallery-section {\n padding: 64px 0;\n }\n\n .catalog {\n margin-bottom: 40px;\n }\n\n .gallery-item{\n margin-top: 40px;\n }\n\n}\n\n@media screen and (max-width: 767px) {\n .gallery-section{\n padding: 40px 0;\n }\n\n .gallery-title{\n font-size: 32px;\n }\n\n .gallery-title br {\n display: none;\n }\n\n .gallery-item-list{\n display: flex;\n flex-direction: column;\n gap: 20px;\n }\n\n}",".sale-section {\n width: 100%;\n padding: 0 0 80px 0;\n}\n\n.sale-column{\n display: flex;\n padding: 0 98px;\n gap: 40px;\n}\n\n.sale-description {\n color: rgba(20, 20, 20, 0.5);\n font-family: 'Epilogue';\n font-size: 14px;\n font-style: normal;\n font-weight: 400;\n line-height: 18px;\n letter-spacing: -0.14px;\n margin-top: 9px;\n margin: 0 auto;\n}\n\n.sale-description-details {\n color: rgba(20, 20, 20, 0.5);\n font-family: 'Epilogue';\n font-size: 14px;\n font-style: normal;\n font-weight: 400;\n line-height: 18px;\n letter-spacing: -0.14px;\n margin-top: 9px;\n margin: 0 auto;\n}\n\n.sale-watch:hover {\n cursor: pointer;\n}\n\n.watch-items{\n margin: 0;\n width: 146px;\n height: 146px;\n}\n\n\n.sale-info-container{\n width: 50%;\n}\n\n.sale-heading {\n color: var(--black);\n font-family: 'Epilogue';\n font-size: 32px;\n font-style: normal;\n font-weight: 600;\n line-height: 40px;\n letter-spacing: -0.64px;\n margin-bottom: 40px;\n}\n\n.sale-heading {\n color: var(--black);\n font-family: Epilogue;\n font-size: 32px;\n font-style: normal;\n font-weight: 600;\n line-height: 40px;\n letter-spacing: -0.64px;\n margin-bottom: 40px;\n}\n\n.wrapper {\n display: flex;\n gap: 20px;\n}\n\n.preview-wrapper {\n width: 406px;\n height: 614px;\n margin: 0;\n display: flex;\n align-items: center;\n justify-content: center;\n background-color: var(--black);\n}\n\n\n.sale-watch-container{\n display: flex;\n flex-direction: column;\n gap: 10px;\n}\n\n.sale-watch-preview {\n padding: 0;\n margin: 0;\n width: 100%;\n background-color: #141414;\n}\n\n\n.sale-details-heading {\n color: var(--black);\n font-family: 'Epilogue';\n font-size: 38px;\n font-style: normal;\n font-weight: 400;\n line-height: 40px;\n letter-spacing: -0.48px;\n margin-bottom: 0px;\n}\n\n.sale-product-tag {\n color: rgba(20, 20, 20, 0.5);\n font-family: 'Epilogue';\n font-size: 14px;\n font-style: normal;\n font-weight: 400;\n line-height: 18px;\n letter-spacing: -0.28px;\n margin-top: 8px;\n}\n\n.current-price-on-sale {\n color: var(--black);\n font-family: 'Epilogue';\n font-size: 18px;\n font-style: normal;\n font-weight: 400;\n line-height: 24px;\n letter-spacing: -0.36px;\n margin: 0 auto;\n}\n\n.actual-price {\n color: rgba(20, 20, 20, 0.5);\n font-family: 'Epilogue';\n font-size: 12px;\n font-style: normal;\n font-weight: 400;\n line-height: 14px; /* 116.667% */\n letter-spacing: -0.24px;\n text-decoration-line: line-through;\n margin-left: 8px;\n}\n\n.sale-details-title {\n color: var(--black);\n font-family: 'Epilogue';\n font-size: 18px;\n font-style: normal;\n font-weight: 400;\n line-height: 24px;\n letter-spacing: -0.36px;\n text-transform: uppercase;\n padding-top: 8px;\n padding-bottom: 8px;\n margin: 0 auto;\n border-top: 1px solid var(--black);\n display: flex;\n align-items: center;\n position: relative;\n}\n\n.sale-details-title:after {\n content:'';\n width: 16px;\n height: 2px;\n background-color: var(--black);\n position: absolute;\n right: 0;\n}\n\n.sale-details{\n margin-bottom: 40px;\n}\n\n.sale-details-2{\n margin-bottom: 20px;\n}\n\n\n\n@media screen and (max-width: 1176px){\n .sale-section {\n padding: 64px 0;\n }\n\n .sale-column{\n display: flex;\n flex-direction: column;\n }\n\n .sale-info-container{\n width: 100%;\n }\n\n .sale-column {\n padding: 0 66px;\n }\n}\n\n@media screen and (max-width: 767px) {\n .container {\n width: 100%;\n }\n\n .sale-section {\n padding: 40px 0;\n }\n\n .sale-column {\n padding: 0;\n }\n\n .sale-details-heading{\n font-size: 24px;\n }\n}\n\n @media screen and (max-width:430px){\n .wrapper{\n justify-content: space-between;\n }\n\n .watch-items {\n margin: 0;\n width: 80px;\n height: 80px;\n }\n\n .preview-wrapper{\n width: 235px;\n height: 350px;\n } \n}\n",":root {\n --white: #ffffff;\n --black: #141414;\n --dark-green: #1E2827;\n --light-green: #C6CDD1;\n --gray: rgba(20, 20, 20, 0.50);\n --light-gray: rgba(20, 20, 20, 0.40);\n --border: rgba(255, 255, 255, 0.10);\n}\n\n.footer{\n padding: 104px 0 32px;\n background: var(--dark-green);\n}\n\n.footer-container{\n display: flex;\n justify-content: space-between;\n}\n\n.lower-container{\n display: flex;\n justify-content: space-between;\n margin-top: 100px;\n}\n\n.footer-navigation{\n display: flex;\n flex-direction: column;\n gap: 40px;\n}\n\n.footer-logo-container{\n margin-bottom: 40px;\n}\n\n.footer-address-list{\n display: flex;\n flex-direction: column;\n gap: 20px;\n}\n\n.footer-navigation-list{\n display: flex;\n flex-direction: column;\n gap: 18px;\n}\n\n.footer-navigation-link{\n color: var(--white);\n font-family: 'Epilogue';\n font-size: 18px;\n font-style: normal;\n font-weight: 400;\n line-height: 24px;\n text-transform: uppercase;\n}\n\n.footer-social-list{\n display: flex;\n gap: 16px;\n justify-content: flex-start;\n}\n\n.footer-social-item{\n border-radius: 10px;\n border: 1px solid var(--border);\n width: 40px;\n height: 40px;\n display: flex;\n justify-content: center;\n align-items: center;\n\n transition: background-color 250ms ease-in-out;\n}\n\n.footer-social-item:hover{\n background-color: var(--light-green);\n}\n\n.footer-social-icon{\n fill: var(--white);\n display: flex;\n}\n\n.footer-social-icon:hover {\n fill: var(--dark-green);\n}\n\n.lower-text{\n color: var(--light-green);\n font-family: 'Epilogue';\n font-size: 14px;\n font-style: normal;\n font-weight: 400;\n line-height: 18px;\n letter-spacing: -0.28px;\n}\n\n.lower-footer-link{\n color: var(--light-green);\n text-align: right;\n font-family: 'Epilogue';\n font-size: 14px;\n font-style: normal;\n font-weight: 400;\n line-height: 18px;\n letter-spacing: -0.28px;\n}\n\n.footer-container-5{\n display: flex;\n gap: 18px;\n}\n\n.lowest-container{\n margin-top: 20px;\n border-top: 1px solid var(--light-green);\n}\n\n.webmaster{\n color: var(--light-green);\n text-align: center;\n font-family: 'Epilogue';\n font-size: 14px;\n font-style: normal;\n font-weight: 400;\n line-height: 18px;\n letter-spacing: -0.28px;\n padding-top: 20px;\n\n @media screen and (max-width: 767px){\n font-size: 12px;\n }\n}\n\n@media screen and (max-width: 767px) {\n .footer {\n padding: 40px 0;\n }\n\n .footer-container{\n display: flex;\n flex-wrap: wrap;\n row-gap: 40px;\n }\n\n .lower-container{\n display: flex;\n flex-direction: column;\n gap: 14px;\n }\n\n .footer-container-1{\n width: 80%;\n }\n\n .footer-container-2{\n width: 20%;\n justify-content: flex-end;\n }\n\n .footer-navigation-link{\n font-size: 14px;\n }\n\n .lower-text, .lower-footer-link{\n font-size: 12px;\n }\n}"],"names":[],"version":3,"file":"index.c8ddc185.css.map"} \ No newline at end of file diff --git a/index.d6a6649a.css b/index.d6a6649a.css new file mode 100644 index 0000000..3985a5a --- /dev/null +++ b/index.d6a6649a.css @@ -0,0 +1,2 @@ +*,:before,:after{box-sizing:border-box}html{tab-size:4;-webkit-text-size-adjust:100%;line-height:1.15}body{margin:0;font-family:system-ui,AppleSystem,BlinkMacSystemFont,Segoe UI,Roboto,Noto Sans,Ubuntu,Cantarell,Helvetica Neue,AppleSystem,BlinkMacSystemFont,Segoe UI,Roboto,Noto Sans,Ubuntu,Cantarell,Helvetica Neue,AppleSystem,BlinkMacSystemFont,Segoe UI,Roboto,Noto Sans,Ubuntu,Cantarell,Helvetica Neue,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif,Apple Color Emoji,Segoe UI Emoji}hr{height:0;color:inherit}abbr[title]{-webkit-text-decoration:underline dotted;text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:ui-monospace,SFMono-Regular,Consolas,Liberation Mono,Menlo,monospace;font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit}button,input,optgroup,select,textarea{margin:0;font-family:inherit;font-size:100%;line-height:1.15}button,select{text-transform:none}button,[type=button],[type=reset],[type=submit]{-webkit-appearance:button}::-moz-focus-inner{border-style:none;padding:0}:-moz-focusring{outline:1px dotted ButtonText}:-moz-ui-invalid{box-shadow:none}legend{padding:0}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}h1,h2,h3,h4,h5,h6,p{margin:0}ul{margin:0;padding:0}img{max-width:100%;height:auto;display:block}html{box-sizing:border-box}*,:before,:after{box-sizing:inherit}a{text-decoration:none}.list{margin:0;padding:0;list-style-type:none}body{letter-spacing:-.28px;margin:0;font-family:Epilogue,sans-serif;font-size:14px;font-style:normal;font-weight:300;line-height:18px}.section{width:100%;margin:auto}.container{width:1280px;margin:0 auto;padding:0 20px}@media screen and (max-width:1176px){.container{width:768px;padding:0 32px}}@media screen and (max-width:767px){.container{width:100%}}:root{--white:#fff;--black:#141414;--dark-green:#1e2827;--light-green:#c6cdd1;--gray:rgba(20,20,20,.5);--light-gray:rgba(20,20,20,.4);--border:rgba(255,255,255,.1)}.header{background:var(--black);padding:36px 0}.header-container{justify-content:space-between;align-items:center;display:flex}.header-logo{width:123px;height:19px}.header-navigation{align-items:center;column-gap:80px;display:flex}.header-navigation-list{align-items:center;gap:40px;display:flex}.header-navigation-list li{align-items:center;display:flex}.header-navigation-link{color:rgba(254,254,254,.6);text-transform:uppercase;font-family:Epilogue;font-size:9px;font-style:normal;font-weight:400;line-height:12px;transition:color .25s cubic-bezier(.4,0,.2,1)}.header-navigation-link:hover{color:#fefefe}.header-button{color:rgba(254,254,254,.6);text-align:center;background-color:var(--dark-green);cursor:pointer;border:none;border-radius:8px;padding:18px 36px;font-family:Epilogue;font-size:9px;font-style:normal;font-weight:400;line-height:12px;transition:color .25s cubic-bezier(.4,0,.2,1)}.header-button:hover{color:#fefefe}.hamburger-container{display:none}@media screen and (max-width:1176px){.header{padding:20px 0}}@media screen and (max-width:767px){.container{width:100%}.header{padding:36px 0}.header-navigation-list,.header-button{display:none}.hamburger-container{justify-content:flex-end;display:flex}}.hamburger{width:100%;height:100%;background:var(--dark-green);z-index:999;padding:36px 20px;transition-property:transform,opacity;transition-duration:.25s,.25s;transition-timing-function:cubic-bezier(.4,0,.2,1),cubic-bezier(.4,0,.2,1);position:fixed;top:0;right:0;transform:translate(0)}.hamburger.is-hidden{transform:translate(100%)}.hamburger-close-icon{fill:var(--white)}.menu-burger-container{align-content:center;justify-content:space-between;display:flex}.hamburger-close{color:var(--white)}.hamburger-menu-list{flex-direction:column;justify-content:center;align-items:center;display:flex;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%)}.hamburger_link{color:var(--white);padding:7px 0;display:block}:root{--white:#fff;--black:#141414;--dark-green:#1e2827;--light-green:#c6cdd1;--gray:rgba(20,20,20,.5);--light-gray:rgba(20,20,20,.4);--border:rgba(255,255,255,.1)}.hero-section{background-color:var(--black);width:100%;padding:80px 0}.hero-title{color:var(--white);letter-spacing:-1.52px;width:unset;margin-bottom:20px;font-family:Epilogue;font-size:38px;font-style:normal;font-weight:600;line-height:40px}@media screen and (min-width:768px){.hero-title{color:var(--white);letter-spacing:-2.4px;font-family:Epilogue;font-size:60px;font-style:normal;font-weight:600;line-height:62px}}@media screen and (min-width:1280px){.hero-title{letter-spacing:-2.4px;width:750px;order:unset;margin-top:0;margin-bottom:0;font-size:60px;font-weight:600;line-height:62px}}.hero-col-1{justify-content:space-between;margin-bottom:43px;display:flex}.hero-col-2{justify-content:space-between;display:flex}.hp-slider-img{width:266px}@media screen and (min-width:768px){.hp-slider-img{width:436px}}@media screen and (min-width:1280px){.hp-slider-img{order:3;align-self:flex-end}}.banner-slider{flex-direction:column;row-gap:20px;display:flex}swiper-container{z-index:0}swiper-slide{height:200px;justify-content:center;align-items:center;display:flex}@media screen and (min-width:768px){swiper-slide{height:255px;background-color:#1e2827;justify-content:center;align-items:center;display:flex}}.slide-control{width:100%;height:32px;justify-content:space-between;align-items:flex-end;display:flex}.button-list{gap:12px;display:inline-flex}.counter-list{color:#fff;gap:6px;display:inline-flex}.slider-range{width:40px;height:100%;position:relative}.slider-range:before{content:"";width:100%;height:1px;background-color:currentColor;position:absolute;top:7px}.control_prev:hover,.control_next:hover,.control_prev:focus,.control_next:focus{color:#fefefe}.control_prev,.control_next{width:32px;height:32px;color:rgba(254,254,254,.6);cursor:pointer;background:rgba(255,255,255,0);border:1px solid;border-radius:8px;justify-content:center;align-items:center;padding:0;transition:color .25s cubic-bezier(.4,0,.2,1);display:flex}@media screen and (min-width:768px){.control_prev,.control_next{width:40px;height:40px}}.chevronleft,.chevronright{stroke:currentColor;justify-content:center;align-items:center;display:flex;transform:translate(-4px)}.slider_option{width:160px;margin:10px auto;font-size:18px;position:relative}.herotext-box{width:282px;margin-left:auto}@media screen and (min-width:768px){.herotext-box{width:248px;margin-top:-40px}}@media screen and (min-width:1280px){.herotext-box{order:2;margin-top:0}}.herotext{color:var(--white);letter-spacing:-.28px;width:282px;font-family:Epilogue;font-size:14px;font-style:normal;font-weight:300;line-height:18px}.hero-text{color:var(--white);font-weight:300;display:inline-flex}.hero-text-tablet{display:none}.hero-watch-div{order:4}.hero-wristwatch{width:auto}.hero-text-hidden{display:none}@media screen and (max-width:1176px){.hero-col-1{flex-wrap:wrap;display:flex}.hero-title{width:100%}.herotext{width:248px;position:absolute;top:464px;right:32px}.hero-watch-div{width:100%;order:unset;margin-top:40px}.hero-col-2{display:block}.hero-wristwatch{width:100%}}@media screen and (max-width:767px){.container{width:100%}.hero-section{padding:40px 0}.hero-title{font-size:38px}.herotext{display:none}.hero-text-hidden{justify-content:flex-end;margin-top:40px;padding-left:70px;display:flex}.herotext-mobile{color:var(--white);letter-spacing:-.28px;font-family:Epilogue;font-size:14px;font-style:normal;font-weight:300;line-height:18px}}:root{--white:#fff;--black:#141414;--dark-green:#1e2827;--light-green:#c6cdd1;--gray:rgba(20,20,20,.5);--light-gray:rgba(20,20,20,.4);--border:rgba(255,255,255,.1)}.about-section{padding:80px 0}.about-col-1{justify-content:space-between;display:flex}.about-title{color:var(--dark-green);letter-spacing:-.8px;font-family:Epilogue;font-size:40px;font-style:normal;font-weight:600;line-height:44px}.about-description:first-child{color:var(--black);letter-spacing:-.28px;width:470px;font-family:Epilogue;font-size:14px;font-style:normal;font-weight:300;line-height:18px}.about-description{color:var(--black);letter-spacing:-.28px;width:380px;font-family:Epilogue;font-size:14px;font-style:normal;font-weight:300;line-height:18px}.about-inner-col2{justify-content:flex-end;gap:40px;display:flex}.about-col-2{width:100%;height:500px;justify-content:flex-end;margin-top:40px;display:flex}@media screen and (max-width:1176px){.about-section{padding:64px 0}.about-description:first-child{width:220px}.about-description{width:250px}.about-inner-col2{gap:20px}}@media screen and (max-width:767px){.about-section{padding:40px 0}.about-col-1{display:block}.about-inner-col2{flex-direction:column;gap:20px;margin-top:40px}.about-description:first-child,.about-description{width:100%}.about-title{font-size:32px}.about-col-2{height:365px}}:root{--white:#fff;--black:#141414;--dark-green:#1e2827;--light-green:#c6cdd1;--gray:rgba(20,20,20,.5);--light-gray:rgba(20,20,20,.4);--border:rgba(255,255,255,.1)}.catalog-image-container{width:276px;height:325px;margin-bottom:0}.catalog-title{color:var(--dark-green);letter-spacing:-.8px;font-family:Epilogue;font-size:40px;font-style:normal;font-weight:600;line-height:44px}.catalog{flex-wrap:wrap;justify-content:space-between;gap:24px;margin-top:64px;margin-bottom:80px;display:flex}.catalog-image{margin-top:26px;margin-bottom:25px}.catalog-item{flex-basis:calc(25% - 24px)}.catalog-captions{background-color:var(--white);margin-top:0}.catalog .item-title{color:var(--black);white-space:nowrap;width:276px;text-overflow:ellipsis;letter-spacing:-.28px;margin-bottom:4px;padding:0;font-family:Epilogue;font-size:14px;font-style:normal;font-weight:400;line-height:18px;overflow:hidden}.catalog .item-price{color:var(--gray);letter-spacing:-.24px;font-family:Epilogue;font-size:12px;font-weight:400;line-height:14px}.heart-item{stroke:var(--black);fill:var(--white);margin-left:230px;transition:fill .25s cubic-bezier(.4,0,.2,1)}.heart-item:hover,.heart-item:focus{fill:red}.button.buy{background-color:var(--dark-green);color:var(--white);font-size:12px;font-weight:400px;border-radius:8px;justify-content:flex-end;align-items:flex-start;margin-top:80px;margin-left:auto;padding:18px 35px;transition:border-color .25s cubic-bezier(.4,0,.2,1),background-color .25s cubic-bezier(.4,0,.2,1);display:flex}.button.buy:hover,.button.buy:focus{border-color:var(--white);background-color:rgba(30,40,39,.8)}.catalog-cover-wrap{width:276px;height:325px;position:relative;overflow:hidden}.catalog-cover-text{background-color:var(--dark-green);height:100%;width:100%;border-radius:8px;padding:20px;transition:transform .25s ease-in-out;position:absolute;top:0;transform:translateY(100%)}.catalog-cover-text-title{color:var(--white);letter-spacing:-.28px;margin-top:20px;margin-bottom:10px;font-family:Epilogue;font-size:14px;font-weight:400;line-height:18px}.catalog-cover-text-body{color:rgba(255,255,255,.5);letter-spacing:-.14px;margin-bottom:20px;font-family:Epilogue;font-size:14px;font-weight:400;line-height:18px}.catalog-item:hover .catalog-cover-text{transform:translateY(0)}.backdrop{width:100%;height:100%;opacity:1;background-color:rgba(0,0,0,.2);transition:opacity .25s cubic-bezier(.4,0,.2,1);position:fixed;top:0;left:0}.backdrop.is-hidden .modal{transform:translate(-50%,-50%)scale(0)}.catalog-modal{min-width:904px;min-height:694px;background-color:var(--white);border-radius:8px;flex-direction:row;gap:40px;padding:40px;transition:transform .25s cubic-bezier(.4,0,.2,1);display:flex;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)scale(1)}.catalog-close{width:24px;height:24px;cursor:pointer;background-color:#d3d3d3;border:1px solid rgba(0,0,0,0);justify-content:center;align-items:center;padding:0;transition:transform .25s cubic-bezier(.4,0,.2,1),border-radius .25s cubic-bezier(.4,0,.2,1),border-color .25s cubic-bezier(.4,0,.2,1);display:flex;position:absolute;top:20px;right:20px;transform:rotate(0deg)}.catalog-close:hover,.catalog-close:focus{border-color:var(--darkgreen);border-radius:50%;transform:rotate(180deg)}.is-hidden{visibility:none;opacity:0;pointer-events:none}.product-modal-image{width:276px;height:375px;margin-top:0}.modal-catalog-captions{background-color:var(--white);margin-top:0}.modal-item-title{white-space:nowrap;width:276px;text-overflow:ellipsis;margin-bottom:0;padding:0;font-size:14px;overflow:hidden}.modal-item-price{font-size:12px}.form-modal-container{width:100%;height:100px}.form-field{position:rel ative;flex-direction:column;display:flex}.form-input,.form-textarea{width:100%;border:1px solid rgba(46,47,66,.4);border-radius:8px;margin-top:12px;margin-bottom:24px;padding:12px 16px;font-size:16px;transition:border-color .25s cubic-bezier(.4,0,.2,1)}.form-input:hover,.form-input:focus,.form-textarea:hover,.form-textarea:focus{border-color:var(--black)}.form-textarea{resize:none;height:166px;padding:12px 16px;font-size:16px}.button.button-submit{width:100%;background-color:var(--darkgreen);color:var(--white);border:1px solid rgba(0,0,0,0);border-radius:8px;padding:18px 0;font-size:12px;transition:border-color .25s cubic-bezier(.4,0,.2,1),border .25s cubic-bezier(.4,0,.2,1),background-color .25s cubic-bezier(.4,0,.2,1)}.button.button-submit:hover,.button.button-submit:focus{border-color:var(--white);border:1px solid var(--metallicgrey);background-color:rgba(30,40,39,.8)}.privacy-policy{color:rgba(20,20,20,.4);font-size:12px;text-decoration:none;transition:-webkit-text-decoration .25s cubic-bezier(.4,0,.2,1),-webkit-text-decoration .25s cubic-bezier(.4,0,.2,1),text-decoration .25s cubic-bezier(.4,0,.2,1)}.privacy-policy:hover,.privacy-policy:focus{text-decoration:underline}.submit-note{color:rgba(20,20,20,.4);margin-top:12px;font-size:12px}@media screen and (max-width:1176px){.catalog-section{padding:64px 0}.catalog{margin-bottom:40px}}@media screen and (max-width:767px){.catalog-section{padding:40px 0}.catalog{justify-content:center}.catalog-title{font-size:32px}}:root{--white:#fff;--black:#141414;--dark-green:#1e2827;--light-green:#c6cdd1;--gray:rgba(20,20,20,.5);--light-gray:rgba(20,20,20,.4);--border:rgba(255,255,255,.1)}.gallery-section{padding:80px 0}.top-text{color:var(--light-gray);letter-spacing:.72px;margin-bottom:8px;font-family:Epilogue;font-size:12px;font-style:normal;font-weight:300;line-height:14px}.gallery-title{color:var(--dark-green);letter-spacing:-.8px;font-family:Epilogue;font-size:40px;font-style:normal;font-weight:600;line-height:44px}.gallery-item{margin-top:80px}.gallery-item-list{justify-content:space-between;gap:24px;display:flex}@media screen and (max-width:1176px){.gallery-section{padding:64px 0}.catalog{margin-bottom:40px}.gallery-item{margin-top:40px}}@media screen and (max-width:767px){.gallery-section{padding:40px 0}.gallery-title{font-size:32px}.gallery-title br{display:none}.gallery-item-list{flex-direction:column;gap:20px;display:flex}}.sale-section{width:100%;padding:0 0 80px}.sale-description,.sale-description-details{color:rgba(20,20,20,.5);letter-spacing:-.14px;margin:0 auto;font-family:Epilogue;font-size:14px;font-style:normal;font-weight:400;line-height:18px}.sale-watch:hover{cursor:pointer}.watch-items{line-height:0;list-style:none}.watch-items:not(:last-child){margin-bottom:10px}.sale-heading{color:var(--black,#141414);letter-spacing:-.64px;margin-bottom:40px;font-family:Epilogue;font-size:32px;font-style:normal;font-weight:600;line-height:40px}@media screen and (min-width:768px){.sale-heading{color:var(--dark-green,#1e2827);letter-spacing:-.8px;font-size:40px;line-height:44px}}.sale-heading{color:var(--black,#141414);letter-spacing:-.64px;margin-bottom:40px;font-family:Epilogue;font-size:32px;font-style:normal;font-weight:600;line-height:40px}@media screen and (min-width:768px){.sale-heading{color:var(--dark-green);letter-spacing:-.8px;font-size:40px;line-height:44px}}@media screen and (min-width:768px){.item-wrapper{width:768px;margin-left:66px;margin-right:0}}@media screen and (min-width:1158px){.item-wrapper{width:1081px;height:614px;gap:40px;margin-left:97px;margin-right:0;padding-bottom:0;display:flex}}.wrapper{display:flex}@media screen and (min-width:768px){.sale-watch{width:146px;height:146px}}.preview-wrapper{width:235px;height:350px;background-color:#141414;justify-content:center;align-items:center;margin-bottom:0;margin-left:20px;padding-bottom:0;display:flex}#imagecontainer{max-width:100%;max-height:100%;overflow:hidden}#imagecontainer img{max-width:100%;max-height:100%;margin:auto}@media screen and (min-width:768px){.preview-wrapper{width:406px;height:614px;background-color:#141414;justify-content:center;align-items:center;margin-bottom:0;margin-left:20px;padding-bottom:0;display:flex}#imagecontainer{max-width:100%;max-height:100%;overflow:hidden}#imagecontainer img{max-width:100%;max-height:100%;margin:auto}}.sale-watch-preview{width:235px;height:351px;background-color:#141414;margin-bottom:-2px;margin-left:20px;padding:0;display:none}@media screen and (min-width:768px){.sale-watch-preview{width:100%;height:auto}}.sale-info-container{width:335px;margin:0;padding:0}@media screen and (min-width:768px){.sale-info-container{width:572px;margin:0;padding:0}}@media screen and (min-width:1158px){.sale-info-container{width:369px}}.sale-details-heading{color:var(--black,#141414);letter-spacing:-.48px;margin-bottom:0;font-family:Epilogue;font-size:24px;font-style:normal;font-weight:400;line-height:24px}@media screen and (min-width:768px){.sale-details-heading{letter-spacing:-.76px;margin-bottom:0;font-size:38px;line-height:40px}}@media screen and (min-width:1158px){.sale-details-heading{margin-top:0}}.margin-container{width:335px;margin-top:40px;padding:0}@media screen and (min-width:768px){.margin-container{width:574px}}@media screen and (min-width:1158px){.margin-container{width:1081px;width:369px;margin-top:0;margin-bottom:40px}}.sale-product-tag{color:rgba(20,20,20,.5);letter-spacing:-.28px;margin-top:8px;font-family:Epilogue;font-size:14px;font-style:normal;font-weight:400;line-height:18px}.current-price-on-sale{color:var(--black,#141414);letter-spacing:-.36px;margin:0 auto;font-family:Epilogue;font-size:18px;font-style:normal;font-weight:400;line-height:24px}.actual-price{color:rgba(20,20,20,.5);letter-spacing:-.24px;margin-left:8px;font-family:Epilogue;font-size:12px;font-style:normal;font-weight:400;line-height:14px;-webkit-text-decoration-line:line-through;text-decoration-line:line-through}.sale-details-title{color:var(--black,#141414);letter-spacing:-.36px;text-transform:uppercase;border-top:1px solid var(--black,#141414);align-items:center;margin:0 auto;padding-top:8px;padding-bottom:8px;font-family:Epilogue;font-size:18px;font-style:normal;font-weight:400;line-height:24px;display:flex;position:relative}@media screen and (min-width:768px){.sale-details-title{width:572px}}@media screen and (min-width:1158px){.sale-details-title{width:369px}}.sale-details-title:after{content:"";width:16px;height:2px;background-color:#141414;position:absolute;left:319px}@media screen and (min-width:768px){.sale-details-title:after{left:556px}}@media screen and (min-width:768px) and (min-width:1158px){.sale-details-title:after{left:353px}}@media screen and (max-width:767px){.container{width:100%}.hero-section{padding:40px 0}}.activeimage{display:block}:root{--white:#fff;--black:#141414;--dark-green:#1e2827;--light-green:#c6cdd1;--gray:rgba(20,20,20,.5);--light-gray:rgba(20,20,20,.4);--border:rgba(255,255,255,.1)}.footer{background:var(--dark-green);padding:104px 0 32px}.footer-container{justify-content:space-between;display:flex}.lower-container{justify-content:space-between;margin-top:174px;display:flex}.footer-navigation{flex-direction:column;gap:40px;display:flex}.footer-logo-container{margin-bottom:40px}.footer-address-list{flex-direction:column;gap:20px;display:flex}.footer-navigation-list{flex-direction:column;gap:18px;display:flex}.footer-navigation-link{color:var(--white);text-transform:uppercase;font-family:Epilogue;font-size:18px;font-style:normal;font-weight:400;line-height:24px}.footer-social-list{justify-content:flex-start;gap:16px;display:flex}.footer-social-item{width:40px;height:40px;border:1px solid rgba(254,254,254,.6);border-radius:10px;justify-content:center;align-items:center;display:flex}.footer-social-item:hover,.footer-social-item:focus{border:#fff}.footer-social-link{cursor:pointer;color:rgba(254,254,254,.6);border-color:var(--border);justify-content:center;transition:color .25s cubic-bezier(.4,0,.2,1),border-color .25s cubic-bezier(.4,0,.2,1);display:flex}.footer-social-link:hover,.footer-social-link:focus{color:var(--white);border-color:#fff}.footer-social-icon{fill:var(--white)}.lower-text{color:var(--light-green);letter-spacing:-.28px;font-family:Epilogue;font-size:14px;font-style:normal;font-weight:400;line-height:18px}.lower-footer-link{color:var(--light-green);text-align:right;letter-spacing:-.28px;font-family:Epilogue;font-size:14px;font-style:normal;font-weight:400;line-height:18px}.footer-container-5{gap:18px;display:flex}@media screen and (max-width:767px){.footer{padding:40px 0}.footer-container{flex-wrap:wrap;row-gap:40px;display:flex}.lower-container{flex-direction:column;gap:14px;display:flex}.footer-container-1{width:80%}.footer-container-2{width:20%;justify-content:flex-end}.footer-navigation-link{font-size:14px}.lower-text,.lower-footer-link{font-size:12px}} +/*# sourceMappingURL=index.d6a6649a.css.map */ diff --git a/index.d6a6649a.css.map b/index.d6a6649a.css.map new file mode 100644 index 0000000..cb3cb33 --- /dev/null +++ b/index.d6a6649a.css.map @@ -0,0 +1 @@ +{"mappings":"ACWA,uCAUA,+DAwBA,yYA+BA,0BAcA,sFAQA,4BAUA,iHAkBA,oBAQA,8EAQA,kBAIA,cAcA,yCAeA,mGAgBA,kCASA,0EAWA,+CASA,8CASA,iCAQA,iBAQA,iCAQA,oEAUA,+DASA,oDASA,oEAcA,0BEtSA,6BAUA,sBAKA,6CAMA,2BAIA,oCAMA,uBAKA,8CAMA,sIAUA,gCAKA,qDAOA,qCACI,uCAMJ,oCACI,uBCzEJ,oKAUA,+CAKA,gFAMA,qCAKA,mEAMA,iEAMA,2DAMA,gNAWA,4CAMA,kSAiBA,mCAIA,kCAKA,qCACI,wBAKJ,oCACI,sBAIA,uBAIA,oDAIA,4DAOJ,gSAiBA,+CAIA,wCAIA,uFAMA,oCAKA,iKAWA,+DChKA,oKAUA,sEAOA,4KAYI,oCAZJ,6IAsBI,qCAtBJ,wIAkCA,0EAMA,uDAOA,2BAGI,oCAHJ,4BAOI,qCAPJ,4CAaA,+DAMA,2BAIA,iFAMI,oCANJ,2GAeA,sGASA,0CAKA,qDAOA,uDAMA,8GASA,8FAMA,8QAcI,oCAdJ,oDAqBA,gIAUA,6EASA,2CAII,oCAJJ,4CAUI,qCAVJ,oCAiBA,sJAWA,kEAUA,+BAIA,wBAKA,4BAII,+BAKJ,qCACI,wCAKA,uBAIA,6DAOA,uDAMA,0BAIA,6BAKJ,oCACI,sBAIA,6BAIA,2BAIA,uBAIA,0FAOA,kJCxSJ,oKAUA,8BAIA,wDAKA,iJAUA,2KAWA,+JAWA,iEAMA,2FASA,qCACI,8BAIA,2CAGA,+BAIA,4BAKJ,oCACI,8BAIA,2BAIA,iEAMA,6DAIA,4BAIA,2BC1GJ,oKAYA,kEAMA,mJAUA,+GASA,kDAKA,0CAIA,6DAKA,uPAiBA,kIASA,iHAQA,6CAKA,wUAiBA,iGAOA,+EAMA,sMAYA,2KAWA,kKAWA,gEAKA,uJAWA,kEAIA,kRAiBA,kXAoBA,mHAOA,yDAMA,2DAMA,mEAKA,iIAUA,iCAIA,8CAOA,kEAMA,oNAaA,wGAOA,yEAUA,4SAcA,0JAOA,8OAOA,sEAKA,oEAMA,qCACE,gCAIA,6BAKF,oCACE,gCAIA,gCAIA,+BC9VF,oKAUA,gCAIA,gKAWA,mJAUA,8BAKA,uEAOA,qCACI,gCAIA,4BAIA,+BAMJ,oCACI,gCAIA,8BAIA,+BAIA,gEC3EJ,0CAKA,+LAwBA,iCAIA,2CAKA,iDAIA,yKAUE,oCAVF,oGAkBA,yKAUE,oCAVF,4FAmBE,oCADF,2DAOE,qCAPF,gHAmBA,sBAIA,oCACE,sCAMF,4KAaA,+DAMA,+DAOA,oCACE,4KAcA,+DAMA,gEAUF,iIAUE,oCAVF,4CAkBA,oDAKE,oCALF,qDAWE,qCAXF,kCAgBA,8KAWE,oCAXF,6FAkBE,qCAlBF,oCAuBA,wDAKE,oCALF,+BASE,qCATF,4EAiBA,sKAWA,6KAWA,+OAYA,kUAiBE,oCAjBF,iCAqBE,qCArBF,iCA0BA,iHASA,oCACE,sCAIA,2DACE,sCAMJ,oCACE,sBAIA,8BAKF,2BC1UA,oKAUA,0DAKA,6DAKA,6EAMA,+DAMA,0CAIA,iEAMA,oEAMA,2JAUA,qEAMA,2JAUA,gEAKA,qNASA,yFAMA,sCAIA,kJAUA,0KAWA,0CAMA,oCACI,uBAIA,2DAMA,6DAMA,8BAIA,uDAKA,uCAIA","sources":["index.d6a6649a.css","node_modules/modern-normalize/modern-normalize.css","src/sass/index.scss","src/sass/_common.scss","src/sass/_header.scss","src/sass/_herostyles.scss","src/sass/_about.scss","src/sass/_catalog.scss","src/sass/_gallery.scss","src/sass/_sale.scss","src/sass/_footer.scss"],"sourcesContent":["*, :before, :after {\n box-sizing: border-box;\n}\n\nhtml {\n tab-size: 4;\n -webkit-text-size-adjust: 100%;\n line-height: 1.15;\n}\n\nbody {\n margin: 0;\n font-family: system-ui, AppleSystem, BlinkMacSystemFont, Segoe UI, Roboto, Noto Sans, Ubuntu, Cantarell, Helvetica Neue, AppleSystem, BlinkMacSystemFont, Segoe UI, Roboto, Noto Sans, Ubuntu, Cantarell, Helvetica Neue, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji;\n}\n\nhr {\n height: 0;\n color: inherit;\n}\n\nabbr[title] {\n -webkit-text-decoration: underline dotted;\n text-decoration: underline dotted;\n}\n\nb, strong {\n font-weight: bolder;\n}\n\ncode, kbd, samp, pre {\n font-family: ui-monospace, SFMono-Regular, Consolas, Liberation Mono, Menlo, monospace;\n font-size: 1em;\n}\n\nsmall {\n font-size: 80%;\n}\n\nsub, sup {\n vertical-align: baseline;\n font-size: 75%;\n line-height: 0;\n position: relative;\n}\n\nsub {\n bottom: -.25em;\n}\n\nsup {\n top: -.5em;\n}\n\ntable {\n text-indent: 0;\n border-color: inherit;\n}\n\nbutton, input, optgroup, select, textarea {\n margin: 0;\n font-family: inherit;\n font-size: 100%;\n line-height: 1.15;\n}\n\nbutton, select {\n text-transform: none;\n}\n\nbutton, [type=\"button\"], [type=\"reset\"], [type=\"submit\"] {\n -webkit-appearance: button;\n}\n\n::-moz-focus-inner {\n border-style: none;\n padding: 0;\n}\n\n:-moz-focusring {\n outline: 1px dotted ButtonText;\n}\n\n:-moz-ui-invalid {\n box-shadow: none;\n}\n\nlegend {\n padding: 0;\n}\n\nprogress {\n vertical-align: baseline;\n}\n\n::-webkit-inner-spin-button, ::-webkit-outer-spin-button {\n height: auto;\n}\n\n[type=\"search\"] {\n -webkit-appearance: textfield;\n outline-offset: -2px;\n}\n\n::-webkit-search-decoration {\n -webkit-appearance: none;\n}\n\n::-webkit-file-upload-button {\n -webkit-appearance: button;\n font: inherit;\n}\n\nsummary {\n display: list-item;\n}\n\nh1, h2, h3, h4, h5, h6, p {\n margin: 0;\n}\n\nul {\n margin: 0;\n padding: 0;\n}\n\nimg {\n max-width: 100%;\n height: auto;\n display: block;\n}\n\nhtml {\n box-sizing: border-box;\n}\n\n*, :before, :after {\n box-sizing: inherit;\n}\n\na {\n text-decoration: none;\n}\n\n.list {\n margin: 0;\n padding: 0;\n list-style-type: none;\n}\n\nbody {\n letter-spacing: -.28px;\n margin: 0;\n font-family: Epilogue, sans-serif;\n font-size: 14px;\n font-style: normal;\n font-weight: 300;\n line-height: 18px;\n}\n\n.section {\n width: 100%;\n margin: auto;\n}\n\n.container {\n width: 1280px;\n margin: 0 auto;\n padding: 0 20px;\n}\n\n@media screen and (max-width: 1176px) {\n .container {\n width: 768px;\n padding: 0 32px;\n }\n}\n\n@media screen and (max-width: 767px) {\n .container {\n width: 100%;\n }\n}\n\n:root {\n --white: #fff;\n --black: #141414;\n --dark-green: #1e2827;\n --light-green: #c6cdd1;\n --gray: rgba(20, 20, 20, .5);\n --light-gray: rgba(20, 20, 20, .4);\n --border: rgba(255, 255, 255, .1);\n}\n\n.header {\n background: var(--black);\n padding: 36px 0;\n}\n\n.header-container {\n justify-content: space-between;\n align-items: center;\n display: flex;\n}\n\n.header-logo {\n width: 123px;\n height: 19px;\n}\n\n.header-navigation {\n align-items: center;\n column-gap: 80px;\n display: flex;\n}\n\n.header-navigation-list {\n align-items: center;\n gap: 40px;\n display: flex;\n}\n\n.header-navigation-list li {\n align-items: center;\n display: flex;\n}\n\n.header-navigation-link {\n color: rgba(254, 254, 254, .6);\n text-transform: uppercase;\n font-family: Epilogue;\n font-size: 9px;\n font-style: normal;\n font-weight: 400;\n line-height: 12px;\n transition: color .25s cubic-bezier(.4, 0, .2, 1);\n}\n\n.header-navigation-link:hover {\n color: #fefefe;\n}\n\n.header-button {\n color: rgba(254, 254, 254, .6);\n text-align: center;\n background-color: var(--dark-green);\n cursor: pointer;\n border: none;\n border-radius: 8px;\n padding: 18px 36px;\n font-family: Epilogue;\n font-size: 9px;\n font-style: normal;\n font-weight: 400;\n line-height: 12px;\n transition: color .25s cubic-bezier(.4, 0, .2, 1);\n}\n\n.header-button:hover {\n color: #fefefe;\n}\n\n.hamburger-container {\n display: none;\n}\n\n@media screen and (max-width: 1176px) {\n .header {\n padding: 20px 0;\n }\n}\n\n@media screen and (max-width: 767px) {\n .container {\n width: 100%;\n }\n\n .header {\n padding: 36px 0;\n }\n\n .header-navigation-list, .header-button {\n display: none;\n }\n\n .hamburger-container {\n justify-content: flex-end;\n display: flex;\n }\n}\n\n.hamburger {\n width: 100%;\n height: 100%;\n background: var(--dark-green);\n z-index: 999;\n padding: 36px 20px;\n transition-property: transform, opacity;\n transition-duration: .25s, .25s;\n transition-timing-function: cubic-bezier(.4, 0, .2, 1), cubic-bezier(.4, 0, .2, 1);\n position: fixed;\n top: 0;\n right: 0;\n transform: translateX(0);\n}\n\n.hamburger.is-hidden {\n transform: translateX(100%);\n}\n\n.hamburger-close-icon {\n fill: var(--white);\n}\n\n.menu-burger-container {\n align-content: center;\n justify-content: space-between;\n display: flex;\n}\n\n.hamburger-close {\n color: var(--white);\n}\n\n.hamburger-menu-list {\n flex-direction: column;\n justify-content: center;\n align-items: center;\n display: flex;\n position: fixed;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n}\n\n.hamburger_link {\n color: var(--white);\n padding: 7px 0;\n display: block;\n}\n\n:root {\n --white: #fff;\n --black: #141414;\n --dark-green: #1e2827;\n --light-green: #c6cdd1;\n --gray: rgba(20, 20, 20, .5);\n --light-gray: rgba(20, 20, 20, .4);\n --border: rgba(255, 255, 255, .1);\n}\n\n.hero-section {\n background-color: var(--black);\n width: 100%;\n padding: 80px 0;\n}\n\n.hero-title {\n color: var(--white);\n letter-spacing: -1.52px;\n width: unset;\n margin-bottom: 20px;\n font-family: Epilogue;\n font-size: 38px;\n font-style: normal;\n font-weight: 600;\n line-height: 40px;\n}\n\n@media screen and (min-width: 768px) {\n .hero-title {\n color: var(--white);\n letter-spacing: -2.4px;\n font-family: Epilogue;\n font-size: 60px;\n font-style: normal;\n font-weight: 600;\n line-height: 62px;\n }\n}\n\n@media screen and (min-width: 1280px) {\n .hero-title {\n letter-spacing: -2.4px;\n width: 750px;\n order: unset;\n margin-top: 0;\n margin-bottom: 0;\n font-size: 60px;\n font-weight: 600;\n line-height: 62px;\n }\n}\n\n.hero-col-1 {\n justify-content: space-between;\n margin-bottom: 43px;\n display: flex;\n}\n\n.hero-col-2 {\n justify-content: space-between;\n display: flex;\n}\n\n.hp-slider-img {\n width: 266px;\n}\n\n@media screen and (min-width: 768px) {\n .hp-slider-img {\n width: 436px;\n }\n}\n\n@media screen and (min-width: 1280px) {\n .hp-slider-img {\n order: 3;\n align-self: flex-end;\n }\n}\n\n.banner-slider {\n flex-direction: column;\n row-gap: 20px;\n display: flex;\n}\n\nswiper-container {\n z-index: 0;\n}\n\nswiper-slide {\n height: 200px;\n justify-content: center;\n align-items: center;\n display: flex;\n}\n\n@media screen and (min-width: 768px) {\n swiper-slide {\n height: 255px;\n background-color: #1e2827;\n justify-content: center;\n align-items: center;\n display: flex;\n }\n}\n\n.slide-control {\n width: 100%;\n height: 32px;\n justify-content: space-between;\n align-items: flex-end;\n display: flex;\n}\n\n.button-list {\n gap: 12px;\n display: inline-flex;\n}\n\n.counter-list {\n color: #fff;\n gap: 6px;\n display: inline-flex;\n}\n\n.slider-range {\n width: 40px;\n height: 100%;\n position: relative;\n}\n\n.slider-range:before {\n content: \"\";\n width: 100%;\n height: 1px;\n background-color: currentColor;\n position: absolute;\n top: 7px;\n}\n\n.control_prev:hover, .control_next:hover, .control_prev:focus, .control_next:focus {\n color: #fefefe;\n}\n\n.control_prev, .control_next {\n width: 32px;\n height: 32px;\n color: rgba(254, 254, 254, .6);\n cursor: pointer;\n background: rgba(255, 255, 255, 0);\n border: 1px solid;\n border-radius: 8px;\n justify-content: center;\n align-items: center;\n padding: 0;\n transition: color .25s cubic-bezier(.4, 0, .2, 1);\n display: flex;\n}\n\n@media screen and (min-width: 768px) {\n .control_prev, .control_next {\n width: 40px;\n height: 40px;\n }\n}\n\n.chevronleft, .chevronright {\n stroke: currentColor;\n justify-content: center;\n align-items: center;\n display: flex;\n transform: translateX(-4px);\n}\n\n.slider_option {\n width: 160px;\n margin: 10px auto;\n font-size: 18px;\n position: relative;\n}\n\n.herotext-box {\n width: 282px;\n margin-left: auto;\n}\n\n@media screen and (min-width: 768px) {\n .herotext-box {\n width: 248px;\n margin-top: -40px;\n }\n}\n\n@media screen and (min-width: 1280px) {\n .herotext-box {\n order: 2;\n margin-top: 0;\n }\n}\n\n.herotext {\n color: var(--white);\n letter-spacing: -.28px;\n width: 282px;\n font-family: Epilogue;\n font-size: 14px;\n font-style: normal;\n font-weight: 300;\n line-height: 18px;\n}\n\n.hero-text {\n color: var(--white);\n font-weight: 300;\n display: inline-flex;\n}\n\n.hero-text-tablet {\n display: none;\n}\n\n.hero-watch-div {\n order: 4;\n}\n\n.hero-wristwatch {\n width: auto;\n}\n\n.hero-text-hidden {\n display: none;\n}\n\n@media screen and (max-width: 1176px) {\n .hero-col-1 {\n flex-wrap: wrap;\n display: flex;\n }\n\n .hero-title {\n width: 100%;\n }\n\n .herotext {\n width: 248px;\n position: absolute;\n top: 464px;\n right: 32px;\n }\n\n .hero-watch-div {\n width: 100%;\n order: unset;\n margin-top: 40px;\n }\n\n .hero-col-2 {\n display: block;\n }\n\n .hero-wristwatch {\n width: 100%;\n }\n}\n\n@media screen and (max-width: 767px) {\n .container {\n width: 100%;\n }\n\n .hero-section {\n padding: 40px 0;\n }\n\n .hero-title {\n font-size: 38px;\n }\n\n .herotext {\n display: none;\n }\n\n .hero-text-hidden {\n justify-content: flex-end;\n margin-top: 40px;\n padding-left: 70px;\n display: flex;\n }\n\n .herotext-mobile {\n color: var(--white);\n letter-spacing: -.28px;\n font-family: Epilogue;\n font-size: 14px;\n font-style: normal;\n font-weight: 300;\n line-height: 18px;\n }\n}\n\n:root {\n --white: #fff;\n --black: #141414;\n --dark-green: #1e2827;\n --light-green: #c6cdd1;\n --gray: rgba(20, 20, 20, .5);\n --light-gray: rgba(20, 20, 20, .4);\n --border: rgba(255, 255, 255, .1);\n}\n\n.about-section {\n padding: 80px 0;\n}\n\n.about-col-1 {\n justify-content: space-between;\n display: flex;\n}\n\n.about-title {\n color: var(--dark-green);\n letter-spacing: -.8px;\n font-family: Epilogue;\n font-size: 40px;\n font-style: normal;\n font-weight: 600;\n line-height: 44px;\n}\n\n.about-description:first-child {\n color: var(--black);\n letter-spacing: -.28px;\n width: 470px;\n font-family: Epilogue;\n font-size: 14px;\n font-style: normal;\n font-weight: 300;\n line-height: 18px;\n}\n\n.about-description {\n color: var(--black);\n letter-spacing: -.28px;\n width: 380px;\n font-family: Epilogue;\n font-size: 14px;\n font-style: normal;\n font-weight: 300;\n line-height: 18px;\n}\n\n.about-inner-col2 {\n justify-content: flex-end;\n gap: 40px;\n display: flex;\n}\n\n.about-col-2 {\n width: 100%;\n height: 500px;\n justify-content: flex-end;\n margin-top: 40px;\n display: flex;\n}\n\n@media screen and (max-width: 1176px) {\n .about-section {\n padding: 64px 0;\n }\n\n .about-description:first-child {\n width: 220px;\n }\n\n .about-description {\n width: 250px;\n }\n\n .about-inner-col2 {\n gap: 20px;\n }\n}\n\n@media screen and (max-width: 767px) {\n .about-section {\n padding: 40px 0;\n }\n\n .about-col-1 {\n display: block;\n }\n\n .about-inner-col2 {\n flex-direction: column;\n gap: 20px;\n margin-top: 40px;\n }\n\n .about-description:first-child, .about-description {\n width: 100%;\n }\n\n .about-title {\n font-size: 32px;\n }\n\n .about-col-2 {\n height: 365px;\n }\n}\n\n:root {\n --white: #fff;\n --black: #141414;\n --dark-green: #1e2827;\n --light-green: #c6cdd1;\n --gray: rgba(20, 20, 20, .5);\n --light-gray: rgba(20, 20, 20, .4);\n --border: rgba(255, 255, 255, .1);\n}\n\n.catalog-image-container {\n width: 276px;\n height: 325px;\n margin-bottom: 0;\n}\n\n.catalog-title {\n color: var(--dark-green);\n letter-spacing: -.8px;\n font-family: Epilogue;\n font-size: 40px;\n font-style: normal;\n font-weight: 600;\n line-height: 44px;\n}\n\n.catalog {\n flex-wrap: wrap;\n justify-content: space-between;\n gap: 24px;\n margin-top: 64px;\n margin-bottom: 80px;\n display: flex;\n}\n\n.catalog-image {\n margin-top: 26px;\n margin-bottom: 25px;\n}\n\n.catalog-item {\n flex-basis: calc(25% - 24px);\n}\n\n.catalog-captions {\n background-color: var(--white);\n margin-top: 0;\n}\n\n.catalog .item-title {\n color: var(--black);\n white-space: nowrap;\n width: 276px;\n text-overflow: ellipsis;\n letter-spacing: -.28px;\n margin-bottom: 4px;\n padding: 0;\n font-family: Epilogue;\n font-size: 14px;\n font-style: normal;\n font-weight: 400;\n line-height: 18px;\n overflow: hidden;\n}\n\n.catalog .item-price {\n color: var(--gray);\n letter-spacing: -.24px;\n font-family: Epilogue;\n font-size: 12px;\n font-weight: 400;\n line-height: 14px;\n}\n\n.heart-item {\n stroke: var(--black);\n fill: var(--white);\n margin-left: 230px;\n transition: fill .25s cubic-bezier(.4, 0, .2, 1);\n}\n\n.heart-item:hover, .heart-item:focus {\n fill: red;\n}\n\n.button.buy {\n background-color: var(--dark-green);\n color: var(--white);\n font-size: 12px;\n font-weight: 400px;\n border-radius: 8px;\n justify-content: flex-end;\n align-items: flex-start;\n margin-top: 80px;\n margin-left: auto;\n padding: 18px 35px;\n transition: border-color .25s cubic-bezier(.4, 0, .2, 1), background-color .25s cubic-bezier(.4, 0, .2, 1);\n display: flex;\n}\n\n.button.buy:hover, .button.buy:focus {\n border-color: var(--white);\n background-color: rgba(30, 40, 39, .8);\n}\n\n.catalog-cover-wrap {\n width: 276px;\n height: 325px;\n position: relative;\n overflow: hidden;\n}\n\n.catalog-cover-text {\n background-color: var(--dark-green);\n height: 100%;\n width: 100%;\n border-radius: 8px;\n padding: 20px;\n transition: transform .25s ease-in-out;\n position: absolute;\n top: 0;\n transform: translateY(100%);\n}\n\n.catalog-cover-text-title {\n color: var(--white);\n letter-spacing: -.28px;\n margin-top: 20px;\n margin-bottom: 10px;\n font-family: Epilogue;\n font-size: 14px;\n font-weight: 400;\n line-height: 18px;\n}\n\n.catalog-cover-text-body {\n color: rgba(255, 255, 255, .5);\n letter-spacing: -.14px;\n margin-bottom: 20px;\n font-family: Epilogue;\n font-size: 14px;\n font-weight: 400;\n line-height: 18px;\n}\n\n.catalog-item:hover .catalog-cover-text {\n transform: translateY(0);\n}\n\n.backdrop {\n width: 100%;\n height: 100%;\n opacity: 1;\n background-color: rgba(0, 0, 0, .2);\n transition: opacity .25s cubic-bezier(.4, 0, .2, 1);\n position: fixed;\n top: 0;\n left: 0;\n}\n\n.backdrop.is-hidden .modal {\n transform: translate(-50%, -50%)scale(0);\n}\n\n.catalog-modal {\n min-width: 904px;\n min-height: 694px;\n background-color: var(--white);\n border-radius: 8px;\n flex-direction: row;\n gap: 40px;\n padding: 40px;\n transition: transform .25s cubic-bezier(.4, 0, .2, 1);\n display: flex;\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%)scale(1);\n}\n\n.catalog-close {\n width: 24px;\n height: 24px;\n cursor: pointer;\n background-color: #d3d3d3;\n border: 1px solid rgba(0, 0, 0, 0);\n justify-content: center;\n align-items: center;\n padding: 0;\n transition: transform .25s cubic-bezier(.4, 0, .2, 1), border-radius .25s cubic-bezier(.4, 0, .2, 1), border-color .25s cubic-bezier(.4, 0, .2, 1);\n display: flex;\n position: absolute;\n top: 20px;\n right: 20px;\n transform: rotate(0deg);\n}\n\n.catalog-close:hover, .catalog-close:focus {\n border-color: var(--darkgreen);\n border-radius: 50%;\n transform: rotate(180deg);\n}\n\n.is-hidden {\n visibility: none;\n opacity: 0;\n pointer-events: none;\n}\n\n.product-modal-image {\n width: 276px;\n height: 375px;\n margin-top: 0;\n}\n\n.modal-catalog-captions {\n background-color: var(--white);\n margin-top: 0;\n}\n\n.modal-item-title {\n white-space: nowrap;\n width: 276px;\n text-overflow: ellipsis;\n margin-bottom: 0;\n padding: 0;\n font-size: 14px;\n overflow: hidden;\n}\n\n.modal-item-price {\n font-size: 12px;\n}\n\n.form-modal-container {\n width: 100%;\n height: 100px;\n}\n\n.form-field {\n position: rel ative;\n flex-direction: column;\n display: flex;\n}\n\n.form-input, .form-textarea {\n width: 100%;\n border: 1px solid rgba(46, 47, 66, .4);\n border-radius: 8px;\n margin-top: 12px;\n margin-bottom: 24px;\n padding: 12px 16px;\n font-size: 16px;\n transition: border-color .25s cubic-bezier(.4, 0, .2, 1);\n}\n\n.form-input:hover, .form-input:focus, .form-textarea:hover, .form-textarea:focus {\n border-color: var(--black);\n}\n\n.form-textarea {\n resize: none;\n height: 166px;\n padding: 12px 16px;\n font-size: 16px;\n}\n\n.button.button-submit {\n width: 100%;\n background-color: var(--darkgreen);\n color: var(--white);\n border: 1px solid rgba(0, 0, 0, 0);\n border-radius: 8px;\n padding: 18px 0;\n font-size: 12px;\n transition: border-color .25s cubic-bezier(.4, 0, .2, 1), border .25s cubic-bezier(.4, 0, .2, 1), background-color .25s cubic-bezier(.4, 0, .2, 1);\n}\n\n.button.button-submit:hover, .button.button-submit:focus {\n border-color: var(--white);\n border: 1px solid var(--metallicgrey);\n background-color: rgba(30, 40, 39, .8);\n}\n\n.privacy-policy {\n color: rgba(20, 20, 20, .4);\n font-size: 12px;\n text-decoration: none;\n transition: -webkit-text-decoration .25s cubic-bezier(.4, 0, .2, 1), text-decoration .25s cubic-bezier(.4, 0, .2, 1);\n}\n\n.privacy-policy:hover, .privacy-policy:focus {\n text-decoration: underline;\n}\n\n.submit-note {\n color: rgba(20, 20, 20, .4);\n margin-top: 12px;\n font-size: 12px;\n}\n\n@media screen and (max-width: 1176px) {\n .catalog-section {\n padding: 64px 0;\n }\n\n .catalog {\n margin-bottom: 40px;\n }\n}\n\n@media screen and (max-width: 767px) {\n .catalog-section {\n padding: 40px 0;\n }\n\n .catalog {\n justify-content: center;\n }\n\n .catalog-title {\n font-size: 32px;\n }\n}\n\n:root {\n --white: #fff;\n --black: #141414;\n --dark-green: #1e2827;\n --light-green: #c6cdd1;\n --gray: rgba(20, 20, 20, .5);\n --light-gray: rgba(20, 20, 20, .4);\n --border: rgba(255, 255, 255, .1);\n}\n\n.gallery-section {\n padding: 80px 0;\n}\n\n.top-text {\n color: var(--light-gray);\n letter-spacing: .72px;\n margin-bottom: 8px;\n font-family: Epilogue;\n font-size: 12px;\n font-style: normal;\n font-weight: 300;\n line-height: 14px;\n}\n\n.gallery-title {\n color: var(--dark-green);\n letter-spacing: -.8px;\n font-family: Epilogue;\n font-size: 40px;\n font-style: normal;\n font-weight: 600;\n line-height: 44px;\n}\n\n.gallery-item {\n margin-top: 80px;\n}\n\n.gallery-item-list {\n justify-content: space-between;\n gap: 24px;\n display: flex;\n}\n\n@media screen and (max-width: 1176px) {\n .gallery-section {\n padding: 64px 0;\n }\n\n .catalog {\n margin-bottom: 40px;\n }\n\n .gallery-item {\n margin-top: 40px;\n }\n}\n\n@media screen and (max-width: 767px) {\n .gallery-section {\n padding: 40px 0;\n }\n\n .gallery-title {\n font-size: 32px;\n }\n\n .gallery-title br {\n display: none;\n }\n\n .gallery-item-list {\n flex-direction: column;\n gap: 20px;\n display: flex;\n }\n}\n\n.sale-section {\n width: 100%;\n padding: 0 0 80px;\n}\n\n.sale-description, .sale-description-details {\n color: rgba(20, 20, 20, .5);\n letter-spacing: -.14px;\n margin: 0 auto;\n font-family: Epilogue;\n font-size: 14px;\n font-style: normal;\n font-weight: 400;\n line-height: 18px;\n}\n\n.sale-watch:hover {\n cursor: pointer;\n}\n\n.watch-items {\n line-height: 0;\n list-style: none;\n}\n\n.watch-items:not(:last-child) {\n margin-bottom: 10px;\n}\n\n.sale-heading {\n color: var(--black, #141414);\n letter-spacing: -.64px;\n margin-bottom: 40px;\n font-family: Epilogue;\n font-size: 32px;\n font-style: normal;\n font-weight: 600;\n line-height: 40px;\n}\n\n@media screen and (min-width: 768px) {\n .sale-heading {\n color: var(--dark-green, #1e2827);\n letter-spacing: -.8px;\n font-size: 40px;\n line-height: 44px;\n }\n}\n\n.sale-heading {\n color: var(--black, #141414);\n letter-spacing: -.64px;\n margin-bottom: 40px;\n font-family: Epilogue;\n font-size: 32px;\n font-style: normal;\n font-weight: 600;\n line-height: 40px;\n}\n\n@media screen and (min-width: 768px) {\n .sale-heading {\n color: var(--dark-green);\n letter-spacing: -.8px;\n font-size: 40px;\n line-height: 44px;\n }\n}\n\n@media screen and (min-width: 768px) {\n .item-wrapper {\n width: 768px;\n margin-left: 66px;\n margin-right: 0;\n }\n}\n\n@media screen and (min-width: 1158px) {\n .item-wrapper {\n width: 1081px;\n height: 614px;\n gap: 40px;\n margin-left: 97px;\n margin-right: 0;\n padding-bottom: 0;\n display: flex;\n }\n}\n\n.wrapper {\n display: flex;\n}\n\n@media screen and (min-width: 768px) {\n .sale-watch {\n width: 146px;\n height: 146px;\n }\n}\n\n.preview-wrapper {\n width: 235px;\n height: 350px;\n background-color: #141414;\n justify-content: center;\n align-items: center;\n margin-bottom: 0;\n margin-left: 20px;\n padding-bottom: 0;\n display: flex;\n}\n\n#imagecontainer {\n max-width: 100%;\n max-height: 100%;\n overflow: hidden;\n}\n\n#imagecontainer img {\n max-width: 100%;\n max-height: 100%;\n margin: auto;\n}\n\n@media screen and (min-width: 768px) {\n .preview-wrapper {\n width: 406px;\n height: 614px;\n background-color: #141414;\n justify-content: center;\n align-items: center;\n margin-bottom: 0;\n margin-left: 20px;\n padding-bottom: 0;\n display: flex;\n }\n\n #imagecontainer {\n max-width: 100%;\n max-height: 100%;\n overflow: hidden;\n }\n\n #imagecontainer img {\n max-width: 100%;\n max-height: 100%;\n margin: auto;\n }\n}\n\n.sale-watch-preview {\n width: 235px;\n height: 351px;\n background-color: #141414;\n margin-bottom: -2px;\n margin-left: 20px;\n padding: 0;\n display: none;\n}\n\n@media screen and (min-width: 768px) {\n .sale-watch-preview {\n width: 100%;\n height: auto;\n }\n}\n\n.sale-info-container {\n width: 335px;\n margin: 0;\n padding: 0;\n}\n\n@media screen and (min-width: 768px) {\n .sale-info-container {\n width: 572px;\n margin: 0;\n padding: 0;\n }\n}\n\n@media screen and (min-width: 1158px) {\n .sale-info-container {\n width: 369px;\n }\n}\n\n.sale-details-heading {\n color: var(--black, #141414);\n letter-spacing: -.48px;\n margin-bottom: 0;\n font-family: Epilogue;\n font-size: 24px;\n font-style: normal;\n font-weight: 400;\n line-height: 24px;\n}\n\n@media screen and (min-width: 768px) {\n .sale-details-heading {\n letter-spacing: -.76px;\n margin-bottom: 0;\n font-size: 38px;\n line-height: 40px;\n }\n}\n\n@media screen and (min-width: 1158px) {\n .sale-details-heading {\n margin-top: 0;\n }\n}\n\n.margin-container {\n width: 335px;\n margin-top: 40px;\n padding: 0;\n}\n\n@media screen and (min-width: 768px) {\n .margin-container {\n width: 574px;\n }\n}\n\n@media screen and (min-width: 1158px) {\n .margin-container {\n width: 1081px;\n width: 369px;\n margin-top: 0;\n margin-bottom: 40px;\n }\n}\n\n.sale-product-tag {\n color: rgba(20, 20, 20, .5);\n letter-spacing: -.28px;\n margin-top: 8px;\n font-family: Epilogue;\n font-size: 14px;\n font-style: normal;\n font-weight: 400;\n line-height: 18px;\n}\n\n.current-price-on-sale {\n color: var(--black, #141414);\n letter-spacing: -.36px;\n margin: 0 auto;\n font-family: Epilogue;\n font-size: 18px;\n font-style: normal;\n font-weight: 400;\n line-height: 24px;\n}\n\n.actual-price {\n color: rgba(20, 20, 20, .5);\n letter-spacing: -.24px;\n margin-left: 8px;\n font-family: Epilogue;\n font-size: 12px;\n font-style: normal;\n font-weight: 400;\n line-height: 14px;\n -webkit-text-decoration-line: line-through;\n text-decoration-line: line-through;\n}\n\n.sale-details-title {\n color: var(--black, #141414);\n letter-spacing: -.36px;\n text-transform: uppercase;\n border-top: 1px solid var(--black, #141414);\n align-items: center;\n margin: 0 auto;\n padding-top: 8px;\n padding-bottom: 8px;\n font-family: Epilogue;\n font-size: 18px;\n font-style: normal;\n font-weight: 400;\n line-height: 24px;\n display: flex;\n position: relative;\n}\n\n@media screen and (min-width: 768px) {\n .sale-details-title {\n width: 572px;\n }\n}\n\n@media screen and (min-width: 1158px) {\n .sale-details-title {\n width: 369px;\n }\n}\n\n.sale-details-title:after {\n content: \"\";\n width: 16px;\n height: 2px;\n background-color: #141414;\n position: absolute;\n left: 319px;\n}\n\n@media screen and (min-width: 768px) {\n .sale-details-title:after {\n left: 556px;\n }\n}\n\n@media screen and (min-width: 768px) and (min-width: 1158px) {\n .sale-details-title:after {\n left: 353px;\n }\n}\n\n@media screen and (max-width: 767px) {\n .container {\n width: 100%;\n }\n\n .hero-section {\n padding: 40px 0;\n }\n}\n\n.activeimage {\n display: block;\n}\n\n:root {\n --white: #fff;\n --black: #141414;\n --dark-green: #1e2827;\n --light-green: #c6cdd1;\n --gray: rgba(20, 20, 20, .5);\n --light-gray: rgba(20, 20, 20, .4);\n --border: rgba(255, 255, 255, .1);\n}\n\n.footer {\n background: var(--dark-green);\n padding: 104px 0 32px;\n}\n\n.footer-container {\n justify-content: space-between;\n display: flex;\n}\n\n.lower-container {\n justify-content: space-between;\n margin-top: 174px;\n display: flex;\n}\n\n.footer-navigation {\n flex-direction: column;\n gap: 40px;\n display: flex;\n}\n\n.footer-logo-container {\n margin-bottom: 40px;\n}\n\n.footer-address-list {\n flex-direction: column;\n gap: 20px;\n display: flex;\n}\n\n.footer-navigation-list {\n flex-direction: column;\n gap: 18px;\n display: flex;\n}\n\n.footer-navigation-link {\n color: var(--white);\n text-transform: uppercase;\n font-family: Epilogue;\n font-size: 18px;\n font-style: normal;\n font-weight: 400;\n line-height: 24px;\n}\n\n.footer-social-list {\n justify-content: flex-start;\n gap: 16px;\n display: flex;\n}\n\n.footer-social-item {\n width: 40px;\n height: 40px;\n border: 1px solid rgba(254, 254, 254, .6);\n border-radius: 10px;\n justify-content: center;\n align-items: center;\n display: flex;\n}\n\n.footer-social-item:hover, .footer-social-item:focus {\n border: #fff;\n}\n\n.footer-social-link {\n cursor: pointer;\n color: rgba(254, 254, 254, .6);\n border-color: var(--border);\n justify-content: center;\n transition: color .25s cubic-bezier(.4, 0, .2, 1), border-color .25s cubic-bezier(.4, 0, .2, 1);\n display: flex;\n}\n\n.footer-social-link:hover, .footer-social-link:focus {\n color: var(--white);\n border-color: #fff;\n}\n\n.footer-social-icon {\n fill: var(--white);\n}\n\n.lower-text {\n color: var(--light-green);\n letter-spacing: -.28px;\n font-family: Epilogue;\n font-size: 14px;\n font-style: normal;\n font-weight: 400;\n line-height: 18px;\n}\n\n.lower-footer-link {\n color: var(--light-green);\n text-align: right;\n letter-spacing: -.28px;\n font-family: Epilogue;\n font-size: 14px;\n font-style: normal;\n font-weight: 400;\n line-height: 18px;\n}\n\n.footer-container-5 {\n gap: 18px;\n display: flex;\n}\n\n@media screen and (max-width: 767px) {\n .footer {\n padding: 40px 0;\n }\n\n .footer-container {\n flex-wrap: wrap;\n row-gap: 40px;\n display: flex;\n }\n\n .lower-container {\n flex-direction: column;\n gap: 14px;\n display: flex;\n }\n\n .footer-container-1 {\n width: 80%;\n }\n\n .footer-container-2 {\n width: 20%;\n justify-content: flex-end;\n }\n\n .footer-navigation-link {\n font-size: 14px;\n }\n\n .lower-text, .lower-footer-link {\n font-size: 12px;\n }\n}\n\n/*# sourceMappingURL=index.d6a6649a.css.map */\n","/*! modern-normalize v1.1.0 | MIT License | https://github.com/sindresorhus/modern-normalize */\n\n/*\nDocument\n========\n*/\n\n/**\nUse a better box model (opinionated).\n*/\n\n*,\n::before,\n::after {\n\tbox-sizing: border-box;\n}\n\n/**\nUse a more readable tab size (opinionated).\n*/\n\nhtml {\n\t-moz-tab-size: 4;\n\ttab-size: 4;\n}\n\n/**\n1. Correct the line height in all browsers.\n2. Prevent adjustments of font size after orientation changes in iOS.\n*/\n\nhtml {\n\tline-height: 1.15; /* 1 */\n\t-webkit-text-size-adjust: 100%; /* 2 */\n}\n\n/*\nSections\n========\n*/\n\n/**\nRemove the margin in all browsers.\n*/\n\nbody {\n\tmargin: 0;\n}\n\n/**\nImprove consistency of default fonts in all browsers. (https://github.com/sindresorhus/modern-normalize/issues/3)\n*/\n\nbody {\n\tfont-family:\n\t\tsystem-ui,\n\t\t-apple-system, /* Firefox supports this but not yet `system-ui` */\n\t\t'Segoe UI',\n\t\tRoboto,\n\t\tHelvetica,\n\t\tArial,\n\t\tsans-serif,\n\t\t'Apple Color Emoji',\n\t\t'Segoe UI Emoji';\n}\n\n/*\nGrouping content\n================\n*/\n\n/**\n1. Add the correct height in Firefox.\n2. Correct the inheritance of border color in Firefox. (https://bugzilla.mozilla.org/show_bug.cgi?id=190655)\n*/\n\nhr {\n\theight: 0; /* 1 */\n\tcolor: inherit; /* 2 */\n}\n\n/*\nText-level semantics\n====================\n*/\n\n/**\nAdd the correct text decoration in Chrome, Edge, and Safari.\n*/\n\nabbr[title] {\n\ttext-decoration: underline dotted;\n}\n\n/**\nAdd the correct font weight in Edge and Safari.\n*/\n\nb,\nstrong {\n\tfont-weight: bolder;\n}\n\n/**\n1. Improve consistency of default fonts in all browsers. (https://github.com/sindresorhus/modern-normalize/issues/3)\n2. Correct the odd 'em' font sizing in all browsers.\n*/\n\ncode,\nkbd,\nsamp,\npre {\n\tfont-family:\n\t\tui-monospace,\n\t\tSFMono-Regular,\n\t\tConsolas,\n\t\t'Liberation Mono',\n\t\tMenlo,\n\t\tmonospace; /* 1 */\n\tfont-size: 1em; /* 2 */\n}\n\n/**\nAdd the correct font size in all browsers.\n*/\n\nsmall {\n\tfont-size: 80%;\n}\n\n/**\nPrevent 'sub' and 'sup' elements from affecting the line height in all browsers.\n*/\n\nsub,\nsup {\n\tfont-size: 75%;\n\tline-height: 0;\n\tposition: relative;\n\tvertical-align: baseline;\n}\n\nsub {\n\tbottom: -0.25em;\n}\n\nsup {\n\ttop: -0.5em;\n}\n\n/*\nTabular data\n============\n*/\n\n/**\n1. Remove text indentation from table contents in Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=999088, https://bugs.webkit.org/show_bug.cgi?id=201297)\n2. Correct table border color inheritance in all Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=935729, https://bugs.webkit.org/show_bug.cgi?id=195016)\n*/\n\ntable {\n\ttext-indent: 0; /* 1 */\n\tborder-color: inherit; /* 2 */\n}\n\n/*\nForms\n=====\n*/\n\n/**\n1. Change the font styles in all browsers.\n2. Remove the margin in Firefox and Safari.\n*/\n\nbutton,\ninput,\noptgroup,\nselect,\ntextarea {\n\tfont-family: inherit; /* 1 */\n\tfont-size: 100%; /* 1 */\n\tline-height: 1.15; /* 1 */\n\tmargin: 0; /* 2 */\n}\n\n/**\nRemove the inheritance of text transform in Edge and Firefox.\n1. Remove the inheritance of text transform in Firefox.\n*/\n\nbutton,\nselect { /* 1 */\n\ttext-transform: none;\n}\n\n/**\nCorrect the inability to style clickable types in iOS and Safari.\n*/\n\nbutton,\n[type='button'],\n[type='reset'],\n[type='submit'] {\n\t-webkit-appearance: button;\n}\n\n/**\nRemove the inner border and padding in Firefox.\n*/\n\n::-moz-focus-inner {\n\tborder-style: none;\n\tpadding: 0;\n}\n\n/**\nRestore the focus styles unset by the previous rule.\n*/\n\n:-moz-focusring {\n\toutline: 1px dotted ButtonText;\n}\n\n/**\nRemove the additional ':invalid' styles in Firefox.\nSee: https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737\n*/\n\n:-moz-ui-invalid {\n\tbox-shadow: none;\n}\n\n/**\nRemove the padding so developers are not caught out when they zero out 'fieldset' elements in all browsers.\n*/\n\nlegend {\n\tpadding: 0;\n}\n\n/**\nAdd the correct vertical alignment in Chrome and Firefox.\n*/\n\nprogress {\n\tvertical-align: baseline;\n}\n\n/**\nCorrect the cursor style of increment and decrement buttons in Safari.\n*/\n\n::-webkit-inner-spin-button,\n::-webkit-outer-spin-button {\n\theight: auto;\n}\n\n/**\n1. Correct the odd appearance in Chrome and Safari.\n2. Correct the outline style in Safari.\n*/\n\n[type='search'] {\n\t-webkit-appearance: textfield; /* 1 */\n\toutline-offset: -2px; /* 2 */\n}\n\n/**\nRemove the inner padding in Chrome and Safari on macOS.\n*/\n\n::-webkit-search-decoration {\n\t-webkit-appearance: none;\n}\n\n/**\n1. Correct the inability to style clickable types in iOS and Safari.\n2. Change font properties to 'inherit' in Safari.\n*/\n\n::-webkit-file-upload-button {\n\t-webkit-appearance: button; /* 1 */\n\tfont: inherit; /* 2 */\n}\n\n/*\nInteractive\n===========\n*/\n\n/*\nAdd the correct display in Chrome and Safari.\n*/\n\nsummary {\n\tdisplay: list-item;\n}\n","@import './common';\n@import './header';\n@import './herostyles';\n@import './about';\n@import './catalog';\n@import './gallery';\n@import './sale';\n@import './footer';","@import '~node_modules/modern-normalize/modern-normalize.css';\nh1,\nh2,\nh3,\nh4,\nh5,\nh6,\np {\n margin: 0;\n}\n\nul {\n margin: 0;\n padding: 0;\n}\n\nimg {\n display: block;\n max-width: 100%;\n height: auto;\n}\n\nhtml {\n box-sizing: border-box;\n}\n\n*,\n*::before,\n*::after {\n box-sizing: inherit;\n}\n\na{\n text-decoration: none;\n \n}\n\n.list {\n list-style-type: none;\n padding: 0;\n margin: 0;\n}\n\nbody {\n font-family: 'Epilogue', sans-serif;\n font-size: 14px;\n font-style: normal;\n font-weight: 300;\n line-height: 18px;\n letter-spacing: -0.28px;\n margin: 0;\n}\n\n.section{\n width: 100%;\n margin: auto;\n}\n\n.container {\n width: 1280px;\n margin: 0 auto;\n padding: 0 20px;\n}\n\n\n@media screen and (max-width: 1176px){\n .container {\n width: 768px;\n padding: 0 32px;\n }\n}\n\n@media screen and (max-width: 767px) {\n .container {\n width: 100%;\n }\n}",":root {\n --white: #ffffff;\n --black: #141414;\n --dark-green: #1E2827;\n --light-green: #C6CDD1;\n --gray: rgba(20, 20, 20, 0.50);\n --light-gray: rgba(20, 20, 20, 0.40);\n --border: rgba(255, 255, 255, 0.10);\n}\n\n.header{\n padding: 36px 0;\n background: var(--black);\n}\n\n.header-container{\n display: flex;\n align-items: center;\n justify-content: space-between;\n}\n\n.header-logo{\n width: 123px;\n height: 19px;\n}\n\n.header-navigation{\n display: flex;\n align-items: center;\n column-gap: 80px;\n}\n\n.header-navigation-list{\n display: flex;\n align-items: center;\n gap: 40px;\n}\n\n.header-navigation-list li{\n display: flex;\n align-items: center;\n}\n\n\n.header-navigation-link{\n color: #fefefe99;\n font-family: Epilogue;\n font-size: 9px;\n font-style: normal;\n font-weight: 400;\n line-height: 12px;\n text-transform: uppercase;\n transition: color 250ms cubic-bezier(0.4, 0, 0.2, 1);\n}\n\n.header-navigation-link:hover{\n color: rgba(254, 254, 254, 1);\n\n}\n\n\n.header-button{\n color: #fefefe99;\n text-align: center;\n font-family: Epilogue;\n font-size: 9px;\n font-style: normal;\n font-weight: 400;\n line-height: 12px;\n // text-transform: uppercase;\n padding: 18px 36px;\n border-radius: 8px;\n background-color: var(--dark-green);\n border: none;\n cursor: pointer;\n transition: color 250ms cubic-bezier(0.4, 0, 0.2, 1);\n}\n\n.header-button:hover {\n color: rgba(254, 254, 254, 1);\n}\n\n.hamburger-container{\n display: none;\n}\n\n\n@media screen and (max-width: 1176px) {\n .header{\n padding: 20px 0;\n }\n}\n\n@media screen and (max-width: 767px) {\n .container {\n width: 100%;\n }\n\n .header {\n padding: 36px 0;\n }\n\n .header-navigation-list, .header-button{\n display: none;\n }\n\n .hamburger-container{\n display: flex;\n justify-content: flex-end;\n }\n}\n\n\n.hamburger{\n width: 100%;\n height: 100%;\n background: var(--dark-green);\n transform: translateX(0);\n z-index: 999;\n position: fixed;\n top: 0;\n right: 0;\n padding: 36px 20px;\n\n transform: translateX(0);\n transition-property: transform, opacity;\n transition-duration: 250ms, 250ms;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1), cubic-bezier(0.4, 0, 0.2, 1);\n}\n\n.hamburger.is-hidden{\n transform: translateX(100%);\n}\n\n.hamburger-close-icon{\n fill: var(--white);\n}\n\n.menu-burger-container{\n display: flex;\n align-content: center;\n justify-content: space-between;\n}\n\n.hamburger-close{\n color: var(--white);\n}\n\n\n.hamburger-menu-list{\n position: fixed;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n}\n\n.hamburger_link{\n color: var(--white);\n padding: 7px 0;\n display: block;\n}",":root {\n --white: #ffffff;\n --black: #141414;\n --dark-green: #1E2827;\n --light-green: #C6CDD1;\n --gray: rgba(20, 20, 20, 0.50);\n --light-gray: rgba(20, 20, 20, 0.40);\n --border: rgba(255, 255, 255, 0.10);\n}\n\n.hero-section {\n background-color: var(--black);\n width: 100%;\n padding: 80px 0;\n\n}\n\n.hero-title {\n color: var(--white);\n font-family: 'Epilogue';\n font-size: 38px;\n font-style: normal;\n font-weight: 600;\n line-height: 40px;\n letter-spacing: -1.52px;\n margin-bottom: 20px;\n width: unset;\n \n\n @media screen and (min-width: 768px) {\n color: var(--white);\n font-family: 'Epilogue';\n font-size: 60px;\n font-style: normal;\n font-weight: 600;\n line-height: 62px; \n letter-spacing: -2.4px;\n}\n\n @media screen and (min-width: 1280px) {\n font-size: 60px;\n font-weight: 600;\n line-height: 62px;\n letter-spacing: -2.4px;\n margin-top: 0;\n margin-bottom: 0;\n width: 750px;\n order: unset; \n }\n}\n\n.hero-col-1{\n display: flex;\n justify-content: space-between;\n margin-bottom: 43px;\n}\n\n.hero-col-2{\n display: flex;\n justify-content: space-between;\n}\n\n\n/* Start of Slider */\n.hp-slider-img{\n width: 266px;\n\n @media screen and (min-width: 768px) {\n width: 436px;\n }\n\n @media screen and (min-width: 1280px){\n order: 3;\n align-self: flex-end; \n }\n}\n\n.banner-slider{ \n display: flex;\n flex-direction: column;\n row-gap: 20px;\n}\n\nswiper-container {\n z-index: 0;\n}\n\nswiper-slide{\n display: flex;\n justify-content: center;\n align-items: center;\n height: 200px;\n\n @media screen and (min-width: 768px) {\n background-color: #1e2827;\n display: flex;\n justify-content: center;\n align-items: center;\n height: 255px;\n }\n}\n\n.slide-control {\n width: 100%;\n display: flex;\n align-items: flex-end;\n justify-content: space-between;\n height: 32px;\n\n}\n\n.button-list{\n display: inline-flex;\n gap: 12px;\n}\n\n.counter-list{\n display: inline-flex;\n color:#fff;\n gap: 6px;\n\n}\n\n.slider-range{\n position: relative;\n width: 40px;\n height: 100%;\n}\n\n.slider-range::before{\n content: \"\";\n position: absolute;\n top: 7px;\n width: 100%;\n height: 1px;\n background-color: currentColor; \n}\n\n.control_prev:hover, .control_next:hover,\n.control_prev:focus, .control_next:focus {\n color: rgba(254, 254, 254, 1);\n\n}\n\n.control_prev, .control_next {\n border-radius: 8px;\n width: 32px;\n height: 32px;\n background: #ffffff00;\n color: rgba(254, 254, 254, 0.60);\n cursor: pointer;\n border: 1px solid currentColor;\n display: flex;\n justify-content: center;\n align-items: center;\n padding: 0;\n transition: color 250ms cubic-bezier(0.4, 0, 0.2, 1);\n\n @media screen and (min-width: 768px) {\n width: 40px;\n height: 40px;\n \n }\n}\n\n.chevronleft, .chevronright {\n stroke: currentColor;\n display: flex;\n justify-content: center;\n align-items: center;\n transform: translateX(-4px);\n}\n\n\n\n.slider_option {\n position: relative;\n margin: 10px auto;\n width: 160px;\n font-size: 18px;\n}\n\n/** End Slider **/\n\n.herotext-box{\n width: 282px;\n margin-left: auto;\n\n @media screen and (min-width: 768px) {\n width: 248px;\n margin-top: -40px;\n \n }\n\n @media screen and (min-width: 1280px) {\n margin-top: 0;\n order: 2;\n \n }\n}\n\n.herotext{\n color: var(--white);\n font-family: 'Epilogue';\n font-size: 14px;\n font-style: normal;\n font-weight: 300;\n line-height: 18px;\n letter-spacing: -0.28px;\n width: 282px;\n}\n\n.hero-text {\n \n color: var(--white);\n font-weight: 300;\n display: inline-flex;\n\n @media screen and (min-width: 768px) { \n }\n}\n\n.hero-text-tablet{\n display: none;\n}\n\n.hero-watch-div{\n order: 4;\n\n}\n\n.hero-wristwatch{\n width: auto;\n}\n\n .hero-text-hidden{\n display: none;\n }\n\n\n@media screen and (max-width: 1176px) {\n .hero-col-1{\n display: flex;\n flex-wrap: wrap;\n }\n\n .hero-title{\n width: 100%;\n }\n\n .herotext{\n position: absolute;\n right: 32px;\n top: 464px;\n width: 248px;\n }\n\n .hero-watch-div{\n width: 100%;\n order: unset;\n margin-top: 40px;\n }\n\n .hero-col-2{\n display: block;\n }\n\n .hero-wristwatch{\n width: 100%;\n }\n}\n\n@media screen and (max-width: 767px) {\n .container {\n width: 100%;\n }\n\n .hero-section{\n padding: 40px 0;\n }\n\n .hero-title{\n font-size: 38px;\n }\n\n .herotext{\n display: none;\n }\n\n .hero-text-hidden{\n display: flex;\n justify-content: flex-end;\n margin-top: 40px;\n padding-left: 70px;\n }\n\n .herotext-mobile{\n color: var(--white);\n font-family: 'Epilogue';\n font-size: 14px;\n font-style: normal;\n font-weight: 300;\n line-height: 18px;\n letter-spacing: -0.28px;\n }\n}",":root {\n --white: #ffffff;\n --black: #141414;\n --dark-green: #1E2827;\n --light-green: #C6CDD1;\n --gray: rgba(20, 20, 20, 0.50);\n --light-gray: rgba(20, 20, 20, 0.40);\n --border: rgba(255, 255, 255, 0.10);\n}\n\n.about-section{\n padding: 80px 0;\n}\n\n.about-col-1{\n display: flex;\n justify-content: space-between;\n}\n\n.about-title{\n color: var(--dark-green);\n font-family: 'Epilogue';\n font-size: 40px;\n font-style: normal;\n font-weight: 600;\n line-height: 44px;\n letter-spacing: -0.8px;\n}\n\n.about-description:first-child {\n color: var(--black);\n font-family: 'Epilogue';\n font-size: 14px;\n font-style: normal;\n font-weight: 300;\n line-height: 18px;\n letter-spacing: -0.28px;\n width: 470px;\n}\n\n.about-description{\n color: var(--black);\n font-family: 'Epilogue';\n font-size: 14px;\n font-style: normal;\n font-weight: 300;\n line-height: 18px;\n letter-spacing: -0.28px;\n width: 380px;\n}\n\n.about-inner-col2{\n display: flex;\n justify-content: flex-end;\n gap: 40px;\n}\n\n.about-col-2{\n margin-top: 40px;\n width: 100%;\n height: 500px;\n display: flex;\n justify-content: flex-end;\n}\n\n\n@media screen and (max-width: 1176px) {\n .about-section{\n padding: 64px 0;\n }\n\n .about-description:first-child{\n width: 220px;\n }\n .about-description{\n width: 250px;\n }\n\n .about-inner-col2{\n gap: 20px;\n }\n}\n\n@media screen and (max-width: 767px) {\n .about-section {\n padding: 40px 0;\n }\n\n .about-col-1{\n display: block;\n }\n\n .about-inner-col2{\n margin-top: 40px;\n gap: 20px;\n flex-direction: column;\n }\n\n .about-description:first-child, .about-description {\n width: 100%;\n }\n\n .about-title{\n font-size: 32px;\n }\n\n .about-col-2{\n height: 365px;\n }\n\n \n\n}",":root {\n --white: #ffffff;\n --black: #141414;\n --dark-green: #1e2827;\n --light-green: #c6cdd1;\n --gray: rgba(20, 20, 20, 0.5);\n --light-gray: rgba(20, 20, 20, 0.4);\n --border: rgba(255, 255, 255, 0.1);\n}\n\n/*catalog styling*/\n\n.catalog-image-container {\n margin-bottom: 0px;\n width: 276px;\n height: 325px;\n}\n\n.catalog-title {\n color: var(--dark-green);\n font-family: 'Epilogue';\n font-size: 40px;\n font-style: normal;\n font-weight: 600;\n line-height: 44px;\n letter-spacing: -0.8px;\n}\n\n.catalog {\n display: flex;\n flex-wrap: wrap;\n justify-content: space-between;\n margin-top: 64px;\n margin-bottom: 80px;\n gap: 24px;\n}\n\n.catalog-image {\n margin-top: 26px;\n margin-bottom: 25px;\n}\n\n.catalog-item {\n flex-basis: calc(100% / 4 - 24px);\n}\n\n.catalog-captions {\n background-color: var(--white);\n margin-top: 0px;\n}\n\n.catalog .item-title {\n color: var(--black);\n margin-bottom: 0;\n padding: 0;\n white-space: nowrap;\n width: 276px;\n text-overflow: ellipsis;\n overflow: hidden;\n font-size: 14px;\n font-family: 'Epilogue';\n font-weight: 400;\n font-style: normal;\n line-height: 18px;\n letter-spacing: -0.28px;\n margin-bottom: 4px;\n}\n\n.catalog .item-price {\n color: var(--gray);\n font-family: 'Epilogue';\n font-size: 12px;\n font-weight: 400;\n line-height: 14px;\n letter-spacing: -0.24px;\n}\n\n.heart-item {\n stroke: var(--black);\n fill: var(--white);\n margin-left: 230px;\n\n transition: fill 250ms cubic-bezier(0.4, 0, 0.2, 1);\n}\n\n.heart-item:hover,\n.heart-item:focus {\n fill: red;\n}\n\n.button.buy {\n background-color: var(--dark-green);\n color: var(--white);\n font-size: 12px;\n font-weight: 400px;\n padding: 18px 35px;\n border-radius: 8px;\n display: flex;\n justify-content: flex-end;\n align-items: flex-start;\n margin-left: auto;\n margin-top: 80px;\n\n transition: border-color 250ms cubic-bezier(0.4, 0, 0.2, 1),\n background-color 250ms cubic-bezier(0.4, 0, 0.2, 1);\n}\n\n.button.buy:hover,\n.button.buy:focus {\n border-color: var(--white);\n background-color: rgba(30, 40, 39, 0.8);\n}\n\n/*for cover wrap*/\n.catalog-cover-wrap {\n position: relative;\n overflow: hidden;\n width: 276px;\n height: 325px;\n}\n.catalog-cover-text {\n position: absolute;\n top: 0;\n background-color: var(--dark-green);\n border-radius: 8px;\n transform: translateY(100%);\n transition: transform 250ms ease-in-out;\n height: 100%;\n width: 100%;\n padding: 20px;\n}\n\n.catalog-cover-text-title {\n font-family: 'Epilogue';\n font-size: 14px;\n color: var(--white);\n font-weight: 400;\n margin-bottom: 10px;\n line-height: 18px;\n letter-spacing: -0.28px;\n margin-top: 20px;\n}\n\n.catalog-cover-text-body {\n font-family: 'Epilogue';\n font-size: 14px;\n font-weight: 400;\n color: rgba(255, 255, 255, 0.5);\n line-height: 18px;\n letter-spacing: -0.14px;\n // margin-top: 20px;\n margin-bottom: 20px;\n}\n\n.catalog-item:hover .catalog-cover-text {\n transform: translateY(0);\n}\n\n/*for modal*/\n.backdrop {\n position: fixed;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n background-color: rgba(0, 0, 0, 0.2);\n opacity: 1;\n transition: opacity 250ms cubic-bezier(0.4, 0, 0.2, 1);\n}\n\n.backdrop.is-hidden .modal {\n transform: translate(-50%, -50%) scale(0);\n}\n\n.catalog-modal {\n position: absolute;\n top: 50%;\n left: 50%;\n min-width: 904px;\n min-height: 694px;\n background-color: var(--white);\n border-radius: 8px;\n display: flex;\n flex-direction: row;\n gap: 40px;\n padding: 40px;\n\n transform: translate(-50%, -50%) scale(1);\n transition: transform 250ms cubic-bezier(0.4, 0, 0.2, 1);\n}\n\n.catalog-close {\n position: absolute;\n top: 20px;\n right: 20px;\n padding: 0px;\n justify-content: center;\n display: flex;\n align-items: center;\n width: 24px;\n height: 24px;\n cursor: pointer;\n background-color: lightgrey;\n border: 1px solid transparent;\n\n transform: rotate(0deg);\n transition: transform 250ms cubic-bezier(0.4, 0, 0.2, 1),\n border-radius 250ms cubic-bezier(0.4, 0, 0.2, 1),\n border-color 250ms cubic-bezier(0.4, 0, 0.2, 1);\n}\n\n.catalog-close:hover,\n.catalog-close:focus {\n border-radius: 50%;\n transform: rotate(180deg);\n border-color: var(--darkgreen);\n}\n\n.is-hidden {\n visibility: none;\n opacity: 0;\n pointer-events: none;\n}\n\n.product-modal-image {\n margin-top: 0px;\n width: 276px;\n height: 375px;\n}\n\n.modal-catalog-captions {\n background-color: var(--white);\n margin-top: 0px;\n}\n\n.modal-item-title {\n margin-bottom: 0;\n padding: 0;\n white-space: nowrap;\n width: 276px;\n text-overflow: ellipsis;\n overflow: hidden;\n font-size: 14px;\n}\n\n.modal-item-price {\n font-size: 12px;\n}\n\n.form-modal-container {\n width: 100%;\n height: 100;\n}\n\n/*modal-forms*/\n\n.form-field {\n display: flex;\n position: rel ative;\n flex-direction: column;\n}\n\n.form-input,\n.form-textarea {\n font-size: 16px;\n width: 100%;\n margin-bottom: 24px;\n margin-top: 12px;\n padding: 12px 16px;\n border-radius: 8px;\n border: 1px solid rgba(46, 47, 66, 0.4);\n\n transition: border-color 250ms cubic-bezier(0.4, 0, 0.2, 1);\n}\n\n.form-input:hover,\n.form-input:focus,\n.form-textarea:hover,\n.form-textarea:focus {\n border-color: var(--black);\n}\n\n.form-textarea {\n resize: none;\n padding-left: 16px;\n padding-right: 16px;\n padding-top: 12px;\n padding-bottom: 12px;\n font-size: 16px;\n height: 166px;\n}\n\n.button.button-submit {\n width: 100%;\n background-color: var(--darkgreen);\n padding: 18px 0px;\n color: var(--white);\n border-radius: 8px;\n font-size: 12px;\n border: 1px solid transparent;\n\n transition: border-color 250ms cubic-bezier(0.4, 0, 0.2, 1),\n border 250ms cubic-bezier(0.4, 0, 0.2, 1),\n background-color 250ms cubic-bezier(0.4, 0, 0.2, 1);\n}\n\n.button.button-submit:hover,\n.button.button-submit:focus {\n border-color: var(--white);\n border: 1px solid var(--metallicgrey);\n background-color: rgba(30, 40, 39, 0.8);\n}\n\n.privacy-policy {\n text-decoration: none;\n color: rgba(20, 20, 20, 0.4);\n font-size: 12px;\n transition: text-decoration 250ms cubic-bezier(0.4, 0, 0.2, 1);\n}\n\n.privacy-policy:hover,\n.privacy-policy:focus {\n text-decoration: underline;\n}\n\n.submit-note {\n color: rgba(20, 20, 20, 0.4);\n font-size: 12px;\n margin-top: 12px;\n}\n\n@media screen and (max-width: 1176px) {\n .catalog-section {\n padding: 64px 0;\n }\n\n .catalog {\n margin-bottom: 40px;\n }\n}\n\n@media screen and (max-width: 767px) {\n .catalog-section {\n padding: 40px 0;\n }\n\n .catalog {\n justify-content: center;\n }\n\n .catalog-title {\n font-size: 32px;\n }\n}\n",":root {\n --white: #ffffff;\n --black: #141414;\n --dark-green: #1E2827;\n --light-green: #C6CDD1;\n --gray: rgba(20, 20, 20, 0.50);\n --light-gray: rgba(20, 20, 20, 0.40);\n --border: rgba(255, 255, 255, 0.10);\n}\n\n.gallery-section{\n padding: 80px 0;\n}\n\n.top-text{\n color: var(--light-gray);\n font-family: 'Epilogue';\n font-size: 12px;\n font-style: normal;\n font-weight: 300;\n line-height: 14px;\n letter-spacing: 0.72px;\n margin-bottom: 8px;\n}\n\n.gallery-title{\n color: var(--dark-green);\n font-family: 'Epilogue';\n font-size: 40px;\n font-style: normal;\n font-weight: 600;\n line-height: 44px;\n letter-spacing: -0.8px;\n}\n\n.gallery-item{\n margin-top: 80px;\n}\n\n\n.gallery-item-list{\n display: flex;\n justify-content: space-between;\n gap: 24px;\n}\n\n\n@media screen and (max-width: 1176px) {\n .gallery-section {\n padding: 64px 0;\n }\n\n .catalog {\n margin-bottom: 40px;\n }\n\n .gallery-item{\n margin-top: 40px;\n }\n\n}\n\n@media screen and (max-width: 767px) {\n .gallery-section{\n padding: 40px 0;\n }\n\n .gallery-title{\n font-size: 32px;\n }\n\n .gallery-title br {\n display: none;\n }\n\n .gallery-item-list{\n display: flex;\n flex-direction: column;\n gap: 20px;\n }\n\n}",".sale-section {\n width: 100%;\n padding: 0 0 80px 0;\n}\n\n.sale-description {\n color: rgba(20, 20, 20, 0.5);\n font-family: Epilogue;\n font-size: 14px;\n font-style: normal;\n font-weight: 400;\n line-height: 18px;\n letter-spacing: -0.14px;\n margin-top: 9px;\n margin: 0 auto;\n}\n\n.sale-description-details {\n color: rgba(20, 20, 20, 0.5);\n font-family: Epilogue;\n font-size: 14px;\n font-style: normal;\n font-weight: 400;\n line-height: 18px;\n letter-spacing: -0.14px;\n margin-top: 9px;\n margin: 0 auto;\n}\n\n.sale-watch:hover {\n cursor: pointer;\n}\n\n.watch-items {\n list-style: none;\n line-height: 0em;\n}\n\n.watch-items:not(:last-child) {\n margin-bottom: 10px;\n}\n\n.sale-heading {\n color: var(--black, #141414);\n font-family: Epilogue;\n font-size: 32px;\n font-style: normal;\n font-weight: 600;\n line-height: 40px;\n letter-spacing: -0.64px;\n margin-bottom: 40px;\n\n @media screen and (min-width: 768px) {\n color: var(--dark-green, #1e2827);\n font-size: 40px;\n line-height: 44px;\n letter-spacing: -0.8px;\n }\n}\n\n.sale-heading {\n color: var(--black, #141414);\n font-family: Epilogue;\n font-size: 32px;\n font-style: normal;\n font-weight: 600;\n line-height: 40px;\n letter-spacing: -0.64px;\n margin-bottom: 40px;\n\n @media screen and (min-width: 768px) {\n color: var(--dark-green);\n font-size: 40px;\n line-height: 44px;\n letter-spacing: -0.8px;\n }\n}\n\n.item-wrapper {\n @media screen and (min-width: 768px) {\n margin-left: 66px;\n margin-right: 0px;\n width: 768px;\n }\n\n @media screen and (min-width: 1158px) {\n width: 1081px;\n display: flex;\n gap: 40px;\n height: 614px;\n margin-left: 97px;\n margin-right: 0px;\n padding-bottom: 0px;\n margin-right: 0px;\n }\n}\n\n.wrapper {\n display: flex;\n}\n\n@media screen and (min-width: 768px) {\n .sale-watch {\n width: 146px;\n height: 146px;\n }\n}\n\n.preview-wrapper {\n width: 235px;\n height: 350px;\n margin-bottom: 0px;\n padding-bottom: 0px;\n margin-left: 20px;\n margin-bottom: 0px;\n display: flex;\n align-items: center;\n justify-content: center;\n background-color: #141414;\n}\n\n#imagecontainer {\n max-width: 100%;\n max-height: 100%;\n overflow: hidden;\n}\n\n#imagecontainer img {\n max-width: 100%;\n max-height: 100%;\n // display: block;\n margin: auto;\n}\n\n@media screen and (min-width: 768px) {\n .preview-wrapper {\n width: 406px;\n height: 614px;\n\n margin-bottom: 0px;\n padding-bottom: 0px;\n margin-left: 20px;\n margin-bottom: 0px;\n display: flex;\n align-items: center;\n justify-content: center;\n background-color: #141414;\n }\n\n #imagecontainer {\n max-width: 100%;\n max-height: 100%;\n overflow: hidden;\n }\n\n #imagecontainer img {\n max-width: 100%;\n max-height: 100%;\n // display: none;\n margin: auto;\n }\n}\n\n\n\n.sale-watch-preview {\n width: 235px;\n height: 351px;\n padding: 0px;\n margin-bottom: -2px;\n margin-left: 20px;\n background-color: #141414;\n display: none;\n \n\n @media screen and (min-width: 768px) {\n width: 100%;\n height: auto;\n }\n}\n\n\n\n.sale-info-container {\n padding: 0px;\n margin: 0px;\n width: 335px;\n\n @media screen and (min-width: 768px) {\n padding: 0px;\n margin: 0px;\n width: 572px;\n }\n\n @media screen and (min-width: 1158px) {\n width: 369px;\n }\n}\n\n.sale-details-heading {\n color: var(--black, #141414);\n font-family: Epilogue;\n font-size: 24px;\n font-style: normal;\n font-weight: 400;\n line-height: 24px;\n letter-spacing: -0.48px;\n\n margin-bottom: 0px;\n\n @media screen and (min-width: 768px) {\n font-size: 38px;\n line-height: 40px;\n letter-spacing: -0.76px;\n margin-bottom: 0px;\n }\n\n @media screen and (min-width: 1158px) {\n margin-top: 0px;\n }\n}\n\n.margin-container {\n margin-top: 40px;\n width: 335px;\n padding: 0px;\n\n @media screen and (min-width: 768px) {\n width: 574px;\n }\n\n @media screen and (min-width: 1158px) {\n width: 1081px;\n margin-top: 0px;\n margin-bottom: 40px;\n width: 369px;\n }\n}\n\n.sale-product-tag {\n color: rgba(20, 20, 20, 0.5);\n font-family: Epilogue;\n font-size: 14px;\n font-style: normal;\n font-weight: 400;\n line-height: 18px;\n letter-spacing: -0.28px;\n margin-top: 8px;\n}\n\n.current-price-on-sale {\n color: var(--black, #141414);\n font-family: Epilogue;\n font-size: 18px;\n font-style: normal;\n font-weight: 400;\n line-height: 24px;\n letter-spacing: -0.36px;\n margin: 0 auto;\n}\n\n.actual-price {\n color: rgba(20, 20, 20, 0.5);\n font-family: Epilogue;\n font-size: 12px;\n font-style: normal;\n font-weight: 400;\n line-height: 14px; /* 116.667% */\n letter-spacing: -0.24px;\n text-decoration-line: line-through;\n margin-left: 8px;\n}\n\n.sale-details-title {\n color: var(--black, #141414);\n font-family: Epilogue;\n font-size: 18px;\n font-style: normal;\n font-weight: 400;\n line-height: 24px;\n letter-spacing: -0.36px;\n text-transform: uppercase;\n padding-top: 8px;\n padding-bottom: 8px;\n margin: 0 auto;\n border-top: 1px solid var(--black, #141414);\n display: flex;\n align-items: center;\n position: relative;\n\n @media screen and (min-width: 768px) {\n width: 572px;\n }\n\n @media screen and (min-width: 1158px) {\n width: 369px;\n }\n}\n\n.sale-details-title::after {\n content: '';\n width: 16px;\n height: 2px;\n background-color: #141414;\n position: absolute;\n left: 319px;\n}\n\n@media screen and (min-width: 768px) {\n .sale-details-title::after {\n left: 556px;\n }\n\n @media screen and (min-width: 1158px) {\n .sale-details-title::after {\n left: 353px;\n }\n }\n}\n\n@media screen and (max-width: 767px) {\n .container {\n width: 100%;\n }\n\n .hero-section {\n padding: 40px 0;\n }\n}\n\n.activeimage {\n display: block;\n \n}\n",":root {\n --white: #ffffff;\n --black: #141414;\n --dark-green: #1E2827;\n --light-green: #C6CDD1;\n --gray: rgba(20, 20, 20, 0.50);\n --light-gray: rgba(20, 20, 20, 0.40);\n --border: rgba(255, 255, 255, 0.10);\n}\n\n.footer{\n padding: 104px 0 32px;\n background: var(--dark-green);\n}\n\n.footer-container{\n display: flex;\n justify-content: space-between;\n}\n\n.lower-container{\n display: flex;\n justify-content: space-between;\n margin-top: 174px;\n}\n\n.footer-navigation{\n display: flex;\n flex-direction: column;\n gap: 40px;\n}\n\n.footer-logo-container{\n margin-bottom: 40px;\n}\n\n.footer-address-list{\n display: flex;\n flex-direction: column;\n gap: 20px;\n}\n\n.footer-navigation-list{\n display: flex;\n flex-direction: column;\n gap: 18px;\n}\n\n.footer-navigation-link{\n color: var(--white);\n font-family: 'Epilogue';\n font-size: 18px;\n font-style: normal;\n font-weight: 400;\n line-height: 24px;\n text-transform: uppercase;\n}\n\n.footer-social-list{\n display: flex;\n gap: 16px;\n justify-content: flex-start;\n}\n\n.footer-social-item{\n border-radius: 10px;\n border: 1px solid #fefefe99;\n width: 40px;\n height: 40px;\n display: flex;\n justify-content: center;\n align-items: center;\n}\n\n.footer-social-item:hover,\n.footer-social-item:focus{\n border: white;\n}\n\n.footer-social-link{\n cursor: pointer;\n display: flex;\n justify-content: center;\n color: #fefefe99;\n border-color: var(--border);\n transition: color 250ms cubic-bezier(0.4, 0, 0.2, 1), border-color 250ms cubic-bezier(0.4, 0, 0.2, 1); \n}\n\n.footer-social-link:hover,\n.footer-social-link:focus{\n color: var(--white);\n border-color: white;\n}\n\n.footer-social-icon{\n fill: var(--white);\n}\n\n.lower-text{\n color: var(--light-green);\n font-family: 'Epilogue';\n font-size: 14px;\n font-style: normal;\n font-weight: 400;\n line-height: 18px;\n letter-spacing: -0.28px;\n}\n\n.lower-footer-link{\n color: var(--light-green);\n text-align: right;\n font-family: 'Epilogue';\n font-size: 14px;\n font-style: normal;\n font-weight: 400;\n line-height: 18px;\n letter-spacing: -0.28px;\n}\n\n.footer-container-5{\n display: flex;\n gap: 18px;\n}\n\n\n@media screen and (max-width: 767px) {\n .footer {\n padding: 40px 0;\n }\n\n .footer-container{\n display: flex;\n flex-wrap: wrap;\n row-gap: 40px;\n }\n\n .lower-container{\n display: flex;\n flex-direction: column;\n gap: 14px;\n }\n\n .footer-container-1{\n width: 80%;\n }\n\n .footer-container-2{\n width: 20%;\n justify-content: flex-end;\n }\n\n .footer-navigation-link{\n font-size: 14px;\n }\n\n .lower-text, .lower-footer-link{\n font-size: 12px;\n }\n}"],"names":[],"version":3,"file":"index.d6a6649a.css.map"} \ No newline at end of file diff --git a/index.html b/index.html index d6e8564..983c1b0 100644 --- a/index.html +++ b/index.html @@ -1 +1 @@ -The Watch Spot
+380 (68) 443-94-26

Welcome to our collection of premium watches

Our watches are not just timepieces, but also an expression of your personality and lifestyle. From classic designs to modern ones, we have a watch to suit every taste and occasion.

Our watches are not just timepieces, but also an expression of your personality and lifestyle. From classic designs to modern ones, we have a watch to suit every taste and occasion.

About us

Welcome to our premium watch collection, where luxury and style meet functionality and precision. Our selection of timepieces embodies the very best in Swiss craftsmanship and engineering, ensuring that you'll always have a reliable and stylish accessory on your wrist.

At our premium watch collection, we believe that a watch is more than just a timekeeping device - it's a statement piece that reflects your personality and style. So why settle for anything less than the best? Browse our collection today and discover the perfect watch for you.

Catalog

New Watches

Green And Bronze—The
Match Made In Heaven

  • Rectangle 9
  • Rectangle 8

Sale

  • sale-watch-preview1
  • sale-watch-preview2
  • sale-watch-preview3
  • sale-watch-preview4
watch preview

Greenlane Watch By Police For MenHT

Product tag: PEWJK2227003

€700€1000

Description

Richly detailed with an understated design - the Police Men’s Greenlane watch features a versatile multifunction design that fits effortlessly into work and play. The steel case is adorned with a semi-transparent black dial. The timepiece exhibits a contrast through a black IP bracelet with matching crown and pushers.

DETAILS & FEATURES

Gender: man
Size: 46x54.5mm
Case Colour: Steel
Band Material: Metal
Case Material: Metal
Features: Multifunction
Water Resistant: 5 (ATM)
Band Colour: Steel

\ No newline at end of file +The Watch Spot

Welcome to our collection of premium watches

Our watches are not just timepieces, but also an expression of your personality and lifestyle. From classic designs to modern ones, we have a watch to suit every taste and occasion.

Our watches are not just timepieces, but also an expression of your personality and lifestyle. From classic designs to modern ones, we have a watch to suit every taste and occasion.

About us

Welcome to our premium watch collection, where luxury and style meet functionality and precision. Our selection of timepieces embodies the very best in Swiss craftsmanship and engineering, ensuring that you'll always have a reliable and stylish accessory on your wrist.

At our premium watch collection, we believe that a watch is more than just a timekeeping device - it's a statement piece that reflects your personality and style. So why settle for anything less than the best? Browse our collection today and discover the perfect watch for you.

Catalog

New Watches

Green And Bronze—The
Match Made In Heaven

  • Rectangle 9
  • Rectangle 8

Sale

  • sale-watch-preview1
  • sale-watch-preview2
  • sale-watch-preview3
  • sale-watch-preview4
watch preview watch preview watch preview watch preview

Greenlane Watch By Police For MenHT

Product tag: PEWJK2227003

€700€1000

Description

Richly detailed with an understated design - the Police Men’s Greenlane watch features a versatile multifunction design that fits effortlessly into work and play. The steel case is adorned with a semi-transparent black dial. The timepiece exhibits a contrast through a black IP bracelet with matching crown and pushers.

DETAILS & FEATUREStion

Gender: man
Size: 46x54.5mm
Case Colour: Steel
Band Material: Metal
Case Material: Metal
Features: Multifunction
Water Resistant: 5 (ATM)
Band Colour: Steel

\ No newline at end of file diff --git a/sale-watch2x2.255b2fe5.png b/sale-watch2x2.255b2fe5.png new file mode 100644 index 0000000..7ad2112 Binary files /dev/null and b/sale-watch2x2.255b2fe5.png differ diff --git a/sale-watch2x2.eed49ada.png b/sale-watch2x2.eed49ada.png deleted file mode 100644 index e9cbcd3..0000000 Binary files a/sale-watch2x2.eed49ada.png and /dev/null differ diff --git a/sale-watch2x4.e411a8c3.png b/sale-watch2x4.e411a8c3.png new file mode 100644 index 0000000..854b858 Binary files /dev/null and b/sale-watch2x4.e411a8c3.png differ diff --git a/sale-watch3x4.e62ad113.png b/sale-watch3x4.e62ad113.png new file mode 100644 index 0000000..331a339 Binary files /dev/null and b/sale-watch3x4.e62ad113.png differ diff --git a/sale-watch4x2.a0da76bc.png b/sale-watch4x2.a0da76bc.png new file mode 100644 index 0000000..13a0e7e Binary files /dev/null and b/sale-watch4x2.a0da76bc.png differ diff --git a/sale-watch4x2.d3481694.png b/sale-watch4x2.d3481694.png deleted file mode 100644 index 6f69e82..0000000 Binary files a/sale-watch4x2.d3481694.png and /dev/null differ diff --git a/sale-watch4x4.64615b19.png b/sale-watch4x4.64615b19.png new file mode 100644 index 0000000..4b2c5be Binary files /dev/null and b/sale-watch4x4.64615b19.png differ diff --git a/the-watch-logo.590ada2a.svg b/the-watch-logo.590ada2a.svg deleted file mode 100644 index 1ad0bc2..0000000 --- a/the-watch-logo.590ada2a.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file