@media (min-width: 400px){
    html body{
        background-color: rgb(40,60,80);
    }
}
@media (max-width: 800px) {
    h1{
        text-align: center;
    }
}
@media (orientation: landscape) {
    article{
        max-width: 50ch;
    }
}
@media (min-width: 200px){
    h1{
        background-color: #ff0000;
    }
}
@media print{
    p{
        font-family: serif;
    }
}
body,h1{
    color: #111;
    background-color: #DDD;
}
@media screen{
    a:hover{
        background-color: #212;
        padding: 2px 5px;
    }
}
@media screen and (min-width:800px) and (max-width: 900px) {
    img{    
        height: 0px;
        width: 0px;
    }
}
@media screen and (min-width:200px) and (max-width: 400px) {
    figure img{        
        height: 400px ;
        object-fit: cover;
    }
}
@media (resolution: 2dppx){
    article{
        background-color: #667;
    }
}