/* Document CSS */



/* genèrica */

.imc--generica { padding-top: 2em; margin-bottom: 8em; }

.imc--generica header { text-align: center; padding: 1.5em 2em 1em 2em; margin-bottom: 4em; background-color: transparent !important; border: 0 !important;  }
.imc--generica header .imc--co { width: 100%; max-width: var(--app-amplaria); margin: 0 auto; }
.imc--generica header h1 { font-weight: normal; margin-bottom: 1em; }
.imc--generica header h1 span { font-size: 2.8em; }

.imc--generica header p { margin-bottom: 1.5em; }

.imc--generica > p { text-align: center; }
.imc--generica > p strong { display: block; font-weight: normal; margin-bottom: 1.5em; }



/* estat -> amb icona */

.imc--generica[data-tipus] .imc--co::before { content: ""; display: block; width: 4em; height: 4em; margin: 0 auto 1em auto; background: transparent url() no-repeat center center / auto 100%; }

.imc--generica[data-tipus='eixir'] .imc--co::before { background-image: url(../imgs/icones/ico_desconnecta_EF2345.svg); }
.imc--generica[data-tipus='alerta'] .imc--co::before { background-image: url(../imgs/icones/ico_alerta_ff6124.svg); }
.imc--generica[data-tipus='atencio'] .imc--co::before { background-image: url(../imgs/icones/ico_atencio_FFAE43.svg); }
.imc--generica[data-tipus='correcte'] .imc--co::before { background-image: url(../imgs/icones/ico_correcte_2AA63C.svg); }
.imc--generica[data-tipus='error'] .imc--co::before { background-image: url(../imgs/icones/ico_error_EF2345.svg); }
.imc--generica[data-tipus='desa'] .imc--co::before { background-image: url(../imgs/icones/ico_desa_3984EF.svg); }
.imc--generica[data-tipus='informa'] .imc--co::before { background-image: url(../imgs/icones/ico_info_3984EF.svg); }

.imc--generica[data-tipus='executant'] .imc--co::before {
    border: .3em solid transparent;
    border-top-color: var(--color-principal);
    border-bottom-color: var(--color-principal);
    border-radius: 50%;
    animation-name: carregant;
    animation-duration: 1s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
}



/* MEDIA QUERYS */

@media only screen and (max-width : 800px) {

}

@media only screen and (max-width : 500px) {

}

@media only screen and (max-width : 450px) {

    .imc--generica header { margin-bottom: 2em; }
    .imc--generica header h1 span { font-size: 2em; }

}