#dev{
    padding:1.5em;
    font-size:1.5em;
    opacity:0;
    width:100%;
    height:100%;
    display:flex;
    align-items:center;
    justify-content:space-between;
    box-sizing:border-box;
    text-align:center;    
    flex-flow:column;
    animation:fade 20s;
}
@media(orientation:landscape) {
    #dev{justify-content:flex-end}
    #arr,#rot{display:none}
}
@media(orientation:portrait) {
    #arr:before{
    content:"screen_rotation";
    opacity:.2;
    position:absolute;
    top:50%;
    left:50%;
    font-size:40vMax;
    margin-top:-.5em;
    margin-left:-.5em;
    }
}
@keyframes fade {
    0% {
        opacity:.5;
    }
    50% {
        opacity:.5;
    }
    75%{
        opacity:.3;
    }
    100% {
        opacity:0;
    }
}