@import url(http://fonts.googleapis.com/css?family=Noto+Serif:400,700&subset=latin,latin-ext);

/******************************* RESET *******************************/



html, body, div, span, object, iframe,

h1, h2, h3, h4, h5, h6, p, blockquote, pre,

abbr, address, cite, code,

del, dfn, em, img, ins, kbd, q, samp,

small, strong, sub, sup, var,

b, i,

dl, dt, dd, ol, ul, li,

fieldset, form, label, legend,

table, caption, tbody, tfoot, thead, tr, th, td,

article, aside, canvas, details, figcaption, figure, 

footer, header, hgroup, menu, nav, section, summary,

time, mark, audio, video 

{margin:0; padding:0; border:0; outline:0; font-size:100%; vertical-align:baseline; background:transparent;}

html {overflow-y: scroll;}

article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section {display:block;}

nav ul {list-style:none;}

blockquote, q {quotes:none;}

blockquote:before, blockquote:after, q:before, q:after {content:''; content:none;}

a {margin:0; padding:0; font-size:100%; vertical-align:baseline; background:transparent;}

ins {background-color:#ff9; color:#000; text-decoration:none;}

mark {background-color:#ff9; color:#000; font-style:italic; font-weight:bold;}

del {text-decoration: line-through;}

abbr[title], dfn[title] {border-bottom:1px dotted; cursor:help;}

table {border-collapse:collapse; border-spacing:0;}

hr {display:block; height:1px; border:0; border-top:1px solid #cccccc; margin:1em 0; padding:0;}

input, select {vertical-align:middle;}



/******************************* CSS3 FANCY EFFECTS *******************************/



::selection      {background: #974827;color:#fff;}

::-moz-selection {background:#974827;color:#fff;}



.roundy {-webkit-border-radius:0 0 14px 14px; -moz-border-radius: 0 0 14px 14px; border-radius: 0 0 14px 14px;}



.botleftroundy {-webkit-border-radius:0 0 0 14px; -moz-border-radius: 0 0 0 14px; border-radius: 0 0 0 14px;}



a {  

  outline:none;

 -webkit-transition: color .25s ease-out, text-shadow .25s ease-out;

  -moz-transition: color .25s ease-out, text-shadow .25s ease-out;

  -o-transition: color .25s ease-out, text-shadow .25s ease-out;

  transition: color .25s ease-out, text-shadow .25s ease-out;

}  



/******************************* INDEX, HEADER, FOOTER *******************************/



html {overflow-y:scroll;}



body {

    line-height:18px;

	font-family: 'Noto Serif', serif;

	color:#3c3c3c;

	font-size:14px;

	background: url(../images/body_bg.jpg) no-repeat center bottom;

	 -webkit-background-size: cover;

  -moz-background-size: cover;

  -o-background-size: cover;

  background-size: cover;

}



.wrap {width:960px; margin:0 auto; padding: 0 20px; margin-top: 30px; background: rgba(255,255,255,0.3); position:relative; -webkit-box-shadow: 0 0 3px 3px rgba(0,0,0,0.2);

box-shadow: 0 0 3px 3px rgba(0,0,0,0.2); -webkit-border-radius: 20px;-moz-border-radius: 20px;border-radius: 20px;}



header {height:130px; float:left; width:960px; position:relative; background: #FFF url(../images/na-prodaj.png) no-repeat right top; margin-top: 20px; text-align: center; -webkit-border-radius: 20px 20px 0px 0px;-moz-border-radius: 20px 20px 0px 0px;border-radius: 20px 20px 0px 0px; }

header.other {height:130px; float:left; width:960px; position:relative; background: #FFF !important; margin-top: 20px; text-align: center; -webkit-border-radius: 20px 20px 0px 0px;-moz-border-radius: 20px 20px 0px 0px;border-radius: 20px 20px 0px 0px; }

header h1, header h2 { left:0; top:8px; width: 100%; height:50px; margin-top: 25px; font-size: 38px; position:absolute; color: #3c3c3c; font-weight: normal;}

header div {font-family: 'Noto Serif', serif; height:12px; text-align:right; right:0; top:8px; font-size:13px; padding:4px 0 0 0; text-align:center; color:#fff;  position:absolute;}

header div a {  color:#8fc7f6; font-weight:normal;text-decoration:none;}

header div a:hover {text-decoration:none; color:#fff; }

header div a.active {text-decoration:underline;}



#logo {background: url('../images/vila_rab.jpg') no-repeat center center; text-indent: -5000px; margin-top:-10px; width: 100%; height: 88px;}



nav {right:0; bottom:20px; position:absolute; font-size:17px; width:700px;}

nav ul { list-style:none; padding:0 0 0 0;}

nav ul li {padding:0 0 0 10px; background:none; display:inline;}

nav ul li a { color:#ffffff; text-decoration:none; padding:0 10px 0 10px; }

nav ul li a.active { color:#FFF; text-decoration:underline; }

nav ul li a:hover { color:#FFF; text-decoration:underline; }

nav ul li.last { background:none;}



footer {  float:left; border-top:2px solid #ffffff; margin-top:0; padding:5px 0 30px 0; width:960px; font-size:12px;}

footer p.left { color:#ffffff; width:450px; float:left; font-size:12px;}

footer p.right { float:right; width:238px;}

footer p.right img { float:left; margin:4px 0 0 10px;}

footer a { color:#ffffff;text-decoration:none; float:left;}

footer a:hover { text-decoration:underline;}



/******************************* BODY OZADJA za INDEX in SUB *******************************/

#bgindex { min-height:500px;}

#bgsub { background:#06F; min-height:500px;}



/******************************* INDEX MIDDLE *******************************/

#middle { border:7px solid #ffffff; margin-top:10px; float:left; width:946px; position:relative;  height:350px;}

#middle a { color:#8fc7f6;}

#middle a:hover { color:#000; text-decoration:underline;}



.tekst h1 { font-weight:normal; font-size:42px; padding-bottom:15px; color: #000000;}

.tekst { right:50px; bottom:40px; width:450px; padding:20px 15px 10px 25px; z-index:24; background: url(../images/tekstbg.png); position:absolute;}



.image {width:946px!important; height:350px!important; position:absolute; top:0; left:0;}

.image img {width:946px!important; height:350px!important;}



#boksi { float:left; width:960px; margin-top:0; font-size:13px; padding-bottom: 30px;}

.box { float:left; color:#3c3c3c; background:#ffffff; padding:0 0 15px 0; width:310px; margin:20px 15px 0px 0; display:inline;}

.last { margin-right:0;}

.box div { float:left; width:280px; padding:10px 15px 0 15px;}

#boksi h3 { font-weight:bold; padding:10px 10px; color:#ffffff; background:#974827; }

#boksi a {color:#974827; text-decoration:underline;}

#boksi a:hover {color:#974827;}



.last a {color:#974827!important;}

.last a:hover {color:#000 !important;}



/******************************* SUB MIDDLE *******************************/

header {position: relative;}

.lang {position: absolute; left: 20px; width: 100px; margin-top: -55px;}



#submiddle {float:left; width:960px;background:#ffffff;margin-top:0; margin-bottom: 20px; -webkit-border-radius: 0px 0px 20px 20px;-moz-border-radius: 0px 0px 20px 20px;border-radius: 0px 0px 20px 20px;}

#submiddle h1.title {font-weight:normal; padding:10px 10px 10px 20px; background:#974827; color:#ffffff; float:left; width:930px;}



.image {width:946px; height:350px; position:absolute; top:0; left:0; }

.image img {width:946px; height:350px;}



.subimage {width:946px; height:190px; float:left;border:7px solid #ffffff; margin-top: 10px;}

.subimage img {width:946px; height:190px;}



.stasaimage {width:946px; height:350px; float:left;border:7px solid #33322B;}

.stasaimage img {width:946px; height:350px;}





#left { float:left; padding:25px 5px 20px 20px; width:175px; font-size:13px; line-height:18px;}



#left ul { padding:0 0 0 0;font-size:15px;}



#left ul li { padding:0 0 0 0; background:none; float:left; margin:2px 0;}



#left ul li a { background:url(../images/ulli.gif) left 9px no-repeat; text-decoration:none; color:#000; float:left; padding:4px 10px 4px 18px;}



#left ul li a:hover { color:#8fc7f6;}



#left ul li a.active { background:#000; color:#ccc;}



#left h3 { border-bottom:1px dotted #33322B; margin-bottom:10px; padding-bottom:10px;}



#left a {color:#974827;}



#left a:hover { color:#000; }



#content { float:left;padding:0 19px 20px 29px; line-height:20px; border-left:1px dotted #33322B; width:690px; margin:20px 10px; display:inline; min-height:300px; }

#content a {; color:#974827;}

#content a:hover { color:#999}

#content h1 { padding-bottom:10px;}



#content ul li { padding-bottom:6px;}



#content h3 {font-size:20px;padding-bottom:5px; padding-top:20px;}





/******************************* COMMON STYLES *******************************/



h1 {font-size:20px;}

h2 {font-size:18px; padding: 8px 0 8px 0;}

h3 { font-size:16px; font-weight:normal;}



p { padding:8px 0;}



ul { list-style:none; padding:0 0 0 0;}

ul li { padding:0 0 3px 16px; background:url(../images/ulli.gif) left 5px no-repeat;}



.alterfontlight {font-family: 'Noto Serif', serif; font-weight:normal; background: #974827;

float: left;

position: relative;

width: 100%;

padding: 10px 0;

margin-top: 122px;}

.alterfontregular {font-family: 'Noto Serif', serif;font-weight:normal;}

.alterfontbold {font-family: 'Noto Serif', serif; font-weight:normal;}

.alterfontbook {font-family: 'Noto Serif', serif; font-weight:normal;}





.scrollable {

    /* required settings */

    position:relative;

    overflow:hidden;

    width: 620px;

    height:120px;    

}



.scrollable .items {

    /* this cannot be too large */

    width:20000em;

    position:absolute;

    clear:both;

}



.items div {

    float:left;

    width:680px;

}



/* single scrollable item */

.scrollable img {

    float:left;

    margin:0 2px 0 2px;

	width:120px;

}



/* active item */

.scrollable .active {

    position:relative;

    cursor:default;

}



/* this makes it possible to add next button beside scrollable */

.scrollable {

    float:left;

}



/* prev, next, prevPage and nextPage buttons */

a.browse {

    display:block;

    width:25px;

    height:60px;

    float:left;

    margin:0px 2px;

    cursor:pointer;

    font-size:1px;

}



/* right */

a.right { clear:right; margin-right: 0px; margin-top:15px;}

a.right:hover {  }

a.right:active { }



/* left */

a.left { margin-left: 0px; margin-top:20px; }

a.left:hover  {  }

a.left:active { }



/* disabled navigational button 

a.disabled {

    visibility:hidden !important;

}*/



/* clearfix za content */



.clearfix:after {

    content: ".";

    display: block;

    height: 0;

    clear: both;

    visibility: hidden;}



/* Hides from IE-mac \*/



* html .clearfix {height: 1%;}



/* End hide from IE-mac */