/*!
 * css di base pagina rifinizione sito fonte.
 *
 * Copyright (C) 2016 Cleviria SRL - Giuseppe ing. Grosso
 */
/* Common styles
 * --------------------------------------- */
body .main 
{
	display: inline-block;
    text-align: center;
    width: 100%;	
}

body .main .sezione-main img 
{
	width: 490px;
	margin-right: 40px;
}
body .main .sezione-main h4 
{
	width: 430px;
}
body .main .sezione-main > h4
{
	font-family: Caveat;
	font-size: 22px;
	color: rgb(57, 59, 61);
	text-align: left;
}
body #section0,
body #section1,
body #section2,
body #section3,
body #section4,
body #section5
{
	height: auto !important;
}

body #section3 .main .sezione
{
	text-align: left;
	margin-bottom: 110px;
}

body #section5 .main .sezione
{
	margin-bottom: 110px;
}


body .sezione
{
	width: 960px;
	margin-top: 140px;
	margin-bottom: 140px;
	text-align: center;
}

body .sezione-text
{
	width: 670px;
	text-align: left;
}

body .sezione .sezione-interna
{
	display: inline-block;
	width: 670px;
	text-align: left;
}


body #section6
{
	height: auto !important;
	background-color: transparent;
}

body #section0
{
	background-image: url("../jpg/BackgroundIllustazione.jpg");
	background-repeat: repeat;
	background-position: top;
	text-align: center;
}
body #section3
{
	background-image: url("../png/ImgSettoreRifinizione_Collaboratori.png");
	background-repeat: no-repeat;
	background-position: left bottom;
}

body #section6 img,
body #section2 img
{
	width: 100%;
	height: 100%;
}
body #section4 .sezione 
{
	margin-top: 440px;
    text-align: center;
    display: inline-block;
}
body #section4 .sezione 
{
    text-align: center;
    margin: 110px 0px;
    display: inline-block;
}

body #section6 img 
{
    max-width: 100%;
    height: auto;
    top: 4px;
}

body .main .sezione,
body .main .sezione-main,
body .main .sezione-main > *
{
	display: inline-block;
	vertical-align: middle;
	text-align: center;
}

body .section .sezione,
body .section .sezione-main
{
	vertical-align: middle;
}
body .section .slide
{
	text-align: center;
}

body #section4.section .counter > h1
{
	line-height: 0.8;
    vertical-align: middle;
}

body #section4.section .counter > * 
{
    display: inline-block;
}

body #section4.section .counter > h2
{
	font-size: 20px;
	margin-left: 16px;
	vertical-align: middle;
}


/********************************************************************
ANIMAZIONE SUI LIVELLI 01-05. sezione rifinizione.
********************************************************************/
body #section2 .livelli 
{
    position: absolute;
	background-repeat: no-repeat;
	background-size	: cover;
	top: 0px;
	bottom: 0px;
	left: 0px;
	right: 0px;
	background-position: center center;
	opacity: 0;
}
body #section2 .livello1.opacity
{
	background-image: url("../png/Illustrazione_SezioneRifinizione_Livelli-01.png");	
	opacity:1;
	
-webkit-transition-delay: 0.25s;
  -moz-transition-delay: 0.25s;
  -o-transition-delay: 0.25s;
  transition-delay: 0.25s;
}


body #section2 .livello2.opacity
{
	background-image: url("../png/Illustrazione_SezioneRifinizione_Livelli-02.png");	
	opacity: 1;

-webkit-transition-delay: 0s;
  -moz-transition-delay: 0s;
  -o-transition-delay: 0s;
  transition-delay: 0s;

}
body #section2 .livello3.opacity.move-right
{
	background-image: url("../png/Illustrazione_SezioneRifinizione_Livelli-03.png");	
	opacity: 1;

	transition: transform 0.75s;

-webkit-transition-delay: 1s;
  -moz-transition-delay: 1s;
  -o-transition-delay: 1s;
  transition-delay: 1s;

}
body #section2 .livello4.opacity.move-right
{
	background-image: url("../png/Illustrazione_SezioneRifinizione_Livelli-04.png");	
	opacity: 1;
	
-webkit-transition-delay: 0.75s;
  -moz-transition-delay: 0.75s;
  -o-transition-delay: 0.75s;
  transition-delay: 0.75s;

}

body #section2 .move-right
{
	transform: translate(-230px,80px) scale3d(0, 0, 1);
}
body #section2 .move-right.animated
{
	transition: transform 1s;
	transform: translate(0px,0px) scale3d(1, 1, 1);
}

/* desktop: fullhd */
@media all and (max-width: 1920px)
{
	body #section3 .main 
	{
	    text-align: left;
	    margin-left: 500px;
	}
	body .sezione .sezione-interna 
	{
	    width: 410px;
	}	
	body #section3 .main .sezione 
	{
	    text-align: left;
	}	
	
}

/* mobile: tablet */
@media all and (max-width: 1024px)
{
	body .main 
	{
	    width: initial;
	}
	body #section3 .main 
	{
	    text-align: center;
	    margin-left: 0px;
	}	
	body .main .sezione-main h4 
	{
		width: auto;
		margin: 50px 50px;
	}
	
	body .main .sezione-main img 
	{
	    margin-right: 0px;
	}	
	
	body .sezione	
	{
		margin-left: 80px;
	    margin-right: 80px;
	    margin-top: 70px;
	    margin-bottom: 70px;
	    width: auto;
	}	
	body .sezione-text
	{
		width: auto;
		text-align: left;
	}
	body #section3 .main .sezione
 	{
 		margin-left: 80px;
 	    margin-right: 80px;
	    margin-bottom: 420px;
	    margin-top: 70px;
 	    width: auto;
 	}	

	body .sezione .sezione-interna
	{
		width: auto;
	}	
	
	body #section4 .sezione 
	{
	    display: block;
	}
	
}

@media all and (max-width: 720px)
{
	body #section4.section .counter>h2
	{
		width: 240px;
	}
}

@media all and (max-width: 500px)
{
	body .main .sezione-main img 
	{
	    width: 100%;
	}
	
	body .sezione	
	{
		margin-left: 40px;
	    margin-right: 40px;
	}	
	body #section3 .main .sezione
 	{
 		margin-left: 40px;
 	    margin-right: 40px;
 	}		
}