@font-face {
  font-family: coolvetica;
  src: url(images/Coolvetica.otf);
}
            @font-face {
  font-family: gothic;
  src: url(images/gothic.otf);
}
            body{
                background-color: #282828;
                cursor: crosshair;
            }
            h1{
                font-family: "gothic";
                font-size: 115px;
                padding: 5px;
                color: #ffffff;
                text-align: center;
                font-weight: 100;
                text-shadow: 9px 15px 3px #727272;
                animation: decayText 8s ease-in-out infinite;
            }
            h2{
                font-family: "coolvetica";
                font-style: italic;
                font-size: 23px;
                padding: 5px;
                color: #cdcdcd;
            }
            
            
            a{
                font-family: "coolvetica";
                color: white;
            }
            a:hover{
                font-style: italic;
                cursor: crosshair;
            }
            
            b{
                color: white;
                font-family: "coolvetica";
            }
            
            p{
                font-family: "coolvetica";
                color: #cdcdcd;
            }
        
            .container{
                padding: 5px;
                position: relative;
                overflow: hidden;
            }
            
.polaroid{
    position: absolute;
    z-index: -1;
    margin-left: 666px;
    margin-top: 200px;
    animation: decayShift 8s ease-in-out infinite;
}
.box{
    width: 447px;
    height: 800px;
    margin-left: 233px;
}

.box h1{
    text-align: right;
}

.box p{
    text-align: right;
}
            @keyframes decayShift {
  0%   { filter: grayscale(100%) brightness(0.8); transform: rotate(0deg); }
  50%  { filter: grayscale(30%) brightness(0.7) sepia(37%) hue-rotate(75deg); transform: rotate(-3deg); }
  100% { filter: grayscale(100%) brightness(0.8); transform: rotate(0deg); }
}
            @keyframes decayShift2 {
  0%   { transform: rotate(0deg); }
  50%  { transform: rotate(-5deg); }
  100% { transform: rotate(0deg); }
}
            @keyframes decayShift3 {
  0%   { transform: rotate(0deg); }
  50%  { transform: rotate(-5deg); }
  100% { transform: rotate(0deg); }
}
            @keyframes decayText {
  0%   { filter: grayscale(100%) brightness(0.8); }
  50%  { filter: grayscale(30%) brightness(0.7) sepia(37%) hue-rotate(75deg); }
  100% { filter: grayscale(100%) brightness(0.8); }
}