:root {
    --color-white: #ffffff;
    --color-grey-light: #F8F8F8;
    --color-grey-subtle: #EAEEF2;
    --color-grey: #B5B7B8;
    --color-blue: #337FAC; 
    --color-blue-alert: #ECF7FE;
    --color-blue-light: #E5EBF2; 
    --color-blue-dark: #113950; 
    --color-blue-darker: #1B2B2F; 
    --color-green: #3bb28a; 
    --color-green-alert: #CAF7D2; 
    --color-green-dark: #0B936E; 
    --color-green-darker: #05654B;
    --color-green-light: #91E9D0; 
    --color-green-lightest: #E6F8F3;
    --color-green-option: #DFF8DE;
     
    --color-red: #BD1818; 
    --color-red-light: #F94646; 
    --color-orange: #E9753A; 
    --color-yellow-light:#FCF8E7;
    --color-yellow:#FFE57E;
    
    
    --color-link: #3345CC; 
    --color-link-hover: #172695; 
}

/* font-family: "IBM Plex Sans",sans-serif;
@font-face {
  font-family:'IBM Plex Sans';
  font-style:normal;
  font-weight:500;
  src:local("IBM Plex Sans Medium"),
  local(IBMPlexSans-Medium),
  url("/fonts/ibmplexsans/IBMPlexSans-Medium.woff2") format("woff2")
}
@font-face {
  font-family:'IBM Plex Sans';
  font-style:normal;
  font-weight:400;
  src:local("IBM Plex Sans"),
  local(IBMPlexSans),
  url("/fonts/ibmplexsans/IBMPlexSans-Regular.woff2") format("woff2")
}
*/


[data-es]:hover::after {
  content: attr(data-es);
  position: absolute; transform: translateX(-120%) translateY(-40px);
  background: rgba(0, 0, 0, 0.5); color: white;
  padding: 4px 6px; border-radius: 2px; font-size: 11px;
}

.red { color: var(--color-red); }
a.red:hover { color: var(--color-red-light); }
hr.red { border-color: var(--color-red); }

.blue { color: var(--color-blue); }
a.blue:hover { color: var(--color-blue-dark); }
hr.blue { border-color: var(--color-blue-dark); }

.green { color: var(--color-green-dark); }
a.green:hover { color: var(--color-green); }
hr.green,
dl.component-option dd hr.green { border-color: var(--color-green-dark); }

#header { 
    background-color: var(--color-white);  
    /* box-shadow: 0 0px 6px 3px rgba(0,0,0,.25); */
    position: relative; z-index: 1;
}
.header-top-wrapper {}
.header-top { display: flex; align-items: center; justify-content: space-between; padding: 4px 0; }
.header-bottom { background-color: var(--color-blue-dark); padding: 16px 0;  }
.header { display: flex; align-items: center; gap: 0 30px; }
.header-hamburger { display: none; }
.header-logo { width: 137px; flex-shrink: 0; }
.header-logo .logo { display: block;  }
.header-spacer { flex-grow: 1; }
.header-actions { display: flex; gap: 0 30px; }

.header-menu {}
.header-menu ul { margin: 0; padding: 0; list-style: none none; list-style-position: inside;   }

.header-navigation { display: flex; align-items: center; gap: 0 8px; }
.header-navigation > li { position: relative;}
.header-navigation a.link { font-size: 16px; color: var(--color-white); border-radius: 3px; text-decoration: none; display: inline-flex; height: 44px; padding: 0 14px; align-items: center; gap: 0 4px;   }
.header-navigation a.link .label { font-weight: 400; }
.header-navigation a.link .drop { color: var(--color-red-light); }
.header-navigation .submenu { 
    display: none;
    position: absolute; z-index: 2; top: calc(100% - 5px); min-width: 200px; border-radius: 3px; overflow: hidden; 
    /* left: 50%; transform: translateX(-50%); */
    left: 0;
} 
.header-navigation .submenu ol { background-color: var(--color-red); color: var(--color-white); margin: 0; padding: 8px; list-style: none none; list-style-position: inside; }
.header-navigation .submenu ol > li { font-size: 15px; white-space: nowrap; }
.header-navigation a.sublink { display: block; padding: 6px 10px; border-radius: 3px; text-decoration: none; color: var(--color-white);   }
.header-navigation a.sublink:hover { background-color: var(--color-blue); }

.header-navigation > li:hover .submenu { display: block; }
.header-navigation a.link-active,
.header-navigation > li:hover a.link { background-color: var(--color-red); color: var(--color-white); }
.header-navigation a.link-active .drop,
.header-navigation > li:hover a.link .drop { color: var(--color-white); }

.header-menu-language {}
.header-menu-customer {}
.header-menu-customer ul { display: flex;  margin: 0; padding: 0; list-style: none none; list-style-position: inside; }
.header-menu-customer ul li:not(:last-child)::after { content: '|'; padding: 0 15px; opacity: 0.2; }
.header-menu-customer ul li a { color: var(--body-font-color); text-decoration: none;  }
.header-menu-customer ul li a:hover .label { text-decoration: underline; }
.header-menu-customer ul li .icon { display: inline-block;  margin-right: 4px; color:var(--color-red); line-height: 1; font-size: 18px; }
.header-menu-customer ul li .icon img { height: 18px; vertical-align: middle; }

/* LANGUAGES */
.language-switcher { display: inline-block; width: 135px; position: relative; }
.language-switcher ul { display: none; margin: 0; padding: 0; list-style: none none; list-style-position: inside; overflow: hidden;  border-radius: 3px; background-color: var(--color-white); position: absolute; top: 100%; left: 0; right: 0; width: 100%; z-index: 1; }
.language-switcher ul li { border-top: 1px solid rgba(0,0,0,0.05); transition:background-color 0.2s; }
.language-switcher ul li:hover { background-color: var(--color-blue-light); }
.language-link { cursor: pointer; padding: 6px 8px; text-decoration: none; display: flex; align-items: center; gap: 0 4px; color: inherit; user-select: none;  }
.language-link .flag { display: inline-block; width: 22px; height: 22px; overflow: hidden; border-radius: 50%; border: 1px solid var(--color-grey); }
.language-link .flag img { width: 100%; height: 100%; object-fit: cover; object-position: center center; vertical-align: unset; }
.language-link .label {}
.language-link .icon {font-size: 11px; }
a.language-link .icon { display: none; }
.language-switcher[aria-expanded="true"] { box-shadow: 0px 0px 4px 0px rgba(0,0,0,0.1); }
.language-switcher[aria-expanded="true"] ul { display: block; } 
.language-switcher[aria-expanded="true"] ul .language-link { color: var(--body-font-color);  }

#footer {  font-weight: 300;  }
.footer-top { background-color: var(--color-blue-darker); color: var(--color-white); padding: 60px 0;  }
.footer-bottom { background-color: var(--color-red); color: var(--color-white); padding: 15px 0;  }
.footer-info { font-size: 14px;  display: flex; align-items: center; gap: 0 15px; justify-content: space-between; }
.footer-info .cell  {}
.footer-info .cell-spacer { flex-grow: 1; }
.footer-info .cell-menu ul { margin: 0; padding: 0; list-style: none none; list-style-position: inside; display: flex; align-items: center; }
.footer-info .cell-menu ul li:not(:last-child)::after { content: '|'; padding: 0 15px; opacity: 0.4; }
.footer-info .cell-menu ul li a { color: inherit; text-decoration: none; }
.footer-info .cell-menu ul li a:hover { text-decoration: underline; }
.footer-info .cell-lang select { 
    appearance: none; border: none; font-size: 13px; padding: 6px 27px 6px 8px; border-radius: 2px;  
    background-image: url('../images/select-chevron-red.svg'); background-size: 12px 12px; background-position: center right 8px;  background-repeat: no-repeat;
}
.footer-info .cell-lang select::-ms-expand { display: none; }

.footer-layout { display: flex; align-items: stretch; justify-content: space-between; position: relative;  }
.footer-layout::before { display: block; content: ''; width: 5px; position: absolute; top: 0; left: 50%; bottom: 0; height: 100%; background-color: var(--color-blue); border-radius: 4px;  }
.footer-layout .cell { width: 44%; }

.footer-layout .col-badge-inner { display: inline-block; }

.footer-brands { padding: 60px 0; background-color: #F8F8F8;  }
.footer-brands .module-title { margin-bottom: 45px; }
.slick-brands-wrapper {  }
.slick-brands .brand-logo { display: flex; align-items: center; justify-content: center;  }
.slick-brands .brand-logo img { max-width: 120px; max-height: 56px; }
.slick-brands .brand-logo-billin img { max-width: 90px;  }
.slick-brands .brand-logo-mobioffice img { max-width: 140px;  }
.slick-brands .slick-track { display: flex; align-items: center; }

.row-partners { display: flex; align-items: center; gap:0 30px; }
.row-partners .col-badge { flex-shrink: 0; width: 170px;  }
.row-partners .col-details { flex-grow: 1;  }
.row-partners .ti-widget { /* transform: scale(0.9); */  }
.row-partners .ti-widget[data-layout-id="102"][data-set-id="drop-shadow"] .ti-top-rated-title { /* font-size: 12px; */  }
.row-partners .ti-widget[data-layout-id="102"][data-set-id="drop-shadow"] .ti-verified-by { /* display: none; */ }


.page-rating-wrapper { padding: 60px 0; background-color: #F8F8F8;  }
.page-rating {}
.page-rating ul {
    margin: 0; padding: 0; list-style: none none; list-style-position: inside;
    display: flex; align-items: center; justify-content: center; gap: 0 30px; 
}
.page-rating ul li a {}
#page_rating_message { text-align: center; }

.compliance-wrapper { padding-top: 20px; }
ul.compliance { margin: 0; padding: 0; list-style: none none; list-style-position: inside; display: flex; justify-content: space-between; align-items: center; gap: 0 20px; }
ul.compliance > li {}
ul.compliance > li.item-psd2 img { width: 58px; }
ul.compliance > li.item-pci-dss img { width: 94px; }

.payments-accepted { position: relative;}
.payments-accepted label { display: inline-block; white-space: nowrap;   font-size: 11px; position: absolute; top: -10px; left: 4px; z-index: 1;  background-color: var(--color-blue-darker); padding: 2px 6px;  }
.payments-accepted ol { margin: 0;  padding: 10px 8px 8px 8px; list-style: none none; list-style-position: inside; display: flex; align-items: center; gap: 0 6px;  border: 1px solid var(--color-white); border-radius: 4px; }
.payments-accepted ol li img { height: 26px; width: auto;}

dl.footer-links { margin-bottom: 20px;  }
dl.footer-links dt { font-size: 20px; font-weight: 500; border-bottom: 2px solid var(--color-red); padding: 0 0 8px 0; }
dl.footer-links dd { padding: 8px 0; font-size: 14px;  }
dl.footer-links dd ul.quick { margin: 0; padding: 0; list-style: none none; list-style-position: inside; }
dl.footer-links dd ul.quick li { padding: 5px 0; }
dl.footer-links dd ul.quick li a { color: var(--color-white); text-decoration: none;    }
dl.footer-links dd ul.quick li a:hover { text-decoration: underline; }

.company-logo { margin-bottom: 15px; }
.company-logo .logo { display: block; width: 140px; }
.company-address {  }
.company-address address { margin-bottom: 12px; }

ul.contactanos { margin: 0; padding: 0; list-style: none none; list-style-position: inside; }
ul.contactanos li {}
ul.contactanos li a { display: flex; align-items: center; gap: 0 6px; padding: 4px 0; color: inherit; text-decoration: none;  }
ul.contactanos li a .icon img { width: 18px; vertical-align: middle; }
ul.contactanos li a .icon [class^="fa-"] { font-size: 21px; }
ul.contactanos li a .icon .fa-whatsapp { color: #0CC143; }
ul.contactanos li a .label {}
ul.contactanos li a:hover .label { text-decoration: underline; }

.row-footer-actions {}
.row-footer-actions .btn { border-width: 1px;  }
.row-footer-actions .btn-white:hover { background-color: transparent; color: var(--color-white); }
.row-footer-actions .btn .icon img { height: 22px; vertical-align: middle;  }

.free-gift-empty { 
    height: 4px; background-color: #3CA98B; 
}

.free-gift { padding: 9px 0; background-color: #B0EBC1; text-align: center; }
.free-gift .icon { color: var(--color-red); }
.free-gift .label {}

.page-title { margin-bottom: 30px; }
.page-title .title { margin-bottom: 0; }
.page-title hr { margin: 10px 0; border-width: 6px; border-color: var(--color-red); border-radius: 3px; max-width: 200px;  }

.module-title { margin-bottom: 30px; }
.module-title .title { margin-bottom: 0; }
.module-title hr { margin: 10px 0; border-width: 6px; border-color: var(--color-red); border-radius: 3px; width: 200px;  }
.module-title.text-center hr { margin-left: auto; margin-right: auto; }

.page-heading-wrapper { padding-top: 30px;   }
.page-heading {  margin-bottom: 35px; }
.page-heading .heading { margin-bottom: 0; }
.page-heading hr { margin: 10px 0; border-width: 6px; border-color: var(--color-red); border-radius: 3px; max-width: 200px;  }
.page-heading.text-center {}
.page-heading.text-center hr { margin-left: auto; margin-right: auto; }
.page-heading-description { font-size: 13px; font-weight:400; padding-top:4px; }

.steps-wrapper { background-color: var(--color-grey-light); padding: 40px 0; }
#steps { position: relative; z-index: 1;  }
#steps dl { display: inline-flex; flex-direction: column; margin-bottom: 0; }
#steps dl dt { font-weight: 400; }
#steps dl dd { padding: 6px 0; }
#steps ol { position: relative; z-index: 1; margin: 0; padding: 0; list-style: none none; list-style-position: inside; display: flex; align-items: center; justify-content: space-between;  }
#steps ol li { width: 14.286%;; text-align: center; }
#steps ol li:first-child { /* text-align: left; */ }
#steps ol li:last-child { /* text-align: right; */ }
#steps ol li.item-odd dl { transform: translateY(-11px); }
#steps ol li.item-odd dl dt { font-size: 17px; font-style: italic; font-weight: 500; white-space: nowrap; }
#steps ol li.item-even { color: var(--color-grey); }
#steps ol li.item-even dl { transform: translateY(5px); }
#steps ol li.item-even dl dt { order: 2;  }
#steps ol li.item-even dl dd { order: 1; visibility: hidden; opacity: 0; }

#steps .step-check {  display: inline-block; width: 26px; height: 26px; border-radius: 50%; border: 3px solid var(--color-grey); background-color: var(--color-white); overflow: hidden;   background-size: 80%; background-position: center center;  background-repeat: no-repeat; }
#steps .item-active .step-check { border-color: var(--color-green-dark); background-color: var(--color-green-dark);   background-image: url('../images/icon-step-check.svg');  }
#steps .item-active dl dt { color: var(--color-green-dark); }

#steps .meter-wrapper { position: absolute; height: 6px; left: 7%; right: 7%; top: 50%; transform: translateY(-50%); }
#steps .meter-off { content:''; height: 3px; width: 100%; background-color: var(--color-grey); position: absolute; left: 0; top: 0px;  }
#steps .meter-on { content:''; height: 6px; width: 0%; background-color: var(--color-green-dark); position: absolute; left: 0; top: -2px;   }
#steps .compensator { margin-top: -10px; }

.steps-layout-wrapper { padding: 40px 0; }
.steps-layout { display: flex; }
.steps-layout .col-aside { width: 340px; flex-shrink: 0;}
.steps-layout .col-spacer { width: 30px; flex-shrink: 0; }
.steps-layout .col-main { flex-grow: 1; }

.steps-layout-reverse .col-aside { order: 3; }
.steps-layout-reverse .col-spacer { order: 2; }
.steps-layout-reverse .col-main { order: 1; }

[data-form="invalid"] .form-label { color: var(--color-red); }
[data-form="invalid"] .form-control,
[data-form="invalid"] .form-select { background-color: #F9F5F5; border-color:var(--color-red); outline-color: var(--color-red-light); } 

.steps-layout-divider { border-width: 3px; border-color: var(--color-grey-light); margin: 25px 0 25px 0;  } 
.steps-layout-actions { display: flex; justify-content: space-between; }
.steps-layout-actions .primary { display: flex; align-items: center; gap: 0 15px; }
.steps-layout-actions .secondary { display: flex; align-items: center; gap: 0 15px; }

.block-transfer { background-color: var(--color-green-alert); padding: 20px;  }
.block-transfer .heading { margin-bottom: 8px; display: flex; align-items: center; gap: 0 8px;  }
.block-transfer .heading .icon { flex-shrink: 0; font-size: 28px;  }
.block-transfer .heading .label { flex-grow: 1; }
.block-transfer .content {}
.block-transfer[data-status="success"] .heading .icon { color: var(--color-green-dark); }
.block-transfer[data-status="warning"] .heading .icon { color: var(--color-orange); }
.block-transfer[data-status="error"] .heading .icon { color: var(--color-red); }

.block-usage { padding: 20px;  background-color: var(--alert-warning-background);  }
.block-usage .heading {  margin-bottom: 8px; display: flex; align-items: center; gap: 0 8px; color: var(--color-red); }
.block-usage .heading .icon { flex-shrink: 0;  font-size: 24px; line-height: 1;  }
.block-usage .heading .label { flex-grow: 1; font-size: 18px; }
.block-usage .content {}
.block-usage .content p:last-child { margin-bottom: 0; }
.block-usage[data-status="default"] {  } 

.block-vehicle { background-color: var(--color-blue-alert);  padding: 20px;  }
.block-vehicle hr { border-width: 3px; margin: 20px 0; border-color: var(--color-blue); }
.block-vehicle .content { position: relative; }
.block-vehicle dl { margin-bottom: 0; }
.block-vehicle dl dt {}
.block-vehicle dl dd { font-weight: 500; color: var(--color-red); }
.block-vehicle ul { margin: 0; padding: 0; list-style: none none; list-style-position: inside; font-size: 18px; }
.block-vehicle ul li:not(:last-child) { margin-bottom: 10px; }

.make-and-sticker { 
    display: flex; align-items: center; gap: 0 20px; justify-content: space-between; margin-bottom: 15px; 
    position: absolute; top: 0; right: 0; 
}
.make-and-sticker .make  { display: inline-block; width: 140px; height: 80px;  }
.make-and-sticker .make img { object-position: center right; mix-blend-mode: multiply; }
.make-and-sticker .sticker { display: inline-block; width: 60px; height: 60px;  }
.make-and-sticker .sticker img {}

.block-sticker-wrapper { background-color: var(--color-green-alert);  padding: 20px; }
.block-sticker { display: flex; align-items: stretch;  gap: 0 15px; margin: 0; padding: 0; list-style: none none; list-style-position: inside;  }
.block-sticker > li { display: flex; align-items: center; }
.block-sticker > li.item-sticker { width: 76px; flex-shrink: 0; }
.block-sticker > li.item-dgt { width: 80px; flex-shrink: 0; }
.block-sticker > li.item-divider i {  display: block; width: 2px; height: 100%; background-color: var(--color-green-dark); }
.block-sticker > li.item-description { flex-grow: 1; }
.block-sticker dl { margin-bottom: 0; }
.block-sticker dl dt { font-weight: 500; font-size: 18px;  }
.block-sticker dl dd { font-style: italic; font-size: 13px;  }

.hr-x2 { border-width: 2px; }

.block-amount { background-color: var(--color-blue-alert);  padding: 20px;  }
.block-amount-input { background-color: var(--color-white); margin: 0 0 10px 0; padding: 0; list-style: none none; list-style-position: inside; display: flex; align-items: stretch; border: 2px solid #A8B4C8; border-radius: 4px; overflow: hidden; }
.block-amount-input li.cell-euro { display: flex; flex-direction: column; align-items: center; justify-content: center; flex-shrink: 0; padding: 6px 12px;  background-color: var(--color-blue); color: var(--color-white); line-height: 1; font-size: 30px; }
.block-amount-input li.cell-input { padding: 10px 10px 2px 10px; flex-grow: 1; }
.block-amount-input .the-label { display: block; width: 100%; line-height: 1; font-size: 12px; color: #444857; font-weight: 700; text-transform: uppercase; }
.block-amount-input [type="number"] { display: block; width: 100%; padding: 0; border: none; outline: none; font-size: 30px; font-weight: 700; color: var(--color-blue); }

.block-info { background-color: var(--color-grey-light); padding: 20px; }

.block-descuento { background-color: var(--color-green-option);  padding: 20px; display: flex; align-items:center; gap: 0 10px;  }
.block-descuento .col-media { flex-shrink: 0; }
.block-descuento .col-media .icon { display: flex; align-items: center; justify-content: center; width: 36px; height: 36px; background-color: var(--color-white); border-radius: 50%; overflow: hidden; padding: 6px;  } 
.block-descuento .col-details { flex-shrink: 0; }
.block-descuento .col-details em { font-size: 12px; }

.block-summary { background-color: var(--color-blue-alert);  padding: 20px;  }
.block-summary hr { margin: 10px 0; border-width: 3px; border-radius: 2px; overflow: hidden; border-color: var(--color-blue); }
.block-summary .heading { display: flex; align-items: center; gap: 0 8px; margin-bottom: 12px;  }
.block-summary .heading .icon { flex-shrink: 0; font-size: 28px; color: var(--color-red); }
.block-summary .heading .label { flex-grow: 1; }
.block-summary .col-summary { font-weight: 500; }
.block-summary .col-terms { font-style: italic; color: var(--color-blue); font-size: 13px; }

.table-summary { display: table; width:100%; max-width:100%; border-spacing:0; border-collapse:collapse;  }
.table-summary td { padding: 5px 0; font-weight: 400; }
.table-summary .td-label {}
.table-summary .td-label .label { margin: 0;  }
.table-summary .td-label small { display: block; font-style: italic; color: var(--color-blue); font-size: 13px; font-weight: 300; }
.table-summary .td-price { text-align: right; white-space: nowrap; }
.table-summary .td-price .price {}

.table-summary thead th { font-size: 20px; font-weight: 500; }
.table-summary .td-desc { text-align: right; padding-left: 15px;  }

.table-summary-bordered {}
.table-summary-bordered th { padding-top: 8px; padding-bottom: 8px; }
.table-summary-bordered td { border-top: 1px solid #E1E1E1; padding-top: 8px; padding-bottom: 8px;  }

.table-totals { display: table; width:100%; max-width:100%; border-spacing:0; border-collapse:collapse;  }
.table-totals .tr-discount { color: var(--color-red); }
.table-totals td { padding: 5px 0; font-weight: 400; font-size: 16px; }
.table-totals .td-label {}
.table-totals .td-label .label { margin: 0;  }
.table-totals .td-label small { display: block; font-style: italic; color: var(--color-blue); font-size: 13px; font-weight: 300; }
.table-totals .td-price { text-align: right; }
.table-totals .td-price .price {}
.table-totals .td-price .price.has-discount { position: relative; }
.table-totals .td-price .price.has-discount::after { content:''; width: 100%; height: 2px; background-color: var(--color-red); position: absolute; left: 50%; top: 50%; transform: translateX(-50%) translateY(-50%) rotate(-15deg);  }
.table-totals tfoot tr td { font-size: 20px; font-weight: 500; }

.block-options { border: 2px solid #A8B4C8; border-radius: 4px; overflow: hidden; padding: 15px; height: 100%; }
.block-options[data-theme="yellow"] { background-color: var(--color-yellow-light); border-color: var(--color-yellow-light); }

dl.component-option { margin-bottom: 0;}
dl.component-option dt { display: flex; align-items: center; font-size: 19px; gap: 0 8px; margin-bottom: 10px;  } 
dl.component-option dt .icon-heading { display: inline-block; width: 36px; height: 36px; flex-shrink: 0; }
dl.component-option dt .heading { flex-grow:1; }
dl.component-option dt .pricing { flex-shrink: 0; }
dl.component-option dd {}
dl.component-option dd hr { border-width: 3px; margin: 0 0 12px 0; border-color: var(--color-blue); border-radius: 3px; overflow: hidden;  } 
dl.component-option dd ul { padding-left: 15px; margin-bottom: 0; }

ol.check-options { margin: 0; padding: 0; list-style: none none; list-style-position: inside; }
ol.check-options > li { margin-bottom: 4px; }

.check-option { font-weight: 400; display: flex; align-items: center; gap: 0 8px; transition:background-color 0.2s; background-color: var(--color-grey-light); padding: 10px 12px; cursor: pointer;  }
.check-option[aria-pressed="true"] { background-color: var(--color-green-option); }
.check-option var { flex-shrink: 0; display: inline-block; box-shadow: 1px 1px 2px 0px rgba(0,0,0,0.12); border-radius: 2px; overflow: hidden; width: 20px; height: 20px; border: 2px solid var(--color-blue); background-color: var(--color-white); background-size: 80%; background-position: center center;  background-repeat: no-repeat; }
.check-option [type="checkbox"] { position: absolute; clip: rect(1px 1px 1px 1px); clip: rect(1px, 1px, 1px, 1px); padding: 0; margin: 0; border: 0; height: 1px; width: 1px; overflow: hidden; }
.check-option [type="checkbox"]:checked + var { background-color: var(--color-green-dark); border-color: var(--color-green-dark); background-image: url('../images/checkbox-on-white.svg'); }
.check-option .label { flex-grow: 1;   }
.check-option .price { flex-shrink: 0; }
.check-option:hover .label { text-decoration: underline; }

.radio-option { font-weight: 400; display: flex; align-items: center; gap: 0 8px; transition:background-color 0.2s; background-color: var(--color-grey-light); padding: 10px 12px; cursor: pointer;  }
.radio-option[aria-pressed="true"] { background-color: var(--color-green-option); }
.radio-option var { flex-shrink: 0; display: inline-block; box-shadow: 1px 1px 2px 0px rgba(0,0,0,0.12); border-radius: 50%; overflow: hidden; width: 21px; height: 21px; border: 2px solid var(--color-blue); background-color: var(--color-white); background-size: 70%; background-position: center center;  background-repeat: no-repeat; }
.radio-option [type="radio"] { position: absolute; clip: rect(1px 1px 1px 1px); clip: rect(1px, 1px, 1px, 1px); padding: 0; margin: 0; border: 0; height: 1px; width: 1px; overflow: hidden; }
.radio-option [type="radio"]:checked + var { background-color: var(--color-green-dark); border-color: var(--color-green-dark); background-image: url('../images/checkbox-on-white.svg'); }
.radio-option .label { flex-grow: 1;   }
.radio-option .price { flex-shrink: 0; }
.radio-option:hover .label { text-decoration: underline; }

.choice-box { background-color: var(--color-green-option);  padding: 20px;  }
.choice-box .heading { margin-bottom: 18px;  }
.choice-box-options { display: flex; gap: 0 15px; }
.choice-box-options label { width: 50%; cursor: pointer;  }
.choice-box-options .option { display: flex; align-items: center; gap: 0 8px; padding: 12px 15px; background-color: var(--color-white); border-radius: 5px; transition:background-color 0.2s;  }
.choice-box-options .option var { display: inline-block; width: 26px; height: 26px; border-radius: 50%; background-color: var(--color-white); border: 3px solid var(--color-grey); background-size: 80%; background-position: center center;  background-repeat: no-repeat; }
.choice-box-options [type="radio"] { position: absolute; clip: rect(1px 1px 1px 1px); clip: rect(1px, 1px, 1px, 1px); padding: 0; margin: 0; border: 0; height: 1px; width: 1px; overflow: hidden; }
.choice-box-options [type="radio"]:checked + .option { background-color: var(--color-green-dark); color: var(--color-white); }
.choice-box-options [type="radio"]:checked + .option var { background-image: url('../images/checkbox-on-green.svg'); border-color: var(--color-white); }

.postal-logos-wrapper { padding-top: 10px; }
.postal-logos { display: flex; align-items: center;  }
.postal-logos .item { padding: 5px; border-radius: 3px; overflow: hidden; margin-right: 15px; }
.postal-logos .item img { width: 100px; display: block; }
.postal-logos .item-nacex { background-color: #ED5A1A; }
.postal-logos .item-nacex img { width: 76px; }

.stickerline-wrapper { padding-top: 10px; }
.stickerline { display: flex; align-items: center; opacity: 0.85; }
.stickerline .item { margin-right: 8px;  }
.stickerline .item:last-child { margin-right: 0px;  }
.stickerline .item img { width: 63px; display: block; }

.note-green { color: var(--color-green-darker); font-style: italic; font-weight: 400;  }

.note-formula  { background-color: var(--color-white); font-size: 14px; padding: 10px 12px;   }
.note-formula small { display: block; opacity: 0.6; }
.note-formula code { display: block; opacity: 0.8; font-family: var(--body-font-family); font-weight: 400; font-size: 13px; }

.table-itp { display: table; width:100%; max-width:100%; border-spacing:0; border-collapse:collapse; }
.table-itp td { padding: 6px 0; }
.table-itp tr td:last-child { text-align: right; }
.table-itp tbody {}
.table-itp tfoot td { font-weight: 400; border-top: 3px solid var(--color-red); }

.form-check-terms { background-color: var(--color-blue-alert);  padding: 15px; border-left: 4px solid var(--color-blue);  }

.payment-options { display: flex; flex-wrap: wrap; gap: 0 0px; align-items: stretch; margin: 0; padding: 0; list-style: none none; list-style-position: inside;   }
.payment-options [type="radio"] {position: absolute; clip: rect(1px 1px 1px 1px); clip: rect(1px, 1px, 1px, 1px); padding: 0; margin: 0; border: 0; height: 1px; width: 1px; overflow: hidden; }
.payment-options > li.item { width: 50%; padding: 0 10px; margin-bottom: 20px;  }
.payment-options > li.item-onsite { width: 100%; }
.payment-options label { width: 100%; cursor: pointer;  }
.payment-options dl {  padding: 15px; margin-bottom: 0; border: 2px solid #ECECEF; border-radius: 3px; background-color: var(--color-white); transition:background-color 0.2s, border-color 0.2s; }
.payment-options dl:hover { border-color: var(--color-green); }
.payment-options dl dt { display: flex; gap: 0 10px;  align-items: center;   }
.payment-options dl dd {  }
.payment-options dl dd hr { border-color: var(--color-green); border-width: 2px; margin: 15px 0; }
.payment-options var { flex-shrink: 0; display: inline-block; width: 28px; height: 28px; border: 3px solid var(--color-grey); border-radius: 50%; overflow: hidden; background-color: var(--color-white); background-size: 80%; background-position: center center;  background-repeat: no-repeat; }
.payment-options [type="radio"]:checked + dl { background-color: var(--color-green-option); border-color: var(--color-green-darker); }
.payment-options [type="radio"]:checked + dl var { background-color: var(--color-green-darker); border-color: var(--color-green-darker); background-image: url('../images/checkbox-on-white.svg'); }

.payment-logos { margin: 0; padding: 0; list-style: none none; list-style-position: inside; display: flex; gap: 0 20px; align-items: center; justify-content: space-between;   }
.payment-logos-centered { justify-content: center;  }
.payment-logos > li img { height: 40px; }

.table-transaction-details { display: table; width:100%; max-width:100%; border-spacing:0; border-collapse:collapse; margin: 30px 0;    }
.table-transaction-details td { padding: 6px 15px; font-weight: 400; }
.table-transaction-details tr td:first-child { text-align: right; }

.bizum-black { text-align: center; }
.bizum-black img { height:40px; }

.block-hint { padding: 20px; background-color: var(--color-yellow-light); }
.block-hint hr { margin: 15px 0; border-width: 4px; border-color: var(--color-blue); border-radius: 3px; overflow: hidden;  }
.block-hint p:last-child { margin-bottom: 0; }
.block-hint .heading { display: flex; align-items: center; gap: 0 8px; }
.block-hint .heading .icon { display: inline-block; width: 24px;  }

.sign-contract-wrapper { border-radius: 12px; background-color: var(--color-white); overflow: hidden;  padding: 20px 0px 20px 20px; box-shadow: 0 4px 8px rgba(0,0,0,.3);  }
.sign-contract { overflow: auto; max-height: 700px; padding-right: 20px;  }
.sign-contract-heading { margin-bottom: 40px; display: table; width:100%; max-width:100%; border-spacing:0; border-collapse:collapse;   }
.sign-contract-heading .primary {}
.sign-contract-heading .secondary { text-align: right; }
.sign-contract-heading img { height: 66px; width: auto;}
.sign-contract-title { text-align: center; font-size: 26px; margin-bottom: 26px; }
.sign-contract-divider { padding: 15px 0; }
.sign-contract-divider hr { margin: 0; border-width: 3px; border-color: #DBE2E6; }
.sign-contract-actions { display: flex; align-items: center; justify-content: center; gap: 0 20px;  }

.notice-host { position: fixed; bottom: 60px; left: 10px; display: inline-block; font-size: 10px; padding: 3px 6px; background-color: #C63838; color: white; border-radius: 3px; }

/* ╔═══════════════════════════════════════════════════════════════════════════════════════════════╗ */
/* ║                                         COMPONENTS                                            ║ */
/* ╚═══════════════════════════════════════════════════════════════════════════════════════════════╝ */

.component-heading { margin-bottom: 20px; }
.component-heading .heading { margin-bottom: 0px; }
.component-heading hr { margin-top: 20px; max-width: 160px; border-width: 6px; border-color: var(--color-green-dark); border-radius: 3px; overflow: hidden;  }
.component-heading .leading { margin-top: 20px; font-size: 17px;  }

/* ╔═══════════════════════════════════════════════════════════════════════════════════════════════╗ */
/* ║                                         MODULES                                               ║ */
/* ╚═══════════════════════════════════════════════════════════════════════════════════════════════╝ */

.module { 
    --module-content: unset;
    --module-padding: 66px;
    position: relative; 
}

.module[data-padding="1"] { padding-top: var(--module-padding); padding-bottom: var(--module-padding); }

.module[data-bg="default"] { background-color: transparent;  }
.module[data-bg="white"] { background-color: var(--color-white);  }
.module[data-bg="green"] { background-color: var(--color-green-dark); color: var(--color-white);  }
.module[data-bg="#113950"] { background-color: var(--color-blue-dark); }
.module[data-bg="#DEF4EE"] { background-color: #DEF4EE; }
 

.module[data-bg="default"] + .module[data-bg="default"],
.module[data-bg="green"] + .module[data-bg="green"],
.module[data-bg="white"] + .module[data-bg="white"],
.module[data-bg="#113950"] + .module[data-bg="#113950"],
.module[data-bg="#DEF4EE"] + .module[data-bg="#DEF4EE"] { margin-top: calc(var(--module-padding) * -1)}

/* MODULE 0  ------------------------------------------------------------------------------------- */

.module-0 {  
    --module-padding: 60px;
    background-image: url('../images/hero.webp'); background-size: cover; background-position: center center;  background-repeat: no-repeat;  
}
.module-0-layout { display: flex; justify-content: space-between; } 
.module-0-layout .col-content { color: var(--color-white); flex-grow: 1; }
.module-0-layout .col-spacer { flex-shrink: 0; width: 30px;  }
.module-0-layout .col-form { flex-shrink: 0; width: 410px;  }
.module-0-layout .component-heading { margin-bottom: 40px; }
.module-0-layout .component-heading .heading { max-width: 500px; }

.module-heading {}

.is_sticky { position: sticky; top: 30px; }

a.card-procedure { position: relative; height: 100%; background-color: #033851; border-radius: 4px; color: var(--color-white); display: block; text-decoration: none; padding: 19px;  }
a.card-procedure::after { content:''; height: 4px; position: absolute; bottom: 0; left: 0; width: 0%; z-index: 10; background-color: var(--color-green-dark); transition: width 0.35s cubic-bezier(0.4, 0, 0.2, 1); }
a.card-procedure .title { display: flex; gap: 0 8px; align-items: center; }
a.card-procedure .title .icon { transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1); flex-shrink: 0; }
a.card-procedure .title .icon em { 
    width: 42px; height: 42px; border-radius: 50%; display: flex; align-items: center; justify-content: center; 
    padding: 12px; overflow: hidden; background-color: var(--color-green-dark);
    transition: background-color 0.35s cubic-bezier(0.4, 0, 0.2, 1);
}
a.card-procedure .title .label { display: block; line-height: 1.2; flex-grow: 1;  margin: 0; font-weight: 400; font-size: 17px; }
a.card-procedure hr { margin: 12px 0; border-color: rgba(255, 255, 255, 0.3); }
a.card-procedure .description { display: block; color: rgba(255, 255, 255, 0.736); font-size: 14px; line-height: 1.25; }
a.card-procedure .card-price { 
    display: inline-block; padding: 3px 12px; font-size: 16px; 
    position: absolute; top: -10px; right: 15px;  border-radius: 18px;
    background-color: var(--color-yellow); color: var(--color-red); 
    transition:all 0.35s cubic-bezier(0.4, 0, 0.2, 1);
}
/* Hover */
a.card-procedure:hover::after { width: 100%; }
a.card-procedure:hover .title .icon { transform: translateY(-3px) scale(1.05); }
a.card-procedure:hover .title .icon em {  background-color: var(--color-red); }
a.card-procedure:hover .card-price { transform: scale(1.2); color: var(--color-yellow-light); background-color: var(--color-red);  }


ul.row-procedures { padding: 0; margin-bottom: 0; list-style: none none; list-style-position: inside; }
ul.row-procedures > [class*="col-"] { margin-bottom: 20px; }
ul.row-procedures > li:nth-child(-n+2) a.card-procedure { background-color: #0A5579; }
ul.row-procedures > li:nth-child(n+3):nth-child(-n+4) a.card-procedure { background-color: #064867; }
ul.row-procedures + .row-compensator { margin-top: -20px; }

.row-procedures-inner {}
.row-procedures-inner .module-heading { }
.row-procedures-inner .row-procedures > li.col-6 { width: 33.33%; }

.form-import-wrapper { padding: 18px; background-color: var(--color-white); border-radius: 4px; }
.form-import-wrapper .title-wrapper {}
.form-import-wrapper .title-wrapper .title { margin: 0; text-transform: uppercase; }
.form-import-wrapper .title-wrapper hr { margin: 10px 0; border-width: 4px; border-color: var(--color-red); border-radius: 3px; }
.form-import {  }
.form-import-cover {  }
.form-import-actions .btn-full {  justify-content: space-between; }
.form-import fieldset {  }
.form-import fieldset legend { display: flex; width: 100%; align-items: center; gap: 0 12px; margin-bottom: 15px; font-weight: 400;  }
.form-import fieldset legend .label { flex-shrink: 0; white-space: nowrap; }
.form-import fieldset legend .divider { flex-grow: 1; }
.form-import fieldset legend hr { margin: 0;  }

#home_transfer_search { --button-font-size: 22px; }
#home_transfer_search  .label { flex-grow: 1; } 

.regplate { background-color: white; display: flex; align-items: stretch; justify-content: space-between; border: 2px solid #A8B4C8; border-radius: 4px; overflow: hidden; }
.regplate .the-label { text-align: left;  width: 100%; line-height: 1;  font-size: 12px; color: #444857; font-weight: 700; text-transform: uppercase; }
.regplate .the-plate { }
.regplate .cell { display: flex; flex-direction: column; align-items: center; justify-content: center; width: 100%; }
.regplate .cell-euro { flex-shrink: 0; width: 45px; background-color: var(--color-blue); }
.regplate .cell-euro img { width: 23px; }
.regplate .cell-plate { flex-grow:1; padding: 6px 10px;  }
.regplate .cell-plate .input-text { width: 100%; padding: 0; border: none; outline: none; font-size: 32px; font-weight: 700; color: var(--color-blue); }
.regplate .cell-help { flex-shrink: 0; width: 78px; border-left: 2px solid #A8B4C8;   }
.regplate .cell-help abbr { color: var(--color-blue); cursor: pointer; }
.regplate .cell-help .icon { line-height: 1; font-size: 28px; }
.regplate .cell-help .label { font-size: 12px; font-weight: 400; }

ul.vehicle-types { margin: 0; padding: 0; list-style: none none; list-style-position: inside; display: flex; align-items: stretch; justify-content: space-between; gap: 0 12px; }
ul.vehicle-types > li { width: 33.33%;  }
ul.vehicle-types label { 
    cursor: pointer; display: flex; flex-direction: column; width: 100%; height: 100%; align-items: center; justify-content: space-between; position: relative; 
    border: 3px solid var(--color-grey-subtle); border-radius: 6px; padding: 14px;
    transition:all 0.2s;
}
ul.vehicle-types label:hover { border-color: var(--color-green-dark); }
ul.vehicle-types label .type { display: block; height: 46px; margin-bottom: 15px; }
ul.vehicle-types label .label { display: block; font-size: 10px; line-height: 1.15; font-weight: 700; color: #1B2B2F; text-transform: uppercase; }
ul.vehicle-types label .icon { display: none; position: absolute; top: 4px; right: 4px; color: var(--color-green-dark); font-size: 22px; line-height: 1;  }
ul.vehicle-types [type="radio"] { position: absolute; clip: rect(1px 1px 1px 1px); clip: rect(1px, 1px, 1px, 1px); padding: 0; margin: 0; border: 0; height: 1px; width: 1px; overflow: hidden; }
ul.vehicle-types [type="radio"]:checked + label { outline: 2px solid var(--color-green-lightest);; border-color: var(--color-green-dark); background-color: var(--color-green-lightest); }
ul.vehicle-types [type="radio"]:checked + label .icon { display: inline; }

/* MODULE 1  ------------------------------------------------------------------------------------- */
.module-1 { background-image: url('../images/cover-book.svg'); background-size: 500px auto; background-position: left 6vw bottom -200px;  background-repeat: no-repeat; }
.search-help-wrapper { max-width: 760px; margin: 0 auto; padding: 30px; border-radius: 4px; background-color: rgba(255, 255, 255, 0.3); }
.search-help-form { background-color: var(--color-white); padding: 4px; border-radius: 4px; }
.search-help { display: flex; align-items: center;  }
.search-help .cell-input { flex: 1; position: relative; }
.search-help .cell-input .icon-search { 
    display: flex; width: 26px; height: 26px; 
    position: absolute; left: 10px; top: 50%; transform: translateY(-50%);
    background-image: url('../images/icon-search-dots.svg'); background-size: contain; background-position: center left;  background-repeat: no-repeat;
}
.search-help .input-search { 
    display: block; width: 100%; outline: none; height: 46px; padding-left:46px; border: none;  
    font-size: 16px; font-style: italic; font-weight: 600;
}
.search-help .cell-submit { flex-shrink: 0;  }
.search-help .cell-submit .btn { height: 46px; padding-left: 30px; padding-right: 30px;  }

dl.block-help { border: 2px solid  var(--color-grey-subtle); border-radius: 5px; padding: 15px;  }
dl.block-help dt {}
dl.block-help dt .title { margin: 0; }
dl.block-help dt .icon { margin-right: 8px; }
dl.block-help dt .label { color: var(--color-red); }
dl.block-help dt hr { margin: 9px 0 0 0; border-width: 3px; border-color: var(--color-blue); border-radius: 5px; overflow: hidden;  }
dl.block-help dd { padding-top: 12px; }
dl.block-help dd ul { margin: 0; padding: 0; list-style: none none; list-style-position: inside; }
dl.block-help dd ul li { margin-bottom: 10px; }
dl.block-help dd ul li:last-child { margin-bottom: 0; }
dl.block-help dd ul li a { display: block; position: relative; padding-left: 16px;  color: inherit; text-decoration: none; }
dl.block-help dd ul li a::before { font-weight: bold; color: var(--color-red); position: absolute; top: 2px; left: 0; content: "\f054"; font-family: "Font Awesome 6 Pro"; }
dl.block-help dd ul li a:hover { text-decoration: underline; color: var(--color-red); }

/* MODULE 2  ------------------------------------------------------------------------------------- */
.module-2 {}

/* MODULE 3  ------------------------------------------------------------------------------------- */
.module-3 {}
.module-3-layout { display: flex; gap: 0 60px; }
.module-3-layout main { flex-grow: 1; }
.module-3-layout aside { width: 320px; flex-shrink: 0;}
.module-3-layout .aside-actions { padding-top: 10px; }

/* MODULE 4  ------------------------------------------------------------------------------------- */
.module-4 {}
.help-search-results { margin: 0; padding: 0; list-style: none none; list-style-position: inside;  }
.help-search-results > li.item { margin-bottom: 20px; border: 2px solid  var(--color-grey-subtle); border-radius: 5px; padding: 15px;    }
.help-search-results .item-heading { display: flex; gap: 0 30px; margin-bottom: 15px;  }
.help-search-results .item-heading .cell-1 { flex-grow: 1; }
.help-search-results .item-heading .subtitle { font-weight: bold; color: inherit; font-size: 17px;  } 
.help-search-results .item-heading .subtitle .icon { color: var(--color-red); margin-right: 6px; }
.help-search-results .item-heading .cell-2 { flex-shrink: 0;  }
.help-search-results .item-heading .link-category { font-size: 14px; display: inline-block; text-decoration: none; padding: 5px 10px; color: inherit; background-color:#F5F5F5; }
.help-search-results .item-heading .link-category strong { color: var(--color-red); }
.help-search-results .item-excerpt mark { padding-left: 4px; padding-right: 4px; background-color: var(--color-yellow-light); font-weight: bold; color: var(--color-red); }

/* MODULE 5  ------------------------------------------------------------------------------------- */
.module-5 {}
.row-5 {}
.block-text {}
.block-text .page-heading .heading { max-width: 500px; }

.block-highlight { background-color: var(--color-yellow-light); padding: 40px; }
.block-highlight .description {}
.block-heading {}
.block-heading .heading { margin-bottom: 20px; }
.block-heading hr { margin: 0 0 25px 0; border-width: 4px; border-color: var(--color-blue); }

ul.feature-list { margin: 0; padding: 0; list-style: none none; list-style-position: inside; }
ul.feature-list > li { display: flex; align-items: center; gap: 0 8px; margin-bottom: 20px; font-size: 17px;  }
ul.feature-list > li:last-child { margin-bottom: 0; }
ul.feature-list > li .icon { display: inline-block; width: 42px; flex-shrink: 0; }
ul.feature-list > li .label { flex-grow: 1; }

/* MODULE 6  ------------------------------------------------------------------------------------- */
.module-6 { position: relative; }
.module-6 .mask { position: absolute; bottom: 0; left: 0; right: 0; height: 50%; background-color: white; z-index: 1;}
.module-6 .container { position: relative; z-index: 2;}
.module-6 .page-heading { text-align: center; }
.module-6 .page-heading .heading { margin-bottom: 20px; }
.module-6 .page-heading .description { margin-bottom: 25px; }
.module-6 .page-heading hr { margin-left: auto; margin-right: auto; }

.module-actions { display: flex; align-items: center; justify-content: center; gap: 0 20px; padding-top: 40px;  }

.cards-slick-wrapper { }
.cards-slick { }
.cards-slick .slick-arrow { 
    display: flex; width: 50px; height: 50px; align-items: center; justify-content: center; border-radius: 50%;
    outline: none; border: none; background-color: var(--color-red); color: var(--color-white);  font-size: 26px; line-height: 1;
    position: absolute; top: 50%; transform: translateY(-50%); z-index: 10;
    transition:all 0.2s;
}
.cards-slick .slick-arrow i {  transition:all 0.2s; }
.cards-slick .slick-arrow:hover { background-color: var(--color-green-dark); }
.cards-slick .slick-prev:hover i { transform: translateX(-1px); }
.cards-slick .slick-next:hover i { transform: translateX(1px); }
.cards-slick .slick-prev { left: -65px; }
.cards-slick .slick-next { right: -65px; }

/* Add spaces between Slick carousel item */
.cards-slick { /* overflow: hidden; */ }
.cards-slick .slick-slide { margin: 0 15px; }
.cards-slick .slick-list { padding: 8px 0; margin: 0 -15px; }
/* force slides to have the same height */
.cards-slick .slick-track { display: flex !important; }
.cards-slick .slick-slide {  display: flex; height: auto; align-items: center; justify-content: center; }
.cards-slick .slick-slide > div,
.cards-slick .slick-slide > div > div  { height: 100%; }

.icard { height: 100%; border-radius: 10px; background-color: var(--color-white); box-shadow: 0 0px 8px 2px rgba(0,0,0,.05); padding: 15px;  }
.icard .heading { display: flex; align-items: center; gap: 0 12px;  }
.icard .heading .icon { flex-shrink: 0; }
.icard .heading .icon em { font-style: normal; font-weight: 600; background-color: var(--color-green-light); color: var(--color-green-darker);  display: flex; align-items: center; justify-content: center; width: 42px; height: 42px; border-radius: 50%; font-size: 24px; line-height: 1; }
.icard .heading .label { flex-grow: 1; font-size: 20px; line-height: 1.1; }
.icard .media { padding: 10px 0; text-align: center; }
.icard .media img { display: inline; width: 90%; }
.icard .media hr { margin: 0 0 15px 0; border-width: 2px; border-color: var(--color-green-light); }
.icard .content {}
.icard .content .description {}
.icard .content .description p:last-child { margin-bottom: 0;}
.icard .content .extra {}

.extra-calc { padding-top: 15px;  display: flex; align-items: center; gap: 0 10px; }
.extra-calc .col-media { flex-shrink: 0; }
.extra-calc .col-media em { display: flex; align-items: center; justify-content: center; width: 54px; height: 54px; border-radius: 50%; background-color: #F1F4FE; padding: 15px; }
.extra-calc .col-media em img {}
.extra-calc .col-data { flex-grow: 1; font-size: 15px; }

.extra-list { padding-top: 15px; }
.extra-list p { margin-bottom: 8px; }
.extra-list ul { margin: 0; padding: 0; list-style: none none; list-style-position: inside; }
.extra-list ul > li { display: flex; align-items: center; gap: 0 6px; }
.extra-list ul > li:not(:last-child) { margin-bottom: 8px; }
.extra-list ul > li .icon { flex-shrink: 0; font-size: 18px; }


/* MODULE 7  ------------------------------------------------------------------------------------- */
.module-7 {}
.module-7 .page-heading { text-align: center; }

.faqz-wrapper { max-width: 860px; margin: 0 auto; }
dl.faqz {  margin-bottom: 10px;  border: 2px solid #ECECEF; border-radius: 5px; background-color: white;  transition:all 0.2s;  }
dl.faqz dt { font-size: 18px; padding: 12px 20px; gap: 0 8px; display: flex; align-items: center; justify-content: space-between; }
dl.faqz dt .icon { transition:all 0.2s;  color: var(--color-red); flex-shrink: 0; }
dl.faqz dd {  padding: 0px 20px 12px 20px; }
dl.faqz:hover { border-color: var(--color-blue); }
dl.faqz:hover dt .label { color: var(--color-blue);   }
dl.faqz-active { background-color: #F7F8F9; }
dl.faqz-active dt .icon { transform: rotate(180deg); }
dl.faqz-active dd { display: block; }
dl.faqz-active dd ul { margin-bottom: 15px; }
dl.faqz-active dd h2 { font-size: 16px; }

/* WHATSAPP WIDGET  ------------------------------------------------------------------------------------- */
#wapp {}
#wapp.is_active {}
#wapp.is_active .wapp-icon::before { opacity: 0; transform: scale(0) rotate(1turn); }
#wapp.is_active .wapp-icon::after { opacity: 1; transform: scale(1) rotate(0deg); }
#wapp.is_active .wapp-label { opacity: 0; transform: translateY(15px); visibility: hidden;  }
#wapp.is_active .wapp-chatbox { opacity: 1; transform: translate(0); visibility: visible; }



.wapp-popup { bottom: 30px; cursor: pointer; position: fixed; right: 30px; z-index: 100; }
.wapp-label {
    background-color: rgba(255, 255, 255, 0.85); border-radius: 2px; color: #43474e; font-size: 12px; line-height: 1.1;
    padding: 5px 8px; transform: translateY(-50%); transition: all .4s ease;
    display: inlin-block;
    position: absolute; top: 50%;  left: unset; right: 100%;
    margin-right: 7px; margin-left: 0px; white-space: nowrap;
}
.wapp-icon { 
    background-color: #2db742; color: white;  
    border-radius: 50%;
    box-shadow: 0 6px 8px 2px rgba(0,0,0,.14);
    height: 56px; width: 56px;
}
.wapp-icon::after, 
.wapp-icon::before { content: ""; height: 100%; left: 0; position: absolute; top: 0; transition: all .4s ease; -webkit-transition: all .4s ease; -moz-transition: all .4s ease; width: 100%; background-size: auto; }
.wapp-icon::before {
  background: transparent url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA0NzguMTY1IDQ3OC4xNjUiIHN0eWxlPSJlbmFibGUtYmFja2dyb3VuZDpuZXcgMCAwIDQ3OC4xNjUgNDc4LjE2NSIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSIgd2lkdGg9IjUxMiIgaGVpZ2h0PSI1MTIiPjxwYXRoIGQ9Ik00NzguMTY1IDIzMi45NDZjMCAxMjguNTY3LTEwNS4wNTcgMjMyLjk2Ni0yMzQuNjc5IDIzMi45NjYtNDEuMTAyIDAtNzkuODE0LTEwLjU5OS0xMTMuNDQ1LTI4Ljk2OUwwIDQ3OC4xNjVsNDIuNDM3LTEyNS4wNGMtMjEuNDM4LTM1LjA2NS0zMy43Ny03Ni4yMDctMzMuNzctMTIwLjE1OUM4LjY2NyAxMDQuMzQgMTEzLjc2MyAwIDI0My40ODUgMGMxMjkuNjIzIDAgMjM0LjY4IDEwNC4zNCAyMzQuNjggMjMyLjk0NnpNMjQzLjQ4NSAzNy4wOThjLTEwOC44MDIgMC0xOTcuNDIyIDg3LjgwMy0xOTcuNDIyIDE5NS44NjggMCA0Mi45MTUgMTMuOTg2IDgyLjYwMyAzNy41NzYgMTE0Ljg3OWwtMjQuNTg2IDcyLjU0MiA3NS44NDktMjMuOTY4YzMxLjEyMSAyMC40ODEgNjguNDU3IDMyLjI5NiAxMDguNTgzIDMyLjI5NiAxMDguNzIzIDAgMTk3LjMyMy04Ny44NDMgMTk3LjMyMy0xOTUuOTA4IDAtMTA3Ljg4Ni04OC42LTE5NS43MDktMTk3LjMyMy0xOTUuNzA5ek0zNjEuOTMxIDI4Ni42MmMtMS4zOTUtMi4zMzEtNS4yMi0zLjc0Ni0xMC44OTgtNi44MTQtNS45MTctMi44NDktMzQuMDg5LTE2LjQ5Ny0zOS41MDgtMTguMzctNS4xNi0xLjkxMy04Ljk4Ni0yLjg0OS0xMi44MTEgMi44MjktNC4wMDUgNS42MzgtMTQuOTAzIDE4LjYyOS0xOC4yMyAyMi4zNTQtMy41NDYgMy43ODUtNi44NTQgNC4yNjQtMTIuNTUyIDEuNDM1LTUuNjE4LTIuODA5LTI0LjI2Ny04Ljg2Ni00Ni4yMDMtMjguMzkxLTE3LjA1NS0xNS4wNDItMjguNjctMzMuNzExLTMxLjk5Ny0zOS41MDgtMy40MjctNS43NTgtLjM5OC04LjgyNiAyLjQ3MS0xMS42MzUgMi42OS0yLjU5IDUuNzc4LTYuNzM0IDguNjI3LTEwLjA0MSAyLjk2OS0zLjI4NyAzLjkwNS01LjYzOCA1Ljc5OC05LjQyNCAxLjkxMy0zLjkwNS45MzYtNy4xOTItLjQ3OC0xMC4xNDEtMS40MTUtMi44NDktMTMuMDEtMzAuODgxLTE3Ljc1Mi00Mi4zMzctNC44NDEtMTEuNDE2LTkuNTQzLTkuNTIzLTEyLjg3MS05LjUyMy0zLjQ2NyAwLTcuMjEyLS40NzgtMTEuMTE3LS40NzgtMy43ODUgMC0xMC4wNDEgMS4zOTUtMTUuMzgxIDcuMTkyLTUuMiA1LjY1OC0yMC4xMjMgMTkuNDY1LTIwLjEyMyA0Ny41OTcgMCAyOC4wNTIgMjAuNjAxIDU1LjMwOCAyMy41NSA1OS4wNTMgMi44NjkgMy43ODUgMzkuNzQ3IDYzLjE5NyA5OC4zMDMgODYuMDcgNTguNDc2IDIyLjg3MiA1OC40NzYgMTUuMzIxIDY5LjExNSAxNC4zNjUgMTAuMzgtLjk1NiAzNC4wNjktMTMuODY3IDM4LjgxMS0yNy4wOTYgNC42Ni0xMy40NSA0LjY2LTI0Ljc2NiAzLjI0Ni0yNy4xMzd6IiBmaWxsPSIjRkZGIi8+PC9zdmc+) 50% no-repeat;
  background-size: 30px auto; z-index: 1;
}
.wapp-icon::after {
  background: transparent url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTQiIGhlaWdodD0iMTQiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0ibTguNjU5IDYuOTk4IDUtNWExLjE3NyAxLjE3NyAwIDAgMCAwLTEuNjU3IDEuMTc3IDEuMTc3IDAgMCAwLTEuNjU3IDBsLTUgNS01LTVBMS4xNzIgMS4xNzIgMCAwIDAgLjM0NSAxLjk5OGw1IDUtNSA1YTEuMTcyIDEuMTcyIDAgMCAwIDAgMS42NTcgMS4xNzcgMS4xNzcgMCAwIDAgMS42NTcgMGw1LTUgNSA1YTEuMTc3IDEuMTc3IDAgMCAwIDEuNjU3IDAgMS4xNzcgMS4xNzcgMCAwIDAgMC0xLjY1N2wtNS01WiIgZmlsbD0iI2ZmZiIvPjwvc3ZnPg==) 50% no-repeat;
  background-size: 14px auto; opacity: 0;
  transform: scale(0) rotate(-1turn); 
  z-index: 2;
}

.wapp-chatbox { 
    border-radius: 5px 5px 8px 8px; left: unset; right: 30px; bottom: 102px; 
    box-shadow: 0 10px 10px 4px rgba(0,0,0,.04);
    max-width: calc(100% - 50px); opacity: 0;  overflow: hidden; position: fixed;
    transform: translateY(50px); transition: all .4s ease;
    visibility: hidden; width: 351px; will-change: transform,visibility,opacity; z-index: 98;
    background-color: white;
}
.wapp-chatbox:hover { box-shadow: 0 10px 10px 4px rgba(32,32,37,.23); }

.wapp-heading { background: #2DB742; color: #ffffff; padding: 10px 15px 10px 15px; position: relative; display: flex; align-items: center; gap: 0 15px;  }
.wapp-heading .cell-icon { flex-shrink: 0; font-size: 40px; }
.wapp-heading .cell-content { flex-grow: 1; }
.wapp-heading .cell-content small { display: block; line-height: 1.2; }
.wapp-body { background: #fff; padding: 12px 15px 15px 15px; }
.wapp-body-note { font-size: 12px; color: #888d98; margin-bottom: 12px;  }
.wapp-list { margin: 0; padding: 0; list-style: none none; list-style-position: inside; }
.wapp-list > li.wapp-item { margin-bottom: 12px; }
.wapp-list > li.wapp-item:last-child { margin-bottom: 0; }
a.wapp-operator {
    display: flex; align-items: center; gap: 0 8px; padding: 12px 15px; position: relative; width: 100%;
    background: #f5f7f9; border-left: 2px solid #2db742; border-radius: 2px 4px 2px 4px;
    color: inherit; text-decoration: none; transition:background-color 0.2s;
}
a.wapp-operator:hover { background: #e4f4e4;  }
.wapp-operator .cell-avatar { flex-shrink: 0; }
.wapp-operator .cell-avatar picture { display: block; width: 48px; height: 48px; border-radius: 50%; overflow: hidden; outline: 4px solid white;  }
.wapp-operator .cell-avatar picture img { width: 100%; height: 100%; object-fit: cover; object-position: center center; }
.wapp-operator .cell-details { flex-grow: 1; }
.wapp-operator .cell-details .team-name { display: block; }
.wapp-operator .cell-details .team-duty { display: block; opacity: 0.6; }
.wapp-operator .cell-icon { flex-shrink: 0; font-size: 24px; color:#2db742;  }
.wapp-non-working { padding: 8px 12px; font-size: 14px; background-color: #F2F2F2; }


.checktoggle { cursor: pointer;  align-items: center; display: inline-flex;  }
.checktoggle input[type="checkbox"] { position: absolute; clip: rect(1px 1px 1px 1px); clip: rect(1px, 1px, 1px, 1px); padding: 0; margin: 0; border: 0; height: 1px; width: 1px; overflow: hidden; }
.checktoggle .label-left { margin-right:12px; flex-shrink: 0;  }
.checktoggle .label-right { margin-left: 12px; flex-shrink: 0; }
.checktoggle .relative { position: relative;   }
.checktoggle .label-body { 
    background-color: var(--color-blue-alert); width: 70px; height: 36px; border-radius: 36px; overflow: hidden;  
    border: var(--form-border-width) solid var(--form-border-color);
    outline: var(--form-outline-width) solid var(--form-outline-color);
    transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
} 
.checktoggle .label-dot { 
    width: 30px; height: 30px;    
    background-color: #337FAC; border-radius: 50%; overflow: hidden;   
    position: absolute; left: 3px; top: 50%; transform: translateY(-50%);
    transition: all 0.3s ease;
} 
.checktoggle input[type="checkbox"]:checked ~ .label-body { background-color: var(--color-green-alert); }
.checktoggle input[type="checkbox"]:checked ~ .label-dot { left: 36px; background-color: #0B936E; }

ul.radiosquares { display: flex; align-items: center; margin: 0; padding: 0; list-style: none none; list-style-position: inside; }
ul.radiosquares [type="radio"] { position: absolute; clip: rect(1px 1px 1px 1px); clip: rect(1px, 1px, 1px, 1px); padding: 0; margin: 0; border: 0; height: 1px; width: 1px; overflow: hidden; }
ul.radiosquares label {  opacity: 0.8; cursor: pointer; }
ul.radiosquares label:hover { opacity: 1; color: var(--color-red); }
ul.radiosquares label em { 
    color: var(--form-border-color);
    display: flex; align-items: center; justify-content: center; width: 80px; height: 44px; margin-right: 15px;
    border: var(--form-border-width) solid var(--form-border-color);
    outline: var(--form-outline-width) solid var(--form-outline-color);
    transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
    font-style: normal; font-weight: 500; font-size: 18px; 
    white-space: nowrap;
}
ul.radiosquares [type="radio"]:checked ~ em,
ul.radiosquares em.is_checked { border-color: black; outline-color: black; color: var(--color-red); background-color: #DFEAF1; }

ul.radiosquares-fuel label em { width: auto; font-size: 16px; padding: 0 15px; }
ul.radiosquares-fuel label em i { margin-right: 6px; }

.rich-text {}
.rich-text h1 { font-size: var(--h1-font-size); line-height: var(--h1-line-height); }
.rich-text h1::after { margin: 10px 0 20px 0; content: ''; display: block; width: 100%; height: 6px; background-color: var(--color-red); border-radius: 3px; max-width: 200px; }
.rich-text h2, .rich-text h3  { font-size: 22px; } 
.rich-text h4 { font-size: 20px; }

.table-vimport { border: 2px solid var(--color-blue-dark); display: table; width:100%; max-width:100%; border-spacing:0; border-collapse:collapse;  }
.table-vimport thead { background-color: var(--alert-info-background);  }
.table-vimport th { background-color: var(--color-blue-dark); color: var(--color-white); padding: 8px 15px; text-align: center; font-weight: 600;  }
.table-vimport td { padding: 15px 15px; text-align: center; }
@media print {
    .table-vimport td { border: 2px solid var(--color-blue-dark); }
}

.calc-descriptive-text { font-size: 12px; margin-bottom: 15px;  }
.calc-descriptive-text p,
.calc-descriptive-text ul { margin-bottom: 4px; }

.vinput-aside { position: fixed; top:170px; left:0; z-index:10; width: auto; background-color: white; padding: 10px; border-radius: 3px; }
.vinput-aside .vimput { display: flex; }
.vinput-aside .vimput .input-text { width: 100px; font-size: 13px; }

.vimput { display:inline-flex; gap: 0 10px; align-items: center;  }
.vimput .input-text { 
    background-color: transparent; width: 155px; text-align: center; flex-grow:1; outline: none; border: none; 
    padding: 2px 0; border-bottom: 2px solid #adbe83; color: var(--color-red); font-weight: 500;  
    border-radius: 2px; 
}
.vimput .input-text:read-only,
.vimput .input-text:disabled { background-color: rgba(0, 0, 0, 0.05); cursor: not-allowed; }
.vimput em { flex-shrink: 0; font-weight: 500; color: var(--color-blue-dark);  }

.table-vimport-2 .vimput .input-text { width: 110px; }

#qrcode {}
#qrcode img { max-width: 100%; }

.quote-logo-print { margin-bottom: 60px; padding-top: 30px;   }
.quote-logo { display: table; width:100%; max-width:100%; border-spacing:0; border-collapse:collapse; table-layout: fixed;  }
.quote-logo td { text-align: right; font-weight: 500; }
.quote-logo .td-logo { text-align: left; }
.quote-logo .td-logo img { display: inline-block; width: 160px; }
.quote-logo .td-qr { text-align: right; }
.quote-logo .td-qr img { display: inline-block; width: 80px; }


.table-head-logos-print { margin-bottom: 60px; padding-top: 30px;   }
.table-head-logos { display: table; width:100%; max-width:100%; border-spacing:0; border-collapse:collapse; table-layout: fixed;  }
.table-head-logos td { text-align: right; font-weight: 500; }
.table-head-logos .td-logo { text-align: center; }
.table-head-logos img { display: inline-block; width: 160px; }

.table-print-columns { display: table; width:100%; max-width:100%; border-spacing:0; border-collapse:collapse;  }
.table-print-columns td { vertical-align: top; }
.table-print-columns .td-content-1 { width: 40%;  }
.table-print-columns .td-content-2 {  }
.table-print-columns .td-divider { width: 120px; }
.table-print-columns dl dd { font-weight: 500; }

.row-calc-budget { align-items: center; }
.calc-budget-actions { padding: 20px 0; text-align: center;  }
.calc-copyright { padding: 5px 15px; text-align: center; background-color: #D8E4BC; border-radius: 3px; font-size: 14px;   }

.table-budet { display: table; width:100%; max-width:100%; border-spacing:0; border-collapse:collapse; font-weight: 400; border: 3px double var(--color-grey); }
.table-budet tbody td { padding: 5px 15px; border-bottom: 1px solid var(--color-grey); }
.table-budet tfoot td { padding: 5px 15px; font-size: 18px; color:var(--color-red); font-weight: 600;  }
.table-budet .end { text-align: right; }

.table-vehicle-quote { display: table; width:100%; max-width:100%; border-spacing:0; border-collapse:collapse; table-layout: fixed; }
.table-vehicle-quote td { vertical-align: top; }

.yes-print,
.yes-print-tr,
.yes-print-td,
.yes-print-table { display: none; }

.label-check { cursor: pointer; }
.label-check:hover { color: var(--color-red); }

/* MODULE 8  ------------------------------------------------------------------------------------- */
.module-8 {}
.module-8 .page-heading { text-align: center; }
.reviews-widget { width: 100%; display: flex; justify-content: space-between; gap: 60px; }
.reviews-widget .col-widget { flex-shrink: 0;  }
.reviews-widget .col-carousel { flex-grow: 1;  }

.bquote {
     display: flex; flex-direction: column; font-size: 14px;  
     background-color: white; padding: 15px; border-radius: 5px; 
     font-weight: 400; box-shadow: 0 0px 6px 2px rgba(0,0,0,0.1);
}
.bquote .stars { color: #F6BB06; margin-bottom: 4px; }
.bquote .stars i { margin-right: 5px; }
.bquote .what { font-style: italic; }
.bquote .who { opacity: 0.5; font-style: italic;  }

/* [FIX] Slick carousel doesn't resize correctly within a flexbox grid in Firefox */
.slick-reviews * { min-height: 0; min-width: 0;  }
/* Add spaces between Slick carousel item */
.slick-reviews { /* overflow: hidden; */ }
.slick-reviews .slick-slide { margin: 0 15px; }
.slick-reviews .slick-list { padding: 8px 0; margin: 0 -15px; }
/* force slides to have the same height */
.slick-reviews .slick-track { display: flex !important; }
.slick-reviews .slick-slide {  display: flex; height: auto; align-items: center; justify-content: center; }
.slick-reviews .slick-slide > div,
.slick-reviews .slick-slide > div > div  { height: 100%; }

.slick-reviews .slick-dots { 
    margin: 0; padding: 0; list-style: none none; list-style-position: inside;  
    display: flex; align-items: center; justify-content: center; 
    height: 46px;
}
.slick-reviews .slick-dots li { padding: 0 8px; }
.slick-reviews .slick-dots li button { transition:all 0.2s;  display: block; width: 12px; height: 12px; border-radius: 6px;  border: none; font-size: 0; background-color: var(--color-green-dark); }
.slick-reviews .slick-dots li:not(.slick-active) button:hover { background-color: var(--color-blue); }
.slick-reviews .slick-dots li.slick-active button { width: 46px; background-color: var(--color-red); }

.slick-reviews .slick-arrow { 
    display: inline-flex; align-items: center; height: 46px; line-height: 1; font-size: 32px;
    border:none; background-color: transparent; position: absolute; bottom: 0; z-index: 1;
    color: var(--color-red);  
    --webkit-transition:all 0.2s; --moz-transition:all 0.2s; transition:all 0.2s;
}
.slick-reviews .slick-arrow:hover { color: var(--color-blue);  }
.slick-reviews .slick-prev { left: 0; } 
.slick-reviews .slick-next { right: 0; } 

#modal-vehicle-import,
#modal-fiscal-valuation { max-width: 500px; }

.custom-modal {}
.custom-modal header { display: flex; align-items: center; margin-bottom: 15px; }
.custom-modal header .label { flex-grow: 1; }
.custom-modal header .label i { color: #027aad; }
.custom-modal header .actions { flex-shrink: 0; }
.custom-modal article {}
.custom-modal footer {}

.btn-modal-close {  display: flex; align-items: center; justify-content: center; width: 28px; height: 28px;  outline: none; border-radius: 50%; border: none; line-height: 1; font-size: 20px;  background-color: var(--color-red); color: white;  }
.btn-modal-close i { transition:all 0.2s; }
.btn-modal-close:hover i { transform: rotate(90deg); }

ul.vehicle-choice { margin: 0; padding: 0; list-style: none none; list-style-position: inside; }
ul.vehicle-choice li { margin-bottom: 15px; }
ul.vehicle-choice li:last-child { margin-bottom: 0; }
ul.vehicle-choice a.href { 
    display: flex; align-items: center; gap: 0 12px; color: inherit; text-decoration: none;  
    border: 3px solid var(--color-grey-subtle); border-radius: 6px; padding: 14px; transition: all 0.2s;
}
ul.vehicle-choice a.href:hover { outline: 2px solid var(--color-green-lightest); border-color: var(--color-green-dark); background-color: var(--color-green-lightest); }
ul.vehicle-choice a.href .icon { flex-shrink: 0;   }
ul.vehicle-choice a.href .icon img { width: 62px; max-width: 82px; max-height: 36px;  }
ul.vehicle-choice a.href .label { flex-grow: 1; }

dl.accord { background-color: white; border-radius: 3px;  line-height: 1.2; }
dl.accord-bar { border: 3px solid var(--color-grey-subtle); border-radius: 6px; padding: 6px 0px; transition: all 0.2s; }
dl.accord > dt { font-weight: 500; padding: 8px 15px; display: flex; align-items: center; gap:0 12px; cursor: pointer;  }
dl.accord > dt .labels { flex-grow: 1; color: var(--color-blue); text-decoration: underline; }
dl.accord > dt .actions { flex-shrink: 0; color: var(--color-red); }
dl.accord > dt .actions i { transition:transform 0.2s; }
dl.accord > dd { padding: 8px 15px 8px 15px; }
dl.accord > dd > p:last-of-type { margin-bottom: 0; }
dl.accord > dt:hover .labels {  color: var(--color-red);  }

dl.accord[data-expanded="false"] dd { display: none; }
dl.accord.is_active dt .actions i { transform: rotate(180deg); }

.photo-requirements {
    margin: 0; padding: 10px 0 0 0; list-style: none none; list-style-position: inside;
    display: flex; gap: 0 20px; 
}
.photo-requirements > li {}
.photo-requirements figure { display: inline-block; text-align: center;  }
.photo-requirements figure img { height: 50px; width: auto; }
.photo-requirements figcaption { display: block; padding: 10px; font-size: 12px; font-weight: 500; text-transform: uppercase;  }

.get-ready { background-color: var(--color-green-alert); text-align: center; padding: 20px;  }
.get-ready {}

.table-tech-data { display: table; width:100%; max-width:100%; border-spacing:0; border-collapse:collapse; border: 1px solid #668DA3;  }
.table-tech-data th, 
.table-tech-data td { padding: 6px 10px; font-size: 15px; vertical-align: middle; border: 1px solid #668DA3; } 
.table-tech-data thead { border-width: 0; background-color: #668DA3; color: white;  }
.table-tech-data tbody tr > td:first-child { white-space: nowrap; }

#unlisted_form.is_hidden { display: none; }
.unlisted-wrapper { padding: 15px; background-color: #F7F8F9; border: 2px solid #ECECEF;  }
.unlisted-wrapper:hover { border-color: var(--color-blue);  }

/* Multi */
ul.multi_upload {
    margin: 0; padding: 0; list-style: none none; list-style-position: inside;
    display: flex; flex-wrap: wrap; gap: 0 20px;  align-items: stretch; 
}
ul.multi_upload > li { margin-bottom: 20px; }

.upload-label { margin-bottom: 8px; color: var(--color-blue); font-size: 14px; }

dl.upload_box { width: 200px; display: flex; flex-direction: column; position: relative;    }
dl.upload_box dt { margin-bottom: 10px; position: relative; flex-grow: 1;  }
dl.upload_box dt picture { overflow: hidden; border-radius: 6px; border: 2px solid var(--color-grey-subtle); transition:all 0.2s; }
dl.upload_box dt picture img { width: 100%; height: 100%; object-fit: cover; }
dl.upload_box dd { display: flex; justify-content: space-between;    }

dl.upload_box:hover .btn_upoad { background-color: var(--color-green-dark); }
dl.upload_box:hover dt picture { border-color: var(--color-green-dark); }

dl.upload_box .btn_trash { transition:transform 0.15s; background-color: var(--color-red); border-radius: 50%; color: white; outline: none; border: none; z-index: 20; position: absolute; top: 12px; right: 12px; display: flex; align-items: center; justify-content: center; width: 32px; height: 32px;  }

dl.upload_box .btn_reset { transition:transform 0.15s; background-color: var(--color-green-dark); border-radius: 50%; color: white; outline: none; border: none; z-index: 20; position: absolute; top: 12px; right: 12px; display: flex; align-items: center; justify-content: center; width: 32px; height: 32px;  }
dl.upload_box .btn_reset.is_hidden,
ul.multi_upload > li:not(:first-child) .btn_reset  { display: none; pointer-events: none; }
dl.upload_box .btn_reset:hover { transform: scale(1.15); }
dl.upload_box .btn_upoad { padding: 8px 12px; border-radius: 3px; background-color: var(--color-blue); color: white; outline: none; border: none;   }
dl.upload_box dt .btn_add_page { text-align: center; padding: 30px; outline: none; border: none;  background-color: transparent;   }
dl.upload_box dt .btn_add_page .icon { font-size: 74px; line-height: 1;  opacity: 0.2;  transition:all 0.2s;  }
dl.upload_box dt .btn_add_page .label {  opacity: 1; display: block; padding-top: 15px; font-size: 13px; font-weight: 600; text-transform: uppercase; color: var(--color-blue); }
dl.upload_box dt .btn_add_page:hover .icon { opacity: 1; color: var(--color-blue);  }

dl.upload_box .btn_remove_page {
    /* display: block; width: 100%; padding: 8px 12px; border-radius: 3px; border: none;  border-top:2px solid var(--color-red); color: var(--color-red); text-align: center; outline: none;  background-color: transparent; */
    background-color: var(--color-red); border-radius: 50%; color: white; outline: none; border: none; z-index: 20; position: absolute; top: 12px; right: 12px; display: flex; align-items: center; justify-content: center; width: 32px; height: 32px;
    transition:all 0.2s;
}
dl.upload_box .btn_remove_page:hover { background-color: var(--color-red); color: white; transform: scale(1.25); }
dl.upload_box .btn_remove_page.is_hidden { opacity: 0; pointer-events: none; }
dl.upload_box .input-file { opacity: 0; cursor: pointer; position: absolute; top: 0; left: 0; right: 0; bottom: 0; display: block;  height: 100%; width: 100%; z-index: 10; }



/* Single */
ul.single-uploads {
    margin: 0; padding: 0; list-style: none none; list-style-position: inside;
    display: flex; flex-wrap: wrap; gap: 0 18px;  align-items: stretch; 
}
ul.single-uploads > li.item { margin-bottom: 18px; width: 188px; }
dl.upload_single { position: relative; }
dl.upload_single dt { margin-bottom: 10px; }
dl.upload_single dt .ratio { overflow: hidden; border-radius: 6px; border: 2px solid var(--color-grey-subtle); transition:all 0.2s; }
dl.upload_single dt picture img { width: 100%; height: 100%; object-fit: cover; }
dl.upload_single dd {  }
dl.upload_single .btn_upoad { padding: 8px 12px; border-radius: 3px; background-color: var(--color-blue); color: white; outline: none; border: none;   }
dl.upload_single .input-file { opacity: 0; cursor: pointer; position: absolute; top: 0; left: 0; right: 0; bottom: 0; display: block;  height: 100%; width: 100%; z-index: 10; }

dl.upload_single .btn_reset { transition:transform 0.15s; background-color: var(--color-green-dark); border-radius: 50%; color: white; outline: none; border: none; z-index: 20; position: absolute; top: 12px; right: 12px; display: flex; align-items: center; justify-content: center; width: 32px; height: 32px;  }
dl.upload_single .btn_reset.is_hidden { display: none; pointer-events: none; }


dl.upload_single .btn_trash { transition:transform 0.15s; background-color: var(--color-red); border-radius: 50%; color: white; outline: none; border: none; z-index: 20; position: absolute; top: 12px; right: 12px; display: flex; align-items: center; justify-content: center; width: 32px; height: 32px;  }



dl.upload_single:hover dt .ratio { border-color: var(--color-green-dark); }
dl.upload_single:hover .btn_upoad { background-color: var(--color-green-dark); }

.label-consent { cursor: pointer; }
.label-consent a { text-decoration: none; }
.label-consent a:hover { text-decoration: underline; }
.label-consent:hover strong { color: var(--color-red);  }

.comp-terms {}
.comp-terms dl {}
.comp-terms dl dt { margin-bottom: 10px; }
.comp-terms dl dd { border: 1px solid var(--color-grey); padding: 10px; overflow: auto; max-height: 150px; font-size: 14px; }
.comp-terms dl dd p:last-of-type { margin-bottom: 0; }


.register-links {}
.register-links ul { margin: 0; padding: 0; list-style: none none; list-style-position: inside; }
.register-links ul li { margin-bottom: 5px; }
.register-links ul li a {}

ul.list-features { margin: 0; padding: 0; list-style: none none; list-style-position: inside; }
ul.list-features > li { padding: 4px 0; border-bottom: 1px dotted var(--color-blue); }


.reg-check-form { display: flex; align-items: center; justify-content: center; gap: 0 30px; }
.reg-check-form .col-form { flex-shrink: 0; width: 340px; }
.reg-check-form .col-actions { flex-shrink: 0; }


/* phone-codes-selector.js */
.phone-selector { position: relative; cursor: pointer; }
.phone-selector .flag-selected { margin-right: 3px; }
.phone-selector i { margin-left: -4px;  margin-right: 6px; font-size: 14px; color: #337FAC; transition:all 0.2s;  }
.phone-selector .phone-code { font-size: 15px; }
.phone-country-list { display: none; position: absolute; top: 120%; left: 0; z-index: 10; }
.phone-country-list .scroll-block { display: block; width: 240px;  }
.phone-country-list ul { max-height: 220px; background: #ffffff; border: 1px solid #DFEAF1; margin: 0; padding: 0; list-style: none none; list-style-position: inside;    border-radius: 6px; box-shadow: 2px 5px 10px -2px rgba(34, 60, 80, 0.2); padding: 5px; transform-origin: left top; transition: all 0.15s ease-out;  text-align: left;  overflow: hidden; overflow-y: auto;  }
.phone-country-list ul li { display: flex; align-items: center; gap: 0 6px;  padding: 4px 4px; cursor: pointer; font-size: 14px; transition:background-color 0.2s;    }
.phone-country-list .flag-item { border-radius: 2px; overflow: hidden; }
.phone-country-list .flag-item::before { display: block; border: 1px solid #dbdbdb;   }
.phone-country-list .country-code { min-width: 40px;  color: var(--form-border-color);  }
.phone-country-list .country-name { }
.phone-country-list ul li:hover { background-color: #e8f1f7;  }
.phone-country-list ul li:hover .country-code { color: var(--color-red); }
.phone-country-list ul li:hover .country-name { color: var(--color-red); text-decoration: underline; }
.phone-rotation { transform: rotate(-180deg);   }
/* END | phone-codes-selector.js  */


/* wavesurfer.min.js */
.wavebar { padding: 10px; margin-bottom: 15px; display: flex;  align-items: stretch;  align-items: center;  border: 1px solid #dedede; border-radius: 4px;  background-color: #F8F8F8;  }
.wavebar wave { cursor: pointer;   }
.wavebar #waveform {box-shadow: 0 4px 15px 0 rgba(0, 0, 0, 0.1); border-radius: 6px; overflow: hidden;  }
.wavebar-actions { flex-shrink: 0; padding-right: 15px; text-align: center   }
.wavebar-player {   flex-grow: 1;   position: relative; }
.wavebar-player::after {  position: absolute; top: 50%; transform: translateY(-50%); left: 0; z-index: 10; content: ''; display: block; height: 2px;   background: #0B936E; background: linear-gradient(90deg, #0B936E 0%, #E8E8E8 100%);  width: 0; animation: waveLenght 3s ease-in-out forwards; }
@keyframes waveLenght { from {width: 0;} to {width: 100%;} }
.wavebar-button {  display: inline-flex; align-items: center; justify-content: center; height: 48px; width: 48px; border-radius: 50%;  background-color: #0A5579; color: white; outline: none; border: none; font-size: 20px;  cursor: pointer;  border: 2px solid #0B936E; -webkit-transition:all 0.2s; -moz-transition:all 0.2s; transition:all 0.2s; }
.wavebar-button:hover {  background: #BD1818; border-color: #BD1818;  }
.waveform-controls {}
.waveform-controls button { font-size: 20px;  background-color: transparent; outline: none; border: none;  padding: 4px; }
.waveform-controls button:hover { color: var(--color-red); }
/* END | wavesurfer.min.js  */


/* Account Pages */
.account-layout-wrapper { padding: 40px 0px; }
.account-layout { display: flex; align-items: stretch;  justify-content: space-between; }
.account-layout .col-main { order: 3; flex-grow: 1; }
.account-layout .col-spacer { order: 2;  flex-shrink: 0; width: 30px; }
.account-layout .col-sidebar { order: 1; flex-shrink: 0; width: 280px; position: relative; }

.account-menu-wrapper { position: sticky; top: 35px; z-index: 1;}
ul.account-menu { 
    margin: 0; padding: 0; list-style: none none; list-style-position: inside; 
    border: 1px solid var(--color-grey); border-radius: 8px; 
    overflow: hidden;
}
ul.account-menu > li {}
ul.account-menu > li > a.link { display: flex; align-items: center; gap: 0 6px; padding: 10px 15px; text-decoration: none; color: inherit; font-weight: 400; transition:all 0.2s;  }
ul.account-menu > li > a.link:not(.link-active):hover { background-color: #edf6fd; }
ul.account-menu > li > a.link:not(.link-active):hover .icon { color: var(--color-blue-dark); }
ul.account-menu > li > a.link:not(.link-active):hover .label { color: var(--color-blue); }
ul.account-menu > li > a.link .icon { color: var(--color-blue-dark); font-size: 18px; line-height: 1;  }
ul.account-menu > li > a.link-active { background-color: var(--color-yellow-light); color: var(--color-red);  font-weight: 600; }
ul.account-menu > li > a.link-active .icon { color: var(--color-red); }
ul.account-menu > li hr { margin: 0; }

@keyframes fillHeading { to { width: 44%; } }

.account-heading {  font-size: 28px; margin-bottom: 20px; font-weight: 500; position: relative;   }
.account-heading::after { animation: fillHeading 1s forwards; content: ''; display: block; width: 0; margin-top: 10px; height: 4px; border-radius: 3px; background-color: var(--color-red) ;}
.account-heading i { color: var(--color-green-dark) }
.account-heading .icon { vertical-align: top; }

@keyframes typing { from { width: 0ch; } }
.account-heading .typing { display: inline-block; width: 20ch; text-wrap: nowrap; overflow: hidden; animation: typing 1s steps(20) 1 forwards;  } /* 1 forwards || infinite; */


@keyframes fillHeadingOrder { to { width: 100%; } }
.account-heading-order { position: relative; display: flex; align-items: center; justify-content: space-between; margin-bottom: 12px;  }
.account-heading-order .account-heading::after { display: none; animation: none;  }
.account-heading-order::after { 
    animation: fillHeadingOrder 1s forwards; content: ''; display: block; width: 0; margin-top: 10px; height: 4px; border-radius: 3px; background-color: var(--color-red);
    position: absolute; bottom: 0; left: 0; 
}

.account-heading-type { margin-bottom: 4px;  }
.account-heading-type .the-type { display: inline-block; border-radius: 3px; font-weight: 500;  text-transform: uppercase; font-size: 11px; line-height: 1.2; padding: 4px 8px; background-color: var(--color-red); color: var(--color-white); }

#password-wrap {  position: relative; }
#password { }
#password:focus {  }
#showmark { position: absolute; clip: rect(1px 1px 1px 1px); clip: rect(1px, 1px, 1px, 1px); padding: 0; margin: 0; border: 0; height: 1px; width: 1px; overflow: hidden; }
#toggle_password { cursor: pointer; color: var(--color-link); }
#criteria { 
    flex:0 0 100%; display:flex; flex-wrap:wrap;   
    margin: 0; padding: 5px 0; list-style: none none; list-style-position: inside; 
}
#criteria li { flex:0 0 50%; margin-bottom: 5px; font-size: 14px;  }
#criteria li i{ margin-right:6px; }
#criteria li i.fa-circle-xmark{color:var(--color-red);}
#criteria li i.fa-circle-check{color:var(--color-green);}

#clear_password { cursor: pointer; position: absolute; top: 50%; right: 60px; transform: translateY(-50%); font-size: 19px; line-height: 1; }
#clear_password.hide_it { display: none; }


.table-orders { 
    display: table; width:100%; max-width:100%; border-spacing:0; border-collapse:collapse;   
    border: 1px solid var(--color-grey);
}
.table-orders thead th { background-color: var(--color-grey-light); border-bottom: 1px solid var(--color-grey); font-size: 11px; text-transform: uppercase; font-weight: 500; }
.table-orders tbody tr:hover { background-color: #FCF8E7; }
.table-orders th,
.table-orders td { padding: 8px 12px; vertical-align: middle;  }
.table-orders .service {}
.table-orders .type { display: block; line-height: 1.1; }
.table-orders .date { display: block; line-height: 1.1; }
.table-orders .btn-sm { height: 32px; font-size: 14px;  }

.account-hello-wrapper { border: 1px solid var(--color-grey); border-radius: 8px;  padding: 10px 15px; margin-bottom: 20px;  }
.account-hello {  display: flex; align-items: center; gap: 0 12px;   }
.account-hello .col-icon { flex-shrink: 0; }
.account-hello .col-icon picture { 
    display: flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: 50%; overflow: hidden; 
    background-color: var(--color-grey-light); border: 1px solid var(--color-grey); font-size: 20px; line-height: 1;
}
.account-hello .col-details { flex-grow: 1; }
.hello-user {}
.hello-user small { color: var(--color-blue); display: block; font-size: 10px; text-transform: uppercase; font-weight: 500;   }
.hello-user .username { font-weight: 400; display: block;  }
.hello-id { opacity: 0.5; font-size: 12px;  }

.badge-verified { color: var(--color-green); border-radius: 3px; padding: 4px 8px; font-size: 14px; font-weight: 400; margin-top: 11px; background-color: var(--color-green-lightest);  }

.sign-404 { text-align: center; }
.sign-404 img { display: inline-block; width: 100%;  max-width: 300px; }

.btn-regplate {  transition:all 0.2s; border: 2px solid #A8B4C8; border-radius: 3px; overflow: hidden; display: inline-flex; align-items: stretch; justify-content: center;  color: var(--bColor-blue); text-decoration: none; }
.btn-regplate i { flex-shrink: 0; width: 20px; padding: 0px 5px; color: white; background: #337FAC url('../images/regplate.svg') no-repeat center;  background-size: auto 80%; }
.btn-regplate strong {  padding: 4px 8px; transition:all 0.2s; text-transform: uppercase;  }
.btn-regplate:hover { border-color: #337FAC; }
.btn-regplate:hover strong { color: white; background: #337FAC; }
.btn-regtype { display: block; }

.badge-status { display: inline-block; line-height: 1; border-radius: 2px; border: 1px solid transparent; font-weight: 400; font-size: 12px; padding: 4px 6px; background-color: #F8F9FC; color: black; text-decoration: none;  }
.badge-status-block { display: block; font-size: 15px; padding: 8px 15px; }
/* Statuses */
.badge-status-new { background-color: #FFD700; }
.badge-status-paid { background-color: #228B22; color: white;  }
.badge-status-pendsign {  background-color: #00d0ff;  }
.badge-status-penddata {  background-color: #00d0ff;  }
.badge-status-reviewed { background-color: #ff9500;  }
.badge-status-processing { background-color: #ff9500;  }
.badge-status-issuedgt {  background-color: #DC143C; color: white; }
.badge-status-cancelled {  background-color: #DC143C; color: white; }
.badge-status-completed { background-color: #228B22; color: white;  }
.badge-status-sent { background-color: #FFD700;  }

.password-requirements-wrapper { margin-bottom: 20px;  }
.password-requirements { background-color: #F8F8F8; border-radius: 6px; padding: 15px 20px; }

#strength-meter { background-color: #ddd; display: block;  border-radius: 5px; height: 10px; overflow: hidden; }
#strength-meter span { 
    display: block; height: 100%; width: 0; 
    transition: all 0.4s ease-in-out; /* Smooth transition for width changes */
    background-color: #ae3737;
}
#strength-meter span.strength-20 { }
#strength-meter span.strength-40 { background-color: #d05619; }
#strength-meter span.strength-60 { background-color: #F8BF35; }
#strength-meter span.strength-80 { background-color: #A5E5B9; }
#strength-meter span.strength-100 { background-color: #2a9c63; }

.fgrid { display: grid;  grid-template-columns: repeat(2, auto); grid-gap: 25px; }
.fgrid .fcell { width: 100%; }
a.flink { 
    color: inherit; text-decoration: none; display: flex; align-items: center; gap: 0 10px;  
    background-color:var(--color-grey-light); border-radius: 8px; padding: 15px 20px;
    transition:all 0.2s;
}
a.flink .col-details { flex-grow: 1; display: flex; flex-direction: column;  }
a.flink .heading { margin-bottom: 5px; font-size: 17px;  }
a.flink .description { font-size: 14px; opacity: 0.8; }
a.flink .col-media { flex-shrink: 0;  }
a.flink .col-actions { flex-shrink: 0;  }
a.flink .col-actions .icon { display: inline-block; transition:transform 0.2s; }

a.flink:hover { text-decoration: none;  background-color:var(--color-blue-light); }
a.flink:hover .heading { color: var(--color-red); }
a.flink:hover .col-actions .icon { color: var(--color-red); transform: translateX(5px); }

.acell-grid { display: grid;  grid-template-columns: repeat(3, auto); grid-gap: 20px; }
.acell-grid .acell { width: 100%; }
.acell-extra { margin: 0; }
.acell-extra dt { margin-bottom: 5px; font-weight:500;  }
.acell-extra dt a {   }
.acell-extra dd {}

.account-actions-wrapper {}
.account-actions-wrapper hr { margin: 10px 0 25px 0; }
.account-actions {
    margin: 0; padding: 0; list-style: none none; list-style-position: inside;
    display: flex; align-items: center; justify-content: space-between; gap: 0 15px;  
}
.account-actions > li {}

.block-account-create { background-color: var(--color-yellow-light); padding: 30px;  }
.block-account-create hr { margin: 0 0 25px 0; border-width: 4px; border-color: var(--color-blue); }

ul.statustags { margin: 0; padding: 0; list-style: none none; list-style-position: inside; display: flex; flex-wrap: wrap; gap: 0 8px;  }
ul.statustags > li { margin-bottom: 8px; }

.documentlist-wrapper {}
.documentlist-empty { padding-left: 10px; border-left: 4px solid var(--color-red); font-size: 14px;  }
.documentlist { margin: 0; padding: 0; list-style: none none; list-style-position: inside; }
.documentlist > li { margin-bottom: 4px; }
.documentlist > li a.link { text-decoration: none;  }
.documentlist > li a.link:hover { text-decoration: underline; }

#company_terms {}
#company_terms[aria-expanded="true"] {  }
#company_terms[aria-expanded="false"] {  }

.order-documents-wrapper {}
.order-documents-wrapper hr { margin: 15px 0; }
dl.order-documents { margin-bottom: 0; }
dl.order-documents dt { font-size: 18px; margin-bottom: 14px;}
dl.order-documents dd {}
table.table-order-documents {}
table.table-order-documents tbody td { vertical-align: middle; }
table.table-order-documents .td-icon { width: 70px; }
table.table-order-documents .td-label { }
table.table-order-documents .td-action {  text-align: right;  }
 
.square-doc { 
    color: inherit; display: flex; align-items: center; justify-content: center;  width: 52px; height: 52px; line-height: 1; position: relative; 
    text-decoration: none; border-radius: 4px; background-color: var(--color-blue-light); 
}
.square-doc .cell-1 { font-size: 34px; line-height: 1; }
.square-doc .cell-2 { 
    position: absolute; top: -5px; right: -5px; z-index: 10; 
    display: inline-flex; height: 24px; width: 24px; line-height: 1; font-size: 14px; align-items: center; justify-content: center; border-radius: 50%;   
    color: white;
}
.square-doc .cell-2.status-danger { background-color: var(--color-red); }
.square-doc .cell-2.status-success { background-color: var(--color-green); }

.layout-static-wrapper { padding: 30px 0; }
.layout-static { display: flex; }
.layout-static .col-main { flex-grow: 1; }
.layout-static .col-spacer { flex-shrink: 0; width: 40px; }
.layout-static .col-sidebar { flex-shrink: 0; width: 300px;  }
.layout-static .col-sidebar .is_sticky { }

.menu-aside { padding: 10px 20px; background-color: #F8F8F8; border: 1px solid #ebebeb; border-radius: 5px;    }
.menu-aside ul { margin: 0; padding: 0; list-style: none none; list-style-position: inside; }
.menu-aside ul li a { display: flex; padding: 5px 0; gap: 0 8px; text-decoration: none; text-decoration: none; color: inherit;  }
.menu-aside ul li a .icon {}
.menu-aside ul li a .label { text-decoration: underline; }
.menu-aside ul li a:hover .label { text-decoration: none; }

dl.order-cancellation { border: 1px solid var(--color-red); border-radius: 3px; overflow: hidden;  }
dl.order-cancellation.is_active dt {  background-color: #F7E8E8;   }
dl.order-cancellation dt { transition:all 0.2s; font-weight: 500; padding: 10px 15px;  }
dl.order-cancellation dt:hover {  background-color: #F7E8E8; }
dl.order-cancellation dt .icon { color: var(--color-red); }
dl.order-cancellation dd { display: none; padding: 10px 15px 10px 15px; display: none;   }
dl.order-cancellation dd p { margin-bottom: 10px; }

table.table-cookies { border: 1px solid #ebebeb; display: table; width:100%; max-width:100%; border-spacing:0; border-collapse:collapse;  }

.account-order-notes { padding: 12px 15px; border-radius: 3px; background-color: #fff8e9;  }

.layout-docs { display: flex; gap: 0 15px; }
.layout-docs-main { flex-grow: 1;  }
.layout-docs-sidebar { flex-shrink: 0; width: 320px; }

.current-client-status { padding: 12px 15px; border-radius: 3px; background-color: #fff8e9;  }
.current-client-status[data-status="active"] { background-color: #b5eaa9;  }
.current-client-status[data-status="inactive"] { background-color: #F7E8E8;  }

.form-file-input { background-color: #edf6fd; padding: 4px; border-radius: 4px; overflow: hidden;  }
.form-file-input input[type=file] { font-size: 14px; font-style: italic; transition: border-color 0.25s ease-in-out; }
.form-file-input input[type=file]::file-selector-button { font-size: 14px; padding: 8px 15px; border-width: 0; border-radius: 5px; background-color: #337FAC; color: #ffffff; transition: all 0.25s ease-in-out; cursor: pointer; margin-right: 8px;  }
.form-file-input input[type=file]:hover { border-color: #888; }
.form-file-input input[type=file]:hover::file-selector-button { background-color: #1f66ad; }

.uploadfile { 
    /* background-color: #F8F8F8; padding: 10px 15px; 
    border: 1px solid var(--color-grey); border-radius: 3px; 
    */ 
    display: flex; align-items: center; gap: 0 15px; justify-content: space-between; 
}
.uploadfile .uitem {}
.uploadfile .uitem-label { flex-shrink: 0; }
.uploadfile .uitem-input { flex-grow: 1;}
.uploadfile .uitem-actions { flex-shrink: 0; }

.docsready { display: flex; align-items: center; justify-content: space-between;  gap: 0 15px; padding: 20px; border: 2px solid var(--color-green); border-radius: 3px;  }
.docsready .item-content { flex-grow: 1; }
.docsready .item-actions { flex-shrink: 0; }

.ul-documents { padding-left: 15px; }
.ul-documents > li { margin-bottom: 5px; }
.ul-documents > li::marker { content: '🗎 '}

.autofill-data { position: fixed; bottom: 100px; left: 0; z-index: 10; }
.autofill-data ul { margin: 0; padding: 0; list-style: none none; list-style-position: inside; }
.autofill-data ul > li { margin-bottom: 5px; }
.autofill-data .btnfill { display: flex; gap: 0 4px;  padding: 4px 8px; border: none; font-size: 12px; background-color: #ECF7FE;    }


.order-vehicle { background-color: #F3F4F7; padding: 15px 15px;  margin-bottom: 20px; }
ul.order-vehicle-list { 
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
    gap: 15px 40px;
    margin: 0; padding: 0; list-style: none none; list-style-position: inside; 
}
ul.order-vehicle-list > li {}
ul.order-vehicle-list label.label { opacity: 0.7; font-weight: 400; }
ul.order-vehicle-list h6.subhead { display: block; font-size: 18px; font-weight: bold; margin: 0;  }

.services-selected-wrapper { margin-bottom: 20px; }
.services-selected-wrapper .heading { font-size: 18px; }
ul.services-selected { margin: 0; padding: 0; list-style: none none; list-style-position: inside; }
ul.services-selected > li { margin-bottom: 5px; }
ul.services-selected > li hr { margin: 10px 0; }
ul.services-selected input[type="checkbox"] {
  -webkit-appearance: none; -moz-appearance: none; appearance: none; -webkit-print-color-adjust: exact; color-adjust: exact; print-color-adjust: exact;
  flex-shrink: 0; width: 18px; height: 18px; border: 2px solid #668DA3; display: inline-block; vertical-align: text-bottom; 
  background-repeat: no-repeat; background-position: center; background-size: contain;
  border-radius: 2px; background-size: 120%; overflow: hidden;
  transition:all 0.2s;
}
ul.services-selected input[type="checkbox"]:checked { 
  background-color: var(--color-green); border-color: var(--color-green); 
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='m6 10 3 3 6-6'/%3e%3c/svg%3e");
}
ul.services-selected .labelbox {cursor: pointer;  display: block; background-color: #F3F4F7; user-select: none; }

ul.services-extrainfo {  }
ul.services-extrainfo-list { margin: 0; padding: 0; list-style: none none; list-style-position: inside; }
ul.services-extrainfo-list > li { margin-bottom: 5px; }
ul.services-extrainfo-list > li hr { margin: 10px 0; }

.card-customer-wrapper {  margin-bottom: 20px;  }
.row-card-customer { align-items: stretch; }
dl.card-customer { display: flex; flex-direction: column;  height: 100%;  margin-bottom: 0; border: 4px solid #F3F4F7; padding: 12px; border-radius: 2px; }
dl.card-customer dt { font-size: 16px; text-transform: uppercase; margin-bottom: 10px;  }
dl.card-customer dd {  }
.card-customer-list { margin: 0; padding: 0; list-style: none none; list-style-position: inside; }

.sendsign-actions { display: flex; align-items: center; justify-content: space-between; }
ul.sendsign-options { margin: 0; padding: 0; list-style: none none; list-style-position: inside; }
ul.sendsign-options > li { margin-bottom: 15px; font-weight: 400; }
ul.sendsign-options > li:last-child { margin-bottom: 0; }
label.sendopt { display: block; }
label.sendopt p { 
    display: flex; align-items: center; margin: 0; gap: 0 5px; padding: 10px 15px; border: 1px sodli red; 
    background-color: white; border: 1px solid #DEE2E6; border-radius: 3px; 
}
label.sendopt p:hover { background-color: #F8F8F8; }
label.sendopt .icon { font-size: 30px; color: var(--color-blue-dark); margin-right: 12px; }
label.sendopt input[type="radio"] { position: absolute; clip: rect(1px 1px 1px 1px); clip: rect(1px, 1px, 1px, 1px); padding: 0; margin: 0; border: 0; height: 1px; width: 1px; overflow: hidden; }
label.sendopt input[type="radio"]:checked + p { outline: 2px solid var(--color-green-lightest); border-color: var(--color-green); background-color: var(--color-green-alert); }

.optitem-label { margin-bottom: .25rem; color: var(--form-border-color); font-weight: 400; }
.optitem-list { margin: 0; padding: 0; list-style: none none; list-style-position: inside; display: flex; gap: 0 20px;  }
.optitem { }
.optitem p {  
    display: flex; align-items: center;  gap: 0 8px; margin: 0; padding: 12px 15px; 
    border: var(--form-border-width) solid var(--form-border-color); border-radius: var(--form-border-radius); outline: var(--form-outline-width) solid var(--form-outline-color);
}
.optitem .radio { }
.optitem .radio:checked + p { background-color: var(--color-green-alert); border-color: var(--color-green); outline-color: var(--color-green);  }
.optitem img.icon { width: 48px; flex-shrink: 0;  }
.optitem strong.label { display: block;  font-size: 16px; flex-grow: 1; line-height: 1.1; }


.veiloader { 
    --color-spinner-veil: #BD1818; --color-spinner-bg: rgba(6, 35, 56, 0.9); display: none; 
    height:100%;left:0;position:fixed;text-align:center;top:0;width:100%;z-index:100; 
    transition:background-color 0.2s, opacity 0.2s;
}
.veiloader[aria-hidden="false"] { display: block; }
.veiloader .underlay{ transition:background-color 0.2s, opacity 0.2s; background-color:var(--color-spinner-bg);height:100%;left:0;opacity:1;position:absolute;top:0;width:100%}
.spinner-veil-wrapper { 
  pointer-events:none; position:fixed;left:50%;top:50%;transform:translate(-50%,-50%); 
  display: flex; min-width: 240px; flex-direction: column;  align-items: center; justify-content: center; padding: 15px; border-radius: 5px; 
  background-color: #E6F8F3; border:2px solid #337FAC; 
  
}
.spinner-veil { position: relative; display:inline-block;height:32px; width:64px; }
.spinner-veil div{animation-timing-function:cubic-bezier(0,1,1,0);background-color:var(--color-spinner-veil);border-radius:50%;height:11px;position:absolute;top:10px;width:11px}
.spinner-veil div:nth-child(1){animation:spinner_v1 .6s infinite;left:6px}
.spinner-veil div:nth-child(2){animation:spinner_v2 .6s infinite;left:6px}
.spinner-veil div:nth-child(3){animation:spinner_v2 .6s infinite;left:26px}
.spinner-veil div:nth-child(4){animation:spinner_v3 .6s infinite;left:45px}
@keyframes spinner_v1 { 0%{transform:scale(0)} 100%{transform:scale(1)} }
@keyframes spinner_v3 { 0%{transform:scale(1)} 100%{transform:scale(0)} }
@keyframes spinner_v2 { 0%{transform:translate(0,0)} 100%{transform:translate(19px,0)} }
.spinner-veil-label { font-size: 11px; font-weight: 500; text-transform: uppercase;   color: #0B936E;  }

#consent_terms {}
#consent_terms.invalid { outline:3px solid #faa0a0;  }
#consent_terms.invalid + * { color: red;   }


/* JvO?&N.l>\Cxpx=iJl0 */

/* ╔═══════════════════════════════════════════════════════════════════════════════════════════════╗ */
/* ║                                       BREAKPOINTS                                             ║ */
/* ╚═══════════════════════════════════════════════════════════════════════════════════════════════╝ */
@media (min-width: 576px)  {}
@media (min-width: 768px)  {}
@media (min-width: 992px)  {}
@media (min-width: 1280px) {}
@media (min-width: 1366px) {}
@media (min-width: 1440px) {}
@media (min-width: 1600px) {}
@media (min-width: 1920px) {} /* 1920px & Up */


/* ╔══════════════════════════════════════════════════════════════════════════════════════════════════════╗ */
/* ║ ####################################   DEVELOPMENT BREAKPOINTS   ##################################  ║ */
/* ╚══════════════════════════════════════════════════════════════════════════════════════════════════════╝ */
/* 4XL */ @media (max-width: 1919.98px) { } /* @media -----------------------------------| width < 1920px |-------------------------------------------*/
/* 3XL */ @media (max-width: 1599.98px) { 
 
 

} /* @media -----------------------------------| width < 1600px |-------------------------------------------*/
/* 2XL */ @media (max-width: 1439.98px) { 

 

} /* @media -----------------------------------| width < 1440px |-------------------------------------------*/

/* XL */ @media (max-width: 1365.98px)  {

 

 } /* @media -----------------------------------| width < 1366px |-------------------------------------------*/

/* LG */ 
@media (max-width: 1279.98px) {
 
     

} /* @media -----------------------------------| width < 1200px |-------------------------------------------*/

/* MD */ @media (max-width: 991.98px) {

    :root { }
 
    .header-bottom { padding: 12px 0; }
    .header-hamburger { display: block; }
    .header-menu { display: none; }
    .header { gap: 0 20px; }
    .header-logo { width: 114px; }
    .header-actions { gap: 0 20px; }

    .module {  --module-padding: 40px;  }
    .free-gift { font-size: 14px; }
    
    .page-heading { margin-bottom: 25px; }

    .cards-slick .slick-arrow { top: -30px; width: 36px; height: 36px; font-size: 20px;  }
    .cards-slick .slick-prev { left: 0; }
    .cards-slick .slick-next { right: 0; }

    .footer-top { padding: 40px 0; }
    .footer-brands .module-title { margin-bottom: 20px; }
    .footer-layout { flex-wrap: wrap; }
    .footer-layout .cell { width: 100%; }
    .footer-layout .cell-company { margin-bottom: 20px; }
    .footer-layout::before { display: none; }
    .footer-info { flex-wrap: wrap; justify-content: center;  }
    .footer-info .cell-copy { flex-grow: 1; width: 100%; text-align: center; }
    .footer-bottom { padding: 10px 0; }

    .module-0-layout { flex-wrap: wrap; }
    .module-0-layout .col-content { order: 3; width: 100%; }
    .module-0-layout .col-spacer { order: 2; width: 100%; height: 40px; }
    .module-0-layout .col-form { order: 1; width: 100%; }

    .layout-static { flex-wrap: wrap; }
    .layout-static .col-main { width: 100%; }
    .layout-static .col-spacer { height: 20px; width: 100%; }
    .layout-static .col-sidebar { width: 100%;  }

    .module-3-layout { flex-wrap: wrap; }
    .module-3-layout main { width: 100%; margin-bottom: 20px;  }
    .module-3-layout aside  { width: 100%;  }

    .row-login-form {}
    .row-login-form .col-login-form { margin-bottom: 30px; }

    .regplate .the-plate { width: 100%; }

    ul.row-procedures {}
    .row-procedures-inner .row-procedures > li.col-6 { width: 100%; }

    .get-ready { padding: 15px; }
    .reg-check-form { gap: 0 15px; }
    .reg-check-form .regplate { transform: scale(0.82); }
    .reg-check-form .col-form { display: block; width: 300px; }
    .reg-check-form .col-actions .btn { transform: translateX(-19px); }

    .steps-layout-wrapper { padding: 20px 0; }
    .steps-layout { flex-wrap: wrap; }
    .steps-layout .col-main { width: 100%; }
    .steps-layout .col-spacer { width: 100%; height: 20px;  }
    .steps-layout .col-aside { width: 100%; }

    .photo-requirements { gap: 0 15px; flex-wrap: wrap; justify-content: center;  }
    .photo-requirements > li { width: 44%; text-align: center; }
    .photo-requirements figure img { height: 40px; }
    .photo-requirements figcaption { padding: 6px; font-size: 10px; }

    .payment-options { flex-wrap: wrap; }
    .payment-options > li.item { width: 100%; }
    .payment-options var { width: 22px; height: 22px; }
    .payment-options dl { padding: 12px; }
    .payment-options dl dt .heading.h4 { font-size: 15px; }
    .payment-options dl dd hr { margin: 8px 0; }

    .account-layout-wrapper  { padding: 20px 0; }
    .account-layout { flex-wrap: wrap; }
    .account-layout .col-main { order: 1; width: 100%;   }
    .account-layout .col-spacer { order: 2; width: 100%; height: 20px;  }
    .account-layout .col-sidebar { order: 3; width: 100%; }






} /* @media -----------------------------------| width < 992px |-------------------------------------------*/

/* SM */ @media (max-width: 767.98px) {

    .module {
        --module-padding: 30px; 
    }

    .header-top-wrapper { display: none; }
    .header-actions { display: none; }

    .page-heading { margin-bottom: 20px; }

    .slick-brands .brand-logo img { max-height: 40px;  max-width:100px; }
    .slick-brands .brand-logo-mobioffice img { max-width:100px; }

    .row-footer-company { flex-wrap: nowrap;  }
    .row-footer-company .col-google-badge { width: 210px; flex-shrink: 0;  }
    .row-footer-company .col-company-logo { width: auto;  flex-grow: 1; flex-shrink: 1; flex-basis: 0%;  }
    
    .row-footernav {}
    .row-footernav > [class*="col-"] { width: 50%; }

    .footer-info .cell {}
    .footer-info .cell-menu { order: 1; }
    .footer-info .cell-menu ul { display: flex; justify-content: center;  flex-wrap: wrap;  }
    .footer-info .cell-menu ul > li { width: 50%; text-align: center;  }
    .footer-info .cell-menu ul > li a { display: block; padding: 2px 12px; }
    .footer-info .cell-menu ul li:not(:last-child)::after { display: none; }
    .footer-info .cell-spacer { order: 2; height: 10px; }
    .footer-info .cell-copy { order: 3; }
    .footer-info .cell-lang { order: 4; display: none; }

    .footer-brands { padding: 30px 0; }
    dl.footer-links dt { font-size: 18px; }

    .wapp-popup { right: 15px; bottom: 15px; transform: scale(0.8); transform-origin: bottom right; }

    dl.faqz dt { font-size: 16px; }
    .icard .heading .icon em { width: 32px; height: 32px; font-size:18px; }
    .icard .heading .label { font-size: 16px; }

    #home_transfer_search { --button-font-size: 18px; --button-height: 56px; }
    .block-highlight { padding: 30px; }
    ul.feature-list > li .icon { width: 32px; }
    ul.feature-list > li { font-size: 15px; }

    .module-actions { padding-top: 30px; }
    
    ul.vehicle-choice a.href { padding: 12px; }
    ul.vehicle-choice a.href .icon img { width: 46px; max-width: 50px; max-height: 32px; }

    .btn-modal-close { width: 24px; height: 24px; font-size: 16px; }
    .custom-modal header .btn-modal-close { transform: translateX(4px); }

    .component-heading .leading { font-size: 15px; }
    .module-0-layout .component-heading { margin-bottom: 30px; }

    .checktoggle {}
    .checktoggle .label-left { font-size: 13px; margin-right: 8px; }
    .checktoggle .label-right { font-size: 13px; margin-left: 8px; }
    .checktoggle .label-body { width: 44px; height: 26px }
    .checktoggle .label-dot { width: 21px; height: 21px; }
    .checktoggle input[type="checkbox"]:checked ~ .label-dot { left: 19px; }

    @media screen {
        .table-vimport { display: block; }
        .table-vimport thead { display: none; }
        .table-vimport tbody { display: block;  }
        .table-vimport tbody > tr { display: flex; flex-wrap: wrap; }
        .table-vimport tbody > tr > td { display: block; padding: 8px; width: 50%; border:1px solid var(--color-blue-dark);  }
        .table-vimport tbody > tr > td::before {  display: block; content: attr(data-th); font-weight: 600; padding: 6px 6px; line-height: 1.1; color: var(--color-blue-dark);  }
        .table-vimport .vimput { display: block; }
        .table-vimport-2 .vimput .input-text { width: 100px; }

        .table-print-columns { display: block; }
        .table-print-columns tbody { display: block; }
        .table-print-columns tbody > tr  { display: flex; flex-wrap: wrap; }
        .table-print-columns tbody > tr > td { width: 100%; padding: 8px; }
        .table-print-columns .td-divider { display: none;  }

        .table-vimport-1 + .table-vimport-2 { margin-top: -3px; }
    } /* @media screen */
 
    .account-heading { font-size: 23px;    }

    .table-orders-responsive {}
    .table-orders-responsive thead { display: none; }
    .table-orders-responsive tbody { display: block; }
    .table-orders-responsive tbody > tr { display: flex; flex-wrap: wrap; border-bottom: 1px solid var(--color-grey); padding-top: 6px; padding-bottom: 6px; }
    .table-orders-responsive tbody > tr > td { display: block; padding: 8px 15px; width: 50%;  }
    .table-orders-responsive tbody > tr > td::before {  display: block; content: attr(data-th); font-weight: 500; font-size: 9px; text-transform: uppercase; padding: 0 0 5px 0; line-height: 1.1; color: var(--color-blue-dark);  }


    .account-heading-order { flex-wrap: wrap; }
    .account-heading-order .account-heading { width: 100%; margin-bottom: 5px; }
    .account-heading-order .order-date { width: 100%; margin-bottom: 15px; }
    ul.order-vehicle-list h6.subhead { font-size: 16px; }
    dl.card-customer dt { font-size: 15px; }

    .square-doc .cell-1 { font-size: 24px; }
    .square-doc .cell-2 { height: 22px; width: 22px; font-size: 13px; }
    .square-doc { width: 38px; height: 38px; }
    table.table-order-documents tbody td { font-size: 13px; }
    table.table-order-documents .td-icon { width: 58px; }
    table.table-order-documents .badge { font-size: 12px; font-weight: 400; }

    .uploadfile { flex-wrap: wrap; }
    .uploadfile .uitem { width: 100%; }
    .uploadfile .uitem-input { margin-bottom: 15px; }

    .table-responsive-files {}
    .table-responsive-files thead { display: none; }
    .table-responsive-files tbody { display: block; }
    .table-responsive-files tbody > tr { display: flex; flex-wrap: wrap; border: 1px solid var(--color-grey); padding-top: 6px; padding-bottom: 6px; margin-bottom: 15px; }
    .table-responsive-files tbody > tr > td { display: block; padding: 8px 15px; width: 50%; border: none;  }
    .table-responsive-files tbody > tr > td.td-document { width: 100%;  }
    .table-responsive-files tbody > tr > td::before {  display: block; content: attr(data-th); font-weight: 500; font-size: 9px; text-transform: uppercase; padding: 0 0 5px 0; line-height: 1.1; color: var(--color-blue-dark);  }
 
     .row-accpass {}
     .row-accpass .col-form-data { margin-bottom: 20px; }
     .row-accpass .col-form-help {}

     .block-sticker { flex-wrap: wrap; }
     .block-sticker > li.item-sticker { width: 62px; }
     .block-sticker > li.item-dgt {}
     .block-sticker > li.item-divider { margin-bottom: 15px; width: 100%; }
     .block-sticker > li.item-description { width: 100%; }

 
} /* @media -----------------------------------| width < 768px |-------------------------------------------*/

/* XS */ 
@media (max-width: 575.98px) and (orientation:landscape) {}
@media (max-width: 575.98px) { 

    .module {
        --module-padding: 20px; 
    }

    .header-bottom { padding: 8px 0; }
    .header-logo { width: 96px; }

    .footer-top { padding: 30px 0; }
    .row-footer-company { flex-wrap: wrap; }
    .row-footer-company .col-google-badge { display: none; width: 100%;  }
    .row-footer-company .col-company-logo  { width: 100%; }
    .company-logo .logo { width: 125px; }

    .row-footernav > [class*="col-"] { width: 100%; }
    dl.footer-links dt { font-size: 16px;   }
    .footer-info .cell-menu ul > li { width: 100%; }
    .footer-brands { padding: 20px 0; }
    .slick-brands .brand-logo img { max-height: 40px; max-width: 90px;  }

    ul.vehicle-types { gap: 0 6px; }
    ul.vehicle-types label { padding: 6px; }
    ul.vehicle-types label .type { height: 38px; max-width: 50px; margin-bottom: 10px;  }
    ul.vehicle-types label .label { font-size: 7px;  }

    .regplate .cell-help { display: none; }
    .regplate .the-label { font-size: 10px; }
    .regplate .cell-plate .input-text { font-size: 28px; }
    .regplate .cell-euro img { width: 20px; }

    .reg-check-form .col-form { display: block; width: 200px; }

    .form-import-actions .btn-xl .icon { display: none; }

    a.card-procedure { padding: 15px; }
    a.card-procedure .title .icon em { width: 36px; height: 36px;}
    a.card-procedure .title .label { font-size: 16px; }
    a.card-procedure .card-price { font-size: 15px; padding: 3px 10px; }

    .block-highlight { padding: 20px; }
    ul.feature-list > li .icon { width: 28px; }

    .cards-slick .slick-arrow { top: -24px; width: 32px; height: 32px; font-size: 18px; }

    .module-actions { padding-top: 25px; flex-wrap: wrap; flex-direction: column;   }
    .module-actions > .btn { margin-bottom: 10px; flex-grow: 1; width: 100%; }

    dl.faqz dt { padding: 8px 12px 8px 12px; font-size: 14px; }
    dl.faqz dd { padding: 0px 12px 12px 12px; }

    .fgrid { grid-template-columns: repeat(1, auto); grid-gap: 15px; }

    .account-heading { font-size: 21px; margin-bottom: 15px;    }
    .account-heading::after { margin-top: 5px; }

    #criteria {}
    #criteria li { flex-basis: 100%; }
 

} /* @media -----------------------------------| width < 576px |-------------------------------------------*/

/* XXS */ @media screen and (min-width: 320px) and (max-width: 767.98px) and (orientation: landscape) { }
@media (max-width: 319.98px) {  
 
 
} /* @media -----------------------------------| width < 320px |-------------------------------------------*/
/* ════════════════════════════════════════════╣     END    ╠════════════════════════════════════════════ */
/* ╔══════════════════════════════════════════════════════════════════════════════════════════════════════╗ */
/* ║                                 ¡ NO STYLES BELOW THIS LINE PLEASE !                                 ║ */
/* ╚══════════════════════════════════════════════════════════════════════════════════════════════════════╝ */