.section-register { padding-top: 51px; } .register-title { font-size: 24px; text-align: center; font-weight: 700; } .form-register-wr { box-shadow: 0px 0px 24px 0px rgba(109, 109, 109, 0.15); width: 100%; float: left; margin-top: 30px; padding-top: 35px; padding-bottom: 50px; } .registr-text { margin-bottom: 2px; margin-top: 48px; } .form-register-inputs-wr { padding-right: 0 !important; } .register-img-txt { width: 200px; text-align: center; font-size: 12px; color: #8d8e8e; line-height: 18px; } .input-wr-file-wrapp { width: 180px; display: table-cell; } .input-wr-file { width: 180px; margin-top: 38px; position: relative; float: left; padding-bottom: 54px; margin-left: 10px; label { margin: 0; padding: 0; background: #f1f2f3; width: 180px; height: 240px; cursor: pointer; position: relative; text-decoration: underline; text-align: center; line-height: 521px; font-size: 13px; color: $link-color; &:before { width: 48px; height: 48px; text-align: center; position: absolute; top: 50%; left: 50%; margin-top: -24px; margin-left: -24px; content: ''; background: url("../images/file.svg") 50% 50% no-repeat; background-size: 48px 48px; } } input { width: 0; height: 0; padding: 0; border: 0; background: 0 0; display: none; } .has-success { label { background: none; &:before { display: none; } } } } .img-file { width: 100%; height: 240px; position: absolute; left: 0; top: 0; z-index: 3; display: none; &.vis_ { display: block !important; } img { max-width: 100%; max-height: 100%; vertical-align: top; } p { width: 100%; height: 240px; display: table; span { display: table-cell; vertical-align: middle; text-align: center; img { vertical-align: middle; max-height: 240px; } } } } @media (max-width: 991px) { .form-register-inputs-wr { padding-right: 15px !important; padding-left: 30px !important; } } @media (max-width: 767px) { .form-register-wr { box-shadow: none; padding-top: 0; } }