html,body {
  font-family: Raleway;
  overflow:hidden;
  width:100%;
  height:100%;
  position:absolute;
  background: linear-gradient(25deg,#16054A,#C8A6B4);
  text-shadow: 0px 1px 2px rgba(0,0,0,0.4);
}
.container  {
  width:100%;
  height:100%;
  position:absolute;
}
#blurCanvasTop{
  left:0%;
  top:0%;
  position:absolute;
}
#blurCanvasBottom{
  left:50%;
  top:0;
  position:absolute;
}
.content {
  left:15%;
  top:20%;
  width:70%;
  position:relative;
}
h1.title {
  color:white;
  font-size: 4vw;
  display:inline;
  font-weight:500;
}
p.desc{
  position:relative;
  width:100%;
  font-size:4vw;
  color:rgba(255,255,255,1);
  font-weight: 200;
  margin-bottom:40px;
}
.contacts {
  position:absolute;
  right:0%;
  bottom:0;
  margin-bottom:1vw;
  margin-right:1vw;
}
.contact li {
  list-style-type:none;
  float:left;
  color: rgba(255,255,255,0.8);
  font-weight:100;
  font-size:27px;
}
.contact li a {
  text-decoration:none;
  color: rgba(255,255,255,0.8);
}
.contact li a:hover{
  color:rgba(255,255,255,1);
}
.contact li~li {
  margin-left:1vw; 
}
.blur {
  width:100%;
  height:100%;
  position:absolute;
  overflow:hidden;
}
.blurTop{
  left:40%;
  top:-110%;
  transform:rotate(20deg);
  transform-origin: 0 100%;
}
.blurBottom{
  left:-60%;
  top:100%;
  transform:rotate(20deg);
  transform-origin: 100% 0%;
}

.gif {
position: absolute;
overflow:hidden;
top: 10%; right: 100px;
height: auto;

}