/* File:        service.css */
/* Descrizione: stili di servizio per caricamento e pagina di avviso */
/* Versione:    00 draft */
/* Data:        2017-10-29 */
/* Proprietà:   Q-Ation S.R.L. */
/* Sito:        q-ation.it */


/* CLASSI PER ELEMENTI DI CARICAMENTO PAGINA */

	/* CLASSE PER OCCULTAMENTO FASE DI CARICAMENTO DELLA PAGINA */
		.concealment
		{
			position:fixed;
			z-index: 100;
		
			top:0px; bottom:0px; left:0px; right:0px;
	
			background-image:url(../Images/BkGnd_Main.jpg);
			background-repeat:repeat;
		
			font-size:calc(0.6024 * calc(1vw + 1vh)); /* equivalenti a 18px al 100% della viewport 1920×1068px */
		}


	/* CLASSE PER TESTO DI AVVISO */
		.lhint
		{
			position:fixed;
				
			left:calc(calc(100% - 20.556em)/2); /* equiripartizione dei bordi lateriali */
			top:calc(calc(100% - 3.000em)/2);
		
			width:20.556em; /* equivalenti a 370px+10% al 100% della viewport 1920×1068px (dimensionamento base determinato a posteriori con javascript) */
			height:3.000em; /* equivalenti a 54px al 100% della viewport 1920×1068px (dimensionamento base determinato a posteriori con javascript) */
				
			border-radius:5px;
			border:1px solid rgba(0,200,0,0.4);

			
			background:linear-gradient(-14deg, rgba(180,221,180,0.3) 0%, rgba(82,177,82,0.16) 25%, rgba(50,158,50,0.16) 26%, rgba(131,199,131,0.22) 50%, rgba(180,221,180,0.3) 51%, rgba(82,177,82,0.16) 75%, rgba(50,158,50,0.16) 76%, rgba(131,199,131,0.22) 100%);
		
			box-shadow: 0px 0px 8px 4px rgba(0,200,0,0.4);	

			text-align:center;
			white-space:nowrap;
			font-family:"Trebuchet MS", "Helvetica", "sans-serif";
		}

		/* CLASSE PER PARAGRAFO TESTO DI AVVISO */
			.lhint p
			{
				position:relative;
				
				margin-top:0.417em; /* equivalenti a 7.5px al 100% della viewport 1920×1068px */
				margin-bottom:0.417em; /* equivalenti a 7.5px al 100% della viewport 1920×1068px */
				
				font-size:1.222em; /* equivalenti a 22px al 100% della viewport 1920×1068px */
				line-height:1.528em; /*1.25×font size*/				

				color:rgba(60,60,60,1);
				text-shadow:1px 1px 2px rgba(210,210,210,0.7);	
			}

		/* CLASSE PER MESSAGGIO TESTO DI AVVISO */
			.lhint a
			{
				font-style:italic;
				
				color:rgba(0,102,40,1);
				text-shadow:1px 1px 2px rgba(165,220,165,0.65);				
			}		


/* CLASSI PER PAGINA DI AVVISO */

	/* Per coordinare il ridim. del testo con la viewport (finestra) si opta per l'unità di misura em e si stabilisce il valore di em in funzione di vh e vw (congiuntamente) */
	/* Posto che vh+vw = 2988 px (1920 w + 1068 h utili), per avere la dimensione base del carttere di 18 px si deve porre: 1em = 100×18/2988 = 0.6024×(1vw+1vh) */
	/* La spaziatura degli elementi (div) è a 20px o 40px (rispetto alla viewport al 100%), corrispondenti a 1.111em e 2.222em */


	/* CLASSE PER CORPO BODY */
		.fbbody /* ex altBody */ 
		{
			width:100%;
			height:100%;
	
			background-image:url(../Images/BkGnd_Warning.jpg);
			background-repeat:repeat;
			box-shadow:inset 0 0 24px 24px rgba(228,221,203,0.6);
			
			font-size:calc(0.6024 * calc(1vw + 1vh)); /* equivalenti a 18px al 100% della viewport 1920×1068px */
		}


	/* CLASSE PER TESTO PRINCIPALE (SOLO LOGO) */
		.fblogo /* ex altMainText */
		{
			position:fixed;
			
			left:0px;
			top:calc(calc(100% - 39.498em)/2); /* equiripartizione dei bordi superiore e inferiore (altezza totale div di 39.498em) */

			width:100%;
			height:9.333em; /* equivalenti a 168px (150% logo animato) al 100% della viewport 1920×1068px */
			
			margin-top:0px;
			margin-bottom:0px;
			
			text-align:center;
		}


	/* CLASSE PER LINEE DI SEPARAZIONE SFUMATE */
		.fbseparators /* ex altAddressLine */
		{
			position:fixed;
			
			left:calc(calc(100% - 82.011em)/2); /* equiripartizione dei bordi lateriali */
			
			width:82.011em; /* equivalenti a 1342px+10% al 100% della viewport 1920×1068px (dimensionamento base determinato a posteriori con javascript) */
			height:2px;
			
			background:linear-gradient(90deg, transparent, rgba(25,151,240,1) 50%, rgba(25,151,240,1) 51%, transparent);*/
		}

		/* MODIFICATORE DI CLASSE PER LINEA DI SEPARAZIONE SUPERIORE */
			.fbuseparator
			{
				top:calc(calc(calc(100% - 39.498em)/2) + 10.444em);
			}

		/* MODIFICATORE DI CLASSE PER LINEA DI SEPARAZIONE INFERIORE */
			.fblseparator
			{
				top:calc(calc(calc(100% - 39.498em)/2) + 13.777em);
			}

	/* CLASSE PER TESTO INDIRIZZO */
		.fbaddress /* ex altAddressText */
		{
			position:fixed;
				
			left:calc(calc(100% - 82.011em)/2); /* equiripartizione dei bordi lateriali */
			top:calc(calc(calc(100% - 39.498em)/2) + 10.444em); 

			width:82.011em; /* equivalenti a 1342px+10% al 100% della viewport 1920×1068px (dimensionamento base determinato a posteriori con javascript) */
			height:3.333em; /* equivalenti a 60px al 100% della viewport 1920×1068px (dimensionamento base determinato a posteriori con javascript) */
	
			border-top:2px solid transparent; /* per mantenere la centratura del testo */

			text-align:center;
			white-space:nowrap;
			font-family:"Trebuchet MS", "Helvetica", "sans-serif";
		}

		/* CLASSE PER PARAGRAFO TESTO INDIRIZZO */
			.fbaddress p /* ex altAddressText */
			{
				position:relative;
				
				margin-top:0.417em; /* equivalenti a 7.5px al 100% della viewport 1920×1068px */
				margin-bottom:0.417em; /* equivalenti a 7.5px al 100% della viewport 1920×1068px */
								
				font-size:0.889em; /* equivalenti a 16px al 100% della viewport 1920×1068px */
				line-height:1.334em; /*1.5×font size*/
				
				/*font-weight:normal;*/
				letter-spacing:0.021em;
				
				color:rgba(225,225,225,1);
				text-shadow:1px 1px 1px rgba(60,60,60,0.8);	
			}


	/* CLASSE PER TESTO SUB-LOGO */
		.fbactivity /* ex altLogoText */
		{
			position:fixed;

			left:calc(calc(100% - 82.011em)/2); /* equiripartizione dei bordi lateriali*/
			top:calc(calc(calc(100% - 39.498em)/2) + 15.999em);
			
			width:82.011em; /* equivalenti a 1342px+10% al 100% della viewport 1920×1068px (dimensionamento base determinato a posteriori con javascript) */
			height:5.722em; /* equivalenti a 103px al 100% della viewport 1920×1068px (dimensionamento base determinato a posteriori con javascript) */

			border-radius:5px;
			background:-moz-radial-gradient(50% 100%, ellipse farthest-side, rgba(228,221,203,0.15),rgba(228,221,203,0.00));

			text-align:center;
			white-space:nowrap;
			font-family:"Trebuchet MS", "Helvetica", "sans-serif";
		}

		/* CLASSE PER PARAGRAFO TESTO SUB-LOGO/INTRO */
			.fbactivity p /* ex altLogoText */
			{
				position:relative;
				
				margin-top:0px;
				margin-bottom:0px;
				
				font-size:1.222em; /* equivalenti a 22px al 100% della viewport 1920×1068px */
				line-height:1.528em; /*1.25×font size*/
				
				color:rgba(65,65,65,1);
				text-shadow:1px 1px 2px rgba(210,210,210,0.7);	
			}

		/* CLASSE PER PARAGRAFO TESTO SUB-LOGO/ATTIVITÀ */
			.fbactivity a /* ex altLogoText */
			{
				font-weight:bold;
				
				color:rgba(65,65,65,1);
				text-shadow:1px 1px 2px rgba(210,210,210,0.7);	
			}


	/* CLASSE PER TESTO CONTATTI */
		.fbcontacts /* ex altContactsText */
		{
			position:fixed;
			
			left:calc(calc(100% - 82.011em)/2); /* equiripartizione dei bordi lateriali*/
			top:calc(calc(calc(100% - 39.498em)/2) + 22.832em);
			
			width:82.011em; /* equivalenti a 1342px+10% al 100% della viewport 1920×1068px (dimensionamento base determinato a posteriori con javascript) */
			height:3.833em; /* equivalenti a 69px al 100% della viewport 1920×1068px (dimensionamento base determinato a posteriori con javascript) */
			
			border-radius:5px;
			background:-moz-radial-gradient(50% 0%, ellipse farthest-side, rgba(228,221,203,0.15),rgba(228,221,203,0.00));

			text-align:center;
			white-space:nowrap;
			font-family:"Trebuchet MS", "Helvetica", "sans-serif";
		}

		/* CLASSE PER PARAGRAFO TESTO CONTATTI */
			.fbcontacts p /* ex altContactsText */
			{
				position:relative;

				margin-top:0px;
				margin-bottom:0px;

				font-size:1.222em; /* equivalenti a 22px al 100% della viewport 1920×1068px */
				line-height:1.528em; /*1.25×font size*/
				
				color:rgba(65,65,65,1);
				text-shadow:1px 1px 2px rgba(210,210,210,0.7);		
			}

		/* CLASSE PER EMAIL TESTO CONTATTI */
			.fbcontacts a /* ex altContactsText */
			{
  				background:linear-gradient(transparent, rgba(228,221,203,0.2));
				
				font-weight:bold;
				font-style:italic;
				letter-spacing:0.043em;
				text-decoration:none;
				
				color:rgba(230,220,167,1);
				text-shadow:1px 1px 2px rgba(94,76,37,1);
			}


	/* CLASSE PER TESTO DI AVVISO */
		.fbwarning /* ex altWarningText */
		{
			position:fixed;
				
			left:calc(calc(100% - 82.011em)/2); /* equiripartizione dei bordi lateriali*/
			top:calc(calc(calc(100% - 39.498em)/2) + 28.887em);
		
			width:82.011em; /* equivalenti a 1342px+10% al 100% della viewport 1920×1068px (dimensionamento base determinato a posteriori con javascript) */
			height:10.611em; /* equivalenti a 191px al 100% della viewport 1920×1068px (dimensionamento base determinato a posteriori con javascript) */
				
			border-radius:5px;
			border:1px solid rgba(210,0,0,0.4);
			background:linear-gradient(-14deg, rgba(253,150,162,0.3) 0%,rgba(222,79,95,0.16) 25%,rgba(207,43,61,0.16) 26%,rgba(255,150,162,0.22) 50%, rgba(253,150,162,0.3) 51%,rgba(222,79,95,0.16) 75%,rgba(207,43,61,0.16) 76%,rgba(255,150,162,0.22) 100%);	
			box-shadow: 0px 0px 8px 4px rgba(210,0,0,0.4);	

			text-align:center;
			white-space:nowrap;
			font-family:"Trebuchet MS", "Helvetica", "sans-serif";
		}

		/* CLASSE PER PARAGRAFO TESTO DI AVVISO */
			.fbwarning p /* ex altWarningText */
			{
				position:relative;
				
				margin-top:0.833em; /* equivalenti a 15px al 100% della viewport 1920×1068px */
				margin-bottom:0.833em; /* equivalenti a 15px al 100% della viewport 1920×1068px */
				
				font-size:1.222em; /* equivalenti a 22px al 100% della viewport 1920×1068px */
				line-height:1.528em; /*1.25×font size*/				

				color:rgba(60,60,60,1);
				text-shadow:1px 1px 2px rgba(210,210,210,0.7);	
			}

		/* CLASSE PER TITOLO TESTO DI AVVISO */
			.fbwarning a /* ex altWarningText */
			{
				text-transform:uppercase;
				
				color:rgba(102,0,40,1);
				text-shadow:1px 1px 2px rgba(220,165,165,0.65);				
			}			







	

