@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@100;300;400;500;600&display=swap"); * { margin: 0; padding: 0; -webkit-box-sizing: border-box; box-sizing: border-box; outline: none; border: none; text-decoration: none; text-transform: capitalize; -webkit-transition: 0.2s linear; transition: 0.2s linear; } html { font-size: 62.5%; overflow-x: hidden; scroll-behavior: smooth; font-family: "Poppins", sans-serif; } .heading-ew { background: url(./img/Couple_Bands.jpg) no-repeat; background-size: cover; background-position: top; text-align: right; padding-top: 10rem; padding-bottom: 3rem; } .heading-ew h1 { color: #fff; font-size: 4rem; margin-right: 10%; padding-top: 5rem; } .heading-watch { background: url(./img/banner-watch.png) no-repeat; background-size: cover; background-position: top; text-align: right; padding-top: 13rem; padding-bottom: 5rem; } .heading-watch h1 { color: #fff; font-size: 4rem; margin-right: 10%; padding-top: 5rem; } .heading-gift { background: url(./img/gift-banner.jpg) no-repeat; background-size: cover; background-position: top; text-align: center; padding-top: 13rem; padding-bottom: 5rem; } .heading-gift h1 { color: #fff; font-size: 4rem; padding-top: 5rem; } .heading { background: url(./img/banner-aj.jpg) no-repeat; background-size: cover; background-position: top; text-align: right; padding-top: 15rem; padding-bottom: 5rem; } .heading h1 { color: #fff; font-size: 4rem; margin-right: 17%; } .heading-mens { background: url(./img/mens-banner.jpg) no-repeat; background-size: cover; background-position: top; text-align: right; padding-top: 15rem; padding-bottom: 7rem; } .heading-mens h1 { color: #fff; font-size: 4rem; margin-right: 15%; padding-top: 5rem; } .heading-b { background: url(./img/best-banner.jpg) no-repeat; background-size: cover; background-position: top; text-align: center; padding-top: 19rem; padding-bottom: 7rem; } .heading-b h1 { color: #fff; font-size: 4rem; word-spacing: 2rem; } .title { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; font-size: 2.5rem; margin-bottom: 3rem; padding: 1.2rem 0; border-bottom: 0.1rem solid rgba(0, 0, 0, 0.1); margin-top: 1rem; margin-left: 2rem; margin-right: 2rem; font-family: "Roboto", sans-serif; } .title span { padding-left: 1rem; } .title a { margin-left: auto; color: #666; font-size: 1.5rem; margin-right: 2rem; } .title a:hover { color: #07097c; } .btn { margin-top: 1rem; display: inline-block; padding: 0.8rem 3rem; background: #07097c; color: #fff; font-size: 1.7rem; cursor: pointer; } .btn:hover { background: #222222; } .header { position: fixed; top: 0; left: 0; right: 0; z-index: 1000; background: #fff; background-color: white; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; padding: 10px 50px 0px 10px; } .header .navbar { margin-left: 0px; } .header .navbar a { font-size: 1.7rem; color: #666; margin: 0 1rem; } .header .navbar a:hover { color: #07097c; } .header .icons div { font-size: 2rem; margin-left: 1.7rem; cursor: pointer; color: #666; } .header .icons div:hover { color: #07097c; } .header .search-form { position: absolute; top: -130%; right: 2rem; width: 30rem; border-radius: 0.5rem; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; height: 3.5rem; -webkit-box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.1); box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.1); background: #fff; border-style: solid; border-color: white; } .header .search-form.active { top: 115%; } .header .search-form input { height: 100%; width: 100%; padding: 0 1.2rem; font-size: 1.6rem; color: #222222; text-transform: none; } .header .search-form label { font-size: 2rem; margin-right: 1.7rem; cursor: pointer; color: #666; } .header .search-form label:hover { color: #07097c; } .header .shopping-cart { position: absolute; top: 115%; right: -105%; background: #fff; border-radius: 0.5rem; -webkit-box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.1); box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.1); width: 35rem; padding: 2rem; } .header .shopping-cart.active { right: 2rem; -webkit-transition: 0.4s linear; transition: 0.4s linear; } .header .shopping-cart .box { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 1.5rem; margin-bottom: 1.5rem; position: relative; } .header .shopping-cart .box .ring { width: 30%; height: 30%; } .header .shopping-cart .box .fa-times { position: absolute; top: 50%; right: 2rem; -webkit-transform: translateY(-50%); transform: translateY(-50%); font-size: 2rem; color: #666; cursor: pointer; } .header .shopping-cart .box .fa-times:hover { color: #07097c; } .header .shopping-cart .box img { height: 9rem; } .header .shopping-cart .box .content h3 { font-size: 1.7rem; padding-bottom: 0.5rem; color: #222222; } .header .shopping-cart .box .content span { font-size: 1.5rem; color: #666; } .header .shopping-cart .box .content span.multiply { margin: 0 0.5rem; } .header .shopping-cart .total { color: #666; text-align: center; font-size: 2rem; } .header .shopping-cart .total span { color: #222222; } .header .shopping-cart .btn { text-align: center; width: 100%; } .header .login-form { position: absolute; top: 115%; right: -105%; background: #fff; border-radius: 0.5rem; -webkit-box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.1); box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.1); width: 35rem; padding: 2rem; } .header .login-form.active { right: 2rem; -webkit-transition: 0.4s linear; transition: 0.4s linear; } .header .login-form h3 { color: #222222; text-transform: uppercase; font-size: 2.2rem; text-align: center; margin-bottom: 0.7rem; } .header .login-form .box { margin: 0.7rem 0; border: 0.1rem solid rgba(0, 0, 0, 0.1); padding: 1rem 1.2rem; font-size: 1.5rem; color: #222222; text-transform: none; width: 100%; } .header .login-form .remember { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 0.5rem; margin: 0.7rem 0; } .header .login-form .remember label { font-size: 1.5rem; color: #666; cursor: pointer; } .header .login-form .btn { margin: 1rem 0; width: 100%; text-align: center; } .header .login-form p { color: #666; padding-top: 0.7rem; font-size: 1.4rem; } .header .login-form p a { color: #07097c; } .header .login-form p a:hover { text-decoration: underline; } #menu-btn, #arrow, #arrow1, #arrow2, #arrow3, #arrow4, #arrowleft, #arrowleft1, #arrowleft2, #arrowleft3, #arrowleft4 { display: none; } .mhead div.logo { padding-top: 26px; padding-bottom: 20px; color: black; font-size: 4rem; font-weight: bolder; color: #222222; position: fixed; top: 0; left: 0; right: 0; height: 123px; background: #fff; -webkit-box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.1); box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.1); -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; font-family: "Cinzel", serif; z-index: 100; } .mhead div.logo a { padding-left: 40%; color: #222222; padding-bottom: 0%; } .mhead div.logo div.browse { font-size: 1.6rem; background-color: white; position: relative; padding-top: 1%; } .mhead div.logo div.browse a { -ms-grid-column-align: center; justify-self: center; padding: 8px 40px 8px 40px; } .mhead div.logo div.browse a i { display: none; } .mhead div.logo div.browse .anchort { display: none; } .mhead div.logo div.browse .anchort .anchor { position: static; padding: 0.2 5.5rem; top: 0%; } .mhead div.logo div.browse .anchort .anchor span { font-size: 1.2rem; font-family: "poppins", sans-serif; } .mhead div.logo div.browse .browse-aj { display: inline-block; } .mhead div.logo div.browse .browse-aj .dropdown, .mhead div.logo div.browse .browse-aj .dropdowne, .mhead div.logo div.browse .browse-aj .dropdownw, .mhead div.logo div.browse .browse-aj .dropdowng, .mhead div.logo div.browse .browse-aj .dropdownm { display: none; position: absolute; background-color: #fff; width: 100%; left: 0px; padding: 2rem; z-index: 1; -ms-flex-pack: distribute; justify-content: space-around; } .mhead div.logo div.browse .browse-aj .dropdown .box a, .mhead div.logo div.browse .browse-aj .dropdowne .box a, .mhead div.logo div.browse .browse-aj .dropdownw .box a, .mhead div.logo div.browse .browse-aj .dropdowng .box a, .mhead div.logo div.browse .browse-aj .dropdownm .box a { font-family: "poppins", sans-serif; font-weight: 300; font-stretch: ultra-expanded; font-size: 1.4rem; } .mhead div.logo div.browse .browse-aj .dropdown .box a.catogary, .mhead div.logo div.browse .browse-aj .dropdowne .box a.catogary, .mhead div.logo div.browse .browse-aj .dropdownw .box a.catogary, .mhead div.logo div.browse .browse-aj .dropdowng .box a.catogary, .mhead div.logo div.browse .browse-aj .dropdownm .box a.catogary { font-weight: 500; } .mhead div.logo div.browse .browse-aj .dropdown .box .ring-black, .mhead div.logo div.browse .browse-aj .dropdowne .box .ring-black, .mhead div.logo div.browse .browse-aj .dropdownw .box .ring-black, .mhead div.logo div.browse .browse-aj .dropdowng .box .ring-black, .mhead div.logo div.browse .browse-aj .dropdownm .box .ring-black { margin-right: 2rem; margin-top: 1rem; } .mhead div.logo div.browse .browse-aj .dropdown:hover, .mhead div.logo div.browse .browse-aj .dropdowne:hover, .mhead div.logo div.browse .browse-aj .dropdownw:hover, .mhead div.logo div.browse .browse-aj .dropdowng:hover, .mhead div.logo div.browse .browse-aj .dropdownm:hover { color: black; } .mhead div.logo div.browse .browse-aj:hover .dropdown { display: -webkit-box; display: -ms-flexbox; display: flex; } .mhead div.logo div.browse .browse-aj:hover .dropdowne { display: -webkit-box; display: -ms-flexbox; display: flex; } .mhead div.logo div.browse .browse-aj:hover .dropdownw { display: -webkit-box; display: -ms-flexbox; display: flex; } .mhead div.logo div.browse .browse-aj:hover .dropdowng { display: -webkit-box; display: -ms-flexbox; display: flex; } .mhead div.logo div.browse .browse-aj:hover .dropdownm { display: -webkit-box; display: -ms-flexbox; display: flex; } section.banner { margin-top: 10rem; } section.banner .content { background-color: white; margin-top: -30rem; padding-bottom: 19rem; padding-left: 7rem; color: #fff; z-index: 1000; } section.banner .content .p { font-size: 4rem; } section.banner .btn { margin-top: -0.7%; } .subtitle { color: #222222; font-size: 4rem; font-family: "Poppins", sans-serif; -ms-grid-column-align: center; justify-self: center; text-underline-position: auto; margin-left: 35.7%; } .banner-container { display: -ms-grid; display: grid; -ms-grid-columns: (minmax(32rem, 1fr))[auto-fit]; grid-template-columns: repeat(auto-fit, minmax(32rem, 1fr)); gap: 1rem; margin-bottom: -9rem; padding-left: 2rem; padding-right: 2rem; } .banner-container .banner { position: relative; margin: 1rem; height: 45rem; overflow: hidden; } .banner-container .banner:hover img { -webkit-transform: scale(1.2); transform: scale(1.2); } .banner-container .banner img { height: 100%; width: 100%; -o-object-fit: cover; object-fit: cover; } .banner-container .banner .content { position: absolute; -webkit-transform: translateY(-400%); transform: translateY(-400%); -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -ms-grid-column-align: center; justify-self: center; padding: 2rem; -webkit-box-align: center; -ms-flex-align: center; align-items: center; margin-left: 6rem; /*.chaumet { margin-left: -3rem; color: white; }*/ } .banner-container .banner .content .her { color: white; padding-left: 70%; } .banner-container .banner .content .esteque { margin-left: 0.7rem; color: white; } .banner-container .banner .content span { color: #fff; font-size: 4rem; font-family: "Poppins", sans-serif; } .banner-container .banner .content h { font-size: 2rem; padding-top: 0.5rem; color: #222222; } .banner-container .banner .content .btn { position: absolute; padding: 0.8rem 2.5rem; margin-left: 3rem; } section.bannerr { -ms-flex-pack: distribute; justify-content: space-around; margin-top: 10rem; } section.bannerr .image { min-height: -webkit-max-content; min-height: -moz-max-content; min-height: max-content; } section.bannerr .content { background-color: white; margin-top: -30rem; padding-bottom: 19rem; padding-left: 7rem; color: #fff; z-index: 1000; } section.bannerr .content .p { font-size: 4rem; } section.bannerr .btn { margin-top: -0.7%; } .footer { position: static; background: #f3f3f3; padding: 4rem 9rem; -ms-flex-pack: distribute; justify-content: space-around; padding-right: 15%; -ms-grid-column-align: start; justify-self: start; } .footer .box-container { display: -ms-grid; display: grid; -ms-grid-columns: (minmax(17rem, 1fr))[auto-fit]; grid-template-columns: repeat(auto-fit, minmax(17rem, 1fr)); gap: 1rem; } .footer .box-container .box h3 { font-size: 2rem; color: #222222; padding: 1rem 0; } .footer .box-container .box p { font-size: 1.5rem; color: #666; padding-bottom: 0.5rem; } .footer .box-container .box a { font-size: 1.4rem; color: #666; padding: 1rem 0; display: block; } .footer .box-container .box a:hover { color: #07097c; } .footer .box-container .box a:hover i { padding-right: 2rem; } .footer .box-container .box a i { padding-right: 0.5rem; color: #07097c; } .footer .box-container .box form input[type="email"] { width: 100%; padding: 1rem 1.2rem; font-size: 1.6rem; color: #222222; margin: 1rem 0; text-transform: none; } .footer .box-container .box .payment { width: 100%; margin-top: 2rem; } .credit { text-align: center; background: #07097c; color: #fff; font-size: 1.5rem; padding: 2rem; } .models { margin-left: 4rem; font-size: 1.7rem; } .products .box-container { display: -ms-grid; display: grid; -ms-grid-columns: (minmax(25rem, 1fr))[auto-fit]; grid-template-columns: repeat(auto-fit, minmax(25rem, 1fr)); gap: 2.5rem; padding: 2rem 3.5rem; } .products .box-container .box { position: relative; background: #e2e2e2; overflow: hidden; } .products .box-container .box:hover .icons { top: 0; } .products .box-container .box .icons { text-align: center; position: absolute; top: -105%; left: 0; height: 25rem; width: 100%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; background: rgba(243, 243, 243, 0.8); gap: 1rem; } .products .box-container .box .icons a { font-size: 2rem; height: 5rem; width: 5rem; line-height: 5rem; background: #fff; -webkit-box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.1); box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.1); color: #666; } .products .box-container .box .icons a:hover { background: #07097c; color: #fff; } .products .box-container .box .image { height: 25rem; width: 100%; overflow: hidden; } .products .box-container .box .image img { height: 100%; width: 100%; -o-object-fit: cover; object-fit: cover; } .products .box-container .box .content { padding: 1.5rem; } .products .box-container .box .content h3 { font-size: 1.8rem; color: #222222; font-family: "Roboto", sans-serif; margin-bottom: 0.3rem; font-weight: bold; } .products .box-container .box .content h3:hover { color: #07097c; } .products .box-container .box .content .lorem { font-size: 1.1rem; } .products .box-container .box .content .price { font-size: 1.5rem; color: #222222; padding: 0rem 0; } .about { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 2rem; } .about .image { margin: 2rem; } .about .content span { color: #07097c; font-size: 2.5rem; } .about .content h3 { color: #222222; font-size: 3rem; padding-top: 0.5rem; } .about .content .parah p { color: #666; font-size: 1.4rem; line-height: 2; padding: 1rem 1rem; } .about .content .btn { margin-left: 1rem; } .info-container { display: -ms-grid; display: grid; -ms-grid-columns: (minmax(30rem, 1fr))[auto-fit]; grid-template-columns: repeat(auto-fit, minmax(30rem, 1fr)); gap: 1rem; margin: 4rem; -webkit-column-gap: 10px; column-gap: 10px; } .info-container .info { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 1.5rem; padding: 2rem 0; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; background: #f3f3f3; border-radius: 1rem; } .info-container .info img { height: 7rem; } .info-container .info .content h3 { font-size: 2rem; color: #222222; padding-bottom: 0.5rem; } .info-container .info .content span { font-size: 1.5rem; color: #666; } .review { display: -ms-grid; display: grid; -ms-grid-columns: (minmax(30rem, 1fr))[auto-fit]; grid-template-columns: repeat(auto-fit, minmax(30rem, 1fr)); gap: 1rem; margin: 8rem; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; gap: -0rem; } .review .box { padding: 2rem; border: 0.1rem solid rgba(0, 0, 0, 0.1); margin: 0.6rem; } .review .box .user { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 1.5rem; margin-bottom: 1.5rem; } .review .box .user img { height: 7rem; width: 7rem; border-radius: 50%; } .review .box .user h3 { font-size: 2.2rem; color: #222222; } .review .box .user span { font-size: 1.4rem; color: #07097c; } .review .box p { font-size: 1.4rem; color: #666; line-height: 2; } .contact .icons-container { display: -ms-grid; display: grid; -ms-grid-columns: (minmax(29rem, 1fr))[auto-fit]; grid-template-columns: repeat(auto-fit, minmax(29rem, 1fr)); gap: 1rem; margin: 2rem; } .contact .icons-container .icons { text-align: center; border: 0.1rem solid rgba(0, 0, 0, 0.1); padding: 2rem; } .contact .icons-container .icons i { height: 6rem; width: 6rem; line-height: 6rem; font-size: 2.5rem; background: #07097c; color: #fff; border-radius: 50%; } .contact .icons-container .icons h3 { color: #222222; font-size: 2rem; padding: 1rem 0; } .contact .icons-container .icons p { color: #666; font-size: 1.5rem; line-height: 2; } .contact .row { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; gap: 1.5rem; margin: 2rem; } .contact .row form { padding: 2rem; border: 0.1rem solid rgba(0, 0, 0, 0.1); -webkit-box-flex: 1; -ms-flex: 1 1 40rem; flex: 1 1 40rem; height: 45rem; } .contact .row form h3 { font-size: 2.5rem; padding-bottom: 1rem; color: #222222; } .contact .row form .inputBox { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -ms-flex-wrap: wrap; flex-wrap: wrap; } .contact .row form .inputBox input { width: 49%; } .contact .row form .inputBox .box, .contact .row form textarea { padding: 1rem 1.2rem; font-size: 1.6rem; border: 0.1rem solid rgba(0, 0, 0, 0.1); color: #222222; text-transform: none; margin: 0.7rem 0; } .contact .row form textarea { width: 100%; height: 17rem; resize: none; margin-bottom: 4.5rem; } .contact .row form .btn { position: inherit; -ms-flex-item-align: end; align-self: flex-end; margin-left: -100%; margin-bottom: -10rem; padding: 1.5rem 5rem; } .contact .row .map { -webkit-box-flex: 1; -ms-flex: 1 1 40rem; flex: 1 1 40rem; width: 100%; } @media (max-width: 1260px) { .mhead .logo .browse .browse-aj a { bottom: -2rem; padding: 5px 37px 5px 37px; } } @media (max-width: 1012px) { html { font-size: 55%; } section { padding: 3rem 2rem; } .header { padding: 0.3rem; right: 2rem; } .logo { padding: 0.7rem; bottom: 0rem; } } @media (max-width: 605px) { #menu-btn, #arrow, #arrow1, #arrow2, #arrow3, #arrow4, #arrowleft, #arrowleft1, #arrowleft2, #arrowleft3, #arrowleft4 { display: inline-block; } #arrowleft, #arrowleft1, #arrowleft2, #arrowleft3, #arrowleft4 { margin-right: 1rem !important; top: 5rem; z-index: 20000000 !important; } .header { background-color: transparent; padding-top: 1.5rem; /*.navbar { position: relative; left: 55%; top: 4.6rem; background: $white; border-top: $border; border-bottom: $border; clip-path: polygon(0 0, 100% 0, 100% 0, 0 0); &.active { clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%); } a { position: relative; margin: 0.8rem; padding: 1.3rem; background: $light-bg; font-size: 1.7rem; display: block; border-radius: 0.5rem; } }*/ } .header .navbar a { color: transparent; display: none; } .header .search-form { position: absolute; top: -130%; right: 7rem; } .header .search-form.active { top: 145%; } .header .shopping-cart { position: absolute; top: 145%; right: -99%; } .header .shopping-cart.active { right: -1%; -webkit-transition: 0.2s linear; transition: 0.2s linear; } .header .login-form { position: absolute; top: 145%; } .header .login-form.active { right: -1%; -webkit-transition: 0.2s linear; transition: 0.2s linear; } .mhead div.logo { padding-top: 9px; color: black; font-size: 3rem; color: #222222; height: 50px; -webkit-box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.1); box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.1); font-family: "Cinzel", serif; } .mhead div.logo a { padding: 1rem 1rem; top: -3rem !important; z-index: -10000; } .mhead div.logo .browse { margin-left: -1rem; margin-right: -1rem; background: #fff; border-bottom: 0.1rem solid rgba(0, 0, 0, 0.1); -webkit-clip-path: polygon(0 0, 0 0, 0 100%, 0 100%); clip-path: polygon(0 0, 0 0, 0 100%, 0 100%); } .mhead div.logo .browse.active { -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%); clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%); } .mhead div.logo .browse .anchort { display: block !important; margin-left: 2rem; } .mhead div.logo .browse .anchort .anchor { padding: 0.2 7rem; top: 0%; } .mhead div.logo .browse .anchort .anchor span { font-size: 1.2rem; font-family: "poppins", sans-serif; } .mhead div.logo .browse .browse-aj { padding: 0.7rem; } .mhead div.logo .browse .browse-aj .a { margin-left: 25.7rem; } .mhead div.logo .browse .browse-aj .b { margin-left: 14.3rem; } .mhead div.logo .browse .browse-aj .c { margin-left: 31.5rem; } .mhead div.logo .browse .browse-aj .d { margin-left: 35.6rem; } .mhead div.logo .browse .browse-aj .e { margin-left: 22.5rem; } .mhead div.logo .browse .browse-aj a { margin: 1.5rem; padding: 1.5rem; font-size: 2rem; border-radius: 0.5rem; } .mhead div.logo .browse .browse-aj i.a, .mhead div.logo .browse .browse-aj .b, .mhead div.logo .browse .browse-aj .c, .mhead div.logo .browse .browse-aj .d, .mhead div.logo .browse .browse-aj .e, .mhead div.logo .browse .browse-aj .g { padding: 2rem; margin-right: auto; padding-bottom: 2rem; } .mhead div.logo .browse .browse-aj i.a:hover, .mhead div.logo .browse .browse-aj .b:hover, .mhead div.logo .browse .browse-aj .c:hover, .mhead div.logo .browse .browse-aj .d:hover, .mhead div.logo .browse .browse-aj .e:hover, .mhead div.logo .browse .browse-aj .g:hover { cursor: pointer; } .mhead div.logo .browse .browse-aj .dropdown, .mhead div.logo .browse .browse-aj .dropdowne, .mhead div.logo .browse .browse-aj .dropdownw, .mhead div.logo .browse .browse-aj .dropdowng, .mhead div.logo .browse .browse-aj .dropdownm { bottom: -5.5% !important; -webkit-clip-path: polygon(0 0, 0 0, 0 200%, 0 200%); clip-path: polygon(0 0, 0 0, 0 200%, 0 200%); } .mhead div.logo .browse .browse-aj .dropdown.active, .mhead div.logo .browse .browse-aj .dropdowne.active, .mhead div.logo .browse .browse-aj .dropdownw.active, .mhead div.logo .browse .browse-aj .dropdowng.active, .mhead div.logo .browse .browse-aj .dropdownm.active { -webkit-clip-path: polygon(0 0, 200% 0, 200% 200%, 0% 200%); clip-path: polygon(0 0, 200% 0, 200% 200%, 0% 200%); } .mhead div.logo .browse .browse-aj .dropdown .box .f, .mhead div.logo .browse .browse-aj .dropdowne .box .f, .mhead div.logo .browse .browse-aj .dropdownw .box .f, .mhead div.logo .browse .browse-aj .dropdowng .box .f, .mhead div.logo .browse .browse-aj .dropdownm .box .f { padding: 1rem; margin-left: 0.2rem !important; position: fixed; -ms-grid-columns: none; grid-template-columns: none; } .mhead div.logo .browse .browse-aj .dropdown .box .f:hover, .mhead div.logo .browse .browse-aj .dropdowne .box .f:hover, .mhead div.logo .browse .browse-aj .dropdownw .box .f:hover, .mhead div.logo .browse .browse-aj .dropdowng .box .f:hover, .mhead div.logo .browse .browse-aj .dropdownm .box .f:hover { cursor: pointer; } .mhead div.logo .browse .browse-aj .dropdown .box #arrowleft4, .mhead div.logo .browse .browse-aj .dropdowne .box #arrowleft4, .mhead div.logo .browse .browse-aj .dropdownw .box #arrowleft4, .mhead div.logo .browse .browse-aj .dropdowng .box #arrowleft4, .mhead div.logo .browse .browse-aj .dropdownm .box #arrowleft4 { left: 0.9rem !important; } .mhead div.logo .browse .browse-aj .dropdown .box .ring-black, .mhead div.logo .browse .browse-aj .dropdowne .box .ring-black, .mhead div.logo .browse .browse-aj .dropdownw .box .ring-black, .mhead div.logo .browse .browse-aj .dropdowng .box .ring-black, .mhead div.logo .browse .browse-aj .dropdownm .box .ring-black { display: none; } .mhead div.logo .browse .browse-aj .dropdown .box .aj-accesories, .mhead div.logo .browse .browse-aj .dropdown .box .catogary, .mhead div.logo .browse .browse-aj .dropdowne .box .aj-accesories, .mhead div.logo .browse .browse-aj .dropdowne .box .catogary, .mhead div.logo .browse .browse-aj .dropdownw .box .aj-accesories, .mhead div.logo .browse .browse-aj .dropdownw .box .catogary, .mhead div.logo .browse .browse-aj .dropdowng .box .aj-accesories, .mhead div.logo .browse .browse-aj .dropdowng .box .catogary, .mhead div.logo .browse .browse-aj .dropdownm .box .aj-accesories, .mhead div.logo .browse .browse-aj .dropdownm .box .catogary { padding: 0.2rem; margin: 0rem; margin-right: 0.54rem; } .mhead div.logo .browse .browse-aj .dropdown .box a, .mhead div.logo .browse .browse-aj .dropdowne .box a, .mhead div.logo .browse .browse-aj .dropdownw .box a, .mhead div.logo .browse .browse-aj .dropdowng .box a, .mhead div.logo .browse .browse-aj .dropdownm .box a { font-size: 1.2rem; } .mhead div.logo .browse .browse-aj .dropdown { top: 0%; } .mhead div.logo .browse .browse-aj .dropdown a { font-size: 1.1rem !important; } .mhead div.logo .browse .browse-aj .dropdowne { top: -2%; } .mhead div.logo .browse .browse-aj .dropdownw { top: 2%; } .mhead div.logo .browse .browse-aj .dropdowng { top: -2%; margin-left: -3rem; } .mhead div.logo .browse .browse-aj .dropdownm { display: -ms-grid; display: grid; -ms-grid-columns: (minmax(5rem, 1fr))[auto-fit]; grid-template-columns: repeat(auto-fit, minmax(5rem, 1fr)); gap: 1rem; top: -2%; margin-left: -3rem; } .mhead div.logo .browse .browse-aj:not(:hover) .dropdown, .mhead div.logo .browse .browse-aj .dropdowne, .mhead div.logo .browse .browse-aj .dropdownw, .mhead div.logo .browse .browse-aj .dropdowng, .mhead div.logo .browse .browse-aj .dropdownm { display: -webkit-box !important; display: -ms-flexbox !important; display: flex !important; } section.banner { background-image: url("./img/banner-1phone.png"); background-repeat: no-repeat; margin-top: 50px; margin-bottom: -40px; } section.banner img { display: none; } section.banner .content { background-color: transparent; margin-top: 0rem; padding-bottom: 45rem; padding-left: 10rem; z-index: 1000; } section.banner .content .p { font-size: 3.5rem; } section.banner .btn { margin-top: -0.7%; margin-left: 40px; } .subtitle { color: #222222; font-size: 3rem; font-family: "Poppins", sans-serif; margin-left: 25%; margin-bottom: -4rem; } .banner-container { display: -ms-grid; display: grid; -ms-grid-columns: (minmax(32rem, 1fr))[auto-fit]; grid-template-columns: repeat(auto-fit, minmax(32rem, 1fr)); gap: 1rem; margin-bottom: -9rem; padding-left: 2rem; padding-right: 2rem; } .banner-container .banner { position: relative; margin: 2rem; height: 49rem; overflow: hidden; } .banner-container .banner:hover img { -webkit-transform: scale(1.2); transform: scale(1.2); } .banner-container .banner img { height: 100%; width: 100%; -o-object-fit: cover; object-fit: cover; } .banner-container .banner .content { position: absolute; -webkit-transform: translateY(-180%); transform: translateY(-180%); -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; margin-left: 1rem !important; padding: 2rem; /*.chaumet { margin-left: -3rem; color: white; } .her { margin-left: 2.5rem; color: white; } .esteque { margin-left: -2.2rem; color: white; }*/ } .banner-container .banner .content h { font-size: 2rem; padding-top: 0.5rem; color: #222222; } .banner-container .banner .content .btn { padding: 0.8rem 2.5rem; } section.bannerr { -ms-flex-pack: distribute; justify-content: space-around; margin-top: 10rem; padding: 0px; } .footer .box-container { margin-left: -3rem !important; display: -ms-grid; display: grid; -ms-grid-columns: (minmax(15rem, 1fr))[auto-fit]; grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr)); gap: 1rem; } .footer .box-container .box { margin: 1rem; } .about { display: block; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 2rem; } .about .image { margin: 0.5rem; } .about .content span { color: #07097c; font-size: 2.5rem; } .about .content h3 { color: #222222; font-size: 3rem; padding-top: 0.5rem; } .about .content .parah p { color: #666; font-size: 1.4rem; line-height: 2; padding: 1rem 1rem; } .about .content .btn { margin-left: 1rem; } } /*# sourceMappingURL=style.css.map */