/*
Theme Name: Pandora Turist
Theme URI: https://www.pandoraturist.hr
Author: Ivan Livic, EGO MEDIA
Author URI: http://www.egomedia.hr/
Description: Pandora Turist, Srima - Croatia
Version: 3.0
License: Copyright © Ego Media, Tezacka 47, 22000 Sibenik - Croatia
License URI: http://www.egomedia.hr/
Tags: css, egomedia, ego, media, pandora, turist, srima
Text Domain: pandoraturist
Note: Date: 10.12.2022.  
-------------------------------------------------------*/

/******************************************************
/// Osnovni stilovi, Reset CSS
******************************************************/
html:before { content: ""; position: fixed; top: -10px; left: -10px; width: 110%; height: 10px; -webkit-box-shadow: 0px 0px 15px rgba(0,0,0,.8); -moz-box-shadow: 0px 0px 15px rgba(0,0,0,.8); box-shadow: 0px 0px 15px rgba(0,0,0,.8); z-index: 9999999; }
html { margin: 80px; background-color: rgba(1, 2, 3, 0.9); }
article, aside, details, figcaption, figure,  footer, header, hgroup, menu, nav, section { display: block; }
body { font-family: 'Montserrat', sans-serif; font-weight: 400; font-size: 14px; line-height: 24px; color: #d1bb87; }
blockquote, q { quotes: none; }
blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }
button { outline: 0; }
table { border-collapse: collapse; border-spacing: 0; }
a { color: #fff; }
a:hover, a:focus { text-decoration: none; color: #d1bb87; }
button, input, textarea { outline: 0; }
section { float: left; width: 100%; position: relative; }
img { float: left; }
p { font-size: 14px; line-height: 26px; margin-bottom: 0; }
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-thumb { cursor: pointer; background: #d1bb87; }
.mt15 { margin-top:15px; } .mt30 { margin-top:30px; } .mt50 { margin-top:50px; } .mt70 { margin-top:70px; } .mt100 { margin-top:100px; } .mt150 { margin-top:150px; } .mt-200 { margin-top:200px; }
.mb15 { margin-bottom:15px; } .mb30 { margin-bottom:50px; } .mb50 { margin-bottom:50px; } .mb100 { margin-bottom:100px; } .mb150 { margin-bottom:150px; } .mb200 { margin-bottom:200px; } .mb-150 { margin-bottom: -150px; }
.m80 { margin: 80px 0; } .p100 { padding:100px 0; } .pt0 { padding-top:0!important; } .pb0 { padding-bottom:0!important; }
.nopadding { padding-left:0!important; padding-right:0!important; }
.text-shadow { text-shadow: 0px 0px 12px rgba(202, 177, 94, 0.25); }
hr { border-top: 1px solid rgba(202, 177, 94, 0.15); }

/******************************************************
/// Struktura stranice
******************************************************/
main { position: relative; top: 98px; float: left; width: 100%; border-top: 0px solid rgba(209, 187, 135, 0.8); margin-bottom: 58px; border-top-left-radius: 8px; border-top-right-radius: 8px;  }
main:before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-image: none; }
.SiteWrapper { float: left; width: 100%; position: relative; background-color: #010b13; }
.container-wider { max-width: 1260px; margin: 0 auto; }
.block { float: left; width: 100%; padding: 100px 0; position: relative; z-index: 99; }
.block.no-padding, .container, .container-fluid { padding: 0; }
.row { margin: 0; }

/******************************************************
/// Grupna animacija
******************************************************/
nav ul li:hover > ul, nav ul li a, nav ul ul li,.jezici ul li a, .follow-us ul li svg, .footer-menu ul li a, .mobile-menu-btn a, .mobile-menu > a,
.footer-menu ul li a:before,.fotka, .fotka:before, .fotka img, .opis h3, .social-links ul li a, .modal-video .close, .kontakti ul li a, 
.footer-links li a, .home-grid-desc a, .mobile-menu,header, .scrollup, .kontakti ul li strong.scnd a, .mobile-menu ul li a, .button span a, 
.sub-header span a, .home-slider ul li img, .slick-dots li button, .home-grid-desc span a, a, button, h3, h3 a { 
-webkit-transition: all 0.4s ease-in-out; -moz-transition: all 0.4s ease-in-out; -ms-transition: all 0.4s ease-in-out; -o-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out; }

/******************************************************
/// Header, logo, izbornik
******************************************************/
header { float: left; width: 100%; position: absolute; top: 0; left: 0; z-index: 999; background: rgba(1, 11, 19, 1); }
.header-wrapper { float: left; width: 100%; padding: 0; }
.logo { padding: 0; }
.jezici { padding-top: 20px; }
.jezici ul { margin: 0px auto; text-align: center; padding: 20px 0 0 0; }
.jezici ul li { display: inline-block; padding: 0 18px; list-style: none; }
.jezici ul li a span { display:block; font-size:9px; text-transform: uppercase; color: #d1bb87; text-align:center; font-weight: 600; }
.jezici ul li a:hover { opacity: 0.40; }
.weather { padding-top: 20px; }
.header-kontakti { background: rgba(209, 187, 135, 0.8); position: absolute; left: 0; bottom: -60px; padding: 8px 0; width: 100%; float: left; z-index: 99; border-bottom-left-radius: 8px; border-bottom-right-radius: 8px; }
.kontakti-wrapper { float: left; width: 100%; }
.kontakti { float: left; width: 77%; }
.kontakti ul { padding-left: 15px; margin: 0; }
.kontakti ul li { display: inline-block; font-size: 13px; font-weight: 100; color:#010b13; padding: 0 13px; list-style: none; }
.kontakti ul li a { color: #010b13; }
.kontakti ul li:first-child { padding-left: 0; }
.kontakti ul li strong { font-weight: 600;  }
.follow-us { float: left; width: 23%; text-align: left; }
.follow-us ul { margin: 0; padding: 0; }
.follow-us ul li { display: inline-block; color: #010b13; padding: 0 8px; list-style: none; }
.follow-us ul li svg { color: #010b13; font-size: 16px; }
.follow-us ul li svg:hover, 
.kontakti ul li a:hover, 
.kontakti ul li a:focus { color: #fff; }

/******************************************************
/// Responzivni izbornik
******************************************************/
.mobile-menu.active::after { content: ""; height: 100%; width: 50%; background-color: #ca2c92; background: url(../images/menu/menu-bg-0.jpg); background-position: 70% 0%; background-repeat: no-repeat; background-size: cover; background-attachment: scroll; z-index: -1; position: absolute; top: 0px; right: 0; }
#page-2 .mobile-menu.active::after { background: url(../images/menu/menu-bg-2.jpg); }
#page-3 .mobile-menu.active::after { background: url(../images/menu/menu-bg-3.jpg); }
#page-4 .mobile-menu.active::after { background: url(../images/menu/menu-bg-4.jpg); }
#page-5 .mobile-menu.active::after { background: url(../images/menu/menu-bg-5.jpg); }
#page-7 .mobile-menu.active::after { background: url(../images/menu/menu-bg-7.jpg); }
#page-8 .mobile-menu.active::after { background: url(../images/menu/menu-bg-8.jpg); }
#page-12 .mobile-menu.active::after { background: url(../images/menu/menu-bg-12.jpg); }
#page-2 .mobile-menu.active::after, #page-3 .mobile-menu.active::after, #page-4 .mobile-menu.active::after, #page-5 .mobile-menu.active::after, #page-7 .mobile-menu.active::after, #page-8 .mobile-menu.active::after, #page-12 .mobile-menu.active::after { background-position: 70% 0%; background-repeat: no-repeat; background-size: cover; }

.mobile-menu-btn { text-align: right; position: relative; top: 49px; }
.mobile-menu-btn a { color: #d1bb87; font-size: 38px; border: 3px dotted #d1bb87; padding: 1px 10px; border-radius: 8px; }
.mobile-menu-btn a:hover { border: 3px solid #d1bb87; color: #d1bb87; opacity: 1; background: #fff; }
.mobile-menu { background-color: rgba(1, 2, 3, 1); position: fixed; left: 0; top: 0; height: 0; padding: 40px 0; z-index: 999999; width: 100%; opacity: 0; height: 100%; overflow: auto; visibility: hidden; -webkit-transform: translateY(-100%); -moz-transform: translateY(-100%); -ms-transform: translateY(-100%); -o-transform: translateY(-100%); transform: translateY(-100%); -webkit-transition: all 500ms cubic-bezier(0.190, 1.000, 0.220, 1.000); -moz-transition: all 500ms cubic-bezier(0.190, 1.000, 0.220, 1.000); -o-transition: all 500ms cubic-bezier(0.190, 1.000, 0.220, 1.000); transition: all 500ms cubic-bezier(0.190, 1.000, 0.220, 1.000); /* easeOutExpo */ -webkit-transition-timing-function: cubic-bezier(0.190, 1.000, 0.220, 1.000); -moz-transition-timing-function: cubic-bezier(0.190, 1.000, 0.220, 1.000); -o-transition-timing-function: cubic-bezier(0.190, 1.000, 0.220, 1.000); transition-timing-function: cubic-bezier(0.190, 1.000, 0.220, 1.000); /* easeOutExpo */ }
.mobile-menu > a { position: relative; right: 50px; float: right; margin-bottom: 30px; z-index: 1; color: #fff; font-size: 38px; border: 3px dotted #fff; padding: 8px 12px; border-radius: 8px; }
.mobile-menu > a:hover { border: 3px solid #d1bb87; color: #d1bb87; opacity: 1; background: #fff; }
.mobile-menu.active { visibility: visible; opacity: 1; -webkit-transform: translateY(0); -moz-transform: translateY(0); -ms-transform: translateY(0); -o-transform: translateY(0); transform: translateY(0); }
.mobile-menu.active > ul { margin: 0; padding: 0px; }
.mobile-menu.active ul li { list-style: none; }
.mobile-menu.active ul li a { margin: 0; }
.mobile-menu ul { padding: 50px 150px 0 150px; }
.mobile-menu ul ul { padding-left: 20px; display: none; float: left; width: 100%; padding-bottom: 0; padding-top: 0; padding-right: 0; }
.mobile-menu ul ul li a { padding: 15px 0; border-bottom: 0; font-size: 14px; }
.mobile-menu ul li a { color: #d1bb87; font-size: 30px; font-weight: 700; float: left; width: 100%; padding: 15px 50px 20px 50px; text-align: left; }
.mobile-menu ul li a span { display:block; color: #d1bb87; text-transform:uppercase; font-size: 13px; font-weight: 500; width: 100%; margin-bottom: 5px; padding: 0; }
.mobile-menu ul li a:hover { color: #fff; }
.mobile-menu ul li.menu-has-items > a { position: relative; }
.mobile-menu ul li.active a { color: #fff; }
.mobile-menu ul li.menu-has-items.active > a:before { content: '\f107'; }
.mobile-menu ul li.menu-has-items > a:before { color: #fff; content: '\f105'; position: absolute; top: 50%; right: 20px; font-size: 14px; font-family: fontawesome; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); }
.spinner-menu { position:absolute; right:0%; width:30px; height:30px; border-radius:100%; margin: 5px 30px 0 0; background-color: #d1bb87; -webkit-animation:sk-scaleout 2s infinite ease-in-out; animation:sk-scaleout 2s infinite ease-in-out; }
.close-menu .spinner-menu { margin: 4px 10px 0 0; background-color:#d1bb87; }

@-webkit-keyframes sk-scaleout { 
	0% { -webkit-transform:scale(0) }
	100% { -webkit-transform:scale(1.5); opacity:0 } }
@keyframes sk-scaleout { 
	0% { -webkit-transform:scale(0); transform:scale(0) }
	100% { -webkit-transform:scale(1.5); transform:scale(1.5); opacity:0 } }
	
/******************************************************
/// Pozadine
******************************************************/
.overlay { position: relative; }
.overlay:before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; -webkit-background: -webkit-linear-gradient(to left,#2a741c, #bfa61c); -moz-background: -moz-linear-gradient(to left,#2a741c, #bfa61c); -ms-background: -ms-linear-gradient(to left,#2a741c, #bfa61c); -o-background: -o-linear-gradient(to left,#2a741c, #bfa61c); background: linear-gradient(to left,#2a741c, #bfa61c); z-index: 0; opacity: 0.90; }
.fixed-bg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: -1; background-size: cover; border-radius: 10px; }
.bg { background-image: url(../images/bg/bg.jpg); }
.bg-black { background:#010b13; border: 10px solid rgba(1, 2, 3, 0.8); }

/******************************************************
/// Karta, gumbi
******************************************************/
.karta { width: 100%; background: url(../images/bg/location_bg.png); background-position: center center; background-repeat: no-repeat; background-size: cover; background-attachment: scroll; position: relative; z-index: 1; padding: 500px 0 0px 0; margin-top: 0px; }
.karta:before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: url('../images/overlay-mask.png') repeat, rgba(14, 118, 188, 0.0);  }
.karta .tekst { color:#fff; margin-bottom:50px; }
.karta img { float:none; width: 100%; position: relative; z-index: 1; padding: 0; top: -170px; margin: 0px auto; text-align:center; }
.karta h4 { max-width: 550px; font-family: 'Libre Baskerville'; font-size: 60px; text-align:center; margin: 0px auto; margin-bottom: 30px; }
.button span a { border-radius: 5px; text-transform:uppercase; text-align:center; margin:0px 6px; color: #000000; font-size: 20px; background-color: #d1bb87; font-weight: 700; padding: 22px 48px; border: 0; cursor: pointer; }
.button span a svg { font-size: 30px; line-height: 34px; margin-right:10px; }
.button span a:hover  { color: rgba(0,0,0,0.65); }

/******************************************************
/// Header slider, sub-headeri, naslovi
******************************************************/
.header { width: 100%; height: 700px!important; background: transparent; }
.header-bg { position: absolute; top: 80px; left: 0; width: 100%; height: 100%; background-repeat: no-repeat!important; background-size: cover!important; background-position: bottom center!important; background-attachment: fixed!important; z-index:1; }
.header:after { content: ''; position: absolute; bottom: 0%; left: 0px; right: 0px; width: 100%; height: 35%; overflow: hidden; opacity: 0.8;  z-index:3; background: -webkit-gradient(linear, left top, left bottom, from(transparent), to(#000));  background: -webkit-linear-gradient(top, transparent, #000);  background: -moz-linear-gradient(top, transparent, #000);  background: -ms-linear-gradient(top, transparent, #000);  background: -o-linear-gradient(top, transparent, #000);  }

.sub-header-wrapper { position:relative; width: 100%;  } 
.sub-header { width: 100%; position: relative; height: 100px; margin-top: -40px; left: 0; height: 450px!important; }
.sub-header.large { position:relative; width: 100%; height: 100vh!important;  }
.sub-header:after { content: ''; position: absolute; bottom: -80px; left: 0px; right: 0px; width: 100%; height: 35%; overflow: hidden; opacity: 0.8;  z-index:3; background: -webkit-gradient(linear, left top, left bottom, from(transparent), to(#000));  background: -webkit-linear-gradient(top, transparent, #000);  background: -moz-linear-gradient(top, transparent, #000);  background: -ms-linear-gradient(top, transparent, #000);  background: -o-linear-gradient(top, transparent, #000);  }

.page-title { position: relative; display: block; margin:0px auto; height:100%; text-align:center; z-index:9; }
.page-title h1 { position:absolute; left: 50%; bottom: 20px; transform: translate(-50%, 0); color: #fff; padding: 0; text-transform: uppercase; font-weight: 700; font-size: 64px; letter-spacing: 0; text-shadow: 0px 0px 36px rgb(1 2 3);}
.page-title h2 { position:absolute; left: 50%; bottom: -60px; transform: translate(-50%, 0); color: #fff; padding: 15px 0; text-transform: uppercase; font-weight: 500; font-size: 17px; margin-bottom: 40px; }

.main-slider { float: left; width: 100%; position: relative; top: 138px; }
.lyr1 { color: #fff; font-size: 20px; font-weight: 600; text-transform: uppercase; }
.lyr2 { color: #fff; font-size: 72px; font-weight: 600; line-height: 76px; }
.lyr3 p { font-family: 'Libre Baskerville'; color: #fff; font-size: 100px!important; font-weight: 400; line-height: 110px!important; text-align: center !important; text-shadow: 0px 0px 2px rgb(1 2 3); }
.lyr4 { font-weight: 400; color: #fff; font-size: 22px; text-transform: uppercase; }
.layera.wt { background-color: #d1bb87; color: #000000; border-color: transparent; }
.layera.wt:hover { background-color: transparent; color: #fff; border-color: #fff; }
.layera.stt2 { font-size: 18px; background-color: #d1bb87; border-color: transparent; color: #000000; }
.layera.stt2:hover { background: transparent; border-color: #fff; color: #fff; }
.layera { color: #fff; font-size: 16px; font-weight: 600; text-transform: uppercase; border: 2px solid #fff; }
.layera:hover { color: #000000; background-color: #d1bb87; border: 2px solid transparent; }
.tp-bgimg:before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: url('../images/overlay-mask.png') repeat, rgba(14, 118, 188, 0.0);  }
.main-slider.style2 .tp-bgimg:before { opacity: 0.15; }
.main-slider.hp3 .hesperiden .tp-bullet { width: 15px; height: 15px; border-radius: 100px; border: 1px solid #fcfcfc; background: none; }
.tp-bullets { top: 47% !important; }
.main-slider.hp3 .hesperiden .tp-bullet.selected { background: #fff; }

.overlay { position: relative; }
.overlay::before { content: "";display: block; position: absolute; top: 0; bottom: 0; left: 0; right: 0; height: 100%; }

/******************************************************
/// Home grid
******************************************************/
.home-grid { width: 100%; padding: 0; margin-top: 150px; }
.home-grid-wrapper { margin: 0; }
.home-grid-img-wrapper { width: 100%; height: 100%; }
.home-grid-img { position: relative; top: 0; left: 0; width: 100%; height: 100%; background-repeat: no-repeat; background-size: cover; background-position: center center; }
.home-grid-img:after { content: ""; height: 40%; background-color: transparent; background: -webkit-gradient(linear, left top, left bottom, from(transparent), to(#222222)); background: -webkit-linear-gradient(top, transparent, #222222); background: -moz-linear-gradient(top, transparent, #222222); background: -ms-linear-gradient(top, transparent, #d3bfdd); background: -o-linear-gradient(top, transparent, #222222); -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; overflow: hidden; opacity: 0.8; width: 100%; position: absolute; bottom: 0%; left: 0px; right: 0px; }
.home-grid-content-wrapper { display:block; padding: 130px; }
.home-grid-title h2 { text-transform: uppercase; font-size: 60px; color: #d1bb87; font-weight: 100!important; }
.home-grid-title h3 { text-transform: uppercase; font-size: 20px; letter-spacing: 2px; font-weight: 400!important; color: #d1bb87; }
.home-grid-desc span { color: #fff; font-size: 14px; font-weight: 300; }
.home-grid-desc span a { position:relative; top: 40px; text-align:center; margin:0px 12px 0 0; color: #000; font-size: 14px; background-color: #d1bb87; border: 3px dotted rgba(1, 2, 3, 0.8); font-weight: 700; padding: 15px 28px; border-radius: 5px; cursor: pointer; }
.home-grid-desc span.book-now a { color: #000; background-color: rgba(67, 215, 222, 1); border-radius: 5px; }
.home-grid-desc span a:hover, .home-grid-desc span.book-now a:hover { color: rgba(0,0,0,0.45); }
.home-grid-desc p { line-height: 32px; font-size: 18px; margin-bottom: 0; }
.home-grid-desc ul { display: grid; grid-template-columns: repeat(2, auto); justify-content: start; margin: 0px 0; padding:0;  }
.home-grid-desc li { margin-right: 35px; list-style-type: none; font-weight: 500; font-size: 14px; line-height: 30px; }
.only-visible-mobile { display: none; }
.only-visible-desktop { opacity:1; visibility: visible; display:block; }

.home-slider { width: 100%; margin: 30px 0; }
.home-slider ul { width:100%; margin: 0; padding: 0; }
.home-slider ul li { cursor: pointer; border-top-left-radius: 8px; border-top-right-radius: 6px;background: rgba(1, 2, 3,0.9) ; height: auto; text-align: center; list-style: none; margin: 0 10px; padding: 0; }
.home-slider ul li img { width: 100%; border-top-left-radius: 8px; border-top-right-radius: 6px; margin-bottom:30px; }
.home-slider h3 { display:block; color:#d1bb87; font-weight: 600; font-size: 22px; text-align:center; padding: 0 15px; margin: 10px 0 0 0; }
.home-slider .post-desc { display:block; padding-bottom:20px; padding: 10px 15px;  }
.home-slider .post-desc p { color: #d1bb87; font-size: 14px; line-height:24px; text-align:center; padding: 0px 5px; margin: 6px 0 6px 0; }
.home-slider .post-amenities { background:#d1bb87; padding: 5px 15px; border-bottom-left-radius: 8px; border-bottom-right-radius: 8px;  }
.home-slider .post-amenities p { color: #010b13; font-weight:600;font-size: 13px; line-height:23px; }

/******************************************************
/// Slick Slider data
******************************************************/
.slick-slider { position: relative; display: block; box-sizing: border-box; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none;  user-select: none; -webkit-touch-callout: none; -khtml-user-select: none; -ms-touch-action: pan-y; touch-action: pan-y; -webkit-tap-highlight-color: transparent; }
.slick-list { position: relative; display: block; overflow: hidden; margin: 0; padding: 0; }
.slick-list:focus { outline: none; }
.slick-list.dragging { cursor: pointer; cursor: hand; }
.slick-slider .slick-track, .slick-slider .slick-list { -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); -o-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }
.slick-track { position: relative; top: 0; left: 0; display: block; }
.slick-track:before, .slick-track:after { display: table; content: ''; }
.slick-track:after { clear: both; }
.slick-loading .slick-track { visibility: hidden; }
.slick-slide { display: none; float: left;  height: 100%; min-height: 1px; }
[dir='rtl'] .slick-slide { float: right; }
.slick-slide.slick-loading img { display: none; }
.slick-slide.dragging img { pointer-events: none; }
.slick-initialized .slick-slide { display: block; }
.slick-loading .slick-slide { visibility: hidden; }
.slick-vertical .slick-slide { display: block; height: auto; border: 1px solid transparent; }
.slick-arrow.slick-hidden { display: none; }
.slick-loading .slick-list { background: #fff url('../images/icons/ajax-loader.gif') center center no-repeat; }
.slick-prev, .slick-next { z-index: 99; font-size: 0; line-height: 40px; position: absolute; top: 45%; display: inline-block; width:40px; height: 40px; padding: 0; -webkit-transform: translate(0, -50%); -ms-transform: translate(0, -50%); transform: translate(0, -50%); cursor: pointer; color: transparent; border: none; outline: none; background-color: transparent; border-radius: 5px; opacity: 1; }
.slick-prev:hover, .slick-prev:focus, .slick-next:hover, .slick-next:focus { color: transparent; outline: none; background: #d1bb87; }
.slick-prev:hover:before, .slick-prev:focus:before, .slick-next:hover:before, .slick-next:focus:before { opacity: 1; color: #010b13; }
.slick-prev.slick-disabled:before, .slick-next.slick-disabled:before { opacity: .25; }
.slick-prev:before, .slick-next:before { position: absolute; left: 50%; top: 45%; font-family: fontawesome; font-size: 26px; line-height: 1; text-align: center; color: #d1bb87; opacity: 1; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; -webkit-transform: translateX(-50%) translateY(-50%); -moz-transform: translateX(-50%) translateY(-50%); -ms-transform: translateX(-50%) translateY(-50%); -o-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); } }
.slick-prev:hover, .slick-next:hover { color: #010b13; background-color: #d1bb87; }
.slick-prev { left: -50px; }
[dir='rtl'] .slick-prev { right: -50px; left: auto; }
.slick-prev:before { content: '←'; }
[dir='rtl'] .slick-prev:before { content: '→'; }
.slick-next { right: -50px; }
[dir='rtl'] .slick-next { right: auto; left: -50px; }
.slick-next:before { content: '→'; }
[dir='rtl'] .slick-next:before { content: '←'; }
.slick-dotted.slick-slider { margin-bottom: 30px; }
.slick-dots { position: absolute; bottom: -85px; display: block; width: 100%; padding: 0; margin: 0; list-style: none; text-align: center; }
.slick-dots li { position: relative; display: inline-block; margin: 0 8px; padding: 0; cursor: pointer; }
.slick-dots li button { font-size: 0; line-height: 0; display: block; width: 20px; height: 20px; padding: 0; cursor: pointer; color: transparent; border: 2px solid #fff; outline: none; background: transparent; border-radius: 35px; }
.slick-dots li button:hover, .slick-dots li button:focus { outline: none; border: 3px solid transparent; background: #d1bb87; }
.slick-dots li button:hover:before, .slick-dots li button:focus:before { opacity: 1; }
.slick-dots li button:before { font-family: 'slick'; font-size: 12px; line-height: 20px; position: absolute; top: 0; left: 0; width: 10px; height: 10px; content: '•'; text-align: center; opacity: .25; color: black; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; display: none; }
.slick-slide { outline: 0; }

/******************************************************
/// Sadrzaji
******************************************************/
.static-text-wrapper { width: 100%; padding: 100px 0 0 0; }
.static-text { padding: 80px 70px; }
.static-text h2 { font-family: 'Libre Baskerville'; color: #fff; text-transform: capitalize; font-weight: 300; font-size: 30px; margin-bottom: 15px; }
.static-text h3 { color: #fff; font-weight: 700; text-transform: capitalize; font-size: 35px; margin: 50px 0 20px 0;}
.static-text p { font-weight: 400; line-height: 32px; font-size: 18px; margin-top: 5px; margin-bottom: 15px; }
.static-text p strong { font-weight: 600; }
.static-text ul { display: grid; grid-template-columns: repeat(2, auto); justify-content: start; margin: 50px 0; padding:0; }
.static-text li { margin-right: 100px; list-style-type: none; font-weight: 500; font-size: 18px; line-height: 36px;  }
.static-text span { display:inline-block; color: #fff; font-size: 14px; font-weight: 300; margin: 40px 0 50px 0;  }
.static-text span a { text-align:center; margin:0px 12px 30px 0; color: #000; font-size: 14px; background-color: #d1bb87; font-weight: 700; padding: 15px 28px; border: 0; border-radius: 5px; cursor: pointer; }
.static-text span.book-now a { color: #000; background-color: rgba(67, 215, 222, 1); border-radius: 5px; }
.static-text span a:hover, .static-text span.book-now a:hover { color: rgba(0,0,0,0.45); }

a.book-now { color: #000; background-color: rgba(67, 215, 222, 1); border-radius: 5px; text-align:center; color: #000; background-color: #d1bb87; font-weight: 700; padding: 24px 28px; border: 0; border-radius: 5px; cursor: pointer; display: block; font-size: 18px; font-weight: 600; margin: 10px 0 0px 0; }
a.book-now:hover { color: rgba(0,0,0,0.45); }
button.book-now  { float:right; color: #000; background-color: rgba(67, 215, 222, 1); border-radius: 5px; text-align:center; color: #000; background-color: #d1bb87; font-weight: 700; padding: 18px 20px; border: 3px dotted rgba(1, 2, 3, 0.8); border-radius: 5px; cursor: pointer; display: block; font-size: 18px; font-weight: 600; margin: 10px 0 0px 0; }
button.book-now:hover { color: rgba(0,0,0,0.45); }

.welcome-text { color: #fff; float: left; width: 100%; padding: 0 150px; }
.welcome-text p { color: #fff; font-family: 'Libre Baskerville'; font-size: 26px; line-height: 39px; margin-bottom: 0px; }
.welcome-text h2 { color: #fff; font-size: 16px; font-weight: 700; text-transform: capitalize; margin-bottom: 30px; }
.welcome-text span { display:block; margin:0px auto; color: #fff; font-size: 14px; font-weight: 300; width: 300px; }
.welcome-text span a { position:relative; top: 40px; text-align:center; margin: 0; color: #000; font-size: 14px; background-color: #d1bb87; border: 3px dotted rgba(1, 2, 3, 0.8); font-weight: 700; padding: 15px 50px; border-radius: 5px; cursor: pointer; }
.welcome-text span a:hover { color: rgba(0,0,0,0.45); }

.intro-text { color: #fff; float: left; width: 100%; padding: 80px 150px; border-radius: 10px; background-color: #032540; }
.intro-text p { color: #fff; font-family: 'Libre Baskerville'; font-size: 22px; line-height: 36px; margin-bottom: 0px; }
.intro-text h4 { color: #fff; font-size: 16px; font-weight: 700; text-transform: capitalize; margin-bottom: 10px; }

.about { text-align: center; margin: 0; }
.about img { width: 100%; }
.about .img-v4 { margin-top: 50px; }

.villa { margin: 0; }
.villa-img { width: 100%; padding: 0; position:relative; overflow: hidden; }
.villa-content { text-align: center; display:block; width: 100%; }
.villa-content .villa-title h3 { padding: 40px 0 10px 0; color: #032540; font-weight: 700; text-transform: capitalize; font-size: 35px; display:block; margin: 0; width: 100%; }
.villa-content .villa-desc p { padding: 20px; color: #d1bb87; font-weight: 400; line-height: 32px; font-size: 18px; margin-top: 0; margin-bottom:20px; } 
.villa-content .villa-amenities p { color: #d1bb87; font-weight: 400; line-height: 32px; font-size: 18px; margin-top: 15px; margin-bottom: 25px; } 

.static-text .main-facilities ul { grid-template-columns: repeat(3, auto); margin-left:0; column-gap: 50px;  }
.static-text .main-facilities ul li { margin-right: 150px; width:100%; display:inline-block; list-style-type: none; font-weight: 500; font-size: 18px; line-height: 36px; padding: 5px 0;  }
.static-text .facilities ul { display: grid; grid-template-columns: repeat(3, calc(100% / 3)); justify-content: start; margin: 10px 0 0 60px; padding:0; width:100%; column-gap: 0px;  }
.static-text .facilities ul li { text-align: left;  width:100%; display:inline-block; list-style-type: none; font-weight: 500; font-size: 15px; line-height: 30px; padding: 5px 0; }
.static-text .main-facilities, .static-text .facilities p { font-weight: 500; font-size: 13px; }
.static-text span span { text-align:left; display:inline; font-size: 14px; font-weight: 300; margin: 0 20px 0 -28px!important; color: #010b13; font-size: 13px; background-color: #fff; font-weight: 700; padding: 16px 18px; border: 0; border-radius: 5px; border-top-right-radius:0; border-bottom-right-radius:0; cursor: pointer; }

.banner-slider .slider.slider-for, .banner-slider .slider.slider-nav { max-width: 100%; }
.banner-slider .slider.slider-for, .banner-slider .slider.slider-nav { width: 100%; }
.banner-slider .slider.slider-for { padding: 0 5px; }
.banner-slider .slick-slide img { width: 100%; }
.banner-slider .slider-banner-image { height: auto; width: 100%; }
.banner-slider .slider.slider-nav { padding: 20px 0 0; }
.banner-slider .slider-nav .slick-slide.thumbnail-image .thumbImg img { height: 100%; width:100%; object-fit: cover; cursor: pointer; }
.banner-slider .slider-banner-image img { width: 100%; height: 550px; object-fit: cover; }
.banner-slider .slick-vertical .slick-slide:active, .banner-slider .slick-vertical .slick-slide:focus,
.banner-slider .slick-arrow:hover, .banner-slider .slick-arrow:focus { border: 0; outline: 0; }
.banner-slider .slider-nav .slick-slide.slick-current span { color: #196DB6; }
.banner-slider .slider-nav .slick-slide { text-align: center; }
.banner-slider .slider-nav .slick-slide span { font-size: 14px; display: block; padding: 5px 0 15px; }
.banner-slider .slick-arrow { position: absolute; z-index: 99; top: 56px; }
.banner-slider .slider.slider-nav .thumbImg { padding: 0 5px 15px; }
.slider-nav .slick-slide.slick-current.slick-active .thumbImg img { border: 2px solid ##d1bb87; background-color: #d1bb87; padding:5px; }

@media screen and (max-width : 991px) {
    .banner-slider .slider.slider-for, .banner-slider .slider.slider-nav { max-width: 100%; float: none; }
    .banner-slider .slider.slider-for { padding-right: 0; }
    .banner-slider .slider.slider-nav { height: auto; }
    .slider-banner-image { height: 500px; }
    .slider.slider-nav.thumb-image { padding: 10px 30px 0; }
    .slider-nav .slick-slide span { padding: 5px 0; }
    .slick-arrow { padding: 0; width: 30px; height: 30px; top: 50%; bottom: 0; }
    .slick-prev { left: 0; right: unset; }
    .slick-next { left: unset; right: 0; background-color: transparent; }
    .slider.slider-nav.thumb-image { white-space: nowrap; }
    .thumbnail-image.slick-slide { padding: 0px 5px; min-width: 75px; display: inline-block; float: none; }
}

@media screen and (max-width : 767px) {
    .slider-banner-image { height: 400px; }
    .slider.slider-nav.thumb-image { padding: 0px 20px 0; margin: 10px 0px 0; }
    .slider-nav .slick-slide.thumbnail-image .thumbImg { max-width: 140px; height: 80px; }
    .slick-prev.slick-arrow { background-position: center 10px; }
    .slick-next.slick-arrow { background-position: center 10px, center; }
    .slider-nav .slick-slide span { font-size: 12px; white-space: normal; }
}

.btn-wrapper button { color: #fff; width:100%; font-size: 25px; font-weight: 700; letter-spacing: 0.2px; padding: 23px 25px; border-radius: 5px; line-height: 21px; border:none; outline:0; -webkit-box-shadow: 0 0 20px rgba(24, 24, 24, 0.3); box-shadow: 0 0 20px rgba(24, 24, 24, 0.3); background: #524015; background: -moz-linear-gradient(left, #524015 0%, #b4964e 51%, #524015 100%); background: -webkit-gradient(left top, right top, color-stop(0%, #524015), color-stop(51%, #b4964e), color-stop(100%, #524015)); background: -webkit-linear-gradient(left, #524015 0%, #b4964e 51%, #524015 100%); background: -o-linear-gradient(left, #524015 0%, #b4964e 51%, #524015 100%); background: -ms-linear-gradient(left, #524015 0%, #b4964e 51%, #524015 100%); background: -webkit-gradient(linear, left top, right top, from(#524015), color-stop(51%, #b4964e), to(#524015)); background: linear-gradient(to right, #524015 0%, #b4964e 51%, #524015 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='$theme-color-2', endColorstr='$theme-color-2', GradientType=1 ); background-size: 200% auto; }
.btn-wrapper button:hover { background-position: right center; }
.btn-wrapper a { color: #fff; width:100%; font-size: 25px; font-weight: 700; letter-spacing: 0.2px; padding: 23px 25px; border-radius: 5px; line-height: 21px; border:none; outline:0; -webkit-box-shadow: 0 0 20px rgba(24, 24, 24, 0.3); box-shadow: 0 0 20px rgba(24, 24, 24, 0.3); background: #524015; background: -moz-linear-gradient(left, #524015 0%, #b4964e 51%, #524015 100%); background: -webkit-gradient(left top, right top, color-stop(0%, #524015), color-stop(51%, #b4964e), color-stop(100%, #524015)); background: -webkit-linear-gradient(left, #524015 0%, #b4964e 51%, #524015 100%); background: -o-linear-gradient(left, #524015 0%, #b4964e 51%, #524015 100%); background: -ms-linear-gradient(left, #524015 0%, #b4964e 51%, #524015 100%); background: -webkit-gradient(linear, left top, right top, from(#524015), color-stop(51%, #b4964e), to(#524015)); background: linear-gradient(to right, #524015 0%, #b4964e 51%, #524015 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='$theme-color-2', endColorstr='$theme-color-2', GradientType=1 ); background-size: 200% auto; }
.btn-wrapper a:hover { background-position: right center; }

.modal { z-index: 99999999999; }
.modal-backdrop.in { opacity: 1; z-index: 9999999; }
.modal-backdrop { background-color: #fff; }
.modal-dialog {  max-width: 100%; margin: 30px auto; }
.modal-content { border: 0px solid rgba(0,0,0,.2); }
span.required { color:red; font-weight:500; }
.modal-header { display: block; padding: 0px 25px; border-bottom: 0px solid #ccc; }
.modal-header img { display: block; padding: 0 5px 10px 5px; }
	.modal-header .close { padding:5px; font-size:40px; font-weight:300; }
.modal-body { padding: 10px; }
	.modal-body h3 { display:block; color: #4a4a4a; padding:10px 15px 0px 15px; font-weight:500; }
	.modal-body h3 span { color: rgba(3, 37, 64, 1); font-weight:800; }
.modal-footer { padding: 15px 15px; border-top: 0px solid #ccc; }
	.modal-footer .required-info { padding:0 10px 10px 0; color:red; font-size:12px; font-weight:400; font-style:italic; }
	.modal-footer p { font-size:12px; line-height: 20px; font-weight:400; color: #757575; font-style:italic; }
	.modal-footer ul { float: left; width: 100%; margin: 0px 0px; padding: 10px 0; }
	.modal-footer ul li { display: inline-block; padding: 0 10px; list-style: none; }
	.modal-footer ul li:first-child { padding: 0 10px 0 0; }
	.modal-footer ul li::after { content: "/"; position: relative; top: 1px; bottom: 1px; right: -10px; width: 5px; }
	.modal-footer ul li:last-child::after { display:none; }
	.modal-footer ul li a { color: #757575; font-size: 12px; font-weight: 400; position: relative; }
	.modal-footer ul li a:before { content: ''; position: absolute; bottom: 0; left:50%; width: 0; bottom: -5px; height: 1px; background-color: #757575; opacity: 0; visibility: hidden; }
	.modal-footer ul li a:hover:before { opacity: 1; visibility: visible; width: 100%; left: 0; }

form .col-sm-6 { float: left; margin-bottom: 15px; }
form a svg { color: #333; font-size: 40px; margin-left: 10px; top: 0px; position: relative; }
form a svg:hover { opacity:0.65; }
.form-group { margin-bottom: 12px; }
.form-group img { height: 48px; margin-top: -6px; }
.input-group-addon { padding: 3px 12px; font-size: 16px; font-weight: 400; line-height: 1; color: #333; text-align: center; background-color: #eee; border: 1px solid #ccc; border-radius: 0px;  }
.form-control { display: block; width: 100%; height: 48px; font-weight: 600; padding: 3px 12px; font-size: 16px; line-height: 1.42857143; color: #d1bb87; background-color: #010b13; background-image: none; border: 1px solid rgba(209, 187, 135, 1); border-radius: 5px; -webkit-transition: border-color ease-in-out .15s,-webkit-box-shadow ease-in-out .15s; -o-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s; transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s; }
.form-control:disabled, .form-control[readonly] { background-color: rgba(1, 2, 3, 0.6); opacity: 1; }
.alert-danger { padding: 15px; min-height: 50px; }
.info {color: #333; padding: 15px 0; font-size: 14px; border-top:1px solid #ccc; margin-top:20px; }
.alert-success { padding: 15px; min-height: 70px; }
textarea.form-control { height: auto; }

.masonry { float: left; width: 100%; }
.masonry .col-lg-4, .masonry .col-lg-8 { padding: 0; }
.masonry-item { float: left; width: 100%; padding: 0; }
.fotka { float: left; width: 100%; position: relative; overflow: hidden; }
.fotka::before { content: ""; position: absolute; width: 100%; height: 100%; left: 0; right: 0; top:0; bottom:0; background-color: rgba(16,33,46,0.35); -webkit-transition: all 1s ease 0s; -moz-transition: all 1s ease 0s; -o-transition: all 1s ease 0s; transition: all 1s ease 0s; opacity: 0; }
.fotka > a { width: 100px; height: 100px; position: absolute; top: 50%; left: 0; right: 0; z-index: 1; opacity: 0; margin: 0 auto; -webkit-transition: all 1s ease 0s; -moz-transition: all 1s ease 0s; -o-transition: all 1s ease 0s; transition: all 1s ease 0s; -webkit-transform: translate(0%, -50%); -moz-transform: translate(0%, -50%); -ms-transform: translate(0%, -50%); transform: translate(0%, -50%); }
.fotka > a svg { color:#fff; display:block; text-align:center; font-size:90px; opacity: 1; margin: 0 auto; }
.masonry-item:hover .fotka:before { height: 0; }
.masonry-item:hover .fotka img { }
.fotka img { width: 100%; margin-bottom:0%; }
.opis { float: left; padding-top: 20px; }
.opis h3 { color: #fff; font-size: 18px; font-weight: 700; margin-bottom: 3px; }
.opis h3 > a { color: #fff; }
.opis span { color: #fff; font-size: 13px; font-weight: 400; } 
.fotka-hover { position: absolute; left: 0; right: 0; bottom: 30px; -webkit-transition: all 1s ease 0s; -moz-transition: all 1s ease 0s; -o-transition: all 1s ease 0s; transition: all 1s ease 0s; opacity: 0; z-index: 1; display: inline-block; text-align: center; color: #fff; text-transform: uppercase; }
.fotka-hover h3 { font-size: 14px; font-weight: bold; letter-spacing: 1px; }
.fotka-hover h4 { font-size: 12px; color: #33a9ee; margin-bottom: 0; }
.fotka:hover .fotka-hover, .fotka:hover::before, .fotka:hover > a { opacity: 1; }
.fotka .opis { opacity:0; position:absolute; bottom:32px; left:0; right:0; text-align:center; text-transform:uppercase; padding:0px; -webkit-transition: all .3s ease-in-out; -moz-transition: all .3s ease-in-out; -ms-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out; }
.fotka:hover .opis { opacity:1; color:#fff; }
	
/**** MagnificPopup - hack animacije *************/
.mfp-fade.mfp-bg { opacity: 0; -webkit-transition: all 0.35s ease-out; -moz-transition: all 0.35s ease-out; transition: all 0.35s ease-out; }
	.mfp-fade.mfp-bg.mfp-ready { opacity: 0.8; }
	.mfp-fade.mfp-bg.mfp-removing { opacity: 0; }
	.mfp-fade.mfp-wrap .mfp-content { opacity: 0; -webkit-transition: all 0.35s ease-out; -moz-transition: all 0.35s ease-out; transition: all 0.35s ease-out; }
	.mfp-fade.mfp-wrap.mfp-ready .mfp-content { opacity: 1; }
	.mfp-fade.mfp-wrap.mfp-removing .mfp-content { opacity: 0; }

.destination .block { margin: 150px 0 150px 0; padding: 60px 0; }
.destination { position:relative; margin-top: 0; background-image: url(../images/bg/destination-bg.jpg); background-size: cover; background-position: center center; background-repeat: no-repeat; padding: 0 0; }
.destination:after { content: ''; background-color: rgba(0,0,0,0.65); height: 45%; background-color: transparent; background: -webkit-gradient(linear, left top, left bottom, from(transparent), to(#000)); background: -webkit-linear-gradient(top, transparent, #000); background: -moz-linear-gradient(top, transparent, #fff); background: -ms-linear-gradient(top, transparent, #fff); background: -o-linear-gradient(top, transparent, #000); overflow: hidden; opacity: 0.8; width: 100%; position: absolute; bottom: 0%; left: 0px; right: 0px; }
.destination-img { float: left; width: 100%; text-align: right; padding-left: 40px; }
.destination-img h2 { color: #fff; font-size: 35px; line-height: 48px; font-weight: 700; }
.destination-destinacije { float: left; width: 100%; padding-left: 20px; padding-right: 30px; }
.destination-column { float: left; width: 100%; }
.destination-column h3 { font-family: 'Libre Baskerville'; color: #d1bb87; font-size: 28px; font-weight: 700; margin: 20px 0 20px 0; position: relative; text-transform: uppercase; }
.destination-column p { color: #d1bb87; font-size: 18px; line-height: 32px; padding-right: 30px; margin-bottom: 0; }
.destination-destinacije span.read-more.large a { text-align:center; margin:0 0 0 15px; color: #000; font-size: 14px; font-weight: 500; padding: 15px 17px; background-color: #d1bb87; border: 3px dotted rgba(1, 2, 3, 0.8); cursor: pointer; position: absolute; top: 50%; transform-origin: center top; transform: translateX(-50%) rotate(-90deg); border-radius: 5px; width:300px; }
.destination-destinacije span.book-now a { text-align:center; margin:0 0 0 20px; color: #fff; font-size: 14px; background-color: #3a7727; font-weight: 500; padding: 11px 17px; border: 0; cursor: pointer; position: absolute; top: 75%; transform-origin: center top; transform: translateX(-50%) rotate(-90deg); border-radius: 5px; width:175px; }
.destination-destinacije span.read-more:hover a:hover, .destination-destinacije span.book-now:hover a:hover  { color: rgba(0,0,0,0.65); opacity: 1; }

/******************************************************
/// Footer
******************************************************/
footer { float: left; width: 100%; position: relative; background: rgba(255,255,255,1); border-top: 40px solid rgba(209, 187, 135, 0.8); margin-top: 0; }
.footer-data { float: left; width: 100%; padding: 150px 0 70px 0; text-align: center; }

.footer-kontakt { float: left; width: 100%; margin-bottom: 75px; }
.footer-kontakt p { text-transform: uppercase; font-weight: 700; font-size: 14px; text-transform: uppercase; margin-bottom: 20px; }
.footer-kontakt h2 { color: #010b13; font-size: 60px; font-weight: 700; margin-bottom: 30px;  }
.footer-kontakt h3 { color: #010b13; font-size: 18px; line-height: 30px; font-weight: 600; margin-bottom: 15px; }

.footer-menu { float: left; width: 100%; }
.footer-menu ul { float: left; width: 100%; margin-bottom: 65px; padding: 0; border-top:1px solid #010b13; border-bottom: 1px solid #010b13; padding: 20px 0; }
.footer-menu ul li { display: inline-block; padding: 0 10px; list-style: none; }
.footer-menu ul li::after { content: "/"; position: relative; top: 1px; bottom: 1px; right: -10px; width: 5px; color: #010b13;}
.footer-menu ul li:last-child::after { display:none; }
.footer-menu ul li a { color: #010b13; font-size: 13px; font-weight: 500; position: relative; }
.footer-menu ul li a:before { content: ''; position: absolute; bottom: 0; left:50%; width: 0; bottom: -5px; height: 1px; background-color: #010b13; opacity: 0; visibility: hidden; }
.footer-menu ul li a:hover:before { opacity: 1; visibility: visible; width: 100%; left: 0; }

.copyright { float: left; width: 100%; text-align:center; }
.copyright p { color: #010b13; font-weight: 600; font-size: 14px; margin-bottom: 0; }
.copyright p small { font-size:11px; padding-top:30px; display:inline-block; }
.copyright img { float: none; text-align:center; }

.design { max-width:200px; margin:0px auto; font-size: 10px; font-weight: 400; color: #d1bb87; text-transform:uppercase; padding: 10px 10px; margin-top:60px;  }
.design a { color:#d1bb87; display:block; padding-top:3px; }
.design a:hover { opacity: 0.75; }

/******************************************************
/// Preloader
******************************************************/
.loaded #loader-wrapper { visibility: hidden; -webkit-transition: all 0.4s 0.7s ease-out; transition: all 0.4s 0.7s ease-out; }
.loaded #loader { opacity: 0; -webkit-transition: all 0.3s 0.6s ease-out; transition: all 0.3s 0.6s ease-out; }
#loader-wrapper { position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 9999; background: #010b13; opacity:0.9; }
#loader { display: block; position: relative; left: 50%; top: 50%; width: 150px; height: 150px; margin: -75px 0 0 -75px; border-radius: 50%; border: 15px solid transparent; border-top-color: #d1bb87; border-bottom-color: #d1bb87; -webkit-animation: spin 2s linear infinite;  animation: spin 2s linear infinite; }
#loader::before { content: ""; position: absolute; top: 5px; left: 5px; right: 5px; bottom: 5px; border-radius: 50%; border: 10px solid transparent; border-top-color: #d1bb87; -webkit-animation: spin 3s linear infinite; animation: spin 3s linear infinite; }
#loader::after { content: ""; position: absolute; top: 15px; left: 15px; right: 15px; bottom: 15px; border-radius: 50%; border: 5px solid transparent; border-top-color: #d1bb87; -webkit-animation: spin 1.5s linear infinite; animation: spin 1.5s linear infinite; }
#loader-wrapper .slogan { position: absolute; top: 63%; left: 50%; margin-left: -100px; max-width: 200px; font-family: 'Montserrat', sans-serif; text-align:center; font-size:12px; line-height: 20px; font-weight:600; color:#d1bb87; }

@-webkit-keyframes spin {
 0% { -webkit-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); }
 100% { -webkit-transform: rotate(360deg); -ms-transform: rotate(360deg); transform: rotate(360deg); }
}
@keyframes spin {
 0% { -webkit-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); }
 100% { -webkit-transform: rotate(360deg); -ms-transform: rotate(360deg); transform: rotate(360deg); }
}

/******************************************************
/// Cookies notice
******************************************************/
#cookies-notice { cursor:pointer; position: fixed; bottom: 0; width: 100%; background: rgba(0, 0, 0, 0.5); z-index: 1030; color: #fff; padding: 8px 0; }

/******************************************************
/// Under construction
******************************************************/
body#page-maintenance { background: url("../images/maintenance-bg.jpg") no-repeat center top fixed!important; background-size: cover; -moz-background-size: cover; -webkit-background-size: cover; -ms-background-size: cover; -o-background-size: cover; }
.maintenance-msg { font-size: 24px; color: #fff; font-weight: 200; }

/******************************************************
/// Youtube Video
******************************************************/
.video-v4 { padding: 0; position: absolute; z-index: 9; left: 50%; transform: translate(-50%, 0); bottom: -175px; }
.video-destination {  bottom: -25px; }
	.video-v4 iframe { border: 0; }
.btn-play { transition: all .2s ease-in-out; position: relative; display: block; top: 105px; left: 50%; transform: translateX(-50%) translateY(-50%); transition: all .3s; background: url(../images/icons/btn-play.png); width: 128px; height: 128px; background-repeat: no-repeat; }
	.btn-play:hover { opacity:0.95; }
.modal-video { position: fixed; visibility: hidden; opacity: 0; transform: scale(2); transition: all .5s; top: 0; left: 0; width: 100%; display: block; height: 100%; background: rgba(0, 0, 0, .9); z-index: 99999999999; }
	.modal-video iframe { position: relative; top: 150px; width: 700px; max-width: 90%; display: block; margin: 0 auto; border: 0; }
	.modal-video iframe .ytp-autohide .ytp-watermark { display: none!important; }
	.modal-video.opened { visibility: visible; opacity: 1; transform: scale(1); }
.modal-video .close { color: #d1bb87; float: right; font-size: 50px; padding-top: 40px; padding-right: 50px; cursor: pointer; opacity:1; }
.modal-video .close:hover { color: #fff; }

/******************************************************
/// Na vrh, na sekciju
******************************************************/
.scrollup { position: fixed; bottom: 13px; right: 16px; display: none; padding:2px 10px; text-align:center; color:#010b13; font-size:40px; line-height:40px; border-radius:8px; background-color: #d1bb87; z-index:999; }
	.scrollup:hover,.scrollup:focus { background-color: #010b13; color:#fff; text-decoration:none; }