body{
    background-image: url("background.png");
}

.Vinyl {
    animation-name: spinning;
    animation-duration: 5s;
    animation-iteration-count: infinite;
    /* linear | ease | ease-in | ease-out | ease-in-out */
    animation-timing-function: linear;
    width: 280px;
    height: 280px;

    /* 
        display: block;    
    */

    margin-top: 27px;
    margin-left: 32px;
}

.Turntable {
    background-image: url("technics.png");
    background-size: 436px 337px;
    width: 436px;
    height: 337px;
    margin: 20px;
    box-shadow: 0px 5px 15px 3px #969696;
}

@keyframes spinning {
    from { transform: rotate(0deg) }
    to { transform: rotate(360deg) }
}

#container{
    margin: auto;
    width: 70%;
    height: auto;
    background-color: gray;
    padding: 20px;
}

#header{
    height: auto;
    background-color: lightseagreen;
    box-shadow: 7px 7px 0px black;
}

#contentcontainer{
    background-color: lightgray;
    box-shadow: 7px 7px 0px black;
    padding-bottom: 10px;
}

#content{
    height: auto;
}

#formino{
    margin: 20px;
    width: 300px;
    border: 1px solid;
    background-color: lightgray;
    box-shadow: 7px 7px 0px black;
}

#debiandiv{
    text-align: left;
    width: 600px;
    border: 1px solid;
    background-color: #303030;
    box-shadow: 7px 7px 0px black;
}

#sharecontent{
    margin-left: 20px;
    float: left;
    text-align: left;
    width: 450px;
    border: 1px solid;
    background-color: lightgray;
    box-shadow: 7px 7px 0px black;
}

#dashboard{
    padding: 10px;
}


#footer{
    height: auto;
    background-color: lightslategray;
    box-shadow: 7px 7px 0px black;
}

@font-face {
    font-family: 'Bittypix_Monospace';
    src: url('fonts/Bittypix_Monospace.otf') format('opentype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'DeterminationMonoWebRegular';
    src: url('fonts/DeterminationMonoWebRegular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

#terminal {
    font-family: 'DeterminationMonoWebRegular';
    color: white;
    padding: 0px;
    margin: 0px;
}

#lightterminal{
    font-family: 'DeterminationMonoWebRegular';
    color: black;
    padding: 0px;
    margin: 0px;
}

p{
    font-family: 'Bittypix_Monospace';
    padding: 7px;
}

h1{
    font-family: 'Bittypix_Monospace';
    padding: 7px;
}

h3{
    font-family: 'Bittypix_Monospace';
    padding: 7px;
}

h4{
    font-family: 'Bittypix_Monospace';
    font-size: 12px;
    padding: 7px;
}

h5{
    font-family: 'Bittypix_Monospace';
}

label{
    font-family: 'Bittypix_Monospace';
    font-size: 12px;
    padding: 5px;
}

legend{
    font-family: 'Bittypix_Monospace';
    font-size: 15px;
    padding: 5px;
}

input{
    margin: 2px;
    font-family: 'Bittypix_Monospace';
    font-size: 12px;
}

red{
    color: red;
}

#heimdall{
    width: 95%;
    height: 350px;
    border-style: inset;
    border-width: 15px;
}