/* Document CSS */


/* cap */

.imc--cap { padding: .8em 2em; background-color: var(--color-principal); }
.imc--cap .imc--co { display: flex; align-items: center; align-content: center; justify-content: center; flex-wrap: wrap; gap: 0 1em; width: 100%; max-width: var(--app-amplaria); margin: 0 auto; }



/* logos */

.imc--logo-gva::before { content: ""; display: inline-block; width: 7.5em; height: 3em; background: transparent url(../../imgs/logo_gva_fff.svg) no-repeat left center / auto 100%; }
.imc--logo-gva span { position: absolute; top: -999em; left: -999em; color: #fff; }

.imc--logo-app::before { content: ""; display: inline-block; width: 9em; height: 3em; background: transparent url(../../imgs/logo_app_ca-ES_fff.svg) no-repeat left center / 100% auto; }
.imc--logo-app span { position: absolute; top: -999em; left: -999em; color: #fff; }


html[lang="es-ES"] .imc--logo-app::before { background-image: url(../../imgs/logo_app_es-ES_fff.svg); }



/* usuari */

button.imc--usuari { position: relative; padding: .5em 2.5em .5em 2.5em; margin-left: auto; background-color: transparent; border: none; border-radius: 0; }

button.imc--usuari strong,
button.imc--usuari span { display: block; color: #fff; line-height: 1.4em; }

button.imc--usuari span { font-size: .8em; }

button.imc--usuari::before { content: ""; display: block; position: absolute; top: .6em; left: .7em; width: 1.2em; height: 1.2em; background: transparent url(../../imgs/icones/ico_user_fff.svg) no-repeat 50% 50% / auto 100%; }

button.imc--usuari::after { content: ""; display: block; position: absolute; top: .6em; right: .7em; width: 1.2em; height: 1.2em; background: transparent url(../../imgs/icones/ico_menu_fff.svg) no-repeat 50% 50% / auto 70%; }

button.imc--usuari:hover,
button.imc--usuari:focus { background-color: rgba(255,255,255,.1); }




/* MEDIA QUERYS */

@media only screen and (max-width : 1000px) {

    .imc--cap { padding: .8em 1em; }

}

@media only screen and (max-width : 700px) {

    .imc--cap { padding: .4em 1em; }

	.imc--logo-gva::before { width: 1.5em; height: 3em; }
	.imc--logo-app::before { width: 9em; height: 3em; }

    button.imc--usuari { display: flex; align-items: center; justify-content: center; width: 3em; height: 3em; padding: 0; margin-right: 3.5em; }

    button.imc--usuari strong,
    button.imc--usuari span { position: absolute; top: -999em; left: -999em; }

    button.imc--usuari::before { position: static; width: 1.7em; height: 1.7em; }
    button.imc--usuari::after { display: none; }
    
}

@media only screen and (max-width : 450px) {


}