@media {
    body {
        display: flex;
        font-family: Arial;
        margin: 0;
    }

    form {
        margin: 0;
    }

    article, div, picture {
        /* display: flex; */
    }

    column, flex, row {
        display: flex;
    }

    column {
        flex-direction: column;
    }
    
    span {
        /* display: inline-flex; */
    }

    iframe {
        background: white;
        border: 0;
        height: 100%;
        width: 100%;
    }

    input[type="text"] {
        background-color: transparent;
        bordeR: none;
    }

    input[type="text"]:focus {
        outline: none;
    }

    picture {
        position: relative;
    }
}

@media {
    block, card, box {
        /* display: flex; */
    }
}

@media {
    [placeholder]:not(input):before {
        content: attr(placeholder);
        opacity: 0.5;
    }
}

@media {    
    .component {
        display: flex;
        flex-direction: column;
        width: 100%;
        min-height: 100%;
    }
    
    .component:not(.active) {
        display: none;
    }
}

@media {
    blocks {
        width: 100%;
    }
}

@media {  
    ico {
        align-items: center;
        display: flex;
        display: webkit-flex;
        justify-content: center;
    }

    ico:not([css-height]) {
        height: 50px;
    }

    ico:not([css-width]) {
        width: 50px;
    }
}