.videowrapper {
    margin-bottom: 4rem;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    height: auto;
    width: 100%; 
   
}
.desktop {
    width:100%;
    display: none;   
    border: solid #333 0.5rem;
    border-radius: 20px;
    border-right: solid #333 .53rem ;


}

.tablet {
    margin-left: auto;
    margin-right: auto;
    width:100%;
    border: solid #333 0.5rem;
    border-radius: 2rem;

}

.mobil {
    width: 300px;
    height: auto;
    border: solid #333 0.5rem;
    border-radius: 1rem;
    

    
}

@media (min-width:767px){
    .mobil {
        width: auto;
        height: 380px;
    }

    .tablet {
        height: 400px;
        width: auto;
    }

    .desktop{
        width: 60%;
        display: block;
       
    }

    .videowrapper {
        height: auto;
        display: flex;
        width:100%;
        justify-content: space-around;
        flex-direction: row;
        align-items: center;
        
        
    }


}

@media (min-width: 1024px){



.videowrapper {
    flex-wrap: nowrap;
    gap: 1rem;
    justify-content: center;
    max-width: 1100px;
    height: 600px;
   
}


.desktop {
    
  width:100%;
  max-width: 800px;

}

.mobil {
    width: auto;
    height: 300px;
    margin: 0;
    
    
}

.tablet {
    height: auto;
    width: 100%;
    max-width: 800px;
    margin-top: 1rem;
   
}
}