/*

Author: Jakub Beránek

Studio: www.vindi.cz

*/

html, body {

background: #fefeff url('../images/background.png') repeat-x 0 2px;

height: 100%;

font-size: 0.9em;

padding: 0; 

margin: 0;

color: #000;

font-family: Arial, Verdana, Tahoma;

}



img {border: none;}

a {outline: none; cursor: pointer; color: #950a0a;}

a:hover {text-decoration: none;}



a#back {position: absolute; top: 14px; left: 317px; width: 119px; height: 33px;}

a#back span {position: absolute; width: 100%; height: 100%; background: url('../images/back.jpg')}



/* HEADLINES */

h1, h2, h3, h4 {color: #960b0b; margin: 0; padding: 0;}

h2 {font-size: 1.35em;}

h3 {font-size: 1.2em;}

#content_up h3 {font-size: 1.1em; color: #000; margin-top: 15px;}

#content_up h3.biggermargin {margin-top: 45px;}

h4 {color: white; text-align: center; font-size: 1.15em; padding: 5px 0;}



#spravna-strava {position: relative; width: 309px; height: 62px;}

#spravna-strava span {position: absolute; width: 100%; height: 100%; background: url('../images/headline_spravna-strava.jpg')}

#celulitida {position: relative; width: 309px; height: 62px;}

#celulitida span {position: absolute; width: 100%; height: 100%; background: url('../images/headline_celulitida.jpg')}

#kosmetika-a-pece {position: relative; width: 309px; height: 62px;}

#kosmetika-a-pece span {position: absolute; width: 100%; height: 100%; background: url('../images/headline_kosmetika-a-pece.jpg')}

#proc-aloe-vera {position: relative; width: 309px; height: 62px;}

#proc-aloe-vera span {position: absolute; width: 100%; height: 100%; background: url('../images/headline_proc-aloe-vera.jpg')}

#detoxikace {position: relative; width: 309px; height: 62px;}

#detoxikace span {position: absolute; width: 100%; height: 100%; background: url('../images/headline_detoxikace.jpg')}

#recepty {position: relative; width: 309px; height: 62px;}

#recepty span {position: absolute; width: 100%; height: 100%; background: url('../images/headline_recepty.jpg')}



/* P, SPAN, ...*/

#content_up .right p {margin: 15px 0 0 0; padding: 0; line-height: 1.4em;}

.underline {text-decoration: underline;}

.italic {font-style: italic;}

.indent {text-indent: 20px;}

.bigger-indent {text-indent: 50px;}

.align_center {text-align: center; font-style: italic;}

.padding_none {padding: 0;}

.float_left {float: left;}

#content_up .right .no-margin {margin: 0;}

li {line-height: 1.4em; padding-bottom: 5px;}

cite {position: relative; padding: 15px 0 0 50px; display: block;}



/* PAGE KODING */

#wrap {

min-height: 100%; height:auto !important; height: 100%;/*IE*/ position: relative;

}

#box {

position: relative; margin: 0 auto; width: 974px; overflow: hidden; padding: 0;

}

#box2 {

position: relative; margin: 0 auto; width: 100%; overflow: hidden; padding: 0; background: url('../images/box2.png') repeat-x 0 20px;

}



#content_up {float: left; width: 974px; padding: 223px 0 0 0; background: url('../images/header.jpg') no-repeat right 2px;}

#content_down {position: relative; margin: 0px auto; width: 974px;}

a#to_homepage {position: absolute; top: 2px; left: 40px; width: 134px; height: 202px; display: block;}

h1#logo {position: absolute; top: 144px; left: 177px; width: 217px; height: 60px; display: block; overflow: none; font-size: 1.8em;}

h1#logo a {position: relative; width: 100%; height: 100%; display: block;}

h1#logo a span {position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: url('../images/logo.jpg') no-repeat 0 0;}

#date {position: absolute; top: 120px; right: 0; width: 112px; height: 44px; /*background: url('../images/date.jpg') no-repeat 0 0; */ line-height: 18px; text-align: center; padding: 6px 0 10px 0; color: #9b5104;}

.right {float: right; width: 695px; position: relative;}

.image {float: left; width: 95px; height: 100px; border: 1px solid #d4d4d4; background: #ececec; padding: 3px 0; text-align: center; margin: 0 10px 10px 0;}

.right .align_right {text-align: right; margin-top: 40px;}

.right .align_right a {padding: 0 20px 0 30px; background: url('../images/arrow.jpg') no-repeat 0 center; line-height: 15px;}





/*.story1 {float: left; width: 300px; line-height: 1.4em; font-size: 0.95em;}

.story2 {float: right; width: 300px; line-height: 1.4em; font-size: 0.95em;}

.story1 .image, .story2 .image {float: left; width: 95px; height: 100px; border: 1px solid #d4d4d4; background: #ececec; padding: 3px 0; text-align: center; margin: 0 10px 10px 0;}

.story1 .align_right, .story2 .align_right {text-align: right;}

.story1 .align_right a, .story2 .align_right a {padding: 0 20px 0 30px; background: url('../images/arrow.jpg') no-repeat 0 center; line-height: 15px;}*/



/* TABLE */

.table_bunecna-vyziva th {text-align: left; padding-left: 5px;}

.table_bunecna-vyziva td {padding-left: 10px;}

.table_zdrave-jist {border: 1px solid #000; margin: 5px 0 0 30px;}

.table_zdrave-jist th {text-align: left; padding: 5px 10px;}

.table_zdrave-jist td {padding: 5px 10px;}



/* FORM */

#form1 {float: left; margin: 20px 0 50px 0;}

.label {float: left; width: 259px; height: 20px; line-height: 20px; padding-left: 5px; background: #b61c1c url('../images/label.jpg') no-repeat 0 0; color: white; font-weight: bold; margin-bottom: 0px;}

.input {float: left; width: 343px; height: 20px; line-height: 20px; border: none; padding-left: 5px; background: #dfdfdf; color: #333; font-size: 0.9em; margin-bottom: 1px;}

.input1 {float: left; width: 343px; height: 16px; line-height: 17px; border: 1px solid #333; padding-left: 5px; background: #dfdfdf; color: #333; font-size: 0.9em; margin-bottom: 1px;}

.label2 {float: left; width: 259px; height: 20px; _height: expression(this.scrollHeight < 20? "20px" : "auto" ); line-height: 20px; padding-left: 5px; background: #81a33a; color: white; font-weight: bold; margin-top: 1px; font-size: 0.85em;}

.input2 {float: left; width: 345px; min-height: 20px; _height: expression(this.scrollHeight < 20? "20px" : "auto" ); line-height: 20px; border: none; padding-left: 5px; background: #dfdfdf; color: #333; font-size: 0.9em; margin-top: 1px;}

.input3 {float: left; width: 343px; height: 17px; line-height: 17px; border: 1px solid #333; padding-left: 5px; background: #dfdfdf; color: #333; font-size: 0.9em; margin-top: 1px;}

#submit {float: left; width: 614px; padding-top: 20px; text-align: right;}



#under_second-menu {float: left; width: 704px; height: 222px; background: url('../images/second-menu_woman.jpg') no-repeat 0 0; padding: 20px 0 20px 270px;}



#personal-program {float: left; width: 210px; height: 214px; background: #a41212 url('../images/osobni-program.jpg') no-repeat 0 0; margin-left: 14px; display: inline; position: relative}

#personal-program  p {margin-top: 50px; padding: 0 5px; color: white;}

#personal-program .bottom {position: absolute; right: 3px; bottom: 3px; color: white; font-size: 0.9em; margin: 0;}

#personal-program .bottom a {color: white;}

span.ods { font-size: 10px; float: right; position: relative; bottom: 30px; }

span.ods a {color: grey;}

#footer {float: left; margin-left: 14px; width: 960px; border-top: 2px solid #bfbfbf; ; margin-top: 50px; _margin-left: 7px; line-height: 60px; text-align: center;}

#footer .webdesign {border-left: 2px solid #bfbfbf; height: 30px; margin-left: 30px; padding-left: 30px;}



/* MENU */

#menu {float: left; width: 210px; height: 173px; padding: 43px 0 0 14px; background: #a41212 url('../images/menu.jpg') no-repeat 0 0; margin: -2px 0 30px 0; list-style: none;}

#menu li {float: left; width: 210px; height: 27px; padding: 0;}

#menu li a {width: 175px; height: 27px; padding-left: 25px; display: block; background: url('../images/menu-li_a.jpg') no-repeat 0 center; color: white; line-height: 27px; text-decoration: none; font-size: 1em; font-weight: bold;}

#menu li a:hover {background: #d57777 url('../images/menu-li_a.jpg') no-repeat 0 center;}

#menu li a.active {background: url('../images/menu-li_a-hover.jpg') no-repeat 0 center;}

#menu li a.active:hover {background: #d57777 url('../images/menu-li_a-hover.jpg') no-repeat 0 center;}



/* SECOND MENU LEFT*/

#second-menu_left {float: left; width: 310px; height: 218px; margin: 0; padding: 0; list-style: none; background: #e8aa09; padding: 2px 6px;}

#second-menu_left li {height: 62px; float: left; padding: 0;}

#second-menu_left a, #second-menu_left a span {display:block; height:45px; overflow:hidden;}

#second-menu_left a {position:relative; width: 100%; height: 100%; cursor:hand;}

#second-menu_left a span {position:absolute; top:0; left:0;}



#m1 a, #m1 a span {width: 309px; background: url("../images/second-menu_spravna-strava.jpg") no-repeat;}

#m1 a:hover, #m1 a:hover span {background-position: 0 -62px;}

#m2 {margin-top: 16px;}

#m2 a, #m2 a span {width: 309px; background: url("../images/second-menu_celulitida.jpg") no-repeat;}

#m2 a:hover, #m2 a:hover span {background-position: 0 -62px;}

#m3 {margin-top: 16px;}

#m3 a, #m3 a span {width: 309px; background: url("../images/second-menu_kosmetika-zitrka.jpg") no-repeat;}

#m3 a:hover, #m3 a:hover span {background-position: 0 -62px;}



/* SECOND MENU RIGHT*/

#second-menu_right {float: right; width: 310px; height: 218px; margin: 0 30px 0 0; padding: 0; list-style: none; background: #e8aa09; padding: 2px 6px;}

#second-menu_right li {height: 62px; float: left; padding: 0;}

#second-menu_right a, #second-menu_right a span {display:block; height:45px; overflow:hidden;}

#second-menu_right a {position:relative; width: 100%; height: 100%; cursor:hand;}

#second-menu_right a span {position:absolute; top:0; left:0;}



#m4 a, #m4 a span {width: 309px; background: url("../images/second-menu_proc-aloe.jpg") no-repeat;}

#m4 a:hover, #m4 a:hover span {background-position: 0 -62px;}

#m5 {margin-top: 16px;}

#m5 a, #m5 a span {width: 309px; background: url("../images/second-menu_detoxikace.jpg") no-repeat;}

#m5 a:hover, #m5 a:hover span {background-position: 0 -62px;}

#m6 {margin-top: 16px;}

#m6 a, #m6 a span {width: 309px; background: url("../images/second-menu_recepty.jpg") no-repeat;}

#m6 a:hover, #m6 a:hover span {background-position: 0 -62px;}