@font-face {
        font-family: Aller;
        src: url("./otf/Aller_Rg.ttf") format("truetype");
        font-style: normal;
    }
@font-face {
        font-family: Aller;
        src: url("./otf/Aller_Rg.ttf") format("truetype");
        font-style: bold;
    }
@font-face {
        font-family: Aller;
        src: url("./otf/Aller_Rg.ttf") format("truetype");
        font-style: italic;
    }

@font-face {
        font-family: AllerDisplay;
        src: url("./otf/AllerDisplay.ttf") format("truetype");
        font-style: normal;
    }

body {
    margin:0px;
    padding:0px;
    background:#000;
    color:black;
    font: 16px Aller, Cambria, Palatino, Palatino Linotype, Times, Times New Roman, serif;
    overflow:hidden;
}

article {
    -webkit-column-break-inside:inherit;
    display:block;
    margin:30px auto 0 auto;
    padding:0;
    height:700px;
    overflow:hidden;
}

section {
    -moz-border-radius: 15px; 
    -webkit-border-radius: 15px; 
    border: 0px solid #000;    
    margin:0 auto;
    padding:0;
    display:block;
    height:700px;
    width:1024px;
    background:#eee url('./img/grunge.jpg') no-repeat top left;
}

.video {
	margin: 0 auto;
	padding: 0 auto;
	display: block;
}

#viewport {
    position:relative;
    -webkit-transition: top 0.75s ease;
    -moz-transition: top 0.75s ease;
    top:0px;
}

section h1 {
    font: 100px AllerDisplay, Cambria, Palatino, Palatino Linotype, Times, Times New Roman, serif;
    margin: 0px 10px;
    text-align:center;
}

section h2 {
    font: 30px AllerDisplay, Cambria, Palatino, Palatino Linotype, Times, Times New Roman, serif;
    margin: 0px 10px;
    text-align:center;
}

section#blick h1 {
    color: #dfcebe;
    text-shadow: 0px 0px 13px #615a50;
    line-height:110px;
    padding: 25px 0px 0px 0px;
}

section#wasted h1 {
    color: #b50000;
    text-shadow: 0px 0px 13px #615a50;
    line-height:110px;
    padding: 25px 0px 0px 0px;
}

section#DNmta h1 {
    color: #661D00;
    text-shadow: 0px 0px 13px #615a50;
    line-height:110px;
    padding: 20px 0px 0px 0px;
}

section#title h2 {
    color: #dfcebe;
    text-shadow: 0px 0px 19px #615a50;
    line-height:35px;
    padding: 0px;
}


.columntext{
    column-count: 3;
    column-gap: 45px;
    -webkit-column-count: 3;
    -webkit-column-gap: 45px;
    -moz-column-count: 3;
    -moz-column-gap: 45px;
    text-align:justify;
}

section#blick .columntext {
    margin:30px 30px;
    height:110px;
    display:block;
    color: #dfcebe;
    background-color:rgba(0,0,0,0.45);
    -moz-border-radius: 15px; 
    -webkit-border-radius: 15px; 
    -webkit-box-shadow: 0px 0px 50px rgba(0, 0, 0, 0.9);
    -moz-box-shadow: 0px 0px 50px rgba(0, 0, 0, 0.9);
    padding:10px;
    text-shadow: 0px 2px 3px #000;
    text-align:justify;
    column-count: 3;
    column-gap: 45px;
    -webkit-column-count: 3;
    -webkit-column-gap: 45px;
    -moz-column-count: 3;
    -moz-column-gap: 45px;
}

section#wasted .columntext {
    margin:30px 30px;
    height:110px;
    display:block;
    color: #dfcebe;
    background-color:rgba(0,0,0,0.45);
    -moz-border-radius: 15px; 
    -webkit-border-radius: 15px; 
    -webkit-box-shadow: 0px 0px 50px rgba(0, 0, 0, 0.9);
    -moz-box-shadow: 0px 0px 50px rgba(0, 0, 0, 0.9);
    padding:10px;
    text-shadow: 0px 2px 3px #000;
    text-align:justify;
    column-count: 3;
    column-gap: 45px;
    -webkit-column-count: 3;
    -webkit-column-gap: 45px;
    -moz-column-count: 3;
    -moz-column-gap: 45px;
}

section#DNmta .columntext {
    margin:20px 20px;
    height:90px;
    display:block;
    color: #dfcebe;
    background-color:rgba(0,0,0,0.45);
    -moz-border-radius: 15px; 
    -webkit-border-radius: 15px; 
    -webkit-box-shadow: 0px 0px 50px rgba(0, 0, 0, 0.9);
    -moz-box-shadow: 0px 0px 50px rgba(0, 0, 0, 0.9);
    padding:10px;
    padding-bottom:-5px;
    text-shadow: 0px 2px 3px #000;
    text-align:justify;
    column-count: 3;
    column-gap: 45px;
    -webkit-column-count: 3;
    -webkit-column-gap: 45px;
    -moz-column-count: 3;
    -moz-column-gap: 45px;
}

p {
    line-height:21px;
    word-wrap:break-word;
    padding: 0px 0px 0px 0px;
    margin: 0px 0px 20px 0px;
}


nav {
    display:block;
    margin:30px 0 0 0;
    padding:0 0 0 0;
    text-align:center;
    width:100%;
    opacity:0.2;
    -webkit-transition: opacity 0.5s ease;
    -moz-transition: opacity 0.5s ease;
}

nav:hover {
    opacity:0.8;
}

nav img {
    width:110px;
    padding:10px;
    -webkit-transition: width 0.5s ease;
    -moz-transition: width 0.5s ease;
    -moz-border-radius: 25px; 
    -webkit-border-radius: 25px; 
}

nav a {
    -moz-border-radius: 25px; 
    -webkit-border-radius: 25px; 
}

nav img:hover {
    width:120px;

}

footer {
    display:block;
    margin:0;
    padding:0;
    font-size:10px;
    text-align:right;
}
    
a {
    color:#fff;
    font-style:italic;
    text-decoration:none;
}
    
img {
    -webkit-column-break-inside:avoid;
    border:0px;
}