body {
    background-image: url("../img/trekker.jpg");
    background-repeat: no-repeat;
    background-size: cover;
    background-position-x: center;

    display: flex;
    justify-content: center;
    align-items: flex-end;

    overflow: hidden;
}


.text {
    color: white;
    letter-spacing: 50px;

    position: absolute;
    bottom: 0px;
}

.blur {
}

.shake {
    animation: shake 0.82s cubic-bezier(.36,.07,.19,.97) both infinite;
    transform: translate3d(0, 0, 0);
    backface-visibility: hidden;
    perspective: 1000px;
  }
  
  @keyframes shake {
    10%, 90% {
      transform: translate3d(-2px, 0, 0);
    }
    
    20%, 80% {
        transform: translate3d(4px, 0, 0);

        -webkit-filter: blur(5px);
        -moz-filter: blur(5px);
        -o-filter: blur(5px);
        -ms-filter: blur(5px);
        filter: blur(5px);
    }
  
    30%, 50%, 70% {
      transform: translate3d(-8px, 0, 0);
    }
  
    40%, 60% {
        transform: translate3d(8px, 0, 0);

        -webkit-filter: blur(0px);
        -moz-filter: blur(0px);
        -o-filter: blur(0px);
        -ms-filter: blur(0px);
        filter: blur(0px);
    }
  }


/* Large desktop */
@media (min-width: 1200px) { 
  .text {
    font-size: 100px;
  }
}

/* Portrait tablet to landscape and desktop */
@media (min-width: 768px) and (max-width: 979px) { 
  .text {
    font-size: 100px;
  }
}

/* Landscape phone to portrait tablet */
@media (max-width: 767px) {
  .text {
    font-size: 50px;
  }
}

/* Landscape phones and down */
@media (max-width: 480px) { 
	.text {
    font-size: 30px;
  }
}