/*----*****---- << 404 Error - Type 2 >> ----*****----*/

.error404 .type1 h2 {color: var(--wdtHeadAltColor); font-family: var(--wdtFontTypo_Alt);font-size: clamp(11.25rem, 6.2395rem + 7.8212vw, 15.625rem);/* 250-180 */font-weight: var(--wdtFontWeight_Ext);line-height: 0.85;letter-spacing: 0;text-transform: uppercase;margin: 0;margin-bottom: clamp(0.9375rem, 0.6259rem + 1.0409vw, 1.875rem);/*30px - 15px*/}
body.error404 div.wrapper::before {content: '';position: absolute;inset: 0;width: 100%;height: 100%;pointer-events: none;opacity: 0;}
.error404 .type1 h3 {position: relative;display: inline-block;font-size: clamp(1.625rem, 1.4172rem + 0.694vw, 2.25rem);/* Min-26 & Max-36 */font-weight: var(--wdtFontWeight_H3);top: 0;margin: 0;max-width: 620px;text-align: left;line-height: var(--wdtLineHeight_H3);margin-bottom: 16px;}
.error404 .type1 h4 {width: 100%;max-width: 570px;font-size: var(--wdtFontSize_H3);font-weight: var(--wdtFontWeight_H3);line-height: var(--wdtLineHeight_Alt);font-family: var(--wdtFontTypo_Alt);text-transform: capitalize;padding-bottom: 30px;margin: 0;border: 0;}
.error404 .type1 p {font-size: var(--wdtFontSize_Base);font-weight: var(--wdtFontWeight_Base);color: var(--wdtBodyTxtColor);margin-bottom: clamp(1.875rem, 1.2517rem + 2.0819vw, 3.75rem);/* mx-60 mn-30 */text-align: left;}
.error404 .type1 a.wdt-button {display: flex;     flex-direction: row-reverse; align-items: center;font-size: var(--wdtFontSize_Base);font-weight: var(--wdtFontWeight_Ext);letter-spacing: 0;text-transform: capitalize;padding:5px 24px 5px 5px;-webkit-border-radius: var(--wdtRadius_Part);border-radius: var(--wdtRadius_Part);margin: 0;background-color: transparent;color: var(--wdtSecondaryColor);justify-content: center;text-align: center;border: 1px solid var(--wdtSecondaryColor);line-height: var(--wdtLineHeight_Ext);font-family: var(--wdtFontTypo_Base);}
.error404 .type1 a.wdt-button i {margin-right: 15px;-webkit-transition: var(--wdt-Ad-Transition);transition: var(--wdt-Ad-Transition);display: flex;align-items: center;position: relative;width: 40px;height: 40px;background: var(--wdtPrimaryColor);justify-content: center;color: var(--wdtAccentTxtColor);border-radius: var(--wdtRadius_Full);}
.error404 .type1 a.wdt-button i::before {margin: 0;}

/* Accents */
.error404 .type1 h3 {color: var(--wdtHeadAltColor);}
.error404 .type1 a.wdt-button:hover {background-color: var(--wdtLinkHoverColor);color: var(--wdtAccentTxtColor); border-color: var(--wdtLinkHoverColor);}
.error404 .type1 a.wdt-button:hover i {background: var(--wdtAccentTxtColor);color: var(--wdtPrimaryColor);}
.center-content-wrapper div {font-size: var(--wdtFontSize_Ext);
    font-family: var(--wdtFontTypo_Base);
    font-weight: var(--wdtFontWeight_Ext);
    line-height: var(--wdtLineHeight_Base);
    text-transform: uppercase;
    color: var(--wdtPrimaryColor);
    position: relative;
    backface-visibility: hidden;
    border: 1px solid var(--wdtBorderColor);
    display: inline-block;
    border-radius: var(--wdtRadius_Part);
    padding: 4px 20px 0;margin-bottom: 20px;}
/* .center-content-wrapper div:before {content: '';display: inline-flex;width: 30px;height: 1px;background-color: currentColor;margin-right: 12px;}
.center-content-wrapper div:after {content: '';position: absolute;left: 34px;width: 4px;height: 4px;background-color: currentColor;border-radius: var(--wdtRadius_Full);} */
/*--------------------------------------------------------------
    Responsive
--------------------------------------------------------------*/
@media (max-width:1280px) {
	body.error404 div.wrapper::before {background-image: linear-gradient(90deg, var(--wdtTertiaryColor) 35%, transparent 100%);opacity: 1;}
}

@media only screen and (min-width:768px) and (max-width:1024px) {
	.error404 .type1 h2 {font-size: 180px;}
	body.error404 div.wrapper::before {background-image: linear-gradient(90deg, var(--wdtTertiaryColor) 54%, transparent 100%);opacity: 1;}
}

@media only screen and (min-width: 480px) and (max-width: 767px) {
	.error404 .container {width: 100%;padding: 0 10%;}
	.error404 .type1 h2,
	.error404 h2 {font-size: 120px;
	}

	body.error404 div.wrapper::before {background-image: linear-gradient(90deg, var(--wdtTertiaryColor) 60%, transparent 100%);opacity: 1;}
}

@media only screen and (max-width: 479px) {
	.error404 .container {width: 100%;padding: 0 20px;}
	.error404 .type1 h4 {width: 100%;}
	.error404 h1,.error404 h2,.error404 h3,.error404 h4,.error404 h5,.error404 h6 {line-height: normal;}
	.error404 h3 {font-size: 70px;letter-spacing: 0;}
	.error404 .type1 h2,.error404 h2 {font-size: 120px;}
}

@media only screen and (min-width: 320px) and (max-width: 479px) {
	.error404 .type1 h2 {font-size: 90px;}
	.error404 .type1 h4 {font-size: var(--wdtFontSize_H4);}
}

@media only screen and (max-width: 319px) {
	.error404 .type1 h2 {font-size: 40px;}
	.error404 .type1 h4 {font-size: var(--wdtFontSize_H5);}
}