@charset "utf-8";
@import "reset.css";
@import "mainContent.css";

#container { 
	width: 980px;  /* using 20px less than a full 800px width allows for browser chrome and avoids a horizontal scroll bar */
	margin: 0 auto; /* the auto margins (in conjunction with a width) center the page */
	text-align: left; /* this overrides the text-align: center on the body element. */
} 
#header { 
	margin-top: 14px;
	padding-top: 10px;
	margin-bottom: 10px;
	position: relative;
	z-index: 99;
} 

#header #logo {
	width: 146px;
	height: 40px;
	padding-top: 27px;	
}

/* LANGUAGE MENU */
#header #langMenu {
	position: absolute;
	left: 0;
	top: 0;
	padding: 0;
	margin: 0;
	overflow: hidden;
}

#header #langMenu li {
	float: left;
	margin-left: -1px;
	line-height: 2.3em;	
}

#header #langMenu li a {
	font-size: 0.85em;	
	color: #838280;
	text-decoration: none;
	text-transform: uppercase;
	border-left: 1px solid #b0afac;	
	padding: 0 8px;		
}

#header #langMenu li a:hover, #header #langMenu li a:focus {
	color: #000;
}

#header #langMenu li.selected a {
	color: #dddad8;
}
/* END LANGUAGE MENU */

/* TOP MENU */
#header #topMenu {
	position: absolute;
	right: 0;
	top: 0;
	padding: 0;
	margin: 0;
	overflow: visible; /* hide left LI border */
	font-size: 0.9em;
}

#header #topMenu li {
	float: left;
	line-height: 2.1em;
}

#header #topMenu li.search {
	border-left: none;
	width: 182px;
	overflow: visible;
	height: 2.1em;
	border-top: 1px solid #d6d4d1;
	border-left: 1px solid #d6d4d1;
	border-right: none;
	border-bottom: none;
	background-color: #fff;
	overflow: visible;
	
}

#header #topMenu li a {
	color: #838280;
	text-decoration: none;
	padding-left: 27px;
	margin-left: 15px;
	margin-right: 15px;
}

#header #topMenu li a:hover, #header #topMenu li a:focus {
	color: #000;
}

#header #topMenu #search_query {
	color: #787570;
	font: 1em Tahoma, Arial, sans-serif;
	padding: 5px;
	width: 182px;
	border-top: 1px solid #d6d4d1;
	border-left: 1px solid #d6d4d1;
	border-right: none;
	border-bottom: none;
}

#tellfriend {
    position: absolute;
    display: none;
    width: 380px;
    z-index: 1;
    background-color: #fff;
    border: 2px solid #d6d4d1;
    padding: 8px;
	-moz-box-shadow: 2px 2px 3px #666;
	-webkit-box-shadow: 2px 2px 3px #666;
	box-shadow: 2px 2px 3px #666;    
}

#tellfriend label {
	clear: left;
	float: left;
	width: 75px;
	text-align: left;
	margin-bottom: 3px;
}

#tellfriend input, #tellfriend textarea {
	float: left;
	margin-bottom: 3px;
    font-family:Arial,Helvetica,sans-serif;
    font-size: 1em;

}



/* END TOP MENU */

/* HEADER / MAIN MENU */
#header #headerMenu {
	width: 823px;
	height: 40px;
	line-height: 40px;	
	background-color: #787570;
	position: absolute;
	padding: 0;
	margin: 0;
	z-index: 999;
	bottom: 0;
	right: 0;
	/*overflow: hidden; */
	border-left: 1px solid #948f88;
	border-right: 1px solid #948f88;
	font-size: 1.1em;
}

.ie6 #header #headerMenu {
	top: 37px;
	left: 155px;
}

#header #headerMenu li {
	float: left;
	padding: 0px 15px;
	margin: 10px 0px;
	height: 20px;
	line-height: 20px;
	border-left: 1px solid #948f88;
	margin-left: -1px;
}

#header #headerMenu li a {
	padding: 3px 9px;
	text-decoration: none;
	color: #fff;
	display: block;
	margin-top: -3px;
	position: relative;
}

#header #headerMenu li:hover a, #header #headerMenu li.selected a, #header #headerMenu a:focus {
	background-color: #a19d97 !important;
	-moz-box-shadow: 1px 1px 2px #666;
	-webkit-box-shadow: 1px 1px 2px #666;
	box-shadow: 1px 1px 2px #666;
	z-index: 99;
}

#header #headerMenu .submenu { 
	background-color: #a19d97;
	position: absolute;
	z-index: 999;
	margin: 0 !important;
	padding: 15px 15px;
	visibility: hidden;
	-moz-box-shadow: 2px 2px 3px #666;
	-webkit-box-shadow: 2px 2px 3px #666;
	box-shadow: 2px 2px 3px #666;
	font-size: 0.85em;	
	z-index: 99;
}

#header #headerMenu li:hover .submenu, #header #headerMenu li:focus .submenu { 
	visibility: visible;
}

#header #headerMenu .submenu li {
	display: block;
	float: none !important;
	margin: 0;
	padding: 2px 0;
	border: none;
	border-bottom: 1px solid #b7b3ad;
	min-width: 130px;
}

#header #headerMenu .submenu li a {
	padding: 0;
	margin: 0;
	line-height: auto;
	background: url(images/bullet_arrow_right.png) 4px center no-repeat;
	padding-left: 15px;
	padding-right: 15px;	
	display: block;
	-moz-box-shadow: none;
	-webkit-box-shadow: none;
	box-shadow: none;
}

#header #headerMenu .submenu li a:hover, #header #headerMenu .submenu li a:focus{
	color: #444;
}

/* BEGIN TOP CATEGORIES */

#bigMenu {
	height: 320px;
	position: relative;
	margin-bottom: 11px;
}

#bigMenu ul#frontCarousel {
	position: absolute;
	z-index: 10;
	width: 100%;
	height: 320px;
}

#bigMenu #frontCarousel li {
	padding-top: 40px;
	padding-left: 50px;	
	height: 280px;
	background: url(images/bigmenu_bg.jpg) no-repeat;
	width: 930px;
}

#bigMenu h2 {
	color: #cf190c;
	font-size: 2em;
	font-weight: normal;
	padding: 0;
	margin: 0;
	margin-bottom: 10px;
	text-shadow: 1px 1px 1px #666;
}

#bigMenu p {
	width: 480px;
/*	color: #787570; */
	color: #fff;
	overflow: hidden;
	padding: 0;
	margin: 0;
	text-shadow: 1px 1px 1px #111;
}

#topCatMenu {
	position: absolute;
	top: 154px;
	z-index: 20;
	margin-left: 50px;
}

#topCatMenu li {
	position: relative;
	float: left;
	margin-right: 21px;
	text-align: center;
	width: 101px;
}

#topCatMenu li a {
	text-decoration: none;
	color: #fff;
	text-shadow: 1px 1px 2px #000000;
	text-transform: uppercase;
	font-size: 0.9em;
	display: block;
}

#topCatMenu li a span {
	display: block;
	position: absolute;
	width: 23px;
	height: 23px;
	background: url(images/plus_gray.png) no-repeat;
	top: 90px;
	right: -12px;
}

#topCatMenu li img {
	display: block;
	border: 1px solid #807e7a;
	margin-bottom: 20px;
}

#topCatMenu li a:hover, #topCatMenu li a:focus {
	color: #ccc;
}

#topCatMenu li a:hover img, #topCatMenu li a:focus img  {
	border: 1px solid #000;
}

/* END TOP CATEGORIES */ 

/* MAIN CATEGORY MENU */
#mainCatMenu {
	margin-bottom: 10px;
	overflow: hidden;
	width: 110%;
	height: 256px;
}

#mainCatMenu li {
	float: left;
	display: block;
	width: 192px;
	padding: 20px 21px;
	margin-right: 11px;
	background-color: #fff;
	border-right: 1px solid #c8c3be;
	border-bottom: 1px solid #c8c3be;
	height: 215px;
	position: relative;
	font-size: 0.95em;	
}

#mainCatMenu li.expanded {
	width: 198px;
	background-color: #787570;		
	border-right: 1px solid #787570;
	border-bottom: 1px solid #787570;
}

#mainCatMenu li span.h3 {
	background-color: #cf190c;
	color: #fefefe;
	height: 16px;
	line-height: 16px;
	text-indent: 4px;
	text-transform: uppercase;
	font-size: 0.9em;
	margin-bottom: 8px;
	display: block;
	font-weight: bold;
}

#mainCatMenu li.expanded span.h3 {
	background-color: #a19d97;
	border-bottom: 1px solid #66635f;
	border-right: 1px solid #66635f;
	margin-bottom: 20px;
	color: #fefefe;
}

#mainCatMenu li a {
	display: block;
	text-decoration: none;
	color: #787570;
	height: 100%;
}

#mainCatMenu li a:hover, #mainCatMenu li a:focus {
	color: #000;
}

#mainCatMenu li a:hover img, #mainCatMenu li a:focus img {
	border: 1px solid #000;
}

#mainCatMenu li.expanded a {
	height: auto;
	color: #d7d4cf;
	padding: 4px 0;
	border-bottom: 1px solid #9e9b96;
	text-indent: 15px;
	background: url(images/a_right.png) 4px center no-repeat;
}

#mainCatMenu li.expanded a:hover, #mainCatMenu li.expanded a:focus {
	color: #fff;
}

#mainCatMenu li img {
	position: absolute;
	border: 1px solid #c1bdb7;
	display: block;
	bottom: 20px;
	left: 20px;
}

#breadCrumbs {
	padding: 5px 14px;
	background-color: #dddad8;
	margin-bottom: 11px;
	color: #979189;
	font-size: 0.9em;
}

#breadCrumbs a {
	color: #979189;
	text-decoration: none;
}

#breadCrumbs a:hover {
	text-decoration: underline;
}

/* PRODUKTI TOP MENU */

#produktiTopMenu {
	background-color: #fff;
	padding-top: 13px;
	padding-bottom: 13px;
	height: 91px;
	margin-bottom: 10px;
	font-size: 0.9em;
	overflow: hidden;
	position: relative;
}

.topstripmenucontent, .botstripmenucontent {
	width: 5000px;
	overflow: visible;
	position: relative;
}

.botstripmenucontent {
	background: url("images/mbot_bg.png") repeat-x scroll 0 8px transparent;
}

#produktiTopMenu ul {
	width: 5000px;
	overflow: visible;
}

#produktiTopMenu li {
	display: block;
	width: 293px;
	overflow: hidden;
	height: 91px;
	padding-right: 18px;
	border-left: 1px solid #dfdddb;
	padding-left: 13px;
	float: left;
	position: relative;
}

#produktiTopMenu li.first {
	border-left: none;
}

#produktiTopMenu li .title {
	display: block;
	font-size: 1.1em;
	margin-bottom: 0.5em;
	color: #cf190c;
}

#produktiTopMenu li img {
	border: 1px solid #bebab4;
	float: left;
	margin-right: 15px;
}

#produktiTopMenu li a {
	text-decoration: none;
	color: #cf190c;
}

#produktiTopMenu li a:hover, #produktiTopMenu li a:focus {
	text-decoration: underline;
}

#produktiTopMenu li a.vec {
	position: absolute;
	right: 18px;
	bottom: 0px;
	text-decoration: none;
	padding: 2px 4px;
	color: #fff;
	background-color: #787570;
	text-transform: uppercase;
	font-weight: bold;
	font-size: 0.9em;
}

#produktiTopMenu li a.vec:hover, #produktiTopMenu li a.vec:focus {
	text-decoration: none;
	background-color: #a19d97;
}

/* REFERENCE KATEGORIJE TOP MENU */
#referenceTopMenu {
	background-color: #fff;
	padding-top: 12px;
	padding-bottom: 10px;
	height: 95px;
	margin-bottom: 10px;
	font-size: 0.9em;
	overflow: hidden;
	width: 980px !important;
	position: relative;
}

#referenceTopMenu ul {
	width: 4000px;
}

#referenceTopMenu li {
	display: block;
	width: 190px;
	overflow: hidden;
	height: 95px;
	padding-right: 3px;
	border-left: 1px solid #dfdddb;
	padding-left: 2px;
	text-align: center;
	float: left;
	position: relative;
}

#referenceTopMenu li.first {
	border-left: none;
}

#referenceTopMenu li img {
	border: 1px solid #bebab4;
	margin-bottom: 0.5em;
}

#referenceTopMenu li a:hover img, #referenceTopMenu li.selected a img {
	border: 1px solid #000;
}

#referenceTopMenu li a {
	text-decoration: none;
	color: #787570;
}

#referenceTopMenu li a span {
	display: block;
}

#referenceTopMenu li a:hover span, #referenceTopMenu li a:focus span, #referenceTopMenu li.selected a span {
	color: #cf190c;
}

/* REFERENCA DET */
#referencaDet {
	position: relative;
	margin-left: -19px;
	float: left;
}

#referencaDet li {
	position: relative;
	list-style-type: none !important;
	margin-left: 0 !important;
    padding-left: 0 !important;}


#referencaDet img.big {
	border: 1px solid #c1beb8;
}

#referenceDetList {
	position: absolute;
	top: 20px;
	right: 6px;
}

#referenceDetList li {
	margin-bottom: 12px;
}

#referenceDetList li a {
	border: 2px solid #fff;
	display: block;
}

#referenceDetList li a:hover {
	border: 2px solid #787570;
}

#breadCrumbs .date {
	float: right;
}

/* END HEADER / MAIN MENU */
#mainContent { 
	margin: 0 253px 0 0; /* the right margin on this div element creates the column down the right side of the page - no matter how much content the sidebar1 div contains, the column space will remain. You can remove this margin if you want the #mainContent div's text to fill the #sidebar1 space when the content in #sidebar1 ends. */
	background-color: #fff;
	border-right: 1px solid #c8c3be;
	border-bottom: 1px solid #c8c3be;	
	padding: 24px 30px 30px 23px;
	min-height: 235px;
	height: auto !important;
	height: 235px;
	margin-bottom: 10px;
	position: relative;
	line-height: 1.3em;
} 

#mainContent.mainBotMenu {
	padding-bottom: 48px !important;
}

#mainContent #leftCol {
	float: left;
	width: 191px;
}

#mainContent #leftCol img {
	border: 1px solid #bcb8b2;
}

#mainContent #mainCol {
	margin-left: 225px;
}

#mainBotMenu {
	position: absolute;
	bottom: 0;
	width: 673px;
	padding-left: 27px;
	padding-right: 26px;
	margin-left: -23px;
	background: url(images/botMenuBg.png) bottom repeat-x;	
	height: 31px;
	overflow: hidden;
	left: 22px;
}

#mainBotMenu div.botstripmenucontent {
	width: 1500px;
	float: left;
	position: relative;
}

#mainBotMenu ul {
	float: left;
	position: relative;
	margin: 0 !important;
}

#mainBotMenu li {
	position: relative;
	float: left;
	height: 22px;
	padding-top: 9px;
	list-style-type: none !important;
	margin-left: 0 !important;
    padding-left: 0 !important;
}

#mainBotMenu li.selected {
	background: url(images/botMenuSel.png) top center no-repeat;
}

#mainBotMenu li a {
	display: block;
	padding: 0 20px;
	height: 22px;
	line-height: 22px;
	font-size: 0.9em;
	color: #787570;
	text-decoration: none;
	border-right: 1px solid #c8c3be;
	background-color: #fff;
}

#mainBotMenu li a:hover, #mainBotMenu li.selected a {
	color: #cf190c;
}

#mainBotMenu a.prev, #mainBotMenu a.next {
	text-decoration: none;
	color: #bcb8b2;
	font-size: 1.5em;
	position: absolute;
	top: 9px;
	display: block;
	height: 22px;
	line-height: 22px;
	border-left: 1px solid #c8c3be;
	border-right: 1px solid #c8c3be;
	width: 25px;
	text-align: center;
	z-index: 99;
	background-color: #fff;
}

#mainBotMenu a.prev {
	left: 0;
}

#mainBotMenu a.next {
	right: 0;
	border-right: none;
}


/* SLIDESHOW IFRAME */
.slideshow_container {
	width: auto;
	margin: auto;
	overflow: hidden;
}

.slideshow_container img {
	border: none !important;
}


.slideshow_iframe {
	width: auto;
	height: 250px;
	margin: 0;
	padding: 0;
	overflow: hidden;
	border: 2px solid #BCB8B2;	
}

.slideshow_iframe img {
	width: 100%;
}

#sidebar1 {
	float: right; /* since this element is floated, a width must be given */
	width: 240px; /* the actual width of this div, in standards-compliant browsers, or standards mode in Internet Explorer will include the padding and border in addition to the width */
	background: #fff; /* the background color will be displayed for the length of the content in the column, but no further */
	height: 289px;
	border-right: 1px solid #c8c3be;
	border-bottom: 1px solid #c8c3be;		
	margin-right: 1px;
	overflow: visible;
	position: relative;
	font-size: 0.9em;
}

#sidebar1 #links {
	margin-bottom: 18px;
}

#sidebar1 #links li {
	display: block;
	background-color: #cf190c;	
	width: 241px;
}

#sidebar1 #links li a {
	display: block;
	padding: 5px 21px;
	border-bottom: 1px solid #fff;
	text-indent: 15px;
	background: url(images/a_right_red.png) 25px center no-repeat;
	color: #fff;
	text-decoration: none;

}

#sidebar1 #links li a:hover, #sidebar1 #links li a:focus {
	color: #000;
}

#sidebar1 #links li.open {
	background-color: #787570;
}

#sidebar1 #links li.open a {
	border-bottom: none;
	background: url(images/a_down.png) 24px center no-repeat;
}

#sidebar1 #galerija {
	margin-left: 14px;
}

#sidebar1 #galerija li {
	float: left;
	margin-right: 13px;
	margin-bottom: 14px;
}

#sidebar1 #galerija img {
	border: 1px solid #787570;
}


/* stili za poprasevalni obrazec */
#f_povprasevanje fieldset {
	width: 98%;
	border: 1px solid gray;
	padding: 10px;
	position: relative;
}
#f_povprasevanje legend {
	border-top: 1px solid gray;
	border-left: 1px solid gray;
	border-right: 1px solid gray;
	position: relative;
	line-height: 1.5em;
	margin-bottom: 1.5em;
	padding: 0 0.9em;
}

.select-box {
	position: relative;
	display: inline-block;
}

#f_povprasevanje .fcol1 {
	width: 45%px;
	float: left;
}
#f_povprasevanje .fcol2 {
	width: 45%;
	float: right;
	margin-right: 10px;
}

#f_povprasevanje label {
	display: block;
	float: left;
	width: 90px;
	clear: left;
}

#f_povprasevanje label.long {
	display: block;
	float: left;
	width: 180px;
	clear: left;
}

#f_povprasevanje label.top {
	float:none;
	width: auto;
}

#f_povprasevanje label.check {
	width: auto;
	float: none;
	clear: none;
}

#f_povprasevanje label.check_long {
	width: auto;
	float: none;
	clear: none;
	white-space: nowrap;
}


#f_povprasevanje input.check {
	width: auto;
	float: left;
	border: none;
}

#f_povprasevanje input, #f_povprasevanje select, #f_povprasevanje textarea {
	width: 200px;
	border: 1px solid gray;
	margin: 1px 0;
	font-size:  0.9em;
	font-family: Verdana, Arial, Helvetica, sans-serif;
}

#f_povprasevanje input.large, #f_povprasevanje select.large, #f_povprasevanje textarea.large {
	width: 100%;
}

#f_povprasevanje input.short, #f_povprasevanje select.short {
	width: 30px;
}

#f_povprasevanje input.med, #f_povprasevanje select.med {
	width: 99%;
}

#f_povprasevanje input.medlong, #f_povprasevanje select.medlong {
	width: 104px;
}


#f_povprasevanje .tip_vrat {
	width: 99%;
}
#f_povprasevanje .vrata_material {
	width: 6em;
}
#f_povprasevanje .vrata_barva {
	width: 6em;
}
#f_povprasevanje .vrata_izvedba {
	width: 5em;
}

select:hover {
	width: auto;
	z-index: 999;
}

#f_povprasevanje td {
	position: relative;
	z-index: 1;
	padding: 1px;
}

#f_povprasevanje th {
	font-weight: bold;
	text-align: center;
   	padding: 0 2px;
    font-size: 0.8em;
}

#f_povprasevanje th.short, td.short {
	width: 35px;
	text-align: center;
}
#f_povprasevanje th.medium, td.medium {
	width: 80px;
}
#f_povprasevanje th.medium_large, td.medium_large{
	width: 120px;
}
#f_povprasevanje th.medium_larger, td.medium_larger{
	width: 150px;
}


#footer { 
	padding: 0 0px 0 15px; /* this padding matches the left alignment of the elements in the divs that appear above it. */
	font-size: 0.9em;
	margin-bottom: 20px;
} 

#footer a {
	color: #838280;
	text-decoration: none;
}

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

#footer .fltrt a {
	padding-left: 27px;
	margin-left: 15px;
	margin-right: 15px;
}

a.eobv {
	background: url(images/eobv.png) left center no-repeat;
}

a.deli {
	background: url(images/deli.png) left center no-repeat;
}

a.shema {
	background: url(images/shema.png) left center no-repeat;
}

.fltrt { /* this class can be used to float an element right in your page. The floated element must precede the element it should be next to on the page. */
	float: right;
	margin-left: 8px;
}
.fltlft { /* this class can be used to float an element left in your page */
	float: left;
	margin-right: 8px;
}
.clearfloat { /* this class should be placed on a div or break element and should be the final element before the close of a container that should fully contain a float */
	clear:both;
    height:0;
    font-size: 1px;
    line-height: 0px;
}