.service-list-wr { margin-top: 4px; padding: 2px; @include gradientBtn; border-radius: 12px; overflow: hidden; @include Shadow35; ul { @include wfl; width: 100%; background: #fff; padding: 20px 18px 22px 29px; border-radius: 11px; li { @include wfl; margin-top: 10px; &:first-child { margin-top: 0; } a { color: $main-color; font-size: 11px; text-transform: uppercase; padding: 5px 0; transition: 0.3s; font-weight: 700; line-height: 16px; display: block; &:hover { } } &.active { a { color: #888888; text-decoration: none !important; cursor: default; } } &.has-list { position: relative; &:before { content: ''; position: absolute; width: 10px; height: 6px; background: url(../images/arrow-dawn.svg) 50% 50% no-repeat; background-size: 10px 6px; top: 10px; left: -16px; transform: rotate(-90deg); } ul { //display: none; } &.active, &.active2 { &:before { transform: rotate(0deg); } } ul { display: block; padding: 0 0 0 7px; margin-bottom: -11px; li { margin-top: 0; &:before { display: none; } a { font-size: 10px; color: $main-color; cursor: pointer; &:hover { text-decoration: underline !important; } } &.active { a { color: #888888; text-decoration: none !important; cursor: default; } } } } } } } } .service-text-table-wrapp { table { border: 1px solid $border-gray !important; tr { th, td { text-align: left; vertical-align: middle; padding-left: 19px; } th { font-weight: 700; height: 37px; background: $gray-color; &:last-child { padding-left: 19 + 9 +px; } } td { height: 40px; border-bottom: 1px solid $border-gray; &:last-child { width: 122px; } } &:last-child { td { border-bottom: 0; } } } } .btn_ { float: right; width: 206px; margin-top: 30px; margin-bottom: 52px; } } .section-comments-answers { background: $gray-color; padding-top: 56px; padding-bottom: 60px; margin-top: 59px; } .title-c-a { font-size: 28px; font-weight: 700; line-height: 25px; text-transform: uppercase; } .service-c-a-btns { .btn_ { background: none; &:active { box-shadow: 0px 0px 12px 0px rgba(151, 151, 151, 0.35); } } } .service-comments { * { text-align: left; } .comments-h-text:before { display: none; } margin-top: 22px; &:first-child { margin-top: 0; } .comments-h-autor {} .comments-h-text { padding-bottom: 0; margin-top: 6px; line-height: 17px; } .comments-h-date { color: #888888; font-size: 12px; text-transform: uppercase; margin-top: 7px; } } .service-comments-wr { margin-top: 34px; } .service-links-c-a { text-align: center; margin-top: 32px; a { text-decoration: underline; font-size: 13px; color: #888888; &:hover { text-decoration: none; } } } .service-ansvers-title { font-size: 13px; span { font-weight: 700; text-transform: uppercase; } } .service-ansvers-txt { position: relative; font-style: italic; line-height: 17px; margin-top: 6px; &:before, &:after { background: #e5e5e5; content: ''; position: absolute; } &:before { width: 1px; height: 50%; left: -36px; top: -39px; box-sizing: content-box; padding-top: 39px; } &:after { height: 1px; width: 16px; left: -35px; top: 50%; margin-top: -1px; } } .service-links-a { margin-top: 57px; } .service-ansvers-text-wr { position: relative; padding-left: 67px; margin-top: 9px; padding-top: 16px; } .hidden-form-c-a-wr { padding-left: 67px; padding-right: 67px; position: relative; margin-top: -115px; } .fix-form-c-a-wr { .hidden-form-c-a-wr { padding-left: 0; padding-right: 0; position: relative; margin-top: -105px; } .submit-close-wr-c-a button { width: 170px; } .hidden-form-c-a { width: 360px; } } .hidden-form-c-a { background: #fff; border-radius: 12px; padding: 25px 30px 30px 30px; box-shadow: 0px 0px 24px 0px rgba(151, 151, 151, 0.35); } .title-forms-c-a { font-weight: 700; font-size: 18px; text-transform: uppercase; text-align: center; line-height: normal; } .hidden-form-c-a { .required label:before { color: $main-color !important; } } .submit-close-wr-c-a { margin-top: 30px; button { width: 184px; float: right !important; box-shadow: none; margin: 0; &:active { box-shadow: 0px 0px 12px 0px rgba(151, 151, 151, 0.35); } } } .submit-close-c-a { float: left; span { font-size: 13px; color: #888888; text-decoration: underline; line-height: 44px; cursor: pointer; &:hover { text-decoration: none; } &:active { color: $main-color; } } } .all-catalog-mob { text-align: center; color: $link-color; text-transform: uppercase; font-size: 11px; font-weight: 700; line-height: 38px; cursor: pointer; position: relative; &:before { content: ''; position: absolute; width: 10px; height: 6px; background: url(../images/arrow-dawn.svg) 50% 50% no-repeat; background-size: 10px 6px; top: 16px; right: 10px; display: block; transition: 0.4s; } &:hover { color: $link-active; } } .catalog-sidebar-wr { &.active { .all-catalog-mob { &:before { transform: rotate(180deg); } } } } @media (max-width: 945px) { .submit-close-c-a { width: 100%; text-align: center; margin-top: 23px; span { line-height: 17px; } } .submit-close-wr-c-a button { float: none !important; margin: 0 auto; } .fix-form-c-a-wr .hidden-form-c-a { width: 100%; min-width: 300px; } } @media (max-width: 767px) { .service-text-table-wrapp { table { tr { th{ padding-top: 10px; height: auto; padding-bottom: 10px; @include wfl; display: block; &:last-child { display: none; } } td { @include wfl; display: block; vertical-align: top; height: auto; &:first-child { padding-top: 12px; border-bottom: 0; } &:last-child { width: 100%; margin-top: -1px; padding-bottom: 11px; } } } } .btn_ { margin-left: auto; margin-right: auto; float: none; margin-top: 20px; margin-bottom: 22px; } } .service-comments { * { text-align: center; } } .title-c-a { text-align: center; } .service-ansver-mob-line { border-top: 1px solid #e5e5e5; padding-top: 26px; margin-top: 30px; } .service-comments-wr { * { text-align: left; } } .service-ansvers-text-wr { padding-left: 0; } .service-ansvers-text-wr { margin-top: 18px; } .service-ansvers-txt { &:after { display: none; } &:before { height: 16px; left: 0; padding: 0; top: -47px; } } .service-links-a { margin-top: 17px; } .service-c-a-btns { margin-top: 18px; } .service-links-c-a { margin-top: 17px; } .hidden-form-c-a-wr { margin-top: -77px; } .fix-form-c-a-wr { .hidden-form-c-a-wr { padding: 0 67px; margin-top: -75px; } .hidden-form-c-a { width: 100%; } } .submit-close-c-a { width: auto; text-align: left; margin-top: 0; span { line-height: 44px; } } .submit-close-wr-c-a button { float: right !important; margin: 0; } body { .catalog-sidebar-wr { padding-left: 0 !important; padding-right: 0 !important; } } .catalog-sidebar-wr { background: $gray-color; margin-bottom: 16px; max-height: 38px; overflow: hidden; @include Transition(0.4); &.active { transition: 0.8s; @include Transition(0.8); transition-timing-function: ease-in; max-height: 2500px; } } .service-list-wr { background: none !important; box-shadow: none !important; ul { background: none; padding-left: 20px; padding-top: 0; padding-right: 30px; } } .service-list-wr { ul { li.has-list { &:before { left: -14px; } } } } } @media (max-width: 555px) { .hidden-form-c-a-wr { padding-left: 0 !important; padding-right: 0 !important; } } @media (max-width: 420px) { .submit-close-c-a { width: 100%; text-align: center; margin-top: 23px; span { line-height: 17px; } } .submit-close-wr-c-a button { float: none !important; margin: 0 auto; } }