html {height: 100%; font: normal normal 62.5% sans-serif; background: #dff5e8 url('graphic/main_back.png') repeat-x center top}
body {height: 100%; background: url('graphic/login_back.gif') no-repeat center top; color: #2f4e23}

/* Základní nastavení - neměnit, pokud si nejste opravdu jisti, může způsobit rozpad celého layoutu */

html, body, h1, fieldset, #header form input, #menu, p, ul, li {padding: 0; margin: 0; border: none}
h1 span, #header form, span.login_back, #header form #input_send, #propaganda-left strong span, #propaganda-right strong span, .hide, .bigger .bid, .bigger .reserve, .bigger .prices, .bigger .prices .price span, .bigger div a.img, .bigger div a.img span, .smaller .button, .smaller .time, .bigger .off .prices b, .right_content span.top, .right_content span.bottom, .smaller .inside .img span, .content_auction span.bottom, .max {position: absolute; display: block; z-index: 3}

.viktor {clear: both !important; float: none !important; height: 0 !important; width: 0 !important; background: 0 !important; margin: 0 !important; display: block !important}
a {color: #2c9f00}
h2 {padding: 7px 0; font-size: 1.6em}
h3 {color: black}

/* Hlavička */

#header {width: 960px; margin: 0 auto; position: relative;}

#header form {width: 660px; top: 0; right: 0; height: 90px}
#header form p {float: left; padding: 26px 15px 0 100px; width: 110px; font-size: 1.1em; text-align: right; font-weight: bold; line-height: 18px}
#header form .fieldset {width: 435px; padding: 29px 0 0; float: left; text-align: left}
#header form #input_name, #header form #input_password {font: normal normal 100% sans-serif; background: url('graphic/login_input.png') no-repeat center top; border: none; width: 128px; height: 13px; line-height: 13px; padding: 10px 0 10px 20px; color: #fefefe; text-transform: uppercase; margin: 0 5px 0 0;}
#login .reg {color: #9ee0ba; display: block; text-transform: uppercase}
#login .pass {color: #9ed3e0}
#header form #input_send {font: normal normal 1.1em sans-serif; background: url('graphic/login_button.png') no-repeat center top; border: none; width: 110px; height: 32px; padding: 9px 0 9px; line-height: 13px; top: 29px; right: 0; font-weight: bold; text-transform: uppercase}

h1 {width: 225px; height: 90px; position: relative}
h1 span {width: 225px; height: 90px; top: 0; left: 0; background: url('graphic/h1.png') no-repeat center top}

/* Menu */

#menu {font-size: 1.2em; text-transform: uppercase; float: right; margin: 2px 0 0; height: 47px; font-weight: bold}
#menu li {color: white; display: block; list-style: none; float: left}
#menu li a {color: white; display: block; padding: 0 17px; margin: 0; text-decoration: none; line-height: 41px; height: 47px}
#menu li.active a, #menu li a:hover {padding: 0 16px; background: url('graphic/menu_back.png') repeat-x center top; border-left: 1px solid #89c895; border-right: 1px solid #89c895}

#propaganda-left, #propaganda-right {padding: 32px 0 0; float: left; width: 480px}
#propaganda-left strong, #propaganda-right strong {width: 317px; height: 30px; position: relative; display: block}
#propaganda-left strong span {width: 317px; height: 30px; background: url('graphic/propaganda-left-top.png') no-repeat center top; left: 0; top: 0}
#propaganda-right strong span {width: 317px; height: 30px; background: url('graphic/propaganda-right-top.png') no-repeat center top; left: 0; top: 0}
#propaganda-left ul li, #propaganda-right ul li {font-size: 1.6em; display: block; list-style: none; color: #152410; font-weight: bold; padding: 7px 0}
#propaganda-left ul, #propaganda-right ul {display: block; list-style: none; padding: 20px 0; margin: 0}
#propaganda-left ul .first {padding: 7px 0 7px 33px; background: url('graphic/step1.png') no-repeat left center}
#propaganda-left ul .second {padding: 7px 0 7px 33px; background: url('graphic/step2.png') no-repeat left center; color: #2f4e23}
#propaganda-left ul .third {padding: 7px 0 7px 33px; background: url('graphic/step3.png') no-repeat left center; font-weight: normal; color: #152410}
#propaganda-right ul .second {color: #2f4e23}
#propaganda-right ul .third {font-weight: normal; color: #152410}

.hide {font-size: 1.1em; text-transform: uppercase; background: url('graphic/hide.png') no-repeat center top; top: 140px; right: 0; width: 108px; height: 65px; text-align: right; line-height: 53px}
.hide a {text-decoration: none; color: black; font-weight: bold; display: block; padding: 0 30px 0 0; margin: 20px 0 0; height: 45px}

#luny-in-da-cage {background: url('graphic/body_back.png') no-repeat center 9px; padding: 64px 0 0}

/* */
/* Hlavní stránka */
/* */

/* Větší bloky */

.bigger {width: 980px; margin: 0 auto}
.bigger div {width: 225px; padding: 0 10px; background: url('graphic/content-big.png') no-repeat center top; height: 323px; float: left; position: relative; margin: 0 0 20px}
.bigger div a.img {display: block; text-align: center; top: 85px; left: 0; width: 245px; text-decoration: none}
.bigger div a.img img {margin: 0 auto; display: block; border: none}
.bigger div a.img span {font-size: 3em; color: white; font-weight: bold; left: 0; top: 65px; text-align: center; width: 245px; letter-spacing: -2px}

.bigger div .name {font-size: 1.4em; padding: 0 20px 6px 64px; margin: 24px 0 0}
.bigger div .name a {text-decoration: none; color: #2f4e23}
.bigger .silver .name {background: url('graphic/silver_brick.png') no-repeat 20px top}
.bigger .gold .name {background: url('graphic/gold_brick.png') no-repeat 20px top}
.bigger .bronze .name {background: url('graphic/bronze_brick.png') no-repeat 20px top}
.bigger .bid {bottom: 20px; left: 10px; height: 34px; line-height: 33px; background: url('graphic/bid.png') no-repeat 20px top; font-size: 1.2em; font-weight: bold}
.bigger .bid a {font-size: 1.2em; padding: 0 0 8px; text-align: center; margin: 0 15px 0 21px; width: 88px; color: white; text-decoration: none; display: block; float: left}

.bigger .prices  {height: 38px; line-height: 37px; font-size: 1.2em; font-weight: bold; bottom: 64px; left: 30px; width: 185px}
.bigger .prices .price {background: url('graphic/price_back.png') repeat-x center top; font-size: 1.5em; color: white; text-align: center; float: left; height: 38px; margin: 0 20px 0 0; display: block; position: relative; padding: 0 18px}
.bigger .prices .price .left {background: url('graphic/price_left.png') no-repeat center top; width: 18px; height: 38px; left: 0; top: 0; z-index: 2}
.bigger .prices .price .right {background: url('graphic/price_right.png') no-repeat center top; width: 18px; height: 38px; right: 0; top: 0; z-index: 2}
.bigger .prices .seats-span {position: absolute; width: 80px; text-align: right; top: 0; right: 0}
.bigger .time {font-size: 1.1em; text-align: right}
.bigger .time small {font-size: 1.4em}
.bigger .time b {font-size: 1.6em}

/* Větší bloky - před spuštěním aukce */

.bigger .off .prices {bottom: 20px; height: 38px; line-height: 37px; font-size: 1.2em; font-weight: bold; bottom: 64px; left: 30px; background: url('graphic/seats_left.png') no-repeat center top; width: 155px; color: #86c340; padding: 0 30px 0 0; text-align: right}
.bigger .off .prices b {color: white; font-size: 1.6em; top: 1px; left: 5px; text-align: right; width: 40px}

.bigger .reserve {bottom: 20px; left: 10px; height: 34px; line-height: 33px; background: url('graphic/reserve.png') no-repeat 20px top; font-size: 1.2em; font-weight: bold}
.bigger .reserve a {font-size: 1.2em; padding: 9px 10px 8px; margin: 0 15px 0 26px; width: 88px; text-align: center; color: white; text-decoration: none}

/* Menší bloky */

.smaller {background: white url('graphic/smaller_back.png') repeat-x; padding: 29px 0 40px; border-top: 1px solid white}
.smaller .inside {width: 960px; margin: 0 auto; border-bottom: 1px solid #ecede6; padding: 22px 0 0}
.smaller .inside div {margin: 0 0 0 20px; float: left; width: 460px; position: relative; padding: 0 0 23px}
.smaller .inside div img {float: left}
.smaller .inside .img {position: relative}
.smaller .inside .img span {top: 43px; left: 0; width: 100px; text-align: center; color: white; font-size: 1.4em; font-weight: bold}
.smaller div .name {font-size: 1.1em; float: right; padding: 0 20px 10px 57px; margin: 5px 0 0; text-transform: uppercase; display: block; width: 270px}
.smaller div .name a {text-decoration: none; color: #2f4e23}
.smaller .silver .name {background: url('graphic/silver_brick.png') no-repeat 10px 2px}
.smaller .gold .name {background: url('graphic/gold_brick.png') no-repeat 10px 2px}
.smaller .bronze .name {background: url('graphic/bronze_brick.png') no-repeat 10px 2px}

.smaller .time {bottom: 23px; right: 99px; height: 34px; line-height: 33px; ; font-size: 1.1em; font-weight: bold; text-decoration: none; text-align: center}
.smaller .time .timer {float: left; background: url('graphic/small_button_on_left.png') no-repeat right top; display: block; height: 34px; padding: 0 25px 0 0; text-align: right}
.smaller .time .timer span {font-size: 1.1em; float: left; display: block; padding: 1px 0 0 0}
.smaller .time .timer small {font-size: 1.5em; float: left; display: block; padding: 1px 0 0 5px}
.smaller .time .timer b {font-size: 1.8em; float: left; display: block; padding: 0 0 0 6px}
.smaller .time .price {padding: 0 10px 0 0; background: url('graphic/small_button_on_back.png') repeat-x right top; display: block; height: 34px; font-size: 1.7em; font-weight: bold; color: white; text-decoration: none; margin: 0; text-align: center; float: left}
.smaller .button {bottom: 23px; right: 10px; height: 34px; line-height: 33px; background: url('graphic/small_button_on_right.png') no-repeat right top; font-size: 1.4em; font-weight: bold; color: white; text-decoration: none; width: 89px; text-align: center}
.smaller .last {border: none}

/* Menší bloky - před spuštěním aukce */

.smaller .inside .off {}
.smaller .inside .off .time {bottom: 23px; right: 10px; background: url('graphic/small_button_off.png') no-repeat right; padding: 0 0 0 10px; width: 245px}
.smaller .inside .off .time b {color: white; padding: 0 10px; font-size: 1.2em}
.smaller .inside .off .timer {background: none; color: #86c340}
.smaller .inside .off .button {background: none; bottom: 0; right: 14px}


/* */
/* Nápověda */
/* */

.content {width: 960px; margin: 0 auto; font-size: 1.2em; padding: 0 0 50px}

.left_menu {width: 300px; float: left; background: url('graphic/help_left_back.png') repeat-y center top}
.left_menu ul {width: 300px; background: url('graphic/help_left_top.png') no-repeat center top}
.left_menu ul li {display: block; list-style: none; font-weight: bold}
.left_menu ul li ul {background: none; padding: 5px 0 5px 40px}
.left_menu ul li ul li a {color: #c2ffaa; background: none}
.left_menu ul li a {text-decoration: none; color: #37c300; background: url('graphic/pointer_green.png') no-repeat 40px center; padding: 5px 58px; display: block}
.left_menu ul li a:hover {background: url('graphic/hover_menu.png') no-repeat 40px center; color: white; text-decoration: underline}
.left_menu ul li.header {font-size: 1.6em; color: white; background: none; font-weight: bold; padding: 35px 40px 15px}
.left_menu ul li.bottom {margin: 0 0 -3px 0; width: 300px; height: 23px; background: url('graphic/help_left_last.png') no-repeat center bottom}

.right_content {width: 560px; float: left; margin: 0 0 0 20px; padding: 15px 40px 40px; background: url('graphic/content_back.png') repeat-y center top; position: relative}
.right_content p {text-align: justify; line-height: 18px; padding: 10px 0}
.right_content a {color: #37c300}
.right_content span.top {width: 640px; height: 22px; top: 0; left: 0; background: url('graphic/content_top.png') no-repeat center top}
.right_content span.bottom {width: 640px; height: 22px; bottom: 0; left: 0; background: url('graphic/content_bottom.png') no-repeat center top}

/* */
/* Obsah aukce */
/* */

.content_auction {width: 960px; margin: -17px auto 15px; padding: 0 0 50px; background: url('graphic/auction_back.png') repeat-y center top; position: relative}
.content_auction div.top {height: 82px; background: url('graphic/auction_top.png') no-repeat center top}
.content_auction h2 {padding: 23px 0 0 102px; color: #2f4e23; font-size: 1.8em; height: 59px}
.content_auction h2 small {color: #8b8e8a; display: block; font-size: 0.8em}
.content_auction h2.silver {background: url('graphic/silver_brick.png') no-repeat 40px center}
.content_auction h2.gold {background: url('graphic/gold_brick.png') no-repeat 40px center}
.content_auction h2.bronze {background: url('graphic/bronze_brick.png') no-repeat 40px center}

/* Levý */

.content_auction .left {width: 384px; float: left; font-size: 1.2em; font-weight: bold}
.content_auction .left p {padding: 35px 40px; text-align: justify}
.content_auction .left img.big {border: none; display: block; margin: 0 auto}
.content_auction .left .smaller_img {padding: 40px 0 0 40px}
.content_auction .left .smaller_img img {border: 3px solid #c4d8d0; margin: 0 15px 0 0}

/* Střed */

.content_auction .middle {width: 317px; float: left}

.content_auction .middle .infopanel {width: 277px; margin: 0 auto 20px; background: url('graphic/infopanel.png') no-repeat center top; color: white; position: relative; font-weight: bold; height: 129px}
.content_auction .middle .infopanel b {color: #37c300}
.content_auction .middle .infopanel .price {font-size: 2.4em; text-align: center; padding: 15px 0 5px}
.content_auction .middle .infopanel .seats {font-size: 1.8em; padding: 0 18px}
.content_auction .middle .infopanel .seats span {font-size: 1.8em}
.content_auction .middle .infopanel .max {bottom: 15px; left: 20px; font-size: 1.1em}
.content_auction .middle .infopanel .max b {font-size: 1.3em}

.content_auction .middle ul {padding: 0 40px}
.content_auction .middle ul li {font-size: 1.4em; background: url('graphic/auction_li.png') no-repeat left 3px; padding: 0 0 15px 26px; display: block; list-style: none; line-height: 24px}
.content_auction .middle ul li strong, .smaller .description p strong {color: black}

/* Pravý */

.content_auction .right {width: 259px; float: left; font-weight: bold}
.content_auction .right .seats {width: 180px; margin: 0 auto}
.content_auction .right .seats li {width: 42px; padding: 0 3px 0 0; margin: 0 0 4px; float: left; display: block; list-style: none}
.content_auction .right .seats li img {border: none}
.content_auction .right a.reserve {background: url('graphic/reserve_seat.png') no-repeat center top; text-align: center; color: white; font-size: 1.4em; width: 173px; margin: 20px auto 30px; display: block; height: 34px; line-height: 34px; text-decoration: none}
.content_auction .right p.reserve {background: url('graphic/seats_sold.png') no-repeat center top; text-align: center; color: white; font-size: 1.4em; width: 170px; margin: 20px auto 30px; display: block; height: 34px; line-height: 34px; text-decoration: none}

.content_auction .right .legend {padding: 0 0 0 66px}
.content_auction .right .legend li {list-style: none; font-size: 1.1em; line-height: 26px; width: 155px; height: 35px}
.content_auction .right .legend img {padding: 5px 15px 0 0; float: left}
.content_auction .right .legend span {float: left}

.content_auction .important {font-size: 1.4em; font-weight: bold; padding: 35px 20px 20px 40px}

.content_auction span.bottom {background: url('graphic/auction_last.png') no-repeat center top; height: 19px; width: 960px; bottom: 0; left: 0}

.smaller .description {width: 960px; margin: 0 auto -20px}
.smaller .description h4 {font-size: 1.8em; margin: 0 0 25px}
.smaller .description p {font-size: 1.2em; text-align: justify; padding: 0 0 15px; line-height: 18px}
.smaller .description p a {font-weight: bold; color: #33b600}
.smaller .description ul {padding: 20px 15px}
.smaller .description ul li {list-style: none; background: url('graphic/content_li.png') no-repeat left top; padding: 0 25px 15px; font-size: 1.1em}

/* */
/* Aukce v provozu */
/* */

.auction-on .middle .infopanel {margin: 0 auto}
.auction-on .middle table {margin: 0 0 0 1px; font-weight: bold; width: 316px; background: url('graphic/table_back.png') repeat-y center top; font-size: 1.1em}
.auction-on .middle thead {background: #c9e6a1}
.auction-on .middle td {padding: 10px 20px; border-bottom: 1px solid #ebebeb; text-align: center; color: black}
.auction-on .middle thead td {color: #2f4e23; text-transform: uppercase}
.auction-on .seats {margin: 10px auto 0}
.auction-on .seats strong {display: block; float: left; padding: 0 10px 0 0}
.auction-on .seats b {color: #aaa !important; font-size: 16px !important; float: left}
.auction-on .seats .little {font-size: 18px !important; float: left}
.auction-on .seats .medium {font-size: 24px !important; float: left; margin: -4px 0 0}
.auction-on .seats .big {font-size: 36px !important; float: left; margin: -11px 0 0}
.auction-on .offer_button {background: url('graphic/seats_offer.png') no-repeat center top; width: 173px; height: 34px; display: block; margin: 10px auto 0; color: white; font-size: 1.4em; font-weight: bold; text-align: center; line-height: 34px; text-decoration: none}
.auction-on .offer_button:hover {background: url('graphic/reserve_seat.png') no-repeat center top}

/* Platební metody */

.payment-methods {background: url('graphic/payment_back.png') repeat-x center top; padding: 20px 0 0}
.payment-methods div {width: 960px; margin: 0 auto}
.payment-methods div img {margin: 0 42px 0 0}

/* Patička */

#footer {background: white url('graphic/footer_back.png') repeat-x center top; padding: 21px 0 0; margin: 17px 0 0; border-top: 1px solid white; font-size: 1.1em; height: 173px}
#footer .background {background: url('graphic/footer_flower.gif') no-repeat center top; margin: 0; padding: 0}
#footer .background div {width: 855px; margin: 0 auto; padding: 85px 0 0 105px; line-height: 20px; height: 88px}
#footer .background div p {float: left; width: 305px}

#footer .background div ul {float: left; width: 550px; text-align: right; font-weight: bold; line-height: 58px}
#footer .background div ul li {display: block; margin: 0 10px; float: left}
#footer .background div ul li a {color: #2f4e23}
#footer .background div ul li a:hover, .button:hover, .bid a:hover, .bigger .reserve a:hover {color: #86c340}