body {
        background-color: palegoldenrod;
        color: hsl(220, 11%, 11%);
        font-family: "Silkscreen", sans-serif;
        padding: 30px;
    }
      .dividercenter {
        margin: auto;
        padding-top: 20px;
        text-align: center;
      }  
      .imageheader {
        display: flex;
        justify-content: center;
        align-items: center;
        text-align: center;
        padding: 10px;
      }
      .imageheader img {
        max-width: 100%;
        min-width: 5%;
      }
      .header {
        margin: 0;
        padding: 0%;
        text-align: center;
      }
      .headerbutton {
        text-align: center;
        display: inline-block;
        box-shadow: inset -1px -1px #0a0a0a, inset 1px 1px #fff, inset -2px -2px grey,
        inset 2px 0px #dfdfdf;
        border-radius: 0px;
        background: hsl(175, 64%, 82%);
        display: inline-block;
        width: auto;
        text-decoration: none;
        padding: 10px;
        line-height: 1;
      }
      .marqueebg {
        padding: 20px;
        margin: 20px;
        text-align: center;
        background-color: cyan;
        border-style: outset;
      }
      .about {
        padding: 50px;
        margin: auto;
        text-align: center;
      }
      .container {
        padding: 20px;
        margin: 20px;
        border-style: outset;
        background-color: hsl(175, 64%, 82%);
      }
      .portfolio {
        display: flex;
        flex-wrap: wrap;
        justify-content: flex-start;
        align-items: center;
      }
      .portfolio-item {
        margin: 5px;
        border-style: outset;
        width: 500px;
        height: auto;
      }
      .portfolio-item:hover {
        border-color: blue;
      }
      .portfolio-item img {
        width: 100%;
        height: auto;
      }
    .img-floatinganim {
        animation-name: floating; 
        animation-duration: 3s; 
        animation-iteration-count: infinite; 
        animation-timing-function: ease-in-out;
        } 

        @keyframes floating { 
        0% { 
        transform: translate(0,  0px); 
        } 

        50%  { 
        transform: translate(0, 15px); 
        } 

        100%   {
        transform: translate(0, -0px); 
        } 
        }
    .text{
     transition: 0.5s;
   }
   
    .text:hover{
  letter-spacing: 7px;
    }

    #textpop {
    -webkit-animation: pop 1s ease-in-out infinite alternate;
    animation: pop 1s ease-in-out infinite alternate;
    -moz-animation: pop 1s ease-in-out infinite alternate;
    text-align: center;
}

@keyframes pop {
from {
transform:scale(0.95)
}

50% {
transform:scale(1)
}

to {
transform:scale(0.95)
}
}

@-webkit-keyframes pop {
from {
-webkit-transform:scale(0.95)

}

50% {
-webkit-transform:scale(1)

}

to {
-webkit-transform:scale(0.95)

}
}