@charset "UTF-8";
/*
-----------------------------------------------
[Realia.si] CSS
-----------------------------------------------
/*


/* 1.0 Master/Reset
----------------------------------------------- */

html, body, div, span,
h1, h2, h3, h4, h5, h6, p,
a, img, small, strong,
b, u, i, center, form, tbody {
	border: 0;
	outline: 0;
	background: transparent;
	margin: 0;
	padding: 0;
}

:focus {
	outline: 0;
}




/* 1.1 Headings
----------------------------------------------- */
h1 {
     color: #282d3e;
     font: 14px/normal Verdana, Tahoma, Helvetica, "Arial";
	 text-decoration: none;
}
h2 {
     font-family: "Arial",Gadget,sans-serif;
     font-size: 15px;
     text-decoration: none;
     color: #282d3e;	
}
h3 {
     color: #004967;
     font: 12px/normal Verdana, Tahoma, Helvetica, "Arial";
     margin:30px 0 10px 0;
     padding:0;
	 font-weight: bold;
	 text-transform: uppercase;
}

/* 1.2 Text Elements
--
--------------------------------------------- */
p {

}

/* 1.3 Links and Lists
----------------------------------------------- */
a, a:link {
     color: #41b4e0;
}
a:visited {
     color: #8ec6db;
}
a:hover, a:focus, a:active 
{ 
     color: #282d3e;
}

dd {
	 margin-bottom: 0.5em;
}


/* 1.4 Wrapper
----------------------------------------------- */
#wrapper:after {
	content: ".";
	clear: both;  
	display: block; 
	height: 0; 
	visibility: hidden;

}

/* \*/
* html #wrapper {
	height: 1%;

}

#wrapper {
	display: block;
	margin: 0 auto;
        text-align:left;
	width: 805px;
}

#wrapper.podstran {
	display: block;
	margin: 0 auto;
	width: 805px;
	margin-bottom: 200px;
}

body {
     background: url(../img/bg.png) top left repeat-x;
	 margin:0;
	 padding:0;
         text-align: center;
         margin: 0 auto;
         
}

#podstran {
     background: url(../img/bg_podstran.png) top left repeat-x;
	 margin:0;
	 padding:0;

         
}

/* 1.5 Header
----------------------------------------------- */

#header {
     width: 805px;
	 height: 110px;
	 float: left;
	 position: relative;
	 margin: 0;
	 padding: 0;
}

h1#logo {
     width: 238px;
     height: 102px;
     float: left;
     margin: -2px 0 0 0;
     padding: 0;
	 background: url(../img/logo.png) no-repeat top left;
	 text-indent: -9999px;
	 display: block;
}

h1#logo a {
     width: 240px;
	 height: 100px;
	 outline: none;
	 display: block;
}

/* 1.5 Navigation
----------------------------------------------- */

ul#nav { 
     float: left;
     clear: left;
     width: 612px;
     background: url(../img/nav_bg.png) no-repeat top left;
     margin: 0;
     padding: 0;
}

ul#nav li {
     list-style: none;
     float: left;
     margin: 0;
     padding:0;
     height: 37px;
}

ul#nav li a {
     text-align: center;
     display: block;
     outline: 0;
     margin:0;
     padding: 12px;
     font-family: "Verdana",Gadget,sans-serif;
     font-weight:bold;
     font-size: 11px;
     text-transform: uppercase;
     text-decoration: none;
     color: #fff;
}

ul#nav li a.prva:hover {
	 background: url(../img/nav_bg.png) no-repeat bottom left;
	 color: #f7f6f6;
}
	 
ul#nav li a.srednja:hover {
	 background: url(../img/nav_bg.png) no-repeat bottom;
	 color: #f7f6f6;
}

/*      1.5.1 Drop down menu by Matej
----------------------------------------------- */
ul#nav {
	list-style: none;
	float: left;
}
ul#nav li {
	float: left;
	position: relative; 
}
ul#nav li a{
	display: block;
	text-decoration: none;
	float: left;
}


ul#subnav {
	list-style: none;
	position: absolute;
	left: 140px; top: 36px;
	margin: 0; padding: 0;
	display: none;
	float: left;
	width: 160px;
        z-index: 99;
}

ul#subnav li{
	margin: 0; padding: 0;
	clear: both;
	width: 160px;
        height: 24px;
}
ul#subnav li a {
	float: left;
	width: 160px;
        padding:0;
        padding-top:5px;
        height: 24px;
}

ul#subnav li a.middle {
    background: url(../img/dropdown_middle.png) no-repeat;
}
ul#subnav li a.first {
    background: url(../img/dropdown_first.png) no-repeat;
}
ul#subnav li a.last {
    background: url(../img/dropdown_last.png) no-repeat;
}

#preload-01 { background: url(../img/dropdown_middle.png) no-repeat -9999px -9999px; }
#preload-02 { background: url(../img/dropdown_first.png) no-repeat -9999px -9999px; }
#preload-03 { background: url(../img/dropdown_last.png) no-repeat -9999px -9999px; }

#sirina {
    width:900px;
    margin: 0 auto;
    position: absolute;
}


/* 1.6 Content 
----------------------------------------------- */

#content {
     float: left;
     display: block;
	 width: 612px;
	 height: auto;
	 margin: 14px 0 0 0;
	 padding: 0;
}

#image_1, #image_2, #image_3 {
     float: left;
     width: 190px;
     height: 198px;
     background: url(../img/image_bg.png) no-repeat top left;
     text-align: center;
     padding: 3px 0 0 0;
	 position: relative;
	 top: 8px;
}

#image_1 img , #image_2 img, #image_3 img {
     border: 0;
     outline: 0;
	 margin: 0 0 13px 0;
}

#image_1 a, #image_2 a, #image_3 a {
     font-family: "Arial",Gadget,sans-serif;
     font-size: 12px;
     text-transform: uppercase;
     text-decoration: none;
     font-weight: bold;
     color: #9a9a9a;
	 padding: 0;
}

#image_1 a:hover, #image_2 a:hover, #image_3 a:hover {
     color: #282d3e;
}

#image_1 a.active-link {
     color: #282d3e;
}

     #image_1 { margin: 24px 0 0 0;}
     #image_2 { margin: 24px 0 0 20px;}
     #image_3 { margin: 24px 0 0 20px;}
	 
  .title {
	   float: left;
	   display: block;
	   margin: 47px 0 0 0;
  }

  .title h2 {
       background: url(../img/title_bg.png) no-repeat top left;
	   margin: 0;
	   padding: 9px;	
       width: 610px;
	   height: 32px;	
       font-family: "Arial",Gadget,sans-serif;
       font-size: 14px;
       text-decoration: none;
	   font-weight: normal;	
       color: #fff;	 
  }
  

 #box {
     width: 610px;
     height: auto;
     display: block;
     float: left;
     margin: 0 0 15px 0;
     padding: 0;
}

#box .top{
     width: 610px;
     height: 8px;
     display: block;
     float: left;
     margin: 0;
     padding: 0;
     background: url(../img/content_bg.png) no-repeat top left;
}

#box .content {
     width: 610px;
     height: auto;
     display: block;
     float: left;
     margin: 0;
     padding: 0 0 0 6px;
     background: url(../img/content_bg.png) repeat-y;
     background-position: -610px 0;
}

#box .content img {
     float: left; 
     outline: none;
     border: none;
     margin: 0 10px 0 6px;
	 padding: 0;
}

#box .content h1 {
     margin: 0 20px 0 0;
     padding:0;
}


#box .content p {
     color: #686868;
     font: 12px/normal Verdana, "Tahoma", Helvetica, Arial;
     margin: 8px 10px 0 0;
     padding:0;
	 line-height: 18px;
}

#box .content p.cena {
    margin-left: 15px;
    font-weight: bold;
    line-height: 18px;
    margin-top: 0px;
}

#box .content h1 a {
     color: #282d3e;
     font: 14px/normal Verdana, Tahoma, Helvetica, "Arial";
	 text-decoration: none;
	 text-transform: uppercase;
	 font-weight: bold;
	 margin: 0 0 0 0;
	 padding: 0;
     line-height: -15px;
}



/* Podstran - Novogradnje - Ve� fotografij
----------------------------------------------- */	   
    .title_second {
	   float: left;
	   display: block;
	   margin: 0 0 0 0;
  }

  .title_second h2 {
       background: url(../img/title_bg.png) no-repeat top left;
	   margin: 0;
	   padding: 9px;	
       width: 610px;
	   height: 32px;	
       font-family: "Arial",Gadget,sans-serif;
       font-size: 14px;
       text-decoration: none;
	   font-weight: normal;	
       color: #fff;	 
  }
  
  #box .content h3.novogradnje {
     color: #282d3e;
     font: 14px/normal Verdana, Tahoma, Helvetica, "Arial";
	 text-decoration: none;
	 font-weight: bold;
	 margin: 10px 0 15px 5px;
	 padding: 0;
     line-height:0;
}

#box .content img.galerija {
     float: left; 
     outline: none;
     border: none;
     margin: 0 25px 0 7px;
	 padding: 0;
}

/*----------------------------------------- */	

#box .content h1 a:hover {
     color: #006189;
}

#box .content h1 span {
     color: #006189;
	 font: 11px/normal Verdana, Tahoma, Helvetica, "Arial";
	 text-decoration: none;
	 margin: 0 0 0 10px;
	 padding: 0;
}

#box .content ul {
     margin: 0;
	 padding: 0 0 0 20px;
}

#box .content ul {
     list-style: url(../img/list_bg.png);
}

#box .bottom {
     width: 610px;
     height: 8px;
     display: block;
     float: left;
     margin: 0;
     padding: 0;
     background: url(../img/content_bg.png) no-repeat bottom left;
}

.podstran_img {
     border: none;
	 outline: none;
	 margin: 35px 0 0 0;
	 padding: 0;
}
  
/* 1.7 Sidebar
----------------------------------------------- */

#sidebar {
     float: left;
	 width: 192px;
	 height: auto;
	 display: block;
	 padding:0;
	 margin: 14px 0 0 0;
}

ul#sidebar_nav{
     float:left;
	 clear: both;
	 width: 192px;
	 height: 291px;
	 display: block;
	 margin: 0 0 0 18px;
	 padding: 8px 0 0 7px;
	 background: url(../img/sidebar_nav.png) no-repeat top left;
}



ul#sidebar_nav li {
     list-style: none;
	 margin: 0 0 9px 0;
	 padding:0;
	 text-align: center;
}

ul#sidebar_nav li a {
	 margin: 0;
	 padding: 12px 0 0 0; 
	 font-family: "Arial",Gadget,sans-serif;
	 font-size: 12px;
	 text-transform: uppercase;
     text-decoration: none;
	 font-weight: bold;
	 color: #9a9a9a;
     display: block;
     background: url(../img/sidebar_button.png) no-repeat top left;	
	 width: 180px;
	 height: 26px;	 
}

ul#sidebar_nav li a:hover {
     text-decoration: none;
     color: #fff;
	 background: url(../img/sidebar_button.png) no-repeat bottom left;
}

#contact { 
     width: 192px;
	 height: auto;
	 float: left;
	 display: block;
	 margin: 10px 0 150px 18px;
	 padding: 0;
	 
}

#contact .top {
     width: 191px;
	 height: 8px;
	 display: block;
	 margin: 0;
	 padding: 0;
	 float: left;
	 background: url(../img/contact_bg.png) no-repeat top left;
}
     
#contact .content {
     width: 191px;
	 height: auto;
	 display: block;
	 margin: 0;
	 padding: 0 10px 0 10px;
	 float: left;
	 background: url(../img/contact_bg.png) repeat-y;
	 background-position: -191px 0;
}

#contact .content h3 {
     color: #282d3e;
     font: 13px/normal Verdana, Tahoma, Helvetica, "Arial";
     margin:0 0 10px 0;
     padding:0;
     width: 170px;
	 font-weight: bold;
	 text-transform: uppercase;
	 letter-spacing: 1px;
	 border-bottom: 1px dashed #7f7f7f;
	 line-height: 25px;
}

#contact .content p {
     color: #686868;
     font: 12px/normal Verdana, "Tahoma", Helvetica, Arial;
     margin:0;
     padding:0;
     width: 170px;
     height: auto;
     line-height: 17px;
}

#contact .bottom {
     width: 191px;
	 height: 8px;
	 display: block;
	 margin:0 0 0px 0;
	 padding:0;
	 float: left;
	 background: url(../img/contact_bg.png) no-repeat bottom left;
}

/* 1.8  Footer
----------------------------------------------- */

#footer {
     width: 100%;
     height: 545px;
     background: url(../img/footer_bg.png) repeat-x bottom left;
     float: left;
     clear: both;
     margin: 50px  0 0;
	 color: #454545;
     font: 12px/normal Verdana, "Tahoma", Helvetica, Arial;
     margin: 30px 10px 0 0;
     padding:0;	 
	 line-height: 15px;
         
}

#footer_content {
     margin: 0 auto;
     width: 820px;
     height: auto;
     text-align:left;
}

#footer_content h2 {
     font-family: "Arial",Gadget,sans-serif;
     font-size: 15px;
     text-decoration: none;
	 font-weight: bold;
     text-transform: uppercase;	 
     color: #282d3e;	
     background: url(../img/footer_title.png) no-repeat top left;	
     height: 30px;
	 width: 100%;
	 padding: 7px 7px 7px 15px;
	 margin:0;
}

#right_col, #left_col {
     float: left;
	 width: 400px;
	 height: 415px;
	 display: block;
	 top: 79px;
	 position: relative;
}

#right_col{
     border-left: 1px dashed gray;
	 padding: 0 0 0 8px;
}

#right_col p {
	 padding: 0 0 0 15px;
	 margin: 0;
	 letter-spacing: 0.8px;
	 line-height: 18px;
}

#left_col {
     padding: 0 8px 0 0;
}

#left_col p {
     padding: 0 0 0 15px;
     margin:0;
}

#left_col ul.footer_list {
     list-style: none;
     display: block;
     margin:0;
     padding: 0 0 0 5px;
}

#left_col ul.footer_list span {
     text-transform: uppercase;
     color: #000;
     font-size: 11px;
}

#left_col ul.footer_list li {
     display: inline;
     margin: 0 45px 0 0;
     color: #00638c;
}

#left_col li.footer_list input {
     display: inline;
}

#contact_form {
     height: 331px;
     padding:10px;
     margin: 5px 0 0 0;
     background: url(../img/footer_form_bg.png) no-repeat top left;
}

#contact_form  form{
     margin: 0 0 0 0;
     padding: 0 0 0 5px;
}

#contact_form  form .mali{
     border: 1px solid #b2b3b9;
     width: 378px;
     height: 22px;
     background: #fff;
     outline: none;
     padding: 0;
     margin: 0;
     margin-bottom: 5px;
}

#contact_form  form .mali:focus{
     border: 1px solid #3c3c3c;
}

#contact_form  form .veliki{
     border: 1px solid #b2b3b9;
     width: 378px;
     height: 100px;
     background: #fff;
     outline: none;
     padding: 0;
     margin: 0;
     margin-bottom: 5px;
}

#contact_form  form .veliki:focus{
     border: 1px solid #3c3c3c;
}

#contact_form  form .button{
     float: right;
     margin: 8px 0 0 0;
     background: url(../img/footer_button.png) no-repeat top left;
     width: 114px;
	 height: 32px;
     border: none;
     text-align: center;
	 font-family: "Arial Black",Gadget,sans-serif;
	 font-size: 12px;
	 text-transform: uppercase;
     text-decoration: none;
	 color: #fff
}

#contact_form  form .button:focus{
     float: right;
     margin: 8px 0 0 0;
     background: url(../img/footer_button2.png) no-repeat top left;
     width: 114px;
	 height: 32px;
     border: none;
     text-align: center;
	 font-family: "Arial Black",Gadget,sans-serif;
	 font-size: 12px;
	 text-transform: uppercase;
     text-decoration: none;
	 color: #fff
}

#footer_bottom {
    margin-top: 210px;
}



/* 1.9 Iframe
----------------------------------------------------*/
iframe {
    margin: 0;
    margin-top: 20px;
    width: 610px;
}
