/* ========================= G L O B A L ============================================================================ */ body { margin: 0; padding: 0 0 10px; background: #fff; text-align: center; } body, td, input, textarea, select { font: 62.5% "Lucida Grande", "Helvetica CE", Verdana, lucida, sans-serif; } img, fieldset { border: 0 solid; } h6, h5, h4, h3, h2, h1, p, ul, ol, li, dl, dd, dt, form, fieldset, input, select, textarea { margin: 0; padding: 0; } /* ................................................................................................................... */ a:link { color: #c00; } a:visited { color: #c00; } a:hover { color: #000; } /* ................................................................................................................... */ .clr { clear: both; height: 1px; font-size: 1px; overflow: hidden; } .fl { float: left; clear: left; } .fr { float: right; clear: right; } .cl { clear: left; } .cr { clear: right; } .ac { text-align: center; } .ar { text-align: right; } /* ................................................................................................................... */ .h { margin: 0 0 .5em; } .s { margin: 0 0 1em; } .sh { margin: 0 0 1.5em; } .d { margin: 0 0 2em; } .t { margin: 0 0 3em; } /* ................................................................................................................... */ /* skryte prvky */ hr { display: none; } .hidden { position: absolute; top: -1000px; } /* =================================================================================================================== */ /* layout */ #page { width: 760px; margin: 0 auto; text-align: left; } #main { padding: 6px 0; } #main #content { float: left; width: 520px; } /* title */ #main #menu { float: right; width: 220px; } #title #content { float: none; width: 760px; } #title #content .box-wide { float: left; width: 377px; } #title #content .box-narrow { float: right; width: 186px; margin: 0 0 0 5px; } #title #content h2 { margin: 0 0 0.5em; padding: 6px 15px 0; height: 19px; font-size: 1.2em; color: #c90000; border: none; } #title #content .box-wide h2 { background: url(images/bg-title-h2-wide.gif) no-repeat; } #title #content .box-narrow h2 { background: url(images/bg-title-h2-narrow.gif) no-repeat; } /* ................................................................................................................... */ /* header */ #header { height: 60px; } #header #logo a { display: block; width: 186px; height: 60px; background: url(images/digitalni-svet.gif); } #header #logo a span { position: absolute; top: -1000px; } #header #services { float: right; padding: 38px 0 0; } #header #services a { color: #666; text-decoration: none; padding: 0 0 0 12px; font-size: 1.1em; display: block; float: left } #header #services a:hover { color: #222; text-decoration: underline; } #header #services img { vertical-align: bottom; margin: 0 3px 0 0; } /* ................................................................................................................... */ /* sections */ #sections { height: 50px; background: url(images/bg-sections.gif); font-family: "Helvetica CE", helvetica, arial, lucida, sans-serif; } #sections ul { list-style-type: none; font-size: 1.2em; } #sections li { float: left; height: 50px; background: url(images/bg-sections-separ.gif) no-repeat right; text-align: center; } #sections li.last { background: none; } #sections li a { float: left; padding: 5px 22px 0 20px; text-decoration: none; font-weight: bold; line-height: 175%; } * html #sections li a { padding: 3px 22px 0 20px; line-height: 185%; } #sections li a#sect-01 { color: #7ec028; } #sections li a#sect-02 { color: #f29a15; } #sections li a#sect-03 { color: #b91d6e; } #sections li a#sect-04 { color: #0087af; } #sections li a span { font-weight: normal; font-size: 0.85em; color: #666; } #sections li a:hover span { color: #000; } #sections li.active a span { color: #000; } /* ................................................................................................................... */ /* separators - color schemes */ .separ { height: 12px; overflow: hidden; clear: both; } .sect-00 .separ { background: url(images/bg-separ.gif) #ebebeb; } .sect-01 .separ { background: url(images/bg-separ.gif) #8ac52b; } .sect-02 .separ { background: url(images/bg-separ.gif) #f29a15; } .sect-03 .separ { background: url(images/bg-separ.gif) #b91d6e; } .sect-04 .separ { background: url(images/bg-separ.gif) #0087af; } #montage { position: relative; } #montage #ruka { position: absolute; top: 257px; left: 642px; width: 63px; height: 39px; background: url(images/ruka.jpg); z-index: 100; } #montage img { padding: 1px; border: 1px #dcdcdc solid; display: block; } /* ................................................................................................................... */ /* menu header */ #menu h3 { font-size: 1.2em; padding: 7px 0 5px 22px; font-family: "Helvetica CE", helvetica, arial, lucida, sans-serif; } .sect-00 #menu h3 { background: url(images/bg-diagonal.gif) #f6e2e4; color: #c90000; } .sect-01 #menu h3 { background: url(images/bg-diagonal.gif) #f3f9e9; color: #7ec028; } .sect-02 #menu h3 { background: url(images/bg-diagonal.gif) #fef5e7; color: #f29a15; } .sect-03 #menu h3 { background: url(images/bg-diagonal.gif) #f8e8f0; color: #b91d6e; } .sect-04 #menu h3 { background: url(images/bg-diagonal.gif) #e5f3f7; color: #0087af; } /* menu */ #menu ul { list-style-type: none; float: left; } #menu li { width: 220px; float: left; } #menu li a { float: left; width: 193px; height: 19px; padding: 5px 5px 0 22px; text-decoration: none; color: #444; font-weight: bold; font-size: 1.1em; } * html #menu li a { width: 220px; height: 24px; w\idth: 193px; he\ight: 19px; } /* submenu */ #main #menu li li a, #main #menu li.active li a { width: 176px; height: auto; padding: 6px 7px 5px 37px; font-weight: normal; color: #444; background: url(images/bg-submenu.gif) no-repeat #efefef; border-bottom: 1px solid #b5b9ba; } * html #main #menu li.active li a, * html #main #menu li li a { width: 220px; w\idth: 176px; } /* active & hover */ #menu li.active a { color: #fff; } #main #menu li li.active a { background: url(images/bg-submenu-active.gif) no-repeat #efefef; color: #000; text-decoration: underline } #menu li a:hover { color: #000; text-decoration: underline; } /* color schemes */ .sect-00 #menu li a { background: url(images/bg-menu-00.gif); } .sect-00 #menu li.active a { background: url(images/bg-menu-active-00.gif); } .sect-01 #menu li a { background: url(images/bg-menu-01.gif); } .sect-01 #menu li.active a { background: url(images/bg-menu-active-01.gif); } .sect-02 #menu li a { background: url(images/bg-menu-02.gif); } .sect-02 #menu li.active a { background: url(images/bg-menu-active-02.gif); } .sect-03 #menu li a { background: url(images/bg-menu-03.gif); } .sect-03 #menu li.active a { background: url(images/bg-menu-active-03.gif); } .sect-04 #menu li a { background: url(images/bg-menu-04.gif); } .sect-04 #menu li.active a { background: url(images/bg-menu-active-04.gif); } /* ................................................................................................................... */ /* foot */ #foot { background: url(images/bg-foot.gif) no-repeat; height: 21px; padding: 5px 7px 0; } #foot p { padding-top: 1px; color: #777; font-size: 1.1em; font-family: "Helvetica CE", helvetica, arial, lucida, sans-serif; } #foot p a { color: #777; } #foot p a:hover { color: #000; } #foot h4 { float: right; margin-left: 4px; } #foot h4 a { display: block; width: 80px; height: 15px; } #foot h4 a#xhtml { background: url(images/valid-xhtml.gif); } #foot h4 a#css { background: url(images/valid-css.gif); } #foot h4 a#xhtml:hover, #foot h4 a#css:hover { background-position: 0 15px; } #foot h4 a span { display: none; } /* ................................................................................................................... */ /* partners */ #partners { padding: 5px 0 0; color: #aaa; } #partners a { color: #aaa; } #partners a:hover { color: #000; } /* =================================================================================================================== */ /* CONTENT */ #content { color: #333; } #content h1 { margin: 0 0 0.7em; font-size: 1.7em; font-family: "Helvetica CE", helvetica, arial, lucida, sans-serif; } .sect-00 #content h1 { color: #c90000; } .sect-01 #content h1 { color: #7ec028; } .sect-02 #content h1 { color: #f29a15; } .sect-03 #content h1 { color: #b91d6e; } .sect-04 #content h1 { color: #0087af; } #content h2 { margin: 0 0 0.3em; color: #000; font-size: 1.4em; padding: 0 0 0.2em; } .sect-00 #content h2, #content h2.sect-00 { border-bottom: 1px solid #535353; } .sect-01 #content h2, #content h2.sect-01 { border-bottom: 1px solid #7ec028; } .sect-02 #content h2, #content h2.sect-02 { border-bottom: 1px solid #f29a15; } .sect-03 #content h2, #content h2.sect-03 { border-bottom: 1px solid #b91d6e; } .sect-04 #content h2, #content h2.sect-04 { border-bottom: 1px solid #0087af; } #content h3 { margin: 0 0 0.3em; color: #000; font-size: 1.2em; } #content p { font-size: 1.2em; line-height: 160%; } #content strong { color: #151515; } #content a { font-weight: bold; } /* ------------- pouze pro aplikace, psalo ddt ---------- */ #content p.comment { font-size: 1em; color: #555; } #content p a.aplikace { color: #151515; font-weight: bold; } #content p a.aplikace:hover { color: #f29a15; font-weight: bold; } /* ------------------------------------------------------ */ #content ul { list-style-type: none; } #content li { padding: 0 0 0 20px; font-size: 1.2em; margin: 0 0 0.3em 10px; line-height: 150%; } #content ul ul { padding: 0.3em 0 0; } #content li li { font-size: 1em; margin: 0 0 0.3em; color: #000; line-height: 150%; } #content ul.fl { width: 170px; float: left; clear: none } #content .alert { color: #d00;} .sect-00 #content li, #content .sect-00 li { background: url(images/bg-li-00.gif) no-repeat 0 4px; } .sect-01 #content li, #content .sect-01 li, .sect-01 #content li { background: url(images/bg-li-01.gif) no-repeat 0 4px; } .sect-02 #content li, #content .sect-02 li { background: url(images/bg-li-02.gif) no-repeat 0 4px; } .sect-03 #content li, #content .sect-03 li { background: url(images/bg-li-03.gif) no-repeat 0 4px; } .sect-04 #content li, #content .sect-04 li { background: url(images/bg-li-04.gif) no-repeat 0 4px; } #content dl { font-size: 1.2em; padding: 0.3em 0.5em 0.1em; margin-top: 0.5em; color: #000; background: #ffffff; line-height: 120%; } #content dt { float: left; margin-bottom: -100px; } /* solves MSIE 3px bug */ #content dd { margin-left: 160px; margin-bottom: 0.3em; } #content #pricelist dl { font-size: 1.1em; padding: 0.3em 0.5em 0.1em; margin-top: 0.5em; color: #000; line-height: 150%; font-style: italic; } #content #pricelist dt { float: left; margin-bottom: -100px; } /* solves MSIE 3px bug */ #content #pricelist dd { margin-left: 260px; font-weight: bold; text-align: right; margin-bottom: 0.3em; } #content .box { background: #caf6ff; border: 1px solid #7bdeff; padding: 0.6em; } #content .box p { font-size: 1.1em; line-height: 150%; color: #000;} #content .il { float: left; clear: left; } #content .ir { float: right; clear: right; } .sect-04 #content .ib { border: 5px solid #caf6ff; margin: 0 0 1em 1em;} /* ==== TO DO ====== */ .sect-00 #content dl { background: #fff; } .sect-01 #content dl { background: #e7fac9; } .sect-02 #content dl { background: #e7fac9; } .sect-03 #content dl { background: #e7fac9; } .sect-04 #content dl { background: #e7fac9; } #content p.path { text-align: right; margin: 0 0 2em; } #content p.small { font-size: 1.1em; } #content .cena { font-weight: bold; font-style: italic; white-space: nowrap; } /* skok nahoru */ #content p.top { text-align: right; font-size: 1.1em; } #content p.top a { text-decoration: none; color: #aaa; } #content p.top a:hover { text-decoration: underline; color: #000; } #content p.top img { vertical-align: bottom; } /* tabulka */ #content table { margin: 0 0 1em; width: 100%; font-size: 1.8em; background: #FFF; border: solid 1px #f29a15; border-width: 1px; } #content table td { padding: 0.2em; border: solid 1px #f29a15; border-width: 1px; } #content table td.top { background: #CCC; font-weight: bold; } /* formular v kontaktech */ #content form { margin: 0 0 1em; font-size: 1.2em; } #content form fieldset { padding: 1em 0.5em; border: 1px solid #DFDFDF; background: #F6F4F3; } #content form label { display: block; float: left; clear: left; width: 140px; margin: 0 10px 5px 0; padding: 0.2em 0 0; text-align: right; } #content form input, #content form textarea { margin-bottom: 5px; padding: 2px; background: #fff; border: 1px solid #a9a9a9; font-size: 100%; } #content form input:focus, #content form textarea:focus{ background: #F7F9E1; } #content form #submit input { margin: 1em 0 0 150px; border: 1px solid #4A4C00; background: #F7F9E1; font-size: 100%; font-weight: bold; } /* =================================================================================================================== */