﻿/******************************************************************************************************/
/*......css for....:.Elastic..........................................................................*/
/*......written.by.:.Siniša Kusić.....................................................................*/
/*......date.......: 06/11/2006.....<dd/mm/yyyy>......................................................*/
/******************************************************************************************************/


/*----- basic layout ---------------------------------------------------------------------------------*/

* { margin: 0; padding: 0; }
body { width: 996px; margin: 0 auto; font-family: "Trebuchet MS" , Tahoma, Sans-Serif; font-size: 14px; background: url( assets/layout/body.gif ) repeat-x; color: #000; background-color: #fff; }
#wrapper, #header, #footer { width: 996px; margin: 0 auto; clear: both; }
#header { position: relative; height: 294px; background: url( assets/layout/header.jpg ) no-repeat 100% 100%; }
#col-one { width: 618px; display: inline; float: left; clear: left; }
#col-two { width: 368px; margin: 0 0 0 10px; display: inline; float: right; clear: right; }
#footer { background: url( assets/layout/footer.gif ) repeat-x; color: #fff; background-color: #000; overflow: hidden; }
#footer .left { padding: 25px 10px; width: 400px; display: inline; float: left; overflow: hidden; }
#footer .right { padding: 25px 10px; width: 400px; text-align: right; display: inline; float: right; overflow: hidden; }
#footer a { color: #99cc00; background-color: inherit; text-decoration: none; }
#footer a:hover { text-decoration: underline; }

/* links */
.a_saznajte_vise { color: #006633; background-color: inherit; font-weight: bold; }
.a_saznajte_vise:hover { text-decoration: underline; }
a { text-decoration: none; color: #336600; background-color: inherit; }
a:hover { text-decoration: underline; }

/* headeings */
.green-bottom-rounded-title { padding: 5px 10px; background: url( assets/layout/green-rounded-bottom.gif ) no-repeat 50% 100%; color: inherit; background-color: #eaf5e2; }
.green-bottom-rounded-title span { color: #336600; background-color: inherit; }
.material-title, .sitemap-title { font-size: 20px; color: #336600; background-color: inherit; }
h1 { font-size: 18px; }
h2 { font-size: 16px; }
h3 { font-size: 14px; }
h4 { font-size: 12px; }
h5 { font-size: 10px; }
h6 { font-size: 9px; }

/*----- // end basic layout --------------------------------------------------------------------------*/

/* navigation */
#navigation { width: 996px; height: 60px; color: #fff; background-color: inherit; }
#navigation ol { width: 996px; height: 60px; list-style: none; overflow: hidden; }
#navigation li { float: left; display: inline; overflow: hidden; }
#navigation a { font-size: 12px; text-decoration: none; color: #fff; background-color: inherit; display: block; padding: 25px 15px; }
#navigation a:hover { background: url( assets/layout/nav-hover.gif ) repeat-x; color: #fff; background-color: #000; }

/* servis panel */
#servis-panel { position: absolute; top: 65px; right: 0; width: 360px; }
#servis-panel ol { width: 360px; height: 25px; list-style: none; }
#servis-panel li { float: left; margin: 0 12px; }
#servis-panel a { padding: 0 0 0 25px; font-size: 12px; color: #fff; background-color: inherit; text-decoration: none; }
#servis-panel a:hover { text-decoration: underline; }
#servis-panel .home { background: url( assets/icons/home.gif ) no-repeat 0% 50%; }
#servis-panel .sitemap { background: url( assets/icons/sitemap.gif ) no-repeat 0% 50%; }
#servis-panel .contact { background: url( assets/icons/contact.gif ) no-repeat 0% 50%; }

/* logotip */
#logotip { position: absolute; left: 270px; top: 130px; width: 250px; height: 100px; }
#logotip h1 { width: 250px; height: 100px; }
#logotip a { display: block; width: 250px; height: 100px; }
#logotip a span { margin-left: -9999px; }

/* welcome */
#welcome { width: 566px; margin: 0 0 10px 0; padding: 10px 26px; background: url( assets/layout/corner-right-bottom.gif ) no-repeat 100% 100%; color: inherit; background-color: #f2f2f2; }
#welcome h2 { font-size: 18px; font-weight: bold; margin: 0 0 5px 0; }
#welcome .uvod h2 { display: none; }
#welcome .uvod { line-height: 1.6em; }

/* apart from catalog */
#apart-from-catalog { position: relative; width: 560px; min-height: 670px; margin: 0 0 10px 0; padding: 0 0 0 58px; color: inherit; background: #f2f2f2; overflow: hidden; }
#apart-from-catalog .vertical-title { position: absolute; top: 0; left: 0; width: 56px; height: 670px; background: url( assets/layout/apart-from-catalog-title.gif ) no-repeat; }
#apart-from-catalog .vertical-title span { margin: -9999px; }
#apart-from-catalog .izdvojeni_unos { width: 175px; margin: 10px 5px 10px 5px; font-size: 12px; display: inline; float: left; overflow: hidden; }
#apart-from-catalog .izdvojeni_unos_tijelo { }
#apart-from-catalog .izdvojeni_unos_fotografija { width: 175px; height: 150px; color: inherit; background-color: #fff; }
#apart-from-catalog .opis_proizvoda { display: none; }
#apart-from-catalog .cjena_proizvoda { margin: 10px 0 0 0; }

/* language selection */
#language-selection { width: 358px; padding: 10px 5px; margin: 0 0 3px 0; color: inherit; background-color: #eaf5e2; overflow: hidden; }
#language-selection ol { width: 348px; height: auto; list-style: none; }
#language-selection li { margin: 0 5px 0 5px; display: inline; float: left; }
#language-selection a { width: 73px; padding: 0 5px 0 25px; color: #000; background-color: inherit; text-decoration: none; display: block; }
#language-selection a:hover { text-decoration: underline; }
#language-selection .cro { background: url( assets/icons/cro.gif ) no-repeat 0% 50%; border-right: solid 1px #ccc; }
#language-selection .en { background: url( assets/icons/en.gif ) no-repeat 0% 50%; border-right: solid 1px #ccc; }
#language-selection .de { background: url( assets/icons/de.gif ) no-repeat 0% 50%; }

/* catalog browse */
#catalog-browse { width: 368px; margin: 0 0 15px 0; }
#catalog-browse ol { width: 368px; list-style: none; }
#catalog-browse ol li { }
#catalog-browse ol li h3 { font-size: 12px; font-weight: lighter; }
#catalog-browse ol li h3 a { width: 338px; padding: 5px 5px 5px 25px; font-weight: bold; background: url( assets/bullets/bullet-1.gif ) no-repeat 0% 50%; display: block; color: #000; background-color: inherit; text-decoration: none; border-bottom: solid 1px #f2f2f2; }
#catalog-browse ol li h3 a:hover { color: #000; background-color: #f2f2f2; text-decoration: none; }
#catalog-browse ol li ol { width: 288px; margin: 5px 0 5px 50px; list-style: none; overflow: hidden; }
#catalog-browse ol li ol li { background: url( assets/bullets/bullet-1.gif ) no-repeat 0% 50%; line-height: 1.6em; }
#catalog-browse ol li ol li a { width: 263px; padding: 0 0 0 25px; font-size: 12px; font-weight: lighter; color: #000; display: block; background-color: inherit; }
#catalog-browse ol li ol li a:hover { text-decoration: underline; }

/* action sale */
#action-sale { position: relative; width: 368px; margin: 0 0 3px 0; color: inherit; background-color: #f2f2f2; }
#action-sale .action-icon { position: absolute; top: -13px; right: -25px; font-size: 16px; text-align: center; width: 110px; height: 29px; padding: 40px 0 40px 0; background: url( assets/icons/action.jpg ) no-repeat 50% 0%; }
#action-sale .uvod { width: 280px; padding: 10px; color: #535353; background: inherit; }
#action-sale .uvodna_fotografija { margin: 0 10px 10px 0; display: inline; float: left; overflow: hidden; }
#action-sale .uvod_tijelo { display: inline; overflow: hidden; font-size: 12px; }
#action-sale .uvod_tijelo h2 { font-size: 16px; margin: 0 0 5px 0; line-height: 1em; }

/* news */
#news { width: 368px; margin: 0 0 3px 0; }
#news .uvod { margin: 10px 0 10px 0; padding: 10px 0; font-size: 12px; border-bottom: solid 1px #f2f2f2; color: #535353; background: inherit; }
#news .uvod_tijelo h2 { font-size: 16px; margin: 0 0 5px 0; line-height: 1em; }

/* in this column */
#in-this-column { width: 368px; margin: 0 0 3px 0; overflow: hidden; }
#in-this-column h3 { font-size: 16px; padding: 5px 10px; color: inherit; background-color: #eaf5e2; }
#in-this-column ol { width: 368px; list-style: none; }
#in-this-column ol li { }
#in-this-column ol li a { width: 338px; padding: 5px 5px 5px 25px; font-weight: bold; background: url( assets/bullets/bullet-1.gif ) no-repeat 0% 50%; display: block; color: #000; background-color: inherit; text-decoration: none; border-bottom: solid 1px #f2f2f2; }
#in-this-column ol li a:hover { color: #000; background-color: #f2f2f2; text-decoration: none; }

/* material */
.materijal { width: 566px; margin: 0 0 10px 0; padding: 10px 26px; background: url( assets/layout/corner-right-bottom.gif ) no-repeat 100% 100%; color: inherit; background-color: #f2f2f2; line-height: 1.6em; overflow: hidden; }
.materijal p { padding: 5px 0 25px 0; }

/* material headings */
.materijal h1 { margin: 0 0 25px 0; }
.materijal h2 { margin: 0 0 15px 0; }
.materijal h3 { margin: 0 0 10px 0; }
.materijal h4, .materijal h5 { margin: 0 0 5px 0; }

/* material lists */
.materijal ul, .materijal ol { padding: 5px 25px 25px 25px; overflow: hidden; }
.materijal li { margin: 0 0 5px 0; line-height: 1.2em; }

/* material links */
.materijal a { }
.materijal a:hover { }

/* catalog */
.katalog_bread_crumbs { margin: 25px 0 30px 0; display: block; clear: both; overflow: hidden; }
.katalog_bread_crumbs a { }
.katalog_bread_crumbs a:hover { }
.dgrdKatalog { width: 95%; margin: 0 auto 30px auto; border: 0; }
.dgrdKatalog tr { border: 0; }
.dgrdKatalog_Item { padding: 5px; }
.dgrdKatalog_AlternatingItem { padding: 5px; }
.dgrdKatalog_Item .dgrd-desna-kolumna, .dgrdKatalog_Item .dgrd-lijeva-kolumna { color: inherit; background-color: #fcfcfc; }
.dgrd-lijeva-kolumna { width: 20%; margin: 0 auto; padding: 10px; border-right: solid 1px #fff; }
.dgrd-desna-kolumna { padding: 10px; }
.dgrd-pager a { padding: 10px; text-decoration: none; font-size: 14px; font-weight: bold; }
.dgrd-pager a:hover { font-weight: bold; text-decoration: underline; }

/* catalog input */
#catalog-input { width: 566px; clear: both; overflow: hidden; }
#catalog-input h2 { margin: 25px 0 25px 0; font-size: 20px; color: #336600; background-color: inherit; }
#catalog-input .katalog_fotografije { width: 145px; padding: 5px; text-align: center; display: inline; float: left; clear: left; overflow: hidden; }
#catalog-input .katalog_fotografije img { margin: 0 auto; display: block; clear: both; overflow: hidden; }
#catalog-input .katalog_osnovni_podaci { width: 399px; padding: 0 0 0 10px; border-left: solid 1px #ccc; display: inline; float: right; clear: right; overflow: hidden; }
#catalog-input .katalog_osnovni_podaci h3 { margin: 0 0 10px 0; }
#catalog-input .katalog_label { }
#catalog-input .katalog_vrijednost { margin: 0 0 30px 0; }

/* siteamap */
#sitemap { width: 566px; margin: 25px 0; clear: both; overflow: hidden; }
#sitemap ol { width: 450px; margin: 25px auto; list-style: none; overflow: hidden; }
#sitemap ol li { margin: 0; }
#sitemap ol li h3 { font-size: 12px; font-weight: lighter; }
#sitemap ol li h3 a { width: 420px; padding: 5px 5px 5px 25px; font-weight: bold; background: url( assets/bullets/bullet-1.gif ) no-repeat 0% 50%; display: block; color: #000; background-color: inherit; text-decoration: none; border-bottom: solid 1px #f2f2f2; }
#sitemap ol li h3 a:hover { color: #000; background-color: #f2f2f2; text-decoration: none; }
#sitemap ol li ol { width: 320px; margin: 5px 0 5px 50px; list-style: none; overflow: hidden; }
#sitemap ol li ol li { background: url( assets/bullets/bullet-1.gif ) no-repeat 0% 50%; line-height: 1.6em; }
#sitemap ol li ol li a { width: 195px; padding: 0 0 0 25px; font-size: 12px; font-weight: lighter; color: #000; display: block; background-color: inherit; }
#sitemap ol li ol li a:hover { text-decoration: underline; }

/* contact form */
.kontakt-fieldset { margin: 30px 0 0 0; border: 0; padding: 5px; clear: both; }
.kontakt-fieldset legend { padding: 5px 10px; font-size: 18px; color: #336600; background-color: inherit; }
.kontakt-fieldset br { display: none; }
.kontakt-fieldset input, .kontakt-fieldset textarea { width: 90%; margin: 0 0 10px 0; padding: 5px; border: solid 1px #ccc; color: #000; background-color: inherit; }
.kontakt-fieldset textarea { height: 200px; color: inherit; background-color: #fff; }
.kontakt-fieldset input:focus, .kontakt-fieldset textarea:focus { color: #fff; background: #000; border: solid 1px #336600; }
.kontakt-fieldset label { font-size: 14px; font-weight: bold; display: block; clear: left; }
.posalji-button { margin: 0 0 25px 0; font-size: 18px; font-weight: bold; display: block; clear: both; }
