$colorCheckBoxForms:$blue-color; #overlay { position: fixed; z-index: 9; width: 100%; height: 100%; background: #000; opacity: 0.85; top: 0; left: 0; } #modal_close { $h:72; width: 40px; height: $h + px; position: absolute; top: 0; right: 0; cursor: pointer; display: block; z-index: 11; @include svgIcon; &:before { display: block; //color: $main-color; color: #fff; line-height: 40px; text-align: center; font-size: 16px; content: "\e90f"; @include Transition(0.05); } &:active { &:before { @include Scale(1.35); } } } .forms_ { z-index: 10; display: none; position: absolute; width: 555px; border-radius: 4px; left: 50%; margin-left: -277px; top: 0; opacity: 0; &.forms_750 { width: 750px; margin-left: -375px; } label { font-size: 14px; } form { width: 100%; background: #fff; padding-bottom: 30px; float: left; padding-top: 29px; } } .form-title { height: 72px; color: #fff; line-height: 72px; background: $blue-color;; font-weight: 700; text-transform: uppercase; font-size: 24px; text-align: center; } .input-wr { padding: 0 15px; @include wfl; } .button-wr { @extend .input-wr; margin-top: 20px; button { @extend .btn_; width: 156px; margin: 0 auto; float: none !important; border: 1px solid $turquoise-color !important; font-size: 11px; text-transform: uppercase; background: #fff !important; color: $main-color !important; box-shadow: none !important; &:hover { border: 1px solid $blue-color !important; } &:active { box-shadow: 0px 0px 12px 0px rgba(151, 151, 151, 0.35) !important; } } } .login-wrapper { background: #fff; width: 100%; float: left; padding-bottom: 30px; form { padding-bottom: 0; } .btns_reg { float: none; margin: 0 auto; margin-top: 43px; } } .forms_, .forms_pages { .sidebar_checks, .radio_custom { input { + label { &:before { border: 1px solid $colorCheckBoxForms !important; top: 1px; } a { &:before { } } } &:checked { + label { &:before { border: 0 !important; } } } } } } /*********login form restore/register************/ .btns_reg { width: 210px; text-align: center; margin-top: 43px; float: left; a, span { @include wfl; font-size: 13px; } } .restore_password_ { border-bottom: 1px solid silver; text-decoration: none; padding-bottom: 11px; } .no_account_yet { font-size: 14px; text-transform: uppercase; font-weight: 700; margin-top: 13px; } .to-register-link { margin-top: 9px; } /**********************************/ /****************restore******************/ .email-remind-txt, .emails_txt, .txt_reg_page, .add_inform { font-size: 13px; color: #888; margin-top: 10px; } .emails_txt { } /**********************************/ .button-left { button { float: left; } } .button-right { button { float: right; } } /**********************************/ .forms_pages { } /**********************************/ .txt-forms_ { background: #fff; width: 100%; padding: 15px; @include wfl; } .txt-forms_overflow { height: 500px; overflow-x: hidden; } /**********************************/ /**************success*******************/ #success_form { width: 420px; height: 152px; border-radius: 4px; position: absolute; top: 30px; left: 50%; margin-left: -210px; display: none; z-index: 99998; background: #fff; padding: 0 15px; } .txt-success { width: 420px; height: 152px; display: table-cell; vertical-align: middle; text-align: center; font-size: 16px; color: #363636; span { font-size: 20px; } p { margin-top: 3px; } } /**********************************/ .modal-forms-wrapp { background: #fff; padding: 26px 15px 29px 15px; } #hot_line { text-align: center; } .model-name-test { text-align: center; font-size: 18px; text-transform: uppercase; color: #333; } [class*="hot_line-txt-"] { font-size: 15px; line-height: 15px; } .hot_line-txt-1 { margin-top: 37px; } .hot_line-txt-1, .hot_line-txt-5 { font-weight: 700; } .hot_line-txt-2 { font-size: 24px; margin-top: 18px; } .hot_line-txt-3 { margin-top: 12px; } .hot_line-txt-4 { font-size: 13px; color: #898989; margin-top: 9px; } .hot_line-txt-5 { margin-top: 28px; } .hot_line-txt-6 { margin-top: 13px; } .hot_line-txt-7 { font-size: 11px; color: #898989; margin-top: 49px; } /*****************inform*****************/ .forms_ { button { //width: 156px; //height: 33px; //background: #88888f; //border-top: 0; //border-left: 0; //border-right: 0; //border-bottom: 2px solid #77777f; //text-align: center; //color: #fff; //margin: 0 auto; //margin-top: 22px; //font-weight: 700; //font-size: 11px; //text-transform: uppercase; //outline: 0!important; //display: block; //cursor: pointer; //&:hover { // border-bottom: 2px solid #88888f; //} //&:active { // background: #77777f; //} } } .inform_form-wr form { margin-top: 20px; padding-top: 0; } #inform { .modal-body { padding: 0 15px; float: left; } .input-wr { padding: 0; } label { font-size: 13px; margin-top: 0; } button { } } .paym_form-txt { line-height: 15px; margin-top: 36px; } .paym_form-txt-2 { line-height: 15px; margin-top: 15px; } .inform_form-wr { margin-top: 0; padding: 0 38px; } [class*="input-wr"] { float: left; width: 100%; } .form-bg-wr { padding: 17px 30px 11px; background: #f5f5f5; border-radius: 3px; float: left; width: 100%; } .input-wr-num { width: 165px; } .input-wr-name { width: 360px; float: right; } .download_file { margin-top: 22px; } .download_file-txt { font-size: 13px; line-height: 15px; } .input-wr-file { width: 145px; overflow: hidden; position: relative; &:before { position: absolute; content: ''; width: 17px; height: 18px; top: 50%; margin-top: -9px; left: 0; background: url(../images-new/ico-all/ico-63.png) no-repeat; } label { cursor: pointer; color: #0072bc; font-size: 13px; padding-left: 33px; display: block; height: 30px; line-height: 30px; } &.has-error { label { color: #dc0a05; } } } .input-wr-file input { width: 0; height: 0; padding: 0; border: 0; background: 0 0; display: none; } .input-wr-file-txt { font-size: 13px; color: #888; width: 140px; height: 30px; line-height: 30px; } .new_wrapp_in { padding: 0 30px; margin-top: 15px; } .new_wrapp_in [class*="input-wr"] { margin-top: 12px; } .input-wr-sum { width: 165px; } .input-wr-sum-txt { font-size: 13px; color: #888; width: 360px; float: right; height: 56px; padding-top: 24px; } .input-wr-bank { width: 262px; } .input-wr-payment:first-child { margin-left: 0; width: 164px; } .input-wr-payment { width: 165px; margin-left: 30px; } /**********************************/ .help-block { display: none!important; width: 100%; float: left; font-size: 13px; color: #888; margin-top: 5px; } @media (max-width: 767px) { .login-wrapper { .btns_reg { margin-top: 20px; } } } @media (max-width: 555px) { .forms_ { width: 100%; left: 0; margin-left: 0; border-radius: 0; padding: 0 15px; label { font-size: 16px; } } #modal_close { right: 15px; } .form-title { font-size: 20px; } } @media (max-height: 550px) { .txt-forms_overflow { height: 350px; } } @media (max-height: 450px) { .txt-forms_overflow { height: 250px; } #success_form { width: 300px; margin-left: -150px; } } @media (max-height: 350px) { .txt-forms_overflow { height: 200px; } } @media (max-height: 300px) { .txt-forms_overflow { height: 150px; } } @media (max-height: 250px) { .txt-forms_overflow { height: 100px; } } @media (max-height: 200px) { .txt-forms_overflow { height: 50px; } } @media (max-height: 150px) { .txt-forms_overflow { height: 30px; } }