:root {
    --font-size-selectors: 16px;
    --light:#eee;
    --light-light:#eee;
    --light-dark:#ddd;
}

.nostyle {
    line-height: inherit;
    font-size: inherit;
    margin-bottom: 0;
    margin-top: 0;
    display: inherit;
    font-weight: inherit;
    color: #222;
    font-family: BlinkMacSystemFont, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
}

.fromPrice,.textCenter {
    text-align: center
}

.catContainer {
    min-height: 740px
}

.catContainer>.row {
    margin-right: 0;
}

.catContainer.loading {
    background: url(https://www.rental-center-crete.com/images/loading-new-2015.gif) 50% 120px no-repeat rgba(255,255,255,.85);
}

.bookthis,.fromPrice,.h2 span,.subtitle,ul.features li>span {
    text-transform: uppercase
}

.carlist,.filterBar.filterSticked {
    transition-duration: .5s;
    transition-timing-function: cubic-bezier(0,1,.5,1)
}

.groupContainer img.pic {
    width: 100%;
    max-width: 250px;
    height: 165px
}

.groupContainer img.pic.lzld {
    box-shadow: 0 0 1px rgba(0,0,0,.1)
}

.groupContainer img.pic.lzld.loaded {
    box-shadow: none
}

.similartext,.titlelink>b {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.titlelink>b.samplePrice {
    color: #222;
    font-size: 14px
}

.titlelink>b.samplePrice>i {
    color: #b91810;
    background: #eee;
    padding-left: 5px;
    padding-right: 5px;
    border-radius: 5px;
    font-style: normal
}

.fromPrice {
    font-size: 11px;
    line-height: 1.5em;
    margin-bottom: 10px;
    margin-top: -10px;
    position: relative;
    vertical-align: middle
}

.fromPrice b {
    font-size: 22px;
    color: var(--accent-2);
    display: inline-block;
    line-height: 20px;
    vertical-align: sub
}

.fromPrice sup {
    font-size: 12px
}

.fromPrice.inCar {
    float: left;
    width: 100%;
    margin: 10px 0 20px;
    padding: 10px 0;
    font-size: 20px;
    font-weight: 300;
    text-transform: lowercase;
    color: #555;
    font-weight: 600;
}

.fromPrice.inCar b {
    font-size: 38px;
    font-family: var(--special-font-family);
}

.fromPrice.inCar b sup {
    font-size: 22px;
    font-family: var(--special-font-family);
}

.aspect-ratio.mainCarImg {
    --light-light: #fff;
    --aspect-ratio: 16/10.573;
    position: relative;
    height: 0;
    padding-bottom: calc(100%/(var(--aspect-ratio)));
    background: url(https://www.rental-center-crete.com/images/carPlaceholder3.png) 50% 50% var(--light-light) no-repeat;
    border-radius: 5px
}

.aspect-ration.mainCarImg>* {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover
}

@media only screen and (min-width: 48em) {
    .modelSelector>div.className,.modelSelector>div.groupName {
        max-width:min-content
    }
}

.diesel li.attrs.fuelpolicy,.hybrid li.attrs.fuelpolicy {
    font-weight: 700;
    font-size: 12px
}

.barwithbuttons>div,.bookthis,.groupTitle,.message4allin,.rating,.rating>b,.techs li,a.review,a.review>b {
    text-align: center
}

#overlay,.overlay {
    position: fixed;
    width: 100%;
    left: 0;
    top: 0;
    display: none;
    z-index: 400;
    background: rgba(0,0,0,.55)
}

.carsActive {
    z-index: 510;
    background: #fff;
    border-radius: 3px;
    -webkit-transition: all .5s ease-out;
    transition: all .5s ease-out
}

.bookthis,.miniQuote,.miniQuote.show,a.review,a.review>* {
    transition: all .3s ease-in-out
}

@media screen and (max-width: 500px) {
    .card {
        flex:0 1 100%
    }
}

.h2 span,
.model .h2:after{
    display: block;
    font-weight: 500;
    color: #444;
    text-transform: capitalize;
    font-size: 50%
}
.model .h2:after{
    content:attr(data-group-label); 
}

.h2 {
    color: #b71c1b;
    color: var(--accent-2);
}

p.description {
    /* padding: 0; */
    /* margin: 20px 0 0; */
    /* text-align: justify; */
    /* font-size: 16px; */
    /* line-height: 1.6em; */
    /* color: #555; */
    margin-top: 20px;
}

.features h3 {
    margin-bottom: 0;
    font-size: 16px;
    font-family: var(--special-font-family);
    font-weight: 500;
    color: var(--accent-2-dark);
}

blockquote {
    font-size: 2rem;
    color: #fff;
    border-left: 1rem solid rgba(0,0,0,.2)
}

blockquote>i {
    color: #fff;
    opacity: .2
}

.lastminute ul,.lastminute ul li,.rating>b,.similarCard,a.review {
    border-radius: 5px
}

.priceLastminute {
    font-size: 2.5rem;
    color: #b71c1b;
    color: var(--secondary);
    text-align: center;
    font-weight: 700
}

.price,.rating>span,.startdate {
    font-weight: 700
}

.carGroup,.rating>b,.startdate,.stationPup {
    display: block
}

.rating>b {
    padding: 5px 10px;
    background: #9ccc65;
    color: #fff;
    font-size: 2rem
}

.lastminute h3,.similar .h3 {
    text-align: center;
    width: 100%;
    margin-bottom: 2.8rem;
    line-height: 1.3;
    font-weight: 400
}

.lastminute ul {
    padding: 0;
    margin: 0 auto;
    width: 100%;
    max-width: 800px;
    overflow: hidden;
    display: flex;
    flex-wrap: wrap
}

.lastminute ul li {
    background: #fff;
    padding: 10px;
    width: calc(100% - 10px);
    margin: 5px;
    position: relative;
    box-shadow: 1px 1px 3px rgba(0,0,0,.05);
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap
}

.lastminute ul li>div {
    flex: 1 1 auto
}

.lastminute a {
    color: #b71c1b;
    color: var(--secondary)
}

a.review,a.review>* {
    text-decoration: none
}

.message4allin {
    font-size: 1.4rem;
    width: 100%;
    padding: 10px
}

.bookthis.notavailableBtn {
    background: 0 0;
    color: #b71c1b;
    color: var(--secondary);
    font-size: 1.3rem;
    cursor: text;
    pointer-events: none
}

a.review {
    display: block;
    float: left;
    width: 100%;
    height: auto;
    line-height: 2rem;
    padding: 13px 0;
    cursor: pointer;
    font-size: 13px;
    min-height: 48px;
    color: #558b2f;
    background: #fff;
    border: 1px solid #558b2f;
    color: var(--green);
    border: 1px solid var(--green);
    border-radius: 0;
    border-right: 0;
    border-left: 0;
    display: none
}

a.review:hover {
    background: #c4e1a3
}

a.review>span>b {
    font-weight: 400
}

ul.features {
    gap: 0;
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    border-radius: 0;
    overflow: hidden;
    width: 100%;
    float: left;
}

ul.features li {
    display: none
}

ul.features li.showOnMob.carModel {
    min-width: 100%
}

ul.features li.showOnMob {
    display: block
}

span.toggleFeatures {
    min-width: 100%;
    min-height: 56px;
    max-height: 56px;
    margin-top: 8px;
    right: 0;
    order: 9;
    border-color: transparent;
    border-radius: 1rem;
    background: #eee;
    border-color: transparent;
    /* box-shadow: inset 0 0 0px 2px var(--brand-2-light); */
}

.ulOpen span.toggleFeatures {
    display: flex
}

span.toggleFeatures:active,span.toggleFeatures:focus {
    box-shadow: inset 0 0 2px 1px #4394fd
}

span.toggleFeatures:after {
    display: inline-block;
    content: ' ';
    width: 100%;
    height: 100%;
    background: #fff url(/images/svg/angle-down.png) calc(100% - 5px) 50% no-repeat;
    background: var(--angle-bottom);
    background-size: 24px 24px;
    background-position: 50% 50%;
    background-repeat: no-repeat;
    transition: transform .3s ease-in-out;
    filter: var(--color-to-brand-2);
}

ul.features.ulOpen span.toggleFeatures:after {
    transform: scaleY(-1)
}
@media only screen and (min-width: 616px) and (max-width:767px) {
    span.toggleFeatures {
        flex-grow:100
    }
}

.ulOpen span.toggleFeatures {
    display: flex
}

span.toggleFeatures:active,span.toggleFeatures:focus {
    box-shadow: inset 0 0 2px 1px #4394fd
}

span.toggleFeatures:after {
    display: inline-block;
    content: ' ';
    width: 100%;
    height: 100%;
    background: var(--angle-bottom);
    background-size: 24px 24px;
    background-position: 50% 50%;
    background-repeat: no-repeat;
    transition: transform .3s ease-in-out
}

ul.features.ulOpen span.toggleFeatures:after {
    transform: scaleY(-1)
}

ul.features.ulOpen li {
    display: block
}

.lastminute ul,.lastminute ul li,.rating>b,.similarCard,a.review {
    border-radius: 5px
}

ul.features li {
    padding: 10px 5px;
    margin: 0;
    font-size: 16px;
    border-top: 1px solid var(--light-light);
    flex: 1 1 auto;
    border-radius: 0;
    padding: 1rem 1.5rem;
    order: 1;
    font-family: var(--special-font-family);
    font-weight: 500;
    color: var(--accent-2-dark);
}

ul.features li:first-child {
    flex: 1 1 100%;
    border-top: 0
}

ul.features li>span {
    display: block;
    font-size: 16px;
    font-weight: 500;
    line-height: 1em;
    margin-bottom: 4px;
    font-family: var(--special-font-family);
    color: var(--dark-1);
    text-transform: initial;
    opacity: .9;
}

li.hidden {
    display: none!important
}

.btnsContainer {
    width: 100%;
    margin: 0;
    float: left
}

.btnsContainer button {
    display: inline-block;
    width: 100%;
    margin: 0;
    float: left;
    font-size: 11px;
    /* background: var(--light); */
    /* border-color: var(--light); */
    /* color: #666; */
    position: relative;
    padding-left: 38px;
    font-family: var(--special-font-family);
    /* letter-spacing: 1px; */
    font-size: 16px;
}

.btnsContainer button i.fa0 {
    width: 38px;
    height: 18px;
    padding-left: 1rem;
    border-left: 1px solid var(--accent-2-dark);
    margin-left: 1rem;
    /* opacity: .4; */
    transition: all .4s ease-in-out;
    filter: var(--color-to-accent-2-dark);
}
.btnsContainer button:hover i.fa0{
    filter: var(--color-to-brand-1);
    border-color: var(--brand-1-dark);
}
.fa0-image {
    background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iaXNvLTg4NTktMSI/Pg0KPCEtLSBHZW5lcmF0b3I6IEFkb2JlIElsbHVzdHJhdG9yIDE5LjAuMCwgU1ZHIEV4cG9ydCBQbHVnLUluIC4gU1ZHIFZlcnNpb246IDYuMDAgQnVpbGQgMCkgIC0tPg0KPHN2ZyB2ZXJzaW9uPSIxLjEiIGlkPSJDYXBhXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgNTEyIDUxMiIgc3R5bGU9ImVuYWJsZS1iYWNrZ3JvdW5kOm5ldyAwIDAgNTEyIDUxMjsiIHhtbDpzcGFjZT0icHJlc2VydmUiPg0KPGc+DQoJPGc+DQoJCTxnPg0KCQkJPHBhdGggZD0iTTQ2NCwwSDQ4QzIxLjQ5LDAsMCwyMS40OSwwLDQ4djQxNmMwLDI2LjUxLDIxLjQ5LDQ4LDQ4LDQ4aDQxNmMyNi41MSwwLDQ4LTIxLjQ5LDQ4LTQ4VjQ4QzUxMiwyMS40OSw0OTAuNTEsMCw0NjQsMHoNCgkJCQkgTTQ4MCwzMTMuNDRsLTY4LjY0LTY4LjY0Yy02LjI0MS02LjIwNC0xNi4zMTktNi4yMDQtMjIuNTYsMEwzMDQsMzI5LjQ0TDIwMy4zNiwyMjguOGMtNi4yNDEtNi4yMDQtMTYuMzE5LTYuMjA0LTIyLjU2LDANCgkJCQlMMzIsMzc3LjQ0VjQ4YzAtOC44MzcsNy4xNjMtMTYsMTYtMTZoNDE2YzguODM3LDAsMTYsNy4xNjMsMTYsMTZWMzEzLjQ0eiIvPg0KCQkJPHBhdGggZD0iTTI4OCw4MGMtMzUuMzQ2LDAtNjQsMjguNjU0LTY0LDY0YzAsMzUuMzQ2LDI4LjY1NCw2NCw2NCw2NGMzNS4zNDYsMCw2NC0yOC42NTQsNjQtNjRDMzUyLDEwOC42NTQsMzIzLjM0Niw4MCwyODgsODB6DQoJCQkJIE0yODgsMTc2Yy0xNy42NzMsMC0zMi0xNC4zMjctMzItMzJzMTQuMzI3LTMyLDMyLTMyYzE3LjY3MywwLDMyLDE0LjMyNywzMiwzMlMzMDUuNjczLDE3NiwyODgsMTc2eiIvPg0KCQk8L2c+DQoJPC9nPg0KPC9nPg0KPGc+DQo8L2c+DQo8Zz4NCjwvZz4NCjxnPg0KPC9nPg0KPGc+DQo8L2c+DQo8Zz4NCjwvZz4NCjxnPg0KPC9nPg0KPGc+DQo8L2c+DQo8Zz4NCjwvZz4NCjxnPg0KPC9nPg0KPGc+DQo8L2c+DQo8Zz4NCjwvZz4NCjxnPg0KPC9nPg0KPGc+DQo8L2c+DQo8Zz4NCjwvZz4NCjxnPg0KPC9nPg0KPC9zdmc+DQo=)
}

.btnsContainer button:focus,.btnsContainer button:hover {
    /* color: #000; */
    background: var(--light-dark);
    border-color: var(--light-dark);
}

.btnsContainer button.video {
    margin: 10px 0 10px 5px
}

a.review>b {
    font-size: 24px;
    vertical-align: sub
}

.carimage, .carimage2025, iframe {
    display: none;
    opacity: 0;
    transition: all .2s ease-in-out;
    border: none;
    width: 100%;
    --light:#fff;
}

.carimage, .carimage2025 {
    width: 100%
}

.carimage.show, .carimage2025.show, iframe.show {
    display: block;
    opacity: 1;
    aspect-ratio: 800 / 529;
}

.bookthiscar {
    margin: 10px 0 10px;
    width: 100%;
    min-height: auto;
    white-space: normal;
    height: auto;
    line-height: 1em;
    font-family: var(--special-font-family);
    background: var(--accent-2);
    border-color: var(--accent-2);
    font-size: 16px;
}
.bookthiscar:hover{
    background: var(--accent-2-dark);
    border-color: var(--accent-2-dark);    
}

.bookthiscar b {
    display: block;
    font-size: 36px;
    line-height: 40px
}

.bookthiscar b sup {
    font-size: 55%
}

.carContainer {
    order: 1
}

.carimage.show.hidden-xs, .carimage2025.show.hidden-xs, .mainCarImg.show.hidden-xs {
    display: none!important
}

@media only screen and (min-width: 48em) {
    .carimage, .carimage2025 {
        width:100%;
        max-width: 100%;
        margin-left: 0;
        aspect-ratio: 800 / 529;
    }

    .bookthiscar {
        margin: 0 0 10px
    }

    .lastminute ul li {
        width: calc(50% - 10px)
    }

    .btnsContainer {
        display: block
    }
}

@media only screen and (min-width: 64em) {
    .filterContainer.nav-container-sticky {
        position:fixed;
        right: 0;
        height: auto;
        padding-bottom: 10px;
        border-bottom-left-radius: 5px
    }

    span.toggleFeatures {
        display: none
    }

    ul.features li {
        width: auto
    }

    ul.features li,ul.features.ulOpen li {
        display: block
    }

    p.description {
        /* padding: 10px 20px; */
        /* border-radius: 5px; */
        /* margin-right: 50px; */
        /* margin-top: 0; */
        font-size: 16px;
        text-align: left;
    }

    .carContainer {
        order: 0
    }

    .carimage.show.hidden-xs, .carimage2025.show.hidden-xs, .mainCarImg.show.hidden-xs {
        display: block!important
    }

    .h2 {
        margin-bottom: 2rem
    }

    .carimage.show.hidden-lg, .carimage2025.show.hidden-lg, .mainCarImg.show.hidden-lg {
        display: none
    }
}

.modelSelectorContainer {
    display: none;
    padding: 1rem;
    display: block;
    transition: all .2s ease-in-out;
}

.whichClass,.whichGroup {
    color: #fff
}

.whichClass.showThem,.whichGroup.showThem {
    color: #222
}

.carimage.notLoaded, .carimage2025.notLoaded {
    opacity: .4;
    -webkit-filter: blur(5px);
    filter: blur(5px);
    transition: all .2s ease-in-out
}

.carimage.loaded, .carimage2025.loaded {
    opacity: 1;
    -webkit-filter: none;
    filter: none;
    transition: all .2s ease-in-out
}

.modelSelector {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    gap: 1rem;
    align-items: stretch;
    justify-content: flex-start
}

.modelSelector>div {
    flex: 1 1 auto;
    text-align: left;
    background: #fff;
    border-radius: 5px;
    position: relative;
    padding: 1rem;
    display: flex;
    flex-direction: column;
    align-content: flex-start;
    justify-content: flex-start
}

.modelSelector>div>span {
    display: block;
    font-size: 14px;
    line-height: 1em;
    font-weight: 700;
    position: relative;
    overflow: hidden;
    z-index: 0;
    font-family: var(--special-font-family);
    margin-bottom: .5rem;
}

.modelSelector>div>select {
    border: 0;
    line-height: 1.6em;
    margin: 0;
    padding-left: 0;
    padding-bottom: 0;
    height: auto;
    width: auto;
    max-width: fit-content;
    font-size: 16px;
    font-size: var(--font-size-selectors);
    background-position: 100% 80%;
    padding-right: 2rem;
    font-family: var(--special-font-family);
    font-weight: 500;
}

.modelSelector>div>select:hover {
    text-decoration: underline
}

.modelName ul {
    display: none
}

.modelName ul.select {
    display: block
}

.modelName>ul {
    list-style-type: none;
    margin: 0;
    display: none;
    margin-top: .5rem;
    margin-bottom: 0
}

.modelName>ul>li {
    padding: 0;
    margin-right: 1rem;
    margin-bottom: 0;
    font-size: 16px;
    font-size: var(--font-size-selectors);
    cursor: pointer;
    transition: all .3s ease-in-out;
    visibility: hidden;
    font-family: var(--special-font-family);
    font-weight: 500;
}

.showThem .modelName>ul>li {
    visibility: visible
}

.modelName>ul.selected {
    display: flex;
    flex-direction: row;
    gap: 1rem;
    flex-wrap: wrap
}

.modelName>ul>li:hover {
    text-decoration: underline
}

.modelName>ul>li.selected {
    color: #b71c1b;
    color: var(--secondary);
    text-decoration: underline;
    text-underline-offset: 5px;
}

.pricelist ul,.pricelist ul li {
    padding: 0;
    margin: 0
}

.modelSelector>div:last-of-type:after {
    content: none
}

.modelSelector>div.groupName {
    margin-left: 0
}

.actualCar,.actualCat,.offerInCars {
    display: none
}

.actualCar.selected {
    display: block
}

.actualCar>.row {
    width: 100%
}

.actualCat {
    padding: 0
}

.actualCar .fa-caret-right {
    display: none
}

.offerInCars.active {
    display: block
}

.pricelist ul {
    list-style: none;
    width: 100%
}

li.offerInCars {
    display: none;
    text-align: center
}

li.offerInCars.active {
    display: block
}

span.carGroup,span.enddate,span.startdate,span.stationPup {
    font-weight: 700;
    display: inline-block;
}

span.circleIt {
    display: inline-block;
    padding: 2px 10px;
    border-radius: 5px;
    /* color: #b71d1b; */
    /* color: var(--secondary); */
    background: var(--light-light);
    color: #333!important;
    border: 0;
}

b.price,span.circleIt,span.stationPup>a {
    color: #b71d1b;
    color: var(--secondary);
}

b.price {
    background: url(/images/small-loading.gif) 50% 50% no-repeat var(--light-light);
    min-width: 40px;
    color: #b71d1b;
    color: var(--accent-2);
    font-size: 22px;
    line-height: 2em;
    vertical-align: text-top;
    border-radius: 5px;
    padding: 2px 5px;
    display: block;
    max-width: 150px;
    margin: 10px auto
}

b.price.done {
    background: var(--light-light);
    /* background: transparent; */
}

.notavailableprice b.price {
    background: 0 0;
    font-size: 14px;
    color: #b71d1b;
    color: var(--secondary);
    font-family: 'Roboto Condensed',Roboto,Arial,sans-serif;
    text-transform: uppercase;
    border: 1px solid;
    font-weight: 400
}

.pricelist>.container {
    box-shadow: 1px 2px 2px rgba(204,204,204,.3);
    padding: 20px 10px;
    border-radius: 5px;
    background: #fff;
    margin: 20px auto
}

.modelSelector select:active,.modelSelector select:focus {
    box-shadow: 0 0 2px 1px #4394fd;
    box-shadow: 0 0 2px 1px var(--tapfocus)
}

.aspect-ratio.mainCarImg {
    --aspect-ratio: 16/10.573;
    position: relative;
    height: 0;
    padding-bottom: calc(100%/(var(--aspect-ratio)));
    background: url(https://www.rental-center-crete.com/images/carPlaceholder3.png) 50% 50% var(--light-light) no-repeat;
    border-radius: 5px
}

.aspect-ratio.mainCarImg>* {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.mobCarContainer {
    display: flex;
    flex-direction: column;
    height: auto;
    justify-content: flex-start
}

.mobCarContainer h2.h2 {
    order: -4
}

.mobCarContainer .mainCarImg {
    order: -3
}

.mobCarContainer .bookthiscar {
    order: -2
}

.mobCarContainer .fromPrice.inCar {
    order: -1
}

.mobCarContainer .btnsContainer {
    order: -1
}

@media only screen and (min-width: 48em) {
    .mainCarImg.hidden-xs {
        display:none
    }

    a.review {
        display: none
    }
}

@media only screen and (min-width: 64em) {
    .mainCarImg.hidden-xs {
        display:block
    }
}

@media only screen and (min-width: 64em) {
    .hidden-lg {
        display:none
    }
}

p.description i.fa {
    display: inline-block;
    color: #eee;
    transform-origin: bottom left;
    -ms-transform: skew(-15deg,0deg);
    -webkit-transform: skew(-15eg,0deg);
    transform: skew(-15deg,0deg);
    margin-right: 30px;
    float: left;
    display: none
}

p.description i.fa:before {
    content: ' ';
    width: 48px;
    height: 38px;
    display: inline-block;
    background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iaXNvLTg4NTktMSI/Pg0KPCEtLSBHZW5lcmF0b3I6IEFkb2JlIElsbHVzdHJhdG9yIDE2LjAuMCwgU1ZHIEV4cG9ydCBQbHVnLUluIC4gU1ZHIFZlcnNpb246IDYuMDAgQnVpbGQgMCkgIC0tPg0KPCFET0NUWVBFIHN2ZyBQVUJMSUMgIi0vL1czQy8vRFREIFNWRyAxLjEvL0VOIiAiaHR0cDovL3d3dy53My5vcmcvR3JhcGhpY3MvU1ZHLzEuMS9EVEQvc3ZnMTEuZHRkIj4NCjxzdmcgdmVyc2lvbj0iMS4xIiBpZD0iQ2FwYV8xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCINCgkgd2lkdGg9IjQ3NS4wODJweCIgaGVpZ2h0PSI0NzUuMDgxcHgiIHZpZXdCb3g9IjAgMCA0NzUuMDgyIDQ3NS4wODEiIHN0eWxlPSJlbmFibGUtYmFja2dyb3VuZDpuZXcgMCAwIDQ3NS4wODIgNDc1LjA4MTsiDQoJIHhtbDpzcGFjZT0icHJlc2VydmUiPg0KPGc+DQoJPGc+DQoJCTxwYXRoIGQ9Ik0xNjQuNDUsMjE5LjI3aC02My45NTRjLTcuNjE0LDAtMTQuMDg3LTIuNjY0LTE5LjQxNy03Ljk5NGMtNS4zMjctNS4zMy03Ljk5NC0xMS44MDEtNy45OTQtMTkuNDE3di05LjEzMg0KCQkJYzAtMjAuMTc3LDcuMTM5LTM3LjQwMSwyMS40MTYtNTEuNjc4YzE0LjI3Ni0xNC4yNzIsMzEuNTAzLTIxLjQxMSw1MS42NzgtMjEuNDExaDE4LjI3MWM0Ljk0OCwwLDkuMjI5LTEuODA5LDEyLjg0Ny01LjQyNA0KCQkJYzMuNjE2LTMuNjE3LDUuNDI0LTcuODk4LDUuNDI0LTEyLjg0N1Y1NC44MTljMC00Ljk0OC0xLjgwOS05LjIzMy01LjQyNC0xMi44NWMtMy42MTctMy42MTItNy44OTgtNS40MjQtMTIuODQ3LTUuNDI0aC0xOC4yNzENCgkJCWMtMTkuNzk3LDAtMzguNjg0LDMuODU4LTU2LjY3MywxMS41NjNjLTE3Ljk4Nyw3LjcxLTMzLjU0NSwxOC4xMzItNDYuNjgsMzEuMjY3Yy0xMy4xMzQsMTMuMTI5LTIzLjU1MywyOC42ODgtMzEuMjYyLDQ2LjY3Nw0KCQkJQzMuODU1LDE0NC4wMzksMCwxNjIuOTMxLDAsMTgyLjcyNnYyMDAuOTkxYzAsMTUuMjM1LDUuMzI3LDI4LjE3MSwxNS45ODYsMzguODM0YzEwLjY2LDEwLjY1NywyMy42MDYsMTUuOTg1LDM4LjgzMiwxNS45ODUNCgkJCWgxMDkuNjM5YzE1LjIyNSwwLDI4LjE2Ny01LjMyOCwzOC44MjgtMTUuOTg1YzEwLjY1Ny0xMC42NjMsMTUuOTg3LTIzLjU5OSwxNS45ODctMzguODM0VjI3NC4wODgNCgkJCWMwLTE1LjIzMi01LjMzLTI4LjE2OC0xNS45OTQtMzguODMyQzE5Mi42MjIsMjI0LjYsMTc5LjY3NSwyMTkuMjcsMTY0LjQ1LDIxOS4yN3oiLz4NCgkJPHBhdGggZD0iTTQ1OS4xMDMsMjM1LjI1NmMtMTAuNjU2LTEwLjY1Ni0yMy41OTktMTUuOTg2LTM4LjgyOC0xNS45ODZoLTYzLjk1M2MtNy42MSwwLTE0LjA4OS0yLjY2NC0xOS40MS03Ljk5NA0KCQkJYy01LjMzMi01LjMzLTcuOTk0LTExLjgwMS03Ljk5NC0xOS40MTd2LTkuMTMyYzAtMjAuMTc3LDcuMTM5LTM3LjQwMSwyMS40MDktNTEuNjc4YzE0LjI3MS0xNC4yNzIsMzEuNDk3LTIxLjQxMSw1MS42ODItMjEuNDExDQoJCQloMTguMjY3YzQuOTQ5LDAsOS4yMzMtMS44MDksMTIuODQ4LTUuNDI0YzMuNjEzLTMuNjE3LDUuNDI4LTcuODk4LDUuNDI4LTEyLjg0N1Y1NC44MTljMC00Ljk0OC0xLjgxNC05LjIzMy01LjQyOC0xMi44NQ0KCQkJYy0zLjYxNC0zLjYxMi03Ljg5OC01LjQyNC0xMi44NDgtNS40MjRoLTE4LjI2N2MtMTkuODA4LDAtMzguNjkxLDMuODU4LTU2LjY4NSwxMS41NjNjLTE3Ljk4NCw3LjcxLTMzLjUzNywxOC4xMzItNDYuNjcyLDMxLjI2Nw0KCQkJYy0xMy4xMzUsMTMuMTI5LTIzLjU1OSwyOC42ODgtMzEuMjY1LDQ2LjY3N2MtNy43MDcsMTcuOTg3LTExLjU2NywzNi44NzktMTEuNTY3LDU2LjY3NHYyMDAuOTkxDQoJCQljMCwxNS4yMzUsNS4zMzIsMjguMTcxLDE1Ljk4OCwzOC44MzRjMTAuNjU3LDEwLjY1NywyMy42LDE1Ljk4NSwzOC44MjgsMTUuOTg1aDEwOS42MzNjMTUuMjI5LDAsMjguMTcxLTUuMzI4LDM4LjgyNy0xNS45ODUNCgkJCWMxMC42NjQtMTAuNjYzLDE1Ljk4NS0yMy41OTksMTUuOTg1LTM4LjgzNFYyNzQuMDg4QzQ3NS4wODIsMjU4Ljg1NSw0NjkuNzYsMjQ1LjkyLDQ1OS4xMDMsMjM1LjI1NnoiLz4NCgk8L2c+DQo8L2c+DQo8Zz4NCjwvZz4NCjxnPg0KPC9nPg0KPGc+DQo8L2c+DQo8Zz4NCjwvZz4NCjxnPg0KPC9nPg0KPGc+DQo8L2c+DQo8Zz4NCjwvZz4NCjxnPg0KPC9nPg0KPGc+DQo8L2c+DQo8Zz4NCjwvZz4NCjxnPg0KPC9nPg0KPGc+DQo8L2c+DQo8Zz4NCjwvZz4NCjxnPg0KPC9nPg0KPGc+DQo8L2c+DQo8L3N2Zz4NCg==);
    background-size: 100%;
    background-position: 50% 50%;
    background-repeat: no-repeat;
    opacity: .1
}

select.whichGroup option[value=L1] {
    display: none
}

.modelToggler {
    display: none
}

@media only screen and (max-width: 1023px) {
    .modelToggler {
        display:inline-block;
        position: absolute;
        width: 100%;
        height: 100%;
        top: 0;
        right: 0;
        background: var(--angle-bottom);
        background-size: 18px 18px;
        z-index: 1;
        background-position: calc(100% - 10px) 25px;
        background-repeat: no-repeat
    }

    .modelToggler:active,.modelToggler:focus {
        box-shadow: inset 0 0 2px 1px #4394fd;
        box-shadow: inset 0 0 2px 1px var(--tapfocus)
    }

    .modelSelector {
        flex-wrap: wrap;
        gap: 1rem;
        --font-size-selectors: 16px
    }

    .modelSelector>div.modelName {
        width: 100%;
        min-width: 100%;
        padding-bottom: 0;
        overflow: hidden;
        position: relative
    }

    .modelSelector>div {
        max-width: calc(50% - .5rem);
        min-width: calc(50% - .5rem)
    }

    .modelSelector>div>select {
        min-width: 100%;
        max-width: 100%!important;
        text-overflow: ellipsis;
    }

    .modelName>ul.selected {
        flex-wrap: wrap;
        display: flex;
        width: calc(100% - 32px);
        padding-bottom: 1rem;
        flex-direction: column;
        justify-content: flex-start;
        max-height: 40px;
        margin-top: 10px
    }

    .modelName>ul>li {
        min-width: 100%;
        text-align: center;
        margin-right: 0;
        text-align: left;
        margin-top: 0;
        margin-bottom: 0;
        transition: 0s
    }

    .modelName>ul.selected::-webkit-scrollbar {
        -webkit-appearance: none;
        width: 7px;
        height: 7px
    }

    .modelName>ul.selected::-webkit-scrollbar-thumb {
        border-radius: 4px;
        background-color: rgb(0 0 0 / 25%)
    }

    .modelName>ul>li:before {
        width: 100%;
        height: 140px
    }

    .modelName>ul>li.selected {
        order: -1;
        max-height: fit-content;
        color: #222
    }

    .modelName>ul>li {
        max-height: 0;
        overflow: hidden
    }

    .modelName.modelOpened>ul.selected li {
        max-height: fit-content;
        overflow: visible
    }

    .modelName.modelOpened>ul.selected {
        max-height: 100vh
    }

    .modelName.modelOpened>ul>li.selected {
        order: revert;
        color: var(--secondary)
    }

    .modelName.modelOpened .modelToggler {
        transform: scaleY(-1);
        width: 48px;
        height: 62px;
        background-position: calc(100% - 10px) 18px
    }

    .isSingleModel .modelToggler {
        display: none
    }
}

@media only screen and (max-width: 767px) {
    .btnsContainer {
        display:none
    }
    .modelSelector>div>span{
        margin-bottom:0
    }
    .actualCat{
        margin-left:5px
    }
    .modelSelector{
        margin-left:5px
    }
}

.overlay {
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    width: 100%;
    z-index: 501;
    box-sizing: border-box;
    background: rgb(0 0 0 / 30%);
    -ms-filter: opacity(.6);
    -moz-opacity: .6;
    -o-opacity: .6;
    -webkit-transform: translate3d(0,0,0);
    -moz-transform: translate3d(0,0,0);
    -ms-transform: translate3d(0,0,0);
    -o-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0);
    display: none
}

.overlay.showOverlay {
    display: block
}

.lds-ellipsis {
    display: inline-block;
    position: relative;
    width: 100px;
    height: 100px;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -50px;
    margin-left: -50px;
}

.lds-ellipsis:after {
    display: block;
    content: ' ';
    background-image: url(/sw/new/rcc-128-white.png);
    width: 70px;
    height: 70px;
    background-position: 50%;
    background-size: cover;
    margin-top: 15px;
    margin-left: 15px;
    border-radius: 50%;
    z-index: 9999999;
    position: relative;
}

.lds-ellipsis > div {
  position: absolute;
  top: 0;
  left: 0;

  height: 100px;
  width: 100px;
  box-sizing: border-box;
  background: conic-gradient(
    from 90deg at 50% 50%,
    rgba(39, 174, 96, 0) 0deg,
    rgba(31, 144, 255, 0) 0.04deg,
    #fff 360deg
  );
  border-radius: 50%;
  animation: 1s rotateSpinner infinite linear;
}
.lds-ellipsis > div::before {
  content: " ";
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  height: 90px;
  width: 90px;
  /* background: #fff; */
  border-radius: 50%;
}
.lds-ellipsis > div::after {
  content: " ";
  position: absolute;
  right: -1px;
  top: 50%;
  transform: translateY(-50%);
  height: 8px;
  width: 8px;
  background: #fff;
  border-radius: 50%;
}
@keyframes rotateSpinner {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

.modal-window {
    position: fixed;
    background-color: rgba(0,0,0,.25);
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 999;
    visibility: hidden;
    opacity: 0;
    pointer-events: none;
    transition: all .3s;
    display: none
}

.modal-opened.modal-window {
    visibility: visible;
    opacity: 1;
    pointer-events: auto;
    display: block
}

.modal-window>div {
    max-width: calc(100% - 2rem);
    width: 1280px;
    max-height: 90dvh;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    padding: 0;
    background: #fff;
    overflow: hidden;
    overflow-y: auto;
    box-shadow: 0 0 20px 20px rgb(0 0 0 / 5%)
}

.modal-window iframe {
    border: 0;
    height: 100%;
    width: 100%;
    height: 100%;
    margin-bottom: -1rem;
    background-color: transparent;
    background-image: url(https://www.rental-center-crete.com/images/load_btn.gif);
    background-size: auto;
    background-position: 50% 50%!important;
    background-repeat: no-repeat;
    display: block;
    opacity: 1
}

.modal-close {
    background: rgb(255 255 255 / 50%);
    color: #222;
    line-height: 48px;
    position: fixed;
    right: 0;
    text-align: center;
    top: 0;
    width: 48px;
    height: 48px;
    text-decoration: none;
    border-radius: 0;
    border-bottom-left-radius: 1rem;
    cursor: pointer;
    font-weight: 700
}

.modal-close:hover {
    background: var(--light)
}

.modal-window>div {
    border-radius: 1rem;
    aspect-ratio: 4/3
}

.bookthis {
    font-family: var(--special-font-family);
    background: var(--accent-2);
    border-color: var(--accent-2);
    font-size: 16px;
}

.bookthis:hover{
    background: var(--accent-2-dark);
    border-color: var(--accent-2-dark);
}



/* PREV NEXT BUTTONS */
body:has(.modelName ul.selected li.selected:only-child) .nextModel,
body:has(.modelName ul.selected li.selected:only-child) .previousModel{
    display:none;
    /* HIDE WHEN SINGLE ONE */
}

.catContainer> .row > button{
    display:none;
}


.offerInCars:has(.notavailableBtn) b.price {
    background: 0 0;
    text-transform: uppercase;
    font-weight: 700;
    max-width: fit-content;
    font-size: 18px;
}
.offerInCars:has(.notavailableBtn) b.price:after{
    text-transform: uppercase;
    text-decoration:underline;
    content: 'sold out';
    
}
.offerInCars .notavailableBtn{
    display:none;
}

.mainCarImg:after {
    content: ' ';
    background: #fff;
    display: inline-block;
    position: absolute;
    top: 0;
    right: 0;
    width: 250px;
    height: 50px;
}

@media only screen and (max-width: 1023px) {
    .mainCarImg:after{
        width: 33%;
        height: 10%;
    }
}

html[lang=de] .offerInCars:has(.notavailableBtn) b.price:after {
    content: 'Nicht verfügbar';
}

html[lang=fr] .offerInCars:has(.notavailableBtn) b.price:after {
    content: 'non disponible';
}

html[lang=it] .offerInCars:has(.notavailableBtn) b.price:after {
    content: 'non disponibile';
}

html[lang=nl] .offerInCars:has(.notavailableBtn) b.price:after {
    content: 'Niet beschikbaar';
}

html[lang=cs] .offerInCars:has(.notavailableBtn) b.price:after {
    content: 'Není k dispozici';
}

html[lang=pl] .offerInCars:has(.notavailableBtn) b.price:after {
    content: 'niedostępny';
}

html[lang=ru] .offerInCars:has(.notavailableBtn) b.price:after {
    content: 'нет в наличии';
}

html[lang=el] .offerInCars:has(.notavailableBtn) b.price:after {
    content: 'Μη διαθέσιμο';
}


@media screen and (min-width: 1252px) {
    .catContainer > .row {
        position: relative;
        max-width: 112rem;
        margin-left: auto;
        margin-right: auto;
    }
    .catContainer> .row > button{
        position:absolute;
        top:calc( 50% - 50px);
        /* overflow:hidden; */
        text-indent:-9999px;
        width:48px;
        border-radius:50%;
        background-color: var(--light-light);
        border-color:var(--light-light);
        margin-left: -60px;
        left:0;
        display: flex;
        justify-content: center;
        align-items: center;
        align-content: center;
        flex-direction: column;
        font-size: 0px;
        cursor:pointer;
    }
    .catContainer> .row > button:after{
        content:' ';
        display: inline-block;
        background-image: var(--angle-bottom);
        background-repeat:no-repeat;
        background-size: 26px;
        background-position: 50%;
        transform: rotate(90deg);
        width: 26px;
        min-height: 26px;
        filter: var(--color-to-brand-1);
    }
    .catContainer> .row > button.nextModel:after{
        transform: rotate(-90deg);
    }
    .catContainer button.nextModel{
        margin-left: 0px;
        left: 100%;
        right: 0;
    }
    .catContainer> .row > button:hover{
        background-color: var(--light-dark);
        border-color:var(--light-dark);
    }
    .catContainer> .row > button:active{
        border-color: var(--brand-2-dark);
    }
    
    .catContainer > .row > button:before {
          text-indent: 0px;
          text-transform: none;
          font-family: var(--special-font-family);
          content: attr(data-tooltip);
          position:absolute;
          top:50%;
          width: fit-content;
          height: 48px;
          border-radius: 48px;
          background: var(--light-dark);
          color: var(--brand-1);
          text-align:center;
          display:none;
          /* display: inline-flex; */
          font-size: 14px;
          cursor:pointer;
          transform:translateY(-50%);
        
          /* left:0; */
          right:0px;
          padding: 24px 48px 10px 24px;

    }
    .catContainer> .row > button.nextModel:before{
          left:100%;
          margin-left: -48px;
          padding: 24px 24px 10px 48px;
        
    }
    .catContainer> .row > button:hover:before{
          display: inline-flex;
    }
}










@supports (appearance: base-select) {
    :root {
        --selectsAccents: var(--accent-2);
    }

    .modelSelectorContainer select{
        appearance: none;
        justify-content: space-between;
        align-items: center;
        cursor: pointer;
        background-position: 50% 50%!important;
        background-size: 100%;
        padding-left: 10px;
        padding-right: 0 !important;
        background-image: none;
        width: max-content!important;
        max-width: max-content!important;
        
        &::picker-icon {
            content: "";
            width: 20px;
            height: 20px;
            background-repeat:no-repeat;
            background-image: var(--angle-bottom);
            background-position: 50% 50%;
            background-size: 18px 18px;
        }

        &:open::picker-icon {
            rotate: 180deg;
        }

        &::picker(select) {
            padding: 0;
            margin-top: 15px;
            border: none;
            background: white;
            border-radius: 00px;
            font-weight: 400;
            opacity: 0;
            height: 0;
            overflow: clip;
            transition: 0s;
            transition-behavior: allow-discrete;
            scrollbar-color: var(--accent-2) transparent;
            scrollbar-color: var(--brand-1-light) #fff;

            border: 2px solid transparent;
            
            box-shadow:0 10px 10px 0px rgba(0,0,0,.1);

            
        }

        &:open::picker(select) {
            opacity: 1;
            height: calc-size(auto, size);
            overflow: auto;
            border-radius:1rem;
            margin-left:-1rem;
            border-color: var(--light-light);
            
            @media (min-width: 1024px) {
                min-width:300px;
            }
            @starting-style {
                opacity: 0;
                height: 0;
            }
        }

        option {
            padding: 8px 5px;
            cursor: pointer;
            transition-property: color, background;
            transition-duration: 0.2s;
            transition-timing-function: ease-out;
            color: #222;
            line-height: 24px;
            font-family: var(--special-font-family);
            font-weight: 500;
            
            &:where(:hover, :focus, :active) {
                background-color: var(--light);
            }

            &:checked {
                background-color: var(--accent-2);
                color: white;
                font-weight: 500;
            }

            &::checkmark {
                /* display: none; */
            }
        }
        @supports (appearance: base-select) {
            &, &::picker(select) {
                appearance: base-select;
            }
        }
    }
}







/* REMOVE AFTER UPDATE */

.trunc{
    max-height: 350px;
    overflow: hidden;
    position: relative;
    transition: none;
    transition: background .2s ease-in-out;
    margin-bottom: 1rem;
}
.trunc[data-height]{
    max-height: var(--data-height);
}
@media screen and (max-width: 767px) {
    .trunc[data-height-mob]{
        max-height: var(--data-height-mob);
    }
}
.trunc:after{
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 150px;
    background-image: linear-gradient(0deg, #fff 30%, transparent);
}

/* .trunc:has(.trunc--btn):hover:after{
    transition: all .5s linear;
} */

.trunc[open]{
   max-height: none!important;
   transition: background .2s ease-in-out;
   padding-bottom: 4rem;
}
.trunc[open]:after{
    height:0;
}
.trunc[open] button.trunc--btn{
    box-shadow:none;
    bottom: 1rem;
}
.trunc[open] button.trunc--btn > span{
    color: transparent;
    letter-spacing: -10px;
}
.trunc[open] button.trunc--btn > span:before{
    content: 'less';
    color: var(--accent-2);
    letter-spacing: 0px;
}


html:lang(fr) .trunc[open] button.trunc--btn > span:before{
    content: 'moins';
}
html:lang(de) .trunc[open] button.trunc--btn > span:before{
    content: 'weniger';
}
html:lang(it) .trunc[open] button.trunc--btn > span:before{
    content: 'meno';
}
html:lang(nl) .trunc[open] button.trunc--btn > span:before{
    content: 'minder';
}
html:lang(cz) .trunc[open] button.trunc--btn > span:before{
    content: 'méně';
}
html:lang(pl) .trunc[open] button.trunc--btn > span:before{
    content: 'mniej';
}
html:lang(el) .trunc[open] button.trunc--btn > span:before{
    content: 'λιγότερα';
}
html:lang(ru) .trunc[open] button.trunc--btn > span:before{
    content: 'меньше';
}


button.trunc--btn{
    position:absolute;
    bottom: 0;
    left: 0;
    z-index: 2;
    background: #fff;
    color: var(--accent-2);
    border-color: transparent;
    margin-left: auto;
    margin-right: auto;
    padding: 1rem;
    margin-left: 0rem;
    box-shadow: 0 0 10px 20px rgb(255 255 255 / 60%);
    margin-bottom: 0px;
    text-transform: initial;
    font-size: 16px;
    line-height: 1rem;
    display: flex;
    align-items: center;
    align-content: center;
    transition: 0s;
}
button.trunc--btn:before {
    display: inline-block;
    content: ' ';
    width: calc(100% - 2rem);
    position: absolute;
    bottom: 6px;
    border-top: 2px solid var(--accent-2);
}
button.trunc--btn > span {
    margin-left: 6px;
}
button.trunc--btn:after{
    display: inline-block;
    content: ' ';
    font-weight: 400;
    width: 21px;
    height: 11px;
    background-image: var(--angle-bottom);
    background-position: 50% 50%;
    background-repeat: no-repeat;
    background-size: cover;
    margin-left: 4px;
    filter: var(--color-to-accent-2);
}

button.trunc--btn:is(:hover,:active,:focus){
    background-color:var(--light);
}
@supports (mask-image: var(--angle-bottom) ){
    body button.trunc--btn:after{
        mask-image: var(--angle-bottom);
        mask-position: 50% 50%;
        mask-repeat: no-repeat;
        mask-size: cover;
        filter: none;
        background: var(--accent-2);
    }
}



/* KEEP AFTER UPDATE */
.trunc.description{
	max-height: 180px
}
.trunc[open].description{
    padding-bottom: 7rem;
 }