/* =============================================================================
   HTML5 Boilerplate CSS: h5bp.com/css
   ========================================================================== */




article, aside, details, figcaption, figure, footer, header, hgroup, nav, section { display: block; }
audio, canvas, video { display: inline-block; *display: inline; *zoom: 1; }
audio:not([controls]) { display: none; }
[hidden] { display: none; }

html { font-size: 100%; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; }
html, button, input, select, textarea { font-family: sans-serif; color: #222; }
body { margin: 0; font-size: 1em; line-height: 1.4; }

::-moz-selection { background: #fe57a1; color: #fff; text-shadow: none; }
::selection { background: #fe57a1; color: #fff; text-shadow: none; }

.takemale a, a.takemale { color: rgb(23,100,117);  text-decoration: none; border-bottom: 1px solid rgb(255,153,51);}
.takemale a:hover, a.takemale:hover { color: rgb(255,153,51);  text-decoration: none; border-bottom: none;}
a { color: rgb(23,100,117);  text-decoration: none; border-bottom: 1px solid rgb(255,153,51);}
a.no_border {border: none; text-decoration: none}
/* a:visited { color: #551a8b; } */
a:hover {  color: rgb(255,153,51);  text-decoration: none; border-bottom: none;}
a:focus { outline: thin dotted; }
a:hover, a:active { outline: 0; }

abbr[title] { border-bottom: 1px dotted; }
b, strong { font-weight: bold; }
blockquote { margin: 1em 40px; }
dfn { font-style: italic; }
hr { display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0; }
ins { background: #ff9; color: #000; text-decoration: none; }
mark { background: #ff0; color: #000; font-style: italic; font-weight: bold; }
pre, code, kbd, samp { font-family: monospace, serif; _font-family: 'courier new', monospace; font-size: 1em; }
pre { white-space: pre; white-space: pre-wrap; word-wrap: break-word; }
q { quotes: none; }
q:before, q:after { content: ""; content: none; }
small { font-size: 85%; }

sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }
sup { top: -0.5em; }
sub { bottom: -0.25em; }

ul, ol { margin: 1em 0; padding: 0 0 0 40px; }
dd { margin: 0 0 0 40px; }
nav ul, nav ol { list-style: none; list-style-image: none; margin: 0; padding: 0; }

img { border: 0; -ms-interpolation-mode: bicubic; vertical-align: middle; }

svg:not(:root) { overflow: hidden; }

figure { margin: 0; }

form { margin: 0; }
fieldset { border: 0; margin: 0; padding: 0; }
label { cursor: pointer; }
legend { border: 0; *margin-left: -7px; padding: 0; white-space: normal; }
button, input, select, textarea { font-size: 100%; margin: 0; vertical-align: baseline; *vertical-align: middle; }
button, input { line-height: normal; }
button, input[type="button"], input[type="reset"], input[type="submit"] { cursor: pointer; -webkit-appearance: button; *overflow: visible; }
button[disabled], input[disabled] { cursor: default; }
input[type="checkbox"], input[type="radio"] { box-sizing: border-box; padding: 0; *width: 13px; *height: 13px; }
input[type="search"] { -webkit-appearance: textfield; -moz-box-sizing: content-box; -webkit-box-sizing: content-box; box-sizing: content-box; }
input[type="search"]::-webkit-search-decoration, input[type="search"]::-webkit-search-cancel-button { -webkit-appearance: none; }
button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; }
textarea { overflow: auto; vertical-align: top; resize: vertical; }
input:valid, textarea:valid {  }
input:invalid, textarea:invalid { background-color: #f0dddd; }


.chromeframe { margin: 0.2em 0; background: #ccc; color: black; padding: 0.2em 0; }



/* ===== Primary Styles ========================================================
   Author:
   ========================================================================== */
/*                  header                              */
header {
z-index: -5;
}
header #sun {
position: absolute;
top: 0px;
right: 0px;
}
header #cl1 {
position: absolute;
top: 0px;
left: 0px;
}
#wrapper {
/*
position: relative;
border: 1px solid red;
*/
}


/*                  main page                           */
#social_box {
border: 1px solid red;
position: absolute;
top: 400px;
}
#total_wrap_tw { min-height: 100%; }
#outer_tw {
        overflow: auto;
        padding-bottom: 815px; /* height of main box + footer height */
}
#statuse {
font-weight: normal;
text-align: center;
position: relative;
top: 335px;
letter-spacing: 0.1em;
}
#wrapper_tw {
background: url(../img/dude.png) center 17px no-repeat;
z-index: 5;
position: relative;
margin-top: -815px;
height: 815px;
width: 100%;
clear: both;
}

#inner_main {

left: 34px;
}
#main {
border: 1px solid red;
}
#footer_tw {
z-index: -2;
height: 65px;
position: absolute;
bottom: 0;
width: 100%;
}
/*                  boxer                               */
#boxer {
position: absolute;
top: 10px;
right: 50%;
margin-right: 80px;
}

/*                  about                               */
#about_m {
position: relative;
top: 200px;
left: -6px;
}
/*                  experymenty                               */
#experymenty {
position: absolute;
top: 635px;
left: 25%;
width: 72px;
}
#experymentytip {
background: url("../img/expr_t.png") no-repeat scroll center center transparent;
    display: block;
    height: 94px;
    left: -85px;
    overflow: hidden;
    position: absolute;
    top: -85px;
    width: 127px;
        z-index: -3;
}

/*                  book and topka                             */
#connecta2{
position: absolute;
top: 200px;
left: 50%;
height: 468px;
width: 42%;
margin-left: 74px;
background: url("../img/con2.png") no-repeat scroll top left transparent;
z-index:-3;
}

#book {
position: absolute;
top: 406px;
right: 0;
display: block;
height: 187px;
width: 88px;
z-index: 3;
}
#booktip {
background: url("../img/book_t.png") no-repeat scroll center center transparent;
    display: block;
    height: 90px;
    left: -40px;
    overflow: hidden;
    position: relative;
    top: -306px;
    width: 90px;
        z-index: -3;
    
}
#topka {
position: absolute;
top: 442px;
right: 10%;
display: block;
z-index: 4;
text-align: center;
}
#ftopku {
font-size: 0.9em;
font-family: 'fq', sans-serif;
text-transform: uppercase; 
position: relative;
top: 15px;
}
#topkatip {
background: url("../img/topka_t.png") no-repeat scroll center center transparent;
    display: block;
    height: 59px;
    left: -70px;
    overflow: hidden;
    position: relative;
    top: -80px;
    width: 95px;
        z-index: 3;
}

/*                  twi-twi                             */
#wrap-twi {
position: absolute;
top: 60px;
left: 0px;
}
#twitwi {
z-index: 3;
position: absolute;
top: 162px;
left: 50%;
margin-left: 90px;
margin-right: 10px;
}
#twitip {
background: url("../img/twi_t.png") no-repeat scroll center center transparent;
    display: block;
    height: 96px;
    left: 30px;
    overflow: hidden;
    position: relative;
    top: -160px;
    width: 144px;
z-index: 3;
    
}
.buble {
margin-top: 10px;
margin-left: 70px;
border: 2px solid orange;
-moz-border-radius: 15px;
border-radius: 15px;
padding: 5px 15px 5px 15px;
background: #fff;
}
span.newwin {
background: url("../img/newwin.gif") no-repeat scroll center center transparent;
display: inline-block;
margin-left: 6px;
    height: 14px;
    width: 14px;
}

ins.tail {
background: url("../img/btail.png") no-repeat scroll center center transparent;
margin-top: -20px;
    display: block;
    height: 23px;
    left: 10px;
    overflow: hidden;
    position: relative;
    top: 28px;
    width: 24px;

}


/*                  zhe-zhe                             */
#wrap-zhezhe {
position: absolute;
top: 63px;
left: 0px;
}
#zhezhe {
position: absolute;
top: 243px;
left: 50%;
margin-left: 205px;
margin-right: 10px;
}

#zhetip {
background: url("../img/zhezhe_t.png") no-repeat scroll center center transparent;
    display: block;
    height: 61px;
    left: 100px;
    overflow: hidden;
    position: relative;
    top: -8px;
    width: 279px;
    
}

/*                  photozhaba                             */
#photozhaba {
position: absolute;
top: 220px;
right: 50%;
margin-right: 243px;
}
#photozhabatip {
background: url("../img/photozhaba_t.png") no-repeat scroll center center transparent;
    display: block;
    height: 54px;
    right: 50%;
margin-right: 34px;
    overflow: hidden;
    position: absolute;
    top: -30px;
    width: 124px;
}

/*                  mouse                       */
#wrap_krisa {
position: absolute;
overflow: hidden;
top: 400px;
left: 0;
display:block;
height: 196px;
width: 50%;
}
#con1 {
margin-right: 200px;
margin-left: 140px;
height: 126px;
display:block;
background: url("../img/con1.png") no-repeat scroll 0 0 transparent;
}
#krisa {
position: absolute;
top: 10px;
left: 75px;
}
#krisatip {
background: url("../img/krisa_t.png") no-repeat scroll center center transparent;
    display: block;
    height: 87px;
    left: 20px;
    overflow: hidden;
    position: relative;
    top: 5px;
    width: 171px;
    
}


/*                  scho novogo                                 */

#wrap_scho_novogo {
position: absolute;
top: 330px;
left: 50%;
margin-left: -160px;
}
.scho_novogo {
width: 320px;
height: 170px;
}
.koly {
font-style: italic;
font-size: 0.7em;
color: rgb(23,100,117);
margin-bottom: 50px;

}
.scho_novogo {
font: 1.2em/1em Arial, Helvetica, sans-serif;
color: rgb(23,100,117);
}
.scho_novogo p a {
color: rgb(23,100,117);
text-decoration: none;
border-bottom: 1px solid orange;
}
.scho_novogo p a:hover {
color: orange;
text-decoration: none;
border-bottom: none;

}

div.fadenav { position: absolute; top: 5px; right: 5px; }
div.fadenav a { display: block; background: #ccc; width: 12px; height: 12px; margin: 0 0 0 2px; float: left; overflow: hidden; -moz-border-radius: 50%; -webkit-border-radius: 50%; border-radius: 50%; border: 1px solid #000; }
div.fadenav a:hover { text-decoration: none; }
div.fadenav a.current { background: #c00; }

/*                  footer                      */
/*                          _____________                       */
* {margin: 0; padding: 0}

html, body { height: 100%; }
#total_wrap {
min-height: 100%;
background: transparent url('../img/head_r.png') top right no-repeat;
}
#outer {
background: transparent url('../img/head_l.png') top left no-repeat;
overflow: auto;
padding-bottom: 65px;

}  /* must be same height as the footer */
#total_wrap_tw{
min-height: 100%;
background: transparent url('../img/head_r.png') top right no-repeat;
}
#outer_tw {
background: transparent url('../img/head_l.png') top left no-repeat;
overflow: auto;

}  /* must be same height as the footer */

#wrapper {
min-height: 100%;
}
#main {
overflow: auto;
padding-bottom: 65px;
}

#footer {
z-index: 6;
position: relative;
margin-top: -65px;
height: 65px;
width: 100%;
clear: both;
	} 
/*Opera Fix*/
body:before {/* thanks to Maleika (Kohoutec)*/
content:"";
height:100%;
float:left;
width:0;
margin-top:-32767px;/* thank you Erik J - negate effect of float*/
}




#copyrrr {float: left;}
#outer_footer, #outer_footer_tw{
padding: 10px 20px;
border-top: 8px solid rgb(27, 100, 117); 
}

#phrase {float: right; padding-right: 70px; position: relative; padding-left: 1.5em}
#phrase strong {
color: rgb(255,153,51);
position: absolute;
top: -0.2em;
left: 0;
font-size: 2.3em;
font-family: 'fq', sans-serif;
text-transform: uppercase; 
font-style: bold;
}



/*                          _____________                       */
/*                          Internal pages                      */
#wrap_navigate {
position: absolute;
top: 10px;
right: 200px;
}
#navigate {
text-align: left;
text-transform: uppercase; 
font-size: 0.8em;
font-family: 'fq', arial, sans-serif;
font-style: bold;
color: rgb(27, 100, 117); 
padding: 0.3em;
}
#navigate span {
background-color: rgb(255,153,51);
padding: 0 0.2em 0 2.6em;
}
#navigate span a { color: white; border: none;}
#navigate span:hover { background-color: rgb(27, 100, 117); color: white; border: none;}
#navigate #urhere {
text-transform:none;
position: relative;
top: -18px;
left: 27px;
}

#nav_b { position: relative; top: 17px; }
#nav_e {position: relative; top: 35px; left: -30px;}

#navigate #aster {
font-size: 2em;
padding: 0;
background-color: transparent;
}

ins#bgleft {
    position: absolute;
background: url("../img/bgleft.png") no-repeat scroll center center transparent;
margin-top: 80px;
    display: block;
    height: 662px;
    left: 0px;
    overflow: hidden;
    top: 0px;
    width: 632px;
z-index: -3;
}


ins#bgright {
    position: absolute;
background: url("../img/bgright.png") no-repeat scroll center center transparent;
margin-top: 50px;
    display: block;
    height: 618px;
    right: 0px;
    overflow: hidden;
    top: 50px;
    width: 868px;
z-index: -3;
}
/*
#main_inner {
height: 840px;
background: url("../img/dude.png") no-repeat scroll center bottom transparent;
border: 1px solid red;
width: 70%;
margin-left: 15%;
}
*/

#inner {
padding-top: 125px;
width: 70%;
margin-left: 15%;
}

#inner h1 {
margin-bottom: 2.5em;
}

#texta { width: 80%;}

#texta.promo {
font-size: 1.8em;
font-family: 'fq', sans-serif;
text-transform: uppercase; 
font-style: bold;
text-decoration: none;
}

#texta.promo p {margin-bottom: 0.3em}


#bookbody {
width: 285px;
margin-top: 80px;
margin-left: 110px;
z-index: 3;
}

#commenty {
position: absolute; top: 370px;
left: 20px;
width: 10%;
font-size: 0.7em;
}
#commenty span {
background-color: #FFf;
}

.innerbook {
position: absolute;
display: block;
top: -120px;
right: 0;
width: 50%;
background: url("../img/book_bg.png") no-repeat scroll top left transparent;
height: 673px;
z-index: -4;
}


h3 {
font-size: 2.3em/1.1em;
font-family: 'fq', sans-serif;
text-transform: uppercase; 
font-style: bold;
text-decoration: none;
margin: 120px 0 0 0;
padding: 0;
}

/*                      shindler                                */
#shindlerlist {
border-top: 3px solid rgb(27, 100, 117);
font-family: 'fq', sans-serif;
text-transform: uppercase; 
padding-top: 3em;
}

.centrus { text-align: center; }
.leftus { text-align: left; }
.rightus { text-align: right; }

.bigus { font-size: 2.3em; }

/*                      social                               */
#social_buble {
font-family: 'fq', arial, sans-serif;
text-transform: uppercase;
color: rgb(255,153,51); 
font-size: 3em;
border: 4px solid rgb(255,153,51);
-moz-border-radius: 5px;
border-radius: 5px;
padding: 5px 15px 5px 15px;
background: #fff;
z-index: 4;
position: absolute;
bottom: 317px;
right: 250px;
}
div.social {
margin-bottom: 12em;
}
.social p {
padding-bottom: 0.8em;
}
#socialphoto {
position: absolute;
top: -258px;
right: 20px;
z-index: 5;

}

/*                      about me                               */

#aboutmephoto {
position: absolute;
top: -720px;
right: 20px;
z-index: -5;

}
/*                      photozhaba page                               */


/*                      tools page                              */
#intro_tool {
width: 30%;
position: absolute;
top: 250px;
left: 45%;
}
.title_tool {
position: relative;
top: -13px;
left: 115px;
}
#jakvono {
position: relative;
top: 0px;
left: 30%;
}

#toolsphoto {
position: absolute;
bottom: 64px;
right: 100px;
z-index: 3;

}
/*                      tools/howru page                               */
#jakvononichogo {
font-family: 'fq', Arial, sans-serif;
font-size: 5em;
text-transform: uppercase; 
font-style: bold;
text-align: center;
}
#text-content {
font-size: 2em;
text-align: center;
line-height: 0.8em;
}
#randomizer {
    display: block;
    outline: none;
border: none;
}
#intro_howru {
position: absolute;
right: 100px;
bottom: 100px;
width: 300px;
}

/*                      tools/magic page                               */
table#magic_cards, table#magic_carsd {
margin-top: 3em;
}
table#magic_cards tr td {
width: 80px;
}
table#magic_carsd tr td  {
width: 80px;
}

.magic_text {
width: 50%;
margin-left: 20%;
}

table#magic_cards tr td em, table#magic_carsd tr td em {

font-size: 0.8em;
}
#magic_numbers {
font-family: 'fq', arial, sans-serif;
text-transform: uppercase;
font-size: 17em;
}
/*                      photozhaba page                              */
#photozhaba_tool {
width: 30%;
position: absolute;
top: 250px;
left: 45%;
}

/*                      book page                               */
/* ------------------- */
#but {
border : none;
display : none;
background-color : transparent;
background-image : url('../img/but.png');
background-repeat : no-repeat;
width : 222px;
height : 53px;

}
#after {
margin-top: 9px;
display : none;
font-family: 'fq', arial, sans-serif;
font-size: 1.65em;
text-transform: uppercase;
}

/* ------------------- */
#intro_book {
width: 350px;
position: relative;
top: 20px;
left: 120px;
}
#intro_book {
font-size: 0.8em;
}

#want_counter {
z-index: 3;
}
#countertip {

background: url("../img/counter_t.png") no-repeat scroll center center transparent;
    display: block;
    height: 138px;
     width: 141px;
    overflow: hidden;
    position: relative;
    left: 230px;
    top: -162px;
    
}
#booktext {
position: absolute;
top: 150px;
left: 50%;
padding-left: 140px;
width: 350px;
z-index: 1;
}
#booktext h2 {
margin-top: 3.5em;
font-size: 1.3em;
font-family: 'fq', sans-serif;
text-transform: uppercase; 
font-style: bold;
}

#counter {
position: relative;
top: 147px;
left: 0;
font-family: 'fq', arial, sans-serif;
font-size: 2.15em;
text-transform: uppercase;
z-index: 7;
display: block;
}


#planbook {
position: absolute;
display: block;
top: 150px;
left: 30px;
background: url("../img/planbook.png") no-repeat scroll top left transparent;
z-index: -4;
width: 50%;
height: 386px;
overflow: hidden;
}
#planbook span {
font-family: 'fq', arial, sans-serif;
font-size: 3.0em;
color: rgb(27, 100, 117); 
position: relative;
top: 17px;
left: 12px;
}
#motivateme {
position: absolute;
top: 555px;
left: 7%;
width: 300px;
z-index: 10;

}
#pushme {
position: relative;
top: 370px;
margin-left: 20%;
}

/*                          CLASSES                                     */
.lfquote {
margin-left: -0.6em;
}

.greener { color: rgb(27, 100, 117); }
.oranger, #texta p span { color: rgb(255,153,51); }


@font-face {
    font-family: 'fq';
    src: url('fq.eot');
    src: url('fq.eot?#iefix') format('embedded-opentype'),
         url('fq.woff') format('woff'),
         url('fq.ttf') format('truetype'),
         url('fq.svg#fq') format('svg');
    font-weight: normal;
    font-style: normal;
}


h1 {
font-family: 'fq', arial, sans-serif;
    font-weight: normal;
    font-style: normal;
letter-spacing: 0.05em;
font-size: 2em;
text-transform: uppercase; 
text-decoration: none;
margin: 0;
padding: 0;
text-align: center;
}
h1 ins {
background-color: rgb(255,153,51);
height: 4px;
width: 70px;
display: block;
margin: 0 auto;
}
h1 img {
position: relative;
top: -3px;
}
.textyk {
width: 25%;
font-size: 1.5em;
}

.takemale{
font-size: 0.8em;
color: rgb(23,100,117)
}
.takemale a, a.takemale { color: rgb(23,100,117);  text-decoration: none; border-bottom: 1px solid rgb(255,153,51);}
.takemale a:hover, a.takemale:hover { color: rgb(255,153,51);  text-decoration: none; border-bottom: none;}


/* =============================================================================
   Media Queries
   ========================================================================== */

@media only screen and (min-width: 35em) {
	/* Style adjustments for viewports that meet the condition */
}
/* =============================================================================
   IE fixes
   ========================================================================== */
.ie7 #wrap {display:table;height:100%}



/* =============================================================================
   Non-Semantic Helper Classes
   ========================================================================== */

.ir { display: block; border: 0; text-indent: -999em; overflow: hidden; background-color: transparent; background-repeat: no-repeat; text-align: left; direction: ltr; *line-height: 0; }
.ir br { display: none; }
.hidden { display: none !important; visibility: hidden; }
.visuallyhidden { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; }
.visuallyhidden.focusable:active, .visuallyhidden.focusable:focus { clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto; }
.invisible { visibility: hidden; }
.clearfix:before, .clearfix:after { content: ""; display: table; }
.clearfix:after { clear: both; }
.clearfix { *zoom: 1; }

/* =============================================================================
   Print Styles
   ========================================================================== */
 
@media print {
  * { background: transparent !important; color: black !important; box-shadow:none !important; text-shadow: none !important; filter:none !important; -ms-filter: none !important; } /* Black prints faster: h5bp.com/s */
  a, a:visited { text-decoration: underline; }
  a[href]:after { content: " (" attr(href) ")"; }
  abbr[title]:after { content: " (" attr(title) ")"; }
  .ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; }  /* Don't show links for images, or javascript/internal links */
  pre, blockquote { border: 1px solid #999; page-break-inside: avoid; }
  thead { display: table-header-group; } /* h5bp.com/t */
  tr, img { page-break-inside: avoid; }
  img { max-width: 100% !important; }
  @page { margin: 0.5cm; }
  p, h2, h3 { orphans: 3; widows: 3; }
  h2, h3 { page-break-after: avoid; }
}