/*
Fazole.cz - loyalty program, "classic"
--------------------------------------
Author: munio webdesign
Web: 	http://munio.cz/
*/

html, body {text-align:center}
body {margin:0; background:#E1EEF7 url('../img/classic/body-bg.png') left top repeat-x; color:#333; font-family:'Segoe UI', Tahoma, Geneva, sans-serif}

/* --- BASIC ------------ */
h1, h2, h3, h4, h5, h6, p, blockquote, 
ul, ol, li, dl, dt, dd, 
table, tr, th, td, caption, thead, tbody, tfoot {margin:0; padding:0; font-size:100%; background:transparent}
form, fieldset, legend {margin:0; padding:0; font-size:100%}

h1, h2, h3, h4 {margin:0 0 0.5em 0}
h1 {font-size:1.25em; color:#F8C01E}
h2 {font-size:1.125em}
h3 {font-size:0.875em}
h4 {font-size:0.875em; font-style:italic}

p, address {margin:0 0 1.5em 0; font-size:0.75em; line-height:1.5em}
address {font-style:normal}
strong, b {font-weight:bold; color:#153F5F}
big {font-size:1.5em}
a {cursor:pointer; color:#153F5F; text-decoration:underline}
a:hover {text-decoration:none}
/*a:active, a:focus {}*/
img {padding:2px; border:1px solid #E1EEF7}
a img {border:none}
img.home {margin-top:5px 5px 5px 0;border:0;}

ul, ol {margin:0 0 1.5em 0; list-style:none; font-size:0.75em; line-height:2em}
ul ul, ol ol, ul ol, ol ul {margin:0; font-size:1em}
ul li {padding-left:23px; background:url('../img/classic/li.png') left 3px no-repeat}

dl {margin:0 0 1.5em 0; font-size:0.75em; line-height:1.5em}

table {width:100%; margin:0 0 1.5em 0; border-collapse:collapse; border-spacing:0; font-size:0.75em}
caption {margin:0 1px; padding:5px 10px; font-variant:small-caps; text-align:right; font-size:1.25em; border-bottom:1px solid #16405F; color:#16405F; background:transparent}

th, td {padding:10px; border:1px solid #fff; color:#393939; background:transparent}
th {background:#16405F; color:#fff; text-align:left}
td {background:#f7f7f7}
tr.alt td {background:#f2f2f2}

label, input, textarea, select {font-size:0.75em; font-family:'Segoe UI', Tahoma, Geneva, sans-serif}
form {margin:0 0 1.5em 0}
fieldset {padding:1em}
legend {font-size:0.875em; font-weight:bold; color:#333}
label {}
input, textarea {}
textarea {}
select {}
option {}


/* --- LAYOUT ----------- */
#page {width:872px; margin:0 auto; padding:25px 50px 40px 50px; background:url('../img/classic/page-bg.png') left top no-repeat; text-align:left; position:relative}
.rightbar #area, .leftbar #area {width:831px; padding:0 16px 0 25px; background:#fff url('../img/classic/area-right-bg.png') left top repeat-y; overflow:hidden}
.leftbar #area {width:841px; padding:0 25px 0 6px; background:#fff url('../img/classic/area-left-bg.png') left top repeat-y}
.topesu #area {background:#fff url('../img/classic/area-top-bg.png') left top repeat-y}
.rightbar #content, .leftbar #content {width:570px; float:left}
.leftbar #content {float:right}
.rightbar #sidebar, .leftbar #sidebar {width:250px; float:right}
.leftbar #sidebar {float:left}


/* --- HEADER ----------- */
.rightbar #header, .leftbar #header {width:820px; height:87px; padding:27px 26px 0 26px; background:url('../img/classic/head-right-bg.png') left top no-repeat; text-align:left}
.leftbar #header {background:url('../img/classic/head-left-bg.png') left top no-repeat}
.topesu #header {padding-bottom:50px; background:url('../img/classic/head-top-bg.png') left top no-repeat}
#title {margin:0; padding-bottom:5px; font-size:2.25em; font-style:italic; font-weight:bold; line-height:0.75em}
#header p em {font-size:1.5em; font-family:Cambria, "Times New Roman", Times, serif; line-height:1.5em}


/* --- CONTENT ---------- */
/*content*/
.spend {min-height:150px; margin:0 0 15px 0; padding:15px 0 10px 0; position:relative; border-top:1px solid #f2f2f2}
* html .spend {height:150px}
.spend dt {margin:0 0 5px 0; font-weight:bold; font-size:1.375em}
.spend dd.info {padding:0 128px 0 156px}
.spend dd.img {position:absolute; left:0; top:40px}
.spend dd.tag a {display:block; width:110px; height:87px; padding:8px 4px 0 4px; background:#BED2E1 url('../img/classic/spendtag.png') left top no-repeat; position:absolute; right:0; top:40px; font-size:1.2em; line-height:1.375em; text-align:center; overflow:hidden; color:#333; text-decoration:none}
.spend dd.tag big {font-weight:bold; display:block}
.spend dd.rating {display:block; width:110px; height:34px; padding:0 4px; background:#F9C21E url('../img/classic/spendtag.png') left bottom no-repeat; position:absolute; right:0; top:135px; font-size:1.125em; line-height:30px; text-align:center; font-weight:bold; overflow:hidden}

/*sidebar*/
#esu {margin:10px 0 30px 10px}
#esu li {margin:0 0 5px 0; padding:0; background:none}
#esu a {display:block; width:180px; height:54px; line-height:50px; padding:0 5px 0 55px; font-weight:bold; font-style:italic; text-decoration:none; font-size:1.5em}
#earn {background:#F9C21E url('../img/classic/button-earn.png') left top no-repeat}
#spend {background:#F9C21E url('../img/classic/button-spend.png') left top no-repeat}
#use {background:#F9C21E url('../img/classic/button-use.png') left top no-repeat}
#earn:hover {background:#BED2E1 url('../img/classic/button-earn.png') left bottom no-repeat}
#spend:hover {background:#BED2E1 url('../img/classic/button-spend.png') left bottom no-repeat}
#use:hover {background:#BED2E1 url('../img/classic/button-use.png') left bottom no-repeat}

#login {width:210px; height:150px; margin:0 0 1.5em 10px; padding:14px 15px 0 15px; background:url('../img/classic/login-bg.png') left top no-repeat}
#login form {margin:0}
#login fieldset {padding:0; border:none}
#login legend {padding-bottom:7px; font-style:italic}
#login label, #login br {display:none}
#login input {width:200px; margin:0 0 7px 0}
#login #loginsub {display:block; width:154px; height:34px; margin:5px auto 0 auto; background:url('../img/classic/loginsub.png') left top no-repeat; border:none; font-weight:bold; font-style:italic; font-size:0.814em}
#login p {margin:0; text-align:center; font-style:italic}
#login p a {color:#999}

.righttext {margin:0 0 1.5em 0; padding:0 25px}
.righttext address b {width:65px; float:left}

/*top nav*/
.topesu #esu {width:841px; margin:0; position:absolute; left:66px; top:135px; text-align:right; border-bottom:1px solid #ccc}
.topesu #esu li {display:inline}
.topesu #esu a {display:inline; padding:0 15px; line-height:3em; color:#153F5F; font-size:1.125em; font-weight:normal; text-decoration:underline}
.topesu #earn {background:none}
.topesu #spend {background:none}
.topesu #use {background:none}


/* --- FOOTER ----------- */
.rightbar #footer, .leftbar #footer {width:860px; padding:30px 6px 40px 6px; background:url('../img/classic/footer-right-bg.png') left top no-repeat}
.leftbar #footer {background:url('../img/classic/footer-left-bg.png') left top no-repeat}
#footer a {color:#333}
#footleft {width:560px; float:left}
#footright {width:280px; float:right; text-align:right}


/* --- OTHERS ----------- */
hr, .nos {display:none}
.fleft {width:auto; margin:0 0.5em 5px 0; float:left}
.fright {width:auto; margin:0 0 5px 0.5em; float:right}
textarea.tx {width:450px;}
#ilong {width:360px;}
input.sub {height:22px;width:170px;}
#pictable {font-size:15px;font-weight:bold;margin: 0 0 15px 0;}
#pictable td {vertical-align:middle;border:1px solid #cfcfcf;width:50%;text-align:center;}
#pictable a {color:#000;}
#pictable span {font-size:11px;}
#pictable img {border:1px solid #cfcfcf;width:150px;height:188px;}
#pictable td.noborder {border:0;background-color:#fff;}


/* --- popup ----------- */
#ce {display:none;position:fixed;_position:absolute;height:100%;width:100%;top:0;left:0;background:#E5E5E5;z-index:1;}
#ce2 {position:fixed;_position:absolute;height: 400px;width: 600px;text-align: center;padding: 5px;border: 1px solid #3d3d3d;background-color:#ffffff;z-index:2;}
#ce2 iframe {background-color:#ffffff;width:590px;height:350px;margin-bottom:10px;}


/* --- barcode ----------- */
#barcodewhite {width:auto;}
#barcodewhite td {background-color:#fff;text-align:center;}
#barcode {display:block;margin:0;padding:0;list-style-type:none;}
#barcode li {width:1px;height:60px;margin:0;padding:0;background:none;float: left;}
#barcodein {width:480px;text-align:center;font-size:40px;height:50px;}
#barcodeinSub {width:50px;font-size:30px;height:55px;}