/****************

    ERIC MEYER'S RESET

****************/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	font-family: inherit;
	vertical-align: baseline;
}
/* remember to define focus styles! */
:focus {
	outline: 0;
}
html, body { overflow-x: hidden; min-height:859px; }
body {
	line-height: 1;
	background:#f9f7ef;
	font:400 15px/1.4em "Playfair Display", serif;
	color:#666;
}
/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: collapse;
	border-spacing: 0;
}
caption, th, td {
	text-align: left;
	font-weight: normal;
}
strong{
    font-weight:bold; 
}
em{ 
    font-style:italic; 
}

/****************

    STRUCTURE

****************/

#container{ width:100%; max-width:1216px; margin:0 auto; }
    #header{ position:relative; clear:both; height:160px; width:100%; text-align:center; }
    #main{ padding-left:178px; max-width:860px; padding-right:178px; position:relative; }
        #content{ overflow:hidden; }
        #sidebar{ background-color:green; }
    #footer{ position:relative; max-width:100%; margin:0 auto; position:relative; clear:both; border-top:1px solid #A19C9A; margin-top:10px; }

/****************

    TEXT

****************/

h1{ color:#000; font-size:49.5px; line-height:56px; border-top:1px solid #c4c3bc; padding-bottom:18px; margin-bottom:20px; padding-top:7px; text-align:center; background:url(bg/h1.png) no-repeat 50% 100%; clear:both; }
h2{ color:#000; font-size:23px; line-height:30px; border-bottom:1px solid #a19c9a; margin-bottom:20px; padding:5px 0; }
.images h2, .image h2 { text-align:center; margin-bottom:10px; }
h3{}
h4{}
h5{}
h6{}
p{ padding-bottom:20px; }

/****************

    LINKS

****************/

a{ color:#3ba8cb; text-decoration:none; }
a:hover{ text-decoration:underline; }

/****************

    IMAGES

****************/

img{}

/****************

    LISTS

****************/

ul, ol, dl{}
    dt{}
    dd, li{}

/****************

    TABLES

****************/

table{}
    thead, tbody, tfoot{}
        th, td{}

/****************

    FORMS

****************/

fieldset{}
    legend{}
    select{}
        option{}
    label{}
    input, textarea{}
        .submit{}


/*
usefull classes
*/
.clear{ width:100%; clear:both; height:1%; font-size:1px; }
.imgleft{ float:left; margin:0 20px 20px 0; }
.imgright{ float:right; margin:0 0 20px 20px; }

/* header */
#logo { width:332px; height:109px; display:block; margin:0 auto; position:relative; top:25px; max-width:95%; }

/* menu */
.menu { width:168px; position:absolute; }
.menu.leftmenu { left:0; top:0; text-align:right; }
.menu.rightmenu { right:0; top:0; text-align:left; min-height:625px; }

#bottom-right { position:absolute; bottom:110px; border:1px solid #3ba8cb; border-width:1px 0; padding:10px 0; width:100%; }
#bottom-right a { text-transform:uppercase; padding:0 14px; }

.menu ul, .sb-slidebar ul { list-style:none; }
.menu li, .sb-slidebar li { margin-bottom:5px; }
.menu a, .sb-slidebar a { display:block; color:#000; padding:3px 14px; line-height:17px; }
.menu .homenav a, .sb-slidebar .homenav a { background-color:#5789ac; color:#fff; }
.menu .hl a, .sb-slidebar .hl a { background-color:#3ba8cb; color:#fff; }
.menu a.active, .menu .hl a.active { background-color:#83b8c9; color:#fff; }

.navigator { display:none; width:58px; height:44px; margin:10px; cursor:pointer; z-index:2000; }

.sb-slidebar ul { padding:10px; }
.sb-slidebar a { text-align:center; }

.border { border-bottom:1px solid #3ba8cb; height:1px; }

#book-menu { position:absolute; bottom:0; left:0; }
#book-menu a { background:url(bg/book.png) no-repeat 0 0; text-transform:uppercase; color:#fff; display:block; padding:0 0 0 14px; width:154px; height:26px; line-height:26px; font-size:18px; }

.sb-slidebar #book-menu { position:relative; bottom:0; }
.sb-slidebar #book-menu a{ text-align:center; width:100%; padding:0; background-color:#5789ac; background-position:top right; }

.navbar-fixed-top { position:fixed; top:0; left:0; width:100%; text-align:right; z-index:5000; }

#socials { width:100%; clear:left; float:left; position:absolute; bottom:45px; }
#socials p { padding-bottom:5px; text-align:center; }
.socicons { width:100%; text-align:center; }
.socicons .soc { display:inline-block; margin:0 5px; padding:0; width:30px; height:30px; background-position:0 0; background-repeat:no-repeat; }
.socicons .soc:hover { background-position:0 -30px; }
.s-fb { background-image:url(bg/facebook.png); }
.s-in { background-image:url(bg/instagram.png); }
.s-nl { background-image:url(bg/newsletter.png); }
.s-li { background-image:url(bg/linkedin.png); }
.s-tw { background-image:url(bg/twitter.png); }
.s-yt { background-image:url(bg/youtube.png); }

.sb-slidebar #socials { position:relative; padding:10px 0; float:none; bottom:0; }

/* images */
.mainimg { position:relative; left:50%; margin-left:-430px; }
#map { width:100%; height:570px; }

/* pagination */
.pagination { list-style:none; float:left; width:100%; padding-top:25px; padding-bottom:8px; }
.pagination li { float:left; padding-left:18px; background:url(bg/pagination.png) no-repeat 6px 50%; }
.pagination li:first-child { padding-left:0; background:none; }
.pagination a { display:block; color:#000; text-transform:uppercase; line-height:13px; }

/* columns */
.one, .two, .three { width:100%; float:left; }

.two div.column { float:left; width:49%; padding-left:2%; }
.two div.column:first-child { padding-left:0; }

.three div.column { float:left; width:32%; padding-left:2%; }
.three div.column:first-child { padding-left:0; }

.column img { width:100%; padding-bottom:18px; }

/* images */
.images, .image { clear:left; padding-bottom:10px; }
.image img{ width:100%; }
.images img{ width:100%; margin-bottom:10px; }

/* slidebar */
#sb-site {
	width: 100%;
	min-height: 100%; /* Initially set here but accurate height is set by slidebars.js */
	position: relative;
	z-index: 1; /* Site sits above Slidebars */
	background-color: #ffffff; /* Default background colour, overwrite this with your own css. */
}

/* ---------------
 * 003 - Slidebars
 */

.sb-slidebar {
	height: 100%;
	overflow-y: auto; /* Enable vertical scrolling on Slidebars when needed. */
	position: fixed;
	top: 0;
	z-index: 0; /* Slidebars sit behind sb-site. */
	visibility: hidden; /* Initially hide the Slidebars. */
	background-color: #bbb;
}

.sb-static { /* Makes Slidebars scroll naturally with the site, and unfixes them for Android Browser 2.X. */
	position: absolute;
	height: auto;
	/* min-height set by slidebars.js */
}

.sb-left {
	left: 0; /* Sets Slidebar to the left. */
}

.sb-right {
	right: 0; /* Sets Slidebar to the right. */
}

html.sb-active-left .sb-left,
html.sb-active-right .sb-right {
	visibility: visible; /* Makes Slidebars visibile when open. */
}
.sb-slidebar {
	width: 30%; /* Browsers that don't support media queries. */
}

html.sb-anim-type-translate .sb-slide, html.sb-anim-type-side .sb-slide {
	-webkit-transition: -webkit-transform 400ms ease;
	   -moz-transition: -moz-transform 400ms ease;
	     -o-transition: -o-transform 400ms ease;
	        transition: transform 400ms ease;
	-webkit-transition-property: -webkit-transform, left; /* Add 'left' for Android < 4.4 */
	-webkit-backface-visibility: hidden; /* Prevents flickering. */
}

.slides { position:relative; display:none; }
.slidesjs-navigation { position:absolute; z-index:2000; top:50%; margin-top:-26px; display:block; width:52px; height:52px; background-size:contain; }
.slidesjs-prev { left:0; }
.slidesjs-next { right:0; }

/* footer */
#nefertum { position:absolute; right:0; top:10px; }
#footer p { padding-top:20px; font-size:12px; color:#999; }

/* forms */
.hdnSpam { display:none; }
.form { list-style:none; }
.form li { margin-bottom:10px; }
.form label { padding-bottom:5px; display:block; }
.form input, .form textarea, .form select { border:1px solid #3ba8cb; padding:4px 7px; width:350px; font:400 14px/1.4em "Playfair Display", serif; color:#777; max-width:100%; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; box-sizing:border-box; }
input[type="submit"] { padding:10px 20px; color:#fff; border:0; background-color:#3ba8cb; text-decoration:none; cursor:pointer; }
input[type="submit"]:hover { text-decoration:underline; }

.villa-nina, .villa-both { display:none; }

.reservation-form, .contact-form { width:360px; max-width:100%; margin:0 auto; }

/* impressum */
.ocjene{ width:100%; float:left; }
.ocjena{ float:left; padding-right:5px; }
.star{ width:19px; height:20px; background:url(bg/star.png) no-repeat 0 0; float:left; display:block; }

#gotop.visible { -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; filter: "alpha(opacity=100)"; -moz-opacity: 1; -khtml-opacity: 1; opacity: 1; visibility: visible; -webkit-transition-delay: 0s, 0s; -moz-transition-delay: 0s, 0s; -o-transition-delay: 0s, 0s; transition-delay: 0s, 0s; }
#gotop { cursor:pointer; width:40px; height:40px; background:url(bg/gotop.png) no-repeat 0 0; background-size:contain; position:fixed; bottom:40px; right:40px; /**/ -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; filter: "alpha(opacity=0)"; -moz-opacity: 0; -khtml-opacity: 0; opacity: 0; visibility: hidden; z-index: 1; -webkit-transition-property: opacity, visibility; -moz-transition-property: opacity, visibility; -o-transition-property: opacity, visibility; transition-property: opacity, visibility; -webkit-transition-duration: .2s, 0s; -moz-transition-duration: .2s, 0s; -o-transition-duration: .2s, 0s; transition-duration: .2s, 0s; -webkit-transition-delay: 0s, .2s; -moz-transition-delay: 0s, .2s; -o-transition-delay: 0s, .2s; transition-delay: 0s, .2s; }


/* newsletter */
#footer p { float:left; width:50%; }
#mc_embed_signup { float:right; width:50%; text-align:right; padding:10px 0; }
    #mc_embed_signup label { font-size:12px; }
    #mc_embed_signup input { margin-bottom:5px; padding:5px; }
.footer-nl-title { text-align:right; }

/* tags */
#tags{ float:left; width:100%; clear:both; }
.tag-icon{ width:20px; height:22px; background:url(bg/tags.png) no-repeat 0 0; display:inline-block; margin-bottom:15px; float:left; }
.tag{ height:22px; line-height:22px; font-size:13px; background:#A19C9A; color:#fff; padding:0 5px; margin-left:15px; margin-bottom:15px;  border-radius:5px; display:inline-block; }
.tag:hover{ background:#3ba8cb; color:#fff; text-decoration:none; }

/* responsive */
@media screen and (max-width:767px) {
	.menu { display:none; }
	.mainimg { left:0; margin-left:0; width:100%; }
	#map { width:100%; height:300px; }
	#main { padding-left:10px; padding-right:10px; }
	.navigator { display:inline-block; }
	.form input, .form textarea, .form select { width:100%; }
}

@media screen and (max-width:640px) {
	#content .column { width:100%; padding-left:0; }
	#header { height:180px; }
	#logo { padding-top:20px; }
	#logo img { max-width:100% !important; height:auto !important; }
}




/* EDITOR PROPERTIES - PLEASE DON'T DELETE THIS LINE TO AVOID DUPLICATE PROPERTIES */