/* CSS File */

html {
    font-family: 'Arial';
    color: #fff;
}

html, body {
    background: #000;
}

span.i {
    font-style: italic;
}

a {
    color: #52E31D;
}
a:hover {
    color: #4BE200;
}

.fullscreen {
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 1;
    background: no-repeat center center fixed;
    background-size: cover;
}

.timeline {
    position: absolute;
    top: 50px;
    height: 100px;
    margin-top: -50px;
    background: #222;
    width: auto;
    overflow: hidden;
    margin-right:-32767px;
}

.unitlarge {
    position: relative;
    height: 100%;
    text-align: center;
    color: #fff;
    float: left;
    overflow: hidden;
    z-index: 2;
}
.unitlarge h2 {
    margin: 0;
    margin-top: 4%;
    padding: 0;
}

.unitsmall {
    width: 100px;
    height: 50%;
    float: left;
    font-weight: bold;
    overflow: hidden;
}
.unitsmall p {
    margin: 0;
    margin-top: 15%;
    font-size: 18px;
    padding: 0;
}
.unitsmall:nth-child(1n+1) {
    background: rgba(0, 0, 0, .25);
}
.unitsmall:nth-child(2n+2) {
    background: rgba(0, 0, 0, .3);
}

.event {
    background: #193A10;
    border: 2px solid #000F01;
    position: absolute;
    top: 50%;
    margin-top: -7px;
    margin-left: -107px;
    width: 1px;
    height: 1px;
    padding: 5px;
    border-radius: 30px;
    z-index: 10;
    transition: 50ms;
}
.event:hover {
    border: 5px solid #000F01;
    margin-top: -15px;
    margin-left: -115px;
    padding: 10px;
    z-index: 11;
}
.event span {
    display: none;
}

.desc {
    position: fixed;
    top: 40%;
    left: 50%;
    height: 25%;
    width: 50%;
    margin-left: -25%;
}
.descinner {
    z-index: 10;
    position: absolute;
    background: rgba(0, 0, 0, .5);
    padding: 5px;
}
.desc h3 {
    height: 7%;
}
.desc h2{
    height: 15%;
}
.desc p {
    height: 70%;
    overflow-y: auto;
    padding: 2%;
    text-align: justify;
}

.add {
    position: fixed;
    bottom: 10px;
    right: 10px;
    z-index: 1000;
    text-align: right;
    background: rgba(0, 0, 0, 0.7);
    padding: 5px;
}

.arrows {
    position: fixed;
    bottom: 10px;
    left: 10px;
    z-index: 1000;
    text-align: right;
    background: rgba(0, 0, 0, 0.7);
    padding: 5px;
    cursor: pointer;
}
#arrowL:before {
    content: "\25C0";
    font-size: 32px;
    text-decoration: none;
}
#arrowR:before {
    content: "\25B6";
    font-size: 32px;
    text-decoration: none;
}

.load {
    background: url('images/load.gif') no-repeat;
    background-position: center center;
    position: fixed;
    width: 100%;
    height: 100%;
    z-index: 0;
}