@import url(https://fonts.googleapis.com/css?family=Roboto);html { font-size: 3px; } body { font-size: initial; } @media screen and (min-width: 306px) { html { font-size: 3px; } } @media screen and (min-width: 408px) { html { font-size: 4px; } } @media screen and (min-width: 450px) { html { font-size: 5px; } } @media screen and (min-width: 882px) { html { font-size: 3px; } } @media screen and (min-width: 1176px) { html { font-size: 4px; } } @media screen and (min-width: 1470px) { html { font-size: 5px; } } .infoblock-odd, .infoblock-even { width: 306rem; height: 108rem; margin: 0 auto; padding: 12rem; box-sizing: border-box; } .infoblock-odd img { width: 102rem; height: 84rem; } .infoblock-even img { width: 114rem; height: 84rem; } .shopping_cart, .img_btn-up { position: relative; width: 12rem; height: 12rem; } .service .h2, .contacts .h2 { margin: 0; font-weight: 900; line-height: 18rem; font-size: 12rem; text-transform: uppercase; color: #333333; } .footer_top .h3, .footer_message .h3, .features .h3, .features h3, .content .h3 { margin: 0; font-weight: bold; line-height: 12rem; font-size: 8rem; text-transform: uppercase; color: #333333; } .features_block h4 { margin: 0; font-weight: bold; line-height: 9rem; font-size: 6rem; text-align: left; text-transform: uppercase; color: #333333; } .features .features_block a { color: #ff0000; font-size:3.2rem; text-decoration:none; border-bottom:1px dotted #ff0000; } .features .features_block a:hover { 1color: blue; border-bottom:2px dotted #ff0000; font-weight:bold; } .features_block img{ max-width: 100%; } @media screen and (max-width: 882px) { .table_base.with-table { padding: 0; border: 0; } .features .features_block a { font-size:3.2rem; } } #tabs .features .features_block a{ color: inherit; font-size:inherit; text-decoration:underline; border-bottom:inherit; } .footer_top .h5, .footer_message .h5, .features_block h5 { margin: 0; font-weight: bold; line-height: 8rem; font-size: 5rem; text-transform: uppercase; color: #333333; } .feedback_btn, .features_block h6, .items.s4 .item h6 { margin: 0; font-weight: bold; line-height: 6rem; font-size: 4rem; text-align: center; text-transform: uppercase; color: #FFFFFF; } .footer_infoblock-text .h6-s, .h6-s { margin: 0; font-weight: bold; line-height: 6rem; font-size: 4rem; color: #333333; } .service .p, .p { margin: 0; font-weight: normal; line-height: 6rem; font-size: 4rem; color: #333333; } .items.s3 .item p, .items.s4 .item p { margin: 0; font-weight: normal; line-height: 5rem; font-size: 3rem; color: #333333; } .footer_bottom-left, .footer_infoblock-text .tagline { margin: 0; font-weight: normal; line-height: 6rem; font-size: 3rem; color: #FFFFFF; } * { font-family: 'Roboto'; } header { width: 100%; overflow: hidden; background: #CC3336; } .header_top { width: 306rem; height: 24rem; margin: 0 auto; color: #FFFFFF; } .header_top-left { float: left; } .header_top-left img { width: 78rem; height: 24rem; } .header_top-left-text { display: inline-block; width: 47rem; height: 12rem; margin: 6rem 0; vertical-align: top; font-weight: bold; line-height: 6rem; font-size: 4rem; text-transform: uppercase; } .header_top-right { float: right; } .header_top-right-text { display: inline-block; width: 48rem; height: 11.8rem; margin-top: 6.2rem; vertical-align: bottom; font-weight: normal; line-height: 5rem; font-size: 3rem; text-align: right; } .header_top-mobile { display: inline-block; width: 66rem; height: 12.6rem; margin: 6rem 12rem 0 6rem; vertical-align: top; } .header_top-mobile img { width: 12.2rem; height: 11.8rem; } .header_top-mobile-info { display: inline-block; width: 51.8rem; vertical-align: top; } .header_mobile_text { width: 53.8rem; height: 4rem; line-height: 5rem; font-size: 3rem; } .header_mobile_number { width: 44rem; height: 9rem; font-weight: bold; line-height: 9rem; font-size: 6rem; } .header_bottom { position: relative; width: 100%; height: 12rem; background: #B22428; } .header_bottom-info { width: 306rem; margin: 0 auto; text-align: center; } .header_info-wrapper { display: inline-block; width: 100%; text-align: right; padding-right: 30rem; box-sizing: border-box; } .header_bottom-nav { top: 0px; float: left; height: 12rem; line-height: 12rem; position: absolute; color: #FFFFFF; } .header_bottom-nav img { position: relative; top: 5%; height: 3rem; } .header_bottom-nav img:first-child { top: 3%; margin-left: 9rem; } .header_bottom-nav img:not(:first-child) { padding: 0 3rem; } .header_nav_text-frst { display: inline-block; font-weight: normal; line-height: 5rem; font-size: 3rem; text-align: center; } .header_nav_text-scnd { display: inline-block; font-weight: normal; line-height: 6rem; font-size: 3rem; text-align: center; } .header_bottom-infoblock { display: inline-block; width: 42rem; height: 100%; margin-left: -1rem; text-align: center; box-sizing: border-box; } .header_bottom-infoblock a { vertical-align: bottom; font-weight: bold; line-height: 10rem; font-size: 4rem; color: #FFFFFF; text-decoration: none; text-transform: uppercase; } .header_bottom-infoblock a:hover { cursor: pointer; } .header_bottom-infobock-chosen a { color: #FFA9A6; } .header_bottom-infobock-chosen a:hover { cursor: default; } .shopping_cart { display: inline-block; position: fixed; top: 18rem; margin-left: 6rem; z-index: 10; } .header_menu-m { display: none; } .header_menu-icon { display: none; } @media screen and (max-width: 882px) { header { position: fixed; z-index: 10; top: 0; } .header_top { width: 106rem; height: 16rem; margin: 0; padding: 0 8rem 0 10rem; box-sizing: border-box; } .header_top-left img { width: 48rem; height: 16rem; margin-left: -2rem; } .header_top-left-text { display: none; } .header_top-right { float: right; } .header_top-right-text { display: none; } .header_top-mobile { display: none; } .header_bottom { height: 2rem; } .header_bottom-info { width: 79.5rem; } .header_bottom-nav { display: none; } .header_info-wrapper { display: inline-block; width: 100%; text-align: right; padding-right: 50rem; box-sizing: border-box; } .header_bottom-infoblock { display: none; } .shopping_cart { position: absolute; top: -15.4rem; right: 20rem; width: 8rem; height: 8rem; margin: 4rem 4rem 4rem 0; } .header_menu-icon { position: absolute; display: inline-block; width: 8rem; height: 8rem; margin-top: 3.66667rem; margin-right: 10rem; top: -15.33333rem; right: 0; } .header_menu-m { max-height: 100%; position: fixed; display: block; width: 100%; height: 100%; top: 0; right: -100%; z-index: 101; background: #B22428; color: #FFFFFF; transition: 0.5s; } .header_menu-m .btn-exit { position: absolute; width: 18px; height: 18px; right: 10rem; } .header_menu-m .btn-exit img { height: 100%; width: 100%; } .header_menu-m .header_menu-m-image-wrapper { width: 100%; position: relative; } .header_logo-m { width: 48rem; height: 16rem; margin-left: 8rem; } .header_menu-header { width: 90rem; height: 18rem; margin: 12.66667rem auto 18rem; font-weight: normal; line-height: 8rem; font-size: 6rem; text-align: center; } .header_menu-list { width: 90rem; height: 12rem; margin: 0 auto; } .header_menu-list a { display: block; text-decoration: none; font-weight: bold; line-height: 12rem; font-size: 8rem; text-align: center; text-transform: uppercase; color: #FFFFFF; } .header_menu-list a:nth-child(2) { margin: 6rem 0; } .header_menu_infoblock { display: inline-block; position: absolute; bottom: 27.66667rem; left: 50%; transform: translateX(-50%); width: 60rem; } .header_menu_infoblock img { width: 12rem; height: 12rem; } .header_infoblock-text { display: inline-block; width: fit-content; height: 12rem; margin-left: 0; vertical-align: top; color: #FFFFFF; } .header_mobile_text { width: 46rem; height: 4rem; line-height: 4rem; font-size: 3rem; } .header_mobile_number { width: 46rem; height: 8rem; line-height: 9rem; font-size: 6rem; } .header_menu-copyright { position: absolute; width: 90rem; bottom: 4rem; left: 50%; transform: translateX(-50%); font-weight: normal; line-height: 6rem; font-size: 4rem; text-align: center; } } * { font-family: 'Roboto'; } a { display: inline-block; } .infoblock-odd-wrapper .owl-nav, .infoblock-even-wrapper .owl-nav { z-index: 0 !important; position: absolute; width: 100%; margin: 0 !important; } .infoblock-odd-wrapper .owl-nav button, .infoblock-even-wrapper .owl-nav button { width: 4rem; height: 4rem; background: url("") no-repeat !important; background-size: contain !important; margin: 0 !important; } .infoblock-odd-wrapper .owl-nav button:first-child, .infoblock-even-wrapper .owl-nav button:first-child { float: left; background-image: url("../img/fal-angleleft-active.png") !important; } .infoblock-odd-wrapper .owl-nav button.disabled:first-child, .infoblock-even-wrapper .owl-nav button.disabled:first-child { background-image: url("../img/fal-angleleft-disabled.png") !important; } .infoblock-odd-wrapper .owl-nav button:last-child, .infoblock-even-wrapper .owl-nav button:last-child { float: right; background-image: url("../img/fal-angleright-active.png") !important; } .infoblock-odd-wrapper .owl-nav button.disabled:last-child, .infoblock-even-wrapper .owl-nav button.disabled:last-child { background-image: url("../img/fal-angleright-disabled.png") !important; } .main_block { width: 100%; min-height: 100%; overflow: hidden;} .main_block.space_for_fixed_basket { padding-bottom: 20rem; } .infoblock-even-wrapper { position: relative; width: 100%; background: #f2f2f2; } .infoblock-odd-wrapper { position: relative; width: 100%; background: #FFFFFF; } .infoblock-odd img { margin-right: 12rem; } .infoblock-odd img:hover { cursor: pointer; } .infoblock-odd .infoblock-text { float: right; } .infoblock-even img { float: right; margin-left: 6rem; } .infoblock-even img:hover { cursor: pointer; } .infoblock-even .infoblock-text { float: left; text-align: right; } .infoblock-even .btn-grey { background: inherit; } .infoblock-text { display: inline-block; vertical-align: top; color: #333333; } .infoblock_header-frst { width: 162rem; height: fit-content; font-weight: 900; line-height: 18rem; font-size: 12rem; text-transform: uppercase; } .infoblock_header-scnd { width: 162rem; height: fit-content; margin-bottom: 6rem; font-style: normal; font-weight: bold; line-height: 9rem; font-size: 6rem; text-transform: uppercase; box-sizing: border-box; } .infoblock_body { display: inline-block; width: 138rem; height: 18rem; margin-bottom: 12rem; font-weight: normal; line-height: 6rem; font-size: 4rem; } .infoblock_btn button:first-child { margin-right: 6rem; } .btn-red { display: inline-block; width: 42rem; height: 12rem; border: 1rem solid #CC3336; background: transparent; text-align: center; color: #CC3336; font-weight: bold; line-height: 6rem; font-size: 4rem; text-transform: uppercase; outline: none; } .btn-red:hover { cursor: pointer; } .btn-grey { display: inline-block; width: 66rem; height: 12rem; border: 1rem solid #CCCCCC; background: transparent; text-align: center; color: #CC3336; font-weight: bold; line-height: 6rem; font-size: 4rem; text-transform: uppercase; outline: none; } .btn-grey:hover { cursor: pointer; } .infoblock-opened { display: none; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: #CCCCCC; z-index: 1; } .opened-wrapper { position: relative; width: 306rem; height: 108rem; margin: 0 auto; padding: 0 12rem 0; box-sizing: border-box; } .opened_header { display: inline-block; position: relative; width: 100%; height: 12rem; margin-top: 6rem; font-weight: bold; line-height: 12rem; font-size: 6rem; text-transform: uppercase; color: #333333; } .btn-exit { position: absolute; display: inline-block; width: 5.2rem; height: 5.2rem; right: 0%; bottom: 50%; transform: translate(0, 50%); text-align: center; box-sizing: border-box; } .opened_elements-wrapper { overflow: hidden; height: 85rem; text-align: center; } .opened_element { display: inline-block; margin-bottom: 8.4rem; width: 100%; margin-left: 18rem; text-align: center; vertical-align: top; cursor: pointer; } .opened_element:first-child { margin-left: 0; } a.opened_element { color: inherit; text-decoration: none; } .opened_img-wrapper { display: inline-block; width: 42rem; height: 42rem; margin-top: 4rem; border-radius: 50%; background: #E5E5E5; box-sizing: border-box; } .opened_img-wrapper img { position: relative; top: -2rem; width: 46rem; height: 46rem; } .centerFlex { display: flex; align-items: center; text-align: center; justify-content: center; } .opened_text { height: 18rem; margin-top: 4rem; font-weight: bold; line-height: 9rem; font-size: 6rem; text-align: center; color: #CC3336; } .uppercase { text-transform: uppercase; } .infoblock-opened-chosen { display: none; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: #CCCCCC; z-index: 2; } .chosen-wrapper { position: relative; width: 306rem; height: 108rem; margin: 0 auto; padding: 0 12rem 0; box-sizing: border-box; } .chosen_header { position: relative; min-height: 12rem; line-height: 12rem; margin-top: 6rem; width: 100%; } .arrow_icon { display: inline-block; font-family: "Font Awesome 5 Pro"; width: 4rem; height: 4rem; position: relative; top: 0.6rem; padding: 0 2rem; } .chosen_topic-frst { display: inline-block; width: fit-content; cursor: pointer; font-weight: bold; font-size: 4rem; text-transform: uppercase; color: #B22428; } .chosen_topic-scnd { display: inline-block; width: fit-content; font-weight: bold; font-size: 4rem; text-transform: uppercase; color: #333333; } .opened_text-frst { display: flex; align-items: center; text-align: center; justify-content: center; height: 12rem; font-weight: bold; line-height: 6rem; font-size: 4rem; } .opened_text-scnd { display: flex; align-items: center; text-align: center; justify-content: center; height: 6rem; font-weight: normal; line-height: 5rem; font-size: 3rem; } @media screen and (max-width: 882px) { .main_block { margin-top: 17.33333rem; padding-bottom: 156rem; } .main_block.space_for_fixed_basket { padding-bottom: 156rem; } .infoblock-odd { position: relative; width: 106rem; height: 54rem; padding: 6rem 8rem; box-sizing: border-box; } .infoblock-odd img { width: 30rem; height: 30rem; margin-right: 6rem; margin-top: 6rem; } .infoblock-odd .infoblock_btn { position: absolute; bottom: 0; } .infoblock-even { position: relative; width: 106rem; height: 54rem; padding: 6rem 8rem; } .infoblock-even img { width: 30rem; height: 30rem; margin-left: 6rem; margin-top: 6rem; } .infoblock-even .btn-red { position: absolute; top: 0.33333rem; left: 18.33333rem; } .infoblock-even .btn-grey { position: absolute; top: 10.33333rem; left: 18.33333rem; } .infoblock-even:last-child img { margin-top: 0; } .infoblock-text { width: 42rem; height: 42rem; position: absolute; top: 0; margin-top: 6rem; box-sizing: border-box; } .infoblock_header-frst { width: 54rem; margin-bottom: 2rem; line-height: 6rem; font-size: 5rem; } .infoblock_header-scnd { width: 54rem; height: 8rem; margin-bottom: 2rem; line-height: 4rem; font-size: 3rem; } .infoblock_body { display: none; } .infoblock_btn { width: 54.33333rem; position: relative; } .infoblock_btn button:first-child { margin-right: 0; } .btn-red { display: inline-block; width: 36rem; height: 12rem; border: 1rem solid #CC3336; background: transparent; text-align: center; color: #CC3336; font-weight: bold; line-height: 6rem; font-size: 4rem; text-transform: uppercase; outline: none; height: 8rem; line-height: 4rem; font-size: 3rem; margin-bottom: 2rem; } .btn-red:hover { cursor: pointer; } .btn-grey { display: inline-block; width: 36rem; height: 12rem; border: 1rem solid #CCCCCC; background: transparent; text-align: center; color: #CC3336; font-weight: bold; line-height: 6rem; font-size: 4rem; text-transform: uppercase; outline: none; height: 8rem; line-height: 4rem; font-size: 3rem; } .btn-grey:hover { cursor: pointer; } .opened-wrapper { width: 106rem; height: 54rem; padding: 0 8rem 0 8rem; } .opened_header { position: relative; width: 100%; height: 4rem; margin-top: 4rem; line-height: 4rem; font-size: 3rem; } .btn-exit { width: 3rem; height: 3rem; margin-top: 1rem; } .opened_elements-wrapper { height: 50rem; } .opened_elements-wrapper .owl-dots { margin-top: 2rem !important; } .opened_elements-wrapper .owl-nav { margin-top: 5rem !important; } .owl-stage-outer { height: 34rem; } .opened_element { margin-left: 8rem; } .opened_element:first-child { margin-left: 0; } .opened_img-wrapper { width: 18rem; height: 18rem; margin: 0; margin-top: 4rem; border-radius: 50%; background: #E5E5E5; box-sizing: border-box; } .opened_img-wrapper img { position: relative; top: -3.33333rem; width: 22rem; height: 22rem; } .opened_text { height: 12rem; margin: 0; font-weight: bold; line-height: 6rem; font-size: 4rem; } .chosen-wrapper { position: relative; width: 106rem; height: 54rem; padding: 0 8rem 0; } .chosen-wrapper .opened_text-frst { text-transform: none; } .chosen-wrapper .owl-dots { margin-top: 1.33333rem !important; } .chosen-wrapper .owl-nav { margin-top: 4rem !important; } .infoblock-odd-wrapper .owl-nav button, .infoblock-even-wrapper .owl-nav button { width: 3.33333rem; height: 3.33333rem; } .chosen_header { display: inline-block; position: relative; margin-top: 4rem; width: 100%; min-height: 4rem; line-height: 4rem; } .arrow_icon { height: 3rem; padding: 0 1.33333rem; } .chosen_topic-frst { height: 4rem; line-height: 4rem; font-size: 3rem; } .chosen_topic-scnd { height: 4rem; line-height: 4rem; font-size: 3rem; } .opened_text-frst { height: 12rem; line-height: 6rem; font-size: 4rem; } .opened_text-scnd { display: none; } } footer { width: 100%; overflow: hidden; background: #333333;} footer.push-up { bottom: 24rem; } .footer_top { position: relative; width: 306rem; height: 60rem; margin: 6rem auto; color: #FFFFFF; } .footer_top .h5 { width: 234rem; height: 12rem; margin: 0 auto; text-align: center; color: #FFFFFF; box-sizing: border-box; } .footer_top .h3 { width: 282rem; height: 12rem; margin: 0 auto 6rem; text-align: center; color: #FFFFFF; } .footer_feedback { width: fit-content; margin: 0 auto; } .feedback_input-wrapper { display: inline-block; vertical-align: top; width: 90rem; height: 12rem; background: #4C4C4C; box-sizing: border-box; } .feedback_input-wrapper img { display: inline-block; position: relative; width: 3.6rem; height: 4.2rem; margin: 4.2rem 4rem 2rem 5rem; vertical-align: top; box-sizing: border-box; } .feedback_input-wrapper:nth-child(2) { margin: 0 6rem; } .feedback_input { display: inline-block; width: 74rem; height: 8rem; background: #4C4C4C; border: none; outline: none; font-weight: 300; line-height: 6rem; font-size: 4rem; color: #CCCCCC; margin: 2rem; margin-left: 0; vertical-align: top; box-sizing: border-box; } .feedback_input:hover { cursor: text; } .feedback_input::placeholder { color: #CCCCCC; } .feedback_btn { width: 42rem; height: 12rem; padding: 0; background: #CC3336; border: none; box-sizing: border-box; outline: none; } .feedback_btn:hover { cursor: pointer; } .footer_bottom-wrapper { width: 100%; background: #CC3336; color: #FFFFFF; } .footer_bottom { width: 306rem; height: 24rem; margin: 0 auto; } .footer_bottom-left { float: left; width: 138rem; height: 12rem; margin: 6rem 6rem 6rem 12rem; } .footer_bottom-right { float: right; width: 138rem; height: 12rem; margin: 6rem 12rem 6rem 0; box-sizing: border-box; } .footer_infoblock { display: inline-block; width: 66rem; height: 12rem; } .footer_infoblock img { width: 12.2rem; height: 11.8rem; } .footer_infoblock:first-child { margin-right: 5rem; } .footer_infoblock-text { display: inline-block; width: 52rem; height: 12rem; margin-left: 0.6rem; vertical-align: top; } .footer_infoblock-text .tagline { width: 52rem; height: 4rem; } .footer_infoblock-text .h6-s { width: 52rem; height: 8rem; color: #FFFFFF; line-height: 9rem; } .footer_btn-up { display: inline-block; position: fixed; bottom: 18rem; margin-left: 132.4rem; z-index: 11; } .footer_btn-up-hidden { display: none; } .img_btn-up:hover { cursor: pointer; } .footer_message { position: absolute; top: 0; width: 100%; height: 100%; z-index: 2; background: #333333; } .footer_message .h3 { width: 282rem; height: 18rem; margin: 0 auto; text-align: center; } .footer_message .h5 { width: 234rem; height: 12rem; margin: 10rem auto 0; text-align: center; } .footer_message .h5 span { font-weight: bold; } .footer_message .btn-exit { margin: 6rem 12rem 0 0; right: 2rem; top: -6rem; } .footer_message .btn-exit img:hover { cursor: pointer; } @media screen and (max-width: 882px) { footer.push-up { bottom: 0; } .footer_top { position: relative; width: 106rem; height: 90rem; margin: 6rem auto 0; } .footer_top .h3 { width: 90rem; height: 12rem; margin: 0 auto; line-height: 4rem; font-size: 3rem; } .footer_top .h5 { width: 90rem; height: 18rem; margin: 0 auto 4rem; line-height: 6rem; font-size: 5rem; } .footer_feedback { position: absolute; left: 50%; transform: translateX(-50%); width: 78rem; } .feedback_input-wrapper { width: 78rem; height: 10rem; } .feedback_input-wrapper img { width: 6rem; height: 6rem; margin: 2rem 2rem 2rem 2.66667rem; } .feedback_input-wrapper:nth-child(2) { margin: 4rem 0; } .feedback_input { width: 64rem; height: 6rem; line-height: 4rem; font-size: 4rem; margin: 2rem; margin-left: 0; } .feedback_btn { width: 78rem; height: 10rem; line-height: 10rem; font-size: 4rem; } .feedback_btn:hover { outline: none; } .footer_bottom-wrapper { width: 100%; background: #CC3336; color: #FFFFFF; } .footer_bottom { position: relative; width: 106rem; height: 60rem; } .footer_bottom-left { position: absolute; bottom: 0; width: 90rem; height: 12rem; line-height: 4rem; font-size: 3rem; margin: 6rem 8rem; text-align: center; } .footer_bottom-right { position: absolute; left: 50%; transform: translateX(-50%); top: 0; width: 100%; height: 30rem; margin: 6rem 0 0 0; text-align: center; } .footer_infoblock { display: inline-block; width: fit-content; } .footer_infoblock img { width: 12rem; height: 12rem; } .footer_infoblock:first-child { position: absolute; top: 11.66667rem; left: 15%; transform: none; margin: 6rem 0 0 0; text-align: left; } .footer_infoblock:first-child img { margin-right: 6px; } .footer_infoblock:last-child img { margin-right: -1rem; } .footer_infoblock-text { display: inline-block; width: fit-content; height: 12rem; margin-left: 0; vertical-align: top; text-align: left; } .footer_infoblock-text .tagline { width: 46rem; height: 4rem; line-height: 4rem; font-size: 3rem; } .footer_infoblock-text .h6-s { width: 64rem; height: 8rem; line-height: 9rem; font-size: 6rem; } .footer_btn-up { display: none; } .footer_message .h5 { width: 90rem; height: 20rem; margin: 25rem auto 0; line-height: 4rem; font-size: 3rem; } .footer_message .h3 { width: 90rem; height: 20rem; line-height: 6rem; font-size: 5rem; } } .hero { position: relative; width: 276rem; margin: 12rem auto; color: #333333; } .hero .chosen_header { display: none; } .hero .feedback_btn { position: absolute; top: 24.2rem; right: 6.4rem; width: 48rem; height: 20rem; line-height: 9rem; font-size: 6rem; } .item_header-frst { position: absolute; width: 180rem; height: 12rem; right: 0; font-weight: 900; line-height: 18rem; font-size: 9rem; text-transform: uppercase; justify-content: left; } .item_header-scnd { position: absolute; width: 180rem; right: 0; top: 12.2rem; font-weight: bold; line-height: 8rem; font-size: 5rem; text-transform: uppercase; justify-content: left; } .hero_item-img { width: 78rem; height: 78rem; margin: 12rem 18rem 12rem 0; border-radius: 50%; background: #f2f2f2; } .hero_item-img img { width: 78rem; height: 78rem; } .hero_item-carousel-wrapper { width: 78rem; } .hero_item-carousel, .video_carousel { width: 90rem; text-align: center; /* &.owl-theme{ .owl-nav { margin: 0; position: absolute; top: v(30); left: v(-30); width: v(450); color: #CC3336; .owl-prev { float: left; } .owl-next { float: right; } button { margin: 0; &:hover { background: transparent; color: inherit; outline: none; } &.disabled { color: #A6A6A6; opacity: initial; } } .owl-next span, .owl-prev span { font-family: "Font Awesome 5 Pro"; line-height: 30px; font-size: 30px; } } } */ } .hero_item-carousel img, .video_carousel img { width: 18rem; height: 18rem; border-radius: 50%; border: 5px solid #CCCCCC; margin: 0 auto; border-radius: 50%; box-sizing: border-box; } .hero_item-carousel img.chosen, .video_carousel img.chosen { border: none; border-radius: 0; } .hero_item-carousel .owl-nav, .video_carousel .owl-nav { z-index: -1 !important; position: absolute; width: 90rem; margin: 0 !important; left: -5rem; bottom: 7rem; } .hero_item-carousel .owl-nav button, .video_carousel .owl-nav button { width: 4rem; height: 4rem; background: url("") no-repeat !important; background-size: contain !important; margin: 0 !important; } .hero_item-carousel .owl-nav button:first-child, .video_carousel .owl-nav button:first-child { float: left; background-image: url("../img/fal-angleleft-active.png") !important; } .hero_item-carousel .owl-nav button.disabled:first-child, .video_carousel .owl-nav button.disabled:first-child { background-image: url("../img/fal-angleleft-disabled.png") !important; } .hero_item-carousel .owl-nav button:last-child, .video_carousel .owl-nav button:last-child { float: right; background-image: url("../img/fal-angleright-active.png") !important; } .hero_item-carousel .owl-nav button.disabled:last-child, .video_carousel .owl-nav button.disabled:last-child { background-image: url("../img/fal-angleright-disabled.png") !important; } .hero_select-add { position: relative; display: block; width: 234rem; height: 20rem; margin: 0 auto 14rem; } .hero_select-add .hero-select { display: inline-block; position: relative; width: 144rem; top: 0; right: 0; margin: 0; } .hero_select-add .select_item-name { margin: 3rem 5rem; } .hero_select-add .select_header-frst { height: 6rem; line-height: 7rem; font-size: 6rem; } .hero_select-add .select_header-scnd { height: 6rem; line-height: 6rem; font-size: 4rem; } .hero_select-add .select_price { height: 12rem; margin: 3rem 5rem 3rem 0; } .hero_select-add .select_price-amount { height: 6rem; line-height: 7rem; font-size: 6rem; } .hero_select-add .select_price-amount img { width: 4rem; height: 4rem; vertical-align: baseline; } .hero_select-add .select_price-avaliable { line-height: 5rem; font-size: 3rem; } .hero_select-add .feedback_btn { position: absolute; top: 0; right: 0; width: 90rem; height: 20rem; background: transparent; border: 5px solid #CCCCCC; border-left: 0; color: #CC3336; } .hero-select { position: absolute; width: 126rem; right: 54.4rem; top: 22.2rem; margin: 2rem 0 8rem; background: white; border: 1rem solid #f2f2f2; box-sizing: border-box; } .hero-select .hero-select_item { position: relative; display: block; width: 100%; min-height: 18rem; } .hero-select .hero-select_item:not(:first-child) { display: none; } .hero-select .hero-select_item .arrow_down { display: none; } .hero-select.multiple-items { background: #F2F2F2; border-color: #CCCCCC; font-size: 4rem; } .hero-select.multiple-items .hero-select_item:first-child .arrow_down { display: block; position: absolute; width: 4rem; right: 0; margin-right: 6rem; bottom: 50%; transform: translate(0, 50%); } .hero-select.multiple-items.clicked { z-index: 2; } .hero-select.multiple-items.clicked .hero-select_item { width: 100%; } .hero-select.multiple-items.clicked .hero-select_item:not(:first-child) { display: block; } .hero-select.multiple-items .select_header-frst { font-size: 4rem; } .hero-select.multiple-items .select_price { margin-right: 16rem; } .hero-select.multiple-items .select_price .select_price-amount { font-size: 4rem; } .select_item-name { float: left; margin: 4rem 6rem 0; } .select_header-frst { font-weight: bold; line-height: 6rem; font-size: 5rem; } .select_header-scnd { font-weight: normal; line-height: 5rem; font-size: 3rem; } .select_price { float: right; height: 10rem; margin: 4rem 6rem 4rem 0; text-align: right; } .select_price-amount { font-weight: bold; line-height: 6rem; font-size: 5rem; } .select_price-amount img { width: 3.8rem; height: 3.8rem; vertical-align: middle; margin-left: 1rem; } .select_price-avaliable { position: relative; font-weight: normal; line-height: 5rem; font-size: 2.4rem; color: #1EC700; } .select_price-avaliable:before { content: ''; position: absolute; width: 1.4rem; height: 1.4rem; background: #1EC700; border-radius: 50%; } .item_info { position: absolute; top: 44rem; right: 6.4rem; width: 174rem; margin-top: 8rem; font-weight: normal; line-height: 6rem; font-size: 4rem; } .item_info-text { display: block; margin-bottom: 6rem; } .hero_advantages { display: inline-block; position: relative; height: 18rem; margin-bottom: 0; } .hero_advantages img { width: 18rem; height: 18rem; } .advantages_text { display: inline-block; width: 64rem; vertical-align: top; margin-left: 2rem; } .advantages_header { height: 6rem; color: #737373; font-weight: bold; line-height: 6rem; font-size: 4rem; } .advantages_body { height: 12rem; font-weight: normal; line-height: 5rem; font-size: 3rem; text-align: left; } @media screen and (max-width: 882px) { .item_header-frst, .item_header-scnd, .hero-select, .item_info, .hero_advantages { position: relative; top: 0; left: 0; } .hero { width: 90rem; margin: 6rem auto 12rem; color: #333333; } .hero .chosen_header { display: block; } .hero .chosen_topic-frst { vertical-align: top; } .hero .chosen_topic-scnd { vertical-align: top; } .hero .arrow_icon { vertical-align: top; margin-top: 0; } .hero .feedback_btn { position: relative; top: 0; right: 0; width: 90rem; height: 14rem; line-height: 8rem; font-size: 6rem; } .item_header-frst { width: 90rem; height: 24rem; font-weight: 900; line-height: 8rem; font-size: 6rem; text-transform: uppercase; justify-content: left; } .item_header-scnd { width: fit-content; font-weight: bold; line-height: 4rem; font-size: 3rem; text-transform: uppercase; } .hero_item-img { width: 66rem; height: 66rem; margin: 6rem auto; border-radius: 50%; background: #f2f2f2; } .hero_item-img img { width: 66rem; height: 66rem; } .hero_item-carousel-wrapper { width: 66rem; margin: 0 auto; } .hero_item-carousel { width: 100%; text-align: center; } .hero_item-carousel img { width: 18rem; height: 18rem; border: 3px solid #CCCCCC; } .hero_item-carousel .owl-stage-outer { height: initial; } .hero_item-carousel.owl-theme .owl-nav { width: 78rem; top: 6.66667rem; left: -6rem; } .hero_item-carousel.owl-theme .owl-nav .owl-next span, .hero_item-carousel.owl-theme .owl-nav .owl-prev span { font-family: "Font Awesome 5 Pro"; line-height: 8rem; font-size: 6rem; } .hero-select { width: 90rem; border: 1rem solid #f2f2f2; margin: 6rem 0 4rem; box-sizing: border-box; } .hero-select .hero-select_item { display: flex; align-items: center; } .hero-select .hero-select_item:not(:first-child) { display: none; } .hero-select.multiple-items .hero-select_item:first-child .arrow_down { display: none; } .hero-select.multiple-items .hero-select_item .select_price { margin-right: 4rem; } .hero-select.multiple-items.clicked .hero-select_item:not(:first-child) { display: flex; } .hero_select-add { display: none; } .select_item-name { float: left; width: 60rem; margin: 4rem 0 4rem 4rem; } .select_header-frst { font-weight: bold; line-height: 6rem; font-size: 5rem; } .select_header-scnd { font-weight: normal; line-height: 4rem; font-size: 3rem; } .select_price { float: right; height: 10rem; margin: 4rem 4rem 4rem 0; text-align: right; } .select_price-amount { font-weight: bold; line-height: 6rem; font-size: 4rem; } .select_price-amount img { width: 3.33333rem; height: 3.66667rem; vertical-align: middle; } .select_price-avaliable { font-weight: normal; line-height: 4rem; font-size: 3rem; color: #1EC700; } .select_price-avaliable:before { display: none; } .item_info { width: 100%; margin: 12rem 0 6rem; margin-top: 12rem; font-weight: normal; line-height: 6rem; font-size: 4rem; } .hero_advantages { display: block; height: 18rem; margin-bottom: 4rem; } .hero_advantages img { width: 18rem; height: 18rem; } .advantages_text { display: inline-block; width: 66rem; vertical-align: top; margin-left: 4.66667rem; } .advantages_header { height: 6rem; color: #737373; font-weight: bold; line-height: 6rem; font-size: 4rem; } .advantages_body { height: 12rem; font-weight: normal; line-height: 4rem; font-size: 3rem; text-align: left; } .mobile-preview > div:not(:first-child) { display: none; background: red; } .mobile-preview > div:first-child { display: block; } .mobile-preview > div:first-child.features_list :nth-child(n+4) { display: none; } } /* .h4 { @extend %h4; margin-bottom: v(15); } .h5 { @extend %h5; margin: v(30) 0 v(10); height: v(90); } .h6-s { font-weight: bold; line-height: v(30); font-size: v(20); margin-bottom: v(30); margin-top: v(15); } .h5, h5 { @extend %h5; margin: v(30) 0 v(10); height: v(90); } .features_text { font-weight: normal; line-height: v(25); font-size: v(16); } .features_list { margin: v(20) 0 v(20); } .features_list-item { position: relative; padding-left: v(24); margin-bottom: v(5); font-weight: normal; line-height: v(25); font-size: v(16); box-sizing: border-box; &:before { content: ''; position: absolute; width: v(9); height: v(9); background: $lilac; border-radius: 50%; left: v(3); top: v(8); } } .features_btn { display: none; } .p-s { @extend %p-s; display: inline-block; width: v(270); vertical-align: top; } */ .features { width: 276rem; margin: 25rem auto 14rem; font-weight: normal; line-height: 5rem; font-size: 3.2rem; } .features .h3, .features h3 { margin-bottom: 6rem; } .features ul { margin: 4rem 0 4rem; padding: 0; } .features ul li { list-style: none; position: relative; padding-left: 4.8rem; margin-bottom: 1rem; font-weight: normal; line-height: 5rem; font-size: 3.2rem; box-sizing: border-box; } .features ul li:before { content: ''; position: absolute; width: 1.8rem; height: 1.8rem; background: #FFA9A6; border-radius: 50%; left: 0.6rem; top: 1.6rem; } .img-wrapper { display: inline-block; text-align: center; } .img-wrapper img { max-width: 100%; max-height: 100%; } .features_block { color: #333333; position: relative; } .features_block h4 { margin-bottom: 3rem; } .features_block h5 { border-bottom: 6rem; } .features_block h6 { color: #333333; margin: 4rem 0; text-align: left; } .features_block p { vertical-align: top; margin-bottom: 25px; } .items { margin-top: 6rem; text-align: center; } .items .item { display: inline-flex; flex-direction: column; margin-bottom: 12rem; vertical-align: top; color: #333333; text-align: center; } .items.s1 { margin-top: 0; text-align: left; } .items.s1 .img-wrapper { height: 54rem; width: 54rem; } .items.s1 p { text-align: left; } .items.s1.text-left h4, .items.s1.text-left p { float: left; width: 198rem; } .items.s1.text-right h4, .items.s1.text-right p { float: right; width: 180rem; } .items.s1.text-right .img-wrapper { width: 84rem; height: 42rem; } .items.s1.img-right .img-wrapper { margin-left: 18rem; vertical-align: top; } .items.s1.round .img-wrapper { border-radius: 50%; } .items.s2 .item { text-align: left; } .items.s2 .item p { text-align: left; } .items.s2 .item .img-wrapper { width: 132rem; height: 84rem; margin-bottom: 12rem; } .items.s2 .item .img-wrapper:nth-child(2) { float: right; } .items.s2 .item .img-wrapper:nth-child(2)::after { content: ''; clear: both; } .items.s3 .item { width: 78rem; } .items.s3 .item h6 { margin: 4rem 0 3rem; text-align: left; } .items.s3 .item h5 { text-align: left; margin: 6rem 0; } .items.s3 .item .img-wrapper { width: 78rem; height: 60rem; } .items.s3 .item p { display: inline-block; width: 100%; vertical-align: top; text-align: left; } .items.s3 .item:nth-child(3n + 2) { margin: 0 18rem 12rem; } .items.s4 .item h6 { color: #333333; width: 66rem; margin: 6rem 0; } .items.s4 .item .img-wrapper { width: 54rem; height: 54rem; } .items.s4 .item p { display: inline-block; width: 54rem; vertical-align: top; } .items.border-grey .item .img-wrapper { border: 5px solid #CCCCCC; box-sizing: border-box; } @media screen and (max-width: 882px) { .features { width: 90rem; margin: 6rem auto 12rem; } .features h2 { font-size: 8rem; line-height: 10.66667rem; } .features .features_block .items { width: 100%; } .features .features_block .items .item { display: block; margin: 0 auto 8.33333rem; } .features .features_block .items h1, .features .features_block .items h2, .features .features_block .items h3, .features .features_block .items h4, .features .features_block .items h5, .features .features_block .items h6, .features .features_block .items p, .features .features_block .items .img-wrapper { display: block; width: initial; float: none !important; } .features .features_block .items .img-wrapper { text-align: center; margin: 0 auto; } } .features#files{ width: 100%; } /* @media screen and (max-width: 882px) { .features { width: vm(270); margin: vm(18) auto vm(36); } .features_block { color: $dark_grey; } .h4 { line-height: vm(24); font-size: vm(15); text-transform: uppercase; } .features_text { width: 100%; font-weight: normal; line-height: vm(18); font-size: vm(12); } .features_list-item { position: relative; padding-left: vm(24); margin-bottom: vm(10); font-weight: normal; line-height: vm(18); font-size: vm(12); box-sizing: border-box; &:before { content: ''; position: absolute; width: vm(9); height: vm(9); background: $lilac; border-radius: 50%; left: vm(3); top: vm(6); } } .features_btn { display: block; margin-bottom: vm(18); padding: 0; border: none; background: transparent; font-weight: bold; line-height: vm(18); font-size: vm(12); color: $bright_red; } .solution, .p-s, .model-auto { display: block; margin: vm(20) auto !important; } .img-wrapper-l { display: block; max-width: 100%; height: vm(240); margin: vm(20) auto !important; } .img-wrapper-m { display: block; width: 100%; margin: 0 auto; float: none; } .model-floor, .features_text { width: 100% !important; height: initial;; margin-bottom: vm(30); .model-floor-text-wrapper { float: none; width: 100%; } } .short { img { display: none; position: static; margin: 0 auto; } } } */ .video_block { position: relative; width: 270rem; height: 192rem; margin: 12rem auto 14rem; } .video_header { width: 270rem; height: 12rem; font-weight: bold; line-height: 12rem; font-size: 6rem; text-transform: uppercase; color: #333333; } .main_video { position: absolute; display: inline-block; width: 230rem; height: 130rem; margin: 8rem 0 12rem; left: 50%; transform: translateX(-50%); border: 10px solid #CCCCCC; } .video_carousel-wrapper { width: 230rem; margin: 0 auto; } .video_carousel { position: relative; top: 152rem; text-align: center; } .video_carousel.owl-theme .owl-nav { margin: 0; position: absolute; top: 14rem; left: -10rem; width: 250rem; color: #CC3336; } .video_carousel.owl-theme .owl-nav .owl-prev { float: left; } .video_carousel.owl-theme .owl-nav .owl-next { float: right; } .video_carousel.owl-theme .owl-nav button { margin: 0; } .video_carousel.owl-theme .owl-nav button:hover { background: transparent; color: inherit; outline: none; } .video_carousel.owl-theme .owl-nav button.disabled { color: #A6A6A6; opacity: initial; } .video_carousel.owl-theme .owl-nav .owl-next span, .video_carousel.owl-theme .owl-nav .owl-prev span { font-family: "Font Awesome 5 Pro"; font-size: 40px; } .video_item { display: inline-block; width: 50rem; height: 28rem; border: 10px solid #CC3336; } .video_item.chosen { border-color: white; } @media screen and (max-width: 882px) { .video_block { position: relative; width: 90rem; height: 102rem; margin: 12rem auto; } .video_block .owl-theme .owl-nav { z-index: 1 !important; } .video_header { width: 100%; height: 12rem; line-height: 8rem; font-size: 5rem; } .main_video { position: relative; width: 86rem; height: 50rem; margin: 0 auto 6rem auto; border: 6px solid #CCCCCC; } .video_carousel-wrapper { width: 90rem; } .video_carousel { position: relative; top: 0; } .video_carousel .owl-stage-outer { height: initial; } .video_carousel .owl-stage-outer .owl-stage { margin-bottom: 10px; } .video_carousel.owl-theme .owl-nav { position: absolute; top: 84px; left: 0; width: 90rem; color: #CC3336; } } @media screen and (max-width: 882px) and (max-width: 450px) { .video_carousel.owl-theme .owl-nav { top: 72px; } } @media screen and (max-width: 882px) and (max-width: 407px) { .video_carousel.owl-theme .owl-nav { top: 60px; } } @media screen and (max-width: 882px) { .video_carousel.owl-theme .owl-nav .owl-next span, .video_carousel.owl-theme .owl-nav .owl-prev span { font-family: "Font Awesome 5 Pro"; font-size: 6.66667rem; } .video_item { width: 22rem; height: 14rem; box-sizing: border-box; border: 6px solid #CC3336; } } .table-wrapper { display: block; width: 100%; position: relative; margin-bottom: 14rem; } .table-wrapper-scroll { width: 100%; height: 100%; overflow: auto; } .fade { position: absolute; top: 0; right: 0; z-index: 2; height: 100%; width: 50px; background-image: linear-gradient(to right, #ffffff, white); } .table_switcher { width: 282rem; height: 12rem; } @media (max-width: 576px){ .table_switcher { width: 282rem; height: auto; display: flex; flex-wrap: wrap; max-width: 100%; } .table_block-chosen:after{ height: 1rem !important; bottom: 3rem !important; } .table_base table{ display: table; } } .table_block { position: relative; display: inline-block; width: 33%; height: 12rem; text-align: center; font-weight: bold; line-height: 8rem; font-size: 5rem; text-align: center; text-transform: uppercase; color: #CC3336; } .table_block-chosen { color: #333333; } .table_block-chosen:after { position: absolute; z-index: 2; left: 0; bottom: -2rem; content: ''; width: 100%; height: 4rem; background: #CC3336; } table { display: block; border: 10px solid #E5E5E5; padding: 12rem 6rem; box-sizing: border-box; } .table { width: 282rem; margin: 0 auto; overflow: hidden; } .table-s { border-bottom: 0; } .table-s td { width: 98rem; } .table-s .table_options { width: 160rem; } .table-m { border-top: 0; } td, th { position: relative; } td.small, th.small { font-size: 3rem; line-height: 5rem; } th { width: 54rem; padding: 0; font-weight: bold; line-height: 6rem; font-size: 4rem; text-align: center; color: #333333; background: #FFFFFF; } th img { display: block; width: 30rem; height: 30rem; margin: 2rem auto 0; } .table_menu { width: 102rem; height: 12rem; font-weight: bold; line-height: 9rem; font-size: 6rem; text-align: left; vertical-align: bottom; } .table_menu-price { vertical-align: top; padding-top: 6rem; box-sizing: border-box; } .table_menu-img { height: 54rem; color: #CC3336; } tr:nth-child(2n+1) { background: #f2f2f2; } td { height: 12rem; text-align: center; font-weight: normal; line-height: 6rem; font-size: 4rem; color: #333333; } .table_options { text-align: left; } .table_price { height: 36rem; vertical-align: top; padding-top: 6rem; box-sizing: border-box; } .table_btn { width: 25rem; height: 12rem; margin-top: 2rem; font-weight: bold; line-height: 6rem; font-size: 4rem; text-align: center; text-transform: uppercase; background: #FFFFFF; color: #CC3336; border: 5px solid #CC3336; } .table_btn-chosen { background: #CC3336; color: #FFFFFF; border: none; } .table_btn:hover { cursor: pointer; } .table_applicability { position: relative; display: none; width: 282rem; padding: 14rem; box-sizing: border-box; } .table_applicability:before { content: ''; display: block; position: absolute; top: 0; right: 0; bottom: 0; left: 0; border: 10px solid #E5E5E5; } .table_applicability img { width: 12rem; height: 12rem; margin: 0 10rem 10rem 0; margin-right: 10rem; margin-left: -4px; } .table_applicability img:nth-child(12n+0) { margin-right: 0; } .table_menu, .table_options { padding-left: 6rem; } .order-notification { display: none; width: 234rem; height: 66rem; position: relative; top: 20%; margin: 0 auto; z-index: 1000; text-align: center; background: #FFFFFF; text-transform: uppercase; padding-top: 12rem; } .order-notification img { position: absolute; right: 6.4rem; top: 6.4rem; width: 5.2rem; height: 5.2rem; } .order-notification img:hover { cursor: pointer; } .order-notification .thank-you, .order-notification .manager-call { height: 12rem; font-size: 5rem; line-height: 8rem; } .order-notification .order-number { height: 18rem; font-size: 8rem; line-height: 12rem; } .order-notification .bold { font-weight: bold; } .basket-wrapper { display: none; position: fixed; width: 100%; height: 100%; z-index: 10; } .basket-wrapper_shadow { display: block; position: absolute; width: 100%; min-height: 100%; background: rgba(0, 0, 0, 0.9); z-index: 5; } .basket-wrapper-scroll { width: 100%; height: 100%; overflow: auto; } .basket { position: relative; display: block; width: 234rem; height: 144rem; padding: 6rem 12rem 12rem; left: 50%; transform: translate(-50%, 25%); background: #FFFFFF; color: #333333; z-index: 100; box-sizing: border-box; } .basket_header { height: 12rem; margin-bottom: 8rem; font-weight: bold; line-height: 11rem; font-size: 5rem; text-transform: uppercase; } .basket_header img { position: absolute; right: 6.4rem; top: 6.4rem; width: 5.2rem; height: 5.2rem; } .basket_header img:hover { cursor: pointer; } .basket_items-wrapper { height: 52rem; overflow-x: scroll; } .basket_items-wrapper::-webkit-scrollbar { display: hidden; width: 0; } .basket_item { position: relative; width: 210rem; height: 20rem; margin-bottom: 4rem; } .basket_item:last-child { margin-bottom: 10rem; } .basket_item .hero_select-add { display: inline-block; position: absolute; left: 12rem; width: fit-content; margin: 0; } .basket_item .hero-select { width: 114rem; } .basket_item .select_header-frst { line-height: 6rem; font-size: 4rem; } .basket_item .select_header-scnd { line-height: 5rem; font-size: 3rem; } .basket_item .select_price-amount { width: 24rem; line-height: 6rem; font-size: 4rem; } .basket_item .select_price-avaliable { line-height: 5rem; font-size: 3rem; } .item_number { display: inline-block; position: absolute; width: 12rem; height: 20rem; font-weight: normal; line-height: 19rem; font-size: 4rem; text-align: center; } .basket_multiply { position: absolute; left: 130rem; top: 50%; transform: translateY(-50%); width: 4rem; height: 4rem; } .amount-block { position: absolute; right: 42rem; width: 30rem; height: 100%; display: inline-block; } .item_amount { float: left; width: 18rem; height: 20rem; border: 5px solid #f2f2f2; box-sizing: border-box; font-weight: normal; line-height: 18rem; font-size: 4rem; text-align: center; } .amount-btn { float: right; width: 12rem; height: 20rem; } .btn-math { display: block; width: 12rem; height: 10rem; padding: 0; background: transparent; border: 5px solid #CCCCCC; box-sizing: border-box; outline: none; } .btn-math:hover, .btn-math img:hover { cursor: pointer; } .btn-plus { border-bottom-width: 2.5px; } .btn-plus img { width: 4.8rem; height: 4.6rem; } .btn-minus { border-top-width: 2.5px; } .btn-minus img { width: 4.8rem; height: 1rem; } .basket_equal { position: absolute; right: 30rem; top: 50%; transform: translateY(-50%); width: 4.8rem; height: 2.4rem; } .item_summ { display: inline-block; position: absolute; right: 0; top: 50%; transform: translateY(-50%); font-weight: bold; line-height: 6rem; font-size: 5rem; text-align: right; } .item_summ img { width: 3.2rem; height: 3.2rem; margin-left: 2rem; } .basket_total { width: 210rem; height: 16rem; margin: 0 auto; padding-top: 3rem; box-sizing: border-box; text-align: right; border-top: 5px solid #f2f2f2; font-weight: normal; line-height: 6rem; font-size: 4rem; text-align: right; } .total { margin-right: 6rem; } .total_summ { display: inline-block; height: 12rem; font-weight: bold; line-height: 12rem; font-size: 6rem; } .rubles-icon { width: 5rem; height: 4.4rem; margin-left: 2rem; } .basket_footer { padding: 0 12rem; width: 234rem; height: 42rem; left: 0; background: #333333; position: absolute; bottom: 0; box-sizing: border-box; } .basket_footer .basket_footer_header { width: 96rem; height: 12rem; margin-top: 6rem; font-weight: bold; line-height: 11rem; font-size: 5rem; text-transform: uppercase; color: #FFFFFF; } .basket_footer .footer_feedback { width: 210rem; position: relative; box-sizing: border-box; margin: 0; } .basket_footer .feedback_input-wrapper { width: 72rem; } .basket_footer .feedback_input-wrapper:nth-child(2) { position: relative; left: -0.6rem; } .basket_footer .feedback_input { width: 48rem; } .basket_footer .feedback_btn { width: 54rem; position: absolute; right: 0; } .basket_footer .feedback_btn:hover { cursor: pointer; } @media screen and (max-width: 882px) { .basket { bottom: initial; left: initial; transform: translateY(10%); } .basket_footer .footer_feedback .feedback_input-wrapper:nth-child(2) { margin: 0 6rem; } } .fixed_basket { display: none; position: fixed; bottom: 0; min-height: 24rem; width: 100%; background: rgba(51, 51, 51, 0.95); color: #FFFFFF; z-index: 10; } .fixed_basket-wrapper { margin: 0 auto; width: 306rem; height: 24rem; text-align: center; padding: 6rem 0; box-sizing: border-box; font-weight: 300; line-height: 9rem; font-size: 6rem; text-transform: uppercase; } .fixed_basket-wrapper .feedback_btn { vertical-align: top; margin-left: 16rem; } .items_amount { font-weight: bold; } .rubles-icon { margin: 0; } @media screen and (max-width: 882px) { .fixed_basket { display: none !important; } } .service { width: 282rem; margin: 0 auto; } .service .h2 { margin: 12rem auto 6rem; } .service .p { width: 270rem; left: 50%; margin: 0 auto 24rem; } @media screen and (max-width: 882px) { .service { width: 90rem; } .service .h2 { line-height: 6rem; font-size: 5rem; margin: 12rem auto 6rem; } .service .p { line-height: 6rem; font-size: 4rem; width: 90rem; margin: 0 auto 24rem; } } .contacts { width: 276rem; margin: 0 auto; } .contacts .h2 { width: 282rem; margin: 12rem 0 6rem 0; } .contacts a { color: #CC3336; } .p { display: inline-block; } .content { width: 276rem; margin: 0 auto 18rem; } .content .h3 { width: 138rem; margin-bottom: 6rem; } .content img { width: 36rem; height: 15.2rem; } .content .p { width: 227rem; margin-left: 6rem; } .map { float: right; width: 132rem; height: 66rem; } .map img { width: 100%; height: 100%; } .contact-info { width: 140rem; margin: 8rem 0 18rem; display: inline-block; } .contact-info .h6-s { display: inline-block; width: 36rem; text-align: right; vertical-align: top; margin-right: 5rem; } .contact-info .p { width: 90rem; margin: 0; } .contact-info .p-red { color: #CC3336; } .contact-info .work-days { display: inline-block; } .contact-info .work-days .p:first-child { text-align: right; width: 16rem; margin-right: 1.4rem; } .contact-info .work-days .p:nth-child(2) { width: 72rem; } .contacts_advantages { width: fit-content; margin: 0 auto 20rem; } .advantage { display: inline-block; } .advantage img { width: 42rem; height: 42rem; vertical-align: top; } .advantage:first-child { margin-right: 6rem; } .advantage:first-child .advantage_text { width: fit-content; } .advantage:first-child .advantage_text .p { width: 84rem; } .advantage:first-child .advantage_text .h4 { width: 99rem; } .advantage:first-child img { width: 36rem; height: 52rem; margin: bottom; } .advantage_text { vertical-align: top; display: inline-block; width: 78rem; margin-left: 5rem; } .advantage_text .h4 { font-weight: bold; margin-bottom: 6rem; } @media screen and (max-width: 882px) { .contacts { width: 90rem; } .contacts .h2 { line-height: 6rem; font-size: 5rem; width: 90rem; text-align: center; margin: 10rem auto 10rem; } .p, .h6-s { line-height: 6rem; font-size: 4rem; } .content { width: 90rem; } .content .h3 { line-height: 6rem; font-size: 5rem; width: 90rem; text-align: center; margin-bottom: 10rem; } .content img { position: relative; left: 50%; transform: translateX(-50%); width: 60rem; height: 25.33333rem; } .content .p { width: 90rem; margin: 4rem 0 0 0; } .content .map { display: block; float: none; width: 90rem; } .content .map img { width: 100%; height: 100%; } .contact-info { width: 90rem; margin: 13.33333rem 0 6.66667rem; } .contact-info .h6-s { height: 12rem; float: left; width: fit-content; text-align: left; vertical-align: top; margin-right: 8.33333rem; } .contact-info .p { height: 12rem; width: fit-content; float: right; text-align: right; margin: 0 0 2rem; } .contact-info .work-days { float: right; height: 12rem; } .contact-info .work-days .p { height: fit-content; float: none; } .contact-info .work-days .p:first-child { text-align: right; width: fit-content; margin-right: 2.33333rem; } .contact-info .work-days .p:nth-child(2) { width: fit-content; } .contacts_advantages { width: 90rem; margin: 0 auto 16.66667rem; } .advantage { display: block; text-align: center; margin: 0 auto 4rem; } .advantage > div { text-align: left; } .advantage img { display: none; } .advantage .h4 { display: block; line-height: 8rem; font-size: 5rem; text-align: center; } .advantage_text { display: inline-block; width: 100%; margin-left: 0; } .advantage_text .h4 { margin-bottom: 3rem; } } /** * Owl Carousel v2.3.4 * Copyright 2013-2018 David Deutsch * Licensed under: SEE LICENSE IN https://github.com/OwlCarousel2/OwlCarousel2/blob/master/LICENSE */ /* * Owl Carousel - Core */ .owl-carousel { display: none; width: 100%; -webkit-tap-highlight-color: transparent; /* position relative and z-index fix webkit rendering fonts issue */ position: relative; z-index: 1; } .owl-carousel .owl-stage { position: relative; -ms-touch-action: pan-Y; touch-action: manipulation; -moz-backface-visibility: hidden; /* fix firefox animation glitch */ } .owl-carousel .owl-stage:after { content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0; } .owl-carousel .owl-stage-outer { position: relative; overflow: hidden; /* fix for flashing background */ -webkit-transform: translate3d(0px, 0px, 0px); } .owl-carousel .owl-wrapper, .owl-carousel .owl-item { -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; -ms-backface-visibility: hidden; -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); } .owl-carousel .owl-item { position: relative; min-height: 1px; float: left; -webkit-backface-visibility: hidden; -webkit-tap-highlight-color: transparent; -webkit-touch-callout: none; } .owl-carousel .owl-item img { display: block; width: 100%; } .owl-carousel .owl-nav.disabled, .owl-carousel .owl-dots.disabled { display: none; } .owl-carousel .owl-nav .owl-prev, .owl-carousel .owl-nav .owl-next, .owl-carousel .owl-dot { cursor: pointer; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .owl-carousel .owl-nav button.owl-prev, .owl-carousel .owl-nav button.owl-next, .owl-carousel button.owl-dot { background: none; color: inherit; border: none; padding: 0 !important; font: inherit; } .owl-carousel.owl-loaded { display: block; } .owl-carousel.owl-loading { opacity: 0; display: block; } .owl-carousel.owl-hidden { opacity: 0; } .owl-carousel.owl-refresh .owl-item { visibility: hidden; } .owl-carousel.owl-drag .owl-item { -ms-touch-action: pan-y; touch-action: pan-y; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .owl-carousel.owl-grab { cursor: move; cursor: grab; } .owl-carousel.owl-rtl { direction: rtl; } .owl-carousel.owl-rtl .owl-item { float: right; } /* No Js */ .no-js .owl-carousel { display: block; } /* * Owl Carousel - Animate Plugin */ .owl-carousel .animated { animation-duration: 1000ms; animation-fill-mode: both; } .owl-carousel .owl-animated-in { z-index: 0; } .owl-carousel .owl-animated-out { z-index: 1; } .owl-carousel .fadeOut { animation-name: fadeOut; } @keyframes fadeOut { 0% { opacity: 1; } 100% { opacity: 0; } } /* * Owl Carousel - Auto Height Plugin */ .owl-height { transition: height 500ms ease-in-out; } /* * Owl Carousel - Lazy Load Plugin */ .owl-carousel .owl-item { /** This is introduced due to a bug in IE11 where lazy loading combined with autoheight plugin causes a wrong calculation of the height of the owl-item that breaks page layouts */ } .owl-carousel .owl-item .owl-lazy { opacity: 0; transition: opacity 400ms ease; } .owl-carousel .owl-item .owl-lazy[src^=""], .owl-carousel .owl-item .owl-lazy:not([src]) { max-height: 0; } .owl-carousel .owl-item img.owl-lazy { transform-style: preserve-3d; } /* * Owl Carousel - Video Plugin */ .owl-carousel .owl-video-wrapper { position: relative; height: 100%; background: #000; } .owl-carousel .owl-video-play-icon { position: absolute; height: 80px; width: 80px; left: 50%; top: 50%; margin-left: -40px; margin-top: -40px; background: url("owl.video.play.png") no-repeat; cursor: pointer; z-index: 1; -webkit-backface-visibility: hidden; transition: transform 100ms ease; } .owl-carousel .owl-video-play-icon:hover { -ms-transform: scale(1.3, 1.3); transform: scale(1.3, 1.3); } .owl-carousel .owl-video-playing .owl-video-tn, .owl-carousel .owl-video-playing .owl-video-play-icon { display: none; } .owl-carousel .owl-video-tn { opacity: 0; height: 100%; background-position: center center; background-repeat: no-repeat; background-size: contain; transition: opacity 400ms ease; } .owl-carousel .owl-video-frame { position: relative; z-index: 1; height: 100%; width: 100%; } /** * Owl Carousel v2.3.4 * Copyright 2013-2018 David Deutsch * Licensed under: SEE LICENSE IN https://github.com/OwlCarousel2/OwlCarousel2/blob/master/LICENSE */ .owl-theme .owl-dots, .owl-theme .owl-nav { text-align: center; -webkit-tap-highlight-color: transparent; } .owl-theme .owl-nav { margin-top: 10px; } .owl-theme .owl-nav [class*=owl-] { color: #FFF; font-size: 14px; margin: 5px; padding: 4px 7px; background: #D6D6D6; display: inline-block; cursor: pointer; border-radius: 3px; } .owl-theme .owl-nav [class*=owl-]:hover { background: #869791; text-decoration: none; } .owl-theme .owl-nav .disabled { opacity: .5; cursor: default; } .owl-theme .owl-nav.disabled + .owl-dots { margin-top: 10px; } .owl-theme .owl-dots .owl-dot { display: inline-block; zoom: 1; } .owl-theme .owl-dots .owl-dot span { width: 10px; height: 10px; margin: 5px 7px; background: #D6D6D6; display: block; -webkit-backface-visibility: visible; transition: opacity .2s ease; border-radius: 30px; } .owl-theme .owl-dots .owl-dot.active span, .owl-theme .owl-dots .owl-dot:hover span { background: #869791; } .owl-theme .owl-dots .owl-dot.active span { background: #595959; } .owl-theme .owl-dots .owl-dot:hover span { background: #A6A6A6; } .owl-carousel .owl-item img { width: initial; margin: 0 auto; } .owl-theme .owl-nav { z-index: -1; } .owl-theme .owl-dots .owl-dot span { width: 6rem; height: 1rem; border-radius: 0px; margin: 0px; } .owl-theme .owl-nav.disabled + .owl-dots { margin: 0; } .owl-theme .owl-dots .owl-dot.active span { width: 18rem; } .owl-stage { overflow: hidden; margin: 0 auto; } .owl-carousel .owl-item { width: 70.5rem; } @media screen and (max-width: 882px) { .owl-carousel .owl-item { width: 225px; } } @media screen and (max-width: 450px) { .owl-carousel .owl-item { width: 180px; } } @media screen and (max-width: 408px) { .owl-carousel .owl-item { width: 135px; } } /* .owl-nav{ margin: 0 !important; position: absolute; button { color: red !important; &.disabled { color: grey !important; } } &:first-child { } &:last-child { } } */ html { height: 100%; } body { margin: 0; font-family: 'Roboto'; min-height: 100%; position: relative; } a { color:inherit; } /*# sourceMappingURL=style.bundle.css.map*/