@import url('https://fonts.googleapis.com/css2?family=Tajawal:wght@300;400;500;700;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;700;900&display=swap');
body{font-family: 'Tajawal', sans-serif; }
/****************** Header **********************/
body {background: #FFF;}
.nomargin { margin: auto;}
.nopadding { padding: 0px;}
/*******************************************************/
.div-404-all { padding: 72px 0px;}
.div-404-img { padding-bottom: 72px;}
.div-404-body h1{ 
padding-bottom: 20px;
color: #F26530;
font-size: 40px;
font-style: normal;
font-weight: 700;
line-height: 156.5%; /* 62.6px */
	text-transform: capitalize;}
.div-404-body p{ 
padding-bottom: 32px;
	margin: auto;
width: 75%;
color: #87786C;
font-size: 24px;
font-style: normal;
font-weight: 700;
line-height: 156.5%; /* 37.56px */
text-transform: capitalize;
}
.div-404-body a{
display: flex;
width: 364px;
height: 74px;
padding: 21.71px 52.345px 20.29px 49.655px;
justify-content: center;
align-items: center;
	/******/
border-radius: 16px;
background: #F26530;
	/*******/
color: #FFF;
font-size: 24px;
font-style: normal;
font-weight: 700;
line-height: 31.429px; /* 130.953% */
text-transform: uppercase;
	/*******/
	margin: auto;
	text-decoration: none;
}
.div-404-body a:hover,.div-404-body a:active{
background: var(--on_hover);
	/*******/

}
/****************************************************************/

/***********************   Responsive   *************************/
@media (max-width:1920px) {
  .container-xxl, .container-xl, .container-lg, .container-md, .container-sm, .container {
      max-width: 1590px;}

}
@media (max-width:1800px) {

}
@media (max-width:1536px) {
  .container-xxl, .container-xl, .container-lg, .container-md, .container-sm, .container {
      max-width: 1294px;}
	/*************/
	.div-404-img {padding-bottom: 54px;}
	.div-404-img img{width: 21%;}
	/************/
    .div-404-body h1{ font-size: 30px; margin: 0px; padding-bottom: 15px; }
	.div-404-body p{ font-size: 18px;  padding-bottom: 24px; }
	.div-404-body a{ font-size: 18px;border-radius: 12px; width: 273px;height: 55.5px;padding: 16.283px 39.008px 15.217px 36.992px;}
}
	/******************************/

@media (max-width:1440px) {
  .container-xxl, .container-xl, .container-lg, .container-md, .container-sm, .container {
      max-width: 1192.5px;}
      

}
@media (max-width:1280px) {
  .container-xxl, .container-xl, .container-lg, .container-md, .container-sm, .container {
      max-width: 1192.5px;}
    
}
@media (max-width:1024px) {
  .container-xxl, .container-xl, .container-lg, .container-md, .container-sm, .container {
      max-width:960px;}
   
}
@media (max-width:990px) {

}
@media (max-width: 772px){

}
@media (max-width:768px) {
.div-404-img img {width: 29%;}

@media (max-width:767px) {

 
}
	@media (max-width:702px) {
		}

@media (max-width:550px) {
	.div-404-img {padding-bottom: 42px;}
	.div-404-all{padding: 56px 16px;}
.div-404-body h1{ font-size: 16px; margin: 0px; padding-bottom: 7px; }
	.div-404-body p{width: 100%; font-size: 16px;  padding-bottom: 24px;font-style: normal;font-weight: 500;line-height: normal; }
	.div-404-body a{ width: 80%; height: auto; padding: 12px 32px; font-size: 20px;
font-style: normal;
font-weight: 500;
line-height: 152.9%; /* 30.58px */}
}
}
@media (max-width:425px) {	
	.div-404-img {padding-bottom: 24px;min-width: 104px;}

	}
@media (max-width:370px) {
.div-404-body a {
    width: 80%;
    height: auto;
    padding: 12px;
    font-size: 18px;
    font-style: normal;
    font-weight: 500;
    line-height: 152.9%;
}
}
@media (max-width:320px) {

}