$color_1: #0A886A; $color_2: black; $color_3: #000; $color_4: white; $color_5: #C5C5C5; $color_6: rgba(255, 32, 32, 0); $color_7: rgb(0, 0, 0); $color_8: #635c5c; $font-family_1: "Orbitron", sans-serif; $font-family_2: "Satoshi", sans-serif; $font-family_3: "satoshi", sans-serif; $font-family_4: "orbitron", sans-serif; $background-color_1: #3bb78f; $background-color_2: #ECECEC; $background-color_3: white; $background-color_4: #eeeeee; $background-color_5: red; $background-color_6: #ececec; $background-color_7: transparent; $background-color_8: black; $background-color_9: #000; $background-color_10: #FFDAD4; $background-color_11: #F5FFEA; $background-color_12: #FFB518; $background-color_13: #E05E00; $background-color_14: #461DCF; $background-color_15: #fff; $background-color_16: #4f4f4f; /* 0 - 600px: Phone 600 - 900px: Tablet portrait 900 - 1200px: Tablet landscape [1200 - 1800] is where our normal styles apply 1800px + : Big desktop $breakpoint arguement choices: - phone - tab-port - tab-land - big-desktop ORDER: Base + typography > general layout + grid > page layout > components 1em = 16px */ /* home page */ /* BUtton */ /* main-container */ @-webkit-keyframes slide { from { opacity: 0; } to { opacity: 1; } } @keyframes slide { from { opacity: 0; } to { opacity: 1; } } /* 0 - 600px: Phone 600 - 900px: Tablet portrait 900 - 1200px: Tablet landscape [1200 - 1800] is where our normal styles apply 1800px + : Big desktop $breakpoint arguement choices: - phone - tab-port - tab-land - big-desktop ORDER: Base + typography > general layout + grid > page layout > components 1em = 16px */ /* Orbitron */ @font-face { font-family: "Orbitron"; /* src: url("../dist/assets/font/") format("truetype"); */ src: url("../dist/assets/font/orbitron/Orbitron-Regular.ttf") format("truetype"); font-weight: 400; font-style: normal; } @font-face { font-family: "Orbitron"; src: url("../dist/assets/font/orbitron/Orbitron-Medium.ttf") format("truetype"); font-weight: 500; font-style: normal; } @font-face { font-family: "Orbitron"; src: url("../dist/assets/font/orbitron/Orbitron-SemiBold.ttf") format("truetype"); font-weight: 600; font-style: normal; } @font-face { font-family: "Orbitron"; src: url("../dist/assets/font/orbitron/Orbitron-Bold.ttf") format("truetype"); font-weight: 700; font-style: normal; } /* Orbitron end */ /* Satoshi */ @font-face { font-family: "Satoshi"; src: url("../dist/assets/font/satoshi/Satoshi-Regular.ttf") format("truetype"); font-weight: 400; font-style: normal; } @font-face { font-family: "Satoshi"; src: url("../dist/assets/font/satoshi/Satoshi-Medium.ttf") format("truetype"); font-weight: 500; font-style: normal; } @font-face { font-family: "Satoshi"; src: url("../dist/assets/font/satoshi/Satoshi-Bold.ttf") format("truetype"); font-weight: 700; font-style: normal; } /* button */ /* navbar */ /* footer */ @-webkit-keyframes rocketRotate { from { transform: rotate(0); } to { transform: rotate(360deg); } } @keyframes rocketRotate { from { transform: rotate(0); } to { transform: rotate(360deg); } } /*# sourceMappingURL=style.css.map */ body { box-sizing: border-box; overflow-x: hidden; box-sizing: border-box; overflow-x: hidden; } .bg-green { background-color: $background-color_1; background: linear-gradient(90deg, #3bb78f 0%, rgb(11, 171, 100) 35%, rgb(59, 183, 143) 100%); background-color: $background-color_1; background: linear-gradient(90deg, #3bb78f 0%, #0bab64 35%, #3bb78f 100%); } .text-green-Awni { color: $color_1; } .anwi_grey_bg { background-color: $background-color_2; } .orbitron_font { font-family: $font-family_1; } .satoshi_font { font-family: $font-family_2; } .font-1 { font-size: 1rem; } .font-3 { font-size: 3rem; } .font-1-2 { font-size: 1.2rem; } .font-1-5 { font-size: 1.5rem; } .font-1_5 { font-size: 2rem; } .font-1_7 { font-size: 1.7rem; } .font-2 { font-size: 2rem; } .font-2_2 { font-size: 2.2rem; } .font-2_7 { font-size: 2.7rem; } .font_4 { font-size: 4rem; } .font-5 { font-size: 5rem; } .font-6 { font-size: 6rem; } .font-7 { font-size: 7rem; } .font-10 { font-size: 10rem; } .subtitle_1 { font-size: 1.5rem; } .banner_heading_4 { font-size: 3rem; } .padding_top_14 { padding-top: 14rem; } .p-6 { padding: 5rem; } .ps-7 { padding-left: 6rem; } .px-6 { padding-left: 6rem; padding-right: 6rem; } .p-7 { padding: 7rem; } .padding_top_10 { padding-top: 10rem; } .padding_top_13 { padding-top: 13rem; } .padding_bottom_ONE_FIVE { padding-bottom: 1.5rem; } .h-10 { height: 10%; } .h-15 { height: 15%; } .h-20 { height: 20%; } .h-30 { height: 30%; } .h-33 { height: 33%; } .h-34 { height: 34%; } .h-35 { height: 35%; } .h-40 { height: 40%; } .vh_60 { height: 60vh; } .vh-70 { height: 70vh; } .vh-77 { height: 77vh; } .vh-85 { height: 85vh; } .vh-15 { height: 15vh; } .h-700p { height: 700px; } .h-25 { height: 25%; } .h-60 { height: 60%; } .h-75 { height: 75%; } .w-60 { width: 60%; } .w-20p { width: 20px; } .w-200 { width: 200px; } .fw-500 { font-weight: 500; } .fw-600 { font-weight: 600; } .fw-700 { font-weight: 700; } .h-200p { height: 200px; } .mt-7 { margin-top: 7rem; } .sec-space-1 { margin-top: 80px; } .sec-space-2 { margin-top: 60px; } .sec-space-3 { margin-top: 40px; } .sec-space-4 { margin-top: 20px; } .sec-space-5 { margin-top: 0px; } .h-100p { height: 100px; } .gap-1 { gap: 0.7rem; } .gap-2 { gap: 2rem; } .br-1 { border-radius: 1rem; } .cursor-pointer { cursor: pointer; } .mt-5C { margin-top: 5rem; } .button_dark { -webkit-clip-path: polygon(75% 0, 86% 30%, 99% 66%, 100% 100%, 0 100%, 0 61%, 0 0); clip-path: polygon(75% 0, 86% 30%, 99% 66%, 100% 100%, 0 100%, 0 61%, 0 0); padding-right: 1.7rem; padding-bottom: 0.6rem; padding-top: 0.6rem; border-radius: 10px; -webkit-clip-path: polygon(75% 0, 86% 30%, 99% 66%, 100% 100%, 0 100%, 0 61%, 0 0); clip-path: polygon(75% 0, 86% 30%, 99% 66%, 100% 100%, 0 100%, 0 61%, 0 0); padding-right: 1.7rem !important; padding-bottom: 0.6rem !important; padding-top: 0.6rem !important; border-radius: 10px; } .productOverviewBody { overflow-x: hidden; } .productoverviewmain { background-image: url("./../dist/assets/imgs/productoverview/productbg.png"); background-color: $background-color_3; background-size: cover; background-repeat: no-repeat; background-position: center; position: relative; } .photo_dual { width: 40rem; } .price_footer { background: rgba(255, 255, 255, 0.25); backdrop-filter: blur(4px); -webkit-backdrop-filter: blur(4px); border: 1px solid rgba(255, 255, 255, 0.18); border: 2px solid; position: absolute; z-index: 999; bottom: 0; left: 0; } .boxImgContainer { width: 4rem; } .priceCut_multi { font-size: 0.7rem; } .PO_learnMore { font-size: 0.7rem; } .productOverview { .overviewProductHeading { font-size: 2.1rem; font-family: $font-family_3; font-weight: 500; } .overviewProductFullTitle { padding: 2rem 11rem; font-size: 3rem; font-family: $font-family_4; } .overviewProductDes { padding: 0 2rem; font-size: 1.5rem; font-family: $font-family_3; } } .PO_galleryContainer { .PO_gallery_display { min-height: 500px; width: 100%; background: white; background: linear-gradient(180deg, white 7%, rgba(255, 142, 158, 0.3019607843) 52%, rgba(235, 134, 148, 0.4705882353) 100%); position: relative; overflow: hidden; .PO_gallery_display_img { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -46%); } } .PO_gallery_box_inner { padding: 1rem; background-color: $background-color_4; } } .PO_gallery_box { padding: 1rem; } .mobileAw { display: none; } .productoverBox { height: 900px; .productoverBox-1 { height: 225px; } .productoverBox-2 { height: 225px; .futureProof { position: relative; } .futureProofImg { position: absolute; top: 0; right: 0; width: 50%; } } .productoverBox-3 { height: 225px; } .productoverBox-4 { height: 225px; } .productoverBox-5 { height: 200px; overflow: hidden; .box_innerImg { position: absolute; right: 8%; top: 0; height: 100%; img { scale: 1.2; } } } .productoverBox-6 { height: 150px; } .productoverBox-7 { height: 225px; position: relative; .gridTruelifeImg { position: absolute; width: 85%; bottom: 0; left: 0; } } .productoverBox-8 { height: 60px; } .productoverBox-9 { height: 230px; } .productoverBox-10 { height: 150px; } .productoverBox-11 { height: 180px; } .productoverBox-12 { height: 75px; } .PO_box { height: 100%; >div { padding: 1rem 0rem; } .box_inner { position: relative; } .bgBox_Content { background: rgb(236, 236, 236); background: linear-gradient(90deg, rgb(236, 236, 236) 4%, rgb(118, 118, 118) 100%); } .box_inner_right { padding-left: 1rem; } .box_inner_left { padding-right: 1rem; } } } .specsgrid { display: grid; height: 100vh; gap: 20px; grid-template-columns: repeat(8, minmax(5%, 1fr)); grid-template-rows: repeat(12, minmax(5%, 1fr)); .specsItem { background-color: $background-color_5; } .specsItem-1 { grid-column: 1/4; grid-row: 1/4; } .specsItem-2 { grid-column: 1/4; grid-row: 1/4; } } .displayscreenpad { .displayscreenpadContainer { text-align: center; } .displayscreenpadHeading { font-size: 8rem; } .displayscreenpadMain { margin-top: -8%; } .displayscreenpadleft { >img { left: -8%; } } .displayscreenpadright { >img { right: -10%; } } } .dual_des_heading { font-size: 3rem; } .dualLaptop { width: 100vw; top: -100px; margin-top: 100px; margin-bottom: -100px; position: relative; .zeroBMain_desP { font-size: 1.2rem; } .zeroBMain_des { position: absolute; top: 0; right: 0; max-width: 700px; padding-right: 9rem; } .dualImgs { position: absolute; .dualImgsInner { width: 50rem; } } .dualImgsOne { top: 0; left: -10rem; transform: rotate(343deg); width: 68%; } .dualImgsTwo { top: 14rem; right: -62%; transform: rotate(339deg); .dualImgsInner { width: 82%; } } } .tableLaptop { margin-top: 300px; height: 90vh; width: 100vw; position: relative; margin-bottom: 300px; .circleTableLaptop_Heading { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -311%); } .justTableLaptop { position: absolute; width: 86%; top: -10px; right: 128px; z-index: 1; } .circleTableLaptop { background-color: $background-color_6; height: 70rem; width: 70rem; border-radius: 50%; position: relative; overflow: hidden; .circleTableLaptopTop { bottom: -3%; width: 80%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, 2%); } } .circleTableLaptop_text { position: absolute; top: 50%; left: 50%; transform: translate(-50%, 106%); } } .trueLifeDisplay { .trueLifeDisplay_headingHD { >.headingLife { font-size: 6rem; } } .trueLifeDisplay_des { padding: 0 10rem; } } .font_p_Dual { font-size: 1.2rem; } .tableLaptopTwo { width: 100vw; height: 100vh; background-image: url("./../dist/assets/imgs/sectiontest.png"); background-color: $background-color_3; background-size: contain; background-repeat: no-repeat; background-position: center; } .dragondisplay { position: relative; background: rgb(255, 255, 255); background: linear-gradient(184deg, rgb(255, 255, 255) 4%, rgb(235, 255, 133) 100%); overflow: hidden; position: relative; background: rgb(255, 255, 255); background: linear-gradient(184deg, rgb(255, 255, 255) 4%, rgb(235, 255, 133) 100%); overflow: hidden; .dragondisplay_heading { position: absolute; bottom: -4%; margin: auto; width: 100%; position: absolute; bottom: 0; margin: auto; width: 100%; >h1 { font-size: 8rem; text-align: center; font-size: 8rem; text-align: center; } } .dragondisplay_des { max-width: 600px; position: absolute; right: 0; top: 13%; padding: 4rem; max-width: 600px; position: absolute; right: 0; top: 13%; padding: 4rem; } } .intelGen { .intelGenUL { max-width: 250px; gap: 8rem; .intelGenULHeading { font-size: 1.8rem; font-weight: 700; border-bottom: 2px solid; } } .cpuSection { background-image: url("././../dist/assets/imgs/productoverview/cpu.png"); background-color: $background-color_3; background-size: cover; background-repeat: no-repeat; background-position: center; } } .proSection { .designedProLaptop_title { >.designedProLaptop_title_text { font-size: 6rem; } } .designedProLaptopList { >li { font-size: 2.5rem; } } } .popupKeyboard { position: relative; overflow-x: hidden; padding-top: 11rem; .popupKeyboard_hParent { position: absolute; top: 0; left: 0; } .popupKeyboard_heading { >h1 { font-size: 9rem; } } } .lensAnwi { .box_lens { .anwi_BoxLen { border-radius: 40px; box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.171) inset; gap: 10px; } .box_lens_img { width: 45%; } .screenpadLens { font-size: 1.2rem; } .lenHeading { font-size: 2rem; } } } .professinalGrade { .professinalGradeImgContainer { background-image: url("././../dist/assets/imgs/productoverview/promask.png"); background-color: $background-color_3; background-size: cover; background-repeat: no-repeat; background-position: center; } .professinalGradeImg { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 50%; } } .stunningSound { position: relative; padding-top: 15rem; overflow-x: hidden; .stunningSound_heading { position: absolute; z-index: -1; top: 0; left: 0; >h1 { font-size: 10rem; } } .stunningSound_des { position: absolute; right: 0; top: 30%; transform: translate(0%, 0%); max-width: 400px; } } .wifiSection { overflow-x: hidden; position: relative; .wifiSectionDes { display: none; } .textWifiContainer { position: relative; .wifiSection_des { max-width: 500px; position: absolute; right: 0; top: -48%; width: 100%; height: 100%; } .textWifiContainerHeading { >h1 { font-size: 5rem; } } } } .circleTableLaptop_Heading { top: 20%; } .circleTableLaptop_text { bottom: 25%; >div { padding: 0px 22%; } } .osPlusSoftware { position: relative; padding-top: 10rem; .osContianer { position: absolute; top: 5rem; left: 50%; transform: translateX(-50%); } .osContianer_des_font { font-size: 1.5rem; } } .controlPanel { margin-top: 10rem; padding-bottom: 300px; .controlPanel_des { position: absolute; top: -170px; left: 80px; } .bgControlpanel { min-height: 100vh; background-color: $background-color_6; border-radius: 157px; position: relative; .bgControlpaneltabs { position: absolute; top: 100px; right: 0; .nav-link { &:focus-visible { outline: none !important; } } .nav-item { &:focus-visible { outline: none !important; } position: relative; border: none; .nav-link { &::before { content: ""; position: absolute; width: 100%; height: 5px; bottom: -2px; right: 0; display: none; background-color: $background-color_8; } } } .nav-tabs { border-bottom: 1px solid; margin-bottom: 2rem; .nav-link { position: relative; color: $color_2; font-weight: 500; } .nav-link.active { border: none; background-color: $background-color_7; &::before { display: block; } } } } } } .button_dark.btn-dark { background-color: $background-color_9 !important; font-family: $font-family_2; &:hover { background-color: $background-color_9 !important; font-family: $font-family_2; opacity: 1 !important; } } .home-main-container { #navbar-head { .navbar-nav { .nav-item { .nav-link { color: $color_3; font-family: $font-family_2; } } } } .hero-banner { .banner-main-container { .carousel-indicators { .carousel_btn.active { color: $color_3; } } .owl-dots { text-align: center; margin-top: -15px !important; .owl-dot { span { height: 5px !important; width: 35px !important; background: #fff; } &:hover { span { background: #000; } } } .owl-dot.active { span { background: #000; } } } } } .ad_banner { .card { background: url(../../dist/assets/imgs/Home_new/Home_banner_bg.png); } } .Explore_fyro_container { background-color: $background-color_9; .Explore_fyro_products_main_container { .Fyro_main_card { background: url(.././dist/assets/imgs/Home_new/Explore_Fyro_bg.png); background-repeat: no-repeat; background-size: cover; .rtxA_200 { background-color: $background-color_10; } } } } .accessories_main_container { .nvme_m_2 { background: #f2f2f2; width: 100%; max-width: 95%; } .ora_series { background: #ffeea9; } .keyboard_mouse { background: #06777c; } } .zeno_steamlined_section { background-color: $background-color_9; .zeno_logo { img { width: 150px; } } .zeno_products_main_container { .Two_four_inch_Card { background: radial-gradient(#54aff6, #26549A); width: 100%; max-width: 86%; } .zeno_sleekbook_1 { background: radial-gradient(#FFEFAB, #FFDB45); } .zeno_sleekbook_2 { background: radial-gradient(#FFFFFF, #CCCCCC); } } } } .feature-bg-image.animated-feature-img { -webkit-animation: slide 1s ease 0.2s forwards; animation: slide 1s ease 0.2s forwards; opacity: 0; } [alt=footer-rocket-img] { cursor: pointer; width: 70px; } .partners-img { height: 60px; } .shopping-cart-main-container { background-color: $background-color_11; padding-bottom: 50px; * { font-family: $font-family_2; } h6 { padding: 10px; margin-bottom: 0; } .cart-sec-highlighter { .text-muted { color: $color_5 !important; } } .alert-display-sec { z-index: 1; .alert-dismissible { background: rgba(255, 255, 255, 0.66); } } } .warrenty-sec { img { width: 40px; } } #footer-head { .footer-wrapper.sec-space-1 { margin-top: 0; } .accordion-item { border: 1px solid; box-shadow: none; .accordion-button { &:not(.collapsed) { box-shadow: none !important; } } } } .clipPathSectionCol { position: relative; .innerClipPathImg { position: absolute; top: 12%; left: 9%; width: 81%; } .innerClipPathImgFirstThree { position: absolute; top: 12%; left: 5%; width: 81%; } .innerClipPathImgFirstFour { position: absolute; top: 12%; left: 5%; width: 81%; >img { transform: scale(0.7); } } .innerClipPathImgSectionTwo { position: absolute; top: 50%; left: 28%; transform: translateY(-50%); width: 81%; } .innerClipPathImgSectionThree { position: absolute; top: 50%; left: 17%; transform: translateY(-50%); width: 81%; } .innerClipPathImgSectionFour { position: absolute; top: 50%; left: 17%; transform: translateY(-50%); width: 81%; } .dualLaptopSlideLeftone { transform: translate(1000%, -50%); transition: 0.8s ease; } .dualLaptopSlideLeftoneLeft { transform: translate(0, -50%); } .innerClipPathImgSectionFour.controllerEight { transform: translate(1000%, -50%); transition: 0.8s ease; } .innerClipPathImgSectionFour.traslateZero { transform: translate(0, -50%); } } .allinoneLanding { position: relative; #navbar-head { * { color: $color_4; } } .headingAllinOne { position: absolute; bottom: 10%; left: 0; } } .sectionTwoImgAllInone { transform: scale(1.4); } .allinoneDualMarginTop { margin-top: 100px; } .sectionfiveAllinOne { .infoContainer { position: relative; .infoContainerOneText { position: absolute; top: 20%; left: 50%; transform: translateX(-50%); >h1 { font-size: 1.7rem; } } } } .infoContainerYellow { background-color: $background-color_12; } .infoContainerOrange { background-color: $background-color_13; color: $color_4; } .infoContainerBlue { background-color: $background-color_14; color: $color_4; } .infoContainer_des { font-size: 0.8rem; } .supportBoxCircle { width: 100px; height: 100px; background-color: $background-color_8; border-radius: 50%; } .carouselLanding { overflow-x: auto; display: flex; gap: 50px; margin-bottom: 4rem; .carouselLandingItem { width: 300px; >div { border-radius: 25px; overflow: hidden; } .carouselLandingItemInner { position: relative; .carouselLandingItemInnerOverlay { position: absolute; top: 0; bottom: 0; left: 0; right: 0; background: rgba(0, 0, 0, 0.453); } } } } .allinoneslider { .carouselLanding { position: relative; display: flex; align-items: center; justify-content: center; } .owl-nav { bottom: 0; position: absolute; display: none; right: 15%; border: 1px solid; padding: 0.5rem 1.3rem; border-radius: 70px; span { font-size: 2rem; text-align: center; } } .owl-stage { width: 100% !important; } } .animateHeadingLeft { transform: translateX(1000%); transition: 0.8s ease; } .dualLaptopSlideLeftone { transform: translateX(1000%); transition: 0.8s ease; } .addTextanimationLeft { transform: translateX(0); } .animateHeadingRight { transform: translateX(-1000%); transition: 0.8s ease; } .dualLaptopSlideone { transform: translateX(-1000%); transition: 0.8s ease; } .addTextanimationRight { transform: translateX(0); } .laptoponanimation { opacity: 0; transition: 0.8s ease; } .allinOnepc { opacity: 0; transition: 0.8s ease; } .addOpacity { opacity: 1; } .cpuSlideLeftone { transform: translateX(-1000%); transition: 0.8s ease; } .controllerEight { transform: translateX(1000%); } .traslateZero { transform: translateX(0); } * { margin: 0; padding: 0; box-sizing: inherit; font-family: $font-family_1; &::after { margin: 0; padding: 0; box-sizing: inherit; font-family: $font-family_1; } &::before { margin: 0; padding: 0; box-sizing: inherit; font-family: $font-family_1; } } html { font-size: 100%; } #navbar-head { position: fixed; width: 100%; z-index: 9999; top: 0; .biz-nav-wrapper { .navbar-brand { img { width: 100px; } } .dropdown.has-mega-menu { position: static !important; } .dropdown-menu { .dropdown-items-row { width: 100%; margin: 0px; } } } .navbar-nav { gap: 2rem; .nav-item { .nav-link { color: $color_3; font-family: $font-family_2; margin-top: 0.25rem; } } .dropdown.has-mega-menu { &:hover { >.navbar { background-color: $background-color_15; } } } } .button_dark.btn-dark { font-weight: bold; } .dropdown-menu { width: 100%; left: 0; } .dropdown { &:hover { >.dropdown-menu { display: block; } } } .dropdown-item-img { img { width: 200px; } } } .footer-wrapper { background-size: cover; background-color: $background-color_9; .footer-content-main-container { background-image: url(../dist/assets/imgs/Home/Footer-pattern.png); background-size: contain; background-position: right 30px; background-repeat: no-repeat; } .last-col-footer { width: 20%; } .footer-logo { img { width: 120px; } } li { line-height: 2rem; font-family: $font-family_2; } .footer-sub-content { p { line-height: 2rem; font-family: $font-family_2; } } } .footer-socailImg { width: 30px; width: 30px; } .footer-rkt { &:hover { -webkit-animation: rocketRotate 2s; animation: rocketRotate 2s; } } .mbil-name { transition: all 0.2s ease; } .navbar-brand { img { transition: all 0.2s ease; } } @media only screen and (max-width: 900px) { body { padding: 0; } } @media (max-width: 768px) { .footerDesText { width: 100%; } .proSection { padding: 1rem; .designedProLaptop_title { >.designedProLaptop_title_text { font-size: 4rem; } } .designedProLaptopList { width: 100%; padding: 1rem; } } .controlPanel { padding-bottom: 100px; padding-bottom: 100px; .bgControlpanel { min-height: 50vh; } } .popupKeyboard { .popupKeyboard_heading { padding: 1rem; >h1 { font-size: 3rem; } } .popupKeyboard_des { padding: 1rem; font-size: 1rem; } .popupKeyboard_hParent { padding: 1rem; } } .dragondisplay { .dragondisplay_heading { >h1 { font-size: 3rem; text-align: center; } } } .professinalGrade { h1 { font-size: 2rem; } .font_p_Dual { font-size: 1rem; } } .stunningSound { .stunningSound_heading { >h1 { font-size: 4rem; } } .stunningSound_des { max-width: 270px; top: 50%; right: 0; p { font-size: 1rem; } } } .proConnectivity { h1 { font-size: 2rem; } .font_p_Dual { font-size: 0.7rem; } } .osPlusSoftware { .osContianer { top: -1rem; } .osContianerHeading { >h1 { font-size: 2rem; text-align: center; } } .osContianer_des_font { font-size: 0.7rem; text-align: center; } } .cart-sec-highlighter { display: none !important; } .shopping-cart-details-row-1 { display: none !important; } .buy-together-sec { text-align: center; .row { padding: 10px; } } .mobile-cart-img { img { width: 200px; } } } @media (max-width: 1200px) { .productOverview { .p-6 { padding: 0; } .overviewProductFullTitle { padding: 2rem 5rem; font-size: 2rem; font-size: 1rem; padding: 2rem 0rem; } >div { padding: 0; } .overviewProductDes { font-size: 0.7rem; padding: 0.5rem; } } .dualLaptop { .dualImgsTwo { .dualImgsInner { transform: rotate(339deg) translateX(57%) translateY(55%); } } .dual_des_heading { font-size: 2rem; } .zeroBMain_des { padding-right: 0; .zeroBMain_desP { font-size: 0.8rem; max-width: 400px; } } } .PO_galleryContainer { .PO_gallery_display { .PO_gallery_display_img { width: 100%; } min-height: 300px; } .PO_gallery_box_inner { padding: 0; } } .PO_gallery_box { padding: 0; } .productoverBox.px-6 { padding: 1rem; margin: 0; height: -webkit-max-content; height: -moz-max-content; height: max-content; } .displayscreenpad { .displayscreenpadHeading { font-size: 4rem; } } .controlPanel { .controlPanel_des { top: -110px; >h1 { font-size: 2.5rem; } } } .proSection { .designedProLaptopList { >li { font-size: 1.5rem; } } } .popupKeyboard { .popupKeyboard_heading { >h1 { font-size: 5rem; } } } .dragondisplay { .dragondisplay_heading { >h1 { font-size: 4rem; text-align: center; } } } .lensAnwi { .row_lensAnwi { padding: 2rem; } .box_lens { .lenHeading { font-size: 0.7rem; } .screenpadLens { font-size: 0.5rem; } } } .professinalGrade { h1 { font-size: 3rem; } } .stunningSound { .stunningSound_heading { >h1 { font-size: 7rem; } } .stunningSound_des { padding-right: 1rem; max-width: 300px; } } .wifiSection { .textWifiContainer { .textWifiContainerHeading { >h1 { font-size: 5rem; } } } } .proConnectivity { h1 { font-size: 2.5rem; } .font_p_Dual { font-size: 1rem; } } .osPlusSoftware { position: relative; .osContianerHeading { >h1 { font-size: 5rem; } } .osContianer_des_font { font-size: 1.5rem; } } } @media (max-width: 1000px) { .dualpassage { padding-left: 10rem; padding-right: 2rem; } .stunningSound { .stunningSound_heading { top: 20%; >h1 { font-size: 5rem; } } .stunningSound_des { top: 40%; right: 0; } } .wifiSection { .textWifiContainer { display: none; } .wifiSectionDes { padding: 2rem; display: block; .wifiSection_des { >p { font-size: 1rem; } } } } .circleTableLaptop_Heading { h1 { font-size: 1.5rem; } } .circleTableLaptop_text { bottom: 25%; >div { font-size: 0.7rem; } } .osPlusSoftware { padding-top: 1rem; .osContianer { top: 1rem; } .osContianerHeading { >h1 { font-size: 2rem; text-align: center; } } .osContianer_des_font { font-size: 1rem; } } .laptopsSection { .headinglaptop { font-size: 3rem; } } .headinglaptopSub { font-size: 1.2rem; } .allinoneDualMarginTop { .allinoneDualMarginTop_desContainer { padding: 2rem; h1 { font-size: 2rem; } .allinoneDualMarginTop_p { font-size: 1rem; } } margin-top: 100px; } } @media (max-width: 790px) { .productOverview { .p-6 { padding: 0; } .overviewProductFullTitle { padding: 2rem 0; font-size: 1rem; } .overviewProductDes { font-size: 0.7rem; } } .displayscreenpad { .displayscreenpadHeading { font-size: 2rem; } } .dualLaptop { .dual_des_heading { font-size: 1rem; } .zeroBMain_des { .zeroBMain_desP { font-size: 0.7rem; max-width: 400px; } } } .controlPanel { .controlPanel_des { >h1 { font-size: 1.9rem; } } } } @media (max-width: 670px) { .zeroBMain_des { display: none; } .mobileAw { display: block; } } @media only screen and (max-width: 600px) { .p-6 { padding: 0; } .productoverviewmain { .displayscreenpad { .displayscreenpadHeading { font-size: 5rem; } } } .banner_heading_4 { font-size: 2rem; } .displayscreenpad { .displayscreenpadHeading { font-size: 2rem; } .displayscreenpadMain { top: 0; } .twoScreenHeading { font-size: 1rem; } } .tableLaptop { margin-top: 20%; margin-bottom: 0; height: -webkit-max-content; height: -moz-max-content; height: max-content; .dual_des_heading { font-size: 1rem; } .circleTableLaptop { height: 300px; .circleTableLaptopTop { bottom: -3%; width: 80%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, 2%); } } .circleTableLaptop_Heading { position: absolute; top: 4%; left: 50%; transform: translate(-50%, 0); } .justTableLaptop { position: absolute; width: 86%; top: 26%; right: 30px; z-index: 1; } .circleTableLaptop_text { position: absolute; top: 50%; left: 50%; transform: translate(-50%, 0%); } } .trueLifeDisplay { margin-top: 50px; .trueLifeDisplay_headingHD { >h1 { font-size: 2rem; } .headingLife { font-size: 2rem; } } .trueLifeDisplay_des { padding: 1rem; .font_p_Dual { font-size: 0.9rem; } } } .controlPanel { margin-top: 3rem; padding-bottom: 100px; >.p-5 { padding: 0 !important; } .bgControlpanel { min-height: 85vh; .bgControlpaneltabs { top: 55%; right: 0; transform: translateY(-50%); } } .controlPanel_des { top: 0%; width: 100%; left: 50%; text-align: center; transform: translateX(-50%); margin: 1rem 0; margin: 1rem 0; >h1 { font-size: 1.2rem; } } .bgControlpaneltabs { padding: 0.1rem !important; padding-top: 3rem !important; >.nav-tabs { padding: 0; } >ul { padding: 1rem; } #tabLaptopContent { padding: 1rem; } } } .proSection { .designedProLaptop_title { .designedProLaptop_title_text { font-size: 2rem; } } } .headingAllinOne { >h1 { font-size: 2rem; } } } @media (max-width: 576px) { .proSection { .designedProLaptop_title { >.designedProLaptop_title_text { font-size: 2.5rem; } } } .popupKeyboard { .popupKeyboard_heading { padding: 1rem; >h1 { font-size: 2rem; } } .popupKeyboard_des { padding: 2rem; padding-top: 0; font-size: 0.8rem; } } .dragondisplay { .dragondisplay_heading { >h1 { font-size: 1.5rem; text-align: center; font-size: 1.5rem; text-align: center; } } } .lensAnwi { .box_lens { .box_lens_img { width: 25%; } } } .professinalGrade { p { padding-left: 1rem; } .professinalGradeImg { width: 80%; } } .stunningSound { padding-top: 1rem; .stunningSound_heading { top: 15%; >h1 { font-size: 2rem; padding: 2rem; } } .stunningSound_des { padding: 2rem; top: 25%; max-width: 100%; left: 0; } } .allinInMargintop { margin-top: 100px; } .content-main-allinone { padding: 1rem; } .scaleSmallAllinone { scale: 0.9; } .allinoneslider { .owl-stage { width: -webkit-max-content !important; width: -moz-max-content !important; width: max-content !important; } } } @media (max-width: 1400px) { .lensAnwi { .box_lens { .lenHeading { font-size: 1rem; } .screenpadLens { font-size: 0.7rem; } } } .allinoneslider { .owl-stage { width: -webkit-max-content !important; width: -moz-max-content !important; width: max-content !important; } } } @media (max-width: 1300px) { .circleTableLaptop_text { bottom: 18%; >div { font-size: 1rem; } } .cart-sec-highlighter { h5 { font-size: 0.8rem; } } .laptopsSection { .headinglaptop { font-size: 5rem; } } .headinglaptopSub { font-size: 1.2rem; } } @media (max-width: 600px) { .circleTableLaptop_Heading { top: 0; h1 { font-size: 1.5rem; } } .proConnectivity { .connectivityPso_des { padding: 2rem; } } .controlPanel { .controlPanel_des { width: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center; left: 50%; } } .supTitleSection { text-align: center; font-size: 1rem; } .allinoneDualMarginTop { .clipPathSectionCol { padding-right: 0 !important; padding-left: 0 !important; } } .headingAllinOne { padding-left: 2rem !important; padding-right: 2rem !important; >h1 { font-size: 2rem; } } .laptopSectionDesP { padding: 1rem; width: 100%; align-items: center; } .clipPathSectionCol { .allinoneDualMarginTop_pContainer { padding: 2rem; align-items: center; } .innerClipPathImgSectionThree { top: 30%; } .innerClipPathImgSectionFour { top: 30%; } } .supportBoxParent { padding: 2rem; gap: 1.5rem; } .allinoneDualMarginTop_p { text-align: center; font-size: 1rem; } .insightsAdvHeading { margin-top: 2rem; } .insightsAdv { width: 100vw; padding: 1rem; >ul { overflow-x: auto; } } .carouselLanding { overflow-x: auto; display: block; gap: 0; margin-bottom: 1rem; .carouselLandingItem { width: 100%; >div { border-radius: 25px; overflow: hidden; } .carouselLandingItemInner { position: relative; .carouselLandingItemInnerOverlay { position: absolute; top: 0; bottom: 0; left: 0; right: 0; background: rgba(0, 0, 0, 0.453); } } } .mt-5C { margin-top: 0; } } } @media (min-width: 1024px) { .banner_heading_4 { font-size: 2rem; } } @media (min-width: 278px) and (max-width: 767px) { // .carousel-inner { // .carousel_img { // height: 80vh; // } // } .fyro_card { padding-top: 0 !important; } .Two_four_inch_Card { margin-left: 0 !important; width: 100% !important; margin-bottom: 20px; } .accessories_main_container { text-align: center; .ora_series { margin-top: 1rem !important; } } .zeno_products_main_container { text-align: center; } .Fyro_main_card { text-align: center; } .ad_banner { text-align: center; .ad_banner_img { width: 100% !important; } } .owl-dots { text-align: center; margin-top: 0 !important; } .home-main-container { h5 { font-size: 1rem; } h6 { font-size: 1rem; } .sec-space-1 { margin-top: 40px; } .sec-space-2 { margin-top: 40px; } .banner-main-container { display: block !important; text-align: center; .col-md-6 { padding-top: 7rem; .button_dark { display: none; } } .mobile-home-img { width: 85%; } h1 { font-size: 2rem; } } .hero-banner { background-position: 0; } .aw-main-features { display: none; } .mobile-text-center { text-align: center; } .aw-feature-name { h5 { transform: rotate(0deg); -ms-writing-mode: lr-tb; writing-mode: horizontal-tb; } } .products-main-container { .enterprise-prd { margin-top: 10px; } .consumer-prd { margin-top: 10px; } } .news-letter-sec { a.button_dark { padding: 10px 5px; } } .owl-carousel.star-products-img-sec { .d-flex { justify-content: center !important; } .owl-nav { text-align: center; margin-right: 0px; } } .star-products { .owl-dots { display: none; } } .aw-support-sec-main-container { .row { margin: 0px !important; text-align: center; } .col-md-4 { border: none !important; } .support-sec-heading { padding: 0 !important; } } .offer-main-sec { margin-bottom: 0 !important; padding: 0 !important; } .offer-sec { p { font-size: 0.85rem; } } } .footer-wrapper { .accordion-button { font-family: $font-family_2; color: $color_4; background-color: $background-color_9; &:not(.collapsed) { &::after { background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23fff'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e"); } } } .accordion-body { font-family: $font-family_2; color: $color_4; background-color: $background-color_9; } .accordion-button.collapsed { &::after { background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23fff'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e"); } } .footer-sub-content { p { font-size: 0.85rem; } } } } @media (min-width: 405px) and (max-width: 570px) { .home-main-container { .banner-main-container { .mobile-home-img { width: 60%; } } } } @media (min-width: 1800px) { .banner-wrapper { position: relative; } .offer-main-sec { position: absolute; bottom: 15%; right: 20%; width: 60%; } } @media (tab-port) { .laptopsSection { .headinglaptop { font-size: 2rem; } } .headinglaptopSub { font-size: 1rem; } } @media (max-width: 320px) { .laptopsSection { .headinglaptopSub { text-align: center; font-size: 1rem; } .laptopSectionDesP { gap: 2rem !important; } } .allinoneDualMarginTop { .allinoneDualMarginTop_p { text-align: center; font-size: 1rem; } .allinoneDualMarginTop_pContainer { width: 100%; } .clipPathSectionCol { padding-left: 0 !important; padding-right: 0 !important; } margin-top: 100px; .innerClipPathImgFirstThree { top: 0; } } .clipPathSectionCol { .innerClipPathImgSectionThree { top: 22%; } .innerClipPathImgSectionFour { top: 22%; } .innerClipPathImgFirstFour { top: 0; } } } @media only screen and (max-width: 56.25em) { body { padding: 0; } } @media (min-width: 1990px) { .footer-wrapper { .footer-rkt { right: 45px !important; } } } @media (max-width: 1024px) { #navbar-head { .navbar-nav { gap: 0; .dropdown-menu { margin-top: 0; } } } .navbar-toggler { color: $color_6; span { display: block; background-color: $background-color_16; height: 3px; width: 25px; margin-top: 5px; margin-bottom: 5px; position: relative; left: 0; opacity: 1; transition: all 0.35s ease-out; transform-origin: center left; &:nth-child(1) { transform: translate(0%, 0%) rotate(0deg); margin-top: 0.3em; } &:nth-child(2) { opacity: 1; } &:nth-child(3) { transform: translate(0%, 0%) rotate(0deg); } } &:not(.collapsed) { span { &:nth-child(1) { transform: translate(15%, -33%) rotate(45deg); } &:nth-child(2) { opacity: 0; } &:nth-child(3) { transform: translate(15%, 33%) rotate(-45deg); } } } } } @media (max-width: 991px) { #navbar-head { .accordion-button { &:not(.collapsed) { background-color: $background-color_15; color: $color_7; box-shadow: none; font-weight: bold; &::after { background-image: url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' fill='%23333' xmlns='http://www.w3.org/2000/svg'%3e%3cpath fill-rule='evenodd' d='M0 8a1 1 0 0 1 1-1h14a1 1 0 1 1 0 2H1a1 1 0 0 1-1-1z' clip-rule='evenodd'/%3e%3c/svg%3e"); } } font-family: $font-family_2; &:focus { box-shadow: none; } &::after { background-image: url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' fill='%23333' xmlns='http://www.w3.org/2000/svg'%3e%3cpath fill-rule='evenodd' d='M8 0a1 1 0 0 1 1 1v6h6a1 1 0 1 1 0 2H9v6a1 1 0 1 1-2 0V9H1a1 1 0 0 1 0-2h6V1a1 1 0 0 1 1-1z' clip-rule='evenodd'/%3e%3c/svg%3e"); transform: scale(0.7) !important; } } .accordion-body { ul { li { font-size: 1rem; font-family: $font-family_2; color: $color_8; line-height: 2.5rem; a { font-size: 1rem; font-family: $font-family_2; color: $color_8; line-height: 2.5rem; } } } } } .delivery-to-sec { .d-flex { font-size: 0.7rem; } .button_dark { font-size: 0.7rem; } } }