body {
    margin: 0px;
    display: flex;
    justify-content: flex-end;
    font-family:sans-serif;
}


main {
    width: 100%;
    background: grba(0,0,0,0.5);
    color: #fff;
    padding: 1%;
    margin: 5%;
}

h1{  
    font-family: sans-serif;
    font-size: 44px;
    text-align: center;
    border-bottom: 15px solid rgb(70,170,210);
    border-top: 15px solid rgb(70,170,210);
}

video {
    position: fixed;
    min-width: 100%;
    min-height: 100%;
    
   
    
    top: 50%;
    left: 50%;
    transform: translateX(-50%) translateY(-50%);
    z-index: -1;
    
 /* -webkit-filter: sepia(100%)*/
}

img{
   width: 100%; 
    border-bottom: 10px solid rgb(70,173,210);
    border-top:  10px solid rgb(70,173,210);
    position: fixed
   
}


.container{
    padding-top: 150px;
    text-align: center;
    color: white
}

.P{
    font-family:sans-serif;
    font-size: 50px;
    
    
}



@media (min-width:360px){
    video{
        width: 60%;
        margin-top: -16%
    }
    body{
        background-color: darkgrey
    }
    img{
        
    }
}

a{
    text-decoration: none;
    color: white;
    width: 60%;
    background-color: rgba(0,0,0,0.3)
}
a:hover{
    font-size: 25px;
    background-color: rgba(0,0,0,0.6);
    color: white
}
a:visited{
    color: white
}

@media (min-width:980PX){
    video{
        
       min-width:90%;
       min-height: 90%;
        margin: auto;
        
    }
    body{
        background-color: darkgrey
    }
    img{
      width: 50%;
        margin-left: 20%
    }
    }
    container{
padding-top: 400px    }
}

@media (min-width:1280px){
    video{
        width:100%;
        height: 100%;
        top: 10%;
        transform: translateY(50%);
    }
    body{
        background-color: darkgrey
    }
    img{
        width: 100%
    }
    container{
        
    }
}