/**
 * Desarrollo: Portal de Proveedores - La Unión Madrileña de Seguros S.A.
 * Ver. 2.0.0
 *
 * File: style-error
 * Ver. 2.0.1 - 19.11.2025
 *
**/

.error-wrapper {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    min-height: 100vh;
    text-align: center;
}
.error-wrapper.maintenance-bg {
    background-image: url(../images/other-images/maintenance-bg.jpg);
    background-blend-mode: overlay;
}
.error-wrapper .maintenance-icons li i {
    color: var(--color76);
    font-size: 50px;
    animation: rotate-effect 40s infinite linear reverse;
}
.error-wrapper .maintenance-icons li:nth-child(2) i {
    font-size: 100px;
    margin-left: 110px;
    margin-top: -25px;
    animation: rotate-effect 40s linear infinite reverse;
}
.error-wrapper .maintenance-icons li:nth-child(3) i {
    -webkit-animation: rotate-effect 30s infinite linear;
    animation: rotate-effect 30s infinite linear;
    font-size: 150px;
    margin-top: -85px;
    margin-right: 120px;
}
.error-wrapper .maintenance-heading {
    margin-top: 70px;
}
.error-wrapper .maintenance-heading .headline {
    font-size: 99px;
    font-weight: 900;
    letter-spacing: 10px;
    color: var(--color70);
    z-index: 2;
    position: relative;
    margin-top: -70px;
}
.error-wrapper .error-heading {
    margin-top: 115px;
}
.error-wrapper .error-heading .headline {
    font-size: 285px;
    font-weight: 700;
    letter-spacing: 1px;
    margin-top: -130px;
}
.error-wrapper .sub-content {
    font-size: 16px;
    color: var(--color11);
    letter-spacing: 1px;
    font-weight: 400;
    line-height: 26px;
    z-index: 3;
    position: relative;
    margin-top: 10px;
    margin-bottom: 0;
    font-weight: 600;
}
.error-wrapper .btn {
    margin-top: 15px;
}
.error {
    margin: 70px 0 100px;
    color: var(--color6);
}
.error .error-title {
    font-size: 9.5rem;
    color: var(--color0);
    text-shadow: 6px 6px 7px var(--color37);
}
.error .line-bottom {
    width: 10%;
    height: 5px;
    background-color: var(--color71);
    border: none;
}
.error .c-white {
    color: var(--color0);
}
.error .error-btn {
    text-align: center;
}
.error .padd {
    padding: 10px 30px 10px 30px;
}
.error .btn-back-home {
    background-color: var(--color72);
    color: var(--color6);
}
.error .btn-back-home:hover {
    background-color: var(--color71);
    color: var(--color0);
    -webkit-box-shadow: 0 20px 35px 0 var(--color77);
    box-shadow: 0 20px 35px 0 var(--color77);
}
.error .btn-adnc-serc {
    background-color: var(--color73);
    color: var(--color0);
}
.error .btn-adnc-serc:hover {
    background-color: var(--color71);
    color: var(--color0);
    -webkit-box-shadow: 0 20px 35px 0 var(--color77);
    box-shadow: 0 20px 35px 0 var(--color77);
}
.maintenance-sec .error-wrapper .maintenance-heading .headline {
    margin-bottom: 0;
}
.maintenance-sec .error-wrapper .sub-content {
    margin-top: 15px;
}
@-webkit-keyframes wheel-rotate {
    50% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
    -webkit-animation-timing-function: cubic-bezier(.55, .085, .68, .53);
    animation-timing-function: cubic-bezier(.55, .085, .68, .53);
}
100% {
    -webkit-transform: rotate(960deg);
    transform: rotate(960deg);
}
}
@keyframes wheel-rotate {
    50% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
    -webkit-animation-timing-function: cubic-bezier(.55, .085, .68, .53);
    animation-timing-function: cubic-bezier(.55, .085, .68, .53);
}
100% {
    -webkit-transform: rotate(960deg);
    transform: rotate(960deg);
}
}
@-webkit-keyframes bicycle-run {
    0% {
    -webkit-transform: translateX(-1300px);
    transform: translateX(-1300px);
}
50% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    -webkit-animation-timing-function: cubic-bezier(.47, 0, .745, .715);
    animation-timing-function: cubic-bezier(.47, 0, .745, .715);
}
100% {
    -webkit-transform: translateX(1300px);
    transform: translateX(1300px);
}
}
@keyframes bicycle-run {
    0% {
    -webkit-transform: translateX(-1300px);
    transform: translateX(-1300px);
}
50% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    -webkit-animation-timing-function: cubic-bezier(.47, 0, .745, .715);
    animation-timing-function: cubic-bezier(.47, 0, .745, .715);
}
100% {
    -webkit-transform: translateX(1300px);
    transform: translateX(1300px);
}
}
@-webkit-keyframes move-1 {
    0% {
    -webkit-transform: translateY(-10px);
    transform: translateY(-10px);
}
50% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
}
100% {
    -webkit-transform: translateY(-10px);
    transform: translateY(-10px);
}
}
@keyframes move-1 {
    0% {
    -webkit-transform: translateY(-10px);
    transform: translateY(-10px);
}
50% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
}
100% {
    -webkit-transform: translateY(-10px);
    transform: translateY(-10px);
}
}
.error-page1 .danger-color {
    fill: var(--color74);
}
.error-page1 .warning-color {
    fill: var(--color71);
}
.error-page1 .primary-color {
    fill: var(--color1);
}
.error-page1 .primary-color.opacity-05 {
    fill: var(--color76);
}
.error-page1 .secondary-color {
    fill: var(--color70);
}
.error-page1 .secondary-color.opacity-o6 {
    opacity: .6;
}
.error-page1 .secondary-color.opacity-o4 {
    opacity: .4;
}
.error-page1 .secondary-color.lighten-5 {
    fill: var(--color75);
}
.error-page1 .svg-wrraper {
    margin-bottom: 35px;
}
.error-page1 .svg-wrraper svg.svg-45 {
    width: 40%}
.error-page1 .svg-wrraper svg.svg-60 {
    width: 60%}
.error-page1 .svg-wrraper svg.svg-40 {
    width: 40%}
.error-page1 .wheel {
    -webkit-animation: wheel-rotate 6s ease infinite;
    animation: wheel-rotate 6s ease infinite;
    -webkit-transform-origin: center;
    transform-origin: center;
    transform-box: fill-box;
}
.error-page1 .bicycle {
    -webkit-animation: bicycle-run 15s ease infinite;
    animation: bicycle-run 15s ease infinite;
}
.error-page1 .circle {
    -webkit-animation: circle-anim ease infinite;
    animation: circle-anim ease infinite;
    -webkit-transform-origin: center;
    transform-origin: center;
    transform-box: fill-box;
    -webkit-perspective: 0;
    perspective: 0;
}
.error-page1 .rocket, .error-page1 .jacket-man {
    -webkit-animation: move-1 6s linear infinite;
    animation: move-1 6s linear infinite;
}
.error-page1 h3 {
    font-weight: 700;
    text-transform: capitalize;
}
.error-page1 .btn-primary-gradien {
    color: var(--color0);
    font-weight: 700;
}
.logo-header-error {
    position: absolute;
    width: 170px;
    z-index: 9;
    top: 0;
}
.img-error-svg img {
    width: 50%;
    margin-bottom: 20px;
}
.img-error-svg2 img {
    width: 50%;
    margin-bottom: 20px;
}
.img-error-svg3 img {
    width: 50%;
    margin-bottom: 20px;
}
@media (max-width:1560px) {
    .error-page1 .svg-wrraper svg.svg-45, .error-page1 .svg-wrraper svg.svg-40 {
    width: 35%}
.logo-header-error {
    width: 150px;
}
}
@media (max-width:1399px) {
    .error-page1 .svg-wrraper svg.svg-45, .error-page1 .svg-wrraper svg.svg-40 {
    width: 40%}
.img-error-svg img {
    width: 70%}
.img-error-svg2 img {
    width: 45%}
.img-error-svg3 img {
    width: 40%}
}
@media (max-width:991px) {
    .error-page1 .svg-wrraper svg.svg-45, .error-page1 .svg-wrraper svg.svg-40 {
    width: 50%}
.img-error-svg img {
    width: 80%}
.img-error-svg2 img {
    width: 70%}
.img-error-svg3 img {
    width: 60%}
}
@media (max-width:767px) {
    .error-page1 h3 {
    font-size: 22px;
}
.error-page1 .svg-wrraper svg.svg-45, .error-page1 .svg-wrraper svg.svg-40 {
    width: 60%}
.img-error-svg2 img {
    width: 80%}
.img-error-svg3 img {
    width: 70%}
}
@media (max-width:575px) {
    .error-page1 .svg-wrraper {
    margin-bottom: 10px;
}
.error-page1 .svg-wrraper svg.svg-45, .error-page1 .svg-wrraper svg.svg-40 {
    width: 80%}
.img-error-svg2 img {
    width: 80%}
.img-error-svg3 img {
    width: 90%}
}