//@import url('https://fonts.googleapis.com/css?family=Open+Sans:300&subset=cyrillic,cyrillic-ext'); @import "../_partials/tablet-tariffs.less"; @import "../_partials/popup-tariffs.less"; @import "../_partials/popup-order.less"; @import "../common/tariff-order.less"; .h3.heading, .h2.heading, .h3.pink-heading, .h2.pink-heading, h3.pink-heading, h2.pink-heading { position: relative; font-size: 30px; font-family: 'Open Sans'; color: #ec008c; font-weight: 100; line-height: 1.22; text-transform: uppercase; margin: 0 auto 20px; @media (max-width: 1030px) { padding: 0 20px; } @media (max-width: 767px) { font-size: 23px; padding-left: 15px; padding-right: 15px; text-align: center; font-weight: bold; margin-left: auto; margin-right: auto; br { display: none; } } } h2,.h2{ text-align: center; } .h3.heading, .h2.heading { color: #000; .pink { color: #ec008c; } } .note-icon { border-radius: 50%; color:#fff; background:#a6aaad; text-align: center; width:14px; height:14px; line-height: 14px; vertical-align: top; display: inline-block; cursor: pointer; font-size: 12px; &::before{ content:'i'; } } #main-nav-wrap{ background-color: #fff; } .popular-tariffs-block .modal { background: rgba(0,0,0,0.5); } .price-period .rub-arial-regular { display: inline-block; min-width: 12px; text-align: left; } .top-block{ margin-bottom: 55px; background-color: #fff; .centered{ background: url(../../images/ai/nomer8800_/top-bg.png) no-repeat right 38px top 29px; padding-top: 36px; min-height: 608px; } h1{ color:#000000; font-size: 94px; font-weight: bold; line-height: 70px; padding: 0 0 0 2%; margin: 0; display: inline-block; } .small{ font-weight: 300; font-size: 37px; line-height: 36px; display: inline-block; color:#000; padding: 0 0 0 2%; vertical-align: top; } .descript{ font-size: 33.5px; line-height: 33px; color:#ff0099; padding-left: 2.5%; margin-top: 30px; } .order-btn{ background-color: #eb008b; color:#fff; font-size: 16px; line-height: 23px; padding: 12px; border-radius: 18px; margin: 470px auto 0; width: 260px; display: block; text-align: center; } } .order-btn-single{ background-color: #eb008b; color:#fff; font-size: 16px; line-height: 23px; padding: 12px; border-radius: 18px; margin: 0 auto; width: 260px; display: block; text-align: center; } .order-btn-single:focus , .order-btn-single:visited , .order-btn-single:hover { color:#fff; } .advantages-block{ padding-top: 45px; padding-bottom: 20px; .h2{ margin-bottom: 50px; padding: 0 20px; } .advantage-item{ margin-bottom: 25px; &.advantage-item__last, &:last-of-type { margin-bottom: 0; } .icon{ background-repeat: no-repeat; background-position: center; height: 47px; display: block; margin-bottom: 8px; &.icon-1{ background-image: url(../../images/ai/nomer8800_/adv-ic-1.svg); } &.icon-2{ background-image: url(../../images/ai/nomer8800_/adv-ic-2.svg); } &.icon-3{ background-image: url(../../images/ai/nomer8800_/adv-ic-3.svg); } &.icon-4{ background-image: url(../../images/ai/nomer8800_/adv-ic-4.svg); } &.icon-5{ background-image: url(../../images/ai/nomer8800_/adv-ic-5.svg); } &.icon-6{ background-image: url(../../images/ai/nomer8800_/adv-ic-6.svg); } &.icon-7{ background-image: url(../../images/ai/nomer8800_/adv-ic-7.svg); } &.icon-8{ background-image: url(../../images/ai/nomer8800_/incoming-ic.svg); } &.icon-9{ background-image: url(../../images/ai/nomer8800_/outgoing-ic.svg); } &.icon-10{ background-image: url(../../images/ai/nomer8800_/mobile-ic.svg); } &.icon-11{ background-image: url(../../images/ai/nomer8800_/24-ic.svg); } } .heading{ font-size: 18px; color:#000; font-weight: bold; } p{ font-size: 16px; line-height: 24px; color:#000; } } .advantages-top{ text-align: center; margin-bottom: 14px; padding: 0 3%; font-size: 0; .advantage-item{ width: 25%; padding: 0 1.8%; display: inline-block; vertical-align: top; } } .left-img{ float:left; padding-left: 8%; width:33%; img{ max-width: 100%; } } .advantages-right{ float:left; width:67%; padding-left:5%; .advantage-item{ //padding-left:390px; .icon{ float: left; width: 65px; } .heading,p{ //width: 100%; padding-left: 80px; } } } .advantages-inner-wrapper { display: flex; align-items: center; margin-bottom: 25px; } } .connect-block{ margin-bottom: 35px; background-color: #d0d1d3; .centered{ background: url(../../images/ai/nomer8800_/infinity-phone.png) no-repeat right 20px top 0; padding: 40px 0; } .h2{ margin-bottom:10px } .descript{ color:#ec008c; font-size: 27px; text-align: center; line-height: 1.2; font-weight: 100; margin-bottom:35px; } .table-row{ margin-bottom: 8px; border-radius: 20px; background-color: #fff; //height: 48px; font-size: 18px; line-height: 26px; color: #000000; padding: 11px 0; margin-left: 8%; width:44%; .table-left{ width:70%; padding-left: 6%; padding-right: 4%; display: inline-block; vertical-align: middle; .note{ border-radius: 50%; color:#fff; background:#a6aaad; text-align: center; width:14px; height:14px; line-height: 14px; vertical-align: top; display: inline-block; cursor: pointer; &::before{ content:'i'; } } } .table-right{ width:30%; display: inline-block; padding-right: 4%; vertical-align: middle; color:#333; text-align: right; .rub-arial-regular { font-size: 100% !important; } } &.summary{ border-radius: 0; background: none; text-align: right; .price{ border-radius: 20px; background-color: #fff; padding: 11px 4%; color:#ec008c; font-weight: bold; .unit{ font-weight: 100; } } .rub-arial-regular { font-size: 100% !important; } } &.full-width{ background: none; padding: 10px 2% 0; font-size: 14px; border: none; line-height: 18px; } } } .connect-block .table-row-new-left, .connect-block .table-row-new-right{ margin-bottom: 8px; background-color: #fff; font-size: 18px; line-height: 26px; color: #000000; padding: 11px 0; height: 51px; margin-left: 8%; } .connect-block .table-row-new-left{ border-radius: 20px 0 0 20px; } .connect-block .table-row-new-right{ border-radius: 0 20px 20px 0; margin-left: 8px !important; } .connect-block .table-row .table-left { width: 70%; padding-left: 6%; padding-right: 4%; display: inline-block; vertical-align: middle; } .connect-block .table-row-new-left .table-left, .connect-block .table-row-new-right .table-left { width: 70%; padding-left: 6%; padding-right: 4%; display: inline-block; vertical-align: middle; } .connect-block .table-row-new-left .table-left .note, .connect-block .table-row-new-right .table-left .note { border-radius: 50%; color: #fff; background: #a6aaad; text-align: center; width: 14px; height: 14px; line-height: 14px; vertical-align: top; display: inline-block; cursor: pointer; } .connect-block .table-row-new-left .table-left .note:before, .connect-block .table-row-new-right .table-left .note:before { content: 'i'; } .connect-block .table-row-new-left .table-right, .connect-block .table-row-new-right .table-right{ width: 30%; display: inline-block; padding-right: 4%; vertical-align: middle; color: #333; text-align: right; } .connect-block .table-row-new-left .table-right-new, .connect-block .table-row-new-right .table-right-new{ text-align: center !important; } .connect-block .table-row-new-left.table-right .rub-arial-regular, .connect-block .table-row-new-right.table-right .rub-arial-regular{ font-size: 100% !important; } .connect-block .table-row-new-left.summary .price, .connect-block .table-row-new-right.summary .price { border-radius: 20px; background-color: #fff; padding: 11px 4%; color: #ec008c; font-weight: bold; } .first-months, .last-months{ font-size: 18px; margin-bottom: 12px; } .first-months{ text-align: right; padding-right: 12px; } .last-months{ text-align: left; margin-left: 8px; padding-left: 10px; } .warning-block{ padding-bottom: 35px; .h2.heading{ margin-bottom: 50px; } .warning-wrap{ .warning-item{ width:50%; padding:0 15px 30px 8%; font-size: 16px; color:#000; line-height: 24px; &:nth-child(odd){ float:left; } &:nth-child(even){ float:right; } &:before{ content: ''; float: left; width: 19%; margin-left: -19%; background: url(../../images/ai/nomer8800_/warning-ic.svg) no-repeat top center; height: 47px; } } } } .popular-tariffs-block { position: relative; z-index: 99; .centered { position: relative; .h3.pink-heading { padding: 0 20px; } } } .popular-tariffs{ padding-bottom: 27px; .heading , .pink-heading { color: #000; margin-bottom: 17px; padding-left: 38px; @media (max-width: 1030px) { padding: 0 20px; margin-left: -78px; margin-right: -78px; } @media (max-width: 992px) { margin-left: 0px; margin-right: 0px; } @media (max-width: 767px) { padding-left: 15px; } } .heading_text_1 { color: #ec008c; font-size: 20px; margin-bottom: 27px; text-align: center; font-weight: 100; line-height: 1.2; } .heading_text_2 { font-size: 16px; text-align: center; line-height: 30px; } .tariff-items{ .tariff-item { .price-block { margin-bottom: 13px; } .more-btn { display: none; } .more-nums-link{ display: block; position: static; font-size: 13px; line-height: 17px; padding: 7px 6px 10px; text-align: center; font-family: 'Open Sans'; color: #666; background-color: #d0d1d2; margin: 0 auto; text-transform: uppercase; border-radius: 18px; width: 148px; padding-top: 7px; height: 33px; border:none; text-decoration: none; &:hover{ color: #fff; background-color: #ec008c; } } } } } .achievements-block { .h2 { .color { color: #27aae0; } } .achievements-container { text-align: center; padding: 26px 26px 0; font-size: 0; .achievement-item { width: 25%; display: inline-block; vertical-align: top; margin-bottom: 26px; .heading { font-size: 16px; } .icon { display: inline-block; margin-bottom: 20px; } .icon-1 { background: url(../../images/ai/nomer8800_/ach-icon-1.png) no-repeat center; width: 53px; height: 44px; } .icon-2 { background: url(../../images/ai/nomer8800_/ach-icon-2.png) no-repeat center; width: 47px; height: 43px; margin-top: 1px; } .icon-3 { background: url(../../images/ai/nomer8800_/ach-icon-3.png) no-repeat center; width: 42px; height: 42px; margin-top: 2px; } .icon-4 { background: url(../../images/ai/nomer8800_/ach-icon-4.png) no-repeat center; width: 41px; height: 43px; margin-top: 1px; } } } .achievement-img { margin: 10px auto 0; width: 1072px; height: 86px; background: url(../../images/ai/nomer8800_/ach-bg.png) no-repeat center bottom; background-size: contain; max-width: 100%; } } .choose-numbers-block { .text-wrapper { padding: 0; } margin-bottom: 35px; background-color: #d0d1d3; padding: 40px 0; position: relative; .h2{ margin-bottom:35px; } .centered { position: relative; .heading { margin-bottom: 44px; } } .spot { position: absolute; top: -130px; left: -510px; img { max-height: 630px; } } .visible-xs { display: block !important; } .title { font-family: 'Open Sans', Calibri, Candara, Segoe, Segoe UI, Optima, Arial, sans-serif; &.title-pink-bg, &.title-pink-rounded { background: none; font-size: 20px; line-height: 1.4; } a { text-transform: uppercase; } .price-container { padding-bottom: 3px; .old-price { color: #939598; font-size: 18px; min-height: 28px; text-decoration: line-through; font-weight: 100; line-height: 1; padding-top: 8px; padding-bottom: 2px; } .price { color: #000; font-size: 24px; line-height: 1; } } } .btn { &.btn-gray-rounded, &.btn-pink { font-family: 'Open Sans'; background: #fff; border: 1px solid #a6a8ab; line-height: 31px; min-height: 31px; min-width: 187px; font-size: 18px; margin-bottom: 6px; } &.btn-embossed-rounded { font-weight: 100; font-size: 13px; min-height: inherit; box-shadow: none; border: none; font-family: 'Open Sans'; margin-top: 0; text-decoration: underline; color: #231f20; line-height: 1.2; display: block; &:hover { color: #000; } } } .col-sm-3 { width: 20%; } } .why-block { background-color: #d0d1d3; padding: 50px 0 10px 0; .pink-heading { margin-bottom: 50px; } .why-icons-wrapper { display: flex; flex-wrap: wrap; justify-content: space-between; //padding: 0px 120px; margin-bottom: 60px; margin-top: 60px; @media (max-width: 1262px) { padding: 0; } .why-item { text-align: center; width:32%; padding: 0 30px; &.item-lg{ width:36%; @media (max-width: 600px) { width: 100%; } } @media (max-width: 1030px) { padding: 0px 15px; } @media (max-width: 600px) { width: 100%; margin-bottom: 20px; br { display: none; } } .img-wrapper { text-align: center; height: 50px; margin-bottom: 15px; img { max-height: 100%; } } .caption { font-size: 18px; font-weight: bold; text-transform: uppercase; } .text { font-size: 16px; line-height: 26px; @media (max-width: 600px) { text-align: center; } } } } } .ajax-send-btn.loading { color: transparent !important; border: 0 none; background:transparent url('../../images/horizontal_loader.gif') no-repeat center !important; outline: 0 none; } .order-result { max-width: 320px; margin-left: auto; margin-right: auto; position: relative; padding: 30px 0; &.success { color: green; text-align: center; } } .vats-block{ background: url('../../images/ai/nomer8800_/map.png') no-repeat top center #d0d1d3; padding-bottom: 40px; .h2.heading{ padding-top: 45px; } .steps-wrap{ padding: 455px 12% 30px 12%; .step-item{ width: 33.3%; float: left; color:#000; font-size: 15.5px; line-height: 18px; padding: 85px 15px 25px 15px; text-align: center; background: no-repeat top center; &.step-1{ background-image: url('../../images/ai/nomer8800_/arrow-1.png'); } &.step-2{ background-image: url('../../images/ai/nomer8800_/arrow-2.png'); } &.step-3{ background-image: url('../../images/ai/nomer8800_/arrow-3.png'); } } } .descript{ padding: 0 8%; font-size: 16px; line-height: 24px; color:#000000; } } .order-block{ overflow: hidden; position: relative; .h2{ margin-bottom:35px; } .centered { position: relative; background: url(../../images/ai/nomer8800_/sky-phone-bottom.png) no-repeat right 15.6% bottom 0; padding: 40px 0; } #nomer8800-orders-form{ padding: 0; width: 100%; max-width: 380px; margin-left: 25.8%; padding-top: 10px; position: relative; .field-wrapper{ width: 100%; } .control-label{ color:#000; font-size: 16px; text-align: right; min-width: 90px; padding-right: 15px; } .form-group { width: 100%; margin: 0 0 7px; } .help-block.help-block-error{ display: block; margin-left: 90px; } .help-block { margin-top: 0; margin-bottom: 0; } .form-control,input[type="text"]{ outline: none; height: 32px; width: 290px; font-size: 16px; color:#000; background: #ffffff; border: solid 1px #999999; box-shadow: none; border-radius: 16px; padding: 0 10px; display: inline-block; } .btn-submit{ outline: none; font-size: 16px; color:#fff; text-align: center; padding: 0 30px; height: 32px; width: 290px; margin-left: 90px; background: #eb008b; border: none; display: block; text-transform: uppercase; border-radius: 16px; padding-top: 2px; margin-top: 2px; } .order-info{ padding: 0 20px 0 98px; font-size: 10px; color:#231f20; } img[id*="captcha"] { max-width: 80px; margin-right: 10px; } } } .white-popup-block.popup-tooltip { font-size: 12px; max-width: 470px; font-family: Tahoma,Arial,sans-serif; border-radius: 10px; } .toggle-handler { cursor: pointer; } .slider-nomer8800-tariffs { font-size: 18px; .rub-arial-regular { font-size: 100% !important; } } .sim { background: url(../../images/ai/nomer8800_/bg-sim.png) no-repeat 0 0; &.sim-partial { background: url(../../images/ai/nomer8800_/bg-sim-partial.png) no-repeat 0 0; } display: flex; align-items: center; justify-content: flex-start; flex-wrap: wrap; width: 74px; height: 100px; margin: 0 auto 9px; padding-top: 15px; padding-left: 11px; .sim-option { text-align: left; white-space: nowrap; background: white; position: relative; top: -1px; &.sim-option-phone:before { content: ''; display: inline-block; width: 26px; height: 26px; vertical-align: top; margin-right: 5px; background: url(../../images/ai/nomer8800_/icon-sim-phone.png) no-repeat center center; } &.sim-option-wifi:before { content: ''; display: inline-block; width: 26px; height: 26px; vertical-align: top; margin-right: 5px; background: url(../../images/ai/nomer8800_/icon-sim-wifi.png) no-repeat center center; } &.sim-option-sms:before { content: ''; display: inline-block; width: 26px; height: 26px; vertical-align: top; margin-right: 5px; background: url(../../images/ai/nomer8800_/icon-sim-sms.png) no-repeat center center; } &.sim-option-big { font-size: 28px; line-height: 26px; } } .icon-unlim { margin-left: 5px; } } .column-container { display: flex; margin: 0 auto 5px; max-width: 1040px; text-align: center; .column { min-width: 200px; &.column-wide { min-width: 350px; flex-grow: 1; text-align: left; } &:first-of-type { .td { padding-left: 40px; border-radius: 20px 0 0 20px; } } &:last-of-type { .td { border-radius: 0 20px 20px 0; } } } .column-xs { display: none; } .th { font-weight: bold; width: 100%; padding: 7px 4px; } .td { width: 100%; background: #fff; padding: 13px 4px; margin-bottom: 8px; &.td-sim { height: 130px; } } .order-btn-single { width: auto; border-radius: 23px; font-weight: normal; } } @media (max-width: 1262px) { .connect-block .table-row-new-left{ margin-left: 0; } } @media (max-width: 1030px) { .column-container { flex-wrap: wrap; .column { &:nth-of-type(odd) { .td { padding-left: 12px; border-radius: 20px 0 0 20px; } } &:nth-of-type(even) { .td { border-radius: 0 20px 20px 0; } } } .column-xs { display: block; } .th { height: 52px; display: flex; align-items: center; justify-content: center; } } } @media (max-width: 767px) { .connect-block .table-row-new-left, .connect-block .table-row-new-right{ height: 62px; } .last-months{ padding-left: 0; margin-left: 0; } } @media (max-width: 600px) { .column-container { flex-wrap: wrap; margin: 0 15px; .column { min-width: auto; width: 50%; &.column-wide { min-width: auto; } } .column-xs { display: block; } .order-btn-single, .th, .td { font-size: 13px; } .td { min-height: 64px; &.td-sim { height: 130px; } &.td-number { .value { min-height: 36px; } } } } .connect-block .table-row-new-left, .connect-block .table-row-new-right{ border-radius: 0; font-size: 16px; display: flex; height: 80px; justify-content: center; } .connect-block .table-row-new-left{ margin-left: 0; } .first-months, .last-months{ font-size: 16px; margin-bottom: 5px; } } @media (max-width: 517px) { .first-months{ text-align: right; padding-right: 25px; margin-right: 20px; font-size: 15px; } .last-months{ font-size: 15px; margin-left: -25px; } } .popular-tariffs-text { min-height: 200px; position: relative; } .popular-tariffs-text .bestprice { position: absolute; left: 100px; top: -25px; } .popular-tariffs-text.popular-tariffs .pink-heading { margin-top: 50px; margin-bottom: 40px; } .popular-tariffs-text.popular-tariffs .text { font-size: 16px; } @media (max-width: 1262px) { .popular-tariffs-text .bestprice { left: 0; } .top-block{ .centered{ background-size: 85%; background-position: right bottom; } } .owl-theme{ .owl-nav{ .owl-prev,.owl-next{ background-color: transparent; } } } .tariffs-carousel{ .tariff-items{ .tariff-item{ padding:35px 24px; min-height: 388px; .tariff-announce{ padding: 10px 24px 5px; } } } .owl-theme .owl-nav{ .owl-prev{ margin-left:-8px; } .owl-next{ margin-right:-8px; } [class*='owl-']{ top:-240px; } } } .connect-block{ .table-row{ .table-left{ width: 67%; } } } .order-block{ .centered{ background-position: right bottom; } #nomer8800-orders-form{ margin-left: 20%; } } } @media (max-width: 1030px) { .popular-tariffs-text .bestprice { position: relative; top: 0; } .popular-tariffs-text.popular-tariffs .pink-heading { margin-top: 20px; margin-bottom: 20px; } .top-block{ .centered{ background-position: center bottom; } h1{ font-size:60px; line-height: 68px; padding: 0 3%; float: none; text-align: center; display: block; } .small{ padding: 0 3%; text-align: center; display: block; } .order-btn{ margin:35px auto; float: none; } .descript{ text-align: center; padding: 0 10%; } } .advantages-block{ .h2{ padding: 0 20px; } .advantages-top{ margin-bottom: 30px; .advantage-item{ min-height: 190px; margin-bottom: 10px; width: 50%; } } .left-img{ display: none; } .advantages-right{ margin-bottom: 0; padding: 0 3%; width: 100%; .advantage-item{ float: left; width: 50%; text-align: center; min-height: 190px; padding: 0 1.8%; .icon{ float: none; width: 100%; } .heading,p{ padding-left: 0; } } } } .connect-block { .centered{ background: none; } .table-row{ width: 90%; margin: 0 auto 8px; } } .popular-tariffs{ .tariff-items{ .tariff-item{ .present-num{ font-size: 11px; line-height: 15px; height: auto; padding-top: 34px; width: 150px; padding-right: 8px; } } } } .achievements-block { .achievements-container { .achievement-item { width: 50%; } } .achievement-img { background-size: cover; } } .choose-numbers-block { .container { width: 100%; &.container-padded { padding-left: 15px; padding-right: 15px; } } .col-sm-3 { width: 50%; } } .order-block { #nomer8800-orders-form{ margin-left: 0; } .spot { top: 10px; right: -510px; } } } @media (max-width: 992px) { .popular-tariffs { padding: 0 0 25px 0; } .vats-block { background-size: 760px auto; .steps-wrap{ padding-top: 300px; } } } @media (max-width: 767px) { .top-block{ h1{ font-size:40px; line-height: 50px; } .order-btn{ margin-bottom:65px; } } .connect-block { .table-row{ &.full-width{ padding: 10px 6% 0; } } } .main-wrap{ .owl-theme{ .owl-dots{ .owl-dot{ span{ width: 11px; height: 11px; margin: 0 10px; } } } } } .choose-numbers-block { .col-sm-3 { width: 100%; } } .order-block{ .h2{ margin-bottom: 20px; } .centered{ background: none; } #nomer8800-orders-form{ margin: 0 auto; } } .warning-block{ .warning-wrap{ .warning-item{ width: 100%; padding: 0 15px 30px 75px; &:before{ width: 75px; margin-left: -75px; } } } } .vats-block { background-size: 590px auto; .steps-wrap{ padding-top: 230px; } } } @media (max-width: 600px) { .advantages-block{ .advantages-top,.advantages-right{ .advantage-item{ width: 100%; } } } .connect-block { .table-row{ border-radius: 0; font-size: 16px; width: 100%; .table-left{ width: 58%; } .table-right{ width: 42%; } } } .popular-tariffs{ .tariff-items{ .tariff-item{ width: 100%; float: none; .tar-advantages{ max-width: 280px; margin-left: auto; margin-right: auto; } .present-num{ font-size: 18px; line-height: 22px; width: 220px; } } } } .tariffs-carousel{ max-width: 100vw; min-width:320px; margin-top: 0; .heading{ display: none; } .tariff-link{ color:#333333; font-size:18px; line-height: 26px; height:60px; text-align: center; vertical-align: middle; display: table-cell; margin:0; width:100vw; background: #cbcaca; text-decoration: none; } .tariff-items{ border-top: none; .tariff-item{ .tariff-advantages{ width: 100%; } } .owl-item{ width:100%!important; } } .owl-stage .owl-item+.owl-item{ padding-left: 0; } } .achievements-block { .achievements-container { .achievement-item { width: 100%; } } } .choose-numbers-block { .centered { overflow: hidden; } } .order-block{ #nomer8800-orders-form{ padding-left: 15px; padding-right: 15px; margin-left: auto; margin-right: auto; max-width: 320px; .help-block.help-block-error{ margin-left: 0; text-align: center; } .control-label { text-align: left; } .btn-submit, .order-info { margin-left: 0; padding-left: 0; } } } .vats-block { background-size: 320px auto; background-position: center 105px; .steps-wrap{ padding:190px 0 30px 0; .step-item{ width: 305px; margin:0 auto; float:none; } } } } @media (max-width: 360px) { .connect-block{ .table-row-new-left,.table-row-new-right{ height: 100px; &.summary{ .price{ background-color: transparent; } } } } }