@font-face {
   font-family: SFUIText;
   src: url(../../fonts/SFUIText-Light.otf) format("opentype");
   font-weight: 300;
   font-style: normal
}

@font-face {
   font-family: SFUIText;
   src: url(../../fonts/SFUIText-Regular.otf) format("opentype");
   font-weight: 400;
   font-style: normal
}

@font-face {
   font-family: SFUIText;
   src: url(../../fonts/SFUIText-Medium.otf) format("opentype");
   font-weight: 500;
   font-style: normal
}

@font-face {
   font-family: SFUIText;
   src: url(../../fonts/SFUIText-Semibold.ttf) format("truetype");
   font-weight: 600;
   font-style: normal
}

@font-face {
   font-family: SFUIText;
   src: url(../../fonts/SFUIText-Bold.otf) format("opentype");
   font-weight: 700;
   font-style: normal
}
body {
   margin: 0;
   padding: 0;
   overflow-x: hidden;
   font-family: SFUIText;
   font-weight: 400;
   font-size: 16px
}
.error-page-wrp{
   position: fixed;
   flex-direction: column;
   top: 0;
   left: 0;
   width: 100%;
   height: 100vh;
   overflow: hidden;
   display: flex;
   justify-content: center;
   align-items: center;
   background: white;
   padding-top: 30px;
   padding-bottom: 30px;
}
.error-page-wrp::before{
   position: absolute;
   content: '';
   width: 100%;
   height: 100%;
   top: 0;
   left: 0;
   background: rgba(7, 103, 158, 0.4);
   z-index: -1;
}
.error-page-wrp::after{
   position: absolute;
   content: '';
   width: 100%;
   height: 100%;
   top: 0;
   left: 0;
   background: url(../../img/main-bg.jpg);
   background-size: cover;
   background-repeat: no-repeat;
   background-position: center;
   z-index: -2;
}
.error-page-wrp__dec{
   margin-left: auto;
   margin-right: auto;
   width: 200px;
   height: 200px;
   z-index: -1;
}
.error-page-wrp .error-name{
   font-size: 200px;
   font-weight: 100;
   color: #ffdbb8;
}
.error-page-wrp .font-bold{
   font-size: 50px;
   font-weight: 100;
   color: #ffdbb8;
}
.error-page-wrp .error-desc a{
   background: #d39a61;
   box-shadow: inset 0 0 0 1px #ffdbb8;
   border: 4px solid #d39a61;
   transition: all .2s linear;
   font-family: SFUIText;
   font-weight: 600;
   font-size: 14px;
   color: #fff;
   display: block;
   line-height: 42px;
   padding: 5px 50px;
   text-align: center;
   margin-top: 30px;
}
.error-page-wrp .error-desc a:hover{
   background: #d9a775;
   border-color: #d9a775;
}
@media screen and (max-width: 768px){
   .error-page-wrp .error-name{
      font-size: 100px;
   }
   .error-page-wrp .font-bold{
      font-size: 35px;
      text-align: center;
   }
}