@font-face {
  font-family: "myfont";
  src:
    url("fonts/PT_Root_UI/new/pt-root-ui_regular.woff2") format('woff2'),
    url("fonts/PT_Root_UI/new/pt-root-ui_regular.woff") format('woff'),
    url("fonts/PT_Root_UI/new/pt-root-ui_regular.ttf") format('truetype');
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: "myfont";
  src:
    url("fonts/PT_Root_UI/new/pt-root-ui_bold.woff2") format('woff2'),
    url("fonts/PT_Root_UI/new/pt-root-ui_bold.woff") format('woff'),
    url("fonts/PT_Root_UI/new/pt-root-ui_bold.ttf") format('truetype');
  font-weight: bold;
  font-style: normal;
}

:root {
  --base_patch: 'assets/files_d/';

  --vh: 1vh;
  --menu_up: 0px;

  --c_white: #FFFFFF;
  --c_dwhite: #FFFFFF;
  --c_black: #000000;
  --c_lblack: #181818;
  --c_lgreen: #E8FFBF;
  --c_green: #B2FE28;
  --c_bgray: #EDEEF0;
  --c_lgray: #F9F8F7;
  --c_gray: #EDEEF0;
  --c_dgray: #8D98B1;
  --c_dblue: #0040FF;
  --c_eblue: #DBF1FF;
  --c_blue: #007AFF;
  --c_lblue: #EAF3FF;
  --c_bblue: #BBDBFE;
  --c_hblue: #D4E6FF;
  --c_lred: #FFEDED;
  --c_red: #FF2C51;
  --c_line: #E7E9ED;

  --Grays_Black: rgba(0, 0, 0, 1);
  --Grays_Black70: rgba(0, 0, 0, 0.7);
  --Grays_Black30: rgba(0, 0, 0, 0.3);
  --Grays_White: rgba(255, 255, 255, 1);
  --Grays_White50: rgba(255, 255, 255, 0.5);
/*
  --Theme_Primary: rgba(0, 122, 255, 1);
  --Theme_Secondary: rgba(0, 122, 255, 0.15);
  --Theme_Tertiary: rgba(0, 122, 255, 0.07);
*/
  --Colors_Green: rgba(204, 255, 0, 1);
  --Colors_Mint: rgba(182, 255, 167, 1);
  --Colors_Ice: rgba(194, 247, 255, 1);
  --Colors_Pink: rgba(255, 200, 200, 1);
  --Colors_Beige: rgba(255, 235, 198, 1);
  --Colors_Purple: rgba(137, 98, 248, 1);
  --Colors_New: rgba(151, 255, 225, 1);
  --Colors_Lavender: rgba(236, 219, 255, 1);
  --Colors_Red: rgba(232, 76, 61, 1);

  --Colors_Green80: rgba(130, 229, 97, 0.8);
  --Colors_Ice80: rgba(125, 232, 239, 0.8);
  --Colors_Pink80: rgba(255, 174, 176, 0.8);
  --Colors_Orange80: rgba(255, 216, 162, 0.8);
  --Colors_Purple80: rgba(214, 178, 255, 0.8);
  --Colors_Red15: rgba(232, 76, 61, 0.15);

  --Various_Alert: rgba(255, 59, 48, 1);
  --Various_AlertFill: rgba(255, 59, 48, 0.15);

  --body-color: var(--Elements_Primary);
  --body-background: var(--Backgrounds_Primary);
  --body-font-family: myfont, Arial, sans-serif;
  --body-font-size: 1rem;
  --body-font-weight: 400;
  --body-line-height: 1.15;

  --panel-bg-color: var(--Windows_Primary);
  --container-bg-color: var(--Backgrounds_Primary);
  --text-color: var(--Elements_Primary);

  --Padding_Elements_S: 12px;
  --Padding_Elements_Base: 16px;
  --Padding_Elements_XL: 20px;
  --Padding_Windows_Base: 16px;
  --Gap_Elements_Base: 6px;
  --Gap_Windows_Base: 16px;
  --Gap_Windows_XL: 24px;

  --Height_Base: 48px;
  --Height_S: 36px;

  --Radius_Windows_Base: 24px;
  --Radius_Elements_S: 6px;
  --Radius_Elements_Base: 12px;
  --Radius_Inputs_Base: 12px;
  --Radius_Groups_Base: 12px;
  --Radius_Round: 999px;
  --Radius_CardImage: calc( var(--Radius_Windows_Base) - 6px );
  --Radius_Segmented_Control: calc( var(--Radius_Elements_Base) - 4px );

  --padding_min: 6px;
  --padding_norm: 10px;
  --padding_big: 16px;
  --row_min_height: 50px;
  --pop_max_width: 640px;
  --pop_min_width: 390px;
  --el_fix_widht: 321px;
  --pop_radius: 0px;
  --bor_radius: 24px;
  --bor_radius_sec: 12px;
  --bor_radius_tre: 8px;

  --c_max-width-d: 1200px;
  --c_min-width-d: 960px;
  --pop_shadow: 0px 10px 30px 0px rgba(19, 20, 22, 0.25);
}

:root{
  --Windows_Primary: rgba(255, 255, 255, 1);
  --Backgrounds_Primary: rgba(232, 234, 239, 1);

  --Elements_Primary: rgba(0, 0, 0, 1);
  --Elements_Secondary: rgba(118, 121, 122, 1);
  --Elements_Tertiary: rgba(197, 197, 199, 1);
  --Elements_Inverse: rgba(255, 255, 255, 1);

  --Market_1: rgba(155, 234, 129, 0.8);
  --Market_2: rgba(196, 242, 205, 0.8);
  --Market_3: rgba(255, 232, 200, 0.8);
  --Market_4: rgba(212, 212, 212, 0.8);

  --Fills_Primary: rgba(28, 28, 30, 0.07);
  --Fills_Secondary: rgba(255, 255, 255, 1);
  --Fills_Tertiary: rgba(7, 20, 50, 0.04);
  --Fills_Droplist: rgba(255, 255, 255, 1);

  --Misc_ScrollBG: rgba(247, 247, 248, 1);
  --Misc_Separator: rgba(28, 28, 30, 0.1);

  --brt_hover: rgba(28, 28, 30, 0.07);
  /*--brt_hover: 0.85;*/
  --Hover_Primary: rgba(7, 20, 50, 0.05);
  --Hover_Secondary: rgba(0, 122, 255, 0.07);

  --preloader_url: url('assets/files_d/css/367/img/icon/preloader-light.svg');
  --opncar_logo_work_on_url: url('assets/files_d/img/icon/opncar_logo-light.svg');
  --dealer_logo: var(--logo_light);
}
:root[class='dark-mode'] {
  --Windows_Primary: rgba(28, 28, 30, 1);
  --Backgrounds_Primary: rgba(15, 15, 15, 1);

  --Elements_Primary: rgba(255, 255, 255, 1);
  --Elements_Secondary: rgba(141, 141, 147, 1);
  --Elements_Tertiary: rgba(70, 70, 73, 1);
  --Elements_Inverse: rgba(255, 255, 255, 1);

  --Market_1: rgba(155, 234, 129, 0.8);
  --Market_2: rgba(196, 242, 205, 0.8);
  --Market_3: rgba(255, 232, 200, 0.8);
  --Market_4: rgba(212, 212, 212, 0.8);

  --Fills_Primary: rgba(255, 255, 255, 0.07);
  --Fills_Secondary: rgba(58, 58, 60, 1);
  --Fills_Tertiary: rgba(255, 255, 255, 0.04);
  --Fills_Droplist: rgba(43, 43, 46, 1);

  --Misc_ScrollBG: rgba(37, 37, 39, 1);
  --Misc_Separator: rgba(255, 255, 255, 0.1);

  --brt_hover: rgba(255, 255, 255, 0.07);
  /*--brt_hover: 1.15;*/
  --preloader_url: url('assets/files_d/css/367/img/icon/preloader-dark.svg');
  --opncar_logo_work_on_url: url('assets/files_d/img/icon/opncar_logo-dark.svg');
  --dealer_logo: var(--logo_dark);
}

.100vh {
  height: calc(var(--vh, 1vh) * 100);
}

*,
*::before,
*::after {
  border: 0;
  box-sizing: border-box;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  margin: 0;
  padding: 0;
}

body {
  color: var(--body-color);
  background-color: var(--body-background);
  font-family: var(--body-font-family);
  font-size: var(--body-font-size);
  font-weight: var(--body-font-weight);
  line-height: var(--body-line-height);
  transition: background .5s ease;
}
body, input, button {
  font-family: var(--body-font-family);
}

a {
  text-decoration: none;
  outline: none;
}

a:not(.but), a:not(.but):visited, a:hover, a:active {
  color: inherit;
}

p span {
  vertical-align: middle;
}

h1 {
  font-size: 24px;
}

i {
  /*line-height: inherit !important;*/
}

::-webkit-input-placeholder { /* WebKit, Blink, Edge */
  color: var(--Elements_Secondary);
}
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
  color: var(--Elements_Secondary);
  opacity: 1;
}
::-moz-placeholder { /* Mozilla Firefox 19+ */
  color: var(--Elements_Secondary);
  opacity: 1;
}
:-ms-input-placeholder { /* Internet Explorer 10-11 */
  color: var(--Elements_Secondary);
}
::-ms-input-placeholder { /* Microsoft Edge */
  color: var(--Elements_Secondary);
}
::placeholder { /* Most modern browsers support this now. */
  color: var(--Elements_Secondary);
}

.cur_p {
  cursor: pointer;
}
.pe_none {
  pointer-events: none !important;
  cursor: not-allowed !important;
}

.op_0 {
  opacity: 0 !important;
}
.op_50 {
  opacity: 0.5 !important;
}
.op_100 {
  opacity: 1 !important;
}

.hidden, .fade {
  display: none;
}

#preloader.hidden {
  display: block !important;
  opacity: 0;
}

.show {
  display: initial !important;
}

.pos_r {
  position: relative !important;
}
.pos_a {
  position: absolute !important;
}
.pos_f {
  position: fixed !important;
}

.dis_b {
  display: block !important;
}
.dis_ib {
  display: inline-block !important;
}
.dis_i {
  display: inline !important;
  word-wrap: break-word;
}
.dis_t {
  display: table !important;
}
.dis_tc {
  display: table-cell !important;
}
.dis_f {
  display: flex !important;
}
.dis_if {
  display: inline-flex !important;
}
.dis_g {
  display: grid !important;
}
.fd_r {
  flex-direction: row !important;
}
.fd_c {
  flex-direction: column !important;
}
.f_w {
  flex-wrap: wrap;
}
.f_00 {
  flex-grow: 0; flex-shrink: 0;
}
.f_01 {
  flex-grow: 0; flex-shrink: 1;
}
.f_10 {
  flex-grow: 1; flex-shrink: 0;
}
.f_11 {
  flex-grow: 1; flex-shrink: 1;
}
.f_col_2 {
  flex: 1;
  flex-grow: 1;
  flex-shrink: 1;
  max-width: calc(50% - 1px);
}
.f_col_3 {
  flex: 1;
  flex-grow: 1;
  flex-shrink: 1;
  max-width: calc(33.33% - 1px);
}
.jc_sb {
  justify-content: space-between;
}
.jc_c {
  justify-content: center;
}
.ai_c {
  align-items: center;
}

.w_100 {
  width: 100% !important;
  max-width: 100% !important;
}
.w_a {
  width: auto !important;
}
.w_u {
  width: unset !important;
}
.w_max {
  width: max-content !important;
}
.h_100 {
  height: 100% !important;
  max-height: 100% !important;
}

.ow_h {
  overflow: hidden;
}

.fl_l {
  float: left;
}

.fl_r {
  float: right;
}

.c_TP {
  color: var(--Theme_Primary) !important;
}
.c_FT {
  color: var(--Fills_Tertiary) !important;
}
.c_EP {
  color: var(--Elements_Primary) !important;
}
.c_ES, .c_dgray {
  color: var(--Elements_Secondary) !important;
}
.c_ET, .c_gray {
  color: var(--Elements_Tertiary) !important;
}
.c_GW {
  color: var(--Grays_White) !important;
}
.c_GB {
  color: var(--Grays_Black) !important;
}
.c_red {
  color: var(--Colors_Red) !important;
}


.b_transparent, .b_trans {
  background-color: transparent !important;
}
.b_BP {
  background-color: var(--Backgrounds_Primary) !important;
}
.b_GW {
  background-color: var(--Grays_White) !important;
}
.b_WP {
  background-color: var(--Windows_Primary) !important;
}
.b_FP {
  background-color: var(--Fills_Primary) !important;
}
.b_FT {
  background-color: var(--Fills_Tertiary) !important;
}
.b_TP {
  background-color: var(--Theme_Primary) !important;
}
.b_TS {
  background-color: var(--Theme_Secondary) !important;
}
.b_ET {
  background-color: var(--Elements_Tertiary) !important;
}

.c_white {
  color: var(--c_white) !important;
}
.c_dwhite {
  color: var(--c_dwhite);
}
.c_black {
  color: var(--c_black);
}
.c_lblack {
  color: var(--c_lblack);
}
.c_orange {
  color: var(--c_orange);
}
.c_gray {
  color: var(--c_gray);
}
.c_egray {
  color: var(--c_egray);
}
.c_lgray {
  color: var(--c_lgray);
}
.c_dgray {
  color: var(--c_dgray);
}
.c_green {
  color: var(--c_green);
}
.c_lgreen {
  color: var(--c_lgreen);
}
.c_dgreen {
  color: var(--c_dgreen);
}
.c_dblue {
  color: var(--c_dblue);
}
.c_blue {
  color: var(--c_blue);
}
.b_transparent {
  background-color: transparent !important;
}
.b_white {
  background-color: var(--c_white) !important;
}
.b_dwhite {
  background-color: var(--c_dwhite) !important;
}
.b_lwhite {
  background-color: var(--c_lwhite) !important;
}
.b_lyellow {
  background-color: var(--c_lyellow) !important;
}
.b_bgray {
  background-color: var(--c_bgray) !important;
}
.b_lgray {
  background-color: var(--c_lgray) !important;
}
.b_gray {
  background-color: var(--c_gray) !important;
}
.b_dgray {
  background-color: var(--c_dgray) !important;
}
.b_green {
  background-color: var(--c_green) !important;
}
.b_lgreen {
  background-color: var(--c_lgreen) !important;
}
.b_eblue {
  background-color: var(--c_eblue) !important;
}
.b_blue {
  background-color: var(--c_blue) !important;
}
.b_market_1 {
  background-color: var(--Market_1) !important;
}
.b_lblue {
  background-color: var(--c_lblue) !important;
}
.b_bblue {
  background-color: var(--c_bblue) !important;
}
.b_lred {
  background-color: var(--c_lred) !important;
}

.bor_1 {
  border: 1px solid var(--c_dgray);
}
.bor_2 {
  border: 2px solid var(--c_dgray);
}
.bor_red {
  border-color: var(--c_red);
}
.bor_green {
  border-color: var(--c_green);
}
.bor_bblue {
  border-color: var(--c_bblue);
}

.m_a {
  margin: auto !important;
}
.m_0 {
  margin: 0px !important;
}
.mt_0 {
  margin-top: 0px !important;
}
.mr_0 {
  margin-right: 0px !important;
}
.mb_0 {
  margin-bottom: 0px !important;
}
.ml_0 {
  margin-left: 0px !important;
}
.mt_1 {
  margin-top: 1px !important;
}
.mb_1 {
  margin-bottom: 1px !important;
}
.mt_2 {
  margin-top: 2px !important;
}
.mt_3 {
  margin-top: 3px !important;
}
.mb_3 {
  margin-bottom: 3px !important;
}
.mt_4 {
  margin-top: 4px !important;
}
.mr_4 {
  margin-right: 4px !important;
}
.mb_4 {
  margin-bottom: 4px !important;
}
.ml_4 {
  margin-left: 4px !important;
}
.mt_5 {
  margin-top: 5px !important;
}
.mr_5 {
  margin-right: 5px !important;
}
.mb_5 {
  margin-bottom: 5px !important;
}
.ml_5 {
  margin-left: 5px !important;
}
.mt_6 {
  margin-top: 6px !important;
}
.mr_6 {
  margin-right: 6px !important;
}
.mb_6 {
  margin-bottom: 6px !important;
}
.ml_6 {
  margin-left: 6px !important;
}
.mt_8 {
  margin-top: 8px !important;
}
.mt_10 {
  margin-top: 10px !important;
}
.mr_10 {
  margin-right: 10px !important;
}
.mb_10 {
  margin-bottom: 10px !important;
}
.ml_10 {
  margin-left: 10px !important;
}
.ml_12 {
  margin-left: 12px !important;
}
.mt_12 {
  margin-top: 12px !important;
}
.mr_12 {
  margin-right: 12px !important;
}
.mb_12 {
  margin-bottom: 12px !important;
}
.mt_14 {
  margin-top: 14px !important;
}
.mt_15 {
  margin-top: 15px !important;
}
.mb_15 {
  margin-bottom: 15px !important;
}
.ml_15 {
  margin-left: 15px !important;
}
.m_16 {
  margin: 16px !important;
}
.mt_16 {
  margin-top: 16px !important;
}
.mb_16 {
  margin-bottom: 16px !important;
}
.ml_16 {
  margin-left: 16px !important;
}
.mr_16 {
  margin-right: 16px !important;
}
.mt_20 {
  margin-top: 20px !important;
}
.ml_20 {
  margin-left: 20px !important;
}
.mb_20 {
  margin-bottom: 20px !important;
}
.ml_24 {
  margin-left: 24px !important;
}
.mr_24 {
  margin-right: 24px !important;
}
.mt_24 {
  margin-top: 24px !important;
}
.mb_24 {
  margin-bottom: 24px !important;
}
.mt_25 {
  margin-top: 25px !important;
}
.mr_25 {
  margin-right: 25px !important;
}
.ml_25 {
  margin-left: 25px !important;
}
.mt_30 {
  margin-top: 30px !important;
}
.ml_30 {
  margin-left: 30px !important;
}
.mt_32 {
  margin-top: 32px !important;
}
.mt_35 {
  margin-top: 35px !important;
}
.mt_40 {
  margin-top: 40px !important;
}
.mt_60 {
  margin-top: 60px !important;
}

.p_0 {
  padding: 0 !important;
}
.p_3 {
  padding: 3px !important;
}
.pt_0 {
  padding-top: 0 !important;
}
.pr_0 {
  padding-right: 0 !important;
}
.pb_0 {
  padding-bottom: 0 !important;
}
.pl_0 {
  padding-left: 0 !important;
}
.pl_3 {
  padding-left: 3px !important;
}
.pt_3 {
  padding-top: 3px !important;
}
.pr_3 {
  padding-right: 3px !important;
}
.pb_3 {
  padding-bottom: 3px !important;
}
.pt_4 {
  padding-top: 4px !important;
}
.p_5 {
  padding: 5px !important;
}
.pl_5 {
  padding-left: 5px !important;
}
.pt_5 {
  padding-top: 5px !important;
}
.pr_5 {
  padding-right: 5px !important;
}
.pb_5 {
  padding-bottom: 5px !important;
}
.p_6 {
  padding: 6px !important;
}
.pl_6 {
  padding-left: 6px !important;
}
.pr_6 {
  padding-right: 6px !important;
}
.p_8 {
  padding: 8px !important;
}
.pt_8 {
  padding-top: 8px !important;
}
.p_10 {
  padding: 10px !important;
}
.p_15 {
  padding: 15px !important;
}
.pt_10 {
  padding-top: 10px !important;
}
.pr_10 {
  padding-right: 10px !important;
}
.pb_10 {
  padding-bottom: 10px !important;
}
.pl_10 {
  padding-left: 10px !important;
}
.p_12 {
  padding: 12px !important;
}
.pr_12 {
  padding-right: 12px !important;
}
.pl_12 {
  padding-left: 12px !important;
}
.pr_14 {
  padding-right: 14px !important;
}
.pt_15 {
  padding-top: 15px !important;
}
.pr_15 {
  padding-right: 15px !important;
}
.pl_15 {
  padding-left: 15px !important;
}
.pb_15 {
  padding-bottom: 15px !important;
}
.pl_15 {
  padding-left: 15px !important;
}
.p_16 {
  padding: 16px !important;
}
.pr_16 {
  padding-right: 16px !important;
}
.pl_16 {
  padding-left: 16px !important;
}
.pt_16 {
  padding-top: 16px !important;
}
.pb_16 {
  padding-bottom: 16px !important;
}
.p_20 {
  padding: 20px !important;
}
.pb_20 {
  padding-bottom: 20px !important;
}
.pr_20 {
  padding-right: 20px !important;
}
.pl_20 {
  padding-left: 20px !important;
}
.pt_24 {
  padding-top: 24px !important;
}
.pl_24 {
  padding-left: 24px !important;
}
.pb_24 {
  padding-bottom: 24px !important;
}
.pt_32 {
  padding-top: 32px !important;
}
.pb_32 {
  padding-bottom: 32px !important;
}

.gap_1 {
  gap: 1px 1px !important;
}
.gap_2 {
  gap: 2px 2px !important;
}
.gap_4 {
  gap: 4px 4px !important;
}
.gap_5 {
  gap: 5px 5px !important;
}
.gap_6 {
  gap: 6px 6px !important;
}
.gap_8 {
  gap: 8px 8px !important;
}
.gap_10 {
  gap: 10px 10px !important;
}
.gap_12 {
  gap: 12px 12px !important;
}
.gap_14 {
  gap: 14px 14px !important;
}
.gap_16 {
  gap: 16px 16px !important;
}
.gap_24, .gap_24_15 {
  gap: 24px 24px !important;
}

.br_0 {
  border-radius: 0px !important;
}
.br_6 {
  border-radius: 6px !important;
}
.br_8 {
  border-radius: 8px !important;
}
.br_10 {
  border-radius: 10px !important;
}
.br_12 {
  border-radius: 12px !important;
}
.br_16 {
  border-radius: 16px !important;
}
.br_18 {
  border-radius: 18px !important;
}
.br_20 {
  border-radius: 20px !important;
}
.br_24 {
  border-radius: 24px !important;
}

.btlr_0 {
  border-top-left-radius: 0 !important;
}
.btrr_0 {
  border-top-right-radius: 0 !important;
}
.bblr_0 {
  border-bottom-left-radius: 0 !important;
}
.bbrr_0 {
  border-bottom-right-radius: 0 !important;
}

.fs_8 {
  font-size: 8px !important;
}
.fs_9 {
  font-size: 9px !important;
}
.fs_10 {
  font-size: 10px !important;
}
.fs_12 {
  font-size: 12px !important;
}
.fs_14 {
  font-size: 14px !important;
}
.fs_16 {
  font-size: 16px !important;
}
.fs_18 {
  font-size: 18px !important;
}
.fs_20 {
  font-size: 20px !important;
}
.fs_22 {
  font-size: 22px !important;
}
.fs_24 {
  font-size: 24px !important;
}
.fw_300 {
  font-weight: 300 !important;
}
.fw_400, .fw_regular {
  font-weight: 400 !important;
}
.fw_500, .fw_semibold {
  font-weight: 500 !important;
}
.fw_600 {
  font-weight: 600 !important;
}
.fw_700, .fw_bold {
  font-weight: 700 !important;
}

.lh_16px {
  line-height: 16px !important;
}
.lh_75 {
  line-height: .75 !important;
}
.lh_80 {
  line-height: .8 !important;
}
.lh_90 {
  line-height: .9 !important;
}
.lh_95 {
  line-height: .95 !important;
}
.lh_100 {
  line-height: 1rem !important;
}
.lh_105 {
  line-height: 1.05 !important;
}
.lh_110 {
  line-height: 1.1 !important;
}
.lh_115 {
  line-height: 1.15 !important;
}
.lh_120 {
  line-height: 1.2 !important;
}
.lh_130 {
  line-height: 1.3 !important;
}
.lh_140 {
  line-height: 1.4 !important;
}
.lh_150 {
  line-height: 1.5 !important;
}

.ta_l {
  text-align: left !important;
}
.ta_c {
  text-align: center !important;
}
.ta_r {
  text-align: right !important;
}
.va_t {
  vertical-align: top !important;
}
.va_m {
  vertical-align: middle !important;
}
.va_b {
  vertical-align: bottom !important;
}

.hov_TS:hover {
  background-color: var(--Theme_Secondary) !important;
}

.hov_lblue:hover {
  background-color: var(--c_lblue) !important;
}
.hov_hblue:hover {
  background-color: var(--c_hblue) !important;
}