/* animation */
.anim03{ -webkit-transition: all 0.3s ease !important; -moz-transition: all 0.3s ease !important; -ms-transition: all 0.3s ease !important; -o-transition: all 0.3s ease !important; transition: all 0.3s ease !important; }

/* buttons */
.button{border-radius: 5px; padding: 15px 33px; background: none; border: 0; display: inline-block; font-size:18px; font-weight:900;}
.button2{border-radius: 20px; padding: 0 33px; background: none; border: 0; display: inline-block; font-size:14px; font-weight:900;display: inline-block;height: 46px;margin-top: 25px;}
.button3{border-radius: 20px; padding: 13px 39px; background: none; border: 0; display: inline-block; font-size:13px; font-weight:700;display: inline-block;margin-top: 35px;}
.button4{border-radius: 20px; padding: 0 33px; background: none; border: 0; display: inline-block; font-size:14px; font-weight:700;display: inline-block;margin-top: 25px;}
.buttonPrimary{ background-color: #0d0d0d; color: #fff !important; }
.buttonPrimary:hover{ background-color: #535353; }
.buttonSecondary{ background: rgb(215,23,46); background: linear-gradient(0deg, rgb(62 64 147) 0%, rgb(62 64 147) 100%); color: #fff !important;position:relative;z-index:1;transition: opacity .5s;}
.buttonSecondary:before{ content:"";position:absolute;top:0;left:0;bottom:0;right:0;background: rgb(13,13,13); background: linear-gradient(0deg, rgba(13,13,13,1) 0%, rgba(13,13,13,1) 100%); opacity:0;z-index:-1;transition: opacity .5s;border-radius:20px; }
.buttonSecondary:hover:before{ opacity:1;border-radius:20px;}
.buttonSecondary01{ background: rgb(227,227,227); background: linear-gradient(0deg, rgba(227,227,227,1) 0%, rgba(227,227,227,1) 100%); color: #000 ;position:relative;z-index:1;transition: opacity .5s;}
.buttonSecondary01:before{ content:"";position:absolute;top:0;left:0;bottom:0;right:0;background: rgb(215,23,46); background: linear-gradient(0deg, rgba(215,23,46,1) 0%, rgba(186,13,34,1) 100%); color:#fff !important; opacity:0;z-index:-1;transition: opacity .5s;border-radius:20px; }
.buttonSecondary01:hover { color:#fff ;}
.buttonSecondary01:hover:before{ opacity:1;border-radius:20px;}

/*datepicker*/
.ui-datepicker.elatus-datepicker {z-index:100 !important;}

/* sections */
section.reservation_form {margin:0 auto;}


/* RESERVATION FORM */
.reservation_form .reservation_form_wrap{ position:relative;width:100%;left:50%;transform:translateX(-50%);z-index:50;}
.reservation_form_wrap form:before {content:" ";position:absolute;width:25px;height:25px;border-radius:8px;left:65px;top:-8px;transform: rotate(45deg);background:#fff;z-index:100;}
.reservation_form_wrap .reservation_edit form:before {content:" ";position:absolute;width:25px;height:25px;border-radius:8px;left:60%;top:-8px;transform: rotate(45deg);background:#fff;z-index:100;}
.reservation_form_wrap form{ position:relative;background-color: #fff; border-radius: 18px; margin:10px 0 0 0;padding:30px 35px;box-shadow: 0 1px 40px rgba(0,0,0,0.1);}
.reservation_form_wrap .reservation-header {display:flex;justify-content: space-between}
.reservation_form_wrap .reservation-header a {color:#fff;font-size:18px;font-weight:700;}

.reservation_form_wrap h2{ font-size: 22px;margin:0 0 10px 20px;padding:0;font-weight:700;color:#fff;}
.reservation_form_wrap .buttonEdit {font-size: 12px;margin:0;padding:0 0 0 25px;display: block;}
.reservation_form_wrap .buttonEdit.disabled {pointer-events: none;cursor: text;}
.reservation_form_wrap .reservation_edit h2{ font-size: 22px;margin:0 0 10px 35px;padding:0;font-weight:700;color:#fff;}
.reservation_form_wrap .reservation_edit .reservation-header:first-child .buttonEdit {font-size: 12px;margin:0;padding:0;display: block;}
.selectize-control{ height: 46px; }
.selectize-control.single .selectize-input{ background: none; background-color: #f5f5f5 !important; border: 1px solid #f5f5f5; border-radius: 0; height: 46px; padding: 14px 15px; }

.pickupLocation .selectize-input { border-radius: 20px !important;z-index:10;transition: all .3s ease;}
.iconLocation .selectize-input { border-radius: 20px !important;line-height: normal;}
.dropoffTime .selectize-input { border-start-end-radius: 20px !important; border-end-end-radius: 20px !important;}
.reservationForm .form-control.iconDate {border-top-left-radius: 20px !important; border-bottom-left-radius: 20px !important;}
.iconTime .selectize-input { border-top-right-radius: 20px !important; border-bottom-right-radius: 20px !important;}
.selectize-dropdown.single{ border: 0; -webkit-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.1); -moz-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.1); box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.1); border-radius: 5px; }
.selectize-control.single .selectize-input{ padding: 14px 15px 14px 15px; background: #f5f5f5; transition:all .3s ease;}
.selectize-input.focus.input-active { border:1px solid rgb(62 64 147) !important; outline: 0; box-shadow:none !important;}
.form-inputGroup{ display: flex; flex-wrap: wrap; margin: 0 -1px; align-items: center;transition:all .3s ease; }
.form-inputCol{ width: 50%; padding: 0 1px; }
.reservationFormWrapper form label{ margin: 0 0 5px 0; font-size:12px; font-weight:400; }
.reservation-main .form-control.form-controlIcon {border:none;height:46px;border-radius: 0;font-size:13px;}
.reservationForm .button3[type="submit"]{ margin: 25px 0 0 0; display: block; width: 100%; height:46px;padding: 10px 25px;}
.reservation_form input::placeholder {color: rgb(62 64 147) !important;font-size:12px;font-weight:700;opacity: 1;}
.reservation_form input:-ms-input-placeholder {color: rgb(62 64 147);font-size:12px;font-weight:700;font-weight:700;}
.reservation_form input::-ms-input-placeholder {color: rgb(62 64 147);font-size:12px;font-weight:700;font-weight:700;}

.reservationForm .dropoff-icon {padding-left:0;transition: all .3s ease;cursor: pointer;white-space: nowrap;pointer-events: none;}
.reservationForm .dropoff-icon.inactive {padding-left:0;}
.reservationForm .dropoffWrapper {opacity:1;}
.reservationForm .dropoffWrapper.active {opacity:1;}

/* form */
form label{ color: rgba(0,0,0,0.67); font-size: 12px; font-weight: 400; margin: 0 0 5px 15px; }
.form-control{ height: 46px; -webkit-border-radius: 20px;-moz-border-radius: 20px;border-radius: 20px; border: 1px solid #f5f5f5; background-color: #f5f5f5; -webkit-transition: all 0.6s ease;-moz-transition: all 0.6s ease;-o-transition: all 0.6s ease;transition: all 0.6s ease; }
.form-control, .form-control:focus{ -webkit-box-shadow: none;-moz-box-shadow: none;box-shadow: none; }
.form-control:focus{ border-color: #D5162D; }
form label.error {color: #D5162D; font-size: 12px; font-weight: 400; margin: 0;}
form input[type=checkbox] + label.error {color: #D5162D; font-size: 12px; font-weight: 400; margin: 0 0 5px 0;display:block;}
.checkboxWrapper { position: relative; padding: 0 0 0 34px; font-size: 12px; font-weight: 400; margin: 0 0 12px 0; color: #626262; }
.checkboxWrapper input{ position: absolute; top: -2px; left: 5px; }
.checkboxWrapper input:before, .checkboxWrapper input:after { content: " "; display: block; position: absolute; top: -4px; left: -3px; width: 24px; height: 24px; background-color: #fff; border-radius: 20%;border:1px dashed #dedede; }
.checkboxWrapper input:after { opacity: 0; background: url("https://direct-jo.com/assets/website/images/icon-ok.svg") no-repeat center center / contain; -webkit-transform: scale(0.3);-ms-transform: scale(0.3);transform: scale(0.3); -webkit-transition: all 0.2s ease;-moz-transition: all 0.2s ease;-o-transition: all 0.2s ease;transition: all 0.2s ease;border:1px solid #dedede }
.checkboxWrapper input:checked:after, .addonsList-item.active .checkboxWrapper>input:after{ opacity: 1; -webkit-transform: scale(1);-ms-transform: scale(1);transform: scale(1); }


.radio-group__span {border: 1px solid #0b5c85;border-radius: 50%;cursor: pointer;display: block;height: 25px;position: absolute;width: 25px;top:0;left:0;}
.radio-group__span::after {content:" ";border-radius: 50%;display: block;height: 5px;width: 5px;position: absolute;top:9px;left: 9px;-webkit-transition: all .1s ease;transition: all .1s ease;}
.radio-group__radio {opacity:0;}
.radio-group__radio:focus + span {outline: none;box-shadow: 0 0px 8px #5e9ed6;}
.radio-group__radio:checked +span::after {content:" ";display: block;top:4px;left: 4px;position: absolute;width: 15px;height: 15px;background-color:#0b5c85;border-radius: 50%;}


/* form group focus */
.form-inputGroup.active {border: 1px solid #D5162D;}


/* aside reservation */
.aside-reservation{position:relative;padding:0;top:-25px;background: #fff;border-radius: 23px;display:none;border-radius: 20px;box-shadow: 0 0 20px rgba(0,0,0,0.1)}
.reservation-item.head {position:relative;padding:0 35px 25px 35px;margin-bottom:40px;box-shadow: 0 20px 20px -20px rgba(0,0,0,0.1);}
.reservation-item.head .vehicle-title {font-size:18px;font-weight:900;color:#d5162d;}
.reservation-item.head .vehicle-title span {font-size:13px;font-weight:350;color:#161616;}
.reservation-item.head .vehicle-imgWrap {width:100%;max-height:160px;display:block;overflow: hidden;padding:0;position: absolute;bottom: -120px;}
.reservation-item.head .vehicle-img {max-width:100%;}
.reservation-item .protection-type{position:relative;}
.reservation-item .protection-type:before {content:"";position:absolute;top:0;left:0;bottom:0;right:0;background:url(https://direct-jo.com/assets/website/images/icon-total-protection.svg) no-repeat left top 5px/15px;}
.reservation-item .addons-selected {position:relative;}
.reservation-item .addons-selected:before {content:"";position:absolute;top:0;left:0;bottom:0;right:0;background:url(https://direct-jo.com/assets/website/images/icon-addons-default.svg) no-repeat left top 5px/15px;}
.reservation-item {padding:15px 35px;position:relative;}
.reservation-item:last-child {border-bottom-right-radius: 23px;border-bottom-left-radius: 23px;}
.reservation-item .title {font-size:12px;position:relative;}
.reservation-item .title *:not(img):not(h4):not(span) {line-height:28px;padding-left:25px;}
.reservation-item h4 {font-size:13px;font-weight:900;color:#161616;}
.reservation-item .icon-departure {padding-left:25px;background:url(https://direct-jo.com/assets/website/images/icon-depart.svg) no-repeat left center/11px;}
.reservation-item .icon-arrival {padding-left:25px;background:url(https://direct-jo.com/assets/website/images/icon-arrival.svg) no-repeat left center/11px;}
.reservation-item .title > img {position:absolute;width:20px;height:20px;left:0;top:-4px;}
.reservation-item.item-total .price {font-size:12px;font-weight:500;color:#161616;}
.reservation-item.item-total .price span {font-size:22px;font-weight:900;color:#d7172e;}
.reservation-item.item-total .old-price {font-size:12px;color:grey;padding-right:40px;}
.reservation-item.item-total .currency {font-size:12px;padding:0 5px;color:#0098dc;}
.reservation-item.item-total .button4 {padding:15px 46px;}
.reservation-item.total-details {font-size:13px;display:none;}
.aside-reservation-mobile .reservation-item.head .vehicle-img {padding:0;max-width:320px;}


@media (min-width : 480px) {
    /*reservation form*/
    .reservation_form_wrap h2{ white-space: nowrap;}
}

@media (min-width : 640px) {
    /* reservation form */
    .royalImgWrapper {top: -175px;right: 0;max-width:300px;}
}

@media (min-width : 768px) {
    /* DRIVER INFO */
    .booking-driver-info .checkboxWrapper + .checkboxWrapper {margin-left:15px;}
    .booking-driver-info .payment-options {flex-direction:row;white-space: nowrap; flex-wrap: wrap;}
    .booking-driver-info .payment-options .checkboxGroup {margin:0;display:block;}

    /* reservation form */
    .pickupLocation .selectize-input { width:207%; z-index:10; width:100%; border-radius:unset !important; border-end-start-radius: 20px !important; border-start-start-radius: 20px !important;}
    .iconLocation .selectize-input {  border-radius:unset !important; border-start-end-radius: 20px !important; border-end-end-radius: 20px !important;}
    .iconTime .selectize-input { border-radius: unset !important;}
    .reservationForm .form-control.dropoff.iconDate { border-radius:unset !important;}
    .reservationForm .dropoffWrapper {opacity:1;}
    .reservationForm .dropoff-icon:after {background: url(https://direct-jo.com/assets/website/images/icon_preuzimanje_info.svg) no-repeat left 15px top 8px/25px;}
    .reservationForm .dropoff-icon {pointer-events: initial;padding-left:40px;}
}

@media (min-width : 992px) {
    /* reservation form */
    .reservation_form_wrap h2{ font-size: 22px;padding:0;font-weight:700;color:#fff;}
    .reservation_form_wrap .reservation_edit form:before {content:" ";position:absolute;width:25px;height:25px;border-radius:8px;left:370px;top:-8px;transform: rotate(45deg);background:#fff;z-index:100;}
    .reservationForm .form-control.pickup.iconDate { border-radius:unset !important; border-top-left-radius: 20px !important; border-bottom-left-radius: 20px !important; }
    .reservationForm .form-control.iconDate {border-radius: unset !important;}


    /* vehicle details */
    .vehicle-detailsImgWrapper {max-height:230px;height:230px;width:100%;overflow:hidden;position:absolute;top:-70px;left:0;}
    .vehicle-detailsWrapper .contentWrapper-right .items-list {column-count: 2;display:block;}

    /* insurrance */
    .booking-vehicle-insurrance .finish {font-size:16px;display:flex;align-items:center;justify-content:flex-end;margin-top:60px;flex-direction:row;}
    .booking-vehicle-insurrance .finish h3 {font-size:18px;margin:0;}
    .booking-vehicle-insurrance .finish a {margin:0 0 0 60px;min-width:260px;text-align: center;}
    .booking-vehicle-insurrance .finish > .button4 {padding:15px 46px;}

    .insurrance-packages {width:64%;}
    .insurrance .smaller-title {font-size:16px;font-weight:900;white-space: nowrap;padding:0 30px 0 60px;min-height:54px;}
    .insurrance-item.icon:before {content:"";position:absolute;left:20px;top:20px;width:20px;height:20px;background:url(https://direct-jo.com/assets/website/images/icon-info.svg) no-repeat left center/20px;filter:brightness(0);opacity:.2;}


    /* aside reservation */
    .aside-reservation {display:block;}
    .aside-reservation-mobile {display:none;padding-right:25px;}
    .reservation-item {padding:0 25px 35px 25px;position:relative;}
    .reservation-item.bg_blue:after {content: "";position: absolute;bottom:15px;left: 25px;width: 88%;height: 1px;box-shadow: inset 1px 0 20px 0 rgba(0,0,0,0.07);}
    .reservation-item.head {position:relative;padding:15px 35px 95px 35px;}
    .reservation-item .old-price {padding-right:initial;}
    .reservation-item.total-details {display:block;}
    .reservation-item:last-child {padding-bottom:25px;}
}


@media (min-width : 1200px){

    /*menu */
    .mainMenuNav .logo:before {content:"";position:absolute;left:50px;top:13px;display:block;background: url(../png/logo-2.png) no-repeat left center/contain; width:260px;height:60px;}
    .mainMenu > li + li { margin-left:40px; }

    /* reservation form */
    .reservation_form_wrap h2{ font-size: 18px;padding:30px 0 0 0;font-weight:700;color:#e1263c;}
    .reservation_form_wrap .reservation_edit h2{ font-size: 24px;margin:0 0 10px 35px;padding:0;font-weight:700;color:#fff;}
    .iconLocation .selectize-input { border-radius: unset !important;}
    .reservationForm .form-control.pickup.iconDate { border-radius:unset !important;}
    .reservationForm .form-control.iconDate {border-radius: unset !important;}
    .iconTime .selectize-input { border-radius: initial !important;}
    .reservation_form_wrap .reservation_edit form:before {left:435px;}
}

@media (min-width : 1300px) {
    /* locations */
    .articleMainWrapper.location {padding:0 70px 0 40px;}
    .widgetWrapper.contacts.location {padding: 50px 0 40px 70px;box-shadow: none;}
}

@media (min-width : 1400px) {
    .reservation_form_wrap .reservation_edit form:before {left:435px;}
}

@media (min-width : 1500px) {
    .container {max-width:1500px;width:100%;}
    article .container {max-width:1300px;}
    section .container {max-width:1300px;}

    /* reservation form */
    .reservation_form_wrap .reservation_edit form:before {left:480px;}
}