@import url('https://fonts.googleapis.com/css?family=Cairo:400,700,900&subset=arabic');
*{
    margin:0;
    padding:0;
    border:0;
    outline:0;
    font-size:100%;
    vertical-align:baseline;
    text-decoration: none;
    font-family: 'Cairo', sans-serif;
    text-rendering: optimizeLegibility;
    
}
html{
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
   
}

@media only screen and (max-width: 480px) {
    .aid-text {
        margin: 50px 0 30px !important;
    }
}
body{
font-family: 'Cairo', sans-serif;
text-rendering: optimizeLegibility;
padding:7px;
direction:rtl;
background-image: url(../img/bg.jpg);
}
.clr{clear:both;}
#HomePage{position: sticky;width:95%;margin:auto;/*padding-top: 200px;*/}
footer {
    width: 100%;
    padding-bottom: 20px;
}
.uk-margin {
	margin-bottom: 30.5px !important;
}
.inpu{border:1px solid #00b5cc;border-radius: 35px;text-align:center;width: 400px;}
.button {
    background-color: #00b5cc; /* Green */
    border: none;
    border-radius: 30px;
    color: white;
    padding: 5px 22px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 21px;
    margin: 4px 2px;
    cursor: pointer;
    -webkit-transition-duration: 0.4s; /* Safari */
    transition-duration: 0.4s;
    width:170px;
}
.button:hover {
   background-color: #0ab28b; /* Green */ 
} 
.aid-text{color:#fff;font-size:20px;font-weight:bold;line-height:30px;font-family: 'Cairo', sans-serif;width:60%;}
.col-3 b {
    color: #fff;
    font-size: 12px;
}
.col-3 {
	display: inline-block;
	margin:15px 7px;
	padding:7px 3px 5px;
	width: 25%;
	/*border:solid 7px #fff; */
	cursor:pointer;
	border-radius: 3px;
	clip-path: polygon( 
    calc(0% + 3px) calc(0% + 3px), /* top left */
    calc(100% - 3px) calc(0% + 3px), /* top right */
    calc(100% - 3px) calc(100% - 3px), /* bottom right */
    calc(0% + 3px) calc(100% - 3px) /* bottom left */
  );
  transition: clip-path 0.8s linear;
}
.col-3:hover {
	clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
}
.col-3 input {
	display: block;
	margin:10px 0 0;
}
@media screen and (min-width: 200px) and (max-width: 1000px){ 
.uk-margin {
	margin-bottom: 0px !important;
	margin-top: 10px;
}
.button {
	width: 175px !important;
	margin: 0px 0px !important;
	padding: 1px 9px !important;	
	font-size: 18px !important;
}
* + .uk-margin {
	margin-top: 5px 0 0 !important;
}
.aid-text{font-size:14px;width:90%;line-height: 25px !important;margin: 10px 0 0;}  
#HomePage{position: sticky;width:95%;margin:auto;padding-top:0px;} 
.inpu{border:1px solid #00b5cc;border-radius: 35px;text-align:center;width: 80%;} 
footer {width: 100%;font-size:12px;}  
}
* + h1, * + .uk-h1, * + h2, * + .uk-h2, * + h3, * + .uk-h3, * + h4, * + .uk-h4, * + h5, * + .uk-h5, * + h6, * + .uk-h6, * + .uk-heading-small, * + .uk-heading-medium, * + .uk-heading-large, * + .uk-heading-xlarge, * + .uk-heading-2xlarge {
	margin-top: 25px !important;
}