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

body { background-color:#000; }
.contenitore { position:relative; overflow: hidden; }
.background { width:100%; height:auto; }
.corpo { position: absolute; width: 700px; height: 400px; top: 50%; left: 50%; margin-top: -200px; margin-left: -350px; }
.opaco { background-color: #000; opacity: 0.5; border-radius: 15px; position:absolute; z-index:1; width:100%; height:100%; }
.testo { color: #FFF; padding-left:15px; position:absolute; z-index:2; width:670px; height:100%; font-family:Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif; }
a:link { color:red; text-decoration:none; }

.Titolo { font-size: 90px; text-align: center; color: white; position: relative; top:20px; }
.Testo { font-size: 30px; text-align: center; color: white; position: relative; top:60px; }
.Testo2 { font-size: 20px; text-align: center; color: white; position: relative; top:80px; }
.Testo3 { font-size: 14px; text-align: center; color: white; position: relative; top:80px; }
.Footer { font-size: 20px; color: white; position: relative; top:148px; }



/* make keyframes that tell the start state and the end state of our object */
 
@-webkit-keyframes fadeInScale { from { opacity:0; transform: scale(3, 3); } to { opacity:1; transform: scale(1, 1); } }
@-moz-keyframes fadeInScale { from { opacity:0; transform: scale(3, 3); } to { opacity:1; transform: scale(1, 1); } }
@keyframes fadeInScale { from { opacity:0; transform: scale(3, 3); } to { opacity:1; transform: scale(1, 1); } }

@-webkit-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
@-moz-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
@keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
 
.fade-inScale {
    opacity:0;  /* make things invisible upon start */
    -webkit-animation:fadeInScale ease-in 1;  /* call our keyframe named fadeIn, use animattion ease-in and repeat it only 1 time */
    -moz-animation:fadeInScale ease-in 1;
    animation:fadeInScale ease-in 1;
 
    -webkit-animation-fill-mode:forwards;  /* this makes sure that after animation is done we remain at the last keyframe value (opacity: 1)*/
    -moz-animation-fill-mode:forwards;
    animation-fill-mode:forwards;
 
    -webkit-animation-duration:1.2s;
    -moz-animation-duration:1.2s;
    animation-duration:1.2s;
}
.fade-in {
    opacity:0;  /* make things invisible upon start */
    -webkit-animation:fadeIn ease-in 1;  /* call our keyframe named fadeIn, use animattion ease-in and repeat it only 1 time */
    -moz-animation:fadeIn ease-in 1;
    animation:fadeIn ease-in 1;
 
    -webkit-animation-fill-mode:forwards;  /* this makes sure that after animation is done we remain at the last keyframe value (opacity: 1)*/
    -moz-animation-fill-mode:forwards;
    animation-fill-mode:forwards;
 
    -webkit-animation-duration:1s;
    -moz-animation-duration:1s;
    animation-duration:1s;
}
 
.fade-in.one {
-webkit-animation-delay: 0.7s;
-moz-animation-delay: 0.7s;
animation-delay: 0.7s;
}
 
.fade-in.two {
-webkit-animation-delay: 2.0s;
-moz-animation-delay:2.0s;
animation-delay: 2.0s;
}
 
.fade-in.three {
-webkit-animation-delay: 4.0s;
-moz-animation-delay: 4.0s;
animation-delay: 4.0s;
}