* {
  -webkit-box-sizing: border-box;
  box-sizing        : border-box;
}

body {
  padding: 0;
  margin : 0;
}

#not-found {
  position        : relative;
  height          : 100vh;
  background-color: #dfe1e6;
}

#not-found .not-found {
  position         : absolute;
  left             : 50%;
  top              : 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform    : translate(-50%, -50%);
  transform        : translate(-50%, -50%);
}

.not-found {
  max-width : 520px;
  width     : 100%;
  text-align: center;
}

.not-found .not-found-bg {
  position         : absolute;
  left             : 0px;
  right            : 0px;
  top              : 50%;
  -webkit-transform: translateY(-50%);
  -ms-transform    : translateY(-50%);
  transform        : translateY(-50%);
  z-index          : -1;
}

.not-found .not-found-bg>div {
  width        : 95%;
  background   : #fff;
  border-radius: 90px;
  height       : 125px;
}

.not-found .not-found-bg>div:nth-child(1) {
  -webkit-box-shadow: 5px 5px 0px 0px #f3f3f3;
  box-shadow        : 5px 5px 0px 0px #f3f3f3;
}

.not-found .not-found-bg>div:nth-child(2) {
  -webkit-transform : scale(1.3);
  -ms-transform     : scale(1.3);
  transform         : scale(1.3);
  -webkit-box-shadow: 5px 5px 0px 0px #f3f3f3;
  box-shadow        : 5px 5px 0px 0px #f3f3f3;
  position          : relative;
  z-index           : 10;
}

.not-found .not-found-bg>div:nth-child(3) {
  -webkit-box-shadow: 5px 5px 0px 0px #f3f3f3;
  box-shadow        : 5px 5px 0px 0px #f3f3f3;
  position          : relative;
  z-index           : 90;
}

.not-found h1 {
  font-family   : 'Quicksand', sans-serif;
  font-size     : 86px;
  text-transform: uppercase;
  font-weight   : 700;
  margin-top    : 0;
  margin-bottom : 8px;
  color         : #151515;
}

.not-found h2 {
  font-family: 'Quicksand', sans-serif;
  font-size  : 26px;
  margin     : 0;
  font-weight: 700;
  color      : #151515;
}

.not-found a {
  font-family    : 'Quicksand', sans-serif;
  font-size: 10px;
  text-decoration: none;
  text-transform : uppercase;
  background     : #18e06f;
  display        : inline-block;
  padding: 10px 15px;
  border-radius  : 5px;
  color          : #fff;
  font-weight    : 700;
  margin-top: 11px;
}

.not-found-social {
  margin-top: 11px;
}

.not-found-social>a {
  display           : inline-block;
  height: 30px;
  line-height: 30px;
  width: 30px;
  font-size         : 14px;
  color             : #fff;
  background-color  : #dedede;
  margin            : 3px;
  padding           : 0px;
  -webkit-transition: 0.2s all;
  transition        : 0.2s all;
}

.not-found-social>a:hover {
  background-color: #18e06f;
}

@media only screen and (max-width: 767px) {
  .not-found .not-found-bg {
    width : 287px;
    margin: auto;
  }

  .not-found .not-found-bg>div {
    height: 85px;
  }
}

@media only screen and (max-width: 480px) {
  .not-found h1 {
    font-size: 58px;
  }

  .not-found h2 {
    font-size: 13px;
  }
}