*{padding:0; margin:0; box-sizing:border-box;}
body{font-family:'Inter Regular', 'Tajawal Medium';}



@media screen and (min-width:360px) and (max-width:1024px)
{
	.main-header{height:auto; flex-direction: column;}
	.main-tilte-header{order:3;padding:0;}
	.logo-header{order:2; margin-bottom:20px;}
	.dz-flag{order:1; height:80px; margin-bottom:20px;}
	.main-tilte-header h1{font-size:20px;}
	.main-tilte-header h2{font-size:14px;}
	
	.colored-fullwidth{background:url("../imgs/bg-content.png")70% -50px no-repeat ,linear-gradient(#22414a, #051c23);}
	
	.container-buttons-index{max-width:100%; flex-direction:row; justify-content:center; padding-top:0; margin-bottom:20px;}
	.btn-index{margin:0 10px; font-size:14px;}
	
	
	.container-double-zone-index{background:rgba(0,0,0,0.6); padding:20px; border-radius: 8px;}
	
	.container-zones-index{flex-direction:column; justify-content:center; align-items:center;}
	.double-zone-index{width:100%; flex-direction:column; justify-content:center;}
	.zone-index{max-width:100%; margin-bottom:50px;}
	.zone-index[lang="fr"]{order:2;}
	.zone-index[dir="rtl"]{order:1;}
	
}




@media screen and (min-width:360px) and (max-width:490px)
{
	.container-buttons-index{max-width:100%; flex-direction:column; justify-content:center; padding-top:0; margin-bottom:20px;}
	.btn-index{margin:0 0 10px 0; font-size:14px;}
}