* {

  -webkit-box-sizing: border-box;

          box-sizing: border-box;

}



body {

  background-color: #ffffff;

  padding: 0;

  margin: 0;

}



#notfound {

  position: relative;

  height: 100vh;

}



#notfound .notfound {

  position: absolute;

  left: 50%;

  top: 50%;

  -webkit-transform: translate(-50%, -50%);

      -ms-transform: translate(-50%, -50%);

          transform: translate(-50%, -50%);

}



.notfound {

  max-width: 410px;

  width: 100%;

  text-align: center;

}



.notfound .notfound-404 {

  height: 280px;

  position: relative;

  z-index: -1;

}



.notfound .notfound-404 h1 {

  font-family: 'Montserrat', sans-serif;

  font-size: 210px;

  margin: 0px;

  font-weight: 900;

  position: absolute;

  left: 50%;

  -webkit-transform: translateX(-50%);

      -ms-transform: translateX(-50%);

          transform: translateX(-50%);

  background: url('../img/bg.jpg') no-repeat;

  -webkit-background-clip: text;

  -webkit-text-fill-color: transparent;

  background-size: cover;

  background-position: top;

  white-space: nowrap;

}





.notfound h2 {

  font-family: 'Montserrat', sans-serif;

  color: #1d1d1d;

  font-size: 24px;

  font-weight: 700;

  margin-top: 0;

}



.notfound p {

  font-family: 'Montserrat', sans-serif;

  color: #000000;

  font-size: 15px;

  font-weight: 500;

  margin-bottom: 20px;

  margin-top: 20px;

}



.notfound a {

  margin-top: 20px;

  font-family: 'Montserrat', sans-serif;

  font-size: 20px;

  text-decoration: none;

  text-transform: uppercase;

  background: #f53333;

  display: inline-block;

  padding: 15px 30px;

  border-radius: 40px;

  color: #ffffff;

  font-weight: 700;

  -webkit-box-shadow: 0px 4px 15px -5px #ff0000;

          box-shadow: 0px 4px 15px -5px #ff0000;

}


@media only screen and (max-width: 767px) {

    .notfound .notfound-404 {

      height: 200px;

    }

    .notfound .notfound-404 h1 {

      font-size: 86px;

      line-height: 85%;

      white-space: normal;

      }

}