﻿@import url(undohtml.css);

body
{
    background: #464646 url(../images/background.gif) left repeat-y;
}
dl,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,body,html,p,blockquote,fieldset,input,select,textarea
{
	color: #666666;
	font-family: Arial;
	font-size: 12px;
}

/*div
{
    border: solid 1px #000000;
    background-color: #FFFFFF;
}*/

h1
{
    margin-bottom: 10px;
    padding-bottom: 3px;
    background: url(../images/h1_bg.gif) left bottom repeat-x;
    color: #999999;
    font-size: 18px;
    font-weight: bold;
}
h2
{
    margin-bottom: 20px;
    font-size: 20px;
    font-weight: normal;
    color: #000000;
}
p
{
    margin-top: 5px;
}

a
{
    color: #00AF9D;
}
a:hover
{
    color: #333333;
}

/* ------------------------- GENERAL CLASSES -------------------------*/

#message
{
    margin-left: 20px;
}
#error
{
    margin-left: 20px;
}
.hidden
{
	visibility: hidden;
	display: none;
}

.clear
{
    clear: both;
}

.left_align
{
    text-align: left;
    padding-left: 10px;
}
.center_align
{
    text-align: center;
}
.right_align
{
    text-align: right;
    padding-right: 10px;
}

.left_float
{
    float: left;
}
.right_float
{
    float: right;
}

.thumb_holder
{
    height: 85px;
    overflow: hidden;
}
.thumb
{
    width: 100px;
    height: 75px;
    margin: 5px;
}
.sold 
{
    position: relative;
    top: -80px;
    float: left;
    width: 100px;
    height: 75px;
    z-index: 65;
    /* Mozilla ignores crazy MS image filters, so it will skip the following */
    filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=scale, src='images/sold.png');
}
/* IE ignores styles with [attributes], so it will skip the following. */
.sold[class]
{
    background-image: url(../images/sold.png);
}

img.small
{
    width: 200px;
}

input.button
{
	background: url(../images/button.gif);
	background-position: top;
	height: 22px;
	width: 122px;
	font-size: 12px;
	color: #000000;
	border: none;
	padding-bottom: 3px;
}
input.button:hover
{
    background-position: bottom;
	color: #FFFFFF;
}

a.block230
{
    display: block;
    width: 200px;
    margin-top: 15px;
    padding: 2px 15px;
    background-color: #00AF9D;
    color: #000000;
    text-align: center;
}

a.print
{
    display: block;
    float: right;
    height: 16px;
    padding-left: 16px;
    background-image: url(../images/print.gif);
    background-position: top left;
    background-repeat: no-repeat;
}
a.print:hover
{
    background-position: bottom left;
}

/* ------------------------- HEADER --------------------------------*/

#header
{
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 150px;
    background: #000000 url(../images/header.jpg) left no-repeat;
    color: #FFFFFF;
    z-index: 70;
}
#header img
{
    position: absolute;
    top: 40px;
    left: 20px;
}
#header p
{
    color: #FFFFFF;
}
#header #menu
{
    position: relative;
    top: 120px;
    left: 0;
    width: 100%;
    height: 30px;
    padding-left: 250px;
    background-color: #00AF9D;
}
#header #menu a
{
    display: block;
    float: left;
    height: 20px;
    padding: 5px 10px;
    font-size: 16px;
    color: #FFFFFF;
}

/* ------------------------- FOOTER --------------------------------*/

#footer
{
    position: fixed;
    bottom: 0;
    left: 0;
    width: 250px;
    height: 15px;
}
* html #footer
{
    position: absolute;
}
#footer a
{
    display: block;
    width: 250px;
    height: 20px;
    margin-left: -550px;
    padding-left: 20px;
    color: #999;
    overflow: hidden;
}

/* ------------------------- LEFT COLUMN --------------------------------*/

#left_col
{
    position: fixed;
    top: 150px;
    bottom: 0px;
    left: 0;
    width: 250px;
    background-color: #464646;
    overflow: auto;
}
* html #left_col
{
    position: absolute;
}
#left_col p
{
    padding: 0 10px;
    margin-top: 2px;
    color: #FFFFFF;
}
#left_col a
{
    color: #FFFFFF;
}
#left_col a:hover
{
    color: #CCCCCC;
}
#left_col h3
{
    top: 120px;
    left: 0;
    width: 100%;
    height: 23px;
    margin-bottom: 15px;
    padding-top: 7px;
    background-color: #00AF9D;
    color: #000000;
    font-size: 14px;
    font-weight: normal;
    text-align: center;
}
#left_col h3 a
{
    color: #000000;
}
#left_col #categories
{
    margin: 20px 10px 20px 0;
}
#left_col #categories ul
{
    margin-left: 20px;
}
#left_col #categories li
{
    margin-top: 5px;
    font-size: 14px;
}
#left_col #categories li.offer
{
    padding-top: 10px;
}
#left_col #categories li.offer a
{
    font-weight: bold;
}
#left_col #search label
{
    float: left;
    width: 60px;
    padding-top: 3px;
}
#left_col #search input
{
    width: 65px;
    margin-right: 5px;
}
#left_col #search input.check
{
    width: 25px;
    margin-right: 5px;
}
#left_col #search input.button
{
	width: 122px;
}

#left_col img.small
{
    margin: 20px 0 0 20px;
}

/* ------------------------- CONTENT --------------------------------*/

#wrapper
{
    width: 750px;
    margin-left: 250px;
    background-color: #FFFFFF;
}
#content
{
    margin-top: 150px;
    padding-top: 20px;
    padding-left: 0;
}
* html #content
{
    margin-top: 0;
}
#content .indent
{
    position: relative;
    margin: 0 20px 20px 20px;
}

/* ----- BOX ------ */
#content #banner1
{
    width: 672px;
    margin-left: 18px;
}
#content .banner2
{
    float: right;
    width: 550px;
}
#content .box
{
    float: left;
    width: 200px;
    height: 230px;
    margin: 18px;
    background-color: #C4C4C4;
    overflow: hidden;
}
*html #content .box
{
    margin-left: 9px;
}
#content .box h3
{
    width: 200px;
    height: 20px;
    padding-top: 5px;
    background: #00AF9D;
    text-align: center;
    color: #FFFFFF;
    font-weight: normal;
}
#content .box a
{
    color: #FFFFFF;
}
#content .box a:hover
{
    color: #333333;
}
#content .box h3 a
{
    display: block;
    color: #FFFFFF;
}
#content .box img
{
    width: 200px;
}
#content .box p
{
    margin: 5px 10px;
    text-align: justify;
}

#content .box2
{
    float: left;
    width: 335px;
    padding-right: 20px;
    margin-bottom: 20px;
}
#content .box2 h3
{
    padding: 2px 5px;
    background-color: #C4C4C4;
}
#content .box2 span
{
    color: Red;
}
#content #product span
{
    color: Red;
}

#content .box3
{
    float: left;
    width: 200px;
    height: 170px;
    margin: 18px;
    background-color: #C4C4C4;
    color: #333333;
}
#content .box3 p
{
    padding: 5px 15px;
    color: #333333;
}
#content .box3 h3
{
    padding: 10px 15px;
    background-color: #464646;
    color: #FFFFFF;
    font-weight: normal;
}
#content .box3 a
{
    display: block;
    padding: 2px 15px;
    background-color: #00AF9D;
    color: #FFFFFF;
}

#content .box4
{
    width: 680px;
    height: 150px;
    padding: 15px;
    background-color: #C4C4C4;
    color: #333333;
}
#content .box4 img
{
    float: left;
    width: 200px;
    margin-right: 20px;
}

/* ----- CATEGORY FLOW ------ */

#cat_flow
{
    margin-bottom: 10px;
    font-size: 13px;
}

/* ----- LIST ------ */

#content .tablelist
{
    width: 100%;
    margin-bottom: 100px;
}
#content .tablelist th
{
    height: 25px;
    padding-right: 15px;
    background: url(../images/th_bg.gif) repeat-x;
    color: #FFFFFF;
    font-size: 13px;
    font-weight: normal;
}
#content .tablelist th.cijena
{
    width: 100px;
}

#content .tablelist th a
{
    padding-right: 10px;
    background: url(../images/sort.gif) right no-repeat;
    color: #FFFFFF;
    font-size: 13px;
    font-weight: normal;
}
#content .tablelist th a.asc
{
    background: url(../images/sort_asc.gif) right no-repeat;
}
#content .tablelist th a.desc
{
    background: url(../images/sort_desc.gif) right no-repeat;
}
#content .tablelist .even
{
    background-color: #FFFFFF;
}

/* ----- PRODUCT ------ */

#content #product
{
    margin-left: 250px;
}
#content #product label
{
    float: left;
    width: 210px;
    height: 15px;
    margin-top: 5px;
}
#content #product p
{
    height: 15px;
    margin-top: 5px;
    margin-left: 210px;
}
#content #img_list
{
    position: relative;
    width: 200px;
    padding: 15px;
    background-color: #C4C4C4;
}
*html #content #img_list
{
    top: -170px;
    left: -252px;
}
#content #img_list .sold
{
    position: absolute;
    top: 15px;
    left: 15px;
    display: block;
    width: 200px;
    height: 150px;
    z-index: 20;
    /* Mozilla ignores crazy MS image filters, so it will skip the following */
    filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=scale, src='images/sold_200.png');
}
/* IE ignores styles with [attributes], so it will skip the following. */
#content #img_list .sold[class]
{
    background-image: url(../images/sold_200.png);
}
#content #img_list .thumb
{
    width: 95px;
    height: 71px;
    margin: 10px 0 0 0;
    padding: 0;
    background: none;
}
#content #img_list .left
{
    margin-right: 10px;
}
#content #img_list a
{
}
#content #img_list p,h3
{
    color: #333333;
}

#content #form
{
    margin-left: 100px;
}
#content #form p
{
    margin-left: 20px;
}

#content #result p
{
    text-align: center;
    font-size: 14px;
}

/* ----- PRODUCT ------ */

.popup
{
	position: absolute;
	display: none;
	visibility: hidden;
	width: 230px;
	z-index: 99;
}
.popup img
{
    padding: 15px;
    background-color: #464646;
}
.popup p
{
    margin: 0;
    padding: 5px 15px;
    background-color: #C4C4C4;
    color: #333333;
}

/* ----- FORM ------ */

#content #form label
{
    float: left;
    width: 100px;
    padding-right: 10px;
    text-align: right;
}
#content #form input, textarea
{
    width: 300px;
}
#content #form input.button
{
	width: 122px;
}
#content #form span
{
	display: none;
	margin-left: 100px;
	color: #FF0000;
	font-size: 11px;
}

/* ----- CONTENT DISPLAY ------ */

#content #content_display img
{
    float: right;
    margin: 5px;
}
#content #content_display img.map
{
    float: none;
    width: 672px;
    margin-left: 18px;
}