diff --git a/Icon-Phone-call-tablet.1d3cec15.svg b/Icon-Phone-call-tablet.1d3cec15.svg new file mode 100644 index 0000000000..b13bd91466 --- /dev/null +++ b/Icon-Phone-call-tablet.1d3cec15.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/Icon-Phone-call-tablet.37b8d2be.svg b/Icon-Phone-call-tablet.37b8d2be.svg new file mode 100644 index 0000000000..8e949fcb56 --- /dev/null +++ b/Icon-Phone-call-tablet.37b8d2be.svg @@ -0,0 +1,10 @@ + + + + + + + + + + diff --git a/Logo-tablet.397e04bf.svg b/Logo-tablet.397e04bf.svg new file mode 100644 index 0000000000..107dd3ae38 --- /dev/null +++ b/Logo-tablet.397e04bf.svg @@ -0,0 +1,9 @@ + + + + + + + + + diff --git a/Logo-tablet.ad306897.svg b/Logo-tablet.ad306897.svg new file mode 100644 index 0000000000..71d76701a3 --- /dev/null +++ b/Logo-tablet.ad306897.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/Logo.15c6c68f.svg b/Logo.15c6c68f.svg new file mode 100644 index 0000000000..257e7aa1ac --- /dev/null +++ b/Logo.15c6c68f.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/Logo.96fe08a9.svg b/Logo.96fe08a9.svg new file mode 100644 index 0000000000..3c25d43b64 --- /dev/null +++ b/Logo.96fe08a9.svg @@ -0,0 +1,9 @@ + + + + + + + + + diff --git a/about-us-laptop.15af8c09.jpg b/about-us-laptop.15af8c09.jpg new file mode 100644 index 0000000000..73cccfe67e Binary files /dev/null and b/about-us-laptop.15af8c09.jpg differ diff --git a/about-us-laptop.cbb9b17c.jpg b/about-us-laptop.cbb9b17c.jpg new file mode 100644 index 0000000000..72ef041395 Binary files /dev/null and b/about-us-laptop.cbb9b17c.jpg differ diff --git a/about-us-tablet.b1f20c19.jpg b/about-us-tablet.b1f20c19.jpg new file mode 100644 index 0000000000..f72f3462c4 Binary files /dev/null and b/about-us-tablet.b1f20c19.jpg differ diff --git a/about-us-tablet.dd0875d5.jpg b/about-us-tablet.dd0875d5.jpg new file mode 100644 index 0000000000..8d9af882fd Binary files /dev/null and b/about-us-tablet.dd0875d5.jpg differ diff --git a/about-us.47089261.jpg b/about-us.47089261.jpg new file mode 100644 index 0000000000..781e0728aa Binary files /dev/null and b/about-us.47089261.jpg differ diff --git a/about-us.4d9b1c90.jpg b/about-us.4d9b1c90.jpg new file mode 100644 index 0000000000..e526d73cab Binary files /dev/null and b/about-us.4d9b1c90.jpg differ diff --git a/b-a5-laptop.78417735.jpg b/b-a5-laptop.78417735.jpg new file mode 100644 index 0000000000..1d2dff3421 Binary files /dev/null and b/b-a5-laptop.78417735.jpg differ diff --git a/b-a5-laptop.e49bc515.jpg b/b-a5-laptop.e49bc515.jpg new file mode 100644 index 0000000000..675ed9d210 Binary files /dev/null and b/b-a5-laptop.e49bc515.jpg differ diff --git a/b-a5-tablet.1200cac4.jpg b/b-a5-tablet.1200cac4.jpg new file mode 100644 index 0000000000..707a4cd8f4 Binary files /dev/null and b/b-a5-tablet.1200cac4.jpg differ diff --git a/b-a5-tablet.407c03c8.jpg b/b-a5-tablet.407c03c8.jpg new file mode 100644 index 0000000000..935c680466 Binary files /dev/null and b/b-a5-tablet.407c03c8.jpg differ diff --git a/b-a5.03c343da.jpg b/b-a5.03c343da.jpg new file mode 100644 index 0000000000..81ce5c8881 Binary files /dev/null and b/b-a5.03c343da.jpg differ diff --git a/b-a5.e86469c1.jpg b/b-a5.e86469c1.jpg new file mode 100644 index 0000000000..f613406272 Binary files /dev/null and b/b-a5.e86469c1.jpg differ diff --git a/b-theatre-laptop.56b8c57c.jpg b/b-theatre-laptop.56b8c57c.jpg new file mode 100644 index 0000000000..48ca43ebef Binary files /dev/null and b/b-theatre-laptop.56b8c57c.jpg differ diff --git a/b-theatre-laptop.cb1ae6d8.jpg b/b-theatre-laptop.cb1ae6d8.jpg new file mode 100644 index 0000000000..d50540360b Binary files /dev/null and b/b-theatre-laptop.cb1ae6d8.jpg differ diff --git a/b-theatre-tablet.617385eb.jpg b/b-theatre-tablet.617385eb.jpg new file mode 100644 index 0000000000..763e402597 Binary files /dev/null and b/b-theatre-tablet.617385eb.jpg differ diff --git a/b-theatre-tablet.eabecebf.jpg b/b-theatre-tablet.eabecebf.jpg new file mode 100644 index 0000000000..3c7f13eab6 Binary files /dev/null and b/b-theatre-tablet.eabecebf.jpg differ diff --git a/b-theatre.7b8c9b6f.jpg b/b-theatre.7b8c9b6f.jpg new file mode 100644 index 0000000000..0085a53c89 Binary files /dev/null and b/b-theatre.7b8c9b6f.jpg differ diff --git a/b-theatre.9c2aa40c.jpg b/b-theatre.9c2aa40c.jpg new file mode 100644 index 0000000000..53bdf136ec Binary files /dev/null and b/b-theatre.9c2aa40c.jpg differ diff --git a/beoplay-laptop.003603f8.jpg b/beoplay-laptop.003603f8.jpg new file mode 100644 index 0000000000..0a4b04a473 Binary files /dev/null and b/beoplay-laptop.003603f8.jpg differ diff --git a/beoplay-laptop.30b14bf9.jpg b/beoplay-laptop.30b14bf9.jpg new file mode 100644 index 0000000000..19e76cb659 Binary files /dev/null and b/beoplay-laptop.30b14bf9.jpg differ diff --git a/beoplay-tablet.4cdfb6de.jpg b/beoplay-tablet.4cdfb6de.jpg new file mode 100644 index 0000000000..13c65739ce Binary files /dev/null and b/beoplay-tablet.4cdfb6de.jpg differ diff --git a/beoplay-tablet.7056c4ad.jpg b/beoplay-tablet.7056c4ad.jpg new file mode 100644 index 0000000000..4b67adb08b Binary files /dev/null and b/beoplay-tablet.7056c4ad.jpg differ diff --git a/beoplay.8250a178.jpg b/beoplay.8250a178.jpg new file mode 100644 index 0000000000..1721c4cfbf Binary files /dev/null and b/beoplay.8250a178.jpg differ diff --git a/beoplay.eaadb474.jpg b/beoplay.eaadb474.jpg new file mode 100644 index 0000000000..ce72c8ff59 Binary files /dev/null and b/beoplay.eaadb474.jpg differ diff --git a/box1-1-laptop.ae23a954.jpg b/box1-1-laptop.ae23a954.jpg new file mode 100644 index 0000000000..c33d1720b4 Binary files /dev/null and b/box1-1-laptop.ae23a954.jpg differ diff --git a/box1-1-laptop.ea65d3f2.jpg b/box1-1-laptop.ea65d3f2.jpg new file mode 100644 index 0000000000..647d90260b Binary files /dev/null and b/box1-1-laptop.ea65d3f2.jpg differ diff --git a/box1-1-tablet.133cba5b.jpg b/box1-1-tablet.133cba5b.jpg new file mode 100644 index 0000000000..ebb03dbbac Binary files /dev/null and b/box1-1-tablet.133cba5b.jpg differ diff --git a/box1-1-tablet.4d969cf9.jpg b/box1-1-tablet.4d969cf9.jpg new file mode 100644 index 0000000000..9baff3cecc Binary files /dev/null and b/box1-1-tablet.4d969cf9.jpg differ diff --git a/box1-1.007f356a.jpg b/box1-1.007f356a.jpg new file mode 100644 index 0000000000..1cfbad6075 Binary files /dev/null and b/box1-1.007f356a.jpg differ diff --git a/box1-1.e0968314.jpg b/box1-1.e0968314.jpg new file mode 100644 index 0000000000..8cec4599a1 Binary files /dev/null and b/box1-1.e0968314.jpg differ diff --git a/box1-2-laptop.0ca2cd9c.jpg b/box1-2-laptop.0ca2cd9c.jpg new file mode 100644 index 0000000000..47bce8fba7 Binary files /dev/null and b/box1-2-laptop.0ca2cd9c.jpg differ diff --git a/box1-2-laptop.935ea3f0.jpg b/box1-2-laptop.935ea3f0.jpg new file mode 100644 index 0000000000..b1d7968a29 Binary files /dev/null and b/box1-2-laptop.935ea3f0.jpg differ diff --git a/box1-2-tablet.8cd130a1.jpg b/box1-2-tablet.8cd130a1.jpg new file mode 100644 index 0000000000..db454c8b3a Binary files /dev/null and b/box1-2-tablet.8cd130a1.jpg differ diff --git a/box1-2-tablet.a49ba32b.jpg b/box1-2-tablet.a49ba32b.jpg new file mode 100644 index 0000000000..fbac2147a5 Binary files /dev/null and b/box1-2-tablet.a49ba32b.jpg differ diff --git a/box1-2.6246e1a2.jpg b/box1-2.6246e1a2.jpg new file mode 100644 index 0000000000..80328c9931 Binary files /dev/null and b/box1-2.6246e1a2.jpg differ diff --git a/box1-2.7947ed2e.jpg b/box1-2.7947ed2e.jpg new file mode 100644 index 0000000000..29714d0825 Binary files /dev/null and b/box1-2.7947ed2e.jpg differ diff --git a/box2-1-laptop.64c1adb7.jpg b/box2-1-laptop.64c1adb7.jpg new file mode 100644 index 0000000000..6d46c15102 Binary files /dev/null and b/box2-1-laptop.64c1adb7.jpg differ diff --git a/box2-1-laptop.f5e739f9.jpg b/box2-1-laptop.f5e739f9.jpg new file mode 100644 index 0000000000..34bee155b1 Binary files /dev/null and b/box2-1-laptop.f5e739f9.jpg differ diff --git a/box2-1-tablet.5e6ec1a9.jpg b/box2-1-tablet.5e6ec1a9.jpg new file mode 100644 index 0000000000..51a1224e1c Binary files /dev/null and b/box2-1-tablet.5e6ec1a9.jpg differ diff --git a/box2-1-tablet.a92ee1c5.jpg b/box2-1-tablet.a92ee1c5.jpg new file mode 100644 index 0000000000..1e8cc345be Binary files /dev/null and b/box2-1-tablet.a92ee1c5.jpg differ diff --git a/box2-1.5931fc11.jpg b/box2-1.5931fc11.jpg new file mode 100644 index 0000000000..3bb5fcf0d0 Binary files /dev/null and b/box2-1.5931fc11.jpg differ diff --git a/box2-1.f7f60431.jpg b/box2-1.f7f60431.jpg new file mode 100644 index 0000000000..5f516eed31 Binary files /dev/null and b/box2-1.f7f60431.jpg differ diff --git a/box2-2-laptop.1482ecd4.jpg b/box2-2-laptop.1482ecd4.jpg new file mode 100644 index 0000000000..bcd37a98cc Binary files /dev/null and b/box2-2-laptop.1482ecd4.jpg differ diff --git a/box2-2-laptop.d2925f9d.jpg b/box2-2-laptop.d2925f9d.jpg new file mode 100644 index 0000000000..d012a8f894 Binary files /dev/null and b/box2-2-laptop.d2925f9d.jpg differ diff --git a/box2-2-tablet.0006da27.jpg b/box2-2-tablet.0006da27.jpg new file mode 100644 index 0000000000..4da158385c Binary files /dev/null and b/box2-2-tablet.0006da27.jpg differ diff --git a/box2-2-tablet.258af9d6.jpg b/box2-2-tablet.258af9d6.jpg new file mode 100644 index 0000000000..b9737a430e Binary files /dev/null and b/box2-2-tablet.258af9d6.jpg differ diff --git a/box2-2.5b1166a3.jpg b/box2-2.5b1166a3.jpg new file mode 100644 index 0000000000..4206f79866 Binary files /dev/null and b/box2-2.5b1166a3.jpg differ diff --git a/box2-2.7ac8d5b6.jpg b/box2-2.7ac8d5b6.jpg new file mode 100644 index 0000000000..1ba2f37d22 Binary files /dev/null and b/box2-2.7ac8d5b6.jpg differ diff --git a/box3-1-laptop.81c1041a.jpg b/box3-1-laptop.81c1041a.jpg new file mode 100644 index 0000000000..dfbb2d5654 Binary files /dev/null and b/box3-1-laptop.81c1041a.jpg differ diff --git a/box3-1-laptop.db87e8eb.jpg b/box3-1-laptop.db87e8eb.jpg new file mode 100644 index 0000000000..bee7cffe80 Binary files /dev/null and b/box3-1-laptop.db87e8eb.jpg differ diff --git a/box3-1-tablet.0a1c3332.jpg b/box3-1-tablet.0a1c3332.jpg new file mode 100644 index 0000000000..eb55bf84a1 Binary files /dev/null and b/box3-1-tablet.0a1c3332.jpg differ diff --git a/box3-1-tablet.ada3be0f.jpg b/box3-1-tablet.ada3be0f.jpg new file mode 100644 index 0000000000..5ee45807e8 Binary files /dev/null and b/box3-1-tablet.ada3be0f.jpg differ diff --git a/box3-1.3ccce88b.jpg b/box3-1.3ccce88b.jpg new file mode 100644 index 0000000000..11d78308bd Binary files /dev/null and b/box3-1.3ccce88b.jpg differ diff --git a/box3-1.72f118a2.jpg b/box3-1.72f118a2.jpg new file mode 100644 index 0000000000..92d78a420e Binary files /dev/null and b/box3-1.72f118a2.jpg differ diff --git a/box3-2-laptop.a29ff2f5.jpg b/box3-2-laptop.a29ff2f5.jpg new file mode 100644 index 0000000000..dba3f8f2e1 Binary files /dev/null and b/box3-2-laptop.a29ff2f5.jpg differ diff --git a/box3-2-laptop.b7993bed.jpg b/box3-2-laptop.b7993bed.jpg new file mode 100644 index 0000000000..3e0dca2dd7 Binary files /dev/null and b/box3-2-laptop.b7993bed.jpg differ diff --git a/box3-2-tablet.9fb0d62b.jpg b/box3-2-tablet.9fb0d62b.jpg new file mode 100644 index 0000000000..9082394e44 Binary files /dev/null and b/box3-2-tablet.9fb0d62b.jpg differ diff --git a/box3-2-tablet.cdd12e43.jpg b/box3-2-tablet.cdd12e43.jpg new file mode 100644 index 0000000000..24eb562246 Binary files /dev/null and b/box3-2-tablet.cdd12e43.jpg differ diff --git a/box3-2.151a639b.jpg.14328.h0t b/box3-2.151a639b.jpg.14328.h0t new file mode 100644 index 0000000000..60c4b307fa Binary files /dev/null and b/box3-2.151a639b.jpg.14328.h0t differ diff --git a/box3-2.19149caf.jpg b/box3-2.19149caf.jpg new file mode 100644 index 0000000000..855e52aeb0 Binary files /dev/null and b/box3-2.19149caf.jpg differ diff --git a/favicon-16x16.14fa0a65.png.14328.h0w b/favicon-16x16.14fa0a65.png.14328.h0w new file mode 100644 index 0000000000..269dc3f917 Binary files /dev/null and b/favicon-16x16.14fa0a65.png.14328.h0w differ diff --git a/favicon-16x16.d0017dc2.png b/favicon-16x16.d0017dc2.png new file mode 100644 index 0000000000..b56c811dd4 Binary files /dev/null and b/favicon-16x16.d0017dc2.png differ diff --git a/header-bg-mobile.2d58f869.png b/header-bg-mobile.2d58f869.png new file mode 100644 index 0000000000..af444c5edd Binary files /dev/null and b/header-bg-mobile.2d58f869.png differ diff --git a/header-bg-mobile.758ca939.png b/header-bg-mobile.758ca939.png new file mode 100644 index 0000000000..c9bcb0de6f Binary files /dev/null and b/header-bg-mobile.758ca939.png differ diff --git a/icon-burger-menu-hover.c52aa833.svg b/icon-burger-menu-hover.c52aa833.svg new file mode 100644 index 0000000000..51da11215d --- /dev/null +++ b/icon-burger-menu-hover.c52aa833.svg @@ -0,0 +1,3 @@ + + + diff --git a/icon-burger-menu-hover.ca64cb70.svg b/icon-burger-menu-hover.ca64cb70.svg new file mode 100644 index 0000000000..8ddea34f1d --- /dev/null +++ b/icon-burger-menu-hover.ca64cb70.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/icon-burger-menu-tablet.552222f5.svg b/icon-burger-menu-tablet.552222f5.svg new file mode 100644 index 0000000000..4343b90a5b --- /dev/null +++ b/icon-burger-menu-tablet.552222f5.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/icon-burger-menu-tablet.733cd3a2.svg b/icon-burger-menu-tablet.733cd3a2.svg new file mode 100644 index 0000000000..cc90f25590 --- /dev/null +++ b/icon-burger-menu-tablet.733cd3a2.svg @@ -0,0 +1,3 @@ + + + diff --git a/icon-burger-menu.335e891c.svg.14328.h11 b/icon-burger-menu.335e891c.svg.14328.h11 new file mode 100644 index 0000000000..63d24521c9 --- /dev/null +++ b/icon-burger-menu.335e891c.svg.14328.h11 @@ -0,0 +1,3 @@ + + + diff --git a/icon-burger-menu.9f370792.svg b/icon-burger-menu.9f370792.svg new file mode 100644 index 0000000000..044855e2a5 --- /dev/null +++ b/icon-burger-menu.9f370792.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/icon-close-tablet.9644684e.svg b/icon-close-tablet.9644684e.svg new file mode 100644 index 0000000000..1433a3cff9 --- /dev/null +++ b/icon-close-tablet.9644684e.svg @@ -0,0 +1,3 @@ + + + diff --git a/icon-close-tablet.b93eb4c7.svg b/icon-close-tablet.b93eb4c7.svg new file mode 100644 index 0000000000..a98b8bec50 --- /dev/null +++ b/icon-close-tablet.b93eb4c7.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/icon-close.4e246dfc.svg b/icon-close.4e246dfc.svg new file mode 100644 index 0000000000..ab1ddf77e1 --- /dev/null +++ b/icon-close.4e246dfc.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/icon-close.cac3d951.svg b/icon-close.cac3d951.svg new file mode 100644 index 0000000000..9331a51273 --- /dev/null +++ b/icon-close.cac3d951.svg @@ -0,0 +1,3 @@ + + + diff --git a/icon-phone-call.3ea175dc.svg b/icon-phone-call.3ea175dc.svg new file mode 100644 index 0000000000..84ad1f5862 --- /dev/null +++ b/icon-phone-call.3ea175dc.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/icon-phone-call.62beee63.svg b/icon-phone-call.62beee63.svg new file mode 100644 index 0000000000..73ff75774b --- /dev/null +++ b/icon-phone-call.62beee63.svg @@ -0,0 +1,3 @@ + + + diff --git a/index.6a72f8a9.css b/index.6a72f8a9.css new file mode 100644 index 0000000000..c7e6f9e70a --- /dev/null +++ b/index.6a72f8a9.css @@ -0,0 +1,2 @@ +*{box-sizing:border-box;margin:0;padding:0;transition:all .3s}a:hover,button:hover,.hover-effect:hover{text-decoration:none;transform:scale(1.1)}.page{color:#1b2129;scroll-behavior:smooth;font-family:Manrope,sans-serif;font-size:16px;line-height:22px}.page:has(.page__menu:target){overflow:hidden}.page_body{max-width:100vw;margin:0;overflow-x:hidden}img{max-width:100%;height:auto}.page__menu{opacity:0;pointer-events:none;transition:opacity .3s,transform .3s;position:fixed;top:0;left:0;right:0;transform:translateY(-100%)}.page__menu:target{opacity:1;pointer-events:all;transform:translateY(0)}.no-scroll{overflow:hidden}.header{box-sizing:border-box;background-image:url(header-bg-mobile.758ca939.png);background-position:50%;background-repeat:no-repeat;background-size:cover;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:justify;justify-content:space-between;width:100%;height:586px;margin:0 auto;padding:0;display:-ms-flexbox;display:flex}h1{color:#fff;margin-left:28px;font-size:36px;font-weight:700;line-height:36px}.header__bottom{padding:0 20px 40px}.top-bar{-ms-flex-pack:justify;justify-content:space-between;-ms-flex-align:center;align-items:center;margin-left:24px;padding:24px 20px;display:-ms-flexbox;display:flex}.top-bar__icons{gap:28px;display:-ms-flexbox;display:flex}.top-bar__logo{display:-ms-flexbox;display:flex}.menu{box-sizing:border-box;background-color:#f9f9f9;height:100vh;font-weight:700;overflow:auto}.menu__top{z-index:1;background:0 0;margin-bottom:30px;margin-left:0;position:sticky;top:0}.menu__nav{margin-bottom:45px}.nav__item a{padding:0}.footer__content a{text-align:left;text-underline-position:from-font;-webkit-text-decoration-skip-ink:none;text-decoration-skip-ink:none;color:#191919;width:280px;font-size:16px;font-weight:400;line-height:22px;text-decoration:none}.nav__item a:hover{border-bottom:1px solid #1b2129;padding-bottom:3px;text-decoration:none;display:inline-block}.menu__content{padding-left:20px;padding-right:20px}.menu__phone-number{color:inherit;margin-bottom:18px;font-size:16px;line-height:22px;text-decoration:none;display:block}.menu__call-to-order{color:inherit;letter-spacing:2px;text-transform:uppercase;border-bottom:1px solid #1b2129;width:-moz-fit-content;width:fit-content;padding-bottom:3px;font-size:16px;line-height:22px;text-decoration:none;display:block}.contact-change-color:hover{color:#000}.nav__link{color:inherit;font-size:22px;line-height:22px;text-decoration:none}.nav__list{-ms-flex-direction:column;flex-direction:column;gap:29px;margin:0;padding:0;list-style:none;display:-ms-flexbox;display:flex}.icon{width:24px;height:24px;display:block}.icon:hover{color:#000}.icon--phone{background-image:url(icon-phone-call.3ea175dc.svg);background-repeat:no-repeat}.icon--menu{background-image:url(icon-burger-menu.9f370792.svg);background-repeat:no-repeat}.icon--close{background-image:url(icon-close.4e246dfc.svg);background-repeat:no-repeat}.main{-ms-flex-direction:column;flex-direction:column;-ms-flex-align:center;align-items:center;margin:0;padding:0;display:-ms-flexbox;display:flex}.recommended{color:#1b2129;-ms-flex-direction:column;flex-direction:column;-ms-flex-align:center;align-items:center;font-family:Manrope,sans-serif;display:-ms-flexbox;display:flex}.main__section__title{text-align:left;text-underline-position:from-font;-webkit-text-decoration-skip-ink:none;text-decoration-skip-ink:none;width:100%;margin-top:64px;margin-bottom:50px;font-size:32px;font-weight:700;line-height:32px}.recommended__img{width:280px;height:280px;overflow:hidden}.recommended__img img{transition:transform .25s}.recommended__img:hover{transform:scale(1.1)}.recommended__goods-title{text-align:left;text-underline-position:from-font;-webkit-text-decoration-skip-ink:none;text-decoration-skip-ink:none;margin-top:24px;margin-bottom:10px;font-size:18px;font-weight:700;line-height:25px}.recommended__goods-content{text-align:left;text-underline-position:from-font;-webkit-text-decoration-skip-ink:none;text-decoration-skip-ink:none;margin-bottom:10px;font-size:16px;font-weight:400;line-height:22px}.recommended__goods-prices{text-align:left;text-underline-position:from-font;-webkit-text-decoration-skip-ink:none;text-decoration-skip-ink:none;margin-bottom:46px;font-size:16px;font-weight:700;line-height:22px}.categories{color:#1b2129;-ms-flex-direction:column;flex-direction:column;justify-content:left;-ms-flex-align:center;align-items:center;margin-top:-8px;margin-bottom:96px;padding-left:142px;font-family:Manrope,sans-serif;display:-ms-flexbox;display:flex}.main__section-categories__title{text-align:left;text-underline-position:from-font;-webkit-text-decoration-skip-ink:none;text-decoration-skip-ink:none;width:100%;margin-top:66px;margin-bottom:44px;margin-right:136px;font-size:32px;font-weight:700;line-height:32px}.categories__box{-ms-flex-direction:column;flex-direction:column;-ms-flex-align:center;align-items:center;width:280px;height:170px;margin-bottom:24px;margin-left:-150px;display:-ms-flexbox;display:flex}.categories__box__image{-ms-flex-direction:row;flex-direction:row;justify-content:left;gap:20px;width:100%;height:100%;margin-bottom:110px;display:-ms-flexbox;display:flex}.categories__img{width:100%;height:auto;overflow:hidden}.categories__img img{transition:transform .25s}.categories__img:hover{transform:scale(1.1)}.categories__box1__image-1,.categories__box2__image-1,.categories__box3__image-1{margin-right:0}.categories__box__title{text-align:left;text-underline-position:from-font;-webkit-text-decoration-skip-ink:none;text-decoration-skip-ink:none;width:100%;margin-top:-346px;margin-bottom:-210px;font-size:18px;font-weight:700;line-height:25}.categories__button{opacity:1;text-align:center;color:#fff;text-underline-position:from-font;-webkit-text-decoration-skip-ink:none;text-decoration-skip-ink:none;cursor:pointer;background-color:#f98921;border:none;border-radius:8px;gap:0;width:280px;height:56px;margin-top:0;margin-left:-150px;padding:0 48px;font-size:16px;font-weight:700;line-height:27px;transition:all .3s;display:block}.categories__button:hover{background-color:#1b2129}.categories__button:active{background-color:#010810}.about-us{color:#1b2129;z-index:-1;background-color:#fcfaef;-ms-flex-direction:column;flex-direction:column;-ms-flex-align:center;align-items:center;width:100vw;height:600px;font-family:Manrope,sans-serif;display:-ms-flexbox;display:flex}.about-us__img{box-sizing:border-box;z-index:1;background:url(about-us.4d9b1c90.jpg) 50%/cover no-repeat;width:100%;height:200px;display:-ms-flexbox;display:flex;position:relative;overflow:hidden}.main__about-us__content{-ms-flex-direction:column;flex-direction:column;-ms-flex-align:center;align-items:center;width:100vw}.about-us__title{width:100%;margin-top:46px;margin-bottom:26px;margin-left:16%}.about-us__content{text-align:left;text-underline-position:from-font;-webkit-text-decoration-skip-ink:none;text-decoration-skip-ink:none;width:100%;margin-left:16%;padding-bottom:48px;padding-right:30px;font-size:16px;font-weight:400;line-height:22px}.contact-us{color:#1b2129;-ms-flex-direction:column;flex-direction:column;-ms-flex-align:center;align-items:center;margin-top:0;font-family:Manrope,sans-serif;display:-ms-flexbox;display:flex}.contact-us__fields{background-color:#fff;border:1px solid #fff;border-radius:10px;width:280px;margin-bottom:4px}.contact-us__fields__style{opacity:1;text-align:left;text-underline-position:from-font;-webkit-text-decoration-skip-ink:none;text-decoration-skip-ink:none;color:#7e7e83;background-color:#f9f9f9;border:1px solid #f9f9f9;border-radius:8px;gap:0;width:264px;margin-bottom:20px;font-family:Manrope,sans-serif;font-size:14px;font-weight:400;line-height:19px}.contact-us__fields__style:hover{color:#1b2129;background-color:#f9f9f9;border:1px solid #dbdbdb}.contact-us__fields__style:focus{color:#1b2129;background-color:#f9f9f9;border:2px solid #f98921;outline:none}.contact-us__fields_info{height:48px;padding-left:16px}.contact-us__fields__area{resize:none;gap:10px;height:auto;min-height:148px;padding:16px 0 0 16px}.contact-us__button{opacity:1;text-align:center;text-underline-position:from-font;-webkit-text-decoration-skip-ink:none;text-decoration-skip-ink:none;color:#fff;cursor:pointer;background-color:#f98921;border:none;border-radius:8px;gap:0;width:264px;height:56px;margin-top:10px;padding-left:48px;padding-right:48px;font-size:16px;font-weight:700;line-height:27px;transition:all .3s}.contact-us__button:hover{background-color:#1b2129}.contact-us__button:active{background-color:#010810}.footer{color:#1b2129;-ms-flex-direction:column;flex-direction:column;-ms-flex-align:center;align-items:center;width:100%;margin-top:46px;margin-bottom:10px;padding-bottom:50px;font-family:Manrope,sans-serif;display:-ms-flexbox;display:flex}.footer__title{text-align:left;text-underline-position:from-font;-webkit-text-decoration-skip-ink:none;text-decoration-skip-ink:none;color:#9393a3;width:280px;margin-bottom:10px;padding:0;font-family:Manrope,sans-serif;font-size:14px;font-weight:400;line-height:19px}.footer__content{margin-bottom:20px}.footer__content a:hover{text-decoration:underline}@media (min-width:768px) and (max-width:1024px){.header{background-position:50%;background-repeat:no-repeat;background-size:cover;width:100%;margin:0 auto}.top-bar{background:0 0;margin-left:70px;padding:34px 48px}.top-bar__logo{content:url(Logo-tablet.ad306897.svg);margin-bottom:20px;margin-left:-38px}.menu__content{margin-left:-44px}.icon{cursor:pointer;background-repeat:no-repeat;display:inline-block;position:relative}.icon--phone a{content:url(Icon-Phone-call-tablet.1d3cec15.svg)}.icon--phone:hover:before{content:"+1 234 555-55-55";white-space:nowrap;letter-spacing:2px;text-align:right;text-underline-position:from-font;-webkit-text-decoration-skip-ink:none;text-decoration-skip-ink:none;color:#1b2129;-ms-flex-align:center;align-items:center;margin-left:-147px;padding:0;font-family:Inter,sans-serif;font-size:12px;font-weight:700;line-height:16px;display:-ms-flexbox;display:flex}.icon--menu a{content:url(icon-burger-menu-tablet.552222f5.svg)}.icon--menu{margin-top:4px}.icon--menu:hover{background-image:url(icon-burger-menu-hover.ca64cb70.svg);background-repeat:no-repeat}h1{padding-left:26px;font-size:48px;font-weight:700;line-height:48px}.icon--close{content:url(icon-close-tablet.b93eb4c7.svg);background-repeat:no-repeat}.nav__list{margin-left:102px}.nav__link{-ms-flex-direction:column;flex-direction:column;padding-left:100px;display:-ms-flexbox;display:flex}.menu__phone-number,.menu__call-to-order{margin-left:100px}.tablet{width:744px;margin:0 auto}.main__section__title{margin-left:150px;font-size:40px;line-height:40px}.recommended__tablet{width:100%;margin-left:10px}.recommended__img{width:600px;height:600px}.recommended__beosound-a5__img img{content:url(b-a5-tablet.407c03c8.jpg)}.recommended__goods-title{margin-top:18px;margin-bottom:6px}.recommended__goods-content{width:586px;margin-bottom:30px}.hidden-br{display:none}.recommended__beoplay__img img{content:url(beoplay-tablet.7056c4ad.jpg)}.recommended__beosound-theatre__img{content:url(b-theatre-tablet.617385eb.jpg)}.categories{margin-bottom:120px}.main__section-categories__title{margin-left:12px;font-size:40px;line-height:40px}.categories__box{width:600px;height:234px;margin-left:-120px}.categories__box__title{margin-top:-104px;margin-bottom:12px;font-size:24px;font-weight:700;line-height:33px}.categories__img{width:288px;height:auto;margin-right:6px}.categories__box1__image-1{content:url(box1-1-tablet.133cba5b.jpg)}.categories__box1__image-2{content:url(box1-2-tablet.8cd130a1.jpg)}.categories__box2__image-1{content:url(box2-1-tablet.5e6ec1a9.jpg)}.categories__box2__image-2{content:url(box2-2-tablet.258af9d6.jpg)}.categories__box3__image-1{content:url(box3-1-tablet.ada3be0f.jpg)}.categories__box3__image-2{content:url(box3-2-tablet.cdd12e43.jpg)}.categories__button{width:600px;margin-left:-124px}.about-us{background-size:cover;width:100vw;height:800px;margin:0 auto}.about-us__img{box-sizing:border-box;background:url(about-us-tablet.b1f20c19.jpg) 50%/cover no-repeat;width:100%;height:400px}.main__about-us__content{-ms-flex-direction:row;flex-direction:row;-ms-flex-pack:distribute;justify-content:space-around;gap:0;width:100%;padding:0 30px;display:-ms-flexbox;display:flex}.about-us__title{width:450px;margin-top:42px;margin-left:46px}.dell-br{display:none}.about-us__content{width:488px;margin-top:122px;margin-left:34px;margin-right:54px}.contact-us{margin-top:46px}.contact-us__fields{-ms-flex-direction:column;flex-direction:column;width:100%;margin-left:158px;display:-ms-flexbox;display:flex}.contact-us__fields__style,.contact-us__button{width:600px}.footer{width:100%;margin-top:70px;margin-bottom:60px;margin-left:-150px;display:-ms-flexbox;display:flex}}@media (min-width:1025px){.page_body{position:relative}.header{width:100%;height:720px;margin:0 auto}.top-bar__logo{content:url(Logo-tablet.ad306897.svg);padding-top:10px;padding-left:100px}.top-bar{background:0 0;margin-left:-18px;padding:24px 38px}.top-bar__icons{margin-right:74px}.icon{cursor:pointer;background-repeat:no-repeat;display:inline-block;position:relative}.icon--phone a{content:url(Icon-Phone-call-tablet.1d3cec15.svg)}.icon--phone:hover:before{content:"+1 234 555-55-55";white-space:nowrap;letter-spacing:2px;text-align:right;text-underline-position:from-font;-webkit-text-decoration-skip-ink:none;text-decoration-skip-ink:none;color:#1b2129;-ms-flex-align:center;align-items:center;margin-left:-147px;padding:0;font-size:12px;font-weight:700;line-height:16px;display:-ms-flexbox;display:flex}.icon--menu{margin-top:4px}.icon--menu a{content:url(icon-burger-menu-tablet.552222f5.svg)}.icon--menu:hover{background-image:url(icon-burger-menu-hover.ca64cb70.svg);background-repeat:no-repeat}h1{padding-bottom:10px;padding-left:68px;font-size:56px;font-weight:700;line-height:56px}.menu__content{margin-top:60px;margin-left:-4px}.icon--close{content:url(icon-close-tablet.b93eb4c7.svg);background-repeat:no-repeat;margin-right:82px}.nav__list{margin-left:102px}.nav__link{-ms-flex-direction:column;flex-direction:column;padding-left:100px;display:-ms-flexbox;display:flex}.nav__link:hover{text-decoration:underline}.menu__phone-number,.menu__call-to-order{margin-left:100px}.laptop{width:1000px}.recommended{width:100%;margin-top:52px}.recommended__laptop{box-sizing:border-box;-ms-flex-pack:center;justify-content:center;gap:20px;width:1012px;margin-left:30px;display:-ms-flexbox;display:flex}.recommended__img{width:100%;height:auto}.recommended__beosound-a5__img img{content:url(b-a5-laptop.e49bc515.jpg)}.recommended__beoplay__img img{content:url(beoplay-laptop.003603f8.jpg)}.recommended__beosound-theatre__img{content:url(b-theatre-laptop.cb1ae6d8.jpg)}.main__section__title{-ms-flex-pack:center;justify-content:center;width:100%;margin-left:-632px;font-size:48px;font-weight:700;line-height:48px;display:-ms-flexbox;display:flex}.categories__img{width:498px;height:auto;margin-right:0}.categories__box1__image-1{content:url(box1-1-laptop.ea65d3f2.jpg)}.categories__box1__image-2{content:url(box1-2-laptop.0ca2cd9c.jpg)}.categories__box2__image-1{content:url(box2-1-laptop.64c1adb7.jpg)}.categories__box2__image-2{content:url(box2-2-laptop.d2925f9d.jpg)}.categories__box3__image-1{content:url(box3-1-laptop.db87e8eb.jpg)}.categories__box3__image-2{content:url(box3-2-laptop.a29ff2f5.jpg)}.main__section-categories__title{margin-bottom:48px;margin-left:-120px;font-size:48px;font-weight:700;line-height:48px}.categories__box{width:1020px;height:374px;margin-left:-110px}.categories__box__title{margin-top:-100px;margin-bottom:30px;font-size:24px;font-weight:700;line-height:33px}.categories__button{margin-top:10px;margin-left:-567px}.about-us{width:100%;height:860px;margin:36px auto 0}.about-us__img{background:url(about-us-laptop.cbb9b17c.jpg) 50%/cover no-repeat;height:460px}.main__about-us__content{-ms-flex-direction:row;flex-direction:row;-ms-flex-pack:distribute;justify-content:space-around;-ms-flex-align:center;align-items:center;gap:70px;margin-left:-150px;padding:160px 30px 120px;display:-ms-flexbox;display:flex}.about-us__title{width:498px;height:96px;margin-top:-24px;margin-left:156px;margin-right:20px;font-size:48px;font-weight:700;line-height:48px}.about-us__content{text-align:left;text-underline-position:from-font;-webkit-text-decoration-skip-ink:none;text-decoration-skip-ink:none;width:411px;height:110px;margin-top:-30px;margin-left:-60px;margin-right:-70px;padding-right:0;font-size:16px;font-weight:400;line-height:22px}.dell-br{display:none}.contact-us{width:1260px;margin:50px auto 0}.contact-us__fields{-ms-flex-direction:column;flex-direction:column;width:498px;margin-bottom:100px;margin-left:-396px;display:-ms-flexbox;display:flex}.contact-us__fields__style,.contact-us__button{width:498px}body,html{height:100%;margin:0}.content{box-sizing:border-box;min-height:100%;padding-bottom:244px}.footer-position{width:1260px;height:0;margin:0 auto;padding-left:357px;display:block;position:relative}.footer{z-index:3;background:0 0;width:411px;height:211px;display:block;position:absolute;top:-520px;left:78%;transform:translate(-50%)}} +/*# sourceMappingURL=index.6a72f8a9.css.map */ diff --git a/index.6a72f8a9.css.map b/index.6a72f8a9.css.map new file mode 100644 index 0000000000..b5696dddf2 --- /dev/null +++ b/index.6a72f8a9.css.map @@ -0,0 +1 @@ +{"mappings":"ACCA,8DAOA,mFAQA,0GAQA,8CAIA,sDAMA,+BAKA,+IAaA,wEAMA,2BAQA,kWAiBC,+EAQD,oCAQA,0KAQA,0DAKA,gDAIA,gGAQA,2FASA,8BAIA,uBAIA,wOAYA,gHAOA,oDAIA,wHASA,8OAaA,uCAQA,8EAOA,wIAaA,2CAMA,uBAIA,6GAKA,6GAKA,wGASA,mJAYA,oLAQA,0OAYA,2DAMA,gDAIA,6CAKA,mOAWA,qNAUA,oNAcA,8PAYA,wQAcA,0MAUA,4KAaA,wDAOA,+CAIA,4CAIA,gGAIA,8OAYA,qYAwBA,mDAIA,oDAQA,8OAYA,qNAYA,8HAQA,+EAOA,2PAkBA,gMASA,iHAQA,iWAkBA,iGAMA,8GAOA,uDAKA,kGAQA,6XAsBA,mDAIA,oDASA,iPAYA,2QAcA,oCAMA,mDAMA,gDACE,2GAQA,2DAMA,2GAMA,iCAIA,wFAOA,iFAMA,oZAoBA,iFAIA,2BAIA,yHAMA,qEAOA,sGAKA,6BAIA,+GAMA,2DAKA,kCAKA,wEAMA,iDAKA,2CAKA,0FAIA,4DAKA,2DAKA,wBAIA,yFAIA,gGAIA,gCAIA,kFAOA,6DAMA,6GAQA,0DAMA,oFAIA,oFAIA,oFAIA,oFAIA,oFAIA,oFAIA,mDAKA,uEAOA,+IASA,0LASA,8DAMD,sBAIC,mFAOA,4BAIA,kIAOA,2DAQA,2GASF,0BAEE,6BAIA,8CAMA,0GAMA,4DAOA,kCAIA,wFAOA,iFAKA,uXAiBA,2BAIA,iFAIA,yHAKA,yFASA,gDAKA,wHAMA,6BAIA,+GAMA,2CAIA,2DAKA,qBAIA,wCAMA,+JAUA,yCAKA,0FAIA,yFAIA,gGAIA,iLAWA,wDAMA,oFAIA,oFAIA,oFAIA,oFAIA,oFAIA,oFAIA,uHAQA,8DAMA,6GAQA,uDAKA,qDAQA,8GAMA,wPAUA,8IAYA,wRAgBA,sBAIA,4CAMA,wJAQA,2DASA,+BAKA,oEAMA,wGAYA","sources":["index.6a72f8a9.css","src/styles/main.scss"],"sourcesContent":["* {\n box-sizing: border-box;\n margin: 0;\n padding: 0;\n transition: all .3s;\n}\n\na:hover, button:hover, .hover-effect:hover {\n text-decoration: none;\n transform: scale(1.1);\n}\n\n.page {\n color: #1b2129;\n scroll-behavior: smooth;\n font-family: Manrope, sans-serif;\n font-size: 16px;\n line-height: 22px;\n}\n\n.page:has(.page__menu:target) {\n overflow: hidden;\n}\n\n.page_body {\n max-width: 100vw;\n margin: 0;\n overflow-x: hidden;\n}\n\nimg {\n max-width: 100%;\n height: auto;\n}\n\n.page__menu {\n opacity: 0;\n pointer-events: none;\n transition: opacity .3s, transform .3s;\n position: fixed;\n top: 0;\n left: 0;\n right: 0;\n transform: translateY(-100%);\n}\n\n.page__menu:target {\n opacity: 1;\n pointer-events: all;\n transform: translateY(0);\n}\n\n.no-scroll {\n overflow: hidden;\n}\n\n.header {\n box-sizing: border-box;\n background-image: url(\"header-bg-mobile.758ca939.png\");\n background-position: center;\n background-repeat: no-repeat;\n background-size: cover;\n -ms-flex-direction: column;\n flex-direction: column;\n justify-content: space-between;\n width: 100%;\n height: 586px;\n margin: 0 auto;\n padding: 0;\n display: -ms-flexbox;\n display: flex;\n}\n\nh1 {\n color: #fff;\n margin-left: 28px;\n font-size: 36px;\n font-weight: 700;\n line-height: 36px;\n}\n\n.header__bottom {\n padding: 0 20px 40px;\n}\n\n.top-bar {\n justify-content: space-between;\n align-items: center;\n margin-left: 24px;\n padding: 24px 20px;\n display: -ms-flexbox;\n display: flex;\n}\n\n.top-bar__icons {\n gap: 28px;\n display: -ms-flexbox;\n display: flex;\n}\n\n.top-bar__logo {\n display: -ms-flexbox;\n display: flex;\n}\n\n.menu {\n box-sizing: border-box;\n background-color: #f9f9f9;\n height: 100vh;\n font-weight: 700;\n overflow: auto;\n}\n\n.menu__top {\n z-index: 1;\n background: none;\n margin-bottom: 30px;\n margin-left: 0;\n position: sticky;\n top: 0;\n}\n\n.menu__nav {\n margin-bottom: 45px;\n}\n\n.nav__item a {\n padding: 0;\n}\n\n.footer__content a {\n text-align: left;\n text-underline-position: from-font;\n -webkit-text-decoration-skip-ink: none;\n text-decoration-skip-ink: none;\n color: #191919;\n width: 280px;\n font-size: 16px;\n font-weight: 400;\n line-height: 22px;\n text-decoration: none;\n}\n\n.nav__item a:hover {\n border-bottom: 1px solid #1b2129;\n padding-bottom: 3px;\n text-decoration: none;\n display: inline-block;\n}\n\n.menu__content {\n padding-left: 20px;\n padding-right: 20px;\n}\n\n.menu__phone-number {\n color: inherit;\n margin-bottom: 18px;\n font-size: 16px;\n line-height: 22px;\n text-decoration: none;\n display: block;\n}\n\n.menu__call-to-order {\n color: inherit;\n letter-spacing: 2px;\n text-transform: uppercase;\n border-bottom: 1px solid #1b2129;\n width: fit-content;\n padding-bottom: 3px;\n font-size: 16px;\n line-height: 22px;\n text-decoration: none;\n display: block;\n}\n\n.contact-change-color:hover {\n color: #000;\n}\n\n.nav__link {\n color: inherit;\n font-size: 22px;\n line-height: 22px;\n text-decoration: none;\n}\n\n.nav__list {\n -ms-flex-direction: column;\n flex-direction: column;\n gap: 29px;\n margin: 0;\n padding: 0;\n list-style: none;\n display: -ms-flexbox;\n display: flex;\n}\n\n.icon {\n width: 24px;\n height: 24px;\n display: block;\n}\n\n.icon:hover {\n color: #000;\n}\n\n.icon--phone {\n background-image: url(\"icon-phone-call.3ea175dc.svg\");\n background-repeat: no-repeat;\n}\n\n.icon--menu {\n background-image: url(\"icon-burger-menu.9f370792.svg\");\n background-repeat: no-repeat;\n}\n\n.icon--close {\n background-image: url(\"icon-close.4e246dfc.svg\");\n background-repeat: no-repeat;\n}\n\n.main {\n -ms-flex-direction: column;\n flex-direction: column;\n align-items: center;\n margin: 0;\n padding: 0;\n display: -ms-flexbox;\n display: flex;\n}\n\n.recommended {\n color: #1b2129;\n -ms-flex-direction: column;\n flex-direction: column;\n align-items: center;\n font-family: Manrope, sans-serif;\n display: -ms-flexbox;\n display: flex;\n}\n\n.main__section__title {\n text-align: left;\n text-underline-position: from-font;\n -webkit-text-decoration-skip-ink: none;\n text-decoration-skip-ink: none;\n width: 100%;\n margin-top: 64px;\n margin-bottom: 50px;\n font-size: 32px;\n font-weight: 700;\n line-height: 32px;\n}\n\n.recommended__img {\n width: 280px;\n height: 280px;\n overflow: hidden;\n}\n\n.recommended__img img {\n transition: transform .25s;\n}\n\n.recommended__img:hover {\n transform: scale(1.1);\n}\n\n.recommended__goods-title {\n text-align: left;\n text-underline-position: from-font;\n -webkit-text-decoration-skip-ink: none;\n text-decoration-skip-ink: none;\n margin-top: 24px;\n margin-bottom: 10px;\n font-size: 18px;\n font-weight: 700;\n line-height: 25px;\n}\n\n.recommended__goods-content {\n text-align: left;\n text-underline-position: from-font;\n -webkit-text-decoration-skip-ink: none;\n text-decoration-skip-ink: none;\n margin-bottom: 10px;\n font-size: 16px;\n font-weight: 400;\n line-height: 22px;\n}\n\n.recommended__goods-prices {\n text-align: left;\n text-underline-position: from-font;\n -webkit-text-decoration-skip-ink: none;\n text-decoration-skip-ink: none;\n margin-bottom: 46px;\n font-size: 16px;\n font-weight: 700;\n line-height: 22px;\n}\n\n.categories {\n color: #1b2129;\n -ms-flex-direction: column;\n flex-direction: column;\n justify-content: left;\n align-items: center;\n margin-top: -8px;\n margin-bottom: 96px;\n padding-left: 142px;\n font-family: Manrope, sans-serif;\n display: -ms-flexbox;\n display: flex;\n}\n\n.main__section-categories__title {\n text-align: left;\n text-underline-position: from-font;\n -webkit-text-decoration-skip-ink: none;\n text-decoration-skip-ink: none;\n width: 100%;\n margin-top: 66px;\n margin-bottom: 44px;\n margin-right: 136px;\n font-size: 32px;\n font-weight: 700;\n line-height: 32px;\n}\n\n.categories__box {\n -ms-flex-direction: column;\n flex-direction: column;\n align-items: center;\n width: 280px;\n height: 170px;\n margin-bottom: 24px;\n margin-left: -150px;\n display: -ms-flexbox;\n display: flex;\n}\n\n.categories__box__image {\n -ms-flex-direction: row;\n flex-direction: row;\n justify-content: left;\n gap: 20px;\n width: 100%;\n height: 100%;\n margin-bottom: 110px;\n display: -ms-flexbox;\n display: flex;\n}\n\n.categories__img {\n width: 100%;\n height: auto;\n overflow: hidden;\n}\n\n.categories__img img {\n transition: transform .25s;\n}\n\n.categories__img:hover {\n transform: scale(1.1);\n}\n\n.categories__box1__image-1, .categories__box2__image-1, .categories__box3__image-1 {\n margin-right: 0;\n}\n\n.categories__box__title {\n text-align: left;\n text-underline-position: from-font;\n -webkit-text-decoration-skip-ink: none;\n text-decoration-skip-ink: none;\n width: 100%;\n margin-top: -346px;\n margin-bottom: -210px;\n font-size: 18px;\n font-weight: 700;\n line-height: 25;\n}\n\n.categories__button {\n opacity: 1;\n text-align: center;\n color: #fff;\n text-underline-position: from-font;\n -webkit-text-decoration-skip-ink: none;\n text-decoration-skip-ink: none;\n cursor: pointer;\n background-color: #f98921;\n border: none;\n border-radius: 8px;\n gap: 0;\n width: 280px;\n height: 56px;\n margin-top: 0;\n margin-left: -150px;\n padding: 0 48px;\n font-size: 16px;\n font-weight: 700;\n line-height: 27px;\n transition: all .3s;\n display: block;\n}\n\n.categories__button:hover {\n background-color: #1b2129;\n}\n\n.categories__button:active {\n background-color: #010810;\n}\n\n.about-us {\n color: #1b2129;\n z-index: -1;\n background-color: #fcfaef;\n -ms-flex-direction: column;\n flex-direction: column;\n align-items: center;\n width: 100vw;\n height: 600px;\n font-family: Manrope, sans-serif;\n display: -ms-flexbox;\n display: flex;\n}\n\n.about-us__img {\n box-sizing: border-box;\n z-index: 1;\n background: url(\"about-us.4d9b1c90.jpg\") center / cover no-repeat;\n width: 100%;\n height: 200px;\n display: -ms-flexbox;\n display: flex;\n position: relative;\n overflow: hidden;\n}\n\n.main__about-us__content {\n -ms-flex-direction: column;\n flex-direction: column;\n align-items: center;\n width: 100vw;\n}\n\n.about-us__title {\n width: 100%;\n margin-top: 46px;\n margin-bottom: 26px;\n margin-left: 16%;\n}\n\n.about-us__content {\n text-align: left;\n text-underline-position: from-font;\n -webkit-text-decoration-skip-ink: none;\n text-decoration-skip-ink: none;\n width: 100%;\n margin-left: 16%;\n padding-bottom: 48px;\n padding-right: 30px;\n font-size: 16px;\n font-weight: 400;\n line-height: 22px;\n}\n\n.contact-us {\n color: #1b2129;\n -ms-flex-direction: column;\n flex-direction: column;\n align-items: center;\n margin-top: 0;\n font-family: Manrope, sans-serif;\n display: -ms-flexbox;\n display: flex;\n}\n\n.contact-us__fields {\n background-color: #fff;\n border: 1px solid #fff;\n border-radius: 10px;\n width: 280px;\n margin-bottom: 4px;\n}\n\n.contact-us__fields__style {\n opacity: 1;\n text-align: left;\n text-underline-position: from-font;\n -webkit-text-decoration-skip-ink: none;\n text-decoration-skip-ink: none;\n color: #7e7e83;\n background-color: #f9f9f9;\n border: 1px solid #f9f9f9;\n border-radius: 8px;\n gap: 0;\n width: 264px;\n margin-bottom: 20px;\n font-family: Manrope, sans-serif;\n font-size: 14px;\n font-weight: 400;\n line-height: 19px;\n}\n\n.contact-us__fields__style:hover {\n color: #1b2129;\n background-color: #f9f9f9;\n border: 1px solid #dbdbdb;\n}\n\n.contact-us__fields__style:focus {\n color: #1b2129;\n background-color: #f9f9f9;\n border: 2px solid #f98921;\n outline: none;\n}\n\n.contact-us__fields_info {\n height: 48px;\n padding-left: 16px;\n}\n\n.contact-us__fields__area {\n resize: none;\n gap: 10px;\n height: auto;\n min-height: 148px;\n padding: 16px 0 0 16px;\n}\n\n.contact-us__button {\n opacity: 1;\n text-align: center;\n text-underline-position: from-font;\n -webkit-text-decoration-skip-ink: none;\n text-decoration-skip-ink: none;\n color: #fff;\n cursor: pointer;\n background-color: #f98921;\n border: none;\n border-radius: 8px;\n gap: 0;\n width: 264px;\n height: 56px;\n margin-top: 10px;\n padding-left: 48px;\n padding-right: 48px;\n font-size: 16px;\n font-weight: 700;\n line-height: 27px;\n transition: all .3s;\n}\n\n.contact-us__button:hover {\n background-color: #1b2129;\n}\n\n.contact-us__button:active {\n background-color: #010810;\n}\n\n.footer {\n color: #1b2129;\n -ms-flex-direction: column;\n flex-direction: column;\n align-items: center;\n width: 100%;\n margin-top: 46px;\n margin-bottom: 10px;\n padding-bottom: 50px;\n font-family: Manrope, sans-serif;\n display: -ms-flexbox;\n display: flex;\n}\n\n.footer__title {\n text-align: left;\n text-underline-position: from-font;\n -webkit-text-decoration-skip-ink: none;\n text-decoration-skip-ink: none;\n color: #9393a3;\n width: 280px;\n margin-bottom: 10px;\n padding: 0;\n font-family: Manrope, sans-serif;\n font-size: 14px;\n font-weight: 400;\n line-height: 19px;\n}\n\n.footer__content {\n margin-bottom: 20px;\n}\n\n.footer__content a:hover {\n text-decoration: underline;\n}\n\n@media (width >= 768px) and (width <= 1024px) {\n .header {\n background-position: center;\n background-repeat: no-repeat;\n background-size: cover;\n width: 100%;\n margin: 0 auto;\n }\n\n .top-bar {\n background: none;\n margin-left: 70px;\n padding: 34px 48px;\n }\n\n .top-bar__logo {\n content: url(\"Logo-tablet.ad306897.svg\");\n margin-bottom: 20px;\n margin-left: -38px;\n }\n\n .menu__content {\n margin-left: -44px;\n }\n\n .icon {\n cursor: pointer;\n background-repeat: no-repeat;\n display: inline-block;\n position: relative;\n }\n\n .icon--phone a {\n content: url(\"Icon-Phone-call-tablet.1d3cec15.svg\");\n }\n\n .icon--phone:hover:before {\n content: \"+1 234 555-55-55\";\n white-space: nowrap;\n letter-spacing: 2px;\n text-align: right;\n text-underline-position: from-font;\n -webkit-text-decoration-skip-ink: none;\n text-decoration-skip-ink: none;\n color: #1b2129;\n align-items: center;\n margin-left: -147px;\n padding: 0;\n font-family: Inter, sans-serif;\n font-size: 12px;\n font-weight: 700;\n line-height: 16px;\n display: -ms-flexbox;\n display: flex;\n }\n\n .icon--menu a {\n content: url(\"icon-burger-menu-tablet.552222f5.svg\");\n }\n\n .icon--menu {\n margin-top: 4px;\n }\n\n .icon--menu:hover {\n background-image: url(\"icon-burger-menu-hover.ca64cb70.svg\");\n background-repeat: no-repeat;\n }\n\n h1 {\n padding-left: 26px;\n font-size: 48px;\n font-weight: 700;\n line-height: 48px;\n }\n\n .icon--close {\n content: url(\"icon-close-tablet.b93eb4c7.svg\");\n background-repeat: no-repeat;\n }\n\n .nav__list {\n margin-left: 102px;\n }\n\n .nav__link {\n -ms-flex-direction: column;\n flex-direction: column;\n padding-left: 100px;\n display: -ms-flexbox;\n display: flex;\n }\n\n .menu__phone-number, .menu__call-to-order {\n margin-left: 100px;\n }\n\n .tablet {\n width: 744px;\n margin: 0 auto;\n }\n\n .main__section__title {\n margin-left: 150px;\n font-size: 40px;\n line-height: 40px;\n }\n\n .recommended__tablet {\n width: 100%;\n margin-left: 10px;\n }\n\n .recommended__img {\n width: 600px;\n height: 600px;\n }\n\n .recommended__beosound-a5__img img {\n content: url(\"b-a5-tablet.407c03c8.jpg\");\n }\n\n .recommended__goods-title {\n margin-top: 18px;\n margin-bottom: 6px;\n }\n\n .recommended__goods-content {\n width: 586px;\n margin-bottom: 30px;\n }\n\n .hidden-br {\n display: none;\n }\n\n .recommended__beoplay__img img {\n content: url(\"beoplay-tablet.7056c4ad.jpg\");\n }\n\n .recommended__beosound-theatre__img {\n content: url(\"b-theatre-tablet.617385eb.jpg\");\n }\n\n .categories {\n margin-bottom: 120px;\n }\n\n .main__section-categories__title {\n margin-left: 12px;\n font-size: 40px;\n line-height: 40px;\n }\n\n .categories__box {\n width: 600px;\n height: 234px;\n margin-left: -120px;\n }\n\n .categories__box__title {\n margin-top: -104px;\n margin-bottom: 12px;\n font-size: 24px;\n font-weight: 700;\n line-height: 33px;\n }\n\n .categories__img {\n width: 288px;\n height: auto;\n margin-right: 6px;\n }\n\n .categories__box1__image-1 {\n content: url(\"box1-1-tablet.133cba5b.jpg\");\n }\n\n .categories__box1__image-2 {\n content: url(\"box1-2-tablet.8cd130a1.jpg\");\n }\n\n .categories__box2__image-1 {\n content: url(\"box2-1-tablet.5e6ec1a9.jpg\");\n }\n\n .categories__box2__image-2 {\n content: url(\"box2-2-tablet.258af9d6.jpg\");\n }\n\n .categories__box3__image-1 {\n content: url(\"box3-1-tablet.ada3be0f.jpg\");\n }\n\n .categories__box3__image-2 {\n content: url(\"box3-2-tablet.cdd12e43.jpg\");\n }\n\n .categories__button {\n width: 600px;\n margin-left: -124px;\n }\n\n .about-us {\n background-size: cover;\n width: 100vw;\n height: 800px;\n margin: 0 auto;\n }\n\n .about-us__img {\n box-sizing: border-box;\n background: url(\"about-us-tablet.b1f20c19.jpg\") center / cover no-repeat;\n width: 100%;\n height: 400px;\n }\n\n .main__about-us__content {\n -ms-flex-direction: row;\n flex-direction: row;\n justify-content: space-around;\n gap: 0;\n width: 100%;\n padding: 0 30px;\n display: -ms-flexbox;\n display: flex;\n }\n\n .about-us__title {\n width: 450px;\n margin-top: 42px;\n margin-left: 46px;\n }\n\n .dell-br {\n display: none;\n }\n\n .about-us__content {\n width: 488px;\n margin-top: 122px;\n margin-left: 34px;\n margin-right: 54px;\n }\n\n .contact-us {\n margin-top: 46px;\n }\n\n .contact-us__fields {\n -ms-flex-direction: column;\n flex-direction: column;\n width: 100%;\n margin-left: 158px;\n display: -ms-flexbox;\n display: flex;\n }\n\n .contact-us__fields__style, .contact-us__button {\n width: 600px;\n }\n\n .footer {\n width: 100%;\n margin-top: 70px;\n margin-bottom: 60px;\n margin-left: -150px;\n display: -ms-flexbox;\n display: flex;\n }\n}\n\n@media (width >= 1025px) {\n .page_body {\n position: relative;\n }\n\n .header {\n width: 100%;\n height: 720px;\n margin: 0 auto;\n }\n\n .top-bar__logo {\n content: url(\"Logo-tablet.ad306897.svg\");\n padding-top: 10px;\n padding-left: 100px;\n }\n\n .top-bar {\n background: none;\n margin-left: -18px;\n padding: 24px 38px;\n }\n\n .top-bar__icons {\n margin-right: 74px;\n }\n\n .icon {\n cursor: pointer;\n background-repeat: no-repeat;\n display: inline-block;\n position: relative;\n }\n\n .icon--phone a {\n content: url(\"Icon-Phone-call-tablet.1d3cec15.svg\");\n }\n\n .icon--phone:hover:before {\n content: \"+1 234 555-55-55\";\n white-space: nowrap;\n letter-spacing: 2px;\n text-align: right;\n text-underline-position: from-font;\n -webkit-text-decoration-skip-ink: none;\n text-decoration-skip-ink: none;\n color: #1b2129;\n align-items: center;\n margin-left: -147px;\n padding: 0;\n font-size: 12px;\n font-weight: 700;\n line-height: 16px;\n display: -ms-flexbox;\n display: flex;\n }\n\n .icon--menu {\n margin-top: 4px;\n }\n\n .icon--menu a {\n content: url(\"icon-burger-menu-tablet.552222f5.svg\");\n }\n\n .icon--menu:hover {\n background-image: url(\"icon-burger-menu-hover.ca64cb70.svg\");\n background-repeat: no-repeat;\n }\n\n h1 {\n padding-bottom: 10px;\n padding-left: 68px;\n font-size: 56px;\n font-weight: 700;\n line-height: 56px;\n }\n\n .menu__content {\n margin-top: 60px;\n margin-left: -4px;\n }\n\n .icon--close {\n content: url(\"icon-close-tablet.b93eb4c7.svg\");\n background-repeat: no-repeat;\n margin-right: 82px;\n }\n\n .nav__list {\n margin-left: 102px;\n }\n\n .nav__link {\n -ms-flex-direction: column;\n flex-direction: column;\n padding-left: 100px;\n display: -ms-flexbox;\n display: flex;\n }\n\n .nav__link:hover {\n text-decoration: underline;\n }\n\n .menu__phone-number, .menu__call-to-order {\n margin-left: 100px;\n }\n\n .laptop {\n width: 1000px;\n }\n\n .recommended {\n width: 100%;\n margin-top: 52px;\n }\n\n .recommended__laptop {\n box-sizing: border-box;\n justify-content: center;\n gap: 20px;\n width: 1012px;\n margin-left: 30px;\n display: -ms-flexbox;\n display: flex;\n }\n\n .recommended__img {\n width: 100%;\n height: auto;\n }\n\n .recommended__beosound-a5__img img {\n content: url(\"b-a5-laptop.e49bc515.jpg\");\n }\n\n .recommended__beoplay__img img {\n content: url(\"beoplay-laptop.003603f8.jpg\");\n }\n\n .recommended__beosound-theatre__img {\n content: url(\"b-theatre-laptop.cb1ae6d8.jpg\");\n }\n\n .main__section__title {\n justify-content: center;\n width: 100%;\n margin-left: -632px;\n font-size: 48px;\n font-weight: 700;\n line-height: 48px;\n display: -ms-flexbox;\n display: flex;\n }\n\n .categories__img {\n width: 498px;\n height: auto;\n margin-right: 0;\n }\n\n .categories__box1__image-1 {\n content: url(\"box1-1-laptop.ea65d3f2.jpg\");\n }\n\n .categories__box1__image-2 {\n content: url(\"box1-2-laptop.0ca2cd9c.jpg\");\n }\n\n .categories__box2__image-1 {\n content: url(\"box2-1-laptop.64c1adb7.jpg\");\n }\n\n .categories__box2__image-2 {\n content: url(\"box2-2-laptop.d2925f9d.jpg\");\n }\n\n .categories__box3__image-1 {\n content: url(\"box3-1-laptop.db87e8eb.jpg\");\n }\n\n .categories__box3__image-2 {\n content: url(\"box3-2-laptop.a29ff2f5.jpg\");\n }\n\n .main__section-categories__title {\n margin-bottom: 48px;\n margin-left: -120px;\n font-size: 48px;\n font-weight: 700;\n line-height: 48px;\n }\n\n .categories__box {\n width: 1020px;\n height: 374px;\n margin-left: -110px;\n }\n\n .categories__box__title {\n margin-top: -100px;\n margin-bottom: 30px;\n font-size: 24px;\n font-weight: 700;\n line-height: 33px;\n }\n\n .categories__button {\n margin-top: 10px;\n margin-left: -567px;\n }\n\n .about-us {\n width: 100%;\n height: 860px;\n margin: 36px auto 0;\n }\n\n .about-us__img {\n background: url(\"about-us-laptop.cbb9b17c.jpg\") center / cover no-repeat;\n height: 460px;\n }\n\n .main__about-us__content {\n -ms-flex-direction: row;\n flex-direction: row;\n justify-content: space-around;\n align-items: center;\n gap: 70px;\n margin-left: -150px;\n padding: 160px 30px 120px;\n display: -ms-flexbox;\n display: flex;\n }\n\n .about-us__title {\n width: 498px;\n height: 96px;\n margin-top: -24px;\n margin-left: 156px;\n margin-right: 20px;\n font-size: 48px;\n font-weight: 700;\n line-height: 48px;\n }\n\n .about-us__content {\n text-align: left;\n text-underline-position: from-font;\n -webkit-text-decoration-skip-ink: none;\n text-decoration-skip-ink: none;\n width: 411px;\n height: 110px;\n margin-top: -30px;\n margin-left: -60px;\n margin-right: -70px;\n padding-right: 0;\n font-size: 16px;\n font-weight: 400;\n line-height: 22px;\n }\n\n .dell-br {\n display: none;\n }\n\n .contact-us {\n width: 1260px;\n margin: 50px auto 0;\n }\n\n .contact-us__fields {\n -ms-flex-direction: column;\n flex-direction: column;\n width: 498px;\n margin-bottom: 100px;\n margin-left: -396px;\n display: -ms-flexbox;\n display: flex;\n }\n\n .contact-us__fields__style, .contact-us__button {\n width: 498px;\n }\n\n body, html {\n height: 100%;\n margin: 0;\n }\n\n .content {\n box-sizing: border-box;\n min-height: 100%;\n padding-bottom: 244px;\n }\n\n .footer-position {\n width: 1260px;\n height: 0;\n margin: 0 auto;\n padding-left: 357px;\n display: block;\n position: relative;\n }\n\n .footer {\n z-index: 3;\n background: none;\n width: 411px;\n height: 211px;\n display: block;\n position: absolute;\n top: -520px;\n left: 78%;\n transform: translateX(-50%);\n }\n}\n/*# sourceMappingURL=index.6a72f8a9.css.map */\n","/* #region body */\n* {\n box-sizing: border-box;\n margin: 0;\n padding: 0;\n transition: all 0.3s ease;\n}\n\na:hover,\nbutton:hover,\n.hover-effect:hover {\n transform: scale(1.1);\n text-decoration: none;\n }\n\n\n.page {\n font-family: Manrope, sans-serif;\n color: #1b2129;\n font-size: 16px;\n line-height: 22px;\n scroll-behavior: smooth;\n}\n\n.page:has(.page__menu:target) {\n overflow: hidden;\n}\n\n.page_body {\n max-width: 100vw;\n overflow-x: hidden;\n margin: 0;\n}\n\nimg {\n max-width: 100%;\n height: auto;\n}\n\n.page__menu {\n position: fixed;\n top: 0;\n right: 0;\n left: 0;\n opacity: 0;\n pointer-events: none;\n transform: translateY(-100%);\n transition:\n opacity 0.3s ease,\n transform 0.3s ease;\n}\n\n.page__menu:target {\n opacity: 1;\n pointer-events: all;\n transform: translateY(0);\n}\n\n.no-scroll {\n overflow: hidden;\n}\n\n/* #endregion */\n\n/* #region header */\n\n.header {\n box-sizing: border-box;\n width: 100%;\n height: 586px;\n background-image: url(../images/header-bg-mobile.png);\n background-repeat: no-repeat;\n background-size: cover;\n background-position: center;\n\n padding: 0;\n margin: 0 auto;\n\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n}\n\n h1 {\n font-size: 36px;\n line-height: 36px;\n font-weight: 700;\n color: #fff;\n margin-left: 28px;\n}\n\n.header__bottom {\n padding: 0 20px 40px;\n}\n\n/* #endregion */\n\n/* #region menu */\n\n.top-bar {\n padding: 24px 20px;\n display: flex;\n justify-content: space-between;\n align-items: center;\n margin-left: 24px;\n}\n\n.top-bar__icons {\n display: flex;\n gap: 28px;\n}\n\n.top-bar__logo {\n display: flex;\n}\n\n.menu {\n box-sizing: border-box;\n height: 100vh;\n background-color: #f9f9f9;\n font-weight: 700;\n overflow: auto;\n}\n\n.menu__top {\n margin-bottom: 30px;\n position: sticky;\n top: 0;\n z-index: 1;\n background: none;\n margin-left: 0;\n}\n\n.menu__nav {\n margin-bottom: 45px;\n}\n\n.nav__item a {\n padding: 0;\n}\n\n.footer__content a {\n width: 280px;\n font-size: 16px;\n font-weight: 400;\n line-height: 22px;\n text-align: left;\n text-underline-position: from-font;\n text-decoration-skip-ink: none;\n color: #191919;\n text-decoration: none;\n}\n\n.nav__item a:hover {\n padding-bottom: 3px;\n border-bottom: 1px solid #1b2129;\n text-decoration: none;\n display: inline-block;\n}\n\n.menu__content {\n padding-inline: 20px;\n}\n\n.menu__phone-number {\n display: block;\n margin-bottom: 18px;\n color: inherit;\n text-decoration: none;\n font-size: 16px;\n line-height: 22px;\n}\n\n.menu__call-to-order {\n display: block;\n width: fit-content;\n padding-bottom: 3px;\n border-bottom: 1px solid #1b2129;\n color: inherit;\n text-decoration: none;\n font-size: 16px;\n line-height: 22px;\n letter-spacing: 2px;\n text-transform: uppercase;\n}\n\n.contact-change-color:hover {\n color: #000;\n}\n\n/* #endregion */\n\n/* #region nav */\n\n.nav__link {\n color: inherit;\n text-decoration: none;\n font-size: 22px;\n line-height: 22px;\n}\n\n.nav__list {\n margin: 0;\n padding: 0;\n list-style: none;\n display: flex;\n flex-direction: column;\n gap: 29px;\n}\n\n/* #endregion */\n\n/* #region icon */\n\n.icon {\n display: block;\n height: 24px;\n width: 24px;\n}\n\n.icon:hover {\n color: #000;\n}\n\n.icon--phone {\n background-image: url(../images/icon-phone-call.svg);\n background-repeat: no-repeat;\n}\n\n.icon--menu {\n background-image: url(../images/icon-burger-menu.svg);\n background-repeat: no-repeat;\n}\n\n.icon--close {\n background-image: url(../images/icon-close.svg);\n background-repeat: no-repeat;\n}\n\n/* #endregion */\n\n/* #region main */\n\n.main {\n display: flex;\n flex-direction: column;\n align-items: center;\n padding: 0;\n margin: 0;\n}\n\n/* #endregion */\n\n/* #region recomended */\n\n.recommended {\n display: flex;\n flex-direction: column;\n align-items: center;\n color: #1b2129;\n font-family: Manrope, sans-serif;\n}\n\n.main__section__title {\n width: 100%;\n font-size: 32px;\n font-weight: 700;\n line-height: 32px;\n text-align: left;\n text-underline-position: from-font;\n text-decoration-skip-ink: none;\n margin-top: 64px;\n margin-bottom: 50px;\n}\n\n.recommended__img {\n width: 280px;\n height: 280px;\n overflow: hidden;\n}\n\n.recommended__img img {\n transition: transform 0.25s;\n}\n\n.recommended__img:hover{\n transform: scale(1.1);\n}\n\n\n.recommended__goods-title {\n font-size: 18px;\n font-weight: 700;\n line-height: 25px;\n text-align: left;\n text-underline-position: from-font;\n text-decoration-skip-ink: none;\n margin-top: 24px;\n margin-bottom: 10px;\n}\n\n.recommended__goods-content {\n font-size: 16px;\n font-weight: 400;\n line-height: 22px;\n text-align: left;\n text-underline-position: from-font;\n text-decoration-skip-ink: none;\n margin-bottom: 10px;\n}\n\n.recommended__goods-prices {\n font-size: 16px;\n font-weight: 700;\n line-height: 22px;\n text-align: left;\n text-underline-position: from-font;\n text-decoration-skip-ink: none;\n margin-bottom: 46px;\n}\n\n/* #endregion */\n\n/* #region categories */\n\n.categories {\n display: flex;\n flex-direction: column;\n justify-content: left;\n align-items: center;\n color: #1b2129;\n font-family: Manrope, sans-serif;\n margin-top: -8px;\n margin-bottom: 96px;\n padding-left: 142px;\n}\n\n.main__section-categories__title {\n width: 100%;\n font-size: 32px;\n font-weight: 700;\n line-height: 32px;\n text-align: left;\n text-underline-position: from-font;\n text-decoration-skip-ink: none;\n margin-top: 66px;\n margin-bottom: 44px;\n margin-right: 136px;\n\n}\n\n.categories__box {\n width: 280px;\n height: 170px;\n display: flex;\n flex-direction: column;\n align-items: center;\n margin-bottom: 24px;\n margin-left: -150px;\n}\n\n.categories__box__image {\n width: 100%;\n height: 100%;\n display: flex;\n justify-content: left;\n flex-direction: row;\n gap: 20px;\n margin-bottom: 110px;\n\n\n\n}\n\n.categories__img {\n width: 100%;\n height: auto;\n overflow: hidden;\n\n}\n\n.categories__img img {\n transition: transform 0.25s;\n}\n\n.categories__img:hover {\n transform: scale(1.1);\n}\n\n.categories__box1__image-1, .categories__box2__image-1, .categories__box3__image-1 {\nmargin-right: 0;\n}\n\n.categories__box__title {\n width: 100%;\n font-size: 18px;\n font-weight: 700;\n line-height: 25;\n text-align: left;\n text-underline-position: from-font;\n text-decoration-skip-ink: none;\n margin-top: -346px;\n margin-bottom: -210px;\n}\n\n.categories__button {\n width: 280px;\n height: 56px;\n padding: 0 48px;\n gap: 0;\n border: none;\n border-radius: 8px;\n opacity: 1;\n display: block;\n text-align: center;\n background-color: #f98921;\n color: #fff;\n font-size: 16px;\n font-weight: 700;\n line-height: 27px;\n text-underline-position: from-font;\n text-decoration-skip-ink: none;\n margin-top: 0;\n margin-left: -150px;\n cursor: pointer;\n transition: all 0.3s ease;\n\n}\n\n.categories__button:hover {\n background-color: #1b2129;\n}\n\n.categories__button:active {\n background-color: #010810;\n}\n\n/* #endregion */\n\n/* #region about-us */\n\n.about-us {\n width: 100vw;\n height: 600px;\n display: flex;\n flex-direction: column;\n align-items: center;\n color: #1b2129;\n font-family: Manrope, sans-serif;\n background-color: #fcfaef;\n z-index: -1;\n}\n\n.about-us__img {\n box-sizing: border-box;\n width: 100%;\n height: 200px;\n background: url(../images/about-us.jpg) no-repeat center center;\n background-size: cover;\n position: relative;\n overflow: hidden;\n display: flex;\n z-index: 1;\n}\n\n.main__about-us__content{\n flex-direction: column;\n align-items: center;\n width: 100vw;\n\n\n}\n\n.about-us__title {\n width: 100%;\n margin-left: 16%;\n margin-top: 46px;\n margin-bottom: 26px;\n}\n\n.about-us__content {\n width: 100%;\n font-size: 16px;\n font-weight: 400;\n line-height: 22px;\n text-align: left;\n text-underline-position: from-font;\n text-decoration-skip-ink: none;\n margin-left: 16%;\n padding-bottom: 48px;\n padding-right: 30px;\n\n}\n\n/* #endregion */\n\n/* #region contact-us */\n\n.contact-us {\n display: flex;\n flex-direction: column;\n align-items: center;\n color: #1b2129;\n font-family: Manrope, sans-serif;\n margin-top: 0;\n}\n\n.contact-us__fields {\n width: 280px;\n margin-bottom: 4px;\n border: 1px solid #fff;\n border-radius: 10px;\n background-color: #fff;\n}\n\n.contact-us__fields__style {\n width: 264px;\n gap: 0;\n border-radius: 8px;\n opacity: 1;\n background-color: #f9f9f9;\n margin-bottom: 20px;\n border: 1px solid #f9f9f9;\n font-family: Manrope, sans-serif;\n font-size: 14px;\n font-weight: 400;\n line-height: 19px;\n text-align: left;\n text-underline-position: from-font;\n text-decoration-skip-ink: none;\n color: #7e7e83;\n}\n\n.contact-us__fields__style:hover {\n border: 1px solid #dbdbdb;\n background-color: #f9f9f9;\n color: #1B2129;\n}\n\n.contact-us__fields__style:focus {\n border: 2px solid #f98921;\n outline: none;\n background-color: #f9f9f9;\n color: #1B2129;\n}\n\n.contact-us__fields_info {\n height: 48px;\n padding-left: 16px;\n}\n\n.contact-us__fields__area {\n height: auto;\n min-height: 148px;\n padding: 16px 0 0 16px;\n gap: 10px;\n resize: none;\n}\n\n.contact-us__button {\n width: 264px;\n height: 56px;\n margin-top: 10px;\n gap: 0;\n border-radius: 8px;\n opacity: 1;\n background-color: #f98921;\n font-size: 16px;\n font-weight: 700;\n line-height: 27px;\n text-align: center;\n text-underline-position: from-font;\n text-decoration-skip-ink: none;\n color: #fff;\n border: none;\n padding-left: 48px;\n padding-right: 48px;\n cursor: pointer;\n transition: all 0.3s ease;\n}\n\n.contact-us__button:hover {\n background-color: #1b2129;\n}\n\n.contact-us__button:active {\n background-color: #010810;\n}\n\n\n/* #endregion */\n\n/* #region footer */\n\n.footer {\n width: 100%;\n display: flex;\n flex-direction: column;\n align-items: center;\n color: #1b2129;\n font-family: Manrope, sans-serif;\n padding-bottom: 50px;\n margin-top: 46px;\n margin-bottom: 10px;\n}\n\n.footer__title {\n width: 280px;\n font-family: Manrope, sans-serif;\n font-size: 14px;\n font-weight: 400;\n line-height: 19px;\n text-align: left;\n text-underline-position: from-font;\n text-decoration-skip-ink: none;\n color: #9393a3;\n margin-bottom: 10px;\n padding: 0;\n}\n\n.footer__content {\n margin-bottom: 20px;\n}\n\n\n\n.footer__content a:hover {\ntext-decoration: underline;\n}\n\n/* #endregion */\n\n@media (min-width: 768px) and (max-width: 1024px) {\n .header {\n width: 100%;\n margin: 0 auto;\n background-repeat: no-repeat;\n background-size: cover;\n background-position: center;\n }\n\n .top-bar {\n padding: 34px 48px ;\n background: none;\n margin-left: 70px;\n }\n\n .top-bar__logo {\n margin-left: -38px;\n margin-bottom: 20px;\n content: url(../images/Logo-tablet.svg);\n }\n\n .menu__content {\n margin-left: -44px;\n }\n\n .icon {\n background-repeat: no-repeat;\n position: relative;\n display: inline-block;\n cursor: pointer;\n }\n\n .icon--phone a{\n content: url(../images/Icon-Phone-call-tablet.svg);\n\n\n }\n\n .icon--phone:hover::before {\n content: '+1 234 555-55-55';\n display: flex;\n align-items: center;\n margin-left: -147px;\n padding: 0;\n white-space: nowrap;\n font-family: Inter,sans-serif;\n font-size: 12px;\n font-weight: 700;\n line-height: 16px;\n letter-spacing: 2px;\n text-align: right;\n text-underline-position: from-font;\n text-decoration-skip-ink: none;\n color: #1b2129;\n\n\n }\n\n .icon--menu a {\n content: url(../images/icon-burger-menu-tablet.svg);\n }\n\n .icon--menu {\n margin-top: 4px;\n }\n\n .icon--menu:hover {\n background-image: url(../images/icon-burger-menu-hover.svg);\n background-repeat: no-repeat;\n }\n\n\n h1 {\n padding-left: 26px;\n font-size: 48px;\n font-weight: 700;\n line-height: 48px;\n }\n\n .icon--close {\n content: url(../images/icon-close-tablet.svg);\n background-repeat: no-repeat;\n }\n\n .nav__list {\n margin-left: 102px;\n }\n\n .nav__link {\n display: flex;\n flex-direction: column;\n padding-left: 100px;\n }\n\n .menu__phone-number,\n .menu__call-to-order {\n margin-left: 100px;\n }\n\n .tablet {\n width: 744px;\n margin: 0 auto;\n }\n\n .main__section__title {\n font-size: 40px;\n line-height: 40px;\n margin-left: 150px;\n }\n\n .recommended__tablet {\n width: 100%;\n margin-left: 10px;\n }\n\n .recommended__img {\n width: 600px;\n height: 600px;\n }\n\n .recommended__beosound-a5__img img {\n content: url(../images/b-a5-tablet.jpg);\n }\n\n .recommended__goods-title {\n margin-top: 18px;\n margin-bottom: 6px;\n }\n\n .recommended__goods-content {\n width: 586px;\n margin-bottom: 30px;\n }\n\n .hidden-br {\n display: none;\n }\n\n .recommended__beoplay__img img {\n content: url(../images/beoplay-tablet.jpg);\n }\n\n .recommended__beosound-theatre__img {\n content: url(../images/b-theatre-tablet.jpg);\n }\n\n .categories {\n margin-bottom: 120px;\n }\n\n .main__section-categories__title {\n font-size: 40px;\n line-height: 40px;\n margin-left: 12px;\n\n }\n\n .categories__box {\n width: 600px;\n height: 234px;\n margin-left: -120px;\n }\n\n .categories__box__title {\n font-size: 24px;\n font-weight: 700;\n line-height: 33px;\n margin-top: -104px;\n margin-bottom: 12px;\n }\n\n .categories__img {\n width: 288px;\n height: auto;\n margin-right: 6px;\n }\n\n .categories__box1__image-1 {\n content: url(../images/box1-1-tablet.jpg);\n }\n\n .categories__box1__image-2 {\n content: url(../images/box1-2-tablet.jpg);\n }\n\n .categories__box2__image-1 {\n content: url(../images/box2-1-tablet.jpg);\n }\n\n .categories__box2__image-2 {\n content: url(../images/box2-2-tablet.jpg);\n }\n\n .categories__box3__image-1 {\n content: url(../images/box3-1-tablet.jpg);\n }\n\n .categories__box3__image-2 {\n content: url(../images/box3-2-tablet.jpg);\n }\n\n .categories__button {\n width: 600px;\n margin-left: -124px;\n }\n\n .about-us {\n width: 100vw;\n height: 800px;\n margin: 0 auto;\n background-size: cover;\n }\n\n .about-us__img {\n box-sizing: border-box;\n width: 100%;\n height: 400px;\n background: url(../images/about-us-tablet.jpg) no-repeat center center;\n background-size: cover;\n\n }\n\n .main__about-us__content {\n width: 100%;\n display: flex;\n flex-direction: row;\n justify-content: space-around;\n gap: 0;\n padding: 0 30px;\n }\n\n .about-us__title {\n width: 450px;\n margin-top: 42px;\n margin-left: 46px;\n }\n\n .dell-br {\n display: none;\n }\n\n .about-us__content {\n width: 488px;\n margin-top: 122px;\n margin-right: 54px;\n margin-left: 34px;\n }\n\n .contact-us{\n margin-top: 46px;\n }\n\n .contact-us__fields {\n display: flex;\n flex-direction: column;\n width: 100%;\n margin-left: 158px;\n }\n\n .contact-us__fields__style {\n width: 600px;\n }\n\n .contact-us__button {\n width: 600px;\n }\n\n .footer {\n width: 100%;\n display: flex;\n margin-left: -150px;\n margin-bottom: 60px;\n margin-top: 70px;\n }\n}\n\n@media (min-width: 1025px) {\n\n .page_body {\n position: relative;\n }\n\n .header {\n width: 100%;\n height: 720px;\n margin: 0 auto;\n }\n\n .top-bar__logo {\n content: url(../images/Logo-tablet.svg);\n padding-left: 100px;\n padding-top: 10px;\n }\n\n .top-bar {\n padding: 24px 38px;\n background: none;\n margin-left: -18px;\n }\n\n\n .top-bar__icons {\n margin-right: 74px;\n }\n\n .icon {\n background-repeat: no-repeat;\n position: relative;\n display: inline-block;\n cursor: pointer;\n }\n\n .icon--phone a {\n content: url(../images/Icon-Phone-call-tablet.svg);\n }\n\n\n .icon--phone:hover::before {\n content: '+1 234 555-55-55';\n display: flex;\n align-items: center;\n margin-left: -147px;\n padding: 0;\n white-space: nowrap;\n font-size: 12px;\n font-weight: 700;\n line-height: 16px;\n letter-spacing: 2px;\n text-align: right;\n text-underline-position: from-font;\n text-decoration-skip-ink: none;\n color: #1b2129;\n }\n\n .icon--menu {\n margin-top: 4px;\n }\n\n .icon--menu a {\n content: url(../images/icon-burger-menu-tablet.svg);\n }\n\n .icon--menu:hover {\n background-image: url(../images/icon-burger-menu-hover.svg);\n background-repeat: no-repeat;\n }\n\n h1 {\n padding-left: 68px;\n padding-bottom: 10px;\n font-size: 56px;\n font-weight: 700;\n line-height: 56px;\n\n }\n\n .menu__content {\n margin-left: -4px;\n margin-top: 60px;\n }\n\n .icon--close {\n content: url(../images/icon-close-tablet.svg);\n background-repeat: no-repeat;\n margin-right: 82px;\n }\n\n .nav__list {\n margin-left: 102px;\n }\n\n .nav__link {\n display: flex;\n flex-direction: column;\n padding-left: 100px;\n }\n\n .nav__link:hover {\n text-decoration: underline;\n }\n\n .menu__phone-number,\n .menu__call-to-order {\n margin-left: 100px;\n }\n\n .laptop {\n width: 1000px;\n }\n\n .recommended {\n width: 100%;\n margin-top: 52px;\n\n }\n\n .recommended__laptop {\n box-sizing: border-box;\n width: 1012px;\n display: flex;\n justify-content: center;\n gap: 20px;\n margin-left: 30px;\n\n }\n\n .recommended__img {\n width:100%;\n height: auto;\n }\n\n .recommended__beosound-a5__img img {\n content: url(../images/b-a5-laptop.jpg);\n }\n\n .recommended__beoplay__img img {\n content: url(../images/beoplay-laptop.jpg);\n }\n\n .recommended__beosound-theatre__img {\n content: url(../images/b-theatre-laptop.jpg);\n }\n\n .main__section__title {\n width: 100%;\n display: flex;\n justify-content: center;\n margin-left: -632px;\n font-size: 48px;\n font-weight: 700;\n line-height: 48px;\n\n }\n\n .categories__img {\n width: 498px;\n height: auto;\n margin-right: 0;\n }\n\n .categories__box1__image-1 {\n content: url(../images/box1-1-laptop.jpg);\n }\n\n .categories__box1__image-2 {\n content: url(../images/box1-2-laptop.jpg);\n }\n\n .categories__box2__image-1 {\n content: url(../images/box2-1-laptop.jpg);\n }\n\n .categories__box2__image-2 {\n content: url(../images/box2-2-laptop.jpg);\n }\n\n .categories__box3__image-1 {\n content: url(../images/box3-1-laptop.jpg);\n }\n\n .categories__box3__image-2 {\n content: url(../images/box3-2-laptop.jpg);\n }\n\n .main__section-categories__title{\n margin-left: -120px;\n font-size: 48px;\n font-weight: 700;\n line-height: 48px;\n margin-bottom: 48px;\n }\n\n .categories__box {\n width: 1020px;\n height: 374px;\n margin-left: -110px;\n }\n\n .categories__box__title{\n font-size: 24px;\n font-weight: 700;\n line-height: 33px;\n margin-top: -100px;\n margin-bottom: 30px;\n }\n\n .categories__button{\n margin-top: 10px;\n margin-left: -567px;\n }\n\n .about-us {\n width: 100%;\n height: 860px;\n margin: 0 auto;\n margin-top: 36px;\n\n }\n\n .about-us__img {\n height: 460px;\n background: url(../images/about-us-laptop.jpg) no-repeat center center;\n background-size: cover;\n }\n\n .main__about-us__content {\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: space-around;\n gap: 70px;\n padding: 160px 30px 120px;\n margin-left: -150px;\n }\n\n .about-us__title {\n width: 498px;\n height: 96px;\n margin-top: -24px;\n margin-left: 156px;\n margin-right: 20px;\n font-size: 48px;\n font-weight: 700;\n line-height: 48px;\n\n\n }\n .about-us__content {\n width: 411px;\n height: 110px;\n margin-top: -30px;\n margin-right: -70px;\n font-size: 16px;\n font-weight: 400;\n line-height: 22px;\n text-align: left;\n text-underline-position: from-font;\n text-decoration-skip-ink: none;\n padding-right: 0;\n margin-left: -60px;\n\n }\n\n .dell-br {\n display: none;\n }\n\n .contact-us{\n width: 1260px;\n margin: 50px auto 0;\n\n }\n\n .contact-us__fields {\n display: flex;\n flex-direction: column;\n width: 498px;\n margin-left: -396px;\n margin-bottom: 100px;\n }\n\n .contact-us__fields__style {\n width: 498px;\n }\n\n .contact-us__button {\n width: 498px;\n }\n\n\n body, html {\n height: 100%;\n margin: 0;\n }\n\n .content {\n min-height: 100%;\n padding-bottom: 244px;\n box-sizing: border-box;\n }\n\n .footer-position {\n position: relative;\n display: block;\n width: 1260px;\n height: 0;\n margin: 0 auto;\n margin-bottom: 0;\n padding-left: 357px;\n\n }\n\n\n .footer {\n width: 411px;\n height: 211px;\n display: block;\n position: absolute;\n left: 78%;\n transform: translateX(-50%);\n top: -520px;\n z-index: 3;\n background: none;\n\n }\n\n}\n"],"names":[],"version":3,"file":"index.6a72f8a9.css.map"} \ No newline at end of file diff --git a/index.971c2ea4.css b/index.971c2ea4.css new file mode 100644 index 0000000000..034cad7aea --- /dev/null +++ b/index.971c2ea4.css @@ -0,0 +1,1139 @@ +* { + box-sizing: border-box; + margin: 0; + padding: 0; + transition: all .3s; +} + +a:hover, button:hover, .hover-effect:hover { + text-decoration: none; + transform: scale(1.1); +} + +.page { + color: #1b2129; + scroll-behavior: smooth; + font-family: Manrope, sans-serif; + font-size: 16px; + line-height: 22px; +} + +.page:has(.page__menu:target) { + overflow: hidden; +} + +.page_body { + max-width: 100vw; + margin: 0; + overflow-x: hidden; +} + +img { + max-width: 100%; + height: auto; +} + +.page__menu { + opacity: 0; + pointer-events: none; + transition: opacity .3s, transform .3s; + position: fixed; + top: 0; + left: 0; + right: 0; + transform: translateY(-100%); +} + +.page__menu:target { + opacity: 1; + pointer-events: all; + transform: translateY(0); +} + +.no-scroll { + overflow: hidden; +} + +.header { + box-sizing: border-box; + background-image: url("header-bg-mobile.2d58f869.png"); + background-position: center; + background-repeat: no-repeat; + background-size: cover; + flex-direction: column; + justify-content: space-between; + width: 100%; + height: 586px; + margin: 0 auto; + padding: 0; + display: flex; +} + +h1 { + color: #fff; + margin-left: 28px; + font-size: 36px; + font-weight: 700; + line-height: 36px; +} + +.header__bottom { + padding: 0 20px 40px; +} + +.top-bar { + justify-content: space-between; + align-items: center; + margin-left: 24px; + padding: 24px 20px; + display: flex; +} + +.top-bar__icons { + gap: 28px; + display: flex; +} + +.top-bar__logo { + display: flex; +} + +.menu { + box-sizing: border-box; + background-color: #f9f9f9; + height: 100vh; + font-weight: 700; + overflow: auto; +} + +.menu__top { + z-index: 1; + background: none; + margin-bottom: 30px; + margin-left: 0; + position: sticky; + top: 0; +} + +.menu__nav { + margin-bottom: 45px; +} + +.nav__item a { + padding: 0; +} + +.footer__content a { + text-align: left; + text-underline-position: from-font; + text-decoration-skip-ink: none; + color: #191919; + width: 280px; + font-size: 16px; + font-weight: 400; + line-height: 22px; + text-decoration: none; +} + +.nav__item a:hover { + border-bottom: 1px solid #1b2129; + padding-bottom: 3px; + text-decoration: none; + display: inline-block; +} + +.menu__content { + padding-inline: 20px; +} + +.menu__phone-number { + color: inherit; + margin-bottom: 18px; + font-size: 16px; + line-height: 22px; + text-decoration: none; + display: block; +} + +.menu__call-to-order { + color: inherit; + letter-spacing: 2px; + text-transform: uppercase; + border-bottom: 1px solid #1b2129; + width: fit-content; + padding-bottom: 3px; + font-size: 16px; + line-height: 22px; + text-decoration: none; + display: block; +} + +.contact-change-color:hover { + color: #000; +} + +.nav__link { + color: inherit; + font-size: 22px; + line-height: 22px; + text-decoration: none; +} + +.nav__list { + flex-direction: column; + gap: 29px; + margin: 0; + padding: 0; + list-style: none; + display: flex; +} + +.icon { + width: 24px; + height: 24px; + display: block; +} + +.icon:hover { + color: #000; +} + +.icon--phone { + background-image: url("icon-phone-call.62beee63.svg"); + background-repeat: no-repeat; +} + +.icon--menu { + background-image: url("icon-burger-menu.335e891c.svg"); + background-repeat: no-repeat; +} + +.icon--close { + background-image: url("icon-close.cac3d951.svg"); + background-repeat: no-repeat; +} + +.main { + flex-direction: column; + align-items: center; + margin: 0; + padding: 0; + display: flex; +} + +.recommended { + color: #1b2129; + flex-direction: column; + align-items: center; + font-family: Manrope, sans-serif; + display: flex; +} + +.main__section__title { + text-align: left; + text-underline-position: from-font; + text-decoration-skip-ink: none; + width: 100%; + margin-top: 64px; + margin-bottom: 50px; + font-size: 32px; + font-weight: 700; + line-height: 32px; +} + +.recommended__img { + width: 280px; + height: 280px; + overflow: hidden; +} + +.recommended__img img { + transition: transform .25s; +} + +.recommended__img:hover { + transform: scale(1.1); +} + +.recommended__goods-title { + text-align: left; + text-underline-position: from-font; + text-decoration-skip-ink: none; + margin-top: 24px; + margin-bottom: 10px; + font-size: 18px; + font-weight: 700; + line-height: 25px; +} + +.recommended__goods-content { + text-align: left; + text-underline-position: from-font; + text-decoration-skip-ink: none; + margin-bottom: 10px; + font-size: 16px; + font-weight: 400; + line-height: 22px; +} + +.recommended__goods-prices { + text-align: left; + text-underline-position: from-font; + text-decoration-skip-ink: none; + margin-bottom: 46px; + font-size: 16px; + font-weight: 700; + line-height: 22px; +} + +.categories { + color: #1b2129; + flex-direction: column; + justify-content: left; + align-items: center; + margin-top: -8px; + margin-bottom: 96px; + padding-left: 142px; + font-family: Manrope, sans-serif; + display: flex; +} + +.main__section-categories__title { + text-align: left; + text-underline-position: from-font; + text-decoration-skip-ink: none; + width: 100%; + margin-top: 66px; + margin-bottom: 44px; + margin-right: 136px; + font-size: 32px; + font-weight: 700; + line-height: 32px; +} + +.categories__box { + flex-direction: column; + align-items: center; + width: 280px; + height: 170px; + margin-bottom: 24px; + margin-left: -150px; + display: flex; +} + +.categories__box__image { + flex-direction: row; + justify-content: left; + gap: 20px; + width: 100%; + height: 100%; + margin-bottom: 110px; + display: flex; +} + +.categories__img { + width: 100%; + height: auto; + overflow: hidden; +} + +.categories__img img { + transition: transform .25s; +} + +.categories__img:hover { + transform: scale(1.1); +} + +.categories__box1__image-1, .categories__box2__image-1, .categories__box3__image-1 { + margin-right: 0; +} + +.categories__box__title { + text-align: left; + text-underline-position: from-font; + text-decoration-skip-ink: none; + width: 100%; + margin-top: -346px; + margin-bottom: -210px; + font-size: 18px; + font-weight: 700; + line-height: 25; +} + +.categories__button { + opacity: 1; + text-align: center; + color: #fff; + text-underline-position: from-font; + text-decoration-skip-ink: none; + cursor: pointer; + background-color: #f98921; + border: none; + border-radius: 8px; + gap: 0; + width: 280px; + height: 56px; + margin-top: 0; + margin-left: -150px; + padding: 0 48px; + font-size: 16px; + font-weight: 700; + line-height: 27px; + transition: all .3s; + display: block; +} + +.categories__button:hover { + background-color: #1b2129; +} + +.categories__button:active { + background-color: #010810; +} + +.about-us { + color: #1b2129; + z-index: -1; + background-color: #fcfaef; + flex-direction: column; + align-items: center; + width: 100vw; + height: 600px; + font-family: Manrope, sans-serif; + display: flex; +} + +.about-us__img { + box-sizing: border-box; + z-index: 1; + background: url("about-us.47089261.jpg") center / cover no-repeat; + width: 100%; + height: 200px; + display: flex; + position: relative; + overflow: hidden; +} + +.main__about-us__content { + flex-direction: column; + align-items: center; + width: 100vw; +} + +.about-us__title { + width: 100%; + margin-top: 46px; + margin-bottom: 26px; + margin-left: 16%; +} + +.about-us__content { + text-align: left; + text-underline-position: from-font; + text-decoration-skip-ink: none; + width: 100%; + margin-left: 16%; + padding-bottom: 48px; + padding-right: 30px; + font-size: 16px; + font-weight: 400; + line-height: 22px; +} + +.contact-us { + color: #1b2129; + flex-direction: column; + align-items: center; + margin-top: 0; + font-family: Manrope, sans-serif; + display: flex; +} + +.contact-us__fields { + background-color: #fff; + border: 1px solid #fff; + border-radius: 10px; + width: 280px; + margin-bottom: 4px; +} + +.contact-us__fields__style { + opacity: 1; + text-align: left; + text-underline-position: from-font; + text-decoration-skip-ink: none; + color: #7e7e83; + background-color: #f9f9f9; + border: 1px solid #f9f9f9; + border-radius: 8px; + gap: 0; + width: 264px; + margin-bottom: 20px; + font-family: Manrope, sans-serif; + font-size: 14px; + font-weight: 400; + line-height: 19px; +} + +.contact-us__fields__style:hover { + color: #1b2129; + background-color: #f9f9f9; + border: 1px solid #dbdbdb; +} + +.contact-us__fields__style:focus { + color: #1b2129; + background-color: #f9f9f9; + border: 2px solid #f98921; + outline: none; +} + +.contact-us__fields_info { + height: 48px; + padding-left: 16px; +} + +.contact-us__fields__area { + resize: none; + gap: 10px; + height: auto; + min-height: 148px; + padding: 16px 0 0 16px; +} + +.contact-us__button { + opacity: 1; + text-align: center; + text-underline-position: from-font; + text-decoration-skip-ink: none; + color: #fff; + cursor: pointer; + background-color: #f98921; + border: none; + border-radius: 8px; + gap: 0; + width: 264px; + height: 56px; + margin-top: 10px; + padding-left: 48px; + padding-right: 48px; + font-size: 16px; + font-weight: 700; + line-height: 27px; + transition: all .3s; +} + +.contact-us__button:hover { + background-color: #1b2129; +} + +.contact-us__button:active { + background-color: #010810; +} + +.footer { + color: #1b2129; + flex-direction: column; + align-items: center; + width: 100%; + margin-top: 46px; + margin-bottom: 10px; + padding-bottom: 50px; + font-family: Manrope, sans-serif; + display: flex; +} + +.footer__title { + text-align: left; + text-underline-position: from-font; + text-decoration-skip-ink: none; + color: #9393a3; + width: 280px; + margin-bottom: 10px; + padding: 0; + font-family: Manrope, sans-serif; + font-size: 14px; + font-weight: 400; + line-height: 19px; +} + +.footer__content { + margin-bottom: 20px; +} + +.footer__content a:hover { + text-decoration: underline; +} + +@media (width >= 768px) and (width <= 1024px) { + .header { + background-position: center; + background-repeat: no-repeat; + background-size: cover; + width: 100%; + margin: 0 auto; + } + + .top-bar { + background: none; + margin-left: 70px; + padding: 34px 48px; + } + + .top-bar__logo { + content: url("Logo-tablet.397e04bf.svg"); + margin-bottom: 20px; + margin-left: -38px; + } + + .menu__content { + margin-left: -44px; + } + + .icon { + cursor: pointer; + background-repeat: no-repeat; + display: inline-block; + position: relative; + } + + .icon--phone a { + content: url("Icon-Phone-call-tablet.37b8d2be.svg"); + } + + .icon--phone:hover:before { + content: "+1 234 555-55-55"; + white-space: nowrap; + letter-spacing: 2px; + text-align: right; + text-underline-position: from-font; + text-decoration-skip-ink: none; + color: #1b2129; + align-items: center; + margin-left: -147px; + padding: 0; + font-family: Inter, sans-serif; + font-size: 12px; + font-weight: 700; + line-height: 16px; + display: flex; + } + + .icon--menu a { + content: url("icon-burger-menu-tablet.733cd3a2.svg"); + } + + .icon--menu { + margin-top: 4px; + } + + .icon--menu:hover { + background-image: url("icon-burger-menu-hover.c52aa833.svg"); + background-repeat: no-repeat; + } + + h1 { + padding-left: 26px; + font-size: 48px; + font-weight: 700; + line-height: 48px; + } + + .icon--close { + content: url("icon-close-tablet.9644684e.svg"); + background-repeat: no-repeat; + } + + .nav__list { + margin-left: 102px; + } + + .nav__link { + flex-direction: column; + padding-left: 100px; + display: flex; + } + + .menu__phone-number, .menu__call-to-order { + margin-left: 100px; + } + + .tablet { + width: 744px; + margin: 0 auto; + } + + .main__section__title { + margin-left: 150px; + font-size: 40px; + line-height: 40px; + } + + .recommended__tablet { + width: 100%; + margin-left: 10px; + } + + .recommended__img { + width: 600px; + height: 600px; + } + + .recommended__beosound-a5__img img { + content: url("b-a5-tablet.1200cac4.jpg"); + } + + .recommended__goods-title { + margin-top: 18px; + margin-bottom: 6px; + } + + .recommended__goods-content { + width: 586px; + margin-bottom: 30px; + } + + .hidden-br { + display: none; + } + + .recommended__beoplay__img img { + content: url("beoplay-tablet.4cdfb6de.jpg"); + } + + .recommended__beosound-theatre__img { + content: url("b-theatre-tablet.eabecebf.jpg"); + } + + .categories { + margin-bottom: 120px; + } + + .main__section-categories__title { + margin-left: 12px; + font-size: 40px; + line-height: 40px; + } + + .categories__box { + width: 600px; + height: 234px; + margin-left: -120px; + } + + .categories__box__title { + margin-top: -104px; + margin-bottom: 12px; + font-size: 24px; + font-weight: 700; + line-height: 33px; + } + + .categories__img { + width: 288px; + height: auto; + margin-right: 6px; + } + + .categories__box1__image-1 { + content: url("box1-1-tablet.4d969cf9.jpg"); + } + + .categories__box1__image-2 { + content: url("box1-2-tablet.a49ba32b.jpg"); + } + + .categories__box2__image-1 { + content: url("box2-1-tablet.a92ee1c5.jpg"); + } + + .categories__box2__image-2 { + content: url("box2-2-tablet.0006da27.jpg"); + } + + .categories__box3__image-1 { + content: url("box3-1-tablet.0a1c3332.jpg"); + } + + .categories__box3__image-2 { + content: url("box3-2-tablet.9fb0d62b.jpg"); + } + + .categories__button { + width: 600px; + margin-left: -124px; + } + + .about-us { + background-size: cover; + width: 100vw; + height: 800px; + margin: 0 auto; + } + + .about-us__img { + box-sizing: border-box; + background: url("about-us-tablet.dd0875d5.jpg") center / cover no-repeat; + width: 100%; + height: 400px; + } + + .main__about-us__content { + flex-direction: row; + justify-content: space-around; + gap: 0; + width: 100%; + padding: 0 30px; + display: flex; + } + + .about-us__title { + width: 450px; + margin-top: 42px; + margin-left: 46px; + } + + .dell-br { + display: none; + } + + .about-us__content { + width: 488px; + margin-top: 122px; + margin-left: 34px; + margin-right: 54px; + } + + .contact-us { + margin-top: 46px; + } + + .contact-us__fields { + flex-direction: column; + width: 100%; + margin-left: 158px; + display: flex; + } + + .contact-us__fields__style, .contact-us__button { + width: 600px; + } + + .footer { + width: 100%; + margin-top: 70px; + margin-bottom: 60px; + margin-left: -150px; + display: flex; + } +} + +@media (width >= 1025px) { + .page_body { + position: relative; + } + + .header { + width: 100%; + height: 720px; + margin: 0 auto; + } + + .top-bar__logo { + content: url("Logo-tablet.397e04bf.svg"); + padding-top: 10px; + padding-left: 100px; + } + + .top-bar { + background: none; + margin-left: -18px; + padding: 24px 38px; + } + + .top-bar__icons { + margin-right: 74px; + } + + .icon { + cursor: pointer; + background-repeat: no-repeat; + display: inline-block; + position: relative; + } + + .icon--phone a { + content: url("Icon-Phone-call-tablet.37b8d2be.svg"); + } + + .icon--phone:hover:before { + content: "+1 234 555-55-55"; + white-space: nowrap; + letter-spacing: 2px; + text-align: right; + text-underline-position: from-font; + text-decoration-skip-ink: none; + color: #1b2129; + align-items: center; + margin-left: -147px; + padding: 0; + font-size: 12px; + font-weight: 700; + line-height: 16px; + display: flex; + } + + .icon--menu { + margin-top: 4px; + } + + .icon--menu a { + content: url("icon-burger-menu-tablet.733cd3a2.svg"); + } + + .icon--menu:hover { + background-image: url("icon-burger-menu-hover.c52aa833.svg"); + background-repeat: no-repeat; + } + + h1 { + padding-bottom: 10px; + padding-left: 68px; + font-size: 56px; + font-weight: 700; + line-height: 56px; + } + + .menu__content { + margin-top: 60px; + margin-left: -4px; + } + + .icon--close { + content: url("icon-close-tablet.9644684e.svg"); + background-repeat: no-repeat; + margin-right: 82px; + } + + .nav__list { + margin-left: 102px; + } + + .nav__link { + flex-direction: column; + padding-left: 100px; + display: flex; + } + + .nav__link:hover { + text-decoration: underline; + } + + .menu__phone-number, .menu__call-to-order { + margin-left: 100px; + } + + .laptop { + width: 1000px; + } + + .recommended { + width: 100%; + margin-top: 52px; + } + + .recommended__laptop { + box-sizing: border-box; + justify-content: center; + gap: 20px; + width: 1012px; + margin-left: 30px; + display: flex; + } + + .recommended__img { + width: 100%; + height: auto; + } + + .recommended__beosound-a5__img img { + content: url("b-a5-laptop.78417735.jpg"); + } + + .recommended__beoplay__img img { + content: url("beoplay-laptop.30b14bf9.jpg"); + } + + .recommended__beosound-theatre__img { + content: url("b-theatre-laptop.56b8c57c.jpg"); + } + + .main__section__title { + justify-content: center; + width: 100%; + margin-left: -632px; + font-size: 48px; + font-weight: 700; + line-height: 48px; + display: flex; + } + + .categories__img { + width: 498px; + height: auto; + margin-right: 0; + } + + .categories__box1__image-1 { + content: url("box1-1-laptop.ae23a954.jpg"); + } + + .categories__box1__image-2 { + content: url("box1-2-laptop.935ea3f0.jpg"); + } + + .categories__box2__image-1 { + content: url("box2-1-laptop.f5e739f9.jpg"); + } + + .categories__box2__image-2 { + content: url("box2-2-laptop.1482ecd4.jpg"); + } + + .categories__box3__image-1 { + content: url("box3-1-laptop.81c1041a.jpg"); + } + + .categories__box3__image-2 { + content: url("box3-2-laptop.b7993bed.jpg"); + } + + .main__section-categories__title { + margin-bottom: 48px; + margin-left: -120px; + font-size: 48px; + font-weight: 700; + line-height: 48px; + } + + .categories__box { + width: 1020px; + height: 374px; + margin-left: -110px; + } + + .categories__box__title { + margin-top: -100px; + margin-bottom: 30px; + font-size: 24px; + font-weight: 700; + line-height: 33px; + } + + .categories__button { + margin-top: 10px; + margin-left: -567px; + } + + .about-us { + width: 100%; + height: 860px; + margin: 36px auto 0; + } + + .about-us__img { + background: url("about-us-laptop.15af8c09.jpg") center / cover no-repeat; + height: 460px; + } + + .main__about-us__content { + flex-direction: row; + justify-content: space-around; + align-items: center; + gap: 70px; + margin-left: -150px; + padding: 160px 30px 120px; + display: flex; + } + + .about-us__title { + width: 498px; + height: 96px; + margin-top: -24px; + margin-left: 156px; + margin-right: 20px; + font-size: 48px; + font-weight: 700; + line-height: 48px; + } + + .about-us__content { + text-align: left; + text-underline-position: from-font; + text-decoration-skip-ink: none; + width: 411px; + height: 110px; + margin-top: -30px; + margin-left: -60px; + margin-right: -70px; + padding-right: 0; + font-size: 16px; + font-weight: 400; + line-height: 22px; + } + + .dell-br { + display: none; + } + + .contact-us { + width: 1260px; + margin: 50px auto 0; + } + + .contact-us__fields { + flex-direction: column; + width: 498px; + margin-bottom: 100px; + margin-left: -396px; + display: flex; + } + + .contact-us__fields__style, .contact-us__button { + width: 498px; + } + + body, html { + height: 100%; + margin: 0; + } + + .content { + box-sizing: border-box; + min-height: 100%; + padding-bottom: 244px; + } + + .footer-position { + width: 1260px; + height: 0; + margin: 0 auto; + padding-left: 357px; + display: block; + position: relative; + } + + .footer { + z-index: 3; + background: none; + width: 411px; + height: 211px; + display: block; + position: absolute; + top: -520px; + left: 78%; + transform: translateX(-50%); + } +} +/*# sourceMappingURL=index.971c2ea4.css.map */ diff --git a/index.971c2ea4.css.map b/index.971c2ea4.css.map new file mode 100644 index 0000000000..1a3ba14680 --- /dev/null +++ b/index.971c2ea4.css.map @@ -0,0 +1 @@ +{"mappings":"AACA;;;;;;;AAOA;;;;;AAQA;;;;;;;;AAQA;;;;AAIA;;;;;;AAMA;;;;;AAKA;;;;;;;;;;;AAaA;;;;;;AAMA;;;;AAQA;;;;;;;;;;;;;;;AAiBC;;;;;;;;AAQD;;;;AAQA;;;;;;;;AAQA;;;;;AAKA;;;;AAIA;;;;;;;;AAQA;;;;;;;;;AASA;;;;AAIA;;;;AAIA;;;;;;;;;;;;AAYA;;;;;;;AAOA;;;;AAIA;;;;;;;;;AASA;;;;;;;;;;;;;AAaA;;;;AAQA;;;;;;;AAOA;;;;;;;;;AAaA;;;;;;AAMA;;;;AAIA;;;;;AAKA;;;;;AAKA;;;;;AASA;;;;;;;;AAYA;;;;;;;;AAQA;;;;;;;;;;;;AAYA;;;;;;AAMA;;;;AAIA;;;;AAKA;;;;;;;;;;;AAWA;;;;;;;;;;AAUA;;;;;;;;;;AAcA;;;;;;;;;;;;AAYA;;;;;;;;;;;;;AAcA;;;;;;;;;;AAUA;;;;;;;;;;AAaA;;;;;;AAOA;;;;AAIA;;;;AAIA;;;;AAIA;;;;;;;;;;;;AAYA;;;;;;;;;;;;;;;;;;;;;;;AAwBA;;;;AAIA;;;;AAQA;;;;;;;;;;;;AAYA;;;;;;;;;;;AAYA;;;;;;AASA;;;;;;;AAOA;;;;;;;;;;;;;AAkBA;;;;;;;;;AASA;;;;;;;;AAQA;;;;;;;;;;;;;;;;;;AAkBA;;;;;;AAMA;;;;;;;AAOA;;;;;AAKA;;;;;;;;AAQA;;;;;;;;;;;;;;;;;;;;;;AAsBA;;;;AAIA;;;;AASA;;;;;;;;;;;;AAYA;;;;;;;;;;;;;;AAcA;;;;AAMA;;;;AAMA;EACE;;;;;;;;EAQA;;;;;;EAMA;;;;;;EAMA;;;;EAIA;;;;;;;EAOA;;;;EAMA;;;;;;;;;;;;;;;;;;EAoBA;;;;EAIA;;;;EAIA;;;;;EAMA;;;;;;;EAOA;;;;;EAKA;;;;EAIA;;;;;;EAMA;;;;EAKA;;;;;EAKA;;;;;;EAMA;;;;;EAKA;;;;;EAKA;;;;EAIA;;;;;EAKA;;;;;EAKA;;;;EAIA;;;;EAIA;;;;EAIA;;;;EAIA;;;;;;EAOA;;;;;;EAMA;;;;;;;;EAQA;;;;;;EAMA;;;;EAIA;;;;EAIA;;;;EAIA;;;;EAIA;;;;EAIA;;;;EAIA;;;;;EAKA;;;;;;;EAOA;;;;;;;EASA;;;;;;;;;EASA;;;;;;EAMD;;;;EAIC;;;;;;;EAOA;;;;EAIA;;;;;;;EAOA;;;;EAQA;;;;;;;;;AASF;EAEE;;;;EAIA;;;;;;EAMA;;;;;;EAMA;;;;;;EAOA;;;;EAIA;;;;;;;EAOA;;;;EAKA;;;;;;;;;;;;;;;;;EAiBA;;;;EAIA;;;;EAIA;;;;;EAKA;;;;;;;;EASA;;;;;EAKA;;;;;;EAMA;;;;EAIA;;;;;;EAMA;;;;EAIA;;;;EAKA;;;;EAIA;;;;;EAMA;;;;;;;;;EAUA;;;;;EAKA;;;;EAIA;;;;EAIA;;;;EAIA;;;;;;;;;;EAWA;;;;;;EAMA;;;;EAIA;;;;EAIA;;;;EAIA;;;;EAIA;;;;EAIA;;;;EAIA;;;;;;;;EAQA;;;;;;EAMA;;;;;;;;EAQA;;;;;EAKA;;;;;;EAQA;;;;;EAMA;;;;;;;;;;EAWA;;;;;;;;;;;EAYA;;;;;;;;;;;;;;;EAgBA;;;;EAIA;;;;;EAMA;;;;;;;;EAQA;;;;EASA;;;;;EAKA;;;;;;EAMA;;;;;;;;;EAYA","sources":["src/styles/main.scss"],"sourcesContent":["/* #region body */\n* {\n box-sizing: border-box;\n margin: 0;\n padding: 0;\n transition: all 0.3s ease;\n}\n\na:hover,\nbutton:hover,\n.hover-effect:hover {\n transform: scale(1.1);\n text-decoration: none;\n }\n\n\n.page {\n font-family: Manrope, sans-serif;\n color: #1b2129;\n font-size: 16px;\n line-height: 22px;\n scroll-behavior: smooth;\n}\n\n.page:has(.page__menu:target) {\n overflow: hidden;\n}\n\n.page_body {\n max-width: 100vw;\n overflow-x: hidden;\n margin: 0;\n}\n\nimg {\n max-width: 100%;\n height: auto;\n}\n\n.page__menu {\n position: fixed;\n top: 0;\n right: 0;\n left: 0;\n opacity: 0;\n pointer-events: none;\n transform: translateY(-100%);\n transition:\n opacity 0.3s ease,\n transform 0.3s ease;\n}\n\n.page__menu:target {\n opacity: 1;\n pointer-events: all;\n transform: translateY(0);\n}\n\n.no-scroll {\n overflow: hidden;\n}\n\n/* #endregion */\n\n/* #region header */\n\n.header {\n box-sizing: border-box;\n width: 100%;\n height: 586px;\n background-image: url(../images/header-bg-mobile.png);\n background-repeat: no-repeat;\n background-size: cover;\n background-position: center;\n\n padding: 0;\n margin: 0 auto;\n\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n}\n\n h1 {\n font-size: 36px;\n line-height: 36px;\n font-weight: 700;\n color: #fff;\n margin-left: 28px;\n}\n\n.header__bottom {\n padding: 0 20px 40px;\n}\n\n/* #endregion */\n\n/* #region menu */\n\n.top-bar {\n padding: 24px 20px;\n display: flex;\n justify-content: space-between;\n align-items: center;\n margin-left: 24px;\n}\n\n.top-bar__icons {\n display: flex;\n gap: 28px;\n}\n\n.top-bar__logo {\n display: flex;\n}\n\n.menu {\n box-sizing: border-box;\n height: 100vh;\n background-color: #f9f9f9;\n font-weight: 700;\n overflow: auto;\n}\n\n.menu__top {\n margin-bottom: 30px;\n position: sticky;\n top: 0;\n z-index: 1;\n background: none;\n margin-left: 0;\n}\n\n.menu__nav {\n margin-bottom: 45px;\n}\n\n.nav__item a {\n padding: 0;\n}\n\n.footer__content a {\n width: 280px;\n font-size: 16px;\n font-weight: 400;\n line-height: 22px;\n text-align: left;\n text-underline-position: from-font;\n text-decoration-skip-ink: none;\n color: #191919;\n text-decoration: none;\n}\n\n.nav__item a:hover {\n padding-bottom: 3px;\n border-bottom: 1px solid #1b2129;\n text-decoration: none;\n display: inline-block;\n}\n\n.menu__content {\n padding-inline: 20px;\n}\n\n.menu__phone-number {\n display: block;\n margin-bottom: 18px;\n color: inherit;\n text-decoration: none;\n font-size: 16px;\n line-height: 22px;\n}\n\n.menu__call-to-order {\n display: block;\n width: fit-content;\n padding-bottom: 3px;\n border-bottom: 1px solid #1b2129;\n color: inherit;\n text-decoration: none;\n font-size: 16px;\n line-height: 22px;\n letter-spacing: 2px;\n text-transform: uppercase;\n}\n\n.contact-change-color:hover {\n color: #000;\n}\n\n/* #endregion */\n\n/* #region nav */\n\n.nav__link {\n color: inherit;\n text-decoration: none;\n font-size: 22px;\n line-height: 22px;\n}\n\n.nav__list {\n margin: 0;\n padding: 0;\n list-style: none;\n display: flex;\n flex-direction: column;\n gap: 29px;\n}\n\n/* #endregion */\n\n/* #region icon */\n\n.icon {\n display: block;\n height: 24px;\n width: 24px;\n}\n\n.icon:hover {\n color: #000;\n}\n\n.icon--phone {\n background-image: url(../images/icon-phone-call.svg);\n background-repeat: no-repeat;\n}\n\n.icon--menu {\n background-image: url(../images/icon-burger-menu.svg);\n background-repeat: no-repeat;\n}\n\n.icon--close {\n background-image: url(../images/icon-close.svg);\n background-repeat: no-repeat;\n}\n\n/* #endregion */\n\n/* #region main */\n\n.main {\n display: flex;\n flex-direction: column;\n align-items: center;\n padding: 0;\n margin: 0;\n}\n\n/* #endregion */\n\n/* #region recomended */\n\n.recommended {\n display: flex;\n flex-direction: column;\n align-items: center;\n color: #1b2129;\n font-family: Manrope, sans-serif;\n}\n\n.main__section__title {\n width: 100%;\n font-size: 32px;\n font-weight: 700;\n line-height: 32px;\n text-align: left;\n text-underline-position: from-font;\n text-decoration-skip-ink: none;\n margin-top: 64px;\n margin-bottom: 50px;\n}\n\n.recommended__img {\n width: 280px;\n height: 280px;\n overflow: hidden;\n}\n\n.recommended__img img {\n transition: transform 0.25s;\n}\n\n.recommended__img:hover{\n transform: scale(1.1);\n}\n\n\n.recommended__goods-title {\n font-size: 18px;\n font-weight: 700;\n line-height: 25px;\n text-align: left;\n text-underline-position: from-font;\n text-decoration-skip-ink: none;\n margin-top: 24px;\n margin-bottom: 10px;\n}\n\n.recommended__goods-content {\n font-size: 16px;\n font-weight: 400;\n line-height: 22px;\n text-align: left;\n text-underline-position: from-font;\n text-decoration-skip-ink: none;\n margin-bottom: 10px;\n}\n\n.recommended__goods-prices {\n font-size: 16px;\n font-weight: 700;\n line-height: 22px;\n text-align: left;\n text-underline-position: from-font;\n text-decoration-skip-ink: none;\n margin-bottom: 46px;\n}\n\n/* #endregion */\n\n/* #region categories */\n\n.categories {\n display: flex;\n flex-direction: column;\n justify-content: left;\n align-items: center;\n color: #1b2129;\n font-family: Manrope, sans-serif;\n margin-top: -8px;\n margin-bottom: 96px;\n padding-left: 142px;\n}\n\n.main__section-categories__title {\n width: 100%;\n font-size: 32px;\n font-weight: 700;\n line-height: 32px;\n text-align: left;\n text-underline-position: from-font;\n text-decoration-skip-ink: none;\n margin-top: 66px;\n margin-bottom: 44px;\n margin-right: 136px;\n\n}\n\n.categories__box {\n width: 280px;\n height: 170px;\n display: flex;\n flex-direction: column;\n align-items: center;\n margin-bottom: 24px;\n margin-left: -150px;\n}\n\n.categories__box__image {\n width: 100%;\n height: 100%;\n display: flex;\n justify-content: left;\n flex-direction: row;\n gap: 20px;\n margin-bottom: 110px;\n\n\n\n}\n\n.categories__img {\n width: 100%;\n height: auto;\n overflow: hidden;\n\n}\n\n.categories__img img {\n transition: transform 0.25s;\n}\n\n.categories__img:hover {\n transform: scale(1.1);\n}\n\n.categories__box1__image-1, .categories__box2__image-1, .categories__box3__image-1 {\nmargin-right: 0;\n}\n\n.categories__box__title {\n width: 100%;\n font-size: 18px;\n font-weight: 700;\n line-height: 25;\n text-align: left;\n text-underline-position: from-font;\n text-decoration-skip-ink: none;\n margin-top: -346px;\n margin-bottom: -210px;\n}\n\n.categories__button {\n width: 280px;\n height: 56px;\n padding: 0 48px;\n gap: 0;\n border: none;\n border-radius: 8px;\n opacity: 1;\n display: block;\n text-align: center;\n background-color: #f98921;\n color: #fff;\n font-size: 16px;\n font-weight: 700;\n line-height: 27px;\n text-underline-position: from-font;\n text-decoration-skip-ink: none;\n margin-top: 0;\n margin-left: -150px;\n cursor: pointer;\n transition: all 0.3s ease;\n\n}\n\n.categories__button:hover {\n background-color: #1b2129;\n}\n\n.categories__button:active {\n background-color: #010810;\n}\n\n/* #endregion */\n\n/* #region about-us */\n\n.about-us {\n width: 100vw;\n height: 600px;\n display: flex;\n flex-direction: column;\n align-items: center;\n color: #1b2129;\n font-family: Manrope, sans-serif;\n background-color: #fcfaef;\n z-index: -1;\n}\n\n.about-us__img {\n box-sizing: border-box;\n width: 100%;\n height: 200px;\n background: url(../images/about-us.jpg) no-repeat center center;\n background-size: cover;\n position: relative;\n overflow: hidden;\n display: flex;\n z-index: 1;\n}\n\n.main__about-us__content{\n\n flex-direction: column;\n align-items: center;\n width: 100vw;\n\n\n}\n\n.about-us__title {\n width: 100%;\n margin-left: 16%;\n margin-top: 46px;\n margin-bottom: 26px;\n}\n\n.about-us__content {\n width: 100%;\n font-size: 16px;\n font-weight: 400;\n line-height: 22px;\n text-align: left;\n text-underline-position: from-font;\n text-decoration-skip-ink: none;\n margin-left: 16%;\n padding-bottom: 48px;\n padding-right: 30px;\n\n}\n\n/* #endregion */\n\n/* #region contact-us */\n\n.contact-us {\n display: flex;\n flex-direction: column;\n align-items: center;\n color: #1b2129;\n font-family: Manrope, sans-serif;\n margin-top: 0;\n}\n\n.contact-us__fields {\n width: 280px;\n margin-bottom: 4px;\n border: 1px solid #fff;\n border-radius: 10px;\n background-color: #fff;\n}\n\n.contact-us__fields__style {\n width: 264px;\n gap: 0;\n border-radius: 8px;\n opacity: 1;\n background-color: #f9f9f9;\n margin-bottom: 20px;\n border: 1px solid #f9f9f9;\n font-family: Manrope, sans-serif;\n font-size: 14px;\n font-weight: 400;\n line-height: 19px;\n text-align: left;\n text-underline-position: from-font;\n text-decoration-skip-ink: none;\n color: #7e7e83;\n}\n\n.contact-us__fields__style:hover {\n border: 1px solid #dbdbdb;\n background-color: #f9f9f9;\n color: #1B2129;\n}\n\n.contact-us__fields__style:focus {\n border: 2px solid #f98921;\n outline: none;\n background-color: #f9f9f9;\n color: #1B2129;\n}\n\n.contact-us__fields_info {\n height: 48px;\n padding-left: 16px;\n}\n\n.contact-us__fields__area {\n height: auto;\n min-height: 148px;\n padding: 16px 0 0 16px;\n gap: 10px;\n resize: none;\n}\n\n.contact-us__button {\n width: 264px;\n height: 56px;\n margin-top: 10px;\n gap: 0;\n border-radius: 8px;\n opacity: 1;\n background-color: #f98921;\n font-size: 16px;\n font-weight: 700;\n line-height: 27px;\n text-align: center;\n text-underline-position: from-font;\n text-decoration-skip-ink: none;\n color: #fff;\n border: none;\n padding-left: 48px;\n padding-right: 48px;\n cursor: pointer;\n transition: all 0.3s ease;\n}\n\n.contact-us__button:hover {\n background-color: #1b2129;\n}\n\n.contact-us__button:active {\n background-color: #010810;\n}\n\n\n/* #endregion */\n\n/* #region footer */\n\n.footer {\n width: 100%;\n display: flex;\n flex-direction: column;\n align-items: center;\n color: #1b2129;\n font-family: Manrope, sans-serif;\n padding-bottom: 50px;\n margin-top: 46px;\n margin-bottom: 10px;\n}\n\n.footer__title {\n width: 280px;\n font-family: Manrope, sans-serif;\n font-size: 14px;\n font-weight: 400;\n line-height: 19px;\n text-align: left;\n text-underline-position: from-font;\n text-decoration-skip-ink: none;\n color: #9393a3;\n margin-bottom: 10px;\n padding: 0;\n}\n\n.footer__content {\n margin-bottom: 20px;\n}\n\n\n\n.footer__content a:hover {\ntext-decoration: underline;\n}\n\n/* #endregion */\n\n@media (min-width: 768px) and (max-width: 1024px) {\n .header {\n width: 100%;\n margin: 0 auto;\n background-repeat: no-repeat;\n background-size: cover;\n background-position: center;\n }\n\n .top-bar {\n padding: 34px 48px ;\n background: none;\n margin-left: 70px;\n }\n\n .top-bar__logo {\n margin-left: -38px;\n margin-bottom: 20px;\n content: url(../images/Logo-tablet.svg);\n }\n\n .menu__content {\n margin-left: -44px;\n }\n\n .icon {\n background-repeat: no-repeat;\n position: relative;\n display: inline-block;\n cursor: pointer;\n }\n\n .icon--phone a{\n content: url(../images/Icon-Phone-call-tablet.svg);\n\n\n }\n\n .icon--phone:hover::before {\n content: '+1 234 555-55-55';\n display: flex;\n align-items: center;\n margin-left: -147px;\n padding: 0;\n white-space: nowrap;\n font-family: Inter,sans-serif;\n font-size: 12px;\n font-weight: 700;\n line-height: 16px;\n letter-spacing: 2px;\n text-align: right;\n text-underline-position: from-font;\n text-decoration-skip-ink: none;\n color: #1b2129;\n\n\n }\n\n .icon--menu a {\n content: url(../images/icon-burger-menu-tablet.svg);\n }\n\n .icon--menu {\n margin-top: 4px;\n }\n\n .icon--menu:hover {\n background-image: url(../images/icon-burger-menu-hover.svg);\n background-repeat: no-repeat;\n }\n\n\n h1 {\n padding-left: 26px;\n font-size: 48px;\n font-weight: 700;\n line-height: 48px;\n }\n\n .icon--close {\n content: url(../images/icon-close-tablet.svg);\n background-repeat: no-repeat;\n }\n\n .nav__list {\n margin-left: 102px;\n }\n\n .nav__link {\n display: flex;\n flex-direction: column;\n padding-left: 100px;\n }\n\n .menu__phone-number,\n .menu__call-to-order {\n margin-left: 100px;\n }\n\n .tablet {\n width: 744px;\n margin: 0 auto;\n }\n\n .main__section__title {\n font-size: 40px;\n line-height: 40px;\n margin-left: 150px;\n }\n\n .recommended__tablet {\n width: 100%;\n margin-left: 10px;\n }\n\n .recommended__img {\n width: 600px;\n height: 600px;\n }\n\n .recommended__beosound-a5__img img {\n content: url(../images/b-a5-tablet.jpg);\n }\n\n .recommended__goods-title {\n margin-top: 18px;\n margin-bottom: 6px;\n }\n\n .recommended__goods-content {\n width: 586px;\n margin-bottom: 30px;\n }\n\n .hidden-br {\n display: none;\n }\n\n .recommended__beoplay__img img {\n content: url(../images/beoplay-tablet.jpg);\n }\n\n .recommended__beosound-theatre__img {\n content: url(../images/b-theatre-tablet.jpg);\n }\n\n .categories {\n margin-bottom: 120px;\n }\n\n .main__section-categories__title {\n font-size: 40px;\n line-height: 40px;\n margin-left: 12px;\n\n }\n\n .categories__box {\n width: 600px;\n height: 234px;\n margin-left: -120px;\n }\n\n .categories__box__title {\n font-size: 24px;\n font-weight: 700;\n line-height: 33px;\n margin-top: -104px;\n margin-bottom: 12px;\n }\n\n .categories__img {\n width: 288px;\n height: auto;\n margin-right: 6px;\n }\n\n .categories__box1__image-1 {\n content: url(../images/box1-1-tablet.jpg);\n }\n\n .categories__box1__image-2 {\n content: url(../images/box1-2-tablet.jpg);\n }\n\n .categories__box2__image-1 {\n content: url(../images/box2-1-tablet.jpg);\n }\n\n .categories__box2__image-2 {\n content: url(../images/box2-2-tablet.jpg);\n }\n\n .categories__box3__image-1 {\n content: url(../images/box3-1-tablet.jpg);\n }\n\n .categories__box3__image-2 {\n content: url(../images/box3-2-tablet.jpg);\n }\n\n .categories__button {\n width: 600px;\n margin-left: -124px;\n }\n\n .about-us {\n width: 100vw;\n height: 800px;\n margin: 0 auto;\n background-size: cover;\n }\n\n .about-us__img {\n box-sizing: border-box;\n width: 100%;\n height: 400px;\n background: url(../images/about-us-tablet.jpg) no-repeat center center;\n background-size: cover;\n\n }\n\n .main__about-us__content {\n width: 100%;\n display: flex;\n flex-direction: row;\n justify-content: space-around;\n gap: 0;\n padding: 0 30px;\n }\n\n .about-us__title {\n width: 450px;\n margin-top: 42px;\n margin-left: 46px;\n }\n\n .dell-br {\n display: none;\n }\n\n .about-us__content {\n width: 488px;\n margin-top: 122px;\n margin-right: 54px;\n margin-left: 34px;\n }\n\n .contact-us{\n margin-top: 46px;\n }\n\n .contact-us__fields {\n display: flex;\n flex-direction: column;\n width: 100%;\n margin-left: 158px;\n }\n\n .contact-us__fields__style {\n width: 600px;\n }\n\n .contact-us__button {\n width: 600px;\n }\n\n .footer {\n width: 100%;\n display: flex;\n margin-left: -150px;\n margin-bottom: 60px;\n margin-top: 70px;\n }\n}\n\n@media (min-width: 1025px) {\n\n .page_body {\n position: relative;\n }\n\n .header {\n width: 100%;\n height: 720px;\n margin: 0 auto;\n }\n\n .top-bar__logo {\n content: url(../images/Logo-tablet.svg);\n padding-left: 100px;\n padding-top: 10px;\n }\n\n .top-bar {\n padding: 24px 38px;\n background: none;\n margin-left: -18px;\n }\n\n\n .top-bar__icons {\n margin-right: 74px;\n }\n\n .icon {\n background-repeat: no-repeat;\n position: relative;\n display: inline-block;\n cursor: pointer;\n }\n\n .icon--phone a {\n content: url(../images/Icon-Phone-call-tablet.svg);\n }\n\n\n .icon--phone:hover::before {\n content: '+1 234 555-55-55';\n display: flex;\n align-items: center;\n margin-left: -147px;\n padding: 0;\n white-space: nowrap;\n font-size: 12px;\n font-weight: 700;\n line-height: 16px;\n letter-spacing: 2px;\n text-align: right;\n text-underline-position: from-font;\n text-decoration-skip-ink: none;\n color: #1b2129;\n }\n\n .icon--menu {\n margin-top: 4px;\n }\n\n .icon--menu a {\n content: url(../images/icon-burger-menu-tablet.svg);\n }\n\n .icon--menu:hover {\n background-image: url(../images/icon-burger-menu-hover.svg);\n background-repeat: no-repeat;\n }\n\n h1 {\n padding-left: 68px;\n padding-bottom: 10px;\n font-size: 56px;\n font-weight: 700;\n line-height: 56px;\n\n }\n\n .menu__content {\n margin-left: -4px;\n margin-top: 60px;\n }\n\n .icon--close {\n content: url(../images/icon-close-tablet.svg);\n background-repeat: no-repeat;\n margin-right: 82px;\n }\n\n .nav__list {\n margin-left: 102px;\n }\n\n .nav__link {\n display: flex;\n flex-direction: column;\n padding-left: 100px;\n }\n\n .nav__link:hover {\n text-decoration: underline;\n }\n\n .menu__phone-number,\n .menu__call-to-order {\n margin-left: 100px;\n }\n\n .laptop {\n width: 1000px;\n }\n\n .recommended {\n width: 100%;\n margin-top: 52px;\n\n }\n\n .recommended__laptop {\n box-sizing: border-box;\n width: 1012px;\n display: flex;\n justify-content: center;\n gap: 20px;\n margin-left: 30px;\n\n }\n\n .recommended__img {\n width:100%;\n height: auto;\n }\n\n .recommended__beosound-a5__img img {\n content: url(../images/b-a5-laptop.jpg);\n }\n\n .recommended__beoplay__img img {\n content: url(../images/beoplay-laptop.jpg);\n }\n\n .recommended__beosound-theatre__img {\n content: url(../images/b-theatre-laptop.jpg);\n }\n\n .main__section__title {\n width: 100%;\n display: flex;\n justify-content: center;\n margin-left: -632px;\n font-size: 48px;\n font-weight: 700;\n line-height: 48px;\n\n }\n\n .categories__img {\n width: 498px;\n height: auto;\n margin-right: 0;\n }\n\n .categories__box1__image-1 {\n content: url(../images/box1-1-laptop.jpg);\n }\n\n .categories__box1__image-2 {\n content: url(../images/box1-2-laptop.jpg);\n }\n\n .categories__box2__image-1 {\n content: url(../images/box2-1-laptop.jpg);\n }\n\n .categories__box2__image-2 {\n content: url(../images/box2-2-laptop.jpg);\n }\n\n .categories__box3__image-1 {\n content: url(../images/box3-1-laptop.jpg);\n }\n\n .categories__box3__image-2 {\n content: url(../images/box3-2-laptop.jpg);\n }\n\n .main__section-categories__title{\n margin-left: -120px;\n font-size: 48px;\n font-weight: 700;\n line-height: 48px;\n margin-bottom: 48px;\n }\n\n .categories__box {\n width: 1020px;\n height: 374px;\n margin-left: -110px;\n }\n\n .categories__box__title{\n font-size: 24px;\n font-weight: 700;\n line-height: 33px;\n margin-top: -100px;\n margin-bottom: 30px;\n }\n\n .categories__button{\n margin-top: 10px;\n margin-left: -567px;\n }\n\n .about-us {\n width: 100%;\n height: 860px;\n margin: 0 auto;\n margin-top: 36px;\n\n }\n\n .about-us__img {\n height: 460px;\n background: url(../images/about-us-laptop.jpg) no-repeat center center;\n background-size: cover;\n }\n\n .main__about-us__content {\n display: flex;\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: space-around;\n gap: 70px;\n padding: 160px 30px 120px;\n margin-left: -150px;\n }\n\n .about-us__title {\n width: 498px;\n height: 96px;\n margin-top: -24px;\n margin-left: 156px;\n margin-right: 20px;\n font-size: 48px;\n font-weight: 700;\n line-height: 48px;\n\n\n }\n .about-us__content {\n width: 411px;\n height: 110px;\n margin-top: -30px;\n margin-right: -70px;\n font-size: 16px;\n font-weight: 400;\n line-height: 22px;\n text-align: left;\n text-underline-position: from-font;\n text-decoration-skip-ink: none;\n padding-right: 0;\n margin-left: -60px;\n\n }\n\n .dell-br {\n display: none;\n }\n\n .contact-us{\n width: 1260px;\n margin: 50px auto 0;\n\n }\n\n .contact-us__fields {\n display: flex;\n flex-direction: column;\n width: 498px;\n margin-left: -396px;\n margin-bottom: 100px;\n }\n\n .contact-us__fields__style {\n width: 498px;\n }\n\n .contact-us__button {\n width: 498px;\n }\n\n\n body, html {\n height: 100%;\n margin: 0;\n }\n\n .content {\n min-height: 100%;\n padding-bottom: 244px;\n box-sizing: border-box;\n }\n\n .footer-position {\n position: relative;\n display: block;\n width: 1260px;\n height: 0;\n margin: 0 auto;\n margin-bottom: 0;\n padding-left: 357px;\n\n }\n\n\n .footer {\n width: 411px;\n height: 211px;\n display: block;\n position: absolute;\n left: 78%;\n transform: translateX(-50%);\n top: -520px;\n z-index: 3;\n background: none;\n\n }\n\n}\n"],"names":[],"version":3,"file":"index.971c2ea4.css.map","sourceRoot":"/__parcel_source_root/"} \ No newline at end of file diff --git a/index.cabb280d.js b/index.cabb280d.js new file mode 100644 index 0000000000..e43077fff5 --- /dev/null +++ b/index.cabb280d.js @@ -0,0 +1,2 @@ + +//# sourceMappingURL=index.cabb280d.js.map diff --git a/index.cabb280d.js.map b/index.cabb280d.js.map new file mode 100644 index 0000000000..9d54ef7950 --- /dev/null +++ b/index.cabb280d.js.map @@ -0,0 +1 @@ +{"mappings":"","sources":["src/scripts/main.js"],"sourcesContent":["'use strict';\n"],"names":[],"version":3,"file":"index.cabb280d.js.map"} \ No newline at end of file diff --git a/index.f75de5e1.js b/index.f75de5e1.js new file mode 100644 index 0000000000..5c947bd3b8 --- /dev/null +++ b/index.f75de5e1.js @@ -0,0 +1,3 @@ +"use strict"; + +//# sourceMappingURL=index.f75de5e1.js.map diff --git a/index.f75de5e1.js.map b/index.f75de5e1.js.map new file mode 100644 index 0000000000..1c33459526 --- /dev/null +++ b/index.f75de5e1.js.map @@ -0,0 +1 @@ +{"mappings":"AAAA","sources":["src/scripts/main.js"],"sourcesContent":["'use strict';\n"],"names":[],"version":3,"file":"index.f75de5e1.js.map","sourceRoot":"/__parcel_source_root/"} \ No newline at end of file diff --git a/index.html b/index.html new file mode 100644 index 0000000000..c8b08f7cfc --- /dev/null +++ b/index.html @@ -0,0 +1 @@ +BANG & OLUFSEN

Your senses.
Set free.

Sound. Vision.
It's your pick.

goods1
goods2

Portable speakers

goods3
goods4

Earphones

goods5
goods6

Smart Home

Timeless, for 50
years and
counting

Bang & Olufsen is expanding its
Recreated Classics Program with the
launch of Beosystems - a limited
edition music system that
transcends time by bridging the gap
between one of our iconic designs
from 1972 and today's cutting-edge
digital technology.

Contact us

\ No newline at end of file diff --git a/layout_landing-page.59712999.js.14328.h0u b/layout_landing-page.59712999.js.14328.h0u new file mode 100644 index 0000000000..14f32f6f7f --- /dev/null +++ b/layout_landing-page.59712999.js.14328.h0u @@ -0,0 +1,590 @@ +// modules are defined as an array +// [ module function, map of requires ] +// +// map of requires is short require name -> numeric require +// +// anything defined in a previous bundle is accessed via the +// orig method which is the require for previous bundles + +(function (modules, entry, mainEntry, parcelRequireName, globalName) { + /* eslint-disable no-undef */ + var globalObject = + typeof globalThis !== 'undefined' + ? globalThis + : typeof self !== 'undefined' + ? self + : typeof window !== 'undefined' + ? window + : typeof global !== 'undefined' + ? global + : {}; + /* eslint-enable no-undef */ + + // Save the require from previous bundle to this closure if any + var previousRequire = + typeof globalObject[parcelRequireName] === 'function' && + globalObject[parcelRequireName]; + + var cache = previousRequire.cache || {}; + // Do not use `require` to prevent Webpack from trying to bundle this call + var nodeRequire = + typeof module !== 'undefined' && + typeof module.require === 'function' && + module.require.bind(module); + + function newRequire(name, jumped) { + if (!cache[name]) { + if (!modules[name]) { + // if we cannot find the module within our internal map or + // cache jump to the current global require ie. the last bundle + // that was added to the page. + var currentRequire = + typeof globalObject[parcelRequireName] === 'function' && + globalObject[parcelRequireName]; + if (!jumped && currentRequire) { + return currentRequire(name, true); + } + + // If there are other bundles on this page the require from the + // previous one is saved to 'previousRequire'. Repeat this as + // many times as there are bundles until the module is found or + // we exhaust the require chain. + if (previousRequire) { + return previousRequire(name, true); + } + + // Try the node require function if it exists. + if (nodeRequire && typeof name === 'string') { + return nodeRequire(name); + } + + var err = new Error("Cannot find module '" + name + "'"); + err.code = 'MODULE_NOT_FOUND'; + throw err; + } + + localRequire.resolve = resolve; + localRequire.cache = {}; + + var module = (cache[name] = new newRequire.Module(name)); + + modules[name][0].call( + module.exports, + localRequire, + module, + module.exports, + this + ); + } + + return cache[name].exports; + + function localRequire(x) { + var res = localRequire.resolve(x); + return res === false ? {} : newRequire(res); + } + + function resolve(x) { + var id = modules[name][1][x]; + return id != null ? id : x; + } + } + + function Module(moduleName) { + this.id = moduleName; + this.bundle = newRequire; + this.exports = {}; + } + + newRequire.isParcelRequire = true; + newRequire.Module = Module; + newRequire.modules = modules; + newRequire.cache = cache; + newRequire.parent = previousRequire; + newRequire.register = function (id, exports) { + modules[id] = [ + function (require, module) { + module.exports = exports; + }, + {}, + ]; + }; + + Object.defineProperty(newRequire, 'root', { + get: function () { + return globalObject[parcelRequireName]; + }, + }); + + globalObject[parcelRequireName] = newRequire; + + for (var i = 0; i < entry.length; i++) { + newRequire(entry[i]); + } + + if (mainEntry) { + // Expose entry point to Node, AMD or browser globals + // Based on https://github.com/ForbesLindesay/umd/blob/master/template.js + var mainExports = newRequire(mainEntry); + + // CommonJS + if (typeof exports === 'object' && typeof module !== 'undefined') { + module.exports = mainExports; + + // RequireJS + } else if (typeof define === 'function' && define.amd) { + define(function () { + return mainExports; + }); + + //