/* Theme Name: Komunalac Theme URI: http://komunalac-kc.hr Description: Tema za web stranice http://komunalac-kc.hr Version: 2 (WP2.6.2) Author: Skin29 d.o.o. Author URI: http://skin29.net */ /* -------------------------------------------------------------- KOMUNALAC KOPRIVNICA STYLES Created: 27.04.2009. Modified: 30.07.2011. -------------------------------------------------------------- */ /* http://meyerweb.com/eric/tools/css/reset/ */ /* v1.0 | 20080212 */ html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent; } body { font: 62.5%/24px "Trebuchet MS", Geneva, Arial, sans-serif; color: #b7b7b7; } ol, ul { list-style: none; } blockquote, q { quotes: none; } blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; } :focus { outline: 0; } table { border-collapse: collapse; border-spacing: 0; } /* =defaults -------------------------------------------------------------- */ html { background: #fff url(images/html.png) repeat-x 0 100%; } body { background: #ebebeb url(images/body.png) repeat-x 0 0; margin-bottom: 7px; } h1, h2, h3, h4, h5, h6 { color: #716f6d; } a { text-decoration: none; } a:link { color: #0081d5; } a:visited { color: #0081d5; } a:active { color: #0081d5; } a:hover { color: #716f6d; } a:focus { color: #716f6d; } input, textarea, button { border: 1px solid #ebebeb; font-family: "Trebuchet MS", Geneva, Arial, sans-serif; } #searchsubmit, #submitaj, button { background: #ebebeb url(images/form-button.png) repeat-x 0 0; } label { display: block; } input { padding: 4px 2px 0 2px; } br { display: block; height: 0; clear: both; } /* =tables -------------------------------------------------------------- */ table { width: 100%; margin: 7px 0 20px 0; } thead { border-bottom: 1px solid #e2e2e2; } thead th { text-align: left; } tbody tr { background: #fff; } tr.odd { background: #f4fafd; } .column-2, .column-3, .column-4, .column-5, .column-6 { text-align: right; } .wp-table-reloaded-id-9 .column-1, .wp-table-reloaded-id-9 .column-2, .wp-table-reloaded-id-9 .column-3, .wp-table-reloaded-id-10 .column-1, .wp-table-reloaded-id-10 .column-2, .wp-table-reloaded-id-10 .column-3, .wp-table-reloaded-id-11 .column-1, .wp-table-reloaded-id-11 .column-2, .wp-table-reloaded-id-11 .column-3, .wp-table-reloaded-id-12 .column-1, .wp-table-reloaded-id-12 .column-2, .wp-table-reloaded-id-12 .column-3, .wp-table-reloaded-id-13 .column-1, .wp-table-reloaded-id-13 .column-2, .wp-table-reloaded-id-13 .column-3 { text-align: left; width: 32%; } /* =layout -------------------------------------------------------------- */ #wrap { width: 960px; margin: 0 auto; overflow: hidden; } #header { width: 960px; height: 185px; position: relative; } #branding { width: 221px; height: 110px; position: absolute; left: 17px; top: 33px; overflow: hidden; } #globalNavi { width: 960px; position: absolute; right: 0; bottom: 0; } #searchform { width: 290px; position: absolute; right: 20px; bottom: 82px; } #info { width: 290px; position: absolute; right: 20px; bottom: 127px; } #main { width: 920px; overflow: hidden; } #content { width: 605px; float: left; } #homeNavi { width: 605px; float: left; } #news { width: 605px; float: left; position: relative; } #sideBar { width: 290px; float: right; } #footer { width: 960px; float: left; position: relative; } /* =branding -------------------------------------------------------------- */ .siteSlogan { width: 221px; height: 39px; position: absolute; left: 0; top: -35px; } #branding .org { margin-top: 4px; } #branding span { padding: 0 5px; font-size: 1.1em; display: block; line-height: 1.27; } /* =searchform -------------------------------------------------------------- */ #searchform label { display: none; } #searchsubmit { width: 49px; height: 24px; padding: 0; float: right; font-size: .909em; text-transform: uppercase; color: #716f6d; } #s { width: 202px; height: 20px; padding: 3px 4px 0 22px; float: left; background: #fff url(images/info-search-icons.png) no-repeat .3em -6.2em; } /* =info -------------------------------------------------------------- */ #info { font-size: 1.1em; line-height: 16px; } #info .serviceLinks { float: left; margin-top: 2px; } #info .kontakt a { padding-left: 22px; background: #fff url(images/info-search-icons.png) no-repeat 0 .2em; } #info .besplatniTel { float: right; display: block; padding-left: 22px; background: #fff url(images/info-search-icons.png) no-repeat 0 -3em; } .besplatniTel span { color: #0081d5; font-size: 1.4545em; } /* =navigation -------------------------------------------------------------- */ #globalNavi .navigation { width: 960px; overflow: hidden; background: #eee url(images/main-navigation.png) repeat-x 0 1px ; } .navigation li { float: left; font-size: 1.2em; line-height: 1; text-align: left; border: 1px solid #ebebeb; border-left-color: #f9f9f9; } .navigation li.homeLink { border-left-color: #ebebeb; } .navigation li.last { border-right: none; } .navigation li a { text-transform: uppercase; padding: 6px 20px 8px 20px; display: block; } .navigation li a:link, .navigation li a:visited, .navigation li a:active { color: #716f6d; } .navigation li a:hover, .navigation li a:focus { color: #0081d5; } .navigation li a span { color: #b6b6b6; } .navigation li span { display: block; font-size: .8333em; text-transform: none; padding-top: 2px; } #footer li a span { display: none; } #footer .navigation li { border: none; } #footer .navigation li a { text-transform: none; } /* =main -------------------------------------------------------------- */ #main { margin: 10px 0; padding: 17px 19px 20px 19px; background: #fff; border: 1px solid #e2e2e2; } /* =homeNavi -------------------------------------------------------------- */ #content #homeNavi ul { overflow: hidden; margin-left: 0; } #content #homeNavi li { width: 183px; height: 183px; margin: 0 24px 25px 0; overflow: hidden; position: relative; float: left; border: 1px solid #e2e2e2; background: none; padding: 0; } #content #homeNavi li.last { margin-right: 0; } #content #homeNavi li a { width: 183px; height: 183px; display: block; } #homeNavi a span { width: 177px; padding: 0 3px; position: absolute; left: 0; bottom: -1px; background: transparent url(images/strip.png) repeat 0 0; font-size: .8571em; } #homeNavi li a:link, #homeNavi li a:visited, #homeNavi li a:active { color: #fff; } #homeNavi li a:hover, #homeNavi li a:focus { color: #ccc; } /* =nav matrix -------------------------------------------------------------- */ #content #homeNavi li { background-color: #fff; background-image: url(images/usluge.jpg); background-repeat: no-repeat; background-position: 0 0; } #homeNavi li#plin, #homeNavi li#opskrba-plinom { background-position: 0 0; } #homeNavi li#voda, #homeNavi li#distribucija-vode { background-position: -183px 0; } #homeNavi li#odvodnja, #homeNavi li#odvodnja-i-prociscavanje-vode { background-position: -366px 0; } #homeNavi li#cistoca, #homeNavi li#cistoca-i-odlagaliste-otpada { background-position: 0 -183px; } #homeNavi li#zelene, #homeNavi li#odrzavanje-zelenih-povrsina { background-position: -183px -183px; } #homeNavi li#ts, #homeNavi li#trznica-i-sajmiste { background-position: -366px -183px; } #homeNavi li#groblje, #homeNavi li#odrzavanje-groblja-i-ostale-popratne-usluge-ukopa { background-position: 0 -366px; } #homeNavi li#procistac { background-position: -183px -366px; } #homeNavi li#komnet, #homeNavi li#potrosaci { background-position: -366px -366px; } /* =content -------------------------------------------------------------- */ #content { } #content h1 { font-size: 1.8em; font-weight: normal; margin-bottom: 16px; position: relative; } #content h1.ime-prezime-titula { margin-bottom: 0; } #content h2.funkcija { margin-bottom: 16px; } #content h2, #content h3, #content h4, #content h5, #content h6 { font-size: 1.4em; font-weight: bold; } #content p, #content li, #content th, #content td { font-size: 1.4em; } #content p, #content ul, #content ol, #content dl { margin-bottom: 1.25em; } #content ul, #content ol { margin-left: 22px; } #content li { padding-left: 14px; background: #fff url(images/content-list-bullet.png) no-repeat 0 .7em; } #content ul ul, #content ol ul, #content ol ol, #content ol ul { margin-bottom: 0; } #content li li { font-size: 100%; } #content a img { margin-top: 6px; margin-right: 16px; border: 1px solid #e2e2e2; float: left; } #content .wp-caption { width: 183px; margin: 3px 16px 0 0; float: left; border: 1px solid #e2e2e2; background: #e2e2e2; } #content .wp-caption img { margin-top: 0; width: 183px; border: none; } #content .wp-caption-text { font-size: 11px; line-height: 20px; margin-bottom: 0; padding: 0 6px; } #content .alignleft { float: left; margin-left: 0; margin-right: 16px; } #content .alignright { float: right; margin-right: 0; margin-left: 16px; } #content .aligncenter { display: block; margin: 0 auto; } #content blockquote { margin: 1.5em 0; padding: 0 0 0 35px; clear: both; background: #fff url(images/blockquote.png) no-repeat 0 0; } #content blockquote p { font-size: 1.6em; font-style: italic; margin-bottom: 0; } #content th, #content td { padding: 0 .2em; font-size: 1.2em; } #content .documentList { width: 581px; padding: 9px 11px 0 11px; border: 1px solid #e2e2e2; float: left; clear: both; } #content .documentList h2 { font-size: 1.2em; line-height: 1; font-weight: normal; text-transform: uppercase; padding-top: 2px; float: left; } #content .documentList .doclist { margin: 0; padding: 0 0 0 16px; overflow: hidden; } #content .doclist li { width: 30%; margin: 0 12px 6px 0; float: left; padding: 0; background: none; font-size: 1em; line-height: 18px; } /* =stafList -------------------------------------------------------------- */ #content .stafList { margin: 0; padding: 3px 0 0 0; } #content .stafList li { width: 605px; margin-bottom: 25px; overflow: hidden; position: relative; list-style: none; padding-left: 0; background: #fff; } #content .stafList li p { } .stafList .photo { width: 183px; height: 183px; margin: 0 15px 0 0; border: 1px solid #e2e2e2; float: left; } .stafList .label { width: 30px; margin-right: 10px; text-align: right; display: block; float: left; color: #716f6d; } .stafList .note { width: 405px; margin-top: 4px; padding-top: 2px; float: left; border-top: 1px solid #e2e2e2; line-height: 2; } #content .stafList .cc { width: 405px; overflow: hidden; margin-bottom: 2px; font-size: 100%; } .stafList .email, .stafList .tel { width: 300px; display: block; float: left; position: relative; } .stafList .email { top: -2px; } .stafList .tel { top: -3px; } #content .stafList .role { margin-bottom: 9px; } #content .vcard { font-size: .8571em; line-height: 1.4; } #content .vcard .fn { font-weight: normal; margin-bottom: 5px; text-transform: uppercase; } #content .vcard .fn span { text-transform: none; } #content .vcard .email, #content .vcard .tel { font-size: 1.2743em; } #content #hCard { visibility: hidden; } /* =newslist, =searchlist -------------------------------------------------------------- */ #content .newslist, #content .searchlist { margin: 0; padding: 3px 0 0 0; } #content .newslist li, #content .searchlist li { width: 605px; margin-bottom: 12px; padding-left: 0; overflow: hidden; position: relative; list-style: none; background: #fff; font-size: .8571em; } #content .newslist h2 a, #content .searchlist h2 a { color: #716f6d; } #content .newslist h2, #content .searchlist h2 { padding-left: 50px; padding-top: .9167em; font-weight: normal; line-height: 1.5; } .newslist .datum, .searchlist .datum { font-size: 1.1672em; line-height: 1; position: absolute; left: 50px; top: 3px; color: #716f6d; } .newslist .dan, .searchlist .dan { width: 25px; height: 25px; padding-top: .25em; display: block; overflow: hidden; position: absolute; left: 0; top: 0; font-size: 1.4em; font-weight: normal; text-align: center; background: #fff url(images/calendar.png) no-repeat 0 0; color: #fff; } .newslist p, .searchlist p { padding-left: 50px; line-height: 1.5; } .searchlist p img { display: none; } /* =news -------------------------------------------------------------- */ #news { position: relative; } #news h2 { border-bottom: 1px solid #ebebeb; padding-bottom: 2px; margin-bottom: 6px; text-transform: uppercase; font-size: 1.2em; font-weight: normal; } #news .newslist h2 { margin-bottom: 0; border-bottom: none; text-transform: none; font-size: 1.4em; } /* =utils liks -------------------------------------------------------------- */ #news .utils { margin: 0; position: absolute; top: 0; right: 0; } #news .utils li { background: none; margin-left: 20px; float: left; font-size: 1.2em; } #news .utils li.archive { padding: 0 0 0 27px; background: #fff url(images/archive-icon.gif) no-repeat left center; } #news .utils li.rss { padding: 0 0 0 21px; background: #fff url(images/rss-icon.gif) no-repeat left center; text-transform: uppercase; } /* =kontaktForma -------------------------------------------------------------- */ #kontaktForma { } #kontaktForma ul { margin: 0; } #kontaktForma li { padding: 0; margin-bottom: .5em; background: #fff; } #kontaktForma label { font-size: .857em; color: #716F6D; } #kontaktForma label span { color: #0081d5; } #kontaktForma input { width: 288px; height: 18px; line-height: 1; } #kontaktForma .provjera { clear: both; overflow: hidden; } #kontaktForma .provjera label { float: left; margin-right: 20px; } #kontaktForma .provjera input { width: 96px; float: left; } #kontaktForma textarea { width: 600px; line-height: 1.5; font-size: .857em; padding: 2px 0 2px 2px; } #kontaktForma #submitaj { width: 67px;height: 25px; margin-top: 16px; margin-left: 0; padding: 0; border: 1px solid #f5f5f5; font-size: .8333em; line-height: 1; text-transform: uppercase; text-align: center; } #kontaktForma span.error { font-size: .857em; padding: 0 0 0 20px; margin: 0 0 0 20px; background: #fff url(images/error.png) no-repeat 0 50%; color: #e00; } /* =wp-pagenavi -------------------------------------------------------------- */ .wp-pagenavi { width: 603px; height: 25px; border: 1px solid #e2e2e2; text-align: center; overflow: hidden; } .wp-pagenavi a, .current { margin: 0 1px 0 0; padding: 6px 5px; line-height: 2; font-size: 1.2em; } .wp-pagenavi a span { font-size: .83333em; text-transform: uppercase; } .wp-pagenavi .current { background: #0082d6; color: #fff; } .wp-pagenavi a:link, .wp-pagenavi a:visited, .wp-pagenavi a:active { } .wp-pagenavi a:hover, .wp-pagenavi a:focus { background: #0082d6; color: #fff; } /* =sideBar -------------------------------------------------------------- */ #sideBar { } #sideBar h2, #sideBar h3 { text-transform: uppercase; } #sideBar .top { margin-top: 0; } #sideBar label { font-size: .8333em; line-height: 1.5; color: #716f6d; } .pagenav { width: 288px; margin-top: 6px; margin-bottom: 20px; background: #f5f5f5; border: 1px solid #e2e2e2; } .pagenav ul, .rukovoditelj dl { padding: 2px 10px 5px 10px; } .pagenav .page_item { padding-left: 15px; background: #f5f5f5 url(images/content-list-bullet.png) no-repeat 0 .9em; font-size: 1.2em; } .pagenav .page_item ul { padding: 0 0 0 1px; } .pagenav .page_item .page_item { font-size: 100%; background: #f5f5f5 url(images/content-sub-list-bullet.png) no-repeat 0 .9em; } .pagenav .page_item a { display: block; } .rukovoditelj, .info { width: 268px; padding: 10px; margin: 20px 0; background: #f4fafd; border: 1px solid #e2e2e2; font-size: 1.2em; } .rukovoditelj { padding-bottom: 4px; } .rukovoditelj h2 { width: 176px; float: right; line-height: 1.5; padding: 1px 0 3px 0; } .rukovoditelj h2 span { text-transform: uppercase; } .rukovoditelj h2 a { color: #716f6d; text-transform: none; } .rukovoditelj p { padding-left: 92px; line-height: 18px; } .rukovoditelj img { width: 80px; height: 80px; margin-right: 10px; float: left; border: 1px solid #f5f5f5; } .rukovoditelj .contactInfo { width: 268px; clear: both; } .contactInfo p { padding: 8px 0 0 0; font-size: .916em; line-height: 1.25; } .contactInfo span.type { width: 82px; margin-right: 10px; display: block; float: left; font-size: .833em; text-align: right; } .info { padding-bottom: 4px; } #sideBar .info h2, #sideBar .info h3 { padding-left: 61px; font-weight: normal; line-height: 1.5; margin-bottom: 13px; text-transform: none; } #sideBar .pp h3 { margin-bottom: 5px; } .info h2 a, .info h3 a { color: #716f6d; } .info p { margin-bottom: 0; } .info .datum, .info .vrijeme { margin-right: 4px; font-size: .8333em; color: #716f6d; } .info .opis { color: #b7b7b7; } .cjenik { background: #f4fafd url(images/cjenik.png) no-repeat 19px 7px; } .odvoz { background: #f4fafd url(images/odvoz.png) no-repeat 19px 7px; } .najava { background: #f4fafd url(images/najava.png) no-repeat 19px 7px; } .analiza { background: #f4fafd url(images/analiza-vode.png) no-repeat 19px 7px; } .ukop { background: #f4fafd url(images/icon_ukop.gif) no-repeat 19px 7px; } .pp { background: #f4fafd url(images/prijatelj-prirode.gif) no-repeat 7px 7px; } .pp h3, #sideBar .pp a { width: 268px; height: 55px; margin: 0; display: block; } #sideBar .radnovrijeme h3, #sideBar .komnet h3 { font-size: 1.2em; line-height: 24px; padding-left: 23px; font-weight: normal; } .radnovrijeme h3 { background: #fff url(images/radno-vrijeme.png) no-repeat 0 .3em; } .komnet h3 { background: #fff url(images/login.png) no-repeat 0 .3em; } .komnet form { margin: 21px 0 14px 0; float: left; clear: both; } .komnet form p { float: left; margin-bottom: 4px; } .komnet input { width: 203px; height: 18px; padding: 2px 2px 3px 2px; line-height: 1; } .komnet label { margin-bottom: 1px; } .komnet button { width: 50px; height: 25px; margin-top: 16px; margin-left: 9px; padding: 0; border: 1px solid #f5f5f5; font-size: .8333em; line-height: 1; text-transform: uppercase; text-align: center; } .radnovrijeme, .komnet { margin: 6px 0 20px 0; } .radnovrijeme .info, .komnet .info { margin: -2px 0 0 0; padding: 6px 10px 4px 10px; } .komnet .info { padding-bottom: 9px; } .radnovrijeme .info { background: #f5f5f5; } .komnet .info p { line-height: 1.5; } /* =footer -------------------------------------------------------------- */ #footer { padding-bottom: 30px; clear: both; } #footer .navigation { overflow: hidden; margin: 13px 0; } .copyright { padding: 0 20px; } .designby { padding: 0 20px; display: block; line-height: 1; } /* =section -------------------------------------------------------------- */ #footer .vcard { position: absolute; top: 15px; right: 19px; text-align: right; } #footer .logo { width: 108px; height: 17px; float: right; display: inline; margin-bottom: 26px; } #footer .adr { clear: both; line-height: 1; margin-bottom: 1px; } #footer .fn, #footer .tel, #footer .email { display: inline; } #footer .url { color: #888; } /*=certifikati -------------------------------------------------------------- */ #certifikati { position: absolute; top: 52px; left: 462px; } #certifikati img { float: left; margin: 0 10px 0 0; } /* =utility -------------------------------------------------------------- */ .date { display: block; font-size: 1em; line-height: 1.7em; letter-spacing: .2em; } .fancy { font-style: italic; } .last { margin-right: 0; } #content .stafList .last { margin-bottom: 0; } .more-link { text-transform: uppercase; text-decoration: none; font-size: .9167em; } a.more-link:link, a.more-link:visited, a.more-link:active { white-space: nowrap; color: #0081d5; } a.more-link:hover, a.more-link:focus { color: #716f6d; } .editLink { width: 16px; height: 16px; position: absolute; top: .35em; font-size: .75em; background: #fff url(images/page_edit.png) no-repeat 0 0; text-indent: -99999em; } .editLink a { width: 16px; height: 16px; display: block; } .doclist { margin: 0; } .doclist a { display: block; text-decoration: none; padding-left: 23px; background-color: transparent; background-repeat: no-repeat; background-position: 0 0; background-image: url(images/icon_generic.gif); } .doclist a:link, .doclist a:visited, .doclist a:active { color: #716f6d; } .doclist a:hover, .doclist a:focus { color: #0081d5; } .doclist a[href$=".mov"], .doclist a[href$=".mpg"] { background-image: url(images/icon_mov.gif); } .doclist a[href$=".avi"], .doclist a[href$=".wmv"] { background-image: url(images/icon_film.gif); } .doclist a[href$=".wav"], .doclist a[href$=".mp3"] { background-image: url(images/icon_audio.gif); } .doclist a[href$=".txt"] { background-image: url(images/icon_txt.gif); } .doclist a[href$=".doc"], .doclist a[href$=".docx"], .doclist a[href$=".odf"] { background-image: url(images/icon_doc.gif); } .doclist a[href$=".xls"], .doclist a[href$=".xlsx"] { background-image: url(images/icon_xls.gif); } .doclist a[href$=".ppd"], .doclist a[href$=".ppt"] { background-image: url(images/icon_ppt.gif); } .doclist a[href$=".pdf"] { background-image: url(images/icon_pdf.gif); } .doclist a[href$=".zip"] { background-image: url(images/icon_zip.gif); }