body{
    background-color: #ae0d13;
    color: #ddab46;
    font-family: Arial, Helvetica, sans-serif;
 }
 /* contenitore della cartolina */
 #cartoline {
    background-color: transparent;
    width: 400px;
    height: 400px;
    display: inline-block;
    padding: 80px;
  }
  
  /* contenitore per posizionare la cartolina */
  .cartoline-posizione {
    position: relative;
    width: 100%;
    height: 100%;
    text-align: center;
    transition: transform 0.8s;
    transform-style: preserve-3d;
  }
  
  /* gira la cartolina quando cliccata */
  #cartoline .cartoline-posizione:active {
    transform: rotateY(180deg);
  }
  
  /* posizione del davanti e del retro della cartolina */
  .cartolina-davanti, .cartolina-sfondo {
    position: absolute;
    bottom: 10px;
    right: 10px;
    left: -2px;
    top: -2px;
    /*non faccio vedere il dietro se sto facendo vedere il davanti e viceversa */
    backface-visibility: hidden;
  }
  
  /* stile davanti se manca l'immagine */
  .cartolina-davanti {
    background-color: #fff;
    color: black;
  }
  
  /* stile retro */
  .cartolina-sfondo {
    width: 400px;
    height: 400px;
    transform: rotateY(180deg);
    background-image: url(pics/back.jpg);
    
  } 
.cartolina-testo{
    padding-right: 40px;
    color: black;
    text-align: right;
}