﻿/* general */

* {
margin: 0;
padding: 0;
border: 0;
}

body {
font-family: Arial, Verdana, Helvetica, sans-serif;
font-size: 75%;
color: black;
background: #00aca3 url("../grafika/bg.jpg") repeat-x top left;
text-align: center;
}

a {
color: black; 
text-decoration: underline;
}

a:visited {
color: #f39900; /* oranžová */
}

a:hover, a:active, a:focus {
color: #00aca3; /* modrá */
}

.orange {
color: #f39900;
}

.blue {
color: #00aca3; 
}

h1, h2.uvodni, h2.intro, h1.intro {
color: #f39900; /* orange */
font-size: 140%;
font-weight: bold;
margin-bottom: 15px;
}

h2.intro, h1.intro {
margin-top: 30px;
padding-left: 155px;
}

/* logo */
#top h1, #logo {
width: 266px;
height: 91px;
font-size: 150%;
margin: 0;
padding: 0;
text-transform: uppercase;
background: white url("../grafika/trend-hubnuti.jpg") no-repeat;
float: left;
}

#top h1 a {
display: block;
}

h2 {
font-size: 120%;
font-weight: bold;
color: black;
margin: 0;
}

h2.tym {
color: #00aca3;
font-size: 100%;
margin: 20px 0 10px; 
}

h3 {
font-size: 100%;
font-weight: bold;
color: #00aca3;
margin: 20px 0 15px 0;
}

h4 {
color: #f39900; 
font-size: 120%;
margin: 10px 0;
}

p {
margin-bottom: 15px;
line-height: 150%;
}

ul {
margin: 10px 0;
line-height: 100%;
}

li {
margin-left: 30px;
list-style: square;
padding: 7px 0;
}

.cistic {
=height: 1px;
=width: 1px;
=font-size: 1px;
=line-height: 1px;
=margin: -1px -1px 0 0;
clear: both;
}

table {
border-collapse: collapse;
line-height: 150%;
width: 100%;
}

table td {
border: 1px solid #fad699;
padding: 7px 15px;
}

td.mesto {
background: #fef1dc;
font-weight: bold;
}

input, textarea, select {
font-family: Arial, Verdana, Helvetica, sans-serif;
font-size: 100%;
background: white;
color: black;
padding: 3px;
}
            
address {
line-height: 160%;
font-style: normal;
margin: 20px 0;
} 
   
#kontakt address {
margin: 0;
float: left;
width: 25%;
margin: 30px 20px 0 0;
border-right: 1px solid #fcd79f;
} 

.strong {
font-weight: bold;
}

.small {
font-size: 90%;
}

/***************** layout *************/

#top {
width: 898px;
height: 282px;
text-align: left;
margin: 0 auto;
}

#nahore {
width: 539px;
height: 58px;
padding: 33px 0 0 93px;
background: url("../grafika/top.jpg") no-repeat top right;
float: left;
}

#odkazy {
width: 218px;
float: left;
}

a#homepage {
font-size: 90%;
padding-left: 20px;
background: url("../grafika/homepage.jpg") no-repeat center left;
margin-bottom: 5px;
display: block;
float: left;
}

a#doporucit {
font-size: 90%;
padding-left: 20px;
background: url("../grafika/doporucit.jpg") no-repeat center left;
display: block;
float: left;
}

#odkazy a, #odkazy a:visited {
color: black;
}

#odkazy a:hover, #odkazy a:active, #odkazy a:focus {
color: #00aca3;
}

#hledani {
height: 58px;	
font-size: 90%;
float: left;
}

input#hledej {
width: 110px;
height: 17px;
padding: 3px 2px;
background: white url("../grafika/hledej.jpg") repeat-x;
border: 1px solid #00b7b0;
float: left;
}

input#go {
width: 27px;
height: 25px;
border: 0;
padding: 0;
float: left;
}

/*** bocni menu ***/

#header {
width: 898px;
height: 151px;
background: #9fc51f url("../grafika/zdravy-zivotni-styl.jpg") no-repeat top right;
float: left;
}

#header ul {
width: 266px;
height: 151px;
font-size: 100%;
margin: 0;
line-height: 100%;
float: left;
}

#header ul li {
width: 266px;
height: 35px;
line-height: 35px;
margin: 0;
padding: 0;
list-style: none;
color: black;
display: block;
text-transform: uppercase;
position: relative;
float: left;
}

#header ul li#jedna {
height: 42px;
line-height: 42px;
}

#header ul li#ctyri {
height: 39px;
line-height: 39px;
}

li#jedna span,
li#dva span, 
li#tri span,
li#ctyri span {
width: 266px;
height: 42px;
display: block;
background: url("../grafika/menu.jpg") no-repeat -266px 0;
position: absolute;
left: 0;
top: 0;
text-align: center;
overflow: hidden;
}

li#dva span {
height: 35px;
background: url("../grafika/menu.jpg") no-repeat -266px -42px;
}

li#tri span {
height: 35px;
background: url("../grafika/menu.jpg") no-repeat -266px -77px;
}

li#ctyri span {
height: 39px;
background: url("../grafika/menu.jpg") no-repeat -266px -112px;
}

li#jedna a, li#jedna a:link,
li#dva a, li#dva a:link, 
li#tri a, li#tri a:link,
li#ctyri a, li#ctyri a:link {
width: 266px;
height: 42px;
color: black;
text-align: right;
display: block; /*dulezite*/
position: absolute;
left: 0;
top: 0;
background: url("../grafika/menu.jpg") no-repeat 0 0;
overflow: hidden;
}

li#dva a, li#dva a:link {
height: 35px;
background: url("../grafika/menu.jpg") no-repeat 0 -42px;
}

li#tri a, li#tri a:link {
height: 35px;
background: url("../grafika/menu.jpg") no-repeat 0 -77px;
}

li#ctyri a, li#ctyri a:link {
height: 39px;
background: url("../grafika/menu.jpg") no-repeat 0 -112px;
}

li#jedna a:hover, li#jedna a:focus, li#jedna a:active,
li#dva a:hover, li#dva a:focus, li#dva a:active,
li#tri a:hover, li#tri a:focus, li#tri a:active,
li#ctyri a:hover, li#ctyri a:focus, li#ctyri a:active {
color: #d3d180;
background: url("../grafika/menu.jpg") no-repeat -266px 0;
}

li#dva a:hover, li#dva a:focus, li#dva a:active {
background: url("../grafika/menu.jpg") no-repeat -266px -42px;
}

li#tri a:hover, li#tri a:focus, li#tri a:active {
background: url("../grafika/menu.jpg") no-repeat -266px -77px;
}

li#ctyri a:hover, li#ctyri a:focus, li#ctyri a:active {
background: url("../grafika/menu.jpg") no-repeat -266px -112px;
}

/*** menu ***/

ul#menu {
width: 890px;
height: 30px;
padding: 10px 4px 0 4px;
margin: 0;
list-style: none;
text-align: center;
float: left;
}

ul#menu li {
margin: 0;
padding: 0;
list-style: none;
display: block;
float: left;
}

ul#menu li a, ul#menu li a:visited,
ul#menu .aktivni {
height: 22px;
line-height: 22px;
padding: 0 29px;
color: black;
text-decoration: none;
border-left: 1px solid #a8e7de;
display: block;
float: left;
}

ul#menu li a:hover, ul#menu li a:focus, ul#menu li a:active,
ul#menu .aktivni {
color: white;
}

ul#menu .aktivni {
font-weight: bold;	
}

ul#menu li#last a {
border-right: 1px solid #a8e7de;
}

/* obsah */

#obsah {
background: white;
}

#inner {
width: 873px;
padding: 15px 5px 20px 20px;
text-align: left;
margin: 0 auto;
}

#left {
width: 675px;
min-height: 100px;
_height: 100px;
float: left;
}

#right {
width: 183px;
min-height: 100px;
_height: 100px;
float: right;
}

#right img {
margin-bottom: 25px;
}

#intro {
width: 498px;
height: 130px;
// height: 96px;
padding: 12px 20px 12px 155px;
border-right: 1px solid #fde0b4;
border-top: 1px solid #fde0b4;
border-bottom: 1px solid #fde0b4;
position: relative;
}

#intro p {
margin: 0;
padding: 0;
}

.margin {
margin-bottom: 20px;
}

#doctor {
width: 140px;
height: 187px;
background: url("../grafika/doktorka.jpg") no-repeat;
position: absolute;
bottom: -1px;
left: 0;
z-index: 1000;
}

#girl {
width: 143px;
height: 189px;
background: url("../grafika/girl.jpg") no-repeat;
position: absolute;
bottom: 0;
left: 0;
z-index: 1000;
}

.kontejner {
width: 328px;
margin-bottom: 20px;
float: left;
}

.kontejner2 {
width: 328px;
margin-bottom: 20px;
float: right;
}

.clanek {
width: 328px;
border: 1px solid #51cebc;
background: #e6f7f6;
position: relative;
float: left;
}

.clanek2 {
width: 673px;
border: 1px solid #51cebc;
background: #e6f7f6 url("../grafika/bg2.jpg") repeat-y top left;
margin-bottom: 20px;
position: relative;
}

.clanek3 {
width: 328px;
border: 1px solid #51cebc;
background: #e6f7f6 url("../grafika/bg3.jpg") repeat-y top left;
position: relative;
}

p.udaje {
width: 184px;
padding: 8px 20px;
line-height: 170%;
margin: 0;
float: left;
}

p.udaje2 {
width: 165px;
padding: 8px 20px;
line-height: 170%;
margin: 0;
float: right;
}

#rozcestnik {
margin-top: 20px;
}

a#button1, a#button1:visited, a#button1:hover, a#button1:active, a#button1:focus {
width: 291px;
height: 68px;
line-height: 68px;
text-align: center;
display: block;
text-decoration: none;
background: #04b6a8 url("../grafika/button1.jpg");
font-size: 150%;
color: black;
}

a#button2, a#button2:visited, a#button2:hover, a#button2:active, a#button2:focus {
width: 261px;
height: 54px;
padding: 14px 0 0 30px;
display: block;
text-decoration: none;
background: #f39a01 url("../grafika/button2.jpg");
font-size: 150%;
color: black;
}


p.procedury {
width: 216px;
padding: 8px 20px;
margin: 0;
line-height: 150%;
float: left;
}

.foto, .foto2 {
width: 78px;
text-align: center;
font-weight: bold;
font-size: 90%;
padding: 9px;
color: white;
float: left;
}

.foto2 {
padding: 9px 10px 9px 0;
}

.foto3 {
width: 122px;
padding: 9px 0;
text-align: center;
float: left;
}

.foto img, .foto2 img, .foto3 img {
border: 1px solid #86d8d3;
=margin-bottom: 4px;
}

.foto a:hover img,
.foto2 a:hover img,
.foto3 a:hover img {
border: 1px solid white;
}

.roh {
width: 23px;
height: 22px;
background: url("../grafika/roh.jpg") no-repeat;
position: absolute;
top: -1px;
right: -1px;
}

.clanek2 .roh {
_right: -2px;
}

.clanek h3 {
color: black;
font-weight: bold;
padding: 10px 30px 10px 15px;
margin: 0;
background: #86d8d3;
border-bottom: 1px solid white;
}

.clanek2 h2 {
width: 443px;
color: black;
font-weight: bold;
padding: 10px 30px 10px 15px;
margin: 0;
background: #86d8d3;
border-bottom: 1px solid white;
float: right;
}

.clanek3 h2 {
width: 160px;
color: black;
font-size: 100%;
font-weight: bold;
padding: 10px 30px 10px 15px;
margin: 0;
background: #86d8d3;
border-bottom: 1px solid white;
float: right;
}

.clanek p {
font-size: 90%;
line-height: 140%;
margin: 0;
padding: 10px 15px;
}

.datum {
padding-top: 7px;
font-size: 90%;
float: left;
}

.oddelovac {
color: #f39900;
padding: 0 5px;
}

.left {
margin: 0 10px 10px 0;
float: left;
}

.right {
margin-bottom: 10px;
float: right;
}

img.vpravo {
float: right;
margin: 0 0 20px 20px;
padding: 5px;
border: 1px solid #fcd79f;
}

img.vlevo {
float: left;
margin: 0 20px 20px 0;
padding: 5px;
border: 1px solid #fcd79f;
}

.polovina {
width: 335px;
margin-top: 20px;
float: left;
}

.polovina h2 {
margin: 30px 0 20px;
}

a.vice, a.vice:visited,
a.zpet, a.zpet:visited {
font-size: 90%;
font-weight: bold;
color: black;
margin: 7px 0;
text-decoration: underline;
padding-left: 15px;
background: url("../grafika/sipka.jpg") no-repeat center left;
float: right;
}

a.zpet, a.zpet:visited {
background: url("../grafika/zpet.jpg") no-repeat center left;
}

a.vice:hover, a.vice:active, a.vice:focus,
a.zpet:hover, a.zpet:active, a.zpet:focus {
color: #f39900;
}


#kontakt {      
width: 635px;
padding: 15px 20px;
border: 1px solid #fcd79f;
background: #fef1dc;
}   

#kontakt2 {
padding: 15px 10px;
border: 1px solid #fcd79f;
background: #fef1dc;
}  

#breadcrumb {
font-size: 90%;
margin-bottom: 20px;
}

#breadcrumb .oddelovac {
color: black;
}

#breadcrumb a, #breadcrumb a:visited {
color: #00aca3; 
}

#breadcrumb a:hover, #breadcrumb a:active, #breadcrumb a:focus {
color: #f39900;
}

h1.drobecky {
margin-bottom: 5px;
}

#abeceda {
background: #fef1dc;
padding: 10px 12px;
border: 1px solid #fad699;
color: #f39900;
}

#abeceda a, #abeceda a:visited {
font-weight: bold;
padding: 0 3px;
color: black;
}

#abeceda a:hover, #abeceda a:focus, #abeceda a:active {
color: #00aca3;
}

.pismeno {
color: #01a39b;
font-size: 150%;
margin: 30px 0 15px;
}

#sidlo {
width: 195px;
height: 204px;
padding: 20px;
background: #f1e9c2;
float: right;
}

.mapa {
float: left;
}

.tretina {
width: 35%;
float: left;
}

p.tretina {
 margin-top: 30px;
}

/*** formulář ***/

fieldset {
padding: 20px;
_padding: 0 20px 20px 20px;
background: #dcdcdc;
border: 2px solid #999;
margin: 30px 0 20px;
position: relative;
}

input {
width: 150px;
border: 1px solid #999;
background: white;
}

.long {
width: 350px;
}

.middle {
width: 200px;
}

input#odeslat {
width: auto;
margin: 10px 0;
float: right;
padding: 5px 15px;
font-weight: bold;
border: 2px solid #999;
background: #f3b63a;
color: black;
}

textarea {
width: 98%;
height: 100px;
border: 1px solid #999;
background: white;
}

label {
width: 100px;
color: #be0a26;
padding-top: 3px;
float: left;
}

legend {
background: #f3b63a;
color: black;
font-weight: bold;
padding: 5px 10px;
border: 1px solid #999;
position: relative; 
top: -1em; 
}

fieldset.dva label {
width: 220px;
}

/* paticka */

#bottom {
background: url("../grafika/paticka.jpg") repeat-x top left; 
}

#paticka {
width: 898px;
height: 55px;
line-height: 55px;
font-size: 90%;
margin: 0 auto;
text-align: left;
padding: 0 30px;
}

#copyright {
width: 470px;
float: left;
}

#tisk {
width: 428px;
text-align: right;
float: right;
}

#about {
padding-left: 20px;
margin-left: 10px; 
background: url("../grafika/o-webu.jpg") no-repeat center left;
}

#map {
padding-left: 25px;
margin-left: 10px; 
background: url("../grafika/mapa-stranek.jpg") no-repeat center left;
}

#print {
padding-left: 20px;
margin-left: 10px; 
background: url("../grafika/tisk.jpg") no-repeat center left;
}

#paticka a {
color: black;
text-decoration: underline;
}

#paticka a:visited {
color: #87d8d4;
}

#paticka a:hover, #paticka a:active, #paticka a:focus {
color: white;
}

#paticka #tisk a, #paticka #tisk a:visited {
color: black;
}

#paticka #tisk a:hover, #paticka #tisk a:active, #paticka #tisk a:focus {
color: white;
}

#paticka .oddelovac {
color: white;
padding: 0 7px;
}

