body{
 /* background-color: rgb(2, 0, 8);*/
    overflow: hidden;
    display: cover; 
    height: 100vh;
    margin: 0;
    min-height: 100vh;
  }
   
 
  .water img {
    position: absolute;
    margin: bottom 0;
    margin-right:0;
    height: 100%;
    width: 100%;
    filter: url("#turbulence");
    background-color: rgb(247, 247, 245);
    -ms-transform: rotate(0deg); /* IE 9 */
    transform: rotate(0deg);
  }
  
 
  #title h1{
    position: absolute;
    background-image: linear-gradient(to right, rgb(73, 254, 254,0.5) , rgba(237, 188, 197,0.5));
    padding:10px 0px 10px 0px;
    left: 39.5%;
    width: 100%;
    bottom:-170px;
    font-size: 20px;
    font-family: 'Philosopher', sans-serif;

    font-weight: bolder;
    color: rgb(205, 208, 212); 
    text-shadow: 2px 2px 2px rgb(30, 30, 5);
    animation-name: example;
    animation-duration: 11s;
    animation-iteration-count: infinite;
  } 
  @keyframes example {
    from {color: rgba(168,247,247,0.3);}
    to {color:  rgba(237, 188, 197,0.5);}
  } 


.footer{
position: absolute;
width: 100%;
bottom: -15px;
padding:0px 0px -10px 0px;
z-index: 5;
background-color: transparent;
text-align: center;
display: flex;
/*justify-content: center;*/
 align-items: center;

 
}   

.footer img {
position: relative;
padding: 10px ;
width: 30px;
height: 30px;
}

      
.footer h3 {
        position: relative;
        
        margin-left: 0px;
        padding-left: 50px ;
        padding-right: 100px;
        font-family: 'Philosopher', sans-serif;
        font-size: 14px;
        color: #322e2f;
}   

.footer #t :hover {
background-color: #049ef7;
border-radius: 50%;
transform: scale(1.2);
}

.footer #f :hover {
background-color: #0b0bd2;
border-radius: 50%;
  transform: scale(1.2);
}

.footer #i :hover {
    background-color: #d20ba7;
    border-radius: 50%;
      transform: scale(1.2);
}

    .footer #yt :hover {
        background-color: #ad2509;
        border-radius: 50%;
          transform: scale(1.3);
 }

    .footer #hom {
    font-family:'Philosopher', sans-serif; ;
    font-size: 20px;
    padding: 0px;
    padding-left: 0px;
    margin-left: 0%;
    
}
   .footer #hom :hover  {        
    transform: scale(1.3);  
    color:rgb(2, 38, 38);       
}

  
  .footer #ingles :hover  {       
    transform: scale(1.3);
    color:rgb(17, 78, 79); 
    }

  a {
    text-decoration: none;
    color: rgb(191, 128, 137);
  }
  a b:hover {
    
    color: rgb(167, 11, 37);
    transform: scale(1.3);
    
  }
 


 p {
   /* con relative, sparisce il sommario...così posso allungarmi!! con absolute rimane il sommy*/
   position: absolute;
   padding-top:10px;
   margin-top:0px;
   padding-left: 13px;
 
   padding-bottom: 10%;
   font-family: 'Shadows Into Light', cursive;
   border-radius: 18px;
   border-top-right-radius: 70%;
   border-bottom-left-radius: 30%;
   font-size: 19px;
   line-height:19px;
    color: #7d5f64;
    font-weight: bolder;
    background-color: rgb(73, 254, 254); 
    transition: all 1.5s ease; 
    text-align: left;
    width: 600px;
    }

    #works11 p {
      /* con relative, sparisce il sommario...così posso allungarmi!! con absolute rimane il sommy*/
      position: absolute;
      margin-left: -70px;
      padding-bottom:180px;
      margin-top:-25px;
      padding-left: 0px;
      padding-right: 0px;
      font-family: 'Shadows Into Light', cursive;
      border-top-left-radius: 90%;
      border-bottom-right-radius: 30%;
      border-top-right-radius: 18px;
      font-size: 19px;
       line-height:19px;
      color: transparent;
       opacity: 0.5;
       background-color: rgb(244, 203, 209,210);
       background-image: linear-gradient(to right, rgb(191, 128, 137),rgb(246, 231, 233));
       transition: all 0.5s ease; 
       text-align: left;
       width: 700px;
  }

   


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

   .footer {
        width: 100%;
        padding: 10px;
 }

  #title h1{
    position: absolute;
    width: 100%;
    font-size: 16px;
  }

  .footer h3 {
    position: relative;
    display: flex;
    margin-bottom: -10px;
    font-size: 12px;
    width: auto;
    height: 50px;
  }

  p{
    position: absolute;
    font-size: 18px;
    line-height: 18px;
    width: auto;
  }

  .footer img {
    position: relative;
    display: flex;
    margin-bottom: -10px;
    padding: 5px;
    width: auto;
    height: 30px;
    }

}