/* stile per div POPUP */
*{box-sizing: border-box; font-family: 'Raleway', 'Arial', 'Helvetica', sans-serif;}

.overlay {
      /*position: absolute;*/
      display:block;
      position:fixed;
      top: 0;
      bottom: 0;
      left: 0;
      right: 0;
      background: rgba(7, 7, 7, 0.7);
      opacity: 0; /* mettere 0 se div nella pag di richiamo */
      visibility: hidden; /* mettere hidden se div nella pag di richiamo */
      transition: opacity 500ms;
      z-index:3;
    }
/* se div nella pag di richiamo, togliere il commento seguente */
   /* .overlay:target {
      opacity: 1;
      visibility: visible;
    } */

    .popup {
      margin: 250px auto; /* cambiare i valori per modificare posizione del popup */
      padding: 20px;
      background-color: rgba(255, 255, 255, 1);
      width: 30%;
      position: relative;
      font-family: Arial, sans-serif;
    }
    .popup #popup_titolo {
      margin-top: 0;
      padding: 5px;
      background-color: rgba(176, 164, 157, 0.88);
      color: #D7CDC6; 
      text-transform: uppercase; 
      text-align:center; 
      line-height: 1.2;
      font-weight: 300;
      letter-spacing: 5px;
    }
    .popup .chiudi_popup {
      position: absolute;
      top: 13px;
      right: 30px;
      transition: all 200ms;
      font-size: 30px;
      font-weight: 400;
      text-decoration: none;
      color: rgb(98, 78, 67);
    }
    .popup .chiudi_popup:hover {
      color: #333333;
    }
    .popup .content {
      max-height: 250px;
      overflow:auto;
      color: rgb(98, 78, 67);
      line-height: 1.5;
      text-align:center; 
    }

/* fine stile per div POPUP */


/* Media Queries*/

@media (max-width: 767px){
     .popup {
      margin: 100px auto 250px; /* cambiare i valori per modificare posizione del popup */
      width: 80vw;
    }
    .popup #popup_titolo {
      font-size:.8rem;
    }
}
@media (min-width: 767px) and (max-width: 991px) {
    .popup {
        margin: 150px auto 250px; /* cambiare i valori per modificare posizione del popup */
        width: 60vw;
    }

        .popup #popup_titolo {
            font-size: 1rem;
        }
}
    @media (min-width: 991px) {
     .popup {
      width: 50vw;
    }
    .popup #popup_titolo {
      font-size:1.2rem;
    }
}

/* fine Media Queries*/