/*  18/‎09/‎2023-08:40 PM ‎*/   
/* Global */
/* 
display: flex;
align-items: center;
justify-content: center;
text-align: center;
place-items: center;  
font-family: 'Tajawal' , sans-serif;

list-style: none;
box-shadow: 3px 4px 0px 0px #67368f;
   
box-shadow: 0 0 0.9em var(--clr1);
line-height: 1.5;
--clr1: #4F008C;
----------------------------------------------------------*/

 
/*  
<link href="Styles/animate.min.css" rel="stylesheet" type="text/css" />
 <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/4.1.1/animate.min.css" />
@import url('https://kwty.online/v.aspx');
@import url('https://kwty.online/Styles/animate.min.css');
*/

@import url('https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css');
@import url('https://cdnjs.cloudflare.com/ajax/libs/animate.css/4.1.1/animate.min.css');
@import url('https://fonts.googleapis.com/css2?family=Righteous&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Tajawal&display=swap');




 
 


.hcss
{
  display: none;  
    } 
    
    
    
 
    
:root
{
    --clr1: #4F008C;
    --clr2: #aa3dff;
    --clr3: #6699ff;
} 

*
{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    
}


html
{
    width: 100%;
    height: auto;
    min-height: 100vh;
    padding: 0;
    top: 0;
    left: 0;
    margin: 0;
    padding: 0;
}

body
{
    height: auto;
    box-sizing: border-box;
   	background: #ffffff;
	
}

.main
{
     width: 100%;
    height: 100vh;
    height: auto;
    padding: 0px;
    margin: 0px auto auto auto;
 
}



      .mapsz
{
    padding: 0px;
    width: 100%;
    height: 100%;
    margin: auto;
    border: 0px solid var(--nav-color);
   
    color: #000080;
    font-size: calc(0.9em + 0.9vw);
    font-weight: 900;
    font-family: 'Tajawal' , sans-serif;
    cursor: text;
    display: flex;
    flex-flow: wrap;
    align-items: center;
    justify-content: center;
    text-align: center;
    line-height: 30px;
    direction: ltr;
    background-color: #FFFFFF;
    border-radius: 0px 4px 4px 0px;
    border: 3px solid #000080;
}
   

/* PC css   */   
@media only screen and (max-width:1600px) and (min-width:900px){ 

/* Nav */
.logo
    {
        
        width:55px;
        height: 40px;
        padding: 0px;
        margin: auto;
        color: #FFFFFF;
    }

.header
{
    background: var(--clr1);
    padding: 0px;
    position: relative;
    height: 50px;
    font-family: 'Tajawal' , sans-serif;
    font-weight: 900;
    color: #FFFFFF;
    
}
 
 .header .nav ul li a
{
    width: 190px;
    height: 100%;
    margin: auto;
    padding: 13px 0 13px 0;
    display: block;
        font-size: calc(0.5em + 0.5vw);
    text-transform: capitalize;
    transition: all 0.5s ease;
    text-align: center;
    color: #FFFFFF;
    font-weight: bold;
   
}
/* Nav */
}
 

/* Mob css */
@media (max-width:900px) and (min-width:200px) {
 
/* Nav */
.logo
    {
        width: 70px;
        height: 45px;
        padding: 0px;
        margin: 2px auto auto 10px;
        float: left;
       color: #FFFFFF;
    }
.header
{
    background: var(--clr1);
    padding: 0px;
    position: relative;
    height: 50px;
    font-family: 'Tajawal' , sans-serif;
    font-weight: 900;
    color: #FFFFFF;
     position: relative;
     
     
}
 
 .header .nav ul li a
{
    width: 100%;
    height: 100%;
    margin: auto;
    padding: 14px 0 14px 0;
    display: block;
    font-size: 16px;
    text-transform: capitalize;
    transition: all 0.5s ease;
    text-align: center;
    color: #FFFFFF;
    text-align:right;
    padding-right:30px; 
      
}
/* Nav */
}





a{
	text-decoration: none;
}
ul{
	list-style: none;
}
.container
{
   
    width: 100%;
    margin: auto;
    height: 100%;
}
.row{
	display: flex;
	flex-wrap: wrap;
}
.align-items-center{
	align-items: center;
}
.justify-content-between{
	justify-content: space-between;
}

.header .logo, .header .nav{

	padding:0px;
}
.header .nav ul li
{
    display: inline-block;
    padding-right: 0px;
    padding-left: 0px;
}





.header .nav ul li a:hover{
	color: #ffffff;
	   background-color: var(--clr2);
}
.header #nav-check{
	position: absolute;
	opacity:0;
	pointer-events: none;
}
.nav-toggler
{
    height: 34px;
    width: 44px;
    background: #9933FF;
    border-radius: 4px;
    cursor: pointer;
    display: none;
    align-items: center;
    justify-content: center;
    margin-right: 15px;
    color: #FFFFFF;
    font-weight: bold;
}
.nav-toggler span{
	display: block;
	height: 2px;
	width: 20px;
	background: var(--clr1);
	position: relative;
}
.nav-toggler span::before,
.nav-toggler span::after{
   content: '';
   position: absolute;
   width: 100%;
   height: 100%;
   background: var(--clr1);
   left:0;
}
.nav-toggler span::before{
	top: -6px;
}
.nav-toggler span::after{
	top: 6px;
}
@media(max-width: 991px){
    .nav-toggler{
    	display: flex;
    }
    .header .nav{
    	position: absolute;
    	left:0;
    	top:100%;
    	width: 100%;
    	background: var(--clr1);
    	border-top: 1px solid rgba(255,255,255,0.2);
    	opacity:0;
    	visibility: hidden;
    	
    }
    .header .nav ul li{
    	display: block;
    	margin:0;
    }
    .header #nav-check:checked ~ .nav{
       opacity: 1;
       visibility: visible;
    }
    .header #nav-check:focus ~ .nav-toggler{
    	box-shadow: 0 0 15px #000000;
    }
    .header #nav-check:checked ~ .nav-toggler span{
    	background-color: transparent;
    }
    .header #nav-check:checked ~ .nav-toggler span::before{
    	top:0;
    	transform: rotate(45deg);
    }
    .header #nav-check:checked ~ .nav-toggler span::after{
    	top:0;
    	transform: rotate(-45deg);
    }
}
/******************************* Start Spcs *******************************/	
.spc1{width:auto;height:1px;margin:1px;padding:1px;text-align:center}
.spc2{width:auto;height:2px;margin:2px;padding:2px;text-align:center}
.spc3{width:auto;height:3px;margin:3px;padding:3px;text-align:center}
.spc4{width:auto;height:4px;margin:4px;padding:4px;text-align:center}
.spc5{width:auto;height:5px;margin:5px;padding:5px;text-align:center}
.spc10{width:auto;height:10px;margin:10px;padding:10px;text-align:center}
.spc15{width:auto;height:15px;margin:15px;padding:15px;text-align:center}
.spc20{width:auto;height:20px;margin:20px;padding:20px;text-align:center}
/******************************* end Spcs *******************************/