* {
    margin: 0;
    padding: 0;


}

body {
    background-color: #000;
}

h1,
p,
a,
h3 {
    color: #fff;
}

input {
    background-color: #555;
    outline: none;
    border: none;
    color: #fff;
    padding: 10px;
    width: 300px;
}

#toparea {
    width: auto;
    margin: auto;
    display: table;
    z-index: 1;
    text-align: center;
    font-family: arial;
    padding: 20px;
    background-color: #222;
    border-radius: 10px;
    margin-top: 50px;
}

#tinp {
    float: left;

}

.vidarea {
    margin: auto;
    display: none;
    margin-top: 100px;
    margin-bottom: 300px;

}

.vidara audio{
    margin: auto;
    display: table;
}

button {
    color: #fff;
    padding: 10px;
    border: none;

}

#submt {
    background-color: #4169e1;
    transition:0.8s;
}

#submt:hover {
    background-color: #444;
}

video {
    width: 2000px;
    height: 2000px;
}



.wrapper {
    margin: auto;
    display: table;

}

.player {
    width: auto;
    height: auto;
    margin: auto;
    display: table;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: transparent;

}

.player video {
    width: 960px;
    height: 540px;
    z-index: 1;
    position: absolute;
    overflow: hidden;



}



.player canvas {
    width: 960px;
    height: 540px;
    transform: scale(1.1);
    -webkit-filter: blur(70px);
    opacity: 0.75;
    z-index: -1;

}

#selc {
    padding: 10px;
    margin: auto;
    display: table;
}

#a1 {
    background-color: #111;
}



#a2 {
    background-color: #555;
    transition: 0.8s;
}

#a2:hover {
    background-color: #4169e1;
}

#dwna{
    display: none;
}

#dwna button{
    background-color:green;
    transition: 0.8s;
}

#dwna button:hover{
    background-color:#036003;
}

#audarea{
    margin: auto;
    display: none;
}

#audarea audio{
    width: 403px;
    border-radius: 10px;
}