/*@import url(https://fonts.googleapis.com/css?family=Fjalla+One);*/

h1.pr1,

h2.pr1 {

    font-weight: 300;

    margin: 0 0 1rem 0;

}

a.pr1 {

    text-decoration: none;
	

}

a.pr1:hover {color: #82eaae}

header.pr1 {

    padding: 7vh 10vw;	

}

header.pr1 h1 {

    color: rgba(0,0,0,0.54);

}

.info.pr1 {

    background: #009688;

    padding: 3vh 10vw;

    color: #d9d9d9;

}

/* contenitore base, lo sfondo oscurante*/

#overlay {

    position: fixed;

    top: 0;

    left: 0;

    display: none;

    width: 100%;

    height: 100%;

    background: rgba(0, 0, 0, 0.65);

    z-index: 999;

    -webkit-animation: fade .6s;

    -moz-animation: fade .6s;

    animation: fade .6s;

    overflow: auto;

}

/* finestra modale */

.popup.pr1 {

    top: 40px;

    left: 0;

    right: 0;       

    font-size: 14px;

    margin: auto;

    width: 85%;

    min-width: 320px;

    max-width: 600px;

    position: absolute;

    padding: 15px 20px;

    border: 1px solid #383838;

    background: #fefefe;

    z-index: 1000;

    -webkit-border-radius: 4px;

    -moz-border-radius: 4px;

    -ms-border-radius: 4px;

    border-radius: 4px;

    font: 14px/18px 'Tahoma', Arial, sans-serif;

    -webkit-box-shadow: 0 15px 20px rgba(0,0,0,.22),0 19px 60px rgba(0,0,0,.3);

    -moz-box-shadow: 0 15px 20px rgba(0,0,0,.22),0 19px 60px rgba(0,0,0,.3);

    -ms-box-shadow: 0 15px 20px rgba(0,0,0,.22),0 19px 60px rgba(0,0,0,.3);

    box-shadow: 0 15px 20px rgba(0,0,0,.22),0 19px 60px rgba(0,0,0,.3);

    -webkit-animation: fade .6s;

    -moz-animation: fade .6s;

    animation: fade .6s;

}

/* Titolo nella finestra modale  */

.popup.pr1 h2, .popup.pr1 h3 {

    margin: 0 0 1rem 0;

    font-weight: 300;

    line-height: 1.3;

    color: #009032;

    text-shadow: 1px 2px 4px #ddd;

}

/* bottone della chiusura */

.closePopupBanner {

    top: 5px;

    right: 5px;

    width: 32px;

    height: 32px;

    position: absolute;

/*    border: none;*/
	border-color: black;

    -webkit-border-radius: 50%;

    -moz-border-radius: 50%;

    -ms-border-radius: 50%;

    -o-border-radius: 50%;

    border-radius: 50%;

    background-color: #156f32;

    -webkit-box-shadow: 0 1px 5px 0 rgba(0, 0, 0, 0.16), 0 1px 10px 0 rgba(0, 0, 0, 0.12);

    -moz-box-shadow: 0 1px 5px 0 rgba(0, 0, 0, 0.16), 0 1px 10px 0 rgba(0, 0, 0, 0.12);

    box-shadow: 0 1px 5px 0 rgba(0, 0, 0, 0.16), 0 1px 10px 0 rgba(0, 0, 0, 0.12);

    cursor: pointer;

    outline: none;



}

.closePopupBanner:before {

    color: rgba(255, 255, 255, 0.9);

    content: "X";

    font-family:  Arial, Helvetica, sans-serif;

    font-size: 14px;

    font-weight: normal;

    text-decoration: none;

    text-shadow: 0 -1px rgba(0, 0, 0, 0.9);

    -webkit-transition: all 0.5s;

    -moz-transition: all 0.5s;

    transition: all 0.5s;

}

/* bottone allo stato hover  */

.closePopupBanner:hover {

    background-color: #000;

}

/* immagini nella finestra modale */

.popup.pr1 img {

    width: 100%;

    height: auto;

    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);

}

/* miniature di immagini */

.pl-left,

.pl-right {

    width: 25%;

    height: auto;

}

/* miniatura sulla destra */

.pl-right {

    float: right;

    margin: 5px 0 5px 15px;

}

/* miniatura sulla sinistra */

.pl-left {

    float: left;

    margin: 5px 18px 5px 0;

}

/* animazione alla apparizione del blocco con contenuto  */

@-moz-keyframes fade {

    from { opacity: 0; }

    to { opacity: 1 }

}

@-webkit-keyframes fade {

    from { opacity: 0; }

    to { opacity: 1 }

}

@keyframes fade {

    from { opacity: 0; }

    to { opacity: 1 }

}ss