/*
Name: DAY - Main Style Sheet
Author: Ludek Cernocky; ludek@faceit.cz, www.faceit.cz
Date: 10.1.2009
Note: Don´t steal, just watch and learn. This CSS is copyrighted like all other stuff on this domain ;)
*/

/*
1. General
2. Construction
3. Header
4. Content
5. Menu
6. Footer
7. Additional graphics

*/

/* 1. GENERAL
---------------------- */
* {margin:0; padding:0;}

body {background: url('../img/day/bg-fluid.jpg') repeat 50% 600px; color: #231406; font-family: serif; font-size: medium; text-align: center;/* for older browsers */}

.hide, hr {display: none;}

input, textarea {color: Black; font-family: sans-serif; font-size: 100%;}
/*
Google Chrome hack - breaking that stupid Chrome border styling. Adding border to every input type=text and password, every textarea and all select boxes. Works for: Opera 9.6+, Safari 3.1 and Chrome
*/
body:nth-of-type(1) input[type="text"], body:nth-of-type(1) input[type="password"], body:nth-of-type(1) textarea, body:nth-of-type(1) select {border: 1px solid #AAA;}

fieldset {border: none;}

.clear {clear: both; height: 0px; display: block; visibility: hidden;} /* modern browsers dont need this, IE 6 + 7 does - so they have special treatment in own IE.CSS stylesheet */

img {border: none; font-size: 13px;}

/* links */
a {color: #3D2309; outline: none;}
a:hover, a:focus {color: Black; text-decoration: none;}
a:focus {background: #E3D5BE;}

/* headlines */
h1 {font-size: 200%;}
h2 {font-family: Georgia, "New York CE", utopia, sans-serif; font-size: 117.6%; font-size: 1.8em; line-height: 40px; letter-spacing: -2px; height: 40px;}
h3 {font-size: 1.4em;}

/* align */
.left {text-align: left;}
.center {text-align: center !important;}
.right {text-align: right;}

/* floats */
.float-left {float: left;}
.float-right {float: right;}

table {border-collapse: collapse; font-size: 100%;}

/* 2. CONSTRUCTION
---------------------- */
#all {background: url('../img/day/bg.jpg') repeat-x 50% 0; font-size: 106.3%;}
#main {margin: 0 auto; padding: 141px 0 0 0; position: relative; width: 980px;}

#main>p.hide {display: block; position: absolute; left: -9999px; top: 0;}

/* 3. HEADER */
#header h1 {display: none;}
#header p {font-size: 80%; position: absolute; left: 446px; top: 6px; overflow: hidden; width: 89px; height: 135px; z-index: 100;}
#header p a {padding-top: 40px;}
#header p a, #header p a span {color: Black; cursor: pointer; display: block; overflow: hidden; position: relative; width: 89px; height: 95px;}
#header p a span {background: url('../img/day/switch.jpg') no-repeat 0 -135px; position: absolute; top: 0; left: 0; height: 135px; z-index: 15;}
#header p a em {background: url('../img/day/switch.jpg') no-repeat 0 0; cursor: pointer; display: block; position: absolute; left: 0; top: 0; height: 135px; width: 89px; z-index: 10;}
#header blockquote {background: url('../img/day/mp3.jpg') no-repeat 0 0; color: #D3BE89; /* font-size: 64.7%; */ font-size: 11px; height: 37px; width: 227px; position: absolute; right: 116px; top: 135px; text-transform: uppercase; z-index: 150;}
#header blockquote em {font-size: 1px; position: relative; top: 6px; height: 24px; width: 24px; margin-right: 8px;}

/* 4. CONTENT */
#content {background: #D6C59E url('../img/day/content/repeat.jpg') repeat-y 50% 0; min-height: 600px; position: relative; text-align: left; z-index: 60; width: 980px;}
#content .inside {background: url('../img/day/content/top.jpg') no-repeat 50% 0; min-height: 600px;}

/* real content */
#content .content {text-align: left; margin: 0 0 0 102px; padding: 100px 60px 10px 60px; width: 656px;}
#content .content h2 {color: #482A0A; margin: 0 auto 15px auto; text-align: center; position: relative; z-index: 15;}
#content .content p, #content .content blockquote {line-height: 140%; margin: 1.2em 0; padding: 0 0 0.8em 0; position: relative; text-align: justify;}
#content .content a {font-style: italic;}
#content .content blockquote.up {display: block; margin: 0.5em 0; padding: 0.3em 0 0.7em 0; text-align: right; text-transform: uppercase;}
#content .content blockquote.up a {font-style: normal;}
#content .content ul {margin: 0;}
#content .content ul li {margin: 0.2em 0 0.2em 1.5em; padding: 0.2em 0.3em;}

/* first letters aka fancy letter */
#content p span.fancy-letter, #content dl dt span.fancy-letter {font-size: 30px;}

/* 4.1 Home */
body.home #content .mail-box {display:inline; float: left; margin: -109px 15px 0px -60px; position:relative; width:321px; height:563px; background:url('/_data/img/day/home/tribune.jpg') no-repeat left bottom; z-index:100;}
body.home #content .mail-box a img {position:absolute; top:0; left:0;}
body.home #content .mail-box form {position:absolute; top:365px; left:0; height:198px; width:321px;}
body.home #content .mail-box form legend {display:none;}
body.home #content .mail-box h3 {text-align: center;}
body.home #content .mail-box fieldset blockquote {font-size: 82.4%; overflow: hidden; margin: 0; padding: 5px 40px 0 45px; text-align: justify;}
body.home #content .mail-box fieldset input {background: url('../img/day/fans/input.jpg') no-repeat 0 0; border: 1px solid #EAE4D2; color: #2A1908; font-size: 72.4%; position:absolute; bottom:43px; left:42px; padding: 3px; width: 173px;}
body.home #content .mail-box fieldset button {background: none; border: none; cursor: pointer; width:60px; height:29px; position:absolute; bottom:43px; right:37px;}


body.home #content h2 {margin: 0 0 15px 277px; padding: 10px 0 5px 0; position: static; text-align: left;}
body.home #content h2 object {margin-left: -10px;}
/*body.home #content p {overflow: hidden;}*/
body.home #content .content blockquote {text-align: center;}
body.home #content .content blockquote a {background: url('../img/day/home/mufin.gif') no-repeat 0 0; padding: 10px; padding-left: 50px;}
body.home #content .content blockquote a:hover {background-position: 0 -76px;}

body.home #content p.second-book {text-align:center; font-size:120%; text-transform:; font-weight:normal; color:#482a0a;}
body.home #content p.second-book em {color:#634812; font-size:120%;}

/* 4.2 Characters */
body.characters #content blockquote, body.journey.inside #content blockquote, body.somnos.inside #content blockquote  {margin: 10px auto 0 auto; padding: 0; position: relative; text-align: center;}
body.characters #content blockquote img, body.journey.inside #content blockquote img, body.somnos.inside #content blockquote img {position: relative; left: -9px; top: 8px;}

body.characters #content address {position: absolute; top: 105px; left: 160px; width: 660px; z-index: 30;}
body.characters #content address span {display: none;}
body.characters #content address a {background: url('../img/day/characters/arrows.gif') no-repeat 0 0; cursor: pointer; display: block; float: left; height: 24px; padding-left: 34px;}
body.characters #content address a:hover {background-position: 0 -140px;}
body.characters #content address a.next {background-position: 100% -76px; float: right; padding-left: 0; padding-right: 34px;}
body.characters #content address a.next:hover {background-position: 100% -216px;}

/* 4.3 Journey */
body.journey .map {position: relative; left: -44px; top: -67px; height: 1009px; width: 745px; z-index: 10;}
body.journey .map ul, body.somnos .somnos ul {font-size: 76.5%; position: absolute; top: 0; left: 0; z-index: 11; width: 100%;}
body.journey .map ul li, body.journey .map ul li a, body.journey .map ul li a span, body.somnos .somnos ul li, body.somnos .somnos ul li a, body.somnos .somnos ul li a span {cursor: pointer; display: block; float: left; list-style:none; margin: 0; padding:0; height: 40px; width: 40px; overflow: hidden; position: absolute;}
body.journey #content .content .map ul li, body.somnos #content .content .somnos ul li {margin: 0; padding: 0;}
body.journey .map ul li a span, body.somnos .somnos ul li a span {left: 0; top: 0;}

body.journey .map ul li.m1 {right: 250px; top: 922px;}
body.journey .map ul li.m1 a span {background: url('../img/day/journey/m1.jpg') no-repeat 0 0;}
body.journey .map ul li.m2 {right: 490px; top: 754px;}
body.journey .map ul li.m2 a span {background: url('../img/day/journey/m2.jpg') no-repeat 0 0;}
body.journey .map ul li.m3 {right: 185px; top: 173px;}
body.journey .map ul li.m3 a span {background: url('../img/day/journey/m3.jpg') no-repeat 0 0;}
body.journey .map ul li.m4 {right: 125px; top: 80px;}
body.journey .map ul li.m4 a span {background: url('../img/day/journey/m4.jpg') no-repeat 0 0;}

body.journey .map ul li a:hover span {background-position: 0 -40px;}

body.journey.inside #content blockquote {margin: -40px auto 0 auto; padding: 0;}
body.journey.inside #content blockquote img {top: 0; left: -40px;}

/* 4.4 Somnos */
body.somnos .somnos {position: relative; left: -50px; top: -32px; z-index: 10;}

body.somnos.inside #content blockquote img {left: -40px; top: 0;}

body.somnos.inside #content address, body.journey.inside #content address, body.making-of.inside #content address {background: url('../img/night/somnos/return.gif') no-repeat 0 0; font-size: 70.6%; margin: 2.5em auto; padding: 0 0 0 28px; position: relative; width: 130px; max-width: 170px; text-align: center; text-transform: uppercase;}
body.somnos.inside #content address a, body.journey.inside #content address a, body.making-of.inside #content address a {background: url('../img/night/somnos/return.gif') no-repeat 100% -27px; font-style: normal; padding-right: 28px;}
body.journey.inside #content address a, body.journey.inside #content address, body.making-of.inside #content address, body.making-of.inside #content address a {background-image: url('../img/day/journey/return.gif')}
body.somnos #content .content .somnos blockquote {font-size: 117.6%; font-style: italic; line-height: 120%; position: absolute; top: 760px; left: 570px; z-index: 30; width:200px; }

/* 4.5 Making Of */
body.making-of #content blockquote {margin:  -1.3em 0 0 0;}
body.making-of #content blockquote em {color: Black;}

body.making-of #content span.img {font-size: 82.4%; display: block; margin: 0; line-height: 120%;}
body.making-of #content span.img:after {content: "."; display: block; height: 0; clear: both; visibility: hidden;} /* clearfix */
body.making-of #content span.img.float-right {margin: 0 0 0 1em;}
body.making-of #content span.img.float-left {margin: 0 1em 0 0;}

/* making of */
body.making-of.inside #content address {width: 175px; max-width: 260px;}
body.making-of.inside #content span.img {margin: 0 0 30px 0;}

/* 4.6 Fans */
body.fans #content .inside {min-height: 700px;}
body.fans #content h2 {margin-bottom: 1.4em;}
body.fans #content dl {font-size: 88.2%; width: 320px;}
body.fans #content dl dt {margin: 0.5em 0 0.1em 0;}
body.fans #content dl dt small {font-size: 86.7%;}
body.fans #content dl dt strong {display: block;}
body.fans #content dl dd {background: url('../img/day/line.gif') no-repeat 50% 100%; margin: 0.2em 0; padding: 0 0.5em 1.5em 0;}
body.fans #content dl dd#fans-pages {background: none; margin: -1em 0 0 0; text-align: center; text-transform: uppercase;}
body.fans #content dl dd#fans-pages a {font-style: normal; text-decoration: none;}

body.fans #content form#mailing-list {position: absolute; left: 490px; top: 155px; width: 330px;}
body.fans #content form#mailing-list legend {display: none;}

body.fans #content form#mailing-list fieldset {background: url('../img/day/fans/tribune.jpg') no-repeat 0 0; margin: 8px 0 0 -15px; height: 262px; padding: 22px 0 0 0; position: relative; width: 376px;}
body.fans #content form#mailing-list fieldset h3 {text-align: center;}
body.fans #content form#mailing-list fieldset blockquote {font-size: 82.4%; max-height: 135px; overflow: hidden; margin: 0; padding: 20px 25px 0 35px; text-align: justify;}
body.fans #content form#mailing-list fieldset input {background: url('../img/day/fans/input.jpg') no-repeat 0 0; border: 1px solid #EAE4D2; color: #2A1908; font-size: 82.4%; margin: 10px 0 0 35px; padding: 3px; width: 244px;}
body.fans #content form#mailing-list fieldset input.button {background: none; border: none; cursor: pointer; font-weight: bold; margin: 0 0 0 5px; text-transform: uppercase; width: auto;}
body.fans #content form#mailing-list fieldset input.button:hover {background: #756B4A; color: White;}

body.fans #content form p.facebook {background: url('../img/day/fans/facebook.gif') no-repeat 0 0; line-height: 120%; margin: 0 0 0 25px; padding: 0 0 0 42px;}
body.fans #content form p.facebook:hover {background-position: 0 -58px;}
body.fans #content form p.facebook a {font-style: normal; text-decoration: none;}

body.fans #content form div.contest {background: #71512B url('../img/day/fans/contest.jpg') no-repeat 0 100%; margin: 15px 0 0 24px; min-height: 170px; width: 322px;}
body.fans #content form div.contest h3 {background: url('../img/day/fans/contest-h3.jpg') no-repeat 0 0; height: 30px; margin: 0; padding: 25px 0 10px 0; text-align: center; width: 322px;}
body.fans #content form div.contest p {font-weight: bold; margin: 0 15px 0 20px;}

/* 4.7 Resources */
body.resources dl {margin: 1em 0; display:block; clear:both;}
body.resources dl dt {margin: 1.4em 0 0.1em 0; display:block; clear:both;}
body.resources dl dd {line-height: 140%; text-align: justify; background: url('../img/day/line.gif') no-repeat 50% 100%; margin: 0.8em 0; padding: 0 0 2em 0; overflow:auto;}


/* 5. MENU */
menu {background: url('../img/day/menu.jpg') no-repeat 0 0; font-size: 82.4%; position: absolute; top: 45px; left:0; overflow: hidden; height: 96px; width: 980px; z-index: 50;}
menu li {display: inline; float: left;}
menu a, menu a span {background-color: #333; color: #CCC; cursor: pointer; display: block; float: left; height: 27px; padding-top: 8px; position: relative; text-align: center; width: 111px;}
menu a span {background: transparent url('../img/day/menu.jpg') no-repeat 0 0; float: none; overflow: hidden; position: absolute; left: 0; top: 0; z-index: 10; height: 35px;}
menu a:hover {color: #99CC00;}
menu a.active, menu a.active span {cursor: default;}
menu a.active span, menu a:hover span, menu a:focus span {background-position: 0 -96px;}

menu .m2 a, menu .m2 a span {width: 113px;}
menu .m2 a span {background-position: -113px 0;}
menu .m2 a.active span, menu .m2 a:hover span, menu .m2 a:focus span {background-position: -113px -96px;}
menu .m3 a, menu .m3 a span {width: 111px;}
menu .m3 a span {background-position: -224px 0;}
menu .m3 a.active span, menu .m3 a:hover span, menu .m3 a:focus span {background-position: -224px -96px;}
menu .m4 a, menu .m4 a span {width: 109px;}
menu .m4 a span {background-position: -335px 0;}
menu .m4 a.active span, menu .m4 a:hover span, menu .m4 a:focus span {background-position: -335px -96px;}

menu .m5 {margin-left: 90px;}

menu .m5 a span {background-position: -534px 0;}
menu .m5 a.active span, menu .m5 a:hover span, menu .m5 a:focus span {background-position: -534px -96px;}
menu .m6 a span {background-position: -645px 0;}
menu .m6 a.active span, menu .m6 a:hover span, menu .m6 a:focus span {background-position: -645px -96px;}
menu .m7 a span {background-position: -756px 0;}
menu .m7 a.active span, menu .m7 a:hover span, menu .m7 a:focus span {background-position: -756px -96px;}
menu .m8 a span {background-position: -867px 0;}
menu .m8 a.active span, menu .m8 a:hover span, menu .m8 a:focus span {background-position: -867px -96px;}

/* pseudo submenu */
.pseudo, .pseudo2 {display:block; width:218px; height:308px; position:absolute; top:84px; left:74px; z-index:300; background:url('/_data/img/day/submenu.png') no-repeat; visibility:hidden;}
.character-list, .blog-list {list-style-type:none; font-size: 82.4%; font-style:italic; line-height:19px; display:block; width:218px; height:296px; padding-top:12px; position:absolute; top:84px; left:74px; z-index:300; visibility:hidden;}
.character-list a, .blog-list a {text-decoration:none;}
.character-list a:hover, .blog-list a:hover {color: Black; text-decoration: underline;}
.character-list a.active, .blog-list a.active {text-decoration:underline;}

.pseudo2 {left:580px; height:117px; background-image:url('/_data/img/day/submenu2.png')}
.blog-list {left:580px; height:109px;}

/* 6. FOOTER */
#footer {background: url('../img/day/footer.png') no-repeat 50% 0; position: relative; top: -15px; margin-bottom: 1px; padding-bottom: 1px; text-align: center; z-index: 60; width: 980px;}

#footer p {padding-top: 45px; text-align: center;}
#footer p a, #footer p a span {cursor: pointer; display: block; margin: 0 auto; position: relative; height: 79px; width: 133px;}
#footer p a {padding-top: 29px; height: 50px;}
#footer p a span {background: url('../img/day/faceit.png') no-repeat 0 0; position: absolute; top: 0; left: 0; margin: 0; z-index: 15;}
#footer p a span:hover {background-position: 0 -79px;}

/* 7. ADDITIONAL SPECIAL GRAPHICS */
#special span {display: block; position: absolute; z-index: 1000;}
body div.fog {position: absolute; width: 100%; height:100%; background: Black; z-index: 5000; top: 0; left: 0;}
#sound {position: absolute; left: 0; top: 0;}
.pointer {font-size: 76.5%;line-height: 140%;  color:#c0b9a7; position:absolute; top:90px; left:397px; width:157px; padding:40px 14px 8px 14px; background:url('/_data/img/day/button-pointer.png') no-repeat; z-index:1000;}

/* error pages */
body.page-not-found #content .inside {background-image: url('../img/day/errors/404.jpg'); height:600px;}
body.page-not-found #content {background: none;}
body.page-not-found #content .inside .content * {position: absolute; left: -9999px; top: 0;}
body.page-not-found #footer {background-image: url('../img/day/errors/404-footer.png')}

/* blogs */
.comments_window {display:none;}

.lista-blogspot {font-weight:bold; text-align:right; clear:both;}
.lista-blogspot a {margin-left:30px; text-decoration:underline; cursor:pointer; cursor:hand;}

.blogspot {clear:both; margin-bottom:40px;}

div#aha {display:none;}
body.bl2 div#aha {display:block; background:url('/_data/img/day/blogs/forest.jpg') no-repeat right top; width:351px;height:297px;position:absolute; right:103px; top:-30px;}
body.bl3 div#aha {display:block; background:url('../img/day/blogs/somnos.jpg') no-repeat right top; width:338px;height:292px;position:absolute; right:105px; top:-40px;}

body.blogs #content .content .blogspot p {margin-bottom:0px;}

body.blogs #content address {display:block; width: 100%; height:24px; margin:0 0 40px 0;}
body.blogs #content address span {display: none;}
body.blogs #content address a {background: url('../img/day/characters/arrows.gif') no-repeat 0 0; cursor: pointer; display: block; float: left; height: 24px; padding-left: 34px;}
body.blogs #content address a:hover {background-position: 0 -140px;}
body.blogs #content address a.next {background-position: 100% -76px; float: right; padding-left: 0; padding-right: 34px;}
body.blogs #content address a.next:hover {background-position: 100% -216px;}

.cmtr {padding-top:50px; background: url('../img/day/line.gif') no-repeat center 25px;}
body.blogs #content .cmtr dd small {text-indent:0px; cursor:default;}

body.blogs #content form.send_comment input {font-size: 86.7%; width:240px; height:25px; line-height:25px; padding:0 6px; background:url('../img/day/blogs/form-name.jpg') no-repeat 0 0; border:none;}
form.send_comment textarea {font-size: 86.7%; width:647px; height:129px; padding:3px 6px; background:url('../img/day/blogs/form-text.jpg') no-repeat; border:none;}
form.send_comment input, form.send_comment textarea, form.send_comment button {margin-top:20px;}
form.send_comment button {color:#231406; background: none; border: none; cursor: pointer; margin:0 0 0 300px; padding:0 6px; font-weight: bold; text-transform: uppercase;}
form.send_comment button:hover {background: #756B4A; color: White;}


.blogspot-image {display:block; text-align:center;}
.blogspot-image img {border: solid 2px #978355; position:relative;}
.i_float {float:left; margin:26px 20px 10px 0px;}

.video_obal {border: solid 2px #978355; float:left; margin:26px 20px 10px 0px;}
.b_video {float:left; position:relative;}