* {-webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box}
html, body {width:100%; height:100%; padding:0; margin:0}
a, a:hover {-webkit-transition:all 300ms linear; -moz-transition:all 300ms linear; -o-transition:all 300ms linear; -ms-transition:all 300ms linear; transition:all 300ms linear} .text-center{text-align:center}
logo{margin:0; padding:0; display:inline-block}
.error-logo {color:#fff !important; width:167px; height:17px; margin:20px 0; text-indent:-9999px; display:inline-block; background:url(https://d2poexpdc5y9vj.cloudfront.net/webapp/2.0/img/logo.png)}
.particles {width:100%; height:100vh; overflow:hidden; position:relative}
.bg-img{background-image:url(https://d2poexpdc5y9vj.cloudfront.net/webapp/2.0/img/404.jpg); background-size:cover; background-position:50% 50%; width:100%; height:100%}
.overlay{width:100%; height:100%; padding:0 30px; top:0; left:0; position:absolute; background:rgba(10, 100, 142, 0.85)}
img.error-img{margin-bottom:16px; animation-name:bounceIn; animation-duration:1s}
.error-text{width:100vw; height:100vh; display:table-cell; text-align:center; vertical-align:middle}
.error-text h1 {font-family:"Nexa", Arial, sans-serif; font-size:35px; margin:0 0 12px; padding:0; letter-spacing:1px; font-weight:normal; color:#fff; animation-name:flipInX; animation-duration:3s}
.error-text p {font-family:"Open Sans", Arial, sans-serif; font-size:13px; font-weight:normal; color:#fff; margin:0 0 16px; padding:0; animation-name:flipInX; animation-duration:2s}
.error-text a.btn{border:2px solid rgba(255,255,255,.8); padding:12px 24px; display:inline-block; margin:12px; font:normal 13px "Open Sans", Arial, sans-serif; text-transform:uppercase; text-decoration:none; color:rgba(255,255,255,.8); animation-name:fadeInUp; animation-duration:1s; -webkit-transform:translateZ(0); transform:translateZ(0); -webkit-backface-visibility:hidden; backface-visibility:hidden; -moz-osx-font-smoothing:grayscale; position:relative; -webkit-transition-property:color; transition-property:color;  -webkit-transition-duration:0.3s; transition-duration:0.3s}
.error-text a.btn:before {content:""; position:absolute; z-index:-1; top:0; left:0; right:0; bottom:0; background:#fff; -webkit-transform:scaleY(0); transform:scaleY(0); -webkit-transform-origin:50% 100%; transform-origin:50% 100%; -webkit-transition-property:transform; transition-property:transform;
 -webkit-transition-duration:0.3s; transition-duration:0.3s; -webkit-transition-timing-function:ease-out; transition-timing-function:ease-out}
.error-text a.btn:hover, .error-text a.btn:focus, .error-text a.btn:active {color:#333; border-color:#fff}
.error-text a.btn:hover:before, .error-text a.btn:focus:before, .error-text a.btn:active:before {-webkit-transform:scaleY(1); transform:scaleY(1)}


@-webkit-keyframes bounceIn {0% {opacity:0; -webkit-transform:scale(.3); transform:scale(.3)} 50% {opacity:1; -webkit-transform:scale(1.05); transform:scale(1.05)} 70% {-webkit-transform:scale(.9); transform:scale(.9)} 100% {-webkit-transform:scale(1); transform:scale(1)}}
 @keyframes bounceIn {0% {opacity:0; -webkit-transform:scale(.3); -ms-transform:scale(.3); transform:scale(.3)} 50% {opacity:1; -webkit-transform:scale(1.05); -ms-transform:scale(1.05); transform:scale(1.05)} 70% {-webkit-transform:scale(.9); -ms-transform:scale(.9); transform:scale(.9)} 100% {-webkit-transform:scale(1); -ms-transform:scale(1); transform:scale(1)}}

@-webkit-keyframes flipInX {0% { -webkit-transform:perspective(400px) rotateX(90deg); transform:perspective(400px) rotateX(90deg); opacity:0} 40% {-webkit-transform:perspective(400px) rotateX(-10deg); transform:perspective(400px) rotateX(-10deg)} 70% {-webkit-transform:perspective(400px) rotateX(10deg); transform:perspective(400px) rotateX(10deg)} 100% {-webkit-transform:perspective(400px) rotateX(0deg); transform:perspective(400px) rotateX(0deg); opacity:1}}
 @keyframes flipInX {0% {-webkit-transform:perspective(400px) rotateX(90deg); -ms-transform:perspective(400px) rotateX(90deg); transform:perspective(400px) rotateX(90deg); opacity:0} 40% {-webkit-transform:perspective(400px) rotateX(-10deg); -ms-transform:perspective(400px) rotateX(-10deg); transform:perspective(400px) rotateX(-10deg)} 70% {-webkit-transform:perspective(400px) rotateX(10deg); -ms-transform:perspective(400px) rotateX(10deg); transform:perspective(400px) rotateX(10deg)} 100% { -webkit-transform:perspective(400px) rotateX(0deg); -ms-transform:perspective(400px) rotateX(0deg); transform:perspective(400px) rotateX(0deg); opacity:1}}

@-webkit-keyframes fadeInUp {0% {opacity:0; -webkit-transform:translateY(20px); transform:translateY(20px)} 100% {opacity:1; -webkit-transform:translateY(0); transform:translateY(0)}}
 @keyframes fadeInUp {0% {opacity:0; -webkit-transform:translateY(20px); -ms-transform:translateY(20px); transform:translateY(20px)} 100% {opacity:1; -webkit-transform:translateY(0); -ms-transform:translateY(0); transform:translateY(0)}}

.overlay-white{width:100%; height:100%; padding:0 30px; top:0; left:0; position:absolute; background:rgba(255, 255, 255, 1)}
.general-error .error-text h1{color:#474747} .general-error .error-text p{color:#6a6a6a}
.general-error .error-text a.btn{border:2px solid #249dd6; color: #333}
.general-error .error-text a.btn:before {content:""; position:absolute; z-index:-1; top:0; left:0; right:0; bottom:0; background:#249dd6; -webkit-transform:scaleY(0); transform:scaleY(0); -webkit-transform-origin:50% 100%; transform-origin:50% 100%; -webkit-transition-property:transform; transition-property:transform; -webkit-transition-duration:0.3s; transition-duration:0.3s; -webkit-transition-timing-function:ease-out; transition-timing-function:ease-out}
.general-error .error-text a.btn:hover, .general-error .error-text a.btn:focus, .general-error .error-text a.btn:active {color:#fff; border-color:#249dd6}
.general-error .error-text a.btn:hover:before, .general-error .error-text a.btn:focus:before, .error-text a.btn:active:before {-webkit-transform:scaleY(1); transform:scaleY(1)}


@media (max-width: 767px) {
.error-text h1{font-size:22px; line-height:normal}
.error-text{height:auto}
img.error-img{margin-top:20px}
.error-text a.btn{padding:8px 14px; margin:4px; font-size:11px}

}