body, html { font-family: 'Muli', Arial, sans-serif; font-weight: 400; font-size: 14px; color: #484848; } .no-scroll { overflow: hidden; height: 100%; position: absolute; top: 0; left: 0; right: 0; width: 100%; } a, button { -webkit-transition: all .3s ease-out; transition: all .3s ease-out; } a, a:hover { color: #EF481E; } strong { font-weight: 700; } h1 { margin: 30px 0 10px 0; font-size: 2.8rem; } .simple-page h1 { font-weight: 700; margin: 30px 0; font-size: 1.9rem; } .simple-page .simple-page-content { line-height: 2; font-size: 16px; } h2 { font-weight: 700; font-size: 1.8rem; } ol, ul, dl { margin-bottom: 2rem; } section .img_responsive, section .imgresponsive { max-width: 100%; } .no-padding { padding: 0; } .no-list-style { list-style-type: none; margin: 0; padding: 0; } .orange-btn { position: relative; display: inline-block; color: #ffffff; font-size: 16px; border: none; border-radius: 6px; font-weight: 700; padding: 13px 30px; background: -moz-linear-gradient(328deg, rgba(236,40,33,1) 0%, rgba(236,40,33,1) 26%, rgba(243,152,27,1) 100%); background: -webkit-gradient(linear, left top, right bottom, color-stop(0%, rgba(236,40,33,1)), color-stop(26%, rgba(236,40,33,1)), color-stop(100%, rgba(243,152,27,1))); background: -webkit-linear-gradient(328deg, rgba(236,40,33,1) 0%, rgba(236,40,33,1) 26%, rgba(243,152,27,1) 100%); background: -o-linear-gradient(328deg, rgba(236,40,33,1) 0%, rgba(236,40,33,1) 26%, rgba(243,152,27,1) 100%); background: linear-gradient(122deg, rgba(236,40,33,1) 0%, rgba(236,40,33,1) 26%, rgba(243,152,27,1) 100%); } .orange-btn:hover, .orange-btn:focus, .orange-btn:active { color: #ffffff; text-decoration: none; } .green-btn { background: -moz-linear-gradient(122deg, rgb(67, 227, 63) 0%, rgb(58, 209, 54) 26%, rgb(9, 172, 93) 100%); background: -webkit-gradient(linear, left top, right bottom, color-stop(0%, rgb(67, 227, 63)), color-stop(26%, rgb(58, 209, 54)), color-stop(100%, rgb(9, 172, 93) 100%)); background: -webkit-linear-gradient(122deg, rgb(67, 227, 63) 0%, rgb(58, 209, 54) 26%, rgb(9, 172, 93) 100%); background: -o-linear-gradient(122deg, rgb(67, 227, 63) 0%, rgb(58, 209, 54) 26%, rgb(9, 172, 93) 100%); background: linear-gradient(122deg, rgb(67, 227, 63) 0%, rgb(58, 209, 54) 26%, rgb(9, 172, 93) 100%); transition: all .3s; } .green-btn:hover, .green-btn:active { color: darkgreen; filter: brightness(80%); } .outline-btn { color: #11223F; border: 1px solid #707070; background: #ffffff; border-radius: 6px; padding: 10px 20px; font-size: 16px; display: inline-block; margin: 0 auto; } .outline-btn:hover, .outline-btn:focus, .outline-btn:active { text-decoration: none; color: #ffffff; background: #11223F; } .topbar { background: #EAEAEA; color: #484848; padding: 10px 0; } .topbar-txt { display: block; float: left; } .topbar-contact { display: block; float: right; } .topbar-contact li { display: inline-block; margin: 0 30px 0 0; } .topbar-contact li:last-child { margin: 0; } .topbar-contact .phone:before { content: ''; display: block; width: 16px; height: 16px; background: url(../img/phone-ico-topbar.svg) 50% 50% no-repeat; background-size: 16px auto; position: absolute; left: 0; top: 1px; } .topbar a { color: #484848; position: relative; padding: 0 0 0 25px; } .topbar-contact .mail:before { content: ''; display: block; width: 18px; height: 12px; background: url(../img/email-ico-topbar.svg) 50% 50% no-repeat; background-size: 18px auto; position: absolute; left: 0; top: 4px; } /* mobile nav ico */ .mobile-nav-wrapper { display: none; width: 30px; height: 30px; position: absolute; right: 20px; top: 45px; -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); -webkit-transition: .5s ease-in-out; -moz-transition: .5s ease-in-out; -o-transition: .5s ease-in-out; transition: .5s ease-in-out; cursor: pointer; } .mobile-nav-wrapper span { display: block; position: absolute; height: 4px; width: 100%; background: #ec2821; border-radius: 9px; opacity: 1; left: 0; -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); -webkit-transition: .25s ease-in-out; -moz-transition: .25s ease-in-out; -o-transition: .25s ease-in-out; transition: .25s ease-in-out; } .mobile-nav-wrapper span:nth-child(1) { top: 0px; } .mobile-nav-wrapper span:nth-child(2), .mobile-nav-wrapper span:nth-child(3) { top: 10px; } .mobile-nav-wrapper span:nth-child(4) { top: 20px; } .mobile-nav-wrapper.open span:nth-child(1) { top: 18px; width: 0%; left: 50%; } .mobile-nav-wrapper.open span:nth-child(2) { -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); } .mobile-nav-wrapper.open span:nth-child(3) { -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg); } .mobile-nav-wrapper.open span:nth-child(4) { top: 18px; width: 0%; left: 50%; } .search-currency-wrapper { position: absolute; right: 15px; top: 0; z-index: 6; /*width: 310px;*/ } .search-currency-wrapper a { color: #191919; position: relative; font-weight: 700; } .search-currency-wrapper .toggle-currency { width: 30px; height: 30px; display: block; background: #5555a2; border-radius: 50%; text-align: center; line-height: 30px; position: relative; top: -3px; font-size: 13px; color: #ffffff; } .search-currency-wrapper .toggle-currency:hover, .search-currency-wrapper .toggle-currency:active, .search-currency-wrapper .toggle-currency:focus { text-decoration: none; } .nav-list .search, .search-currency-wrapper .search { display: block; float: left; width: 16px; height: 16px; background: url(../img/search-ico.svg) 50% 50% no-repeat; background-size: 16px auto; position: relative; top: 3px; margin: 0 10px 0 0; } .search-currency-wrapper .flag-circle, .nav-list .mobile-currency .flag-circle { display: block; width: 24px; height: 24px; margin: 0 15px 0 0; float: left; position: relative; } .search-currency-wrapper ul li .flag-circle, .nav-list .mobile-currency .flag-circle { top: 3px; } .search-currency-wrapper .flag-circle.en, .nav-list .mobile-currency .flag-circle.en { background: url(../img/en.svg) 50% 50% no-repeat; background-size: 24px auto; } .search-currency-wrapper .flag-circle.hr, .nav-list .mobile-currency .flag-circle.hr { background: url(../img/hr.svg) 50% 50% no-repeat; background-size: 24px auto; } .search-currency-wrapper .flag-circle.de, .nav-list .mobile-currency .flag-circle.de { background: url(../img/de.svg) 50% 50% no-repeat; background-size: 24px auto; } .search-currency-wrapper .flag-circle.it, .nav-list .mobile-currency .flag-circle.it { background: url(../img/it.svg) 50% 50% no-repeat; background-size: 24px auto; } .search-currency-wrapper .lang-list, .currencies, .currencies-reservation { display: none; position: absolute; padding: 0; top: 40px; right: -11px; width: 50px; background: #ffffff; box-shadow: 0 10px 20px rgba(0,0,0,.3); } .search-currency-wrapper .lang-list { width: 85px; } .search-currency-wrapper .lang-list { right: -13px; } .search-currency-wrapper li, .currencies-reservation li { display: block; float: left; position: relative; margin: 0 0 0 30px; } .search-currency-wrapper li:first-child, .currencies-reservation li:first-child { margin: 0; } .search-currency-wrapper .lang-list li, .search-currency-wrapper .currency-list li, .nav-list .mobile-currency li, .currencies-reservation li { position: relative; float: none; margin: 0; } .search-currency-wrapper ul li a, .currencies-reservation li a { display: block; padding: 5px; border-bottom: 1px solid #ededed; line-height: 30px; text-align: center; } .search-currency-wrapper ul li a:hover, .search-currency-wrapper ul li a:active, .search-currency-wrapper ul li a:focus { background: #f0751d; color: #ffffff; text-decoration: none; } .search-currency-wrapper ul li:last-child a, .currencies-reservation li:last-child a { border-bottom: none; } .search-currency-wrapper li.favorites a { position: relative; padding: 0 0 0 40px; } .search-currency-wrapper li.favorites a:before { content: ''; width: 24px; height: 21px; display: block; background: url(../img/fav-ico.svg) 50% 50% no-repeat; background-size: 24px auto; position: absolute; left: 0; top: 1px; } .search-currency-wrapper li.currency-list li, .nav-list .mobile-currency li, .currencies-reservation li { float: none; } .search-currency-wrapper li.currency-list ul, .nav-list .mobile-currency ul, .currencies-reservation { padding: 0; margin: 0; } .flag-circle:before { content: ''; width: 24px; height: 24px; display: block; position: absolute; left: 0; top: -1px; } .flag-circle.euro:before { background: url(../img/eu-flag.svg) 50% 50% no-repeat; background-size: 24px auto; } .flag-circle.usd:before { background: url(../img/us.svg) 50% 50% no-repeat; background-size: 24px auto; } .flag-circle.gbp:before { background: url(../img/en.svg) 50% 50% no-repeat; background-size: 24px auto; } .flag-circle.hrk:before { background: url(../img/hr.svg) 50% 50% no-repeat; background-size: 24px auto; } .search-currency-wrapper .search-mobile { display: none; } .search-currency-wrapper .fav-label { position: relative; top: 1px; } .main-nav { padding: 20px 0; position: fixed; z-index: 11; width: 100%; background: #fff; top: 41px; left: 0; right: 0; -webkit-transition: all .3s ease-out; transition: all .3s ease-out; } .main-nav .container { position: relative; } .main-nav .logo { display: block; float: left; } .main-nav .logo img { width: 100px; height: 85px; display: block; -webkit-transition: all .3s ease-out; transition: all .3s ease-out; } .main-nav.fixed { top: 0; padding: 10px 0; /*box-shadow: 0 15px 20px rgba(0,0,0,.2);*/ border-bottom: 1px solid #e6e6e6; } .main-nav.fixed .nav-list { margin: 40px 0 0 0; } .main-nav.fixed .logo img { width: 80px; height: 68px; } .main-nav.fixed .search-wrapper { top: 75px; } .fixed .submenu { top: 88px; } .nav-list { padding: 0; margin: 56px 0 0 0; list-style-type: none; display: block; float: right; } .nav-list .mobile-logo, .nav-list .mobile-currency, .nav-list .close-btn { display: none; } .nav-list li { display: inline-block; margin: 0 50px 0 0; } .nav-list li:last-child { margin: 0; } .nav-list li a { font-size: 14px; font-weight: 400; color: #191919; position: relative; text-transform: uppercase; -webkit-transition: all .3s ease-out; transition: all .3s ease-out; } .nav-list li a:hover, .nav-list li a:focus, .nav-list li a:active { text-decoration: none; color: #EF481E; } .nav-list li a.orange-btn { color: #ffffff; display: inline-block; margin: 0 auto; text-align: center; } .nav-list li a.show-submenu:after { content: ''; opacity: 0; -webkit-transition: all .3s ease-out; transition: all .3s ease-out; } .nav-list li.active a.show-submenu:after { content: ''; width: 42px; height: 19px; opacity: 1; display: block; background: url(../img/menu-triangle.svg) 50% 50% no-repeat; background-size: 42px auto; position: absolute; bottom: -30px; left: 0; margin: 0 auto; right: 0; -webkit-transition: all .3s ease-out; transition: all .3s ease-out; } .fixed .nav-list li.active a.show-submenu:after { bottom: -25px; } .submenu { display: none; position: fixed; top: 164px; left: 0; right: 0; width: 100%; background: #FCFCFC; padding: 40px 0; margin: 0; z-index: 4; list-style-type: none; box-shadow: 0 25px 20px rgba(0,0,0,.2); } .submenu li { display: block; margin: 0 0 20px 0; } .nav-list .submenu a { color: #191919; text-transform: none; } .nav-list .submenu a .orange { color: #EF481E; display: inline-block; width: auto; } .submenu h2 { font-size: 28px; font-weight: 700; color: #253450; } .submenu .submenu-wrapper { width: 750px; display: block; margin: 0 auto; } .submenu .submenu-wrapper .submenu-list { padding: 0; margin: 20px 0 50px 0; -webkit-column-count: 3; -moz-column-count: 3; column-count: 3; column-gap: 30px; -webkit-column-gap: 30px; -moz-column-gap: 30px; /*display: inline-block;*/ width: 100%; } .mobile-nav { display: none; } .search-wrapper { display: none; position: absolute; right: 0; top: 90px; overflow-y: auto; box-shadow: 0 10px 30px rgba(0,0,0,.2); z-index: 5; width: 240px; background: -moz-linear-gradient(328deg, rgba(236,40,33,1) 0%, rgba(236,40,33,1) 26%, rgba(243,152,27,1) 100%); /* ff3.6+ */ background: -webkit-gradient(linear, left top, right bottom, color-stop(0%, rgba(236,40,33,1)), color-stop(26%, rgba(236,40,33,1)), color-stop(100%, rgba(243,152,27,1))); /* safari4+,chrome */ background: -webkit-linear-gradient(328deg, rgba(236,40,33,1) 0%, rgba(236,40,33,1) 26%, rgba(243,152,27,1) 100%); /* safari5.1+,chrome10+ */ background: -o-linear-gradient(328deg, rgba(236,40,33,1) 0%, rgba(236,40,33,1) 26%, rgba(243,152,27,1) 100%); /* opera 11.10+ */ background: linear-gradient(122deg, rgba(236,40,33,1) 0%, rgba(236,40,33,1) 26%, rgba(243,152,27,1) 100%); /* w3c */ } .search-wrapper.fixed-search { top: 84px; } .search-wrapper .search-input { position: relative; } .search-wrapper input { background: #ededed; border: 1px solid #dbdbdb; width: 75%; display: block; float: left; padding: 13px 10px; color: #484848; outline: none; font-size: 15px; border-radius: 0; -webkit-appearance: none; } .search-wrapper .search-btn { position: relative; cursor: pointer; width: 25%; height: 50px; display: block; border: none; background: -moz-linear-gradient(328deg, rgba(236,40,33,1) 0%, rgba(236,40,33,1) 26%, rgba(243,152,27,1) 100%); /* ff3.6+ */ background: -webkit-gradient(linear, left top, right bottom, color-stop(0%, rgba(236,40,33,1)), color-stop(26%, rgba(236,40,33,1)), color-stop(100%, rgba(243,152,27,1))); /* safari4+,chrome */ background: -webkit-linear-gradient(328deg, rgba(236,40,33,1) 0%, rgba(236,40,33,1) 26%, rgba(243,152,27,1) 100%); /* safari5.1+,chrome10+ */ background: -o-linear-gradient(328deg, rgba(236,40,33,1) 0%, rgba(236,40,33,1) 26%, rgba(243,152,27,1) 100%); /* opera 11.10+ */ background: linear-gradient(122deg, rgba(236,40,33,1) 0%, rgba(236,40,33,1) 26%, rgba(243,152,27,1) 100%); /* w3c */ } .search-wrapper .search-btn:after { content: ''; width: 100%; height: 50px; display: block; position: absolute; background: url(../img/search-ico-menu.svg) 50% 50% no-repeat; background-size: 20px auto; top: 0; left: 0; right: 0; } /* search form */ ::-webkit-input-placeholder { color: #444444 !important; } ::-moz-placeholder { color: #444444 !important; } :-ms-input-placeholder { color: #444 !important; } :-moz-placeholder { color: #444444 !important; } .search-item { position: relative; display: inline-block; margin-bottom: 25px; } .search-item:after { content: ''; z-index: 1; top: 0; bottom: 120px; left: 0; -webkit-box-shadow: inset 0 0 90px 0 rgba(0, 0, 0, .08); box-shadow: inset 0 0 90px 0 rgba(0, 0, 0, .08); position: absolute; width: 100%; height: 100%; -webkit-transition: all .3s ease-out; transition: all .3s ease-out; } .search-item:hover:after { -webkit-box-shadow: inset 0 0 90px 0 rgba(0, 0, 0, .3); box-shadow: inset 0 0 90px 0 rgba(0, 0, 0, .3); } .search-item img { display: block; } .search-item-name { font-size: 13px; font-weight: 400; color: #425263; padding: 15px; position: absolute; bottom: 0; left: 0; right: 0; } .booking-search { background: #ffffff; box-shadow: 0 10px 50px rgba(0,0,0,.2); padding: 40px 60px; width: 1270px; height: 135px; margin: 0 auto; display: block; border-radius: 6px; position: relative; /* -webkit-transform: translateY(-50%); transform: translateY(-50%); */ -webkit-transform: translateY(-20%); transform: translateY(-20%); z-index: 2; -webkit-transition: all .3s ease-out; transition: all .3s ease-out; } .booking-search.sticky { height: 70px; width: 100% !important; border-radius: 0; right: 0; left: 0 !important; z-index: 10; padding: 10px 20px; -webkit-transform: none; transform: none; } .booking-search.category.sticky { height: 70px; padding: 10px 20px; box-shadow: 0 10px 50px rgba(0,0,0,.2); } .booking-search.sticky.hide, .anchor-nav.sticky.hide, .search-wrapper-all.sticky.hide { -webkit-transform: translateY(-200px); transform: translateY(-200px); } .search-wrapper-all { -webkit-transition: all .3s ease-out; transition: all .3s ease-out; } .booking-search.category { box-shadow: none; border-radius: 0; width: 100%; /*height: auto;*/ height: 110px; padding: 20px 0 40px 0; -webkit-transform: none; transform: none; } .booking-search.category select { min-height: 50px; width: 200px; visibility: hidden; } .swiper-button-prev:after, .swiper-container-rtl .swiper-button-next:after, .swiper-button-next:after, .swiper-container-rtl .swiper-button-prev:after { content: ''; background: #ffffff url(../img/arrow-right-black.svg) 50% 50% no-repeat; background-size: 16px auto; width: 32px; height: 32px; border-radius: 50%; display: block; box-shadow: 3px 0 15px rgba(0,0,0,.2); -webkit-transform: rotate(180deg); transform: rotate(180deg); } .swiper-button-next:after, .swiper-container-rtl .swiper-button-prev:after { -webkit-transform: rotate(0); transform: rotate(0); } .swiper-button-prev, .swiper-container-rtl .swiper-button-next { left: -65px; } .swiper-button-next, .swiper-container-rtl .swiper-button-prev { right: -65px; } .swiper-button-prev, .swiper-button-next { width: 40px; height: 40px; z-index: 9; } .swiper-button-prev:focus, .swiper-button-next:focus { outline: none; } .mini-slider-wrapper .swiper-pagination { -webkit-transform: translateX(-50%); transform: translateX(-50%); left: 50%; bottom: 10px; } .swiper-pagination-bullet { background: #fff; opacity: 0.7; width: 9px; height: 9px; } .swiper-pagination-bullet-active { background: #ffffff; opacity: 1; } .swiper-pagination-bullet { margin: 0 3px; } .main-villa-holder, .category-img-wrapper { position: relative; display: inline-block; width: 100%; margin: 124px 0 0 0; } .main-villa-holder a, .main-villa-holder picture, .main-villa-holder img { position: relative; display: inline-block; width: 100%; height: auto; } .main-villa-holder a { display: inline-block; } .main-villa-holder a:after { content: ''; position: absolute; top: 0; left: 0; right: 0; display: block; height: 100%; width: 100%; background: rgba(0,0,0,.2); z-index: 3; } .main-villa-holder .swiper-button-prev, .main-villa-holder .swiper-container-rtl .swiper-button-next { left: 30px; } .main-villa-holder .swiper-button-next, .main-villa-holder .swiper-container-rtl .swiper-button-prev { right: 30px; } .villa-badge { position: absolute; top: 60px; right: 120px; display: block; width: 88px; z-index: 4; } .villa-badge img { width: 100%; } /*.slider-img { width: 100%; }*/ .villa-info { position: absolute; width: 1140px; margin: 0 auto; left: 15px; right: 0; display: block; bottom: 30%; color: #ffffff; z-index: 4; font-size: 28px; } .villa-info h2 { font-weight: 700; text-shadow: 0 2px 2px rgba(0,0,0,.8); margin: 0; font-size: 2.8rem; } .villa-info h3 { font-weight: 400; margin: 10px 0 0 0; font-size: 28px; text-shadow: 0 2px 2px rgba(0,0,0,.8); line-height: 1.6; } .villa-info h3 strong { font-weight: 700; } .special-offer-mobile { display: none; } .special-offer { padding: 0 0 70px 0; } .title-mobile { display: none; } .home-section h2 { margin: 0 0 40px 0; } .breadcrumbs { display: block; float: left; } .breadcrumbs ul { width: 100%; display: inline-block; } .breadcrumbs ul li { display: inline-block; margin: 0 10px; position: relative; } .breadcrumbs ul li:first-child { margin: 0 10px 0 0; } .breadcrumbs ul li:after { content: ''; position: absolute; width: 5px; height: 9px; background: url(../img/chevron-right-orange.svg) 50% 50% no-repeat; background-size: 5px auto; right: -15px; top: 7px; } .breadcrumbs ul li:last-child:after { display: none; } .breadcrumbs ul li a, .breadcrumbs ul li div { font-size: 14px; color: #EF481E; font-weight: 400; } .breadcrumbs ul li a:hover, .breadcrumbs ul li a:active, .breadcrumbs ul li a:focus { color: #EF481E; } .breadcrumbs ul li:last-child a, .breadcrumbs ul li.active span { font-weight: 400; color: #484848; } .breadcrumbs ul li.active a { cursor: default; } .breadcrumbs ul li.active a:hover, .breadcrumbs ul li.active a:active, .breadcrumbs ul li.active a:focus { text-decoration: none; } select { border-radius: 6px; } .location-wrapper { width: 360px; } .lokacije { width: 360px; display: inline-block; } .booking-search .select2-container, .booking-search .select2-selection { width: 100% !important; } .select2-container .select2-selection--single, .date-picker-input { height: 50px; background: #FFFFFF; /*border: 1px solid #DADCE1;*/ border: 1px solid #ced4da; font-size: 14px; font-weight: 400; } .select2-container--default .select2-selection--single .select2-selection__rendered { line-height: 50px; padding: 0 15px; } .select2-container--default .select2-selection--single .select2-selection__arrow { height: 50px; display: none; } .select2-container--default .select2-selection--single .select2-selection__placeholder { color: #484848; } .pin-map { position: relative; padding: 0 0 0 35px; } .location-wrapper { position: relative; } .location-wrapper:after { content: ''; position: absolute; width: 40px; height: 25px; display: block; top: 12px; left: 15px; background: url(../img/location-villa-ico.svg) 50% 50% no-repeat; background-size: 40px auto; } .select2-container--default .select2-results__option--highlighted[aria-selected] { background: #eaeaea; color: #484848; } .date { width: 250px; position: relative; margin: 0 15px; } .date:before { content: ''; width: 22px; height: 20px; background: url(../img/calendar-ico.svg) 50% 50% no-repeat; background-size: 18px auto; position: absolute; left: 15px; top: 16px; display: block; } .date-picker-input { width: 250px; border-radius: 4px; padding: 15px 0 15px 50px; /*border: 2px solid #0054C7;*/ border: 1px solid #ced4da; } .people-num { width: 250px; } .people { width: 250px; display: inline-block; } .people-ico { position: relative; padding: 0 0 0 35px; } .people-ico:after { content: ''; position: absolute; width: 23px; height: 24px; display: block; top: -2px; left: 0; background: url(../img/person-blue-ico.svg) 50% 50% no-repeat; background-size: 19px auto; } .adv-search { position: relative; width: 140px; height: 50px; border: 1px solid #DADCE1; border-radius: 4px; margin: 0 0 0 15px; padding: 13px 0 13px 55px; color: #484848; font-weight: 400; } .adv-search:hover { text-decoration: none; } .adv-search:before { content: ''; position: absolute; left: 15px; top: 11px; width: 25px; height: 26px; display: block; background: url(../img/filters-ico.svg) 50% 50% no-repeat; background-size: 20px auto; } .search-btn-booking { position: relative; border: none; border-radius: 4px; margin-left: 15px; width: 80px; height: 50px; background: -moz-linear-gradient(328deg, rgba(236,40,33,1) 0%, rgba(236,40,33,1) 26%, rgba(243,152,27,1) 100%); /* ff3.6+ */ background: -webkit-gradient(linear, left top, right bottom, color-stop(0%, rgba(236,40,33,1)), color-stop(26%, rgba(236,40,33,1)), color-stop(100%, rgba(243,152,27,1))); /* safari4+,chrome */ background: -webkit-linear-gradient(328deg, rgba(236,40,33,1) 0%, rgba(236,40,33,1) 26%, rgba(243,152,27,1) 100%); /* safari5.1+,chrome10+ */ background: -o-linear-gradient(328deg, rgba(236,40,33,1) 0%, rgba(236,40,33,1) 26%, rgba(243,152,27,1) 100%); /* opera 11.10+ */ background: linear-gradient(122deg, rgba(236,40,33,1) 0%, rgba(236,40,33,1) 26%, rgba(243,152,27,1) 100%); /* w3c */ } .search-btn-booking:after { content: ''; width: 100%; height: 50px; display: block; position: absolute; background: url(../img/search-ico-white.svg) 50% 50% no-repeat; background-size: 22px auto; top: 0; left: 0; right: 0; } .daterangepicker td.active, .daterangepicker td.active:hover, .daterangepicker td.active:focus, .daterangepicker td.active:active, .daterangepicker td.in-range.end-date { background-color: #12b356; color: #ffffff; } .daterangepicker td.in-range { background-color: #8ee59f; } .daterangepicker .drp-buttons .btn.btn-primary { border: transparent; background: -moz-linear-gradient(328deg, rgba(236,40,33,1) 0%, rgba(236,40,33,1) 26%, rgba(243,152,27,1) 100%); background: -webkit-gradient(linear, left top, right bottom, color-stop(0%, rgba(236,40,33,1)), color-stop(26%, rgba(236,40,33,1)), color-stop(100%, rgba(243,152,27,1))); background: -webkit-linear-gradient(328deg, rgba(236,40,33,1) 0%, rgba(236,40,33,1) 26%, rgba(243,152,27,1) 100%); background: -o-linear-gradient(328deg, rgba(236,40,33,1) 0%, rgba(236,40,33,1) 26%, rgba(243,152,27,1) 100%); background: linear-gradient(122deg, rgba(236,40,33,1) 0%, rgba(236,40,33,1) 26%, rgba(243,152,27,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#EC2821', endColorstr='#F3981B',GradientType=1 ); } .villa-item { position: relative; } .villa-item img { border-radius: 6px; } .discount { position: absolute; display: block; background: #28a745; color: #ffffff; left: 0; top: 20px; z-index: 2; font-weight: 700; padding: 5px 10px; text-align: center; border-top-right-radius: 6px; border-bottom-right-radius: 6px; font-size: 20px; background: linear-gradient(45deg, rgba(236,40,33,1) 0%, rgba(243,152,27,1) 100%); } .discount .percent { display: block; font-size: 18px; font-weight: 700; } .discount.blue-tag { text-transform: uppercase; background: #0068F7; } .discount-dates { position: absolute; display: block; background: #EF481E; color: #ffffff; left: 0; top: 65px; z-index: 2; font-weight: 400; padding: 5px 10px; text-align: center; font-size: 12px; border-top-right-radius: 6px; border-bottom-right-radius: 6px; } .add-fav { width: 32px; height: 32px; display: block; position: absolute; top: 20px; right: 20px; z-index: 2; background: #ffffff url(../img/fav-outline-ico.svg) 50% 53% no-repeat; background-size: 17px auto; border-radius: 100%; cursor: pointer; } .add-fav.active { background: #ffffff url(../img/fav-ico.svg) 50% 53% no-repeat; background-size: 17px auto; } .villa-cat-location { display: inline-block; margin: 15px 0; width: 100%; } .villa-cat-tag { background: #CBE9FF; display: inline-block; border-radius: 6px; padding: 5px 10px; color: #484848; } .villa-cat-tag:hover, .villa-cat-tag:focus, .villa-cat-tag:active { text-decoration: none; color: #484848; } .villa-cat-tag.grey { background: #F7F7F7; } .villa-location { position: relative; display: block; float: right; color: #484848; padding: 0 0 0 20px; top: 6px; } .villa-location:before { content: ''; position: absolute; left: 0; top: 1px; width: 14px; height: 17px; display: block; background: url(../img/location-ico.svg) 50% 50% no-repeat; background-size: 13px auto; } .villa-item h2, .villa-item h3 { font-size: 18px; font-weight: 700; color: #11223F; line-height: 1.4; margin: 0; } .villa-item a h2 { -webkit-transition: all .3s ease-out; transition: all .3s ease-out; } .villa-item a:hover, .villa-item a:focus, .villa-item a:active { text-decoration: none; } .villa-item a:hover h2, .villa-item a:focus h2, .villa-item a:active h2 { color: #ec2821; } .rate { display: inline-block; width: 100%; margin: 10px 0; } .rate-price { display: inline-block; width: 100%; } .rate-price .rate { display: block; float: left; width: auto; } .rate-price .price { display: block; float: right; position: relative; top: 10px; margin: 0; } .rate-num { display: inline-block; color: #11223F; border-radius: 6px; padding: 2px 7px; font-weight: 700; background: -moz-linear-gradient(328deg, rgb(246, 193, 0) 0%, rgb(250, 242, 0) 26%, rgb(252, 225, 124) 100%); background: -webkit-gradient(linear, left top, right bottom, color-stop(0%, rgb(250, 242, 0)), color-stop(26%, rgb(250, 242, 01)), color-stop(100%, rgb(252, 225, 124))); background: -webkit-linear-gradient(328deg, rgb(246, 193, 0) 0%, rgb(250, 242, 0) 26%, rgb(252, 225, 124) 100%); background: -o-linear-gradient(328deg, rgb(246, 193, 0) 0%, rgb(250, 242, 0) 26%, rgb(252, 225, 124) 100%); background: linear-gradient(122deg, rgb(246, 193, 0) 0%, rgb(250, 242, 0) 26%, rgb(252, 225, 124) 100%); } .price strong, .accommodation-page .other-accommodation-units .price strong { font-size: 18px; color: #11223F; } .price, .accommodation-page .other-accommodation-units .price { font-size: 16px; } .price { margin: 10px 0 0 0; text-align: right; } .price-rate-wrapper .price { margin: 0; } .special-offer .orange-btn { margin: 30px 0 0 0; } .orange-btn.arrow:after { content: ''; width: 18px; height: 18px; background: url(../img/arrow-right-white.svg) 50% 50% no-repeat; background-size: 18px auto; display: block; float: right; position: relative; margin: 0 0 0 10px; top: 4px; } .orange-btn.arrow:hover:after { background: url(../img/arrow-right-white.svg) 50% 50% no-repeat; background-size: 18px auto; animation: arrow-animation .8s ease-in-out infinite; } @keyframes arrow-animation { 0%, 100% { -webkit-transform: translate(0, 0); transform: translate(0, 0); } 50% { -webkit-transform: translate(10px, 0); transform: translate(10px, 0); } } .features h3 { font-size: 18px; font-weight: 700; color: #11223F; word-break: break-word; } .features-list li { width: 25%; margin: 0 15px 0 0; } .features-list li:last-child { margin: 0; } .feature-item { text-align: center; border: 1px solid #DADCE1; border-radius: 6px; width: 100%; height: 100%; padding: 35px 0; display: inline-block; } .feature-item:hover, .feature-item:focus, .feature-item:active { text-decoration: none; border: 1px solid #ffffff; box-shadow: 0 5px 16px rgba(0,0,0,.16); } .feature-item img { display: block; margin: 0 auto 30px auto; } .big-three { padding: 90px 0; } .big-three-item a { color: #ffffff; } .big-three-item a:hover, .big-three-item:hover { text-decoration: none; color: #ffffff; } .big-three-item { border-radius: 6px; display: block; background-repeat: no-repeat; background-size: cover; background-position: 50% 50%; color: #ffffff; position: relative; padding: 40px; } .big-three-item:after { content: ''; opacity: 0; position: absolute; left: 0; right: 0; bottom: 0; top: 0; display: block; border-radius: 6px; /* background: rgba(0,0,0,.5); */ background: rgba(235, 54, 41, 0.6); z-index: 1; -webkit-transition: all .3s ease-out; transition: all .3s ease-out; } .big-three-item:hover:after { content: ''; opacity: 1; } .big-three-name, .big-three-item h2, .big-three-item h3 { position: relative; z-index: 2; } .big-three-item h2 { font-size: 28px; font-weight: 700; } .big-three-item h3 { font-size: 18px; font-weight: 700; } .big-three-item.left { height: 545px; } .big-three-item.right { height: 255px; } .big-three-item.right:first-of-type { margin-bottom: 35px; } .big-three-item .orange-btn { position: absolute; bottom: 40px; left: 40px; z-index: 2; } .region-item-img { position: relative; display: inline-block; } .region-item-img:after { content: ''; position: absolute; display: block; left: 0; right: 0; bottom: 0; top: 0; z-index: 1; background: -moz-linear-gradient(90deg, rgba(0,0,0,0.4) 0%, rgba(0,0,0,0.2) 25%, rgba(0,0,0,0) 59%); /* ff3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(41%, rgba(0,0,0,0)), color-stop(75%, rgba(0,0,0,0.2)), color-stop(100%, rgba(0,0,0,0.4))); /* safari4+,chrome */ background: -webkit-linear-gradient(90deg, rgba(0,0,0,0.4) 0%, rgba(0,0,0,0.2) 25%, rgba(0,0,0,0) 59%); /* safari5.1+,chrome10+ */ background: -o-linear-gradient(90deg, rgba(0,0,0,0.4) 0%, rgba(0,0,0,0.2) 25%, rgba(0,0,0,0) 59%); /* opera 11.10+ */ background: linear-gradient(0deg, rgba(0,0,0,0.4) 0%, rgba(0,0,0,0.2) 25%, rgba(0,0,0,0) 59%); /* w3c */ } .region-item-img h3 { position: absolute; left: 0; right: 0; text-align: center; margin: 0; color: #ffffff; font-size: 24px; font-weight: 700; z-index: 2; text-shadow: 0 3px 10px rgba(0,0,0,1); -webkit-transform: translateY(-60px); transform: translateY(-60px); -webkit-transition: all .6s cubic-bezier(.39,.05,0,1.04); transition: all .6s cubic-bezier(.39,.05,0,1.04); } .region-item-img:hover h3 { -webkit-transform: translateY(-90px); transform: translateY(-90px); } .region-item-img img { display: block; border-radius: 6px; } .region-item-desc { color: #11223F; font-size: 14px; margin: 20px 0 0 0; display: inline-block; line-height: 1.8; } .region-item-desc:hover { text-decoration: none; color: #11223F; } .region-item-desc h4 { font-size: 18px; font-weight: 700; } /***** newsletter *****/ .vertical-center { margin: 0; position: absolute; right: 0; left: 0; top: 50%; -ms-transform: translateY(-50%); transform: translateY(-50%); } .ct-newsletter-wrapper { position: relative; background-image: url(../UserImgs/newsletter-background.jpg); background-repeat: no-repeat; background-size: cover; background-position: 50% 50%; height: 280px; border-radius: 6px; } .ct-newsletter-logo img { width: 65px; position: absolute; top: -40px; left: 35px; } .ct-newsletter-content { max-width: 80%; margin: 0 0 0 auto; } .ct-newsletter-content h2 { line-height: 30px; color: #11223F; margin-bottom: 10px; } .ct-newsletter-content p { font-size: 14px; font-weight: 700; line-height: 15px; color: #11223F; text-transform: uppercase; margin-bottom: 20px; } .ct-form input { border-radius: 6px; width: 100%; padding: 10px; outline: none; border: none; display: block; } .ct-form input::placeholder { color: #7F8898 !important; } .ct-form .ct-form-btn { background: -webkit-linear-gradient(328deg, rgba(236,40,33,1) 0%, rgba(236,40,33,1) 26%, rgba(243,152,27,1) 100%); background: linear-gradient( 122deg, rgba(236,40,33,1) 0%, rgba(236,40,33,1) 26%, rgba(243,152,27,1) 100%); padding: 5px 20px; display: inline-block; border: none; border-radius: 6px; line-height: 30px; font-size: 16px; color: #fff; font-weight: 500; } footer { margin: 60px 0 0 0; padding: 50px 0 30px 0; background: #F7F7F7; } footer a { color: #484848; } .footer-links li { margin: 0 0 10px 0; } .copyright { margin: 20px 0 0 0; border-top: 1px solid #C0CFD8; padding: 25px 0 0 0; text-align: center; color: #939EA4; } .copyright img { width: 65px; height: 54px; display: block; margin: 0 auto 10px auto; } .payment-cards { margin: 30px 0 0 0; } .payment-cards li, .partners li { display: block; float: left; margin: 0 40px 0 0; } .payment-cards li:last-child, .partners li:last-child { margin: 0; } .top { position: relative; display: inline-block; width: 100%; text-align: right; color: #EF481E; padding: 0 50px 0 0; } .top:after { content: ''; position: absolute; right: 0; top: -5px; width: 32px; height: 32px; display: block; background: url(../img/top-ico.svg) 50% 50% no-repeat; background-size: 32px auto; } .dark-overlay { display: none; position: fixed; left: 0; top: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.7); z-index: 100; } .close { font-size: 2.5rem; } .modal .orange-btn { border: none; padding: 10px 30px; } .modal .grey-btn { background: #878787; padding: 10px 30px; margin: 0 10px 0 0; border: none; color: #ffffff; margin: 0; border-radius: 7px; font-weight: 400; font-size: 16px; } .modal label { display: block; font-weight: 700; } .modal .select2-container { width: 100% !important; } /* custom checkboxes */ ul.ks-cboxtags { list-style: none; padding: 10px 0 0 0; } ul.ks-cboxtags li { display: inline; } ul.ks-cboxtags li label { display: inline-block; background: #eaeaea; color: #484848; border-radius: 25px; white-space: nowrap; margin: 5px 3px 5px 0; -webkit-touch-callout: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-tap-highlight-color: transparent; -webkit-transition: all .2s ease-in-out; transition: all .2s ease-in-out; } ul.ks-cboxtags li label { padding: 8px 12px; cursor: pointer; } ul.ks-cboxtags li label::before { content: ''; position: relative; display: inline-block; padding: 0; top: 2px; margin: 0 6px 0 0; width: 14px; height: 14px; background: url(../img/add.svg) 50% 50% no-repeat; background-size: 12px auto; -webkit-transition: transform .3s ease-out; transition: transform .3s ease-out; } ul.ks-cboxtags li input[type="checkbox"]:checked + label::before { content: ''; display: inline-block; position: relative; width: 14px; height: 14px; background: url(../img/check-white.svg) 50% 50% no-repeat; background-size: 14px auto; -webkit-transform: rotate(-360deg); transform: rotate(-360deg); -webkit-transition: transform .3s ease-in; transition: transform .3s ease-in; } ul.ks-cboxtags li input[type="checkbox"]:checked + label { color: #fff; background: -moz-linear-gradient(328deg, rgba(236,40,33,1) 0%, rgba(236,40,33,1) 26%, rgba(243,152,27,1) 100%); /* ff3.6+ */ background: -webkit-gradient(linear, left top, right bottom, color-stop(0%, rgba(236,40,33,1)), color-stop(26%, rgba(236,40,33,1)), color-stop(100%, rgba(243,152,27,1))); /* safari4+,chrome */ background: -webkit-linear-gradient(328deg, rgba(236,40,33,1) 0%, rgba(236,40,33,1) 26%, rgba(243,152,27,1) 100%); /* safari5.1+,chrome10+ */ background: -o-linear-gradient(328deg, rgba(236,40,33,1) 0%, rgba(236,40,33,1) 26%, rgba(243,152,27,1) 100%); /* opera 11.10+ */ background: linear-gradient(122deg, rgba(236,40,33,1) 0%, rgba(236,40,33,1) 26%, rgba(243,152,27,1) 100%); /* w3c */ -webkit-transition: all .1s ease-in; transition: all .1s ease-in; } ul.ks-cboxtags li input[type="checkbox"] { position: absolute; opacity: 0; } .reset-adv-search { font-weight: 700; } .noUi-horizontal .noUi-handle { width: 30px; height: 30px; border-radius: 50%; top: -8px; outline: none; } .noUi-handle:before, .noUi-handle:after { display: none; } .noUi-touch-area { background: #f0691d; border-radius: 50%; outline: none; } #price-day { margin: 23px 0 0 0; } .price-day-val { display: block; text-align: center; padding: 5px 10px; border-radius: 25px; font-weight: 700; margin: 15px 0; color: #ffffff; background: -moz-linear-gradient(328deg, rgba(236,40,33,1) 0%, rgba(236,40,33,1) 26%, rgba(243,152,27,1) 100%); /* ff3.6+ */ background: -webkit-gradient(linear, left top, right bottom, color-stop(0%, rgba(236,40,33,1)), color-stop(26%, rgba(236,40,33,1)), color-stop(100%, rgba(243,152,27,1))); /* safari4+,chrome */ background: -webkit-linear-gradient(328deg, rgba(236,40,33,1) 0%, rgba(236,40,33,1) 26%, rgba(243,152,27,1) 100%); /* safari5.1+,chrome10+ */ background: -o-linear-gradient(328deg, rgba(236,40,33,1) 0%, rgba(236,40,33,1) 26%, rgba(243,152,27,1) 100%); /* opera 11.10+ */ background: linear-gradient(122deg, rgba(236,40,33,1) 0%, rgba(236,40,33,1) 26%, rgba(243,152,27,1) 100%); /* w3c */ } .mobile-btn-name { display: none; } .breadcrumbs-show-map { margin: 20px 0 0 0; } .show-map { position: relative; line-height: 32px; color: #000000; font-weight: 400; } .show-map:before { content: ''; display: block; float: left; margin: 0 20px 0 0; width: 32px; height: 32px; background: url(../img/show-map.svg) 50% 50% no-repeat; background-size: 32px auto; } .show-map:hover, .show-map:focus, .show-map:active { text-decoration: none; } .villa-wrapper { margin: 0 0 50px 0; display: inline-block; width: 100%; } .villa-wrapper .villa-item { width: 360px; display: block; float: left; } .category-img { position: relative; } .category-img:after { content: ''; position: absolute; width: 100%; height: 100%; top: 0; bottom: 0; left: 0; right: 0; z-index: 1; display: block; border-radius: 6px; background: rgb(0,0,0); background: -moz-linear-gradient(66deg, rgba(0,0,0,0.4) 0%, rgba(0,0,0,0) 65%); background: -webkit-linear-gradient(66deg, rgba(0,0,0,0.4) 0%, rgba(0,0,0,0) 65%); background: linear-gradient(66deg, rgba(0,0,0,0.4) 0%, rgba(0,0,0,0) 65%); } .category-img picture, .category-img picture source { width: 100%; } .category-img picture img { border-radius: 6px; width: 100%; } .category-img .villa-badge { top: 25px; right: 25px; } .category-info { position: absolute; left: 50px; display: block; width: 380px; bottom: 20%; z-index: 2; color: #ffffff; } .category-info h1 { font-size: 24px; font-weight: 700; margin: 0 0 15px 0; text-shadow: 0 3px 10px rgba(0,0,0,1); } .category-info h2 { font-size: 14px; font-weight: 700; margin: 0; line-height: 1.8; text-shadow: 0 3px 10px rgba(0,0,0,1); } .category-page-sort { padding: 0 0 30px 0; } .num-units { font-weight: 700; height: 40px; } .sorting { height: 40px; } .page-nav input { margin: 0 15px; text-align: center; width: 30px; height: 30px; border: 1px solid #D3D3D3; background: none; color: #484848; font-weight: 700; border-radius: 5px; } .page-nav a { position: relative; top: 3px; color: #39434B; font-size: 18px; } .icon-direction-right, .icon-direction-left { content: ''; width: 12px; height: 12px; display: block; background: url(../img/chevron-down.svg) 50% 50% no-repeat; background-size: 12px auto; position: absolute; right: -30px; top: 6px; -webkit-transform: rotate(-90deg); transform: rotate(-90deg); } .icon-direction-left { transform: rotate(-270deg); left: -30px; right: auto; } .page-nav.bottom { display: inline-block; width: 100%; text-align: center; padding: 0 30px 0 0; } .sorting .select2-selection--single, .sorting .date-picker-input { height: 30px; } .sorting .select2-selection--single .select2-selection__rendered { line-height: 30px; padding: 0 25px 0 10px; } .sorting .select2-selection--single .select2-selection__arrow, .reservation-group .select2-selection--single .select2-selection__arrow { height: 100%; display: block; width: 12px; right: 10px; display: block; background: url(../img/chevron-down.svg) 50% 50% no-repeat; background-size: 12px auto; } .sorting-label { margin: 0 10px 0 0; /*position: relative;*/ display: inline-block; /*top: 2px;*/ min-height: 30px; } .sorting select { min-height: 30px; display: inline-block; vertical-align: middle; visibility: hidden; } .select2-container--default .select2-selection--single .select2-selection__arrow b { display: none; } .villa-list-right { padding: 0; display: block; float: right; width: 65%; } .villa-list-right .villa-cat-location { margin: 0 0 15px 0; position: relative; } .villa-list-right .cat-location { display: block; } .villa-list-right .villa-location { float: none; top: 0; display: inline-block; margin: 0 0 0 15px; } .villa-list-right h2 { font-size: 18px; font-weight: 700; color: #253450; } .villa-list-right .desc { font-size: 14px; line-height: 1.8; } .villa-list-right .villa-id { margin: 0 0 0 15px; } .icons-list { margin: 15px 0 20px 0; } .icons-list > div { margin: 0; text-align: center; } .people-villa-ico:before, .bathroom-ico:before, .beach-ico:before, .shopping-ico:before, .parking-ico:before, .pet-ico:before, .wifi-ico:before, .rooms:before, .villa-size:before { content: ''; margin: 0 auto 5px auto; display: block; float: none; } .people-villa-ico:before { width: 23px; height: 25px; margin: 0 auto; background: url(../img/person-ico-black.svg) 50% 50% no-repeat; background-size: auto 25px; } .bathroom-ico:before { width: 28px; height: 32px; margin: 0 auto; background: url(../img/shower-ico.svg) 50% 50% no-repeat; background-size: 24px auto; } .beach-ico:before { width: 30px; height: 30px; margin: 0 auto; background: url(../img/distance-sea-ico.svg) 50% 50% no-repeat; background-size: 30px auto; } .shopping-ico:before { width: 30px; height: 28px; margin: 0 auto; background: url(../img/cart-ico.svg) 50% 50% no-repeat; background-size: 30px auto; } .parking-ico:before { width: 30px; height: 30px; margin: 0 auto; background: url(../img/parking-ico.svg) 50% 50% no-repeat; background-size: 30px auto; } .pet-ico:before { width: 21px; height: 19px; margin: 0 auto; background: url(../img/pet-ico.svg) 50% 50% no-repeat; background-size: 21px auto; } .wifi-ico::before { width: 30px; height: 30px; margin: 0 auto; background: url(../img/wifi-ico.svg) 50% 50% no-repeat; background-size: 30px auto; } .rooms:before { width: 30px; height: 30px; margin: 0 auto; background: url(../img/smjestaj-ico.svg) 50% 50% no-repeat; background-size: 30px auto; } .villa-size:before { width: 30px; height: 30px; margin: 0 auto; background: url(../img/apartment-size.svg) 50% 50% no-repeat; background-size: 30px auto; } .accommodation-page .checkin-wrapper, .accommodation-page .checkout-wrapper { height: 20px; } .accommodation-page .checkin-wrapper .checkin-ico, .accommodation-page .checkout-wrapper .checkout-ico { background-size: auto 20px; height: 20px; display: block; float: left; top: 0; margin: 0 10px 0 0; } .price-rate-wrapper .rate { width: 100%; margin: 0; } .price-rate-wrapper .price { width: 100%; } .price-period { display: inline-block; } .category-page .price-rate-wrapper .period { display: inline-block; padding: 5px 5px 5px 35px; margin: 0 20px 0 0; position: relative; color: #11223F; border: 1px solid #96b9e8; border-radius: 5px; } .category-page .price-rate-wrapper .period:hover, .category-page .price-rate-wrapper .period:focus, .category-page .price-rate-wrapper .period:active { text-decoration: none; background: #edf3fc; } .category-page .price-rate-wrapper .period:before { content: ''; width: 22px; height: 20px; background: url(../img/calendar-ico.svg) 50% 50% no-repeat; background-size: 18px auto; position: absolute; left: 5px; top: 7px; display: block; } .load-more-mobile { display: none; } .about-category-bottom { padding: 4px 0 0 0; column-count: 2; column-gap: 40px; line-height: 1.8; } .toggle-booking-search { display: none; } .accommodation-page, .reservation-page { margin: 124px 0 0 0; } .accommodation-gallery { padding: 20px 0 0 0; aspect-ratio: 1112 / 382; } .accommodation-gallery, .accommodation-gallery > * { box-sizing: border-box; } .main-img { position: relative; width: 100%; flex: 0 0 50%; } .accommodation-gallery .villa-badge { bottom: 20px; right: 10px; top: auto; } .accommodation-gallery .thumb-img { display: inline-block; opacity: 1; /*aspect-ratio: 265 / 176;*/ } .accommodation-gallery .thumb-img:hover { opacity: .7; } .accommodation-gallery .thumb-img img { border-radius: 6px; width: 100%; display: block; } .thumbnails { padding: 0 0 0 10px; flex: 0 0 50%; /*display: none;*/ } .thumbnails .thumbnails-row:first-of-type { margin: 0 0 10px 0; } .thumbnails .thumbnails-row a:first-of-type { padding: 0 10px 0 0; } .thumbnails a.thumb-img img { max-width: 259px !important; } .show-gallery { color: #484848; text-decoration: underline; } .accommodation-page .villa-location { top: 0; float: none; display: inline-block; margin: 0 20px; } .accommodation-page h1 { font-size: 24px; font-weight: 700; margin: 0 0 10px 0; color: #11223F; } .accommodation-page .link { color: #484848; text-decoration: underline; } .buttons-review-wrapper { text-align: right; display: inline-block; width: 100%; } .buttons-review-wrapper .outline-btn { margin: 0 10px 0 0; padding: 12px 20px; } /*.buttons-review-wrapper .outline-btn:hover, .buttons-review-wrapper .outline-btn:focus, .buttons-review-wrapper .outline-btn:active { border: 1px solid #ee6828; background: -moz-linear-gradient(328deg, rgba(236,40,33,1) 0%, rgba(236,40,33,1) 26%, rgba(243,152,27,1) 100%); background: -webkit-gradient(linear, left top, right bottom, color-stop(0%, rgba(236,40,33,1)), color-stop(26%, rgba(236,40,33,1)), color-stop(100%, rgba(243,152,27,1))); background: -webkit-linear-gradient(328deg, rgba(236,40,33,1) 0%, rgba(236,40,33,1) 26%, rgba(243,152,27,1) 100%); background: -o-linear-gradient(328deg, rgba(236,40,33,1) 0%, rgba(236,40,33,1) 26%, rgba(243,152,27,1) 100%); background: linear-gradient(122deg, rgba(236,40,33,1) 0%, rgba(236,40,33,1) 26%, rgba(243,152,27,1) 100%); }*/ .buttons-review-wrapper a:last-of-type { margin: 0; } .accommodation-page .rate { font-size: 16px; margin: 20px 0; width: 100%; } .rate a { color: #000000; text-decoration: underline; } /*.accommodation-page .rate-num { font-size: 18px; }*/ .accommodation-page .price { font-size: 20px; margin: 25px 0 0 0; } .accommodation-page .price strong { font-size: 20px; } .accommodation-page .main-desc { line-height: 1.8; } .accommodation-page .content-col-wrapper { max-height: 210px; overflow: hidden; position: relative; -webkit-transition: all .7s ease-out; transition: all .7s ease-out; } .accommodation-page .content-col-wrapper.revealed { max-height: 3000px; } .accommodation-page .content-col-wrapper:after { content: ''; position: absolute; display: block; bottom: 0; left: 0; right: 0; height: 40px; background: -moz-linear-gradient(270deg, rgba(255,255,255,0) 0%, rgba(255,255,255,1) 100%); /* ff3.6+ */ background: -webkit-linear-gradient(270deg, rgba(255,255,255,0) 0%, rgba(255,255,255,1) 100%); /* safari5.1+,chrome10+ */ background: linear-gradient(180deg, rgba(255,255,255,0) 0%, rgba(255,255,255,1) 100%); /* w3c */ } .accommodation-page .content-col-wrapper.revealed:after { display: none; } .main-desc-title { font-weight: 700; font-size: 14px; color: #253450; margin: 30px 0 10px 0; text-transform: uppercase; } .tabs-wrapper { margin: 40px 0 0 0; } .months-ico, .accommodation-ico, .map-ico, .review-ico { display: block; margin: 0 auto 10px auto; height: 26px; } .months-ico { width: 24px; background: url(../img/calendar-ico-black.svg) 50% 50% no-repeat; background-size: 24px auto; } .accommodation-ico { width: 24px; background: url(../img/smjestaj-ico.svg) 50% 50% no-repeat; background-size: 24px auto; } .map-ico { width: 30px; background: url(../img/show-map.svg) 50% 50% no-repeat; background-size: 26px auto; } .review-ico { width: 30px; background: url(../img/thumb-ico.svg) 50% 50% no-repeat; background-size: 28px auto; } .accommodation-tabs { background: #f4f4f4; padding: 10px 0; border-bottom: none; } .accommodation-tabs li { border-right: 1px solid #F6E8D4; } .accommodation-tabs li:last-child { border-right: none; } .accommodation-tabs a { font-weight: 700; color: #253450; text-align: center; position: relative; } .nav-tabs .nav-link.active, .nav-tabs .nav-item.show .nav-link { background: none; border: none; color: #253450; } .nav-tabs .nav-link { border-radius: 0; border: none; } .nav-tabs .nav-link:hover, .nav-tabs .nav-link:focus { border: none; } .accommodation-tabs .nav-link.active:after { content: ''; position: absolute; bottom: -10px; left: 0; right: 0; width: 100%; height: 5px; display: block; border-radius: 6px; background: -moz-linear-gradient(328deg, rgba(236,40,33,1) 0%, rgba(236,40,33,1) 26%, rgba(243,152,27,1) 100%); /* ff3.6+ */ background: -webkit-gradient(linear, left top, right bottom, color-stop(0%, rgba(236,40,33,1)), color-stop(26%, rgba(236,40,33,1)), color-stop(100%, rgba(243,152,27,1))); /* safari4+,chrome */ background: -webkit-linear-gradient(328deg, rgba(236,40,33,1) 0%, rgba(236,40,33,1) 26%, rgba(243,152,27,1) 100%); /* safari5.1+,chrome10+ */ background: -o-linear-gradient(328deg, rgba(236,40,33,1) 0%, rgba(236,40,33,1) 26%, rgba(243,152,27,1) 100%); /* opera 11.10+ */ background: linear-gradient(122deg, rgba(236,40,33,1) 0%, rgba(236,40,33,1) 26%, rgba(243,152,27,1) 100%); /* w3c */ } .accommodation-tabs .nav-link.active:before { content: ''; position: absolute; bottom: -44px; left: 0; right: 0; width: 50px; height: 26px; margin: 0 auto; background: url(../img/menu-triangle.svg) 50% 50% no-repeat; background-size: 50px auto; -webkit-transform: rotate(180deg); transform: rotate(180deg); display: none; } .tabs-wrapper .tab-pane { padding: 45px 0 0 0; } .tabs-wrapper .distance-items, .location-map .distance-items { margin: 20px 0 0 0; -webkit-column-count: 4; -moz-column-count: 4; column-count: 4; column-gap: 30px; -webkit-column-gap: 30px; -moz-column-gap: 30px; display: inline-block; width: 100%; line-height: 2; } .tabs-wrapper .distance-items li, .location-map .distance-items li { display: block; position: relative; /*float: left;*/ padding: 0 0 0 10px; } .tabs-wrapper .distance-items li:before, .location-map .distance-items li:before { content: '-'; position: absolute; left: 0; top: 0; } .tabs-wrapper .more-info .main-desc-title { margin: 0 0 10px 0; } .accommodation-page .checkin-ico, .accommodation-page .checkout-ico { display: inline-block; width: 20px; height: 28px; margin: 0 10px 0 0; position: relative; top: 8px; } .accommodation-page .checkin-ico { background: url(../img/checkin-ico.svg) 50% 50% no-repeat; background-size: 20px auto; } .accommodation-page .checkout-ico { margin: 0 10px 0 30px; background: url(../img/checkout-ico.svg) 50% 50% no-repeat; background-size: 20px auto; } .tabs-wrapper .tab-col, .content-col-wrapper .content-col { width: 50%; padding: 0 40px 0 0; line-height: 1.8; } .content-col-wrapper .content-col { width: auto; } .content-col-wrapper .content-col.first { width: 50%; } .tabs-wrapper .map { display: block; height: 425px; background: #cccccc; } .tabs-wrapper .rate, .tabs-wrapper .rate-num { font-size: 20px; } .tabs-wrapper .rate { margin: 10px 0 60px 0; } .review-item { margin: 0 0 50px 0; position: relative; padding: 0 0 0 70px; line-height: 2; } .review-item .rate-num { font-size: 14px; padding: 2px 15px; } .review-info { display: inline-block; width: 100%; margin: 0 0 15px 0; } .review-name { display: inline-block; font-weight: 700; font-size: 16px; margin: 0 10px 0 0; } .review-date { display: inline-block; width: 100%; margin: 5px 0 0 0; } .review-item .flag-icon.flag-icon-squared { width: 45px; height: 45px; border-radius: 50%; border: 1px solid #cccccc; } .review-item .flag-icon.flag-icon-squared.default-flag:before { content: ''; display: block; width: 45px; height: 45px; background: url(../img/default-flag.svg) 50% 50% no-repeat; background-size: 45px auto; } .review-item .flag-icon { position: absolute; left: 0; top: 0; } /* dostupnost kalendar */ .calendar-carousel { position: relative; } .item-month .month { width: 100%; text-align: center; } .item-month.middle { background: #F7F7F7; border-radius: 6px; padding: 0 10px; } .monthName { text-transform: uppercase; font-weight: 700; padding: 0 0 25px 0; color: #ffffff; background: -moz-linear-gradient(328deg, rgba(236,40,33,1) 0%, rgba(236,40,33,1) 26%, rgba(243,152,27,1) 100%); background: -webkit-gradient(linear, left top, right bottom, color-stop(0%, rgba(236,40,33,1)), color-stop(26%, rgba(236,40,33,1)), color-stop(100%, rgba(243,152,27,1))); background: -webkit-linear-gradient(328deg, rgba(236,40,33,1) 0%, rgba(236,40,33,1) 26%, rgba(243,152,27,1) 100%); background: -o-linear-gradient(328deg, rgba(236,40,33,1) 0%, rgba(236,40,33,1) 26%, rgba(243,152,27,1) 100%); background: linear-gradient(122deg, rgba(236,40,33,1) 0%, rgba(236,40,33,1) 26%, rgba(243,152,27,1) 100%); cursor: default !important; } .item-month th { font-weight: 700; padding: 10px; /*text-transform: uppercase;*/ color: #191919; background: #f4f4f4; } .item-month td { padding: 10px; font-weight: 400; cursor: pointer; border: 1px solid #ededed; opacity: 1 !important; } .item-month td.notAvailable.hover-enable, .item-month td.notAvailable.odabrano-end { background: #daffe1; color: #191919 !important; font-weight: 400; } .item-month td.notAvailable.hover-enable { color: #191919 !important; } .item-month td.notAvailable.hover-enable span { border-bottom: 1px solid #000000; } .notAvailable { color: #191919; } .past.past-white.notAvailable, .notAvailable, .past.past-white.notAvailable-end { color: #9a9a9a; background: #ffe3d5; } .notAvailable-start, .notAvailable-end { color: #9a9a9a; } .past-white { background-color: #daffe1; } .current-day .bubble { color: #ffffff; border-radius: 50%; padding: 9px 10px; background: -moz-linear-gradient(328deg, rgba(236,40,33,1) 0%, rgba(236,40,33,1) 26%, rgba(243,152,27,1) 100%); background: -webkit-gradient(linear, left top, right bottom, color-stop(0%, rgba(236,40,33,1)), color-stop(26%, rgba(236,40,33,1)), color-stop(100%, rgba(243,152,27,1))); background: -webkit-linear-gradient(328deg, rgba(236,40,33,1) 0%, rgba(236,40,33,1) 26%, rgba(243,152,27,1) 100%); background: -o-linear-gradient(328deg, rgba(236,40,33,1) 0%, rgba(236,40,33,1) 26%, rgba(243,152,27,1) 100%); background: linear-gradient(122deg, rgba(236,40,33,1) 0%, rgba(236,40,33,1) 26%, rgba(243,152,27,1) 100%); } .current-day.disabled .bubble { background: #9299A5; } .nije-moguce-odabrati { color: #8a8a8a; cursor: default; } .item-month td.moguci-dolazak, .item-month td.possible-arrival-dates, .item-month td.possible-arrival-dates.notAvailable-end { background: #daffe1; font-weight: 700; opacity: 1 !important; color: #191919!important; } .item-month td.moguci-dolazak span, .item-month td.possible-arrival-dates span { border-bottom: 1px solid #000000; } .item-month td.possible-arrival-dates.odabrano-start span { border-bottom: none; } .item-month .odabrani-termin { padding: 0; /*background: #23c86e; color: #ffffff;*/ } .item-month td.possible-arrival-dates.odabrani-termin span, .item-month .odabrani-termin span { color: #ffffff; background: #0fb158; width: 100%; display: inline-block; padding: 8px 10px; border-bottom: none; } /*.item-month td.possible-arrival-dates.odabrano-start { padding: 0; }*/ .odabrano-start span { border-top-left-radius: 19px; border-bottom-left-radius: 19px; background: #12b356; width: 100%; display: inline-block; padding: 8px 10px; border: none; color: #ffffff; } .odabrano-end span { border-top-right-radius: 19px; border-bottom-right-radius: 19px; background: #12b356; width: 100%; display: inline-block; padding: 8px 10px; color: #ffffff; } .calendar-legend { display: block; float: left; } .calendar-legend li { position: relative; display: block; float: left; padding: 5px 10px 5px 25px; font-weight: 700; margin: 0 0 0 20px; color: #18385E; } .calendar-legend li:first-child { margin: 0; } .calendar-legend li:last-child { border-right: none; } .calendar-legend li:before { content: ''; width: 15px; height: 15px; display: block; position: absolute; left: 0; top: 8px; } .calendar-legend .available:before { background: #94e2a2; } .calendar-legend .can-arrive:before { background: #94e2a2; border: 2px solid #191919; } .calendar-legend .unavailable:before { background: #ffcdb5; } .date-price-box { font-size: 18px; background: url(../img/date-price-bg.jpg) 50% 50% no-repeat; background-size: cover; border-radius: 6px; padding: 30px 20px; position: relative; } .date-price-box:after { content: ''; position: absolute; left: 0; right: 0; top: 0; bottom: 0; display: block; width: 100%; height: 100%; background: rgba(24, 56, 94, 0.83); z-index: 1; border-radius: 5px; } .reservation-txt-price, .reservation-price { display: block; float: left; font-weight: 700; position: relative; top: 6px; } .reservation-price { font-weight: 400; color: #ffffff; } .picked-dates { display: block; float: left; color: #ffffff; font-weight: 700; font-size: 16px; position: relative; padding: 5px 0 0 30px; margin: 0 40px 0 0; top: 4px; } .picked-dates:before { content: ''; position: absolute; left: 0; top: 7px; display: block; width: 18px; height: 19px; background: url(../img/calendar-ico-white.svg) 50% 50% no-repeat; background-size: 18px auto; } .date-price-box .buttons-review-wrapper { text-align: left; margin: 0; display: inline-block; width: initial; position: relative; z-index: 2; } .date-price-box .villa-badge { top: -20px; right: -30px; width: 50px; z-index: 2; } .date-price-box .currency-list { display: block; float: left; position: relative; top: 0; margin: 0 20px 0 0; width: 40px; height: 40px; z-index: 2; background: transparent; border-radius: 50%; text-align: center; line-height: 34px; border: 2px solid #ffffff; } .date-price-box .flag-circle:before { position: relative; left: auto; top: auto; margin: 0 auto; } .currencies-reservation { right: -7px; width: 50px; top: 45px; } .currencies-reservation li a { padding: 5px 0; text-align: center; color: #484848; font-weight: 700; } .currencies-reservation li a:hover, .currencies-reservation li a:focus, .currencies-reservation li a:active { text-decoration: none; color: #EF481E; } .toggle-currency-reservation, .toggle-currency-reservation:hover, .toggle-currency-reservation:focus, .toggle-currency-reservation:active { color: #ffffff; font-weight: 700; text-decoration: none; } .toggle-currency-reservation:after { content: ''; width: 12px; height: 12px; display: block; background: url(../img/chevron-down-white.svg) 50% 50% no-repeat; background-size: 12px auto; position: absolute; right: -20px; top: 13px; } .date-range-price { padding: 10px 5px; border-bottom: 1px solid #ececec; } .date-range-price:last-of-type { border-bottom: none; } .date-range-price:nth-child(even) { background: #f7f7f7; } .price-range-label { font-weight: 700; margin: 0 0 10px 0; font-size: 20px; text-align: center; } .price-week { color: #01AA24; min-width: 100px; text-align: right; } .accommodation-mobile-slider { display: none; } .other-accommodation-units { margin: 60px 0 0 0; } .other-accommodation-units.object { margin: 0 0 50px 0; } .other-accommodation-units .villa-item, .other-accommodation-units.object .villa-item { margin: 0 0 30px 0; } .other-accommodation-units.object .main-desc { margin: 40px 0 0 0; } .other-accommodation-units h2 { font-size: 18px; font-weight: 700; color: #253450; margin: 0 0 40px 0; } .other-accommodation-units .villa-location { display: block; float: right; margin: 0; } .other-accommodation-units .rate-price .rate { margin: 10px 0; width: auto; float: left; } .other-accommodation-units .rate-price .price { margin: 0; float: right; top: 10px; } .rate-mobile, .mobile-nav-tabs { display: none; } .villa-id-desktop { display: inline-block; } .steps { list-style-type: none; margin: 0; padding: 30px 0; display: inline-block; width: 100%; text-align: center; } .steps li { display: inline-block; margin: 0 30px 0 0; } .steps li:last-child { margin: 0; } .steps .orange-btn, .steps .outline-btn { padding: 8px 20px; } .steps .outline-btn:hover, .steps .outline-btn:focus, .steps .outline-btn:active { background: #ffffff; color: #11223F; } .reservation-page h1 { margin: 0 0 40px 0; font-weight: 700; text-align: center; font-size: 1.7rem; } .reservation-page { font-size: 16px; } .reservation-page .villa-item { width: 275px; } .reservation-page .villa-list-right { width: 56%; } .reservation-page .villa-list-right h2 { margin: 0 0 20px 0; } .reservation-page .villa-list-right .desc { font-size: 16px; } .reservation-group { margin: 0 0 30px 0; } .reservation-group label { margin: 0; } .reservation-group-content .final-price { font-size: 20px; font-weight: 700; } .final-price span { color: #01AA24; } .final-around-price { text-align: right; } .around-price { display: block; font-size: 13px; color: #747474; } .reservation-group-name { font-size: 18px; font-weight: 700; margin: 0 0 20px 0; position: relative; } .inside-form-btn { border: none; display: block; text-align: center; width: 200px; border-radius: 100px; float: right; } .inside-form-btn:disabled { cursor: not-allowed; opacity: .4; } .reservation-group .select2-container, .reservation-group .select2-selection { width: 135px !important; } .reservation-group.nacin-placanja .select2-container, .reservation-group.nacin-placanja .select2-selection { max-width: 345px !important; width: 100% !important; font-size: 16px; margin: 0 10px 0 0; } .reservation-group-content { margin: 0 0 10px 0; } .reservation-group .select2-container .select2-selection--single { height: 45px; } .reservation-group .select2-container--default .select2-selection--single .select2-selection__rendered { line-height: 45px; } /* custom checkbox */ .inp-cbx { display: none; } .cbx { margin: auto; -webkit-user-select: none; user-select: none; cursor: pointer; width: 100%; } .cbx span { display: inline-block; vertical-align: middle; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } .cbx span:first-child { position: relative; width: 18px; height: 18px; border-radius: 3px; -webkit-transform: scale(1); transform: scale(1); vertical-align: top; margin: 6px 15px 0 0; border: 1px solid #ec2821; background: #fff; -webkit-transition: all .2s ease; transition: all .2s ease; } .cbx span:first-child svg { position: absolute; top: 3px; left: 2px; fill: none; stroke: #fff; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 16px; stroke-dashoffset: 16px; -webkit-transition: all .3s ease; -webkit-transition-delay: .1s; -webkit-transform: translate3d(0, 0, 0); transition: all .3s ease; transition-delay: .1s; transform: translate3d(0, 0, 0); } .cbx span:first-child:before { content: ""; width: 100%; height: 100%; background: #ec2821; display: block; -webkit-transform: scale(0); transform: scale(0); opacity: 1; border-radius: 50%; } .cbx span:last-child { padding-left: 3px; width: 90%; } .cbx:hover span:first-child { border-color: #ec2821; } .inp-cbx:checked + .cbx span:first-child { background: #ec2821; border-color: #ec2821; animation: wave .4s ease; } .inp-cbx:checked + .cbx span:first-child svg { stroke-dashoffset: 0 } .inp-cbx:checked + .cbx span:first-child:before { -webkit-transform: scale(3.5); transform: scale(3.5); opacity: 0; -webkit-transition: all .6s ease; transition: all .6s ease } @keyframes wave { 50% { transform: scale(.9) } } /* end custom checkbox */ .checkbox-wrapper { width: 100%; } .show-more-txt { display: block; padding: 0 0 0 38px; } .desc-txt { margin: 10px 0 0 38px; width: 90%; background: #EAEAEA; padding: 10px; border-radius: 6px; } .checkbox-right-side { font-weight: 700; width: 240px; text-align: right; } .desc-txt { display: none; } .osiguranje-logo { position: absolute; right: 0; top: 0; width: 100px; height: 26px; display: block; background: url(../img/allianz-logo.svg) 50% 50% no-repeat; background-size: 100px auto; } .form-control { height: 45px; /*width: 345px;*/ font-size: 14px; padding: 10px 20px; } .form-control:focus { border-color: #f28d1c; box-shadow: 0 0 0 0.2rem rgba(243, 140, 28, 0.25); } .reservation-group .form-group .select2-container, .reservation-group .form-group .select2-selection { max-width: 100% !important; width: 100% !important; font-weight: 400; } .reservation-group .form-group .select2-container--default .select2-selection--single .select2-selection__rendered { padding: 0 20px; color: #495057; } .reservation-group .form-group .select2-container--default .select2-selection--single .select2-selection__placeholder { color: #495057; } .help-note { margin: 40px 0 0 0; border-radius: 6px; background: #F7F7F7; padding: 20px; width: 100%; color: #18385E; font-weight: 700; display: inline-block; } .help-note a { font-weight: 700; } .confirmation-msg { display: inline-block; margin: 0 0 30px 0; font-weight: 700; } .reservation-page.overview h1 { margin: 0 0 20px 0; } .reservation-page .data-right, .reservation-page.overview .final-price { font-weight: 700; font-size: 16px; } .orange-txt { color: #EF481E; } .final-note { font-weight: 700; } /* custom radio */ label.radio { font-weight: 400; display: inline-block; width: 100%; cursor: pointer; margin: 20px 0 0 0; } .radio input { display: none; } .radio input + span { line-height: 22px; height: 22px; padding-left: 22px; display: block; position: relative; } .radio input + span:not(:empty) { padding-left: 30px; } .radio input + span:before, .radio input + span:after { content: ''; width: 20px; height: 20px; display: block; border-radius: 50%; left: 0; top: 1px; position: absolute; } .radio input + span:before { background: #ffffff; transition: background 0.2s ease, -webkit-transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 2); transition: background 0.2s ease, transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 2); transition: background 0.2s ease, transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 2), -webkit-transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 2); border: 1px solid #C1C1C1; } .radio input + span:after { background: #ffffff; -webkit-transform: scale(0.78); transform: scale(0.78); transition: -webkit-transform 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.4); transition: transform 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.4); transition: transform 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.4), -webkit-transform 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.4); } .radio input:checked + span:before { -webkit-transform: scale(1.04); transform: scale(1.04); background: #ffffff; } .radio input:checked + span:after { background: #FF0000; -webkit-transform: scale(0.6); transform: scale(0.6); transition: -webkit-transform .3s ease; transition: transform .3s ease; transition: transform .3s ease, -webkit-transform .3s ease; } .radio:hover input + span:before { -webkit-transform: scale(0.92); transform: scale(0.92); } .radio:hover input + span:after { -webkit-transform: scale(0.74); transform: scale(0.74); } .radio:hover input:checked + span:after { -webkit-transform: scale(0.4); transform: scale(0.4); } .distance-object { list-style-type: none; margin: 0; padding: 0; display: inline-block; width: 100%; -webkit-column-count: 3; -moz-column-count: 3; column-count: 3; column-gap: 30px; -webkit-column-gap: 30px; -moz-column-gap: 30px; } .main-info .show-map { display: block; float: right; max-width: 160px; margin: 0 0 20px 0; } #mapa { height: 80vh; margin: 0 0 20px 0; } #mapa2, #mapa2-wrapper { width: 100%; height: 50vh; } .alert { margin-bottom: 2rem; padding: 1rem; margin-top: 0; } .alert-warning { background: #FDEEDA; border-color: #FDEEDA; } .reservation-page.contact h1 { margin: 30px 0; } .reservation-page.contact .date { width: 100%; margin: 0 0 1rem 0; } .reservation-page.contact .date-picker-input { width: 100%; } .reservation-page.contact .control label { margin: 0 0 5px 0; } .reservation-page.contact .control img { height: 20px; } .reservation-page.contact .villa-list-right { float: left; padding: 0 0 0 30px; } /*Kreso: kreirao jer ne radi Vue.js sa select2 jquery kompomentom */ .category-select-2 { min-width: 133px; padding: 7px 5px; } .fav-num { position: absolute; top: -6px; background: #fff; left: 16px; font-size: 11px; width: 20px; height: 20px; text-align: center; border-radius: 50%; border: 1px solid #ec3020; font-weight: 700; line-height: 17px; } .radio-group { display: inline-block; } .radio-group label.radio { width: auto; margin: 0 20px 0 0; display: block; float: left; width: auto; } .main-nav.fixed.hide { -webkit-transform: translateY(-120px); transform: translateY(-120px); } .reviews .rate { font-size: 18px; font-weight: 700; margin: 20px 0 40px 0; } .accommodation-page h2 { margin: 30px 0 20px 0; text-align: center; font-weight: 700; } .other-accommodation-units h2 { text-align: left; } .calendar-hint { font-size: 14px; font-weight: 700; display: block; margin: 10px 0 0 0; color: #1cba4f; position: relative; } .calendar-hint:after { content: ''; width: 20px; height: 10px; display: block; background: url(../img/chevron-down-green.svg) 50% 50% no-repeat; margin: 10px auto; animation: bounce 2s infinite; } @keyframes bounce { 0%, 20%, 50%, 80%, 100% { transform: translateY(0); } 40% { -webkit-transform: translateY(-10px); transform: translateY(-10px); } 60% { -webkit-transform: translateY(-5px); transform: translateY(-5px); } } .reveal-all-wrapper { text-align: center; padding: 40px 0 0 0; } .tab-col-wrapper { margin: 30px 0 0 0; } .anchor-nav { z-index: 10; -webkit-transition: all .3s ease-out; transition: all .3s ease-out; } .anchor-nav.sticky { margin: 0 auto; box-shadow: 0 9px 10px rgba(0,0,0,.15); } .anchor-nav.sticky .accommodation-ico, .anchor-nav.sticky .months-ico, .anchor-nav.sticky .map-ico, .anchor-nav.sticky .review-ico { display: none; } /*.anchor-nav.sticky + .main-desc { margin: 70px 0 0 0; }*/ .reservation-price-wrapper { margin: 20px 0 0 0; } .pagination { padding-left: 0; margin: 20px 0; border-radius: 4px; } .pagination > li > a, .pagination > li > span { position: relative; padding: 0; text-decoration: none; color: #253450; background-color: #fff; border: 1px solid #ddd; border-radius: 50%; width: 40px; height: 40px; text-align: center; line-height: 38px; margin: 0 3px; font-size: 13px; } .page-link:hover { color: #253450; } .page-link:focus { box-shadow: 0 0 0 0.2rem rgba(255, 123, 0, 0.25); } .next-page a, .prev-page a { display: block; background: url(../img/chevron-down.svg) 50% 50% no-repeat; background-size: auto 7px; width: 34px; height: 34px; padding: 0; -webkit-transform: rotate(-90deg); transform: rotate(-90deg); } .prev-page a, .first-page a { -webkit-transform: rotate(90deg); transform: rotate(90deg); } .page-item:first-child .page-link, .page-item:last-child .page-link { border-radius: 50%; } .pagination > li.nav-dots > span { border: 1px solid transparent; margin-left: 0; letter-spacing: 2px; } .page-item.active .page-link { border-color: #ea2924; background: -moz-linear-gradient(328deg, rgba(236,40,33,1) 0%, rgba(236,40,33,1) 26%, rgba(243,152,27,1) 100%); background: -webkit-gradient(linear, left top, right bottom, color-stop(0%, rgba(236,40,33,1)), color-stop(26%, rgba(236,40,33,1)), color-stop(100%, rgba(243,152,27,1))); background: -webkit-linear-gradient(328deg, rgba(236,40,33,1) 0%, rgba(236,40,33,1) 26%, rgba(243,152,27,1) 100%); background: -o-linear-gradient(328deg, rgba(236,40,33,1) 0%, rgba(236,40,33,1) 26%, rgba(243,152,27,1) 100%); background: linear-gradient(122deg, rgba(236,40,33,1) 0%, rgba(236,40,33,1) 26%, rgba(243,152,27,1) 100%); } .page-nav.bottom.mobile { display: none; } .prices-box { margin: 30px 0 0 0; } .left-side-box { padding: 5px 0 0 0; position: relative; z-index: 3; } .section-shadow { height: 2px; margin: 40px 0 0 0; overflow: hidden; width: 100%; } .section-shadow:after { border-radius: 100%; box-shadow: 0 0 1px rgba(0,0,0,1); content: ""; display: block; height: inherit; position: relative; top: 100%; } .destinacija-search { width: 100%; border-radius: 4px; height: 50px; line-height: 50px; background: #FFFFFF; font-size: 14px; font-weight: 400; position: relative; padding: 10px 10px 10px 70px; } .ui-menu { position: absolute; background: #ffffff; z-index: 1052; list-style-type: none; padding: 0; margin: 0; padding: 15px; max-height: 400px; overflow-y: auto; box-shadow: 0 5px 20px rgba(0,0,0,.3); } .ui-menu li:first-child { margin: 0 0 5px 0; } .ui-menu li:last-child { margin: 5px 0 0 0; } .ui-menu li { margin: 5px 0; position: relative; cursor: pointer; } .ui-menu li:hover { color: #ec2821; } .ui-menu li.sj, .ui-menu li.lokacija { padding: 0 0 0 30px; } .ui-menu li.sj:before { content: ''; width: 15px; height: 15px; display: block; left: 0; top: 3px; position: absolute; background: url(../img/villa-ico.svg) 50% 50% no-repeat; background-size: 15px auto; } .ui-menu li.lokacija:before { content: ''; width: 15px; height: 15px; display: block; left: 0; top: 3px; position: absolute; background: url(../img/location-ico.svg) 50% 50% no-repeat; background-size: 12px auto; } .short-desc { margin: 0 0 20px 0; font-size: 18px; background: #f1f1f1; padding: 20px; border-radius: 5px; line-height: 1.8; } .short-desc p { margin: 0; } .tabs-quick-links { background: #fafafa; padding: 20px; border-radius: 5px; } .tabs-quick-links .tab-content { padding: 20px 20px 20px 0; } .tabs-quick-links .nav-tabs .nav-link { font-weight: 700; padding: 10px 30px; color: #484848; border-top-left-radius: 5px; border-top-right-radius: 5px; } .tabs-quick-links .tab-content ul { padding: 0 0 0 20px; margin: 0; } .tabs-quick-links .tab-content ul li, .quick-links li { margin: 5px 0; } .tabs-quick-links .tab-content ul li:first-child { margin: 0 0 5px 0; } .tabs-quick-links .tab-content ul li:last-child { margin: 5px 0 0 0; } .tabs-quick-links .tab-content ul li a, .quick-links a { color: #484848; } .tabs-quick-links .tab-content ul li a:hover, .tabs-quick-links .tab-content ul li a:focus, .tabs-quick-links .tab-content ul li a:active, .quick-links a:hover, .quick-links a:focus, .quick-links a:active { color: #EF481E; } .tabs-quick-links .nav-tabs .nav-link.active, .tabs-quick-links .nav-tabs .nav-item.show .nav-link { color: #ffffff; background: -moz-linear-gradient(328deg, rgba(236,40,33,1) 0%, rgba(236,40,33,1) 26%, rgba(243,152,27,1) 100%); background: -webkit-gradient(linear, left top, right bottom, color-stop(0%, rgba(236,40,33,1)), color-stop(26%, rgba(236,40,33,1)), color-stop(100%, rgba(243,152,27,1))); background: -webkit-linear-gradient(328deg, rgba(236,40,33,1) 0%, rgba(236,40,33,1) 26%, rgba(243,152,27,1) 100%); background: -o-linear-gradient(328deg, rgba(236,40,33,1) 0%, rgba(236,40,33,1) 26%, rgba(243,152,27,1) 100%); background: linear-gradient(122deg, rgba(236,40,33,1) 0%, rgba(236,40,33,1) 26%, rgba(243,152,27,1) 100%); } .quick-links-wrapper ul { list-style-type: none; padding: 0; margin: 0; } .quick-links-wrapper ul li { padding: 0 0 0 20px; position: relative; } .quick-links-wrapper ul li:before { content: ''; width: 6px; height: 12px; left: 0; top: 5px; display: block; position: absolute; background: url(../img/chevron-right-orange.svg) 50% 50% no-repeat; background-size: 6px auto; } .quick-links-wrapper { padding: 25px; background: #fafafa; border-radius: 5px; float: right; min-width: 250px; } .quick-links h2 { font-size: 1.2rem; margin: 0 0 10px 0; border-bottom: 1px solid #e3e3e3; padding: 0 0 10px 0; font-weight: 700; } .quick-links li { margin: 0 0 20px 0; } .quick-links li ul li { margin: 5px 0; } .quick-links li:last-child { margin: 0; } .quick-links li a { font-weight: 700; text-transform: uppercase; } .quick-links li ul li a { font-weight: 400; text-transform: none; } .arrive-depart-wrapper { text-align: center; } .calendar-legend-reset { margin: 15px 0 0 0; display: inline-block; width: 100%; } .reset-dates, .reset-adv-search { position: relative; border: 1px solid #ed4120; padding: 5px 10px 5px 30px; border-radius: 5px; text-transform: uppercase; font-size: 12px; display: block; float: right; } .reset-adv-search:hover, .reset-adv-search:focus, .reset-adv-search:active, .reset-dates:hover, .reset-dates:focus, .reset-dates:active { text-decoration: none; color: #ffffff; background: #ed4120; } .reset-adv-search:before, .reset-dates:before { content: ''; position: absolute; top: 50%; left: 10px; width: 10px; height: 10px; display: block; background: url(../img/close-ico-red.svg) 50% 50% no-repeat; background-size: 10px auto; transform: translateY(-50%); -webkit-transform: translateY(-50%); } .reset-adv-search:hover:before, .reset-adv-search:active:before, .reset-adv-search:focus:before, .reset-dates:hover:before, .reset-dates:focus:before, .reset-dates:active:before { background: url(../img/close-ico-white.svg) 50% 50% no-repeat; background-size: 10px auto; } .modal-open, .modal-open .modal { padding: 0 !important; } .allMenuBtnMobile { display: none !important; } .allMenuBtnDesktop { display: flex !important; } .surcharges { margin-top: 30px; } .surcharges ul { display: inline-block; width: 100%; } .surcharges ul li:first-child { display: block; float: left; width: 100% } .surcharges ul li:last-child { display: block; float: right; width: 25%; } .surcharges .price-week { color: #484848; text-align: right; } .surcharges .note-surcharges, .surcharges .note-surcharges li:first-child { width: 100%; } .surcharges .note-surcharges li:last-child { text-align: left; } .select2-dropdown { z-index: 1052; } .tooltip-inner { background: #135bc2; } .bs-tooltip-top .arrow::before, .bs-tooltip-auto[x-placement^="top"] .arrow::before { border-top-color: #135bc2; } .cjenik-labels { list-style-type: none; padding: 0; margin: 0; background: #144b67; padding: 10px; color: #ffffff; font-weight: 700; } .cjenik-labels li { display: inline-block; } .cjenik-labels li:first-child, .date-range-price li:first-child { width: 180px; } .cjenik-labels li:nth-child(2), .date-range-price li:nth-child(2) { width: 160px; text-align: center; } .cjenik-labels li:nth-child(3), .date-range-price li:nth-child(3) { width: 35%; } .cjenik-labels li:last-child, .date-range-price li:last-child { width: 160px; text-align: right; } .min-nights-mobile { display: none; } .discount-price { font-size: 18px; color: #ffb04d; } .old-price { font-weight: 700; text-decoration: line-through; } .priceiznos { color: #71ff6d; font-weight: 700; } .nocenjazbroj { margin: 0 20px 0 0; } #superoverlay { display: none; position: fixed; z-index: 331900; top: 0; left: 0; right: 0; bottom: 0; background-color: #fff; } #superoverlay > div { display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-flex-wrap: nowrap; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-align-content: stretch; -ms-flex-line-pack: stretch; align-content: stretch; -webkit-align-items: center; -ms-flex-align: center; align-items: center; top: 0; left: 0; right: 0; bottom: 0; background-color: #fff; height: 100%; } .sk-folding-cube { margin: 20px auto; width: 40px; height: 40px; position: relative; -webkit-transform: rotateZ(45deg); transform: rotateZ(45deg); } .sk-folding-cube .sk-cube { float: left; width: 50%; height: 50%; position: relative; -webkit-transform: scale(1.1); -ms-transform: scale(1.1); transform: scale(1.1); } .sk-folding-cube .sk-cube:before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: #F39725; -webkit-animation: sk-foldCubeAngle 2.4s infinite linear both; animation: sk-foldCubeAngle 2.4s infinite linear both; -webkit-transform-origin: 100% 100%; -ms-transform-origin: 100% 100%; transform-origin: 100% 100%; } .sk-folding-cube .sk-cube2 { -webkit-transform: scale(1.1) rotateZ(90deg); transform: scale(1.1) rotateZ(90deg); } .sk-folding-cube .sk-cube3 { -webkit-transform: scale(1.1) rotateZ(180deg); transform: scale(1.1) rotateZ(180deg); } .sk-folding-cube .sk-cube4 { -webkit-transform: scale(1.1) rotateZ(270deg); transform: scale(1.1) rotateZ(270deg); } .sk-folding-cube .sk-cube2:before { -webkit-animation-delay: 0.3s; animation-delay: 0.3s; } .sk-folding-cube .sk-cube3:before { -webkit-animation-delay: 0.6s; animation-delay: 0.6s; } .sk-folding-cube .sk-cube4:before { -webkit-animation-delay: 0.9s; animation-delay: 0.9s; } @-webkit-keyframes sk-foldCubeAngle { 0%, 10% { -webkit-transform: perspective(140px) rotateX(-180deg); transform: perspective(140px) rotateX(-180deg); opacity: 0; } 25%, 75% { -webkit-transform: perspective(140px) rotateX(0deg); transform: perspective(140px) rotateX(0deg); opacity: 1; } 90%, 100% { -webkit-transform: perspective(140px) rotateY(180deg); transform: perspective(140px) rotateY(180deg); opacity: 0; } } @keyframes sk-foldCubeAngle { 0%, 10% { -webkit-transform: perspective(140px) rotateX(-180deg); transform: perspective(140px) rotateX(-180deg); opacity: 0; } 25%, 75% { -webkit-transform: perspective(140px) rotateX(0deg); transform: perspective(140px) rotateX(0deg); opacity: 1; } 90%, 100% { -webkit-transform: perspective(140px) rotateY(180deg); transform: perspective(140px) rotateY(180deg); opacity: 0; } } .advance-remaining { background: #f7f7f7; padding: 10px 20px; } .advance-remaining span { width: 25%; padding: 0 5px; line-height: 1.2; } .advance-remaining .data-right:last-of-type { text-align: right; } #epay-table-wrapper td { vertical-align: middle; padding: 10px 0; } .review-form { margin: 30px 0 0 0; } .review-form label { font-weight: 700; } .review-form .form-group { margin-bottom: 20px; } .ratingLive { margin: 0 0 30px 0; } span.prebaci { display: inline-block; background-color: #27aa16; border-radius: 3px; padding: 4px 6px; color: #fff; text-transform: uppercase; font-size: 10px; margin-left: 10px; cursor: grab; cursor: pointer; float: right; clear: both; margin-top: 3px; } .zopim { z-index: 49!important; } .lg-backdrop, .lg-outer { z-index: 1053; } .category-page .search-title { margin: 0 0 20px 0; } .price-mobile { display: none; } .price-mobile { display: none; } .embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .yt { width: 50%; margin: 0 auto; margin-bottom: 20px; } .fav-head-img { display: inline-block; width: 100%; } .fav-head-img source, .fav-head-img img { width: 100%; } .fav-wrapper { margin: 40px 0 0 0; } .show-category-map-mobile { display: none; } .safe-logo { z-index: 10; position: absolute; left: 6%; top: 6%; width: 300px; } .safe-logo a::after { display: none; } .alert { margin-top: 2rem; text-align: center; } .adults-years-missing { color: red !important; animation: blink 1s 0s infinite; -webkit-animation: blinkRequired .75s 0s infinite; } @keyframes blinkRequired { 50% { opacity: 0.21; } } @-webkit-keyframes blinkRequired { 50% { opacity: 0.21; } } .txt-toggler { position: relative; display: inline-block; cursor: pointer; } .txt-toggler::after { position: absolute; content: ""; top: 0; right: -35px; width: 30px; height: 30px; background: url(../../images/arr_right.svg) no-repeat center center; background-size: 12px; transition: transform .2s; } .txt-toggler--collapsed::after { transform: rotate(90deg); } .txt-toggler + div { display: none; } .txt-toggler--collapsed + div { display: block; } .euro-notice { margin-top: 2rem; text-align: center; padding: 1rem 2rem; background-color: beige; border-radius: 10px; } .euro-notice--mobile { display: none; margin-bottom: 2rem; font-size: .9rem; } .booking-search, .booking-search.category { height: auto; } .sticky .euro-notice { display: none; } .euro-booking { margin-bottom: 1rem; } .euro-booking .euro-notice { font-size: .9rem; text-align: left; } .suradnja-teaser { margin-bottom: 4rem; } .suradnja-teaser p { text-align: center; font-size: 1.75rem; margin-bottom: 0; } .suradnja-contact { display: flex; justify-content: center; flex-wrap: nowrap; gap: 6rem; margin-bottom: 4rem; } .suradnja-contact a { color: inherit; position: relative; } .suradnja-contact a.ic-phone:before { position: absolute; content: ""; width: 32px; height: 32px; top: -10px; left: -40px; background: url(../img/phone-ico-topbar.svg) 50% 50% no-repeat; background-size: 32px auto; } .suradnja-contact a.ic-mail:before { position: absolute; content: ""; width: 32px; height: 32px; top: -10px; left: -40px; background: url(../img/email-ico-topbar.svg) 50% 50% no-repeat; background-size: 32px auto; } .suradnja-wrapper { max-width: 990px; margin: 0 auto; /* overflow: hidden;*/ } .suradnja-address { padding-bottom: 2rem; margin-bottom: 4rem; border-bottom: solid 1px rgb(241,126,28); } .swiper-testemonials .swiper-wrapper > div { } .swiper-testemonials .swiper-wrapper { flex-wrap: wrap; } .iskustva { margin-bottom: 4rem; } .swipper-iskustva { position: relative; } .swipper-iskustva p.author { text-transform: uppercase; margin-top: 1rem; } .swipper-iskustva a { text-decoration: underline; } .swipper-iskustva a:hover { text-decoration: none; } .swipper-iskustva p.location { position: relative; padding-left: 20px; } .swipper-iskustva p.location:before { content: ''; position: absolute; left: 0; top: 1px; width: 14px; height: 20px; display: block; background: url(../img/location-ico.svg) 50% 50% no-repeat; background-size: 13px auto; } .swipper-iskustva .swiper-slide { display: flex; } .swipper-iskustva .swiper-slide > div:first-child { flex: 0 0 25%; } .swipper-iskustva .swiper-slide > div:last-child { flex: 0 0 75%; padding-left: 2rem; } .swipper-iskustva .swiper-button-prev { left: -50px; } .swipper-iskustva .swiper-button-next { right: -50px; } .swipper-iskustva .swiper-button-prev:after, .swipper-iskustva .swiper-container-rtl .swiper-button-next:after, .swipper-iskustva .swiper-button-next:after, .swipper-iskustva .swiper-container-rtl .swiper-button-prev:after { content: ''; background: transparent url(../img/arr-right.svg) 50% 50% no-repeat; background-size: 32px auto; width: 32px; height: 32px; border-radius: 50%; display: block; box-shadow: 3px 0 15px rgba(0,0,0,.2); } .why-lrossa-items { display: flex; flex-wrap: wrap; justify-content: center; } .why-lrossa-items > div { flex: 0 0 50%; display: flex; font-size: 1.5rem; margin-bottom: 3rem; } .why-lrossa-items > div .why-lrossa-pikto { flex: 0 0 25%; text-align: center; } .why-lrossa-items > div .why-lrossa-txt { flex: 0 0 75%; align-self: center; } .ct-suradnja-wrapper { margin-top: 2rem; } .ct-suradnja-wrapper img { width: 100%; border-radius: 6px; } .footer-social { margin-top: 2rem; text-align: right; } .footer-social img { width: 40px; margin-right: .5rem; display: inline-block; } .footer-social img:last-child { margin-right: 0; }