#filter { position: relative; } #filter .container { position: relative; } #filter.filter_in_catalog:not(.visible) { display: none; } #filter.filter_in_catalog .container { padding-top: 0; padding-bottom: 0; margin-bottom: 40px; } @media all and (max-width: 1420px) { #filter.filter_in_catalog .container { margin-left: 0; margin-right: 0; width: 100%; } #filter.filter_in_catalog .container .filter_header .button { bottom: 10px; } } @media all and (max-width: 768px) { #filter.filter_in_catalog .container { bottom: 40px; } } #filter .filter_header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 40px; } #filter .filter_header .button { width: calc(33.333% - 21px); } @media all and (max-width: 1279px) { #filter .filter_header .button { width: calc(50% - 15px); position: absolute; right: 0; bottom: 90px; } } @media all and (max-width: 1280px) { #filter .filter_header .button { bottom: 50px; } } @media all and (max-width: 768px) { #filter .filter_header .button { width: 100%; bottom: 60px; } } #filter .filter_body { display: flex; flex-wrap: wrap; justify-content: space-between; } #filter .filter_body .filter_column { width: calc(33.333% - 21px); } @media all and (max-width: 1279px) { #filter .filter_body .filter_column { width: calc(50% - 15px); margin-bottom: 35px; } #filter .filter_body .filter_column:nth-child(3) { margin-bottom: 0; } } @media all and (max-width: 768px) { #filter .filter_body .filter_column { width: 100%; margin-bottom: 24px; } #filter .filter_body .filter_column:last-child { margin-bottom: 100px; } } #filter .filter_body .form_field { width: 100%; margin-bottom: 10px; } #filter .filter_body .fieldgroup { width: 100%; } #filter .filter_body .fieldgroup .form_field { width: calc(50% - 20px); } @media all and (max-width: 768px) { #filter .filter_body .fieldgroup .form_field { width: calc(50% - 4px); } } #catalog_small_filter { margin-bottom: 40px; } #catalog_small_filter.hidden { display: none; } #catalog_small_filter .filter_body { display: flex; justify-content: flex-end; } #catalog_small_filter .filter_body select { margin-right: 30px; width: 306px; } #catalog_small_filter .filter_body button { width: 220px; } @media all and (max-width: 1280px) { #catalog_small_filter .filter_body { justify-content: space-between; } #catalog_small_filter .filter_body .form_field { width: calc(33.333% - 30px); } #catalog_small_filter .filter_body .form_field select { width: 100%; } #catalog_small_filter .filter_body button { width: 33.3333%; } } @media all and (max-width: 768px) { #catalog_small_filter .filter_body { display: block; } #catalog_small_filter .filter_body .form_field, #catalog_small_filter .filter_body button { width: 100%; margin-bottom: 8px; } } #order .order_form { position: relative; margin: 0; } @media all and (max-width: 960px) { #order .order_form { margin-top: -60px; } } @media all and (max-width: 768px) { #order .order_form { margin: 0; } } #order .order_form .order_email { display: flex; align-items: center; position: absolute; z-index: 1; background: #EDEFF5; height: 235px; left: 0; right: 0; top: 0; bottom: 0; margin: auto; } #order .order_form .order_email p { width: 320px; font-size: 24px; line-height: 45px; padding: 0 20px; } @media all and (max-width: 1280px) { #order .order_form .order_email p { width: 220px; font-size: 13px; line-height: 20px; } } @media all and (max-width: 768px) { #order .order_form .order_email { position: relative; height: auto; margin-bottom: 25px; } #order .order_form .order_email p { padding: 0; } } #order .order_form form { width: 750px; background: var(--blue); box-sizing: border-box; padding: 55px 90px; margin: auto; margin-left: 390px; position: relative; z-index: 2; } @media all and (max-width: 1420px) { #order .order_form form { width: 550px; margin-left: 320px; } } @media all and (max-width: 960px) { #order .order_form form { width: 50%; padding: 15px 25px; margin-left: 285px; } } @media all and (max-width: 768px) { #order .order_form form { width: auto; margin-left: -16px; margin-right: -16px; padding: 25px 16px; } } #order .order_form form input { margin-bottom: 15px; background: rgba(255, 255, 255, 0.2); color: #fff; } #order .order_form form input::placeholder { color: #fff; } @media all and (max-width: 1280px) { #order .order_form form input { margin-bottom: 15px; } } #order .order_form form .policy { position: relative; z-index: 2; margin: 5px 25px 45px 25px; } @media all and (max-width: 1280px) { #order .order_form form .policy { margin-top: -5px; margin-bottom: 25px; margin-left: 0; margin-right: 0; } } #order .order_form form .policy label { color: #fff; font-weight: 300; } #order .order_form form .policy label:before { background: #fff; border-radius: 0; } #order .order_form form .policy input:checked + label:before { border-color: #fff; background: url("/assets/images/icons/checkbox_blue.svg") no-repeat center #fff; } #order .order_form form .button { display: inherit; margin-left: auto; } .login { max-width: 610px; } .login .login_with { display: flex; align-items: center; margin-bottom: 50px; justify-content: flex-start; } .login .login_with p { margin-right: 20px; } .login .login_with .tabs .tab { margin-right: 0; } .login .login_with .tabs .tab:not(.active) { background-color: var(--inactive); } .login .button-group { display: flex; align-items: center; justify-content: flex-end; } .login .button-group .button { margin-left: 30px; display: flex; } .login .button-group .button:first-child { width: auto; } .login .form_field { margin-bottom: 15px; } .login .form_field.error { margin-bottom: 25px; } .login input[name="login"] { padding-left: 32px; background: url("/assets/images/icons/icon-login.svg") no-repeat 8px 50%; } .login input[name="pass"] { padding-left: 32px; background: url("/assets/images/icons/icon-pass.svg") no-repeat 8px 50%; } .login .button { width: 90px; display: block; margin-left: auto; } @media all and (max-width: 960px) { .login { max-width: 440px; } .login form { max-width: 400px; } } @media all and (max-width: 768px) { .login .login_with { display: block; margin-bottom: 30px; } .login .login_with p { margin-bottom: 10px; } .login .login_with .tabs { width: 100%; } .login .login_with .tabs .tab { width: 50%; text-align: center; } .login .button-group { flex-wrap: wrap; justify-content: center; } .login .button-group .button { margin-left: 0; } .login .button-group button { order: 1; width: 100%; } .login .button-group a { order: 2; display: inline-flex; } } .login.recovery { max-width: 815px; } .login.recovery .message { margin-bottom: 15px; } .login.recovery form { display: flex; justify-content: space-between; } .login.recovery form .form_field { width: calc(100% - 205px); } .login.recovery form .button { width: 175px; } .login.recovery form.newPass_form { flex-wrap: wrap; } .login.recovery .resend { display: flex; align-items: center; justify-content: flex-start; } .login.recovery .resend p { margin-right: 30px; } .login.recovery .resend .button { margin-left: 0; width: auto; } @media all and (max-width: 960px) { .login.recovery form { max-width: 100%; } } @media all and (max-width: 768px) { .login.recovery form { display: block; } .login.recovery form .form_field, .login.recovery form .button { width: 100%; } .login.recovery .resend { display: block; text-align: center; margin-top: 15px; } .login.recovery .resend p { margin-right: 0; } .login.recovery .resend .button { margin-left: auto; margin-right: auto; } } .contract_search { margin-bottom: 40px; } @media all and (max-width: 1600px) and (min-width: 1280px) { .contract_search { margin-bottom: 30px; } } .contract_search form { display: flex; align-items: center; justify-content: space-between; } .contract_search form .form_field.full { width: 100% !important; margin-right: 30px !important; } @media all and (max-width: 960px) { .contract_search form .form_field.full { margin-right: 0 !important; } } .contract_search form .form_field:first-child { width: calc(50% - 15px); min-width: calc(50% - 15px); margin-right: 15px; } .contract_search form .form_field:nth-child(2), .contract_search form .form_field:nth-child(3) { width: 100%; margin-right: 15px; } .contract_search form .form_field.single { width: 100%; margin-right: 80px; } .contract_search form .form_field .button { width: 158px; min-width: 158px; } @media all and (max-width: 768px) { .contract_search form .form_field .button { display: none; } } .contract_search form .form_field input + label { display: none; } @media all and (max-width: 960px) { .contract_search { margin-bottom: 20px; } .contract_search form { flex-wrap: wrap; justify-content: flex-start; } .contract_search form .form_field:first-child { margin-bottom: 15px; width: 100%; } .contract_search form .form_field:first-child.single { width: calc(100% - 105px); margin-right: 30px; margin-bottom: 0; } .contract_search form .form_field:nth-child(2), .contract_search form .form_field:nth-child(3) { width: 25%; margin-right: 30px; } .contract_search form .button { margin-left: auto; } } @media all and (max-width: 768px) { .contract_search form { justify-content: space-between; } .contract_search form .form_field { margin-right: 0; } .contract_search form .form_field:first-child { margin-right: 0; margin-bottom: 15px; width: 100%; } .contract_search form .form_field:first-child.single { width: 100%; margin-right: 0px; } .contract_search form .form_field:nth-child(2), .contract_search form .form_field:nth-child(3) { width: calc(50% - 4px); margin-right: 0px; } .contract_search form .form_field .date_input, .contract_search form .form_field input[type="date"] { height: 55px; background-position: 8px 14px; position: relative; padding-bottom: 8px; } .contract_search form .form_field .date_input::placeholder, .contract_search form .form_field input[type="date"]::placeholder { color: transparent; } .contract_search form .form_field .date_input[value=""] + label, .contract_search form .form_field input[type="date"][value=""] + label { display: inline-block; position: absolute; left: 32px; top: 10px; z-index: 2; font-size: 13px; line-height: 20px; color: #919399; } .contract_search form .button { margin-left: auto; width: 100%; margin-top: 15px; background: var(--blue); color: #fff; display: none; } .contract_search form .button:disabled { opacity: 0.48; } } .reconciliation_form:not(.small) { margin-bottom: 35px; display: flex; flex-wrap: wrap; justify-content: space-between; } .reconciliation_form:not(.small) p { width: 100%; font-weight: 700; margin-bottom: 20px; } .reconciliation_form:not(.small) .form_group { width: calc(65% - 8px); display: flex; flex-wrap: wrap; justify-content: space-between; } .reconciliation_form:not(.small) .form_group:last-child { width: calc(35% - 8px); } .reconciliation_form:not(.small) .form_field { width: calc(50% - 8px); } .reconciliation_form:not(.small) .button { width: calc(40% - 8px); } .reconciliation_form:not(.small) .button:last-child { width: calc(60% - 8px); } @media all and (max-width: 1279px) { .reconciliation_form:not(.small) .form_group, .reconciliation_form:not(.small) .form_group:last-child { width: calc(50% - 8px); } } @media all and (max-width: 768px) { .reconciliation_form:not(.small) p { margin-bottom: 8px; } .reconciliation_form:not(.small) .form_group, .reconciliation_form:not(.small) .form_group:last-child { width: 100%; } .reconciliation_form:not(.small) .form_field { margin-bottom: 15px; } .reconciliation_form:not(.small) .button, .reconciliation_form:not(.small) .form_field { width: calc(50% - 4px); } .reconciliation_form:not(.small) .button:last-child, .reconciliation_form:not(.small) .form_field:last-child { width: calc(50% - 4px); } } .reconciliation_form.small { display: flex; flex-wrap: wrap; justify-content: space-between; max-width: 420px; } @media all and (max-width: 768px) { .reconciliation_form.small { max-width: 100%; } } .reconciliation_form.small .form_field { width: calc(50% - 8px); } @media all and (max-width: 768px) { .reconciliation_form.small .form_field { width: calc(50% - 4px); } } .reconciliation_form.small .form_field .date_input_wrapper > .rw-widget .rw-widget-container { display: block; } .reconciliation_form.small .form_field .date_input_wrapper > .rw-widget .rw-widget-container > button { margin: 0; width: 100%; } .reconciliation_form.small button.button { margin-top: 35px; width: calc(45% - 8px); } .reconciliation_form.small button.button:last-child { width: calc(55% - 8px); } @media all and (max-width: 768px) { .reconciliation_form.small button.button { width: calc(50% - 4px) !important; margin-top: 15px; } } .fade { position: fixed; z-index: 99999; top: 0; left: 0; width: 100%; height: 100%; overflow: auto; background: rgba(0, 0, 0, 0.5); display: block; } .fade:not(.opened) { display: none; } .fade .modal { max-width: 640px; width: 100%; background: #fff; margin: 100px auto; padding: 45px 40px; } .fade .modal .modal_footer { text-align: right; margin-top: 30px; } .fade .modal .modal_footer .button { margin-left: auto; } @media all and (max-width: 768px) { .fade .modal { padding: 25px 20px; margin: 0; } } .reconciliation_form.small { display: flex; flex-wrap: wrap; justify-content: space-between; max-width: 420px; } .reconciliation_form.small .form_field { width: calc(50% - 8px); } @media all and (max-width: 768px) { .reconciliation_form.small .form_field { width: calc(50% - 4px); } } .reconciliation_form.small button.button { margin-top: 15px; width: calc(45% - 8px); } .reconciliation_form.small button.button:last-child { width: calc(55% - 8px); } @media all and (max-width: 768px) { .reconciliation_form.small button.button { width: calc(50% - 4px); } } .fade { position: fixed; z-index: 99999; top: 0; left: 0; width: 100%; height: 100%; overflow: auto; background: rgba(0, 0, 0, 0.5); display: block; } .fade:not(.opened) { display: none; } .fade .modal { max-width: 640px; width: 100%; background: #fff; margin: 100px auto; padding: 45px 40px; } .fade .modal .modal_footer { text-align: right; margin-top: 30px; } .fade .modal .modal_footer .button { margin-left: auto; } .settings_user_control { display: flex; align-items: center; justify-content: space-between; margin-bottom: 45px; } .settings_user_control p { font-weight: 700; } .settings_user_control div { display: flex; align-items: center; gap: 0 7px; } @media all and (max-width: 1279px) { .settings_user_control p { width: 160px; margin-right: 16px; min-width: 160px; } .settings_user_control div { width: 100%; } .settings_user_control div button:first-child { width: 60%; } .settings_user_control div button:last-child { width: 40%; } } @media all and (max-width: 768px) { .settings_user_control { display: block; margin-bottom: 35px; width: 100%; } .settings_user_control p { width: 100%; } .settings_user_control div { display: block; } .settings_user_control div button { width: 100% !important; margin-top: 16px; } } .settings_table { display: table; border-collapse: collapse; width: 100%; } @media all and (max-width: 1279px) { .settings_table { display: block; } } .settings_table .table_row { display: table-row; } @media all and (max-width: 1279px) { .settings_table .table_row { display: block; padding-bottom: 16px; margin-bottom: 16px; border-bottom: 1px solid #EDEFF5; padding-left: 55px; background: url("../../public/assets/images/icons/user.svg") no-repeat top left; position: relative; } } @media all and (max-width: 768px) { .settings_table .table_row { padding-left: 0; background: transparent; } } .settings_table .table_row .table_cell { display: table-cell; padding: 18px 12px; border: 1px solid #EDEFF5; position: relative; } .settings_table .table_row .table_cell.delete { position: static; } @media all and (max-width: 1279px) { .settings_table .table_row .table_cell { display: flex; flex-wrap: wrap; border: 0; font-size: 13px; line-height: 20px; padding: 0; margin-bottom: 4px; } .settings_table .table_row .table_cell:before { content: attr(data-title); color: #8E94A7; font-weight: 700; display: block; width: 190px; padding-right: 10px; } } @media all and (max-width: 768px) { .settings_table .table_row .table_cell:before { width: 100%; margin-bottom: 2px; } } .settings_table .table_row .table_cell:last-child { border-left: 0; min-width: 36px; } .settings_table .table_row .table_cell:last-child button { position: absolute; width: 16px; height: 16px; padding: 0; top: 0; left: 0; right: 0; bottom: 0; margin: auto; visibility: hidden; pointer-events: none; background: url("../../public/assets/images/icons/icon-delete.svg") no-repeat center; } @media all and (max-width: 1279px) { .settings_table .table_row .table_cell:last-child:before { display: none; border: 0; } .settings_table .table_row .table_cell:last-child button { bottom: auto; left: auto; width: 32px; height: 32px; background: url("../../public/assets/images/icons/Trash.svg") no-repeat center; font-size: 0; text-indent: -999px; overflow: hidden; } } @media all and (max-width: 768px) { .settings_table .table_row .table_cell:last-child button { background: transparent; text-indent: 0; font-weight: 600; font-size: 15px; line-height: 20px; color: #A8026B; width: 140px; position: relative; } } .settings_table .table_row .table_cell:nth-last-child(2) { border-right: 0; } .settings_table .table_row .table_cell input { border: 0; outline: none; background: #fff; font-size: 15px; padding: 0; } .settings_table .table_row .table_cell input::placeholder { color: var(--text_not_active); font-size: 15px; } @media all and (max-width: 1279px) { .settings_table .table_row .table_cell input { padding: 0 12px; border: 1px solid rgba(0, 16, 61, 0.12); height: 40px; max-width: 320px; width: 100%; box-sizing: border-box; } } @media all and (max-width: 768px) { .settings_table .table_row .table_cell input { max-width: none; width: 100%; } } .settings_table .table_row .table_cell .settings_dropdown { font-family: 'Montserrat', sans-serif; cursor: pointer; width: 100%; text-align: left; font-weight: 400; justify-content: flex-start; font-size: 15px; line-height: 20px; color: #0C0C0C; padding: 0; background: url(/assets/images/icons/company-arrow.svg) no-repeat 100% 50%; } .settings_table .table_row .table_cell .settings_dropdown[data-selected="false"] { color: var(--text_not_active); } @media all and (max-width: 1279px) { .settings_table .table_row .table_cell .settings_dropdown { border: 1px solid rgba(0, 16, 61, 0.12); padding: 0 10px; background-position: calc(100% - 10px) 50%; width: calc(100% - 200px); max-width: 320px; } } @media all and (max-width: 768px) { .settings_table .table_row .table_cell .settings_dropdown { max-width: none; width: 100%; } } .settings_table .table_row .table_cell .dropdown_list { position: absolute; top: 100%; left: 0; width: 412px; display: none; background: #FFFFFF; box-shadow: 0px 4px 32px rgba(0, 0, 0, 0.16); padding: 25px 35px; z-index: 9; } @media all and (max-width: 1279px) { .settings_table .table_row .table_cell .dropdown_list { left: 200px; } } @media all and (max-width: 768px) { .settings_table .table_row .table_cell .dropdown_list { left: 0; right: 0; width: 100%; padding: 16px; } } .settings_table .table_row .table_cell .dropdown_list.opened { display: block; } .settings_table .table_row .table_cell .dropdown_list .list_item { position: relative; padding-bottom: 16px; margin-bottom: 16px; border-bottom: 1px solid var(--inactive); } .settings_table .table_row .table_cell .dropdown_list .list_item label { font-weight: 700; padding-left: 0; padding-right: 30px; line-height: 23px; } .settings_table .table_row .table_cell .dropdown_list .list_item label:before { right: 0; left: auto; } .settings_table .table_row .table_cell .dropdown_list .list_item label span { display: block; font-weight: 400; } .settings_table .table_row .table_cell .dropdown_list .list_item:last-child { border: 0; padding-bottom: 0; margin-bottom: 0; } .settings_table .table_row.table_header .table_cell { color: #8E94A7; font-weight: 700; border: 0; } .settings_table .table_row.table_header .table_cell:last-child { border-left: 0 !important; } @media all and (max-width: 1279px) { .settings_table .table_row.table_header { display: none; } } .settings_table.editable .table_row.editable .table_cell { margin-bottom: 8px; } .settings_table.editable .table_row .table_cell:last-child { border: 1px solid #EDEFF5; } @media all and (max-width: 1279px) { .settings_table.editable .table_row .table_cell:last-child { border: 0; } } .settings_table.editable .table_row .table_cell:last-child button { pointer-events: all; visibility: visible; } .new_appeal form .form_field { margin-bottom: 14px; } .new_appeal form textarea { height: 208px; } .dropzone { height: 208px; position: relative; border: 1px dashed #1C01A9; border-radius: 4px; background: rgba(28, 1, 169, 0.1); text-align: center; display: flex; align-items: center; justify-content: center; margin-top: 30px; } .dropzone .files { width: 100%; padding: 16px; } .dropzone .files:empty { display: none; } .dropzone [type="file"] { cursor: pointer; position: absolute; opacity: 0; top: 0; right: 0; bottom: 0; left: 0; } .dropzone div { max-width: 404px; text-align: center; } .dropzone div p { color: #828282; margin-bottom: 20px; } @media all and (max-width: 768px) { .dropzone { border: 0; background: transparent; height: auto; } .dropzone div p { margin-bottom: 10px; } .dropzone div p:before { content: attr(data-sm-text); display: block; } .dropzone div p span { display: none; } }