﻿@charset "UTF-8";/*
* CSS per Q.C.I. SL - Recopilació de necessitats (Text sobre imatge, Menu-desplegable, etc).* 2021.08.26 Norma: A qci.css, totes les classes especials particularitzades s'anomenen començant per q...---------------------Mod.2022.05.20 JMQ.- afegit nou tipus lletr per el menu nav --- font-family: "Roboto", sans-serif;------------------------------------------------------------------------------------------------------------------
*/@media screen and (min-width: 992px) {  .section-center {    width: 95vw;  }}main {  min-height: 100vh;  display: grid;  place-items: center;}/*
* Menu-desplegable
*/                        * {				margin:0px;				padding:0px;			}						#header {				margin:auto;				width:500px;    /* abans width:500px;  */				font-family:Arial, Helvetica, sans-serif;			} .nav-toggle {  font-size: 1.5rem;   /* orig font-size: 1.5rem; */  color: var(--clr-primary-5);  background: transparent;  border-color: transparent;  transition: var(--transition);   cursor: pointer;}.nav-toggle:hover {  color: var(--clr-primary-1);  transform: rotate(90deg);}						ul, ol {				list-style:none;                                box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);    /* New.2022.05.20 JMQ.- Afegit. Afecta la linia horitz de la barra de menu.(OK) ; ORIGINAL --- 0 5px 15px rgba(0, 0, 0, 0.1);   */			}						.nav > li {				float:left;   /* orig float:left; */                                padding: 1px 18px;  /* orig - RES -- estableix separació entre opcions menu */ 			}						.nav li a {                                font-family: "Roboto", sans-serif;   /* New.2022.05.20 JMQ.- afegit nou tipus lletr per el menu nav. Copiat de styles.css */				/* background-color:#f0EEE0; -- 2022.05.20 TRET COLOR FONS */    /* orig background-color:#000;  /  #F000 = gris-blavós clar / #F0EEE0; -- gris-verd perla */				color:#777;                /* #777; gris / orig: color:#fff; blanc */				text-decoration:none;                                /* padding: 0px 5px; */				/* padding:10px 20px; */   /* orig  padding:10px 12px;  segon_valor = espai entre opcions menu -- tret, evitar movim excessiu elements 2022.05.19 JM */				display:block;                                 /* padding-left: 5px; */   /*  padding-left: 5px; crea un lleuger mov a l'esquerra quan passes cursor per sobre opcio menu */			}						.nav li a:hover {				background-color:#404044;  /* #ff3034 vermell Fujitsu / #404044 gris marengo elegant / inicial: #434343 gris fort   */                                color:#fff;  /* Al passar mouse per sobre canvi a color blanc #fff; */                                opacity: 0.7;   /* 2022.01.10 afegit per JMQ.-  opacity: 0.7;  */                                			}						.nav li ul {				display:none;				position:absolute;				min-width:140px;                                background-color:#FBFCFC;   /* New.2022.05.20 JMQ.- Afegit. Es el color del grup d'elements de submenu en block ---  #FBFCFC -- gris mes blanc /  #F0EEE0; -- gris-verd perla   /   #ECF0F1 -- gris clar */			}						.nav li:hover > ul {				display:block;			}						.nav li ul li {				position:relative;			}						.nav li ul li ul {				right:-140px;				top:0px;			}@media screen and (min-width: 800px) {  .nav-center {    max-width: 1170px;    margin: 0 auto;    display: flex;    align-items: center;    justify-content: space-between;    padding: 1rem;  }  .nav-header {    padding: 0;  }  .nav-toggle {    display: none;  }  .nav {    height: auto;    display: flex;  }  .nav a {    padding: 0;    margin: 0 0.5rem;  }  .nav a:hover {    padding: 0;    background: transparent;  }  .social-icons {    display: flex;  }  .social-icons a {    margin: 0 0.5rem;    color: var(--clr-primary-5);    transition: var(--transition);  }  .social-icons a:hover {    color: var(--clr-primary-7);  }}/** Text a sobre de imatge*//* * 2021.08.26 QCI Regla: A qci.css, totes les classes s'anomenen començant per q...*/.qconten{    position: relative;    display: inline-block;    text-align: center;}.qtext-over-centrat{    position: absolute;    /* top: 30px; */    /* left: 40px; */    top: 50%;    left: 50%;    transform: translate(-50%, -50%);    font-weight: 900;    font-size:2vw;    background-color: rgba(255,255,255,0.3);   /* abans Transparencia 0.3 */    white-space: wrap;    /* max-width: 600px; */    max-width: 40%;}/* * Notes secció anterior JMQ:* rgba ...,0.4 es el grau de transparencia del color de fons, 0.3 es més tansp., 0.5 és mes fort** font-size:2vw; or 3vw, etc converteix el Text en RESPONSIVE al tamany que reduim la pantalla. 5vw ---> 10% del viewport width* Viewport is the browser window size. 1vw = 1% of viewport width. If the viewport is 50cm wide, 1vw is 0.5cm.*/.qtext-over{    position: absolute;    top: 20px;    left: 40px;}.qcentrat{    position: absolute;    top: 50%;    left: 50%;    transform: translate(-50%, -50%);}/** Classes originals, per Text a sobre de imatge*/.contenedor{    position: relative;    display: inline-block;    text-align: center;}.texto-encima{    position: absolute;    top: 20px;    left: 40px;}.centrado{    position: absolute;    top: 50%;    left: 50%;    transform: translate(-50%, -50%);}/** ---- fi Classes originals, per Text a sobre de imatge*/			