@media only screen and (max-width: 1350px) {

    .booking-search {
        padding: 30px;
        /*height: 111px;*/
    }

    .booking-search {
        width: 95%;
    }

    .villa-info {
        width: 84%;
    }

    .date {
        width: 30%;
    }

    .location-wrapper {
        width: 22%;
    }

    .people-num {
        width: 17%;
    }

    .lokacije,
    .date-picker-input,
    .people {
        width: 100%;
    }

    .swiper-button-next, .swiper-container-rtl .swiper-button-prev {
        right: 20px;
    }

    .swiper-button-prev, .swiper-container-rtl .swiper-button-next {
        left: 20px;
    }

    .special-offer .swiper-button-prev,
    .special-offer .swiper-container-rtl .swiper-button-next {
        top: -52px;
        right: 70px;
        left: auto;
    }

    .special-offer .swiper-button-next,
    .special-offer .swiper-container-rtl .swiper-button-prev {
        top: -52px;
        right: 15px;
    }

    .calendar-carousel .swiper-button-prev,
    .calendar-carousel .swiper-button-next {
        top: 22px;
    }

    .calendar-carousel .swiper-button-next,
    .calendar-carousel .swiper-container-rtl .swiper-button-prev {
        right: 5px;
    }

    .calendar-carousel .swiper-button-prev,
    .calendar-carousel .swiper-container-rtl .swiper-button-next {
        left: 5px;
    }

    .date-price-box .villa-badge {
        display: none;
    }
}

@media only screen and (max-width: 1199px) {
    .container {
        width: 100%;
        max-width: 100%;
    }

    .swipper-iskustva .swiper-button-prev {
        left: 10px;
    }

    .swipper-iskustva .swiper-button-next {
        right: 10px;
    }

    .swipper-iskustva .swiper-slide > div:last-child {
        padding-right: 60px;
    }

    .main-villa-holder .villa-badge {
        top: 30px;
        right: 30px;
    }

    .search-wrapper {
        right: 5px;
    }

    .villa-list-right {
        width: 60%;
        padding: 0 0 0 20px;
        display: block;
        float: left;
    }

    .anchor-nav.fixed-anchor {
        width: 100%;
    }

    .anchor-nav.sticky {
        top: 0;
        left: 0 !important;
        right: 0;
        width: 100% !important;
    }

    .thumbnails {
        width: 100%;
    }

    .accommodation-gallery .thumbnails .thumb-img {
        width: 46%;
        display: block;
        float: right;
        margin: 0 10px 10px 0;
    }

    .accommodation-gallery .thumbnails .thumb-img:nth-of-type(3),
    .accommodation-gallery .thumbnails .thumb-img:nth-of-type(4) {
        margin: 0 10px 0 0;
    }

    .safe-logo {
        z-index: 10;
        position: absolute;
        left: 30px;
        top: 30px;
        width: 250px;
    }

}

@media only screen and (max-width: 991px) {

    .yt {
        width: 75%;
    }

    .euro-notice--mobile {
        display: block;
    }

    .booking-search-btn-wrapper {
        width: 100%;
        flex: 1;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        min-width: 0;
    }

    .toggle-booking-search {
        text-align: center;
        padding: 0;
        display: flex;
        flex-wrap: nowrap;
        justify-content: center;
        align-items: center;
        height: 50px;
        padding: 0 10px;
        line-height: 50px;
        width: 470px;
        margin: 0 auto;
    }

    .toggle-booking-search span {
        padding: 0 20px;
        position: relative;
    }

    .toggle-booking-search span:first-of-type {
        padding: 0 20px 0 30px;
    }


    .toggle-booking-search span:empty {
        display: none;
    }

    .toggle-booking-search span:after,
    .toggle-booking-search span:nth-of-type(2):before,
    .toggle-booking-search span:last-of-type:before {
        content: '';
        position: absolute;
        right: 0;
        top: 50%;
        display: inline-block;
        width: 3px;
        height: 3px;
        border-radius: 100%;
        background: #ffffff;
    }

    .toggle-booking-search span:nth-of-type(2):before,
    .toggle-booking-search span:last-of-type:before {
        left: 0;
    }

    .toggle-booking-search span:first-of-type:before {
        content: '';
        width: 18px !important;
        height: 100%;
        background: url(../img/search-ico-white.svg) 50% 53% no-repeat;
        background-size: 15px auto;
        padding: 0 !important;
        display: block !important;
        position: absolute;
        left: 0;
        top: 1px;
        z-index: 2;
    }

    .toggle-booking-search span:first-of-type:after,
    .toggle-booking-search span:last-of-type:after,
    .toggle-booking-search span:nth-of-type(2):after {
        display: none;
    }

    .booking-search.category {
        padding: 20px 0 10px 0;
    }

    .booking-search-wrapper {
        display: none;
    }

    .search-wrapper-all.home {
        padding: 0 15px;
    }

    .search-wrapper-all {
        z-index: 1052;
        margin: 20px 0;
    }

    .category-page .search-wrapper-all {
        margin: 20px 0;
    }

    .search-wrapper-all.sticky {
        margin: 0;
        padding: 0;
        width: 100% !important;
        left: 0 !important;
        right: 0 !important;
        box-shadow: 0 10px 50px rgba(0,0,0,.2);
        z-index: 1050;
    }

    .search-wrapper-all.sticky .toggle-booking-search {
        border-radius: 0;
    }

    .nav-list li {
        margin: 0 10px 0 0;
    }

    .booking-search,
    .booking-search.category {
        height: auto;
        -webkit-transform: none;
        transform: none;
        box-shadow: none;
        padding: 20px;
        width: 100%;
    }

    .location-wrapper,
    .date,
    .people-num,
    .adv-search {
        width: 100%;
    }

    .date,
    .people-num,
    .adv-search {
        margin: 15px 0 0 0;
    }

    .search-btn-booking {
        margin: 20px 0 0 0;
        width: auto;
        height: auto;
        padding: 15px 25px;
    }

    .search-btn-booking:after {
        display: none;
    }

    .mobile-btn-name {
        display: block;
        color: #ffffff;
        font-weight: 700;
    }

    .villa-info {
        bottom: 10%;
    }

    .villa-wrapper .villa-item {
        width: 280px;
    }

    .villa-list-right .show-map,
    .villa-list-right .villa-id {
        display: none;
    }

    .category-info {
        left: 30px;
        bottom: 30px;
    }

    .date-price-box .villa-badge {
        top: -20px;
        right: 0;
        width: 70px;
    }

    .cbx span {
        width: 90%;
    }

    .rate-price .rate {
        float: none;
    }

    .rate-price .price {
        float: none;
        top: auto;
    }

    .left-side-box {
        padding: 0;
        display: inline-block;
        width: 100%;
    }

    .date-price-box .buttons-review-wrapper {
        margin: 15px 0 0 0;
    }

    .main-villa-holder .swiper-button-next,
    .main-villa-holder .swiper-container-rtl .swiper-button-prev {
        right: 10px;
    }

    .main-villa-holder .swiper-button-prev,
    .main-villa-holder .swiper-container-rtl .swiper-button-next {
        left: 10px;
    }

    .villa-info h2 {
        font-size: 2.5rem;
    }

    .quick-links-wrapper {
        min-width: 100%;
        float: none;
    }

    .quick-links-wrapper ul {
        display: inline-block;
    }

    .quick-links li {
        width: 33%;
        float: left;
    }

    .quick-links li ul,
    .quick-links li ul li{
        width: 100%;
    }

    .modal-title {
        font-size: 1.6rem;
    }

    #mapa {
        height: 50vh;
    }

    .other-accommodation-units .villa-item {
        margin: 0 0 30px 0;
    }

    .steps {
        padding: 20px 0;
    }

    .steps li {
        margin: 0 20px 0 0;
    }

    .steps .orange-btn, .steps .outline-btn {
        font-size: 13px;
        padding: 0;
        width: 40px;
        height: 40px;
        border-radius: 50%;
        line-height: 38px;
        text-align: center;
    }

    .step-label {
        display: none;
    }

    .reservation-page .breadcrumbs-show-map {
        margin: 0;
    }


}

@media only screen and (max-width: 767px) {


    .why-lrossa-items > div {
        font-size: 1.25rem;
    }

    .yt {
        width: 100%;
    }

    .price-mobile {
        display: block;
    }

    .price-desktop {
        display: none;
    }

    .show-category-map-mobile {
        display: inline-block;
        width: 100%;
        padding: 0 0 20px 0;
    }


    .show-category-map-desktop {
        display: none;
    }

    .allMenuBtnMobile {
        display: flex !important;
    }

    .allMenuBtnDesktop {
        display: none !important;
    }

    .search-wrapper {
        top: 70px;
        right: 60px;
    }

    .search-currency-wrapper .lang-list {
        width: 50px;
        right: 0;
    }

    .search-currency-wrapper .lang-list a,
    .search-currency-wrapper .lang-list li:last-child a {
        padding: 5px 0;
    }

    .search-currency-wrapper .lang-list .flag-circle {
        top: 0;
    }

    .search-currency-wrapper ul li a:hover,
    .search-currency-wrapper ul li a:active,
    .search-currency-wrapper ul li a:focus {
        background: #ffffff;
        color: #191919;
    }

    .search-currency-wrapper .lang {
        display: inline-block;
    }

    .search-currency-wrapper .lang:after {
        content: '';
        width: 12px;
        height: 12px;
        display: block;
        background: url(../img/chevron-down.svg) 50% 50% no-repeat;
        background-size: 12px auto;
        position: absolute;
        right: 0;
        top: 6px;
    }

    .search-currency-wrapper .lang .flag-circle {
        margin: 0 20px 0 0;
    }

    /* mobile menu */
    .nav-list li.mobile-logo {
        display: block;
    }

    .nav-list li.mobile-logo img {
        width: 65px;
        height: 55px;
        margin: 0 auto;
        display: block;
    }

    .nav-list .close-btn {
        position: absolute;
        top: 10px;
        right: 10px;
        display: block;
        width: 30px;
        height: 30px;
        background: url(../img/close-ico.svg) 50% 50% no-repeat;
        background-size: 20px auto;
        z-index: 2;
    }

    .mobile-nav-wrapper {
        display: block;
    }

    .nav-list {
        position: fixed;
        right: 0;
        top: 0;
        display: none;
        bottom: 0;
        background: #ffffff;
        width: 260px;
        margin: 0;
        padding: 0;
        margin: 0;
        float: none;
        z-index: 1052;
        overflow-y: auto;
        overflow-x: hidden;
        box-shadow: -10px 0 20px rgba(0,0,0,.3);
        -webkit-backface-visibility: hidden;
        backface-visibility: hidden;
    }

    .main-nav.fixed .nav-list {
        margin: 0;
    }

    .nav-list .search {
        display: none;
    }

    .nav-list li {
        width: 100%;
        margin: 0;
        top: auto;
        padding: 0;
        border-bottom: 1px solid #DCDCDC;
    }

    .nav-list li:last-child {
        border-bottom: none;
    }

    .nav-list li a {
        display: block;
        width: 100%;
        padding: 12px 15px;
        text-align: left;
    }

    .nav-list li a.show-submenu:after {
        display: none;
    }

    .nav-list li a.show-submenu {
        padding-right: 40px;
    }

    .nav-list li a.show-submenu:before {
        content: '';
        position: absolute;
        right: 20px;
        top: 18px;
        width: 12px;
        height: 12px;
        background: url(../img/chevron-down.svg) 50% 50% no-repeat;
        background-size: 12px auto;
    }

    .nav-list .submenu {
        position: relative;
        left: 0;
        right: 0;
        top: auto;
        width: 100%;
        box-shadow: none;
        padding: 5px;
        height: auto;
        background: #f7f7f7;
    }

    .nav-list .submenu li {
        padding: 0;
        border-bottom: none;
    }

    .nav-list .submenu a {
        padding: 5px 10px;
    }

    .nav-list li a.orange-btn {
        width: 93%;
    }

    .nav-list li {
        margin: 0 20px 0 0;
    }

    .nav-list li a {
        font-size: 16px;
    }

    .nav-list li a:hover,
    .nav-list li a:focus,
    .nav-list li a:active {
        color: #191919;
    }

    .nav-list li a.orange-btn:hover,
    .nav-list li a.orange-btn:focus,
    .nav-list li a.orange-btn:active {
        color: #ffffff;
    }


    .nav-list li a:hover:after {
        bottom: -36px;
    }

    .nav-list li a:hover:after,
    .nav-list li a:focus:after,
    .nav-list li a:active:after {
        display: none;
    }

    .submenu h2 {
        display: none;
    }

    .submenu .submenu-wrapper {
        width: 100%;
        margin: 10px 0 0 0;
    }

    .submenu .submenu-wrapper .submenu-list {
        -webkit-column-count: 1;
        -moz-column-count: 1;
        column-count: 1;
        column-gap: 0;
        -webkit-column-gap: 0;
        -moz-column-gap: 0;
        margin: 0 0 10px 0;
    }

    .nav-list .submenu li:last-child a {
        padding: 5px 10px 0 10px;
    }
    /* end mobile menu */
    .booking-search {
        width: 100%;
        border-radius: 0;
    }

    .main-villa-holder,
    .accommodation-page,
    .reservation-page {
        margin: 88px 0 0 0;
    }

    .villa-info {
        width: 70%;
        left: 30px;
        bottom: 30px;
        margin: 0;
    }

    .villa-info h3,
    .villa-info .title-desktop {
        display: none;
    }

    .villa-info .title-mobile {
        display: block;
    }

    .main-villa-holder .villa-badge {
        width: 60px;
    }

    .main-villa-holder:after {
        background: rgb(0,0,0);
        background: -moz-linear-gradient(0deg, rgba(0,0,0,0.5158438375350141) 0%, rgba(0,0,0,0) 65%);
        background: -webkit-linear-gradient(0deg, rgba(0,0,0,0.5158438375350141) 0%, rgba(0,0,0,0) 65%);
        background: linear-gradient(0deg, rgba(0,0,0,0.5158438375350141) 0%, rgba(0,0,0,0) 65%);
    }

    .copyright .footer-links {
        float: none;
        width: 100%;
        padding: 10px 0;
        text-align: center;
    }

    .topbar-txt {
        display: none;
    }

    .topbar-contact {
        float: none;
        text-align: center;
    }



    .lang-name,
    .fav-label {
        display: none;
    }

    .main-nav .logo img {
        width: 80px;
        height: 68px;
    }

    .main-nav {
        padding: 5px 0 10px 0;
        z-index: 1050;
    }

    .search-currency-wrapper {
        width: auto;
        right: 55px;
        top: 23px;
    }

    .search-currency-wrapper li {
        margin: 0 0 0 20px;
    }

    .search-currency-wrapper li.favorites {
        width: 24px;
        height: 21px;
    }

    .mobile-nav-wrapper {
        top: 23px;
    }

    .search-currency-wrapper .lang-list .flag-circle {
        float: none;
        margin: 0 auto;
    }

    .big-three {
        padding: 50px 0;
    }

    .special-offer {
        padding: 0 0 50px 0;
    }

    .region-item-desc,
    .big-three-item:hover:after {
        display: none;
    }

    .region-item-img:hover h3,
    .region-item-img h3 {
        -webkit-transform: none;
        transform: none;
    }

    .region-item-img h3 {
        bottom: 30px;
        padding: 0 10px;
    }

    .feature-item:hover,
    .feature-item:focus,
    .feature-item:active {
        box-shadow: none;
        border: 1px solid #DADCE1;
    }

    footer {
        text-align: center;
    }

    .top {
        width: auto;
        margin: 30px 0;
        text-align: right;
    }

    .payment-cards,
    .partners {
        display: block;
        width: 100%;
        text-align: center;
    }

    .payment-cards {
        margin: 30px 0;
    }

    .payment-cards li, .partners li {
        display: inline-block;
        float: none;
        margin: 0 20px 0 0;
    }

    .search-currency-wrapper .search-mobile,
    .nav-list .mobile-currency {
        display: block;
    }

    .nav-list .mobile-currency {
        position: relative;
    }

    /* .search-currency-wrapper li.currency-list {
        display: none;
    }

    .currencies {
        position: relative;
        top: auto;
        width: auto;
        box-shadow: none;
        right: 0;
        background: #f7f7f7;
    }

    .currencies li {
        border-bottom: none;
    }*/

    .search-currency-wrapper .flag-circle {
        margin: 0 5px 0 0;
    }

    .search-currency-wrapper .search {
        width: 24px;
        height: 24px;
        background: url(../img/search-ico.svg) 50% 50% no-repeat;
        background-size: 24px auto;
        margin: 0;
        top: 0;
    }

    .villa-wrapper .villa-item,
    .villa-wrapper .villa-item .mini-slider-wrapper img {
        width: 100%;
    }

    .villa-list-right,
    .reservation-page .villa-list-right {
        width: 100%;
        padding: 20px 0 0 0;
    }

    .villa-list-right .cat-location {
        width: 100%;
    }

    .villa-list-right .villa-location {
        display: block;
        float: right;
    }

    .icons-list > div {
        margin: 0 25px 0 0;
    }

    .page-nav,
    .page-nav.bottom {
        display: none;
    }

    .page-nav.bottom.mobile {
        display: block;
    }

    .load-more-mobile {
        display: block;
        text-align: center;
    }

    .villa-wrapper {
        margin: 0 0 30px 0;
    }


    .category-page-sort {
        padding: 0 0 30px 0;
    }

    .category-img-wrapper {
        margin: 90px 0 0 0;
    }

    .accommodation-gallery .villa-badge {
        width: 60px;
    }

    .buttons-review-wrapper {
        text-align: left;
        margin: 0 0 20px 0;
    }

    .tabs-wrapper .distance-items {
        -webkit-column-count: 2;
        -moz-column-count: 2;
        column-count: 2;
    }

    .date-price-box {
        margin: 0 0 30px 0;
    }

    .reservation-page h1 {
        margin: 0 0 20px 0;
    }

    .distance-object {
        -webkit-column-count: 1;
        -moz-column-count: 1;
        column-count: 1;
        column-gap: 0;
        -webkit-column-gap: 0;
        -moz-column-gap: 0;
    }

    .other-accommodation-units.object {
        margin: 40px 0;
    }

    .other-accommodation-units.object .main-desc-title {
        margin: 0 0 10px 0;
    }

    .main-info .show-map {
        float: left;
    }

    .content-col-wrapper {
        margin: 0 0 20px 0;
    }

    .accommodation-page .price {
/*        text-align: left;*/
        margin: 20px 0;
    }

    .pagination.desktop {
        display: none;
    }

    .prices-box {
        margin: 0;
    }

    .calendar-legend li {
        margin: 0;
        float: none;
    }

    .reviews .rate {
        display: inline-block;
        float: none;
        width: 100%;
    }

    .accommodation-page .price-mobile {
        display: block;
        float: right;
    }

    .accommodation-page .rate {
        width: auto;
    }

    .fav-wrapper {
        margin: 20px 0 0 0;
    }

    /** newsletter **/
    .ct-newsletter-wrapper {
        margin-top: 30px;
    }

    .ct-newsletter-logo img {
        top: 0;
    }

    .ct-newsletter-content {
        max-width: 50%;
        margin: 0 20px 0 auto;
    }

    .ct-form input {
        width: 100%;
        margin-bottom: 10px;
    }

    .ct-form .ct-form-btn {
        width: 100%;
    }

    .safe-logo {
        z-index: 10;
        position: absolute;
        left: 1%;
        top: 6%;
        width: 144px;
    }

}

@media only screen and (max-width: 600px) {

    .swipper-iskustva .swiper-button-prev {
        top: 80px;
    }


    .swipper-iskustva .swiper-button-next {
        top: 80px;
    }


    .swiper-container {
        width: 100%;
    }



    .main-villa-holder, .slider-img-wrapper img {
        aspect-ratio: 600 / 700;
    }

    .slider-img-wrapper img {
        
    }


    .accommodation-mobile-slider {
        aspect-ratio: 404 / 254;
    }


}


@media only screen and (max-width: 575px) {

    .why-lrossa-items {
        flex-direction: column;
    }

    .swipper-iskustva .swiper-slide {
        flex-direction: column;
    }

        .swipper-iskustva .swiper-slide > div:first-child {
            margin-bottom: 1rem;
            text-align: center;
        }

        .swipper-iskustva .swiper-slide > div:first-child img {
            width: 100%;
        }

        .swipper-iskustva .swiper-slide > div:last-child {
            padding-left: 0;
            padding-right: 0;
        }


    .why-lrossa-items > div .why-lrossa-pikto {
        flex: 0 0 30%;
    }

    .why-lrossa-items > div .why-lrossa-txt {
        flex: 0 0 70%;
    }

    .topbar-contact li.suradnja {
        display: none;
    }

    .simple-page h1 {
        text-align: center;
    }

    .suradnja-teaser {
        margin-bottom: 2rem;
    }

    .suradnja-teaser p {
        font-size: 1.25rem;
    }

    .suradnja-contact {
        flex-direction: column;
        flex-wrap: wrap;
        gap: 3rem;
        align-content: center;
        margin-bottom: 3rem;
    }

    .suradnja-address {
        margin-top: 2rem;
    }

    .swipper-iskustva .swiper-slide > div:last-child {
        font-size: 1rem;
    }

    .villa-id-desktop {
        display: none;
    }


    .swiper-container img {
    }

    .discount {
        font-size: 20px;
    }

    .discount-dates {
        top: 70px;
    }

    .main-villa-holder .villa-badge {
        top: 10px;
        right: 10px;
    }

    .main-nav .logo img,
    .main-nav.fixed .logo img {
        width: 60px;
        height: 51px;
    }

    .search-currency-wrapper,
    .mobile-nav-wrapper {
        top: 15px;
    }

    .main-villa-holder,
    .accommodation-page,
    .reservation-page {
        margin: 70px 0 0 0;
    }

    .villa-info h2 {
        font-size: 2rem;
    }

    .features-list li {
        width: 48%;
        margin: 0 10px 10px 0;
    }

    .features-list li:nth-child(2),
    .features-list li:last-child {
        margin: 0 0 10px 0;
    }

    .feature-item {
        padding: 25px 0;
    }

    .feature-item img {
        max-width: 60px;
        max-height: 60px;
        margin: 0 auto 20px auto;
    }

    .features h3 {
        font-size: 16px;
    }

    .big-three-item.left {
        height: 255px;
        margin-bottom: 30px;
    }

    .big-three-item.right:first-of-type {
        margin-bottom: 30px;
    }

    .search-btn-booking {
        width: 100%;
    }

    .home-section h2 {
        margin: 0 0 20px 0;
    }

    .villa-item h2 {
        margin: 0;
    }

    .special-offer {
        padding: 0 0 30px 0;
    }

    .big-three,
    footer {
        padding: 30px 0;
    }

    footer {
        margin: 30px 0 0 0;
    }

    .villa-item img {
        width: 100%;
    }

    .special-offer .orange-btn {
        margin: 10px 0 0 0;
    }

    .special-offer .title-desktop,
    .special-offer-carousel {
        display: none;
    }

    .special-offer .title-mobile,
    .special-offer-mobile {
        display: block;
    }

    .villa-item {
        margin: 0 0 30px 0;
    }

    .villa-item:last-of-type {
        margin: 0;
    }

    .region-item-img h3 {
        font-size: 20px;
    }

    .search-wrapper {
        right: 0;
        left: 0;
        width: 100%;
    }

    .villa-wrapper .villa-item {
        margin: 0;
    }

    .breadcrumbs-wrapper,
    .sorting-label {
        display: none;
    }

    .icons-list {
        display: inline-block;
        width: 100%;
        margin: 20px 0 0 0;
        font-size: 12px;
    }

    .icons-list > div {
        margin: 0 7px 15px 0;
        display: inline-block;
        width: 16%;
    }

    .icons-list > div:last-of-type {
        margin: 0 0 15px 0;
    }

    .villa-size:before,
    .bathroom-ico:before,
    .rooms:before,
    .beach-ico:before,
    .shopping-ico:before,
    .parking-ico:before,
    .pet-ico:before,
    .wifi-ico::before {
        height: 25px;
    }

    .villa-size:before {
        width: 25px;
        background: url(../img/apartment-size.svg) 50% 50% no-repeat;
        background-size: 25px auto;
    }

    .bathroom-ico:before {
        width: 20px;
        background: url(../img/shower-ico.svg) 50% 50% no-repeat;
        background-size: 20px auto;
    }

    .rooms:before {
        width: 25px;
        background: url(../img/smjestaj-ico.svg) 50% 50% no-repeat;
        background-size: 25px auto;
    }

    .beach-ico:before {
        width: 25px;
        background: url(../img/distance-sea-ico.svg) 50% 50% no-repeat;
        background-size: 25px auto;
    }

    .shopping-ico:before {
        width: 27px;
        background: url(../img/cart-ico.svg) 50% 50% no-repeat;
        background-size: 25px auto;
    }

    .parking-ico:before {
        width: 25px;
        background: url(../img/parking-ico.svg) 50% 50% no-repeat;
        background-size: 25px auto;
    }

    .pet-ico:before {
        width: 30px;
        background: url(../img/pet-ico.svg) 50% 50% no-repeat;
        background-size: 25px auto;
    }

    .wifi-ico::before {
        width: 25px;
        background: url(../img/wifi-ico.svg) 50% 50% no-repeat;
        background-size: 25px auto;
    }

    .category-page-sort {
        padding: 20px 0;
        display: inline-block;
        width: 100%;
    }

    .about-category-bottom {
        column-count: 1;
        column-gap: 0;
    }

    .category-info {
        width: 85%;
        left: 20px;
        bottom: 20px;
    }

    .category-info h1 {
        font-size: 22px;
    }

    .category-info h2 {
        line-height: 1.5;
    }

    .category-img .villa-badge {
        width: 55px;
        top: 15px;
        right: 15px;
        display: none;
    }

    header {
        overflow-x: hidden;
    }

    /*.category-img-wrapper {
        margin: 80px 0 0 -20px;
        width: 107%;
    }*/

    .other-accommodation-units .orange-btn,
    .accommodation-gallery .villa-badge,
    .show-gallery,
    .accommodation-gallery,
    .buttons-review-wrapper .rate,
    .months-ico, .accommodation-ico, .map-ico, .review-ico,
    .accommodation-tabs .nav-link.active:before {
        display: none;
    }

    .accommodation-mobile-slider {
        display: block;
        position: relative;
    }

    .accommodation-mobile-slider .mini-slider-wrapper img {
        width: 100%;
    }

    .buttons-review-wrapper .outline-btn {
        margin: 0 10px 10px 0;
        padding: 13px 11px;
    }

    .buttons-review-wrapper .orange-btn {
        padding: 13px 15px;
    }

    .accommodation-page .rate-mobile {
        display: none;
        margin: 0;
        width: auto;
    }

    .accommodation-page .rate-mobile .rate-num {
        font-size: 14px;
    }

    .accommodation-page .price {
        margin: 20px 0;
    }

    .other-accommodation-units .rate-price .price {
        margin: 0;
        top: 12px;
    }

    .villa-id-mobile {
        margin: 0 0 10px 0;
    }

    .tabs-wrapper .tab-col,
    .content-col-wrapper .content-col,
    .content-col-wrapper .content-col.first {
        width: 100%;
        padding: 0;
    }

    .reveal-all-wrapper {
        padding: 10px 0 0 0;
    }

    .reveal-all {
        width: 100%;
    }

    /*.content-col-wrapper {
        max-height: 200px;
        overflow: hidden;
        -webkit-transition: all 3s ease-out;
        transition: all 3s ease-out;
    }

    .content-col-wrapper.visible {
        height: auto;
        max-height: 3000px;
        overflow: visible;
    }*/
    .accommodation-tabs {
        display: block;
        padding: 5px 0;
        width: 100%;
        text-align: center;
    }

    .accommodation-tabs .nav-link.active:after {
        bottom: -5px;
        height: 3px;
    }

    .accommodation-tabs .nav-item {
        display: inline-block;
        border-right: none;
        position: relative;
        margin: 0 15px 0 0;
    }

    .accommodation-tabs li:last-child {
        margin: 0;
    }

    /* .accommodation-tabs li:after {
    content: '';
    display: block;
    position: absolute;
    top: 6px;
    left: -20px;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #EF481E;

} */

    .accommodation-tabs a {
        padding: 0;
        font-size: 13px;
    }

    .accommodation-tabs li:first-child:after,
    .desktop-nav-tabs {
        display: none;
    }

    .mobile-nav-tabs {
        display: block;
    }

    .tabs-wrapper .tab-pane {
        padding: 15px 0 0 0;
    }

    .tabs-wrapper .map {
        height: 350px;
    }

    .calendar-carousel {
        margin: 0 -15px;
    }

    .calendar-carousel .swiper-button-prev,
    .calendar-carousel .swiper-button-next {
        top: 23px;
    }

    .calendar-legend {
        margin: 10px 0 0 0;
        font-size: 12px;
    }

    .calendar-legend li:before {
        top: 6px;
    }

    .location-map .distance-items {
        -webkit-column-count: 1;
        -moz-column-count: 1;
        column-count: 1;
        column-gap: 0;
        -webkit-column-gap: 0;
        -moz-column-gap: 0;
    }

    .location-map .distance-items li {
        display: inline-block;
        width: 100%;
    }

    .date-price-box .buttons-review-wrapper {
        margin: 30px 0 0 0;
    }

    .form-control,
    .reservation-group-content .inside-form-btn,
    .reservation-page.contact .date {
        width: 100%;
    }

    .reservation-group .form-group .select2-container, .reservation-group .form-group .select2-selection {
        width: 100% !important;
    }

    .reservation-group.nacin-placanja .select2-container, .reservation-group.nacin-placanja .select2-selection {
        width: 100% !important;
        margin: 0 0 7px 0;
        max-width: 100% !important;
    }

    .checkbox-right-side {
        width: auto;
        display: inline-block;
        text-align: left;
        margin: 5px 0 0 38px;
        background: #eaeaea;
        padding: 5px 10px;
        border-radius: 6px;
    }

    .cbx span,
    .cbx span:last-child {
        width: 85%;
    }

    .data-right {
        display: block;
    }

    .data-right.final-price {
        text-align: left;
    }

    .help-note {
        max-width: 100%;
    }

    .other-accommodation-units.object .content-col-wrapper {
        max-height: 100%;
        overflow: visible;
    }

    .other-accommodation-units.object .main-desc-title {
        margin: 30px 0 10px 0;
    }

    .other-accommodation-units.object .main-desc {
        margin: 0;
    }

    .simple-page h1 {
        margin: 30px 0 20px 0;
        font-size: 1.7rem;
    }

    .price-rate-wrapper {
        margin: 10px 0 0 0;
    }

    .rate-price .rate {
        float: left;
    }

    .rate-price .price {
        float: right;
        top: 10px;
    }

    .date-range-price {
        padding: 10px;
    }

    .reservation-txt-price, .reservation-price {
        width: 100%;
        top: 0;
    }

    .picked-dates {
        width: 100%;
        top: 0;
        margin: 0 0 10px 0;
    }

    .date-price-box .currency-list {
        position: absolute;
        top: 0;
        right: 15px;
        margin: 0;
    }

    .tabs-quick-links .nav-tabs .nav-item {
        display: block;
        width: 100%;
        margin-bottom: 0;
    }

    .tabs-quick-links .nav-tabs .nav-link {
        border-radius: 5px;
        padding: 10px 15px;
    }

    .tabs-quick-links .nav-tabs {
        padding: 0 0 10px 0;
    }

    .quick-links {
        width: 100%;
        margin: 0 0 30px 0;
    }

    #mapa2, #mapa2-wrapper {
        height: 40vh;
    }

    .quick-links li {
        width: 100%;
    }

    .cat-location {
        width: 100%;
    }

    .accommodation-page .villa-location {
        display: block;
        float: right;
        margin: 0;
        top: 6px;
    }

    .reset-dates {
        float: none;
        text-align: center;
        width: 170px;
        margin: 0 auto;
    }

    .price-week {
        text-align: left;
    }

    .category-img-wrapper {
        margin: 70px 0 0 0;
    }

    .short-desc {
        font-size: 16px;
    }

    .category-page .search-wrapper-all {
        margin: 20px 0 0 0;
    }

    .category-page .search-wrapper-all.sticky {
        margin: 0;
    }

    .category-page .num-units {
        display: block;
        float: left;
        position: relative;
        top: 5px;
    }

    .category-page .sorting {
        display: block;
        float: right;
    }

    .buttons-review-wrapper {
        margin: 0 0 10px 0;
    }

    .min-nights-mobile {
        display: inline-block;
    }

    .cjenik-labels {
        display: none;
    }

    .cjenik-labels li:first-child,
    .date-range-price li:first-child,
    .cjenik-labels li:nth-child(2),
    .date-range-price li:nth-child(2),
    .cjenik-labels li:nth-child(3),
    .date-range-price li:nth-child(3),
    .cjenik-labels li:last-child,
    .date-range-price li:last-child {
        width: 100%;
    }

    .cjenik-labels li:nth-child(2),
    .date-range-price li:nth-child(2),
    .cjenik-labels li:last-child,
    .date-range-price li:last-child {
        text-align: left;
    }

    .price-period {
        display: block;
    }

    .category-page .price-rate-wrapper .period {
        margin: 0;
    }

    .reservation-group-content {
        text-align: left;
    }

    .steps {
        padding: 0 0 20px 0;
    }

    label.radio {
        margin: 10px 0 0 0;
    }

    .advance-remaining span {
        width: 100%;
        display: inline-block;
        padding: 0;
    }

    .advance-remaining .data-right:last-of-type {
        text-align: left;
    }

    .expiration-date-select select {
        width: 100% !important;
    }

    .expiration-date-select select:last-of-type {
        margin: 10px 0 0 0;
    }

    .accommodation-page h2 {
        font-size: 1.5rem;
    }

    .toggle-booking-search {
        font-size: 14px;
        width: 100%;
    }

    .toggle-booking-search span:first-of-type:before {
        background: url(../img/search-ico-white.svg) 50% 50% no-repeat;
        background-size: 15px auto;
    }

    .toggle-booking-search span {
        padding: 0 15px;
    }

    .toggle-booking-search span:first-of-type {
        padding: 0 15px 0 30px;
    }

    .fav-wrapper {
        margin: 0;
    }

    /** newsletter - max 575 **/
    .ct-newsletter-wrapper {
        background-position: 30% 60%;
    }

    .ct-newsletter-logo img {
        position: static;
        margin-bottom: 10px;
    }

    .ct-newsletter-content {
        max-width: 100%;
        margin: 0;
    }

        .ct-newsletter-content h2 {
            font-size: 20px;
            line-height: 21px;
            color: #fff;
            text-shadow: 0 1px 5px rgba(0, 0, 0, 0.8);
        }

        .ct-newsletter-content p {
            font-size: 12px;
            color: #fff;
            text-shadow: 0 1px 5px rgba(0, 0, 0, 0.8);
        }

}

@media only screen and (max-width: 375px) {

    .villa-info h2 {
        font-size: 1.7rem;
    }



    .why-lrossa-items > div {
        font-size: 1rem;
    }

    .villa-info {
        left: 20px;
        bottom: 20px;
    }

    .villa-cat-location {
        margin: 10px 0;
    }

    .home-section .villa-item h2,
    .villa-item h2 {
        font-size: 16px;
    }

    .villa-item .price {
        font-size: 14px;
    }

    .villa-item .price strong {
        font-size: 16px;
    }

    footer .footer-info {
        width: 100%;
    }

    .topbar a {
        font-size: 12px;
    }

    .feature-item img {
        max-width: 50px;
        max-height: 50px;
        margin: 0 auto 15px auto;
    }

    .features h3 {
        font-size: 14px;
    }

    .big-three-item {
        padding: 25px 10px;
    }

    .big-three-item.left,
    .big-three-item.right {
        height: 165px;
    }

    .big-three-item.left,
    .big-three-item.right:first-of-type {
        margin-bottom: 20px;
    }

    .big-three-item h2 {
        font-size: 18px;
    }

    .big-three-item h3 {
        font-size: 12px;
    }

    .big-three-item .orange-btn {
        left: 10px;
        bottom: 10px;
        font-size: 14px;
    }

    .payment-cards li, .partners li {
        margin: 0 8px 0 0;
    }

    .region-item-img h3 {
        font-size: 18px;
        bottom: 10px;
    }

    .ct-newsletter-wrapper {
        height: 320px;
    }

    .home-section h2 {
        font-size: 1.5rem;
        margin: 0 0 15px 0;
    }

    .accommodation-page h1 {
        font-size: 18px;
    }

    .date-price-box .villa-badge {
        top: -40px;
        right: -10px;
    }

    .reservation-txt-price, .reservation-price {
        width: 80%;
    }

    .tabs-wrapper .more-info .checkout-ico {
        margin: 0 10px;
    }

    .date-price-box .buttons-review-wrapper {
        margin: 15px 0 0 0;
        width: 100%;
    }

    .buttons-review-wrapper .orange-btn,
    .buttons-review-wrapper .outline-btn {
        padding: 13px 12px;
    }

    .date-price-box {
        padding: 15px;
    }

    .reservation-group-name {
        margin: 0 0 10px 0;
    }

    .reservation-page h1 {
        font-size: 1.5rem;
    }

    .reservation-page .desc {
        display: block;
    }

    .reservation-group label {
        padding: 0 10px 0 0;
    }

    .reservation-group .select2-container,
    .reservation-group .select2-selection {
        width: 100px !important;
    }

    .search-currency-wrapper {
        right: 50px;
    }

    .search-currency-wrapper a {
        font-size: 12px;
    }

    .search-currency-wrapper li {
        margin: 0 0 0 15px;
    }

    .rate-price .rate {
        float: none;
    }

    .rate-price .price {
        float: none;
        top: auto;
    }

    .fav-num,
    .date-price-box .villa-badge {
        display: none;
    }

    .buttons-review-wrapper .outline-btn,
    .buttons-review-wrapper .orange-btn {
        width: 100%;
        text-align: center;
        margin: 0 0 10px 0;
    }

    .review-count {
        display: none;
    }

    .date-price-box .currency-list {
        top: 36px;
        right: 20px;
        width: 35px;
        height: 35px;
        line-height: 29px;
    }

    .toggle-currency-reservation:after {
        top: 10px;
    }

    .currencies-reservation {
        right: -10px;
    }

    .accommodation-page .price,
    .accommodation-page .price strong {
        font-size: 16px;
    }

    .reset-dates {
        width: 100%;
    }

    .category-info h1 {
        margin: 0 0 5px 0;
    }

    .category-info {
        width: 93%;
        left: 10px;
        bottom: 10px;
    }

    .category-page-sort {
        padding: 10px 0 0 0;
    }

    .category-page .num-units {
        top: auto;
        text-align: center;
        float: none;
    }

    .category-page .sorting {
        float: none;
        width: 100%;
        margin: 10px 0 0 0;
    }

    .category-page .sorting .select2-container {
        width: 100%!important;
    }

    .show-category-map-mobile {
        text-align: center;
    }

    .show-category-map-mobile .show-map:before {
        position: relative;
        top: 10px;
        display: inline-block;
        float: none;
        margin: 0 10px 0 0;
    }

    .category-page .price-rate-wrapper .period:before {
        top: 4px;
        background: url(../img/calendar-ico.svg) 50% 50% no-repeat;
        background-size: 14px auto;
    }

    .category-page .price-rate-wrapper .period {
        font-size: 13px;
        padding: 5px 5px 5px 30px;
    }

    .arrive-depart-wrapper {
        font-size: 13px;
    }

    .accommodation-page .checkout-ico {
        margin: 0 10px 0 15px;
    }

    .review-form .orange-btn {
        width: 100%;
    }

    .search-ico-mobile-btn {
        right: 10px;
    }
    
}