/* general */

* {
margin: 0;
padding: 0;
border: 0;
}

body {
font-family: Arial, Verdana, Helvetica, sans-serif;
font-size: 75%;
color: white;
background: #010101;
height: 100%;
text-align: center;
}

a {
color: #ffc601; 
text-decoration: underline;
} 

a:visited {
color: black; 
}

a:hover, a:active, a:focus {
color: white; 
}

h1  {
color: #ffc601; 
font-size: 150%;
font-weight: normal;
margin-bottom: 15px;
}

h2 {
font-size: 120%;
font-weight: bold;
color: white;
margin: 30px 0 15px;
}

h3 {
font-size: 120%;
color: #ffc601; 
font-weight: normal;
margin: 0 0 20px 0;
}

h3#webstranky {
height: 30px;
line-height: 30px;
padding-left: 40px;
background: url("../grafika/webove-stranky.png") no-repeat center left;
}

h3#eshopy {
height: 30px;
line-height: 30px;
padding-left: 40px;
background: url("../grafika/eshopy.png") no-repeat center left;
}

h3#grafik {
height: 30px;
line-height: 30px;
padding-left: 40px;
background: url("../grafika/uzita-grafika.png") no-repeat center left;
}

h3#spol {
height: 30px;
line-height: 30px;
padding-left: 40px;
background: url("../grafika/externi-spoluprace.png") no-repeat center left;
}

h4 {
color: black; 
font-size: 100%;
margin: 20px 0 10px;
}

h5 {
font-size: 100%;
font-weight: bold;
color: #46a1bc; 
margin: 20px 0 10px 0;
}

h6 {
font-size: 90%;
font-weight: bold;
color: black; 
margin: 10px 0 10px 0;
}

p {
margin-bottom: 15px;
line-height: 150%;
}

ul, ol {
margin: 10px 0;
line-height: 140%;
}

li, ol ul li {
margin-left: 30px;
list-style: disc;
padding: 7px 0;
}

ol li {
list-style: decimal;
padding: 7px 0;
}


.cistic {
=height: 1px;
=width: 1px;
=font-size: 1px;
=line-height: 1px;
=margin: -1px -1px 0 0;
clear: both;
}

input, textarea, select {
font-family: Arial, Verdana, Helvetica, sans-serif;
font-size: 100%;
background: white;
color: black;
padding: 3px;
border: 1px solid #bbbbbb;
}

select {
border: 1px solid #939393;
padding: 2px;
}

option {
padding-right: 10px;
}

table {
width: 100%;
border-collapse: collapse;
}

th {
padding: 5px 7px;
font-size: 90%;
color: black;
}

td {
border: 1px solid #872268;
padding: 5px 7px;
background: #a20f78;
}

table.cenik {
margin-top: 20px;
}

table.cenik th {
font-size: 100%;
padding: 10px 12px;
border: 1px solid #872268;
background: #5f0655;
color: #ffc601;
font-weight: normal;
}

table.cenik th.cena {
font-size: 90%;
}

th.cena, td.cena {
width: 85px;
}

table.cenik td {
padding: 10px 12px;
}

tr.sudy td {
background: #9c0d73;
}

td.nobg, tr.sudy td.nobg {
background: none;
border: 0;
}

address {
line-height: 160%;
font-style: normal;
font-size: 120%;
}

.strong {
font-weight: bold;
}

.small {
font-size: 90%;
font-style: normal;
}

.pink {
color: #dc83b4;
}

.black {
color: black;
}

.white {
color: white;
}

.yellow {
color: #ffc601 !important; 
}

.ruzova {
color: #dd027b;
}


/***************** layout *************/

#obal {
background: #a82e9c url("../grafika/bg3.jpg") center top;
}

#srafovani {
background: url("../grafika/bg.jpg") center top repeat-x;
}

#pozadi {
background: url("../grafika/top.jpg") center top no-repeat ;
}

#main {
width: 986px;
padding-bottom: 172px;
text-align: left;
background: url("../grafika/top.jpg") center top no-repeat ;
margin: 0 auto;
}

#top {
width: 644px;
height: 192px;
padding: 31px 0 0 342px;
float: left;
position: relative;
}

#logo {
width: 162px;
height: 75px;
font-size: 150%;
color: #ffc601;
text-transform: uppercase;
overflow: hidden;
position: absolute;
top: 43px;
left: 76px;
margin: 0;
}

#logo a, #logo span {
width: 162px;
height: 75px;
display: block;
background: url("../grafika/bajola-webdesign-grafika.jpg");
position: absolute;
top: 0;
left: 0;
}

#logo a {
cursor: hand;
}

ul#menu { 
height: 90px; 
margin: 0;
padding: 0;
font-size: 120%;
}

ul#menu li {
height: 90px;
margin: 0 45px 0 0;
padding: 0;
list-style: none;
text-align: center;
overflow: hidden;
position: relative;
float: left;
}

li#jedna {
width: 106px;
}

li#dva {
width: 84px;
}

li#tri {
width: 124px;
}

li#ctyri {
width: 54px; 
}

ul#menu li#pet {
width: 38px;
margin: 0;
}

ul#menu a, ul#menu a:visited, ul#menu li span {
color: #ffc601;
text-decoration: none;
padding-bottom: 22px;
display: block;
position: absolute;
top: 40px;
left: 0;
background: url("../grafika/menu.png") no-repeat bottom center;
}

ul#menu a:hover, ul#menu a:active, ul#menu a:focus,
ul#menu li span {
color: white;
background: url("../grafika/menu2.png") no-repeat bottom center;
}

a#kontakt, a#kontakt:visited {
width: 78px;
height: 31px;
line-height: 31px;
color: white;
text-decoration: none;
text-align: center;
background: #bd057b url("../grafika/kontakt.jpg");
position: absolute;
top: 0;
right: 26px;
}

a#kontakt:hover, a#kontakt:active, a#kontakt:focus {
color: #42053c;
background: #cf7e2b url("../grafika/kontakt2.jpg");
}


/*** obsah ***/

.box, .box2 {
width: 986px;
padding-bottom: 15px;
margin-bottom: 5px;
background: url("../grafika/stin.png") no-repeat bottom right;
float: left;
position: relative;
}

.box2 {
padding-bottom: 58px;
}

h2#portfolio {
width: 69px;
height: 207px;
line-height: 207px;
margin: 0;
padding: 0 0 0 10px;
float: left;
overflow: hidden;
position: relative;
}

h2#portfolio span {
width: 79px;
height: 207px;
position: absolute;
background: url("../grafika/portfolio.png");
top: 0;
left: 0;
}

h2.nadpis, #webdesign, #grafika, #spoluprace {
width: 69px;
height: 209px;
line-height: 209px;
overflow: hidden;
margin: 0;
padding: 0 0 0 10px;
float: left;
position: relative;
}

h2#sluzby span {
width: 79px;
height: 209px;
position: absolute;
background: url("../grafika/sluzby.png");
top: 0;
left: 0;
}

h2#omne span {
width: 79px;
height: 209px;
position: absolute;
background: url("../grafika/o-mne.png");
top: 0;
left: 0;
}

h2#kont span {
width: 79px;
height: 209px;
position: absolute;
background: url("../grafika/kontakt.png");
top: 0;
left: 0;
}

h2#weby span {
width: 79px;
height: 209px;
position: absolute;
background: url("../grafika/weby.png");
top: 0;
left: 0;
}

h2#eshopy span {
width: 79px;
height: 209px;
position: absolute;
background: url("../grafika/eshop.png");
top: 0;
left: 0;
}

h2#jvs span {
width: 79px;
height: 209px;
position: absolute;
background: url("../grafika/corporate.png");
top: 0;
left: 0;
}

h2#loga span {
width: 79px;
height: 209px;
position: absolute;
background: url("../grafika/loga.png");
top: 0;
left: 0;
}

h2#ceny span {
width: 79px;
height: 209px;
position: absolute;
background: url("../grafika/ceny.png");
top: 0;
left: 0;
}

h2#cenova-poptavka span {
width: 79px;
height: 209px;
position: absolute;
background: url("../grafika/cenova-poptavka.png");
top: 0;
left: 0;
}

h2#grafika span, #grafika span, #spoluprace span {
width: 79px;
height: 209px;
position: absolute;
background: url("../grafika/grafika.png");
top: 0;
left: 0;
}

#webdesign span {
width: 79px;
height: 209px;
position: absolute;
background: url("../grafika/webdesign.png");
top: 0;
left: 0;
}

#spoluprace span {
background: url("../grafika/spoluprace.png");
}

#inner {
width: 863px;
height: 177px;
padding: 30px 0 0 30px;
overflow: hidden;
background: url("../grafika/boxtop.jpg");
float: left;
}

.vnitrni {
width: 863px;
height: 189px;
padding: 20px 0 0 30px;
overflow: hidden;
background: url("../grafika/box.png");
float: left;
}

.top, .top2 {
width: 893px;
height: 30px;
background: url("../grafika/top2.png");
float: left;
}

.innerbox, .innerbox3 {
width: 893px;
background: url("../grafika/bg4.jpg") repeat-y;
float: left;
}

.innerbox2, .innerbox4 {
width: 823px;
padding: 0 30px 5px 40px;
min-height: 175px;
_height: 175px;
background: url("../grafika/box2.jpg") no-repeat;
float: left;
}

.bottom, .bottom2 {
width: 893px;
height: 20px;
padding-right: 14px;
background: url("../grafika/bottom.png") no-repeat;
float: right;
}

.top2 {
background: url("../grafika/top3.png");
}

.innerbox3 {
background: url("../grafika/bg5.jpg");
}

.innerbox4 {
padding: 0 30px 5px 40px;
min-height: 275px;
_height: 275px;
background: url("../grafika/box3.jpg") no-repeat;
}

.bottom2 {
background: url("../grafika/bottom2.png") no-repeat;
}

/* strankovani */

#slider ul, #slider li,
#slider2 ul, #slider2 li,
#slider3 ul, #slider3 li,
#slider4 ul, #slider4 li,
#slider5 ul, #slider5 li {
margin: 0;
padding: 0;
list-style: none;
}

#slider li, #slider2 li, #slider3 li, #slider4 li, #slider5 li { 
width: 823px;
height: 340px;
overflow: hidden; 
}

#controls, #controls2, #controls3, #controls4, #controls5 {
width: 879px;
height: 33px;
padding: 11px 14px 0 0;
font-size: 120%;
text-align: right;
background: url("../grafika/strankovani.jpg") no-repeat;
position: absolute;
bottom: -44px;
left: 0;
}

#controls {
background: url("../grafika/strankovani2.jpg") no-repeat;
}

#controls a, #controls a:visited,
#controls2 a, #controls2 a:visited,
#controls3 a, #controls3 a:visited,
#controls4 a, #controls4 a:visited,
#controls5 a, #controls5 a:visited, {
color: #f8ba07;
text-decoration: none;
}

#controls a:hover, #controls a:active, #controls a:focus,
#controls2 a:hover, #controls2 a:active, #controls2 a:focus,
#controls3 a:hover, #controls3 a:active, #controls3 a:focus,
#controls4 a:hover, #controls4 a:active, #controls4 a:focus,
#controls5 a:hover, #controls5 a:active, #controls5 a:focus, {
color: white;
}

.controls {
display: none;
}

span#prevBtn, span#nextBtn,
span#prevBtn2, span#nextBtn2,
span#prevBtn3, span#nextBtn3,
span#prevBtn4, span#nextBtn4,
span#prevBtn5, span#nextBtn5 {
width: 100px;
display: inline-block;

}

.prev, a#prevBtn,
a#prevBtn2,
a#prevBtn3,
a#prevBtn4,
a#prevBtn5 {
height: 22px;
line-height: 22px;
padding: 0 20px 0 30px;
background: url("../grafika/prev.jpg") no-repeat center left;
display: inline-block;
}

.next, a#nextBtn,
a#nextBtn2,
a#nextBtn3,
a#nextBtn4,
a#nextBtn5 {
height: 22px;
line-height: 22px;
padding: 0 30px 0 20px;
background: url("../grafika/next.jpg") no-repeat center right;
display: inline-block;
}

.innerbox {
 position: relative;
}

.innerbox a#nextBtn, .innerbox a#prevBtn,
.innerbox a#nextBtn2, .innerbox a#prevBtn2,
.innerbox a#nextBtn3, .innerbox a#prevBtn3,
.innerbox a#nextBtn4, .innerbox a#prevBtn4,
.innerbox a#nextBtn5, .innerbox a#prevBtn5 {
text-decoration: none;
margin: 0;
}

.oddelovac {
height: 22px;
width: 2px;
background: url("../grafika/oddelovac.jpg");
display: inline-block;
}

#inner a {
display: block;
padding-bottom: 10px;
background: url("../grafika/stin2.png") bottom center no-repeat;
float: left;
}

.innerbox a {
display: block;
margin: 0 32px 10px 0;
padding-bottom: 14px;
background: url("../grafika/stin1.jpg") bottom center no-repeat;
float: left;
}

.innerbox .secondline a {
background: url("../grafika/stin2.jpg") bottom center no-repeat;
margin-bottom: 0;
}

#inner a img, #inner a:visited img, .innerbox a img, .innerbox a:visited img {
border: 1px solid #610b48;
}

#inner a:hover img, #inner a:active img, #inner a:focus img,
.innerbox a:hover img, .innerbox a:active img, .innerbox a:focus img {
border: 1px solid #dd037b;
}

#inner a.posledni, .innerbox a.posledni {
margin: 0;
}

#vice {
width: 30px;
height: 97px;
overflow: hidden;
position: absolute;
top: 53px;
right: 0;
}

#vice a, #vice a:visited {
width: 30px;
height: 97px;
background: #9d0a70 url("../grafika/vice.jpg");
padding: 0;
margin: 0;
float: none;
display: block;
position: absolute;
top: 0;
right: 0;
}

#vice a:hover, #vice a:active, #vice a:focus {
background: #880861 url("../grafika/vice2.jpg");
}

hr {
display: none;
}

.hr {
height: 1px;
background: url("../grafika/hr.png") repeat-x;
margin: 20px 0;
}

#contact {
width: 986px;
padding-bottom: 15px;
background: url("../grafika/stin.png") no-repeat bottom right;
text-align: left;
color: white;
position: absolute;
top: -172px;
left: 0;
}

a#nahoru, a#nahoru:visited {
width: 78px;
height: 31px;
line-height: 31px;
color: white !important;
text-decoration: none;
text-align: center;
background: #bd057b url("../grafika/nahoru.jpg");
position: absolute;
bottom: 15px;
_bottom: 0;
right: 31px;
}

a#nahoru:hover, a#nahoru:active, a#nahoru:focus {
color: #42053c !important;
background: #cf7e2b url("../grafika/nahoru2.jpg");
}

.chlivek {
width: 168px;
padding-right: 20px;
float: left;
background: url("../grafika/cara.jpg") no-repeat top right;
}

.chlivek2 {
width: 168px;
padding: 0 20px 0 30px;
float: left;
background: url("../grafika/cara.jpg") no-repeat top right;
}

.chlivek h3 a, .chlivek2 h3 a {
color: #ffc601; 
}

.chlivek h3 a:visited, .chlivek2 h3 a:visited {
color: #c0749e;
}

.chlivek h3 a:hover, .chlivek h3 a:active, .chlivek h3 a:focus,
.chlivek2 h3 a:hover, .chlivek2 h3 a:active, .chlivek2 h3 a:focus {
color: white; 
}

.chlivek3 {
width: 195px;
padding-right: 20px;
float: left;
background: url("../grafika/cara.jpg") no-repeat top right;
}

.chlivek4 {
width: 235px;
padding: 0 20px 0 30px;
float: left;
background: url("../grafika/cara.jpg") no-repeat top right;
}

.chlivek5 {
width: 295px;
padding: 0 20px 0 30px;
float: left;
}

.bezcary {
background: none;
}

#big {
width: 500px;
padding-left: 18px;
font-size: 140%;
background: url("../grafika/quote.png") no-repeat 0 10px;
line-height: 150%;
}

blockquote#big div {
background: url("../grafika/quote2.png") no-repeat right 80px;
}

#bigger {
padding-left: 18px;
font-size: 120%;
background: url("../grafika/quote3.png") no-repeat 0 10px;
line-height: 150%;
}

blockquote#bigger div {
width: 600px;
background: url("../grafika/quote4.png") no-repeat right top;
}

.padding {
width: 833px;
padding-right: 30px;
background: url("../grafika/bubliny.png");
}

#poptavka {
margin-top: 10px;
padding: 3px 0 0 32px;
line-height: 180%;
background: url("../grafika/poptavka.png") no-repeat top left;
}

#paticka #contact a {
font-size: 100%;
color: #ffc601;
padding: 0;
border-right: 0;
}


#paticka #contact a:visited {
color: #cb87c5; 
}

#paticka #contact a:hover, #paticka #contact a:active, #paticka #contact a:focus {
color: white; 
}

p.vetsi {
line-height: 250%;
}

#paticka #contact #poptavka a {
font-size: 140%;
}

/*** textove stranky  ***/

.vlevo {
width: 593px;
padding-right: 30px;
float: left;
}

.vpravo {
width: 170px;
float: right;
}

.vpravo ul {
margin: 0;
padding: 0;
}

.vpravo ul li {
margin: 0;
padding: 0 0 20px 15px;
background: url("../grafika/bullet.png") no-repeat 0 5px;
list-style: none;
}

.vpravo ul li a, .vpravo ul li a:visited {
color: #ffc601; 
}

.vpravo ul li a:hover, .vpravo ul li a:active, .vpravo ul li a:focus {
color: white;
}

.vlevo h2, .vlevo h3#cenik, .vlevo h3#zadost {
height: 32px;
line-height: 32px;
color: #ffc601; 
font-size: 150%;
padding-left: 45px;
font-weight: normal;
margin: 40px 0 15px;
background: url("../grafika/webove-stranky.png") no-repeat center left;
}

.vlevo h3#cenik {
background: url("../grafika/cenik.png") no-repeat center left;
margin: 0;
}

.vlevo h3#zadost {
padding-left: 35px;
background: url("../grafika/poptavka.png") no-repeat center left;
margin: 0 0 25px;
}

h2#eshops {
background: url("../grafika/eshopy.png") no-repeat center left;
}

h2#redesign-webovych-stranek, h2#neverejne-portfolio {
background: url("../grafika/redesign.png") no-repeat center left;
}

h2#staticky-dynamicky-web {
background: url("../grafika/staticky.png") no-repeat center left;
}

h2#administracni-system {
background: url("../grafika/admin.png") no-repeat center left;
}

h2#zakladni-sluzby {
background: url("../grafika/sluzby2.png") no-repeat center left;
}

h2#standardy-zasady, h2#proc-spolupracovat {
background: url("../grafika/standardy.png") no-repeat center left;
}

h2#postup-tvorbe-webu, h2#postup {
background: url("../grafika/postup.png") no-repeat center left;
}

h2#nabizim {
background: url("../grafika/nabizim.png") no-repeat center left;
}

h2#sprava-webovych-stranek {
background: url("../grafika/sprava.png") no-repeat center left;
}

h2#registrace-katalogu-vyhledavacu {
background: url("../grafika/registrace.png") no-repeat center left;
}

h2#uzita-grafika {
background: url("../grafika/uzita-grafika.png") no-repeat center left;
}

h2#corporate-design {
background: url("../grafika/corporate-design.png") no-repeat center left;
height: 36px;
}

h2#externi {
background: url("../grafika/externi-spoluprace.png") no-repeat center left;
}

h2#znalosti {
background: url("../grafika/znalosti.png") no-repeat center left;
}

.vpravo h2 {
color: #dd037b; 
font-size: 150%;
font-weight: normal;
margin: 0 0 25px;
}

.first {
margin-top: 0 !important;
}

.odskok {
padding-left: 45px;
}

p.info {
color: black;
font-size: 130%;
text-align: center;
padding: 25px;
border: 1px solid #c185b4;
background: #ab3e8e;
}

p.info2 {
color: black;
font-size: 120%;
padding: 20px;
border: 1px solid #d788bf;
background: #bf4199;
}

p.info3 {
color: black;
font-size: 120%;
padding: 20px;
border: 1px solid #d788bf;
background: #a7448f;
}

p.info4 {
color: black;
font-size: 120%;
padding: 20px 20px 20px 50px;
border: 1px solid #d788bf;
background: #bf4199 url("../grafika/poptavka.png") no-repeat 20px 20px;
}

p.mensi2 {
font-size: 90%;
margin: 0;
}

.vlevo h3 {
color: black;
margin: 20px 0 15px;
font-weight: bold;
font-size: 120%;
}

ul.left, .levy {
float: left;
width: 45%;
}

ul.right, .pravy {
float: right;
width: 45%;
}

p.jednase {
margin: 30px 0 0 0;
}

.skryty {
display: none;
}

.levy {
 background: 
}

a.poptavka, a.poptavka:visited {
font-weight: bold;
color: #ffc601;
margin-top: 20px;
display: block;
height: 23px;
line-height: 23px;
padding-left: 30px;
background: url("../grafika/poptavka.png") no-repeat center left;
float: right;
}

a.poptavka:hover, a.poptavka:active, a.poptavka:focus {
color: white;
}

/* formular */

.innerbox form a {
background: none;
margin: 0;
padding: 0;
float: none;
display: inline;
}

.horni {
width: 592px;
height: 11px;
background: url("../grafika/form-top.png") no-repeat top left;
margin: 0;
padding: 0;
font-size: 1px;
float: left;
}

.form_bg {
width: 592px;
background: #b7298c url("../grafika/form-bg.jpg") repeat-y;
margin-bottom: 20px;
float: left;
}

fieldset {
padding: 30px 20px 20px 20px;
border: 1px solid #872268;
margin-bottom: 20px;
background: #9c0d73;
}

.legend {
font-weight: bold;
padding: 10px 12px;
border: 1px solid #872268;
background: #5f0655;
color: #ffc601;
}

label {
width: 125px;
float: left;
}

input {
width: 245px;
height: 16px;
padding: 3px 5px;
background: white; 
border: 1px solid #480542;
}

input.short {
width: 137px;
}

label.kratky {
width: auto;
padding-left: 20px;
float: none;
}

label.podrobnejsi {
width: auto;
float: none;
}

textarea {
width: 544px;
height: 99px;
padding: 3px;
border: 1px solid #480542;
background: white url("../grafika/textarea.jpg"); 
margin-top: 10px;
float: left;
}

input#staticky, input#dynamicky, input#eshop, input#redesign, input#vyhledavace, input#tiskoviny, input#log, input#jine {
width: auto;
height: auto;
padding: 0;
background: none;
border: 0;
}

input#co {
float: none;
margin-left: 10px;
}

#zajem {
width: 420px;
float: left;
}

.text {
padding-left: 10px;
}

input#odeslat {
width: 151px;
height: 38px;
color: white;
text-align: center;
font-size: 150%;
background: #4a0544 url("../grafika/odeslat.jpg");
padding: 0;
border: 0;
float: right;
}

#zpet {
width: 106px;
height: 27px;
line-height: 27px;
text-align: center;
font-weight: bold;
color: white;
text-decoration: none;
background: #54074d url("../grafika/zpet.jpg");
padding: 0;
float: right;
}

/* hover block */

ul.hover_block {
margin: 0;
padding: 0;
background: none;
}

ul.hover_block li {
width: 180px; 
margin: 0 32px 0 0;
padding: 0;
text-align: center;
list-style: none;
background: none;
position: relative;
float: left;
}

ul.hover_block li a, ul.hover_block li a:visited {
height: 104px;
padding-top: 40px;
width: 180px;
color: white;
font-size: 100%;
line-height: 150%;
font-weight: bold;
position: relative;
overflow: hidden;
text-decoration: none; 
}

ul.hover_block li img {
position: absolute;
top: 0;
left: 0;
}


/* paticka */

#spodni {
background: url("../grafika/bg2.jpg") repeat-x top center;
}

#paticka {
background: url("../grafika/paticka.jpg") center top no-repeat;
}

#vnitrni {
width: 956px;
height: 150px;
padding: 65px 30px 0 0;
margin: 0 auto;
color: #7b395d;
text-align: right;
position: relative;
}

#paticka a, #paticka a:visited {
font-size: 90%;
color: #cc88ae;
padding: 0 23px;
border-right: 1px solid #5d3859;
}

#paticka a:hover, #paticka a:active, #paticka a:focus {
color: #ffc601;
}

.active {
font-weight: bold;
color: white;
padding: 0 23px;
border-right: 1px solid #5d3859;
}

.last {
margin-right: 0;
border: 0 !important;
padding-right: 0 !important;
}

.hidden {
display: none;
}