/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * BOXES.CSS: - p�edpis pro designov� styly jako nap�. layout, rolovac� menu, hlavi�koidn� v�ci, * r�zn� plovouc� nab�dky, apod. * - stylesheet for design, layout, hovermenus, header things, floating boxes, etc. * * version: 1.0.2 / wa 2.82 * author: OV * email: vetesnik@ebrana.cz * media: screen * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */ html, body { margin: 0; padding: 0; text-align: center; background: #C0C0C0; } span.red, span.star { color: red; padding: 0 0.2em; } .noborder { border: none; background: none; } .none, .hidden { position: absolute; top: -999em; left: -999em; } .displayNone { display: none; } p.skipLinks { margin: 0; text-align: center; } p.skipLinks a { position: absolute; top: -999em; left: -999em; z-index: 1000; text-decoration: none; font-weight: bold; } p.skipLinks a:focus, p.skipLinks a:active { position: fixed; top: 0; left: 0; width: 100%; padding: 5px 0; color: #ffc000; background: #175A9E; } /* viz ie.css */ /* * * * * * hlavn� divy - wrappers * * * * * */ .backgroundContainer { width: 100%; background: ; } #main { width: 960px; margin: 0 auto; text-align: left; background: white url(../images/main.gif) 100% 0 repeat-y; } /* * * * * * sloupce - columns * * * * * */ #right { display: inline; float: right; width: 157px; margin: 0 1px 20px 0; padding: 10px 20px 0; background: #F76210 url(../images/right.jpg) 0 0 no-repeat; color: white; } #center { display: inline; float: left; width: 702px; margin: 0 30px 20px 30px; } #right h3 { color: white; font-weight: bold; background: url(../images/ikona_sloupec.gif) 0 0 no-repeat; padding-left: 30px; padding-bottom: 5px; font-size: 1.19em; } /* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */ /* * * * * * * * * * * HLAVI�KOIDN� A PATI�KOIDN� V�CI * * * * * * * * * * * */ /* * * * * * * * * * * HEADER AND FOOTER THINGS * * * * * * * * * * * */ /* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */ #top { position: relative; z-index: 90; width: 100%; height: 224px; background: url(../images/top.gif) 0 0 no-repeat; } #top #topflash { position: absolute; top: 0; right: 0; } /* * * * * * pati�ka - footer * * * * * */ /* * * * v mainu - inside main * * * */ #bottom { position: relative; width: 100%; height: 33px; color: white; background: #484338; border-top: 1px solid white; font-size: 0.9em; } /* * * * mimo mainu - outside main * * * */ /* #bottom { width: 100%; height: 45px; border-top: solid 1px #00386f; border-bottom: solid 1px #00386f; color: white; background: #175a9e url(../images/design/bottom.gif) 0 0 repeat-x; } #bottom .width { position: relative; width: 990px; margin: 0 auto; text-align: left; color: #3a127a; font-size: .9em; }*/ p#copyright { position: absolute; top: 10px; left: 20px; margin: 0; text-decoration: none; text-align: left; line-height: normal; } p#copyright .pipe { margin: 0 0.5em; } p#copyright a { color: white; } a#wa { position: absolute; top: 8px; right: 21px; } a#ebrana { position: absolute; top: 8px; right: 100px; } .internalLinks { clear: both; width: 100%; } .internalLinks ul { margin: 0; padding: 1em 1em 0.75em; font-size: 0.833em; color: #444; text-align: center; } .internalLinks ul li { display: inline; padding: 0; background: none; } .internalLinks ul li a, .internalLinks ul li a:visited { color: #444; text-decoration: none; } .internalLinks ul li a:hover { text-decoration: underline; } .vymenaLinku { clear: both; width: 100%; } .vymenaLinku p { margin: 0; padding: 1em 1em 0.75em; font-size: 0.833em; color: #aaa; text-align: center; } .vymenaLinku p a, .vymenaLinku p a:visited { color: #aaa; text-decoration: none; } .vymenaLinku p a:hover { text-decoration: underline; } /* * * * * * rychl� vyhled�v�n� - searchform * * * * * */ ul#icons { position: absolute; top: 21px; right: 19px; margin: 0; line-height: normal; } ul#icons li { display: inline; float: left; margin-right: 0px; padding: 0 0px 0 0; font-size: 0.916em; background: url(../images/design/pipe.gif) 100% 50% no-repeat; } ul#icons li.kontakt { padding: 0; margin: 0; background: none; } ul#icons li a { display: block; padding: 0px 0 0px 0px; width: 29px; height: 23px; background: url(../images/icons/ico_home.gif) 0 0px no-repeat; } ul#icons li a span { display: none; } ul#icons li.map a { background: url(../images/icons/ico_map.gif) 0 0px no-repeat; } ul#icons li.kontakt a { background: url(../images/icons/ico_contact.gif) 0 0px no-repeat; } /* * * * * * jayzkov� mutace - language mutations * * * * * */ ul#lang { position: absolute; top: 86px; right: 29px; margin: 0; line-height: normal; } ul#lang li { display: inline; width: 40px; height: 18px; float: left; margin-left: 1px; padding: 0; text-align: center; } ul#lang li a { position: relative; display: block; width: 100%; height: 100%; overflow: hidden; font-size: 0.833em; } ul#lang li a span { position: absolute; top: 0; left: 0; width: 100%; height: 100%; cursor: pointer; background: url(../images/icons/ico_cz.gif) 0 0 no-repeat; } ul#lang li.en a span { background: url(../images/icons/ico_en.gif) 0 0 no-repeat; } ul#lang li.de a span { background: url(../images/icons/ico_de.gif) 0 0 no-repeat; } /* * * * * * rychl� vyhled�v�n� - searchform * * * * * * * HACKED in ie.cs! */ #searchbox { position: absolute; top: 10px; right: 0; } #searchbox fieldset { display: inline; margin: 0; padding: 0; border: none; background: none; } #searchbox input.left_input { width: 164px; padding: 2px 6px 2px; border-color: #a6a9ac; font-family: Arial, Helvetica, sans-serif; background: white url(../images/design/search_input.gif) 0 0 no-repeat; } #searchbox input.sub { margin-left: 2px; padding-left: 13px; padding-right: 13px; } /* * * * * * autocomplete * * * * * */ #autocomplete { position: absolute; top: 20px; left: 0; z-index: 100; width: 176px; } #autocomplete ul { position: static; top: auto; left: auto; float: left; width: 100%; margin: 0; line-height: normal; border: solid 1px #a6a9ac; } #autocomplete ul.hidden { position: absolute; top: -999em; left: -999em; } #autocomplete ul li { clear: both; float: left; width: 164px; padding: 3px 6px; cursor: pointer; background: white; } #autocomplete ul li:after { display: block; clear: both; content: " "; } #autocomplete ul li:hover, #autocomplete ul li.hover, #autocomplete ul li.active { background: #eaeaea; } #autocomplete ul li span.txt { float: left; } #autocomplete ul li span.no { float: right; color: #bbbbbb; } /* * * * * * top menu * * * * * */ #mainMenu { position: absolute; top: 184px; left: 0; width: 100%; background: #484338 url(../images/topmenu.jpg) 100% 0 no-repeat; } #mainMenu ul { margin: 0; padding: 0; margin-left: 30px; } #mainMenu ul li { position: relative; display: inline; float: left; margin: 0 0px; padding: 0; font-size: 1.2em; background: none; } #mainMenu ul li.last { background: none; } #mainMenu ul li a { float: left; padding: 11px 30px 9px 29px; color: white; text-decoration: none; background: url(../images/ikona.gif) 0 9px no-repeat; } #mainMenu ul li a span { } #mainMenu ul li.active { } #mainMenu ul li.active a { color: #fcb02c; background: url(../images/ikona_act.gif) 0 9px no-repeat; } #mainMenu ul li ul { position: absolute; top: -999em; left: -999em; width: 200px; padding: 0; border: solid 1px #dadada; border-bottom: none; } #mainMenu ul li ul li { width: 100%; margin: 0; font-size: 1em; border-bottom: solid 1px #dadada; } #mainMenu ul li ul li a { width: 100%; display: block; float: none; padding: 0; } #mainMenu ul li ul li a span { display: block; padding: 2px 8px; } /* * * * * * 1. level * * * * * */ #mainMenu ul li.hover, #mainMenu ul li:hover { } #mainMenu ul li.hover a, #mainMenu ul li:hover a { background: url(../images/ikona_act.gif) 0 9px no-repeat; text-decoration:underline; color: #fcb02c; } /* * * * * * 2. level * * * * * */ #mainMenu ul li.hover ul li, #mainMenu ul li:hover ul li { background: white; } #mainMenu ul li.hover ul li a, #mainMenu ul li:hover ul li a { background: none; } #mainMenu ul li.hover ul li.hover, #mainMenu ul li:hover ul li:hover { background-color: #eee; } #mainMenu ul li.hover ul li.hover a, #mainMenu ul li:hover ul li:hover a { } /* * * * * * 3. level * * * * * */ #mainMenu ul li.hover ul li.hover ul li, #mainMenu ul li:hover ul li:hover ul li { } #mainMenu ul li.hover ul li.hover ul li a, #mainMenu ul li:hover ul li:hover ul li a { } #mainMenu ul li.hover ul li.hover ul li.hover, #mainMenu ul li:hover ul li:hover ul li:hover { } #mainMenu ul li.hover ul li.hover ul li.hover a, #mainMenu ul li:hover ul li:hover ul li:hover a { } /* * * * * * zobrazov�n� a skr�v�n� // showing and hiding * * * * * */ #mainMenu ul li.hover ul, #mainMenu ul li:hover ul { top: 36px; left: 0; } #mainMenu ul li.hover ul li.hover ul, #mainMenu ul li:hover ul li:hover ul, #mainMenu ul li.hover ul li.hover ul li.hover ul, #mainMenu ul li:hover ul li:hover ul li:hover ul { top: -1px; left: 200px; } #mainMenu ul li.hover ul ul, #mainMenu ul li:hover ul ul, #mainMenu ul li.hover ul li.hover ul ul, #mainMenu ul li:hover ul li:hover ul ul, #mainMenu ul li.hover ul li.hover ul li.hover ul ul, #mainMenu ul li:hover ul li:hover ul li:hover ul ul { left: -999em; } /* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */ /* * * * * * * * * * * * * * * SLOUPCOV� V�CI * * * * * * * * * * * * * * */ /* * * * * * * * * * * * * * * COLUMNS STYLES * * * * * * * * * * * * * * */ /* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */ /* * * * * * sloupcov� boxy - col boxes * * * * * */ .sloupec_box { margin: 0 0 13px; background: url(../images/design/bg_sloupec.gif) 0 bottom no-repeat; } .sloupec_box_cont { } #produkty_col { background: none; } .sloupec_box h3 { background: url(../images/design/hlavicka.gif) 0 0 no-repeat #dfdfdf; margin: 0 0 0px; font-size: 1.25em; font-weight: bold; color: #3a127a; padding: 18px 0 16px 10px; } /* * * * * * navi menu * * * * * */ #naviMenu { width: 100%; } #naviMenu ul { width: 100%; margin: 0; padding: 5px 0; background: #e7eff7; } #naviMenu ul:after { display: block; clear: both; content: " "; } #naviMenu ul li { position: relative; float: left; width: 100%; padding: 0; font-weight: bold; background: none; } #naviMenu ul li a { display: block; width: 100%; text-decoration: none; border-bottom: solid 1px white; color: black; } #naviMenu ul li.last a { border-bottom: none; } #naviMenu ul li a span { display: block; padding: 6px 16px 5px; } #naviMenu ul li ul { position: absolute; top: -999em; left: -999em; width: 200px; padding: 0; border: solid 1px #dadada; border-bottom: none; } #naviMenu ul li ul li { width: 100%; margin: 0; font-size: 1em; border-bottom: solid 1px #dadada; } #naviMenu ul li ul li a { width: 100%; display: block; float: none; padding: 0; border-bottom: none; } #naviMenu ul li ul li a span { display: block; padding: 6px 8px 5px; } /* * * * * * 1. level * * * * * */ #naviMenu ul li.active, #naviMenu ul li.hover, #naviMenu ul li:hover { background: #ceddec; } #naviMenu ul li.active a, #naviMenu ul li.hover a, #naviMenu ul li:hover a { } /* * * * * * 2. level * * * * * */ #naviMenu ul li.hover ul li, #naviMenu ul li:hover ul li { background: white; } #naviMenu ul li.hover ul li a, #naviMenu ul li:hover ul li a { background: none; } #naviMenu ul li:hover ul li.active, #naviMenu ul li.hover ul li.active, #naviMenu ul li.hover ul li.hover, #naviMenu ul li:hover ul li:hover { background-color: #eee; } /* * * * * * 3. level * * * * * */ #naviMenu ul li.hover ul li.hover ul li, #naviMenu ul li:hover ul li:hover ul li { } #naviMenu ul li.hover ul li.hover ul li.hover, #naviMenu ul li:hover ul li:hover ul li:hover { } /* * * * * * zobrazov�n� a skr�v�n� // showing and hiding * * * * * */ #naviMenu ul li.hover ul, #naviMenu ul li:hover ul { top: -1px; left: 210px; } #naviMenu ul li.hover ul li.hover ul, #naviMenu ul li:hover ul li:hover ul, #naviMenu ul li.hover ul li.hover ul li.hover ul, #naviMenu ul li:hover ul li:hover ul li:hover ul { left: 200px; } #naviMenu ul li.hover ul ul, #naviMenu ul li:hover ul ul, #naviMenu ul li.hover ul li.hover ul ul, #naviMenu ul li:hover ul li:hover ul ul, #naviMenu ul li.hover ul li.hover ul li.hover ul ul, #naviMenu ul li:hover ul li:hover ul li:hover ul ul { left: -999em; } /* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */ /* * * * * * * * * * * * * * * CENTR�LN� V�CI * * * * * * * * * * * * * * */ /* * * * * * * * * * * * * * * CENTRAL STYLES * * * * * * * * * * * * * * */ /* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */ /* * * * * * control box * * * * * */ p.control_box { margin: 0 0 1em; padding: 5px 5px; border: solid 1px #e2e2e2; line-height: normal; background: #ebebeb url(../images/design/control_box.gif) 0 100% repeat-x; } p.control_box span.control_box_upravit { float: right; } /* * * * * * crumb trail * * * * * */ p#navigace { width: 100%; margin: 0 0 1em; } p#navigace a.back { float: right; margin: 0 0 0 15px; } /* * * * * * odkazy tisk, atp. / print link, send to email etc. * * * * * */ p.odkazy:before { display: block; clear: both; content: " "; } p.odkazy { display: block; clear: both; width: 100%; margin: 2em 0 1em; text-align: right; } p.odkazy a { margin-left: 5px; text-decoration: none; } p.odkazy a span { text-decoration: underline; } p.odkazy a:hover span { text-decoration: none; } p.odkazy a img { position: relative; top: 2px; margin-right: 2px; } /**************************************************************************************/ .homepage a.more { float: right; } /* * * * * * kontaktn� formul�� / contact form * * * * * */ #contact_form { } #contact_form form { margin: 2em 0 0; position: relative; } #contact_form .obalka { position: absolute; top: -24px; right: -10px; width: 111px; height: 80px; background: url(../images/design/obalka.gif) 0 0 no-repeat; } #contact_form fieldset { margin: 0; padding: 1em 115px 1em 1em; } #contact_form fieldset p { text-align: left; } #contact_form fieldset p label { display: block; padding: 0 0 2px; } #contact_form fieldset p.il label { display: inline; } #contact_form fieldset p.left { float: left; width: 45%; margin-top: 0; } #contact_form fieldset p.right { float: right; width: 45%; margin-top: 0; } #contact_form fieldset p.popis { width: 99%; clear: both; margin-top: 0; } #contact_form fieldset p.left input, #contact_form fieldset p.right input { width: 96%; } #contact_form fieldset p.popis textarea { width: 99%; } #contact_form fieldset p.poznamka { margin: 0; clear:both; } #contact_form fieldset p.submit { margin-bottom: 0; } p.hilite { background: #fffcd2; } input.error, textarea.error { border: solid 1px #DE0000; } .error_msg { color: #DE0000; } div.error, p.error { margin-bottom: 15px; padding: 11px 11px 11px 70px; border: 1px solid #de0000; color: #de0000; background: #fbfbfb url(../images/design/alert.gif) no-repeat 10px 50%; } div.success, p.success { margin-bottom: 15px; padding: 11px 11px 11px 70px; border: 1px solid #5f8a0f; color: #51750D; background: #fbfbfb url(../images/design/succes.gif) no-repeat 10px 50%; } .do_kosiku div.success, #guestbook p.success { background-position: 10px 10%; }