body { font-family: Arial, Tahoma, Helvetica, sans-serif; font-size:12px; background:url(../images/bodybg.png) repeat-x #e6e6e6; } body, p, h1, h2, h3, h4, ul, li, input, form { margin: 0; padding: 0; } a {outline:none;} html {overflow-y: scroll;} #wrap { margin:0 auto; width:970px; } #header {float:left;width:970px;height:81px;} #logo {float:left; display:inline; width:211px; height:61px; padding:20px 0 0 9px;} #search {float:right;height:45px;width:160px;display:inline;} #iskanje {float:right;width:144px;background:#FFF;border:1px solid #d9d9d9;height:18px;margin-top:17px;} #iskanje input {float:left;} #iskanje input.srcinp { width:116px;font-size:11px; color:#c1c1c1; border:0; margin:3px 0 0 3px;} #iskanje input.srcsub {margin:2px 0 0 4px;} #menu {float:left;width:750px;height:36px;display:inline;} #menu ul {float:right;list-style:none;} #menu ul li {display:inline;float:left;} #menu ul li a {background:url(../images/lidefault.gif) left top;height:26px;padding:0 0 0 12px;display:inline;float:left;color:#ffffff;text-decoration:none;cursor:pointer;margin-left:10px;font-size:15px;} #menu ul li a:hover, #menu ul li a.active {background:url(../images/lihover.gif) left top;color:#fff;} #menu ul li a span.levo {float:left;padding-top:4px;} #menu ul li a span.desno {background:url(../images/lidefault.gif) right bottom no-repeat; width:15px;display:block;float:left;height:26px;} #menu ul li a:hover span.desno, #menu ul li a.active span.desno {background:url(../images/lihover.gif) right bottom no-repeat;} #index_animacija {float:left; width:750px; height:480px; background:url(../images/main_img_bg.jpg) no-repeat;} #right {float:left; width:216px; padding:9px 0 0 4px;} #right h4, #right h4 a {color:#c80000; font-size:15px; font-weight:bold; padding-bottom:4px; text-decoration:none;} #right h4 a:hover {text-decoration:underline;} #right a.katalogi {float:left; width:172px; height:21px; padding:16px 0 0 44px; margin-bottom:3px; background:url(../images/katalog_linkbg.gif) no-repeat; color:#fff; font-weight:bold;} #right a.katalogi:hover {text-decoration:none;} .info {float:left; width:201px; margin-top:3px; background:url(../images/aktualne_info.jpg) top no-repeat; padding:6px 15px 5px 0; font-size:11px;} .info a.red {color:#c80000; font-weight:bold; text-decoration:none;} .info a.red:hover {text-decoration:underline;} .info span.date {font-size:10px; padding:1px 0 1px 0; float:left; width:201px;} .info a.vec {color:#000; font-weight:bold; text-decoration:none;} .info a.vec:hover {text-decoration:underline;} #right span.povprasevanje {float:left; width:206px; background:url(../images/posljipovprasevanje.gif) no-repeat; color:#fff; font-size:15px; font-weight:bold; margin:20px 0 0 0; display:block; height:22px; padding:4px 0 0 10px;} #right table {float:left; width:216px; font-size:11px; margin:15px 0 0 0 ;} #right table input.text {float:left; height:15px; padding-top:2px; width:145px; border:0; font-size:11px; } #right table textarea {float:left; width:145px; border:0; height:100px; font-size:11px; } #bottomindex {float:left; width:750px; background:url(../images/bottom_groups.jpg) top no-repeat;} .box {float:left; width:236px; background:url(../images/box.jpg) no-repeat; height:280px; display:inline; font-size:11px; margin-top:1px;} .box h3 a {float:left; width:226px; font-size:17px; font-weight:bold; color:#c80000; padding:12px 0 0 10px; text-decoration:none;} .box h3 a:hover {text-decoration:underline;} .box span {float:left; width:196px; font-size:13px; font-weight:bold; height:39px; margin:9px 12px 0 19px; display:inline;} .box img { float:left; width:196px; margin:25px 12px 0 19px; display:inline; border:0;} .box p a {font-size:13px; color:#c80000; font-weight:bold;} .box p a:hover {text-decoration:none;} .box p {float:left; width:211px; margin:0 12px 0 13px; display:inline;} #wrapcontent {float:left; width:737px; background:url(../images/content_streach.jpg) repeat-y; margin:1px 13px 0 0; display:inline; margin-bottom:20px;} #wrap_top {float:left; width:737px; padding-bottom:15px; background:url(../images/wrap_top.jpg) top no-repeat;min-height:705px;height:auto !important;height:705px;} #wrap_bottom {float:left; width:737px; background:url(../images/content_bottom.jpg) no-repeat; height:15px;} #left img {float:left; width:192px;} #left {float:left; width:205px; font-size:15px; padding:10px 0 0 6px; color:#000201;min-height:550px;height:auto !important;height:550px;} #left ul {list-style:none; width:192px; margin-top:1px;} #left ul li {font-size:15px; color:#c80000;} #left ul li a { text-decoration:none;color:#c80000;padding:4px 9px 4px 8px; display:block; float:left; width:175px; background:url(../images/ullibg.jpg) no-repeat top left; } #left ul li a.active {color:#c80000;} #left ul li a:hover {text-decoration:underline;} #left ul li ul {list-style:none; padding:10px 0 10px 20px; float:left; width:143px;} #left ul li ul li {font-size:13px; float:left; width:143px;} #left ul li ul li a {color:#878686; background:none; width:143px; float:left; display:inherit; padding:0 0 3px 0; } #content {float:left; width:502px; padding-right:20px; line-height:18px; padding-top:28px;} #content span.minigray {font-size:11px; color:#878686;} #breadcrumbs {float:left; width:502px; padding:0 0 10px 0; font-size:11px; color:#9f9e9e;} #breadcrumbs a {color:#9f9e9e; text-decoration:underline;} #breadcrumbs a:hover {text-decoration:none;} #product_stresnik {float:left; width:502px;} #stresnik_img {float:left; width:170px;} #stresnik_opis {float:left; width:332px;} #content h1 {font-size:14px; color:#c80000; padding-bottom:5px;} #stresnik_opis ul {list-style:none; font-weight:bold; font-size:11px;} #stresnik_opis ul li a {color:#000000; text-decoration:underline;} #stresnik_opis ul li a:hover {text-decoration:none;} .product {float:left; width:150px; padding-right:17px; height:145px; margin:0 0 10px 0; text-align:center;} .product img {padding-bottom:10px; border:none;} .product a {text-decoration:none; color:#000000;} .product a:hover {text-decoration:underline;} #content a.nazaj {font-size:11px; color:#fff; font-weight:bold; background:url(../images/nazaj.gif) no-repeat; width:43px; height:17px; display:block; line-height:normal; padding:1px 0 0 5px; text-decoration:none; float:left;} #content a.nazaj:hover {text-decoration:underline;} #content a.povprasevanje {font-size:11px; color:#fff; font-weight:bold; float:left; background:url(../images/povprasevanje.gif) no-repeat; width:125px; height:17px; display:block; line-height:normal; padding:1px 0 0 12px; text-decoration:none; margin-left:5px; display: inline;} #content a.povprasevanje:hover {text-decoration:underline;} #content img.main {float:left; width:502px; margin-top:-10px; padding-right:4px; padding-top:4px; padding-bottom:10px;} #content span.red {color:#c80000;} #content span.small {font-size:11px;} #content img.reference {border:0;} #content a {color:#c80000;} #content a:hover {text-decoration:none;} #content ul {list-style:none; padding:5px 0 5px 0;} #content ul li {padding-left:10px;background:url(../images/ulli.gif) no-repeat 0 7px;} #content textarea {width:300px; height:150px;} #content input {font-size:11px; padding:2px;} #content table {width:502px;} #content a.kontakti {font-weight:bold; color:#ffffff; background:url(../images/kontakt_linki.gif); height:23px; padding:3px 0 0 13px; float:left; width:123px;} #footer {float:left; width:970px; height:70px; background:url(../images/footer.jpg) top no-repeat; padding:18px 0 0 0;} #footer p.copy {float:left; font-size:12px; padding:0 0 0 20px; width:745px; line-height:18px;} #footer p.copy span {color:#c80000;} #footer p.copy a {color:#c80000; text-decoration:none;} #footer p.copy a:hover {text-decoration:underline;} #footer p.ns {float:left; width:205px; font-size:10px;} #footer p.ns a {float:left; color:#9a9a9a; text-decoration:none;} #footer p.ns a:hover {text-decoration:underline;} #footer img {border:0; padding-left:5px; padding-top:1px;} /* index animacija */ #button1 {width:316px; float:left; height:149px; margin-bottom:1px; cursor:pointer; color:#ffffff; text-decoration:none; font-size:25px; font-weight:bold; background:url(../images/stresne_arrow.png) no-repeat; _background:none; _filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=scale, src='images/stresne_arrow.png');} #button2 {width:316px; float:left; height:149px; margin-bottom:1px; cursor:pointer; color:#ffffff; text-decoration:none; font-size:25px; font-weight:bold;background:url(../images/avtodomi_arrow.png) no-repeat;_background:none; _filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=scale, src='images/avtodomi_arrow-new.png?ver=2');} #button3 {width:316px; float:left; height:149px; margin-bottom:1px; cursor:pointer; color:#ffffff; text-decoration:none; font-size:25px; font-weight:bold;background:url(../images/hise_arrow.png) no-repeat;_background:none; _filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=scale, src='images/hise_arrow.png');} .link1 a, .link2 a, .link3 a {width:316px; float:left; height:136px; display:block;color:#ffffff; text-decoration:none; font-size:25px; font-weight:bold;} #button1 a, #button2 a, #button3 a {color:#ffffff; text-decoration:none; font-size:25px; font-weight:bold; float:left; width:301px; padding:13px 0 0 15px;} #button1 a:hover, #button2 a:hover, #button3 a:hover {width:301px; float:left; height:136px;} .button1 a, .button2 a, .button3 a{width:316px; float:left; height:149px; color:#ffffff; text-decoration:none; font-size:25px; font-weight:bold;} .button_on, .button_on a {width:301px; float:left; height:136px;color:#ffffff; text-decoration:none; font-size:25px; font-weight:bold;background:url(../images/hoverbutton.png) no-repeat right;_background:none; _filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=scale, src='images/hoverbutton.png');} #paging {float:left; width:502px;font-size:11px; font-weight:bold;} #paging a {font-size:11px; font-weight:normal; color:#000000;} .pagingLink {color:#c80000;} /* ----------------IMAGE SLIDER------------- */ #SlideItMoo_outer { float:left; width:750px; height:285px; background:url(../images/bottom_groups.jpg) top left no-repeat; display:block; position:relative; } /* the width is set to show the number of thumbnails that will be visible */ #SlideItMoo_inner{ position:relative ; overflow:hidden ; width:738px ; /* set a display width to make the slider look good in case js is disabled */ padding-left:10px; height:285px; } /* the thumbnails container; set a width on it so everything will be fine */ #SlideItMoo_items { display:block; position:relative; height:285px; } /* single element design */ #SlideItMoo_items div.SlideItMoo_element { display:block; position:relative; float:left; margin:0 5px; width:226px; } #SlideItMoo_outer .SlideItMoo_forward, #SlideItMoo_outer .SlideItMoo_back{ display:block; position:absolute; cursor:pointer; width:25px; height:200px; bottom:70px; right:6px; background:url(../images/slideitmoo_forward.png) no-repeat center; } #SlideItMoo_outer .SlideItMoo_back { left:-15px; background:url(../images/slideitmoo_back.png) no-repeat center; } /*#SlideItMoo_items div.SlideItMoo_element h1 a {float:left; width:217px; font-size:20px; font-weight:bold; color:#c80000; padding:12px 0 0 0; text-decoration:none;} #SlideItMoo_items div.SlideItMoo_element h1 a:hover {text-decoration:underline;} #SlideItMoo_items div.SlideItMoo_element span a {float:left; width:208px; font-size:13px; font-weight:bold; height:39px; padding:9px 0 0 9px; color:#000; text-decoration:none;} #SlideItMoo_items div.SlideItMoo_element span a:hover { text-decoration:underline;} #SlideItMoo_items div.SlideItMoo_element img {background:url(../images/bg-img-box.jpg) left top no-repeat; float:left; padding:30px 15px 15px 15px; display:inline; border:0;} #SlideItMoo_items div.SlideItMoo_element a {font-size:13px; color:#c80000; font-weight:bold;} #SlideItMoo_items div.SlideItMoo_element a:hover {text-decoration:none;}*/ /* root element for the scrollable. when scrolling occurs this element stays still. */ .scrollable { /* required settings */ position:relative; overflow:hidden; width: 442px; height:80px; } /* root element for scrollable items. Must be absolutely positioned and it should have a extremely large width to accomodate scrollable items. it's enough that you set the width and height for the root element and not for this element. */ .scrollable .items { /* this cannot be too large */ width:20000em; position:absolute; clear:both; } /* single scrollable item */ .scrollable a { float:left; background-color:#fff; padding:1px; margin:10px 2px 10px 0px; border:1px solid #ccc; cursor:pointer; width:68px; height:65px; } /* active item */ .scrollable .active { border:1px solid #000; z-index:9; position:relative; } /* this makes it possible to add next button beside scrollable */ .scrollable { float:left; } /* prev, next, prevPage and nextPage buttons */ a.browse { background:url(../images/hori_large.png) no-repeat; display:block; margin:30px 0 0 0; width:30px; height:30px; float:left; cursor:pointer; font-size:1px; } /* right */ a.right { background-position: 0 -30px; clear:right; margin-right: 0px;} a.right:hover { background-position:-30px -30px; } a.right:active { background-position:-60px -30px; } /* left */ a.left { margin-left: 0px; } a.left:hover { background-position:-30px 0; } a.left:active { background-position:-60px 0; }