#scroller {
 //   z-index: -1;
    position: fixed;
    width: 50000px;
    top: 0px;
}

.scrollcol {
    position: relative;
    float: left;    
}



.scrollitem.activeitem {
    visibility: visible;   
}

.scrollcol.activecol .scrollitem {
    visibility: visible;    
//   -webkit-filter: blur(0px);  
    opacity: 1.0;
}

.scrollitem {
    opacity: 0.8;
    height: 400px;
    width: 960px;    
    margin-top: 74px;
}

.content1 {
    background: #896188;
    height: 464px;
    width: 950px;
    color: black;
    text-align:justify;
    border-style:solid;
}

.content2 {
    background: #A7A8D1;
    height: 464px;
    width: 950px;
    color: black;
    text-align:justify;
    border-style:solid;
}

.content3 {
    background: #3E73B0;
    height: 464px;
    width: 950px;
    color: black;
    text-align:justify;
    border-style:solid;
}

.content4 {
    background: gray;
    height: 464px;
    width: 950px;
    color: black;
    text-align:justify;
    border-style:solid;
}

.content5 {
    background: black;
    height: 464px;
    width: 950px;
    color: gray;
    text-align:justify;
    border-style:solid;
    border-color: black;
}

@font-face {
    font-family: "Crimefighter";
    src: url('CRIMFBRG.TTF') format("truetype");
}

body {
    background-image: url('img/batman-jim-lee.jpg'), url('img/batman-jim-lee2.jpg');
    background-attachment: fixed;
    background-position: left -80px, right -80px;
    background-color: black;
    background-repeat: no-repeat;
    font-family: Verdana;
    font-size: 62.5%;
    background-color: rgba(0,0,0, .63)
}

p
{
    position: absolute;
    margin-left: 1em;
    margin-right: 1em;
    font-size: 150%;
    margin-top: 0em;
    line-height:130%
}

p.narration
{
    position: relative;
    margin-top: 1em;
 //   width: 200px;
    height: 30px;
    font-family: "Crimefighter";
    text-align: center;
    line-height: 30px;
    display: inline-block;
    background-color: yellow;
    border: 2px solid black;
    -webkit-box-shadow: 2px 2px 4px black;
    -moz-box-shadow: 2px 2px 4px black;
    box-shadow: 2px 2px 4px black;
    color: black;
}

#modalnarration
{
    height: 60px;
    font-size: 1em;
}

::-webkit-scrollbar { 
    display: none; 
}

.speech
{
    font-family: "Crimefighter";
    font-size: 1.5em;
    margin-left: 420px;
    margin-top: 40px;
    position: relative;
    width: 300px;
    height: 50px;
    text-align: center;
    line-height: 50px;
    background-color: #fff;
    border: 2px solid black;
    -webkit-border-radius: 30px;
    -moz-border-radius: 30px;
    border-radius: 30px;
    -webkit-box-shadow: 2px 2px 4px black;
    -moz-box-shadow: 2px 2px 4px black;
    box-shadow: 2px 2px 4px black;
    padding: 5px;
}

.speech:before
{
    content: ' ';
    position: absolute;
    width: 0;
    height: 0;
    left: 30px;
    top: 50px;
    border: 23px solid;
    border-color: black transparent transparent black;
}

.speech:after
{
    content: ' ';
    position: absolute;
    width: 0;
    height: 0;
    left: 32px;
    top: 50px;
    border: 20px solid;
    border-color: #fff transparent transparent #fff;
}

#seduction{
    margin-left: 1em;
    margin-top: 0px;
    width: 630px;
    height: 200px;
    line-height: 25px;
}

#seduction:before{
    left: 30px;
    top: 210px;
}

#seduction:after{
    left: 32px;
    top: 210px;
}

#badly{
    margin-left: 220px;
    margin-top: 0px;
    width: 705px;
    height: 130px;
    line-height: 25px;
}

#badly:before{
    left: 30px;
    top: 140px;
}

#badly:after{
    left: 32px;
    top: 140px;
}

.translation{
    margin-top: 170px;
    font-family: Verdana;
    font-size: 1.3em;
    padding: 1em;
}

#sedutrans
{
    margin-top: 80px;
}

hr{
    border-bottom-color: black;
}

#nagonka {width: 320px}

.alignLeft { float:left; margin-right: 1em; margin-top: 1em; margin-bottom: 1em; width: 25%; height: auto;}
.alignRight { float:right; margin-left: 1em; margin-top: 1em; margin-bottom: 1em; width: 25%; height: auto;}

#img1 {width: 29%; margin-top: 0.3em;}
#img2 {width: 60%;}
#img3 {width: 100%;}
#img6 {width: 19%; margin-top: 0.3em;}
#img7 {width: 29%; margin-top: 0.3em;}
#img8 {width: 21%; margin-top: -9em;}
#img9 {width: 30%; margin-top: 0.3em;}
#img10 {width: 28%; margin-right: 1em; margin-top: 6em;}
#img11 {width: 51%; border-bottom: solid 29px;}
#img12 {width: 30%; margin-top: 0.3em;}
#img13 {width: 27%; margin-top: 0.3em;}
#img16 {width: 29%; margin-top: 0.3em;}
#img17 {width: 30%; margin-top: 0.3em;}
#img18 {width: 31%; margin-top: 0.3em;}
#img19 {width: 30%; margin-top: 0.3em;}
#img20 {width: 28%; margin-top: 0.3em;}
#img21 {width: 29%; margin-top: 0.3em;}
#img22 {width: 875px; margin-left: 1.6em; margin-top: 0.8em}
#img23 {width: 27%; margin-top: 0.3em;}
#img24 {width: 40%;}
#img26 {width: 25%; margin-top: 0.3em;}
#img27 {width: 25%; margin-top: 0.3em;}
#img28 {width: 32%; margin-top: 0.3em; margin-bottom: 0em}
#img29 {width: 30%;}
#img30 {width: 45%; margin-top: 0.3em;}
#img31 {width: 805px; margin-left: 3.9em; margin-top: 0.6em}
#img32 {width: 25%; margin-top: 0.3em;}
#img34 {width: 25%; margin-top: 0.3em;}
#img35 {width: 780px; margin-left: 4.5em; margin-top: 0.8em}
#img36 {width: 33%; margin-top: 0.3em;}
#img37 {width: 23%; margin-top: 0.3em;}
#img38 {width: 58%; margin-top: 0.3em;}
#img39 {width: 64%; margin-top: 0.3em;}
#img40 {width: 34%; margin-top: 0.3em;}
#img41 {width: 40%; margin-top: 0.3em;}
#img42 {width: 65%; margin-top: 0.3em;}

#up {width: 40%; margin-left: 10%; margin-top: 2%;}

#wertham {text-align: right; margin-left: 36px;}

dl{
    position: absolute;
    margin-left: 500px;
    margin-right: 1em;
    font-size: 130%;
    margin-top: 90px;
    line-height:130%;
    border: 3px solid black;
    background-color: #FFFFCC;
    padding: 1em;
}

.timeline {
    position: fixed;
    z-index: +1;
    border-style:solid;
    border-color: black;
}

#last {
  #  height: 100000px;
}

.ui-page-active {
    outline: none !important;
}