@charset "UTF-8";
/* CSS Document */


@media only screen and (max-width: 1200px)
{
#second .video
{
width: 400px;
margin-right: -150px;
}
#gallery1 img
{
max-width: 765px;
}
#page p, #page li p {
    font-size: 18px;
    line-height: 32px;
}

#close_map {
    right: 15px;
    top: 15px;
    transform: scale(0.6) rotate(45deg);
}

}

@media only screen and (max-width: 1024px)
{
    #eight .caption2 {
        text-align: left;
        padding-top: 70px;
        max-width: 540px;
        margin-left: 0;
    }

    #leftsocial ul.social li a:before {
        font-family: 'FontAwesome';
        color: white;
        width: 100%;
        position: absolute;
        text-align: center;
        top: 4px;
    }

    #leftsocial ul.social li a {
        width: 25px;
        height: 25px;
    }

    #mappa .marker {
        transform: scale(0.7);
        transform-origin: top left;
    }

.infowindows .caption {
    padding-top: 60px;
}
}

@media only screen and (max-width: 1023px)
{
.par_left .citazione,.par_left.rig .citazione
{
margin-left:auto;
margin-right:auto;
position:relative;
margin-top:20px;
margin-bottom:20px;
}
.par_left p {
    padding-right: 0px;
}

.par_left.rig p
{
padding-left:0px;
}
.rel_mob
{
position:relative;
z-index:2;
}

.left_mob 
{
padding-left:200px;
}

.rtl.off,.ltr.off
{
width:0;
}

.rtl,.ltr
{
width:100%;
overflow:hidden;
}
.ltr
{
width:358px;
}

#raffineria .icons
{
position:relative;
left:auto;
right:auto;
top:0;
bottom:auto;
margin-right:0;
margin-left:auto;
height:82px;
}

#raffineria .icons.ltr
{
margin-right:auto;
margin-left:calc(100% - 358px);

}

#raffineria
{
padding-top:70px;
padding-bottom:70px;
}

#raffineria .focus
{
padding-top:15px;
padding-bottom:15px;
}

#raffineria .icons img
{
margin-right:-3px;
margin-left:auto;
max-width:362px;
position:absolute;
z-index:2;
top:0;
right:0;
}

#raffineria .icons.ltr img
{
left:0;
right:auto;
margin-right:auto;
margin-left:3px;
}
#raffineria .icons.rtl img
{
margin-right:-7px;
}

#fish,#rete,#vegetable
{
top:0px !important;
margin-left:0;
}

#fish
{
width:80px;
left:90px !important;
}
#rete
{
width:100px;
left:30px !important;
}

#vegetable
{
left: 0px !important;
margin-bottom: 10px;
margin-right: 30px;
width:auto;
bottom:auto;
position:relative;
float:left;
}

#test .cella.bordo {
	border-right:0;
}

.infowindow
{
width:100%;
bottom:0;
left:0;
top:auto;
right:auto;
}

.marker .infowindow
{
display:none !important;
opacity:0 !important;
}

#mappa > .infowindow.on
{
opacity:1;
}

#gallery .tabella,#gallery .cella,#test .tabella,#test .cella
{
display:block;
}

#test .slick-initialized .slick-track {

    display: block;
}

#gallery .cella,#test .cella
{
width:100%;
}

#test li .cella
{
width:auto;
display:table-cell;
}

#test li .tabella
{
display:table;
}

#gallery .slide p,#test .slide p
{
margin-left:auto;
text-align:center;
}

#test .slide img
{
height:150px;
}

#gallery .evid,#test .evid
{
margin-bottom:40px;
}
.slick-track
{
display:block;
}

.bannerEnd .plyr__play-large {

    width: 200px;
    height: 200px;
    background-size: 220px;

}
#wrapper_first .box_testo p.left_mob
{
padding-top:30px;
padding-bottom:30px;
}

#second .linea
{
height:100% !important;
}

#pollution
{
position:relative;
margin-left:auto;
margin-right:auto;
margin-top: 15px;
margin-bottom: 15px;
right: auto;
}
h1 {
    font-size: 42px;
    line-height: 48px;
}
.par_left p,.par_left.rig p
{
text-align:justify;
}
#gallery1 .caption
{
    position: relative;
    
}

#gallery1 img,#gallery1 .caption,#gallery1 .slides
{
width: 100%;
    height: auto;
max-width:623px;
margin-left:auto;
margin-right:auto;
}


#gallery1 .slick-slider
{
position:relative;
}

#gallery1 .box_testo
{
padding:0;
}

#gallery1 img
{
margin-top:0;
}

#second .video
{
float:none;
margin-left:auto;
margin-right:auto;
margin-top: 45px;
margin-bottom: 20px;
}
#gallery1 .slick-prev, #gallery1 .slick-next
{
top:6px;
-webkit-transform: translate(0, 0);
-ms-transform: translate(0, 0);
transform: translate(0, 0);
margin-top: 59.6%;
background-color:transparent;
width:21px;
}

#gallery1 .slick-prev::before, #gallery1 .slick-next::before
{
content:url("../img/next.svg");
}
#gallery1 .slick-prev
{
left:auto;
right:60px;
}
#gallery1 .slick-next
{
left:auto;
right:20px;
}
#gallery1 .caption p.title,#gallery1 .caption p.title {
	padding-bottom: 10px;
}

#test .question
{
text-align:center;
}
#test ul li.evid
{
display:block;
}
}

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

#mappa.on .marker.on:hover {
    transform: scale(0.7) translateY(-15px);
    transform-origin: top left
}

#mappa.on .marker.on {
    transform: scale(0.7) translateY(-15px);
    transform-origin: top left
}

.infowindows {
    position: relative;
    height: 0;
}

.infowindows.on {
    width: 100%;
    height: 500px;
}

#navigator_map {
    left: 50%;
    margin-right: -50%;
    transform: translate(-50%, -50%);
}

#mappa .sfondo_dettaglio {
    right: 0;
    width: 100%;
}

#mappa.on {
    transform: none;
}

#close_map {
    right: 0px;
    top: 0px;
    transform: scale(0.4) rotate(45deg);
}

.infowindows .caption {
    padding-top: 60px;
}

#gallery2 .slide p span {
    font-size: 44px;
    line-height: 44px;
    margin-bottom: 20px;
}

#first .illu .ico.ico4 {
    width: 40px;
}

#mappa .marker {
    transform: scale(0.5);
    transform-origin: top left;
}

#eight .caption ul {
    padding-bottom: 0;
}

img.logo_testata {
	margin-top: 0px !important;
	
}

#seven .video p.text {
    padding: 0 60px;
}

section#first .intro p, #first .titolo, #five .titolo, #page .citazione p {
    font-weight: 700;
    font-size: 20px;
    line-height: 32px;
}


#third .col2 p {
    max-width:  100%;
    margin-bottom: 30px;
}

section#first .intro {
    padding-left: 50px;
    padding-right: 50px;
}

#first .titolo, #five .titolo {
    padding-left: 10px;
    padding-right: 10px;
}

#first img.mondo {
    width: 278px;
}

.ico {
    width: 80px;
}

#first .illu .ico.ico3, #first .illu .ico.ico2  {
    width: 70px;
}

#first .illu .ico.ico4 {
    width: 50px;
}

#gallery .slide .image img {
    width: auto;
}
#gallery .slides {
    height: 680px;
}

#eight .illu1, #eight .linea_v, #eight .col_img, #eight .illu2, #eight .focus.primo .linea_h,#eight .focus.secondo .linea_h,#eight .freccia1,#eight .freccia2 {
    display: none;
}

#eight .caption {
    width: 100%;
    padding-left: 20px;
    padding-right: 20px;
}

#eight .caption2 {
    max-width: 100%;
    padding-left: 20px;
    padding-right: 20px;
}

#eight .focus.secondo {
    height: auto;
}

#eight .terzo {
    padding-top: 0;
}

.slick-initialized .slick-slide {
    width: 100%;
}

.slick-next {
    right: 5%;
} 

.slick-prev {
    left: 5%;
}

#gallery2 .img {
    position: relative; 
    top: 0%; 
    transform: none; 
    margin-top: 60px;
    margin: 50px auto 0 auto;
}

#gallery2 .slide p {
        padding: 30px 100px;
}

#gallery2 .slides {
    margin-top: 0;
}

#gallery2 .slick-initialized .slick-track {
    min-height: 0;
}

}

@media only screen and (max-width: 600px)
{
.citazione p::before {
    top: 0;
    left: -30px;
}

#mappa .marker {
    transform: scale(0.4);
    transform-origin: top left;
}
}

@media only screen and (max-width: 699px)
{
#visore h1 span,#visore h1 .anim
{
display:inline;
padding:0;
}
#visore .evid .anim::before
{
display:none;
}
#visore .caption .focus
{
background-color:#fff;
padding:10px;
}
#visore .caption
{
bottom:20px;
}
#gallery1 {
    margin-top: 0px;
padding-top: 5px;
padding-bottom: 5px;
width:100%;
}
section,#raffineria {

    padding-top: 40px;
    padding-bottom: 40px;

}
#first .evid {
    margin-top: 10px;
}
#gallery,#test
{
padding-bottom:80px;
}
#third
{
padding-top:10px;
padding-bottom: 0;
}

#test .tabella .cella
{
padding-top:0;
padding-bottom:0;
}
.slick-dots {
    bottom: -40px;
}
#third .evid {
	margin-top: 10px;
}
.evid span
{
padding-left:10px;
padding-right:10px;
}
#second .video
{
margin-top: 30px;
margin-bottom: 15px;
}
#second .video::after
{
top:-10px;
right:-10px;
}
#second
{
padding-top:0px;
padding-bottom:10px;
}
#page
{
margin-top:63px;
}


#first #wrapper_first .box_testo
{
margin-top:0;
}
#visore h1, #visore p
{
text-shadow:none;
}
#visore h1
{
font-size:24px;
line-height:30px;
}

#visore h1 i
{
display:block;
}
#visore p
{
font-size:14px;
line-height:21px;
margin-top:10px;
}

.box_testo
{
padding-left:0;
padding-right:0;
}
#rete
{
left:0px !important;
top:15px !important;
}
#fish
{
left:60px !important;
top:15px !important;
}
#wrapper_first .box_testo p.left_mob
{
padding-top:15px;
padding-bottom:15px;
}
.left_mob {
    padding-left: 150px;
}
#gallery .evid span,#third .evid span,#test .question
{
font-size:23px;
line-height:36px;
}

#test .evid
{
font-size:20px;
line-height:30px;
}
#test ul li.evid span {

    line-height: 30px;
    width: 36px;
    height: 36px;
	font-size:24px;
}
#test ul li.evid {
    margin-top: 5px;
	padding-top:5px;
	padding-bottom:5px;
    margin-bottom: 5px;
	
}

.bannerEnd .plyr__play-large {
    width: 110px;
    height: 110px;
    background-size: auto;
    background-image: url("../img/play.svg");    
}

#test .question
{
line-height:28px;
max-width:320px;
padding-bottom:30px;
}

#vegetable
{
left:0 !important;
}
#last_par
{
padding-top:25px;
padding-bottom:10px;
}

#raffineria .focus {

    padding-top: 0px;
    padding-bottom: 0px;

}
}

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

#gallery .fonte {
    font-size: 12px;
}

#gallery {
    padding-bottom: 140px;
}

#gallery2 .slick-dots {
    width: auto;
    left: 50%;
    left: 50%;
    margin-right: -50%;
    transform: translate(-50%, -50%);
}

#gallery .slide .image span {
    font-size: 46px;
    position: relative;
    left: 0;
}
#gallery .slide .inner_slide {
    padding-top: 100px;
}

#gallery .slide.slick-active .image img {
     width: auto; 
    opacity: 1;
}

#gallery2 .slick-initialized .slick-track {
    min-height: auto!important;
}

.slick-initialized .slick-track {
    align-items: flex-start;
}

#gallery2 .slide p span {
    font-size: 24px;
    margin-bottom: 0;
    line-height: 36px;
    padding-bottom: 5px;
}

#gallery2 .slide p {
    font-size: 14px;
    line-height: 16px;
}

#gallery2 .slides {
    margin-top: 0;
}

#gallery2 .img {
 
    width: 80%;

}
#seven .video p.text {
    padding: 20px;
}
.title_section h2 {
    font-size: 16px;

}

#gallery2 .slick-dots li.slick-active {
    background-color: #000;
    width: 20px;
    height: 20px;
}

#gallery2 .slick-dots li {
    width: 10px;
    height: 10px;
}

#five .legenda {
    font-size: 14px;
    line-height: 24px;
}

#five .legenda.fonte {
    font-size: 13px;
}
#first img.mondo {
    width: 148px;
}

#first .illu {
    margin-bottom: 50%;
}

.illu img {
    width: 40px;
}

#first .illu .ico.ico4 {
    width: 20px;
}

#chart_area {
    min-height: 300px;
}

.inner_chart .label {
    font-size: 16px;
    line-height: 30px;
}

#chart_area {
    width: 100%;
}
#page .citazione p i, #page .citazione p span {
    line-height: 26px;
    font-size: 14px;
}

#third .grafico .base .parametro .col span, #third .grafico .base .parametro .anno {
    font-size: 12px;  
}

#third .grafico .base .parametro .col .spec {
    font-size: 10px;
    line-height: 12px;
}

#four h2, #seven h2 {
    margin-top: 30px;
}

#third .legenda {
    font-size: 14px;
    line-height: 22px;
    padding-top: 60px;
}

#gallery .slide p.title {
    font-size: 18px;
    line-height: 24px;

}

#gallery .evid span, #third .evid span, #test .question {
    font-size: 18px;
    line-height: 40px;
}

#page p, #page li {
    font-size: 16px;
    line-height: 26px;
}

.citazione p::before {
    left: -30px;
}

.citazione p::after {
    right: -30px;
}

#visore #note .focus {
    font-size: 14px;
}

#first .titolo, h2 {
    font-size: 18px;
    line-height: 24px;
}

section#first .intro {
    padding-left: 20px;
    padding-right: 20px;
}

section#first .intro p, #first .titolo, #five .titolo, #page .citazione p {
    font-size: 16px;
    line-height: 26px;
}

section#first .intro p, #first .titolo, #five .titolo, #page .citazione p {
    line-height: 26px;    
    font-size: 14px;
}

#test .focus,#test .tabella
{
width:100%;
}
#test .tabella .cella.left
{
padding-left:0;
padding-right:0;
}
#test ul br
{
display:none;
}
#test ul li.evid
{
display:block;
}
.bannerEnd .plyr__play-large,.plyr__play-large
{
width:80px;
height:80px;
background-size:70px;
border:8px solid #fff;
}
#page #second .par_left .citazione p {

    max-width: 175px;

}
.par_left .citazione, .par_left .citazione svg
{
width:230px;
height:230px;
}
#page .par_left .citazione p {
	font-size: 14px;
	line-height: 19px;
	max-width: 150px;
}
.par_left .citazione, .par_left.rig .citazione
{
margin-top: 10px;
margin-bottom: 10px;
}
#page .box_testo p,#page .infowindow p,#gallery1 .caption p
{
font-size:15px;
line-height:27px;
}
#rete
{
left:-35px !important;
}
#fish
{
left: 15px !important;
top: 36px !important;
width:60px;
}
#pollution
{
max-width:100%;
}
.left_mob {
    padding-left: 80px;
}

#third .evid span {
    font-size: 20px;
    line-height: 38px;
}

.evid span
{
padding-left: 10px;
padding-right: 10px;
}

#vegetable {
    margin-right: 20px;
}

#gallery .slide img,#test .slide img {
	height: 110px;
}

#test .slide img.little2
{
height:50px;
position:relative;
top:33px;
}
#gallery .slick-prev, #gallery .slick-next {
    top: 50%;
}

.slick-prev:before, .slick-next:before {
    height: 50px;
}

#test .slick-prev, #test .slick-next
{
top:63px;
}

#test .question {
font-size:20px;
line-height:27px;
}

.slick-prev, .slick-next {
	top: 90px;
}
#gallery .slide p,#test .slide p {
    font-size: 14px;
    line-height: 20px;
    padding: 0 20px;
}

#test .profile p
{
font-size:20px;
line-height:26px;
padding-left:40px;
padding-right:40px;
}
#raffineria .icons img
{
max-width:306px;
}
#raffineria .icons.ltr {
    margin-left: calc(100% - 306px);
}
#raffineria .icons
{
height:70px;
}
#test li.evid {
    font-size: 18px;
    line-height: 23px;
}


#footer .disclaimer p.disclaimertext {
    font-size: 0.6rem;
}

#first .illu .ico.ico3, #first .illu .ico.ico2 {
    width: 40px;
}

.slick-next {
    right: -5%;
}

.slick-prev {
    left: -5%;
}

#gallery .slide .inner_slide {
    padding: 0 30px;

}

#gallery .slides {
    height: auto;
    padding: 50px 0;
}

#gallery2 .slide p {
    padding: 30px;
}

#eight .caption, #eight .caption2 {
    padding-left: 0;
    padding-right: 0;
}

#mappa .marker {
    transform: scale(0.4);
    transform-origin: top left;
}

section#nine {
    margin-top: 0;
}

.infowindow h2 {
    margin-bottom: 15px;
}

#mappa.on .marker.on:hover {
    transform: scale(0.5) translateY(-15px);
    transform-origin: top left
}

#mappa.on .marker.on {
    transform: scale(0.5) translateY(-15px);
    transform-origin: top left
}

section#gallery2 {
    padding-bottom: 120px;
}

#mappa {
    width: 200%;
    margin-left: -50%;
}
}