@import url(http://fonts.googleapis.com/earlyaccess/droidarabicnaskh.css);
@import url('https://fonts.googleapis.com/css?family=Cairo:400,900&subset=arabic');

/* POWERED www.Chakirdev.com */

*{
    margin:0;
    padding:0;
    border:0;
    outline:0;
    font-size:100%;
    vertical-align:baseline;
    direction:rtl;
    text-decoration: none;
    font-family:'Cairo', serif;
    text-rendering: optimizeLegibility;
}

body{
    font-family:'Cairo', serif;
    text-rendering: optimizeLegibility;
    direction:rtl;
    background-color: #F7F7F7;
}
ul{list-style: none;}
input{border-radius:0px;}
h1{font-family: 'Cairo';}
h2{font-family: 'Cairo';}
h3{font-family: 'Cairo';}
h4{font-family: 'Cairo';}

.lft{float:left;}
.rgt{float:right;}
.clr{clear:both;}
.tahoma{font-family: 'tahoma';}
.droid{font-family: 'Droid Arabic Naskh';}
.cairo{ font-family:'Cairo', serif;}
.f25{font-size:25px;}
.f20{font-size:20px;}

#HomePage{width:1100px;margin:auto;}

.clearfix2:before, .clearfix2:after {  content: "\0020"; display: block; height: 0; visibility: hidden;    } 
.clearfix2:after { clear: both; }
.clearfix2 { zoom: 1; }

/* FOOTER  */
footer{background: white;height:auto;border-top:5px solid #0F7AE5;overflow: hidden;}
.social2{width:40px;margin-left: 10px;margin-top: 10px;}
.tag-area{margin-top:10px;width:200px;}


.uk-navbar-container .uk-navbar .uk-navbar-nav li a{font-family: 'Cairo';font-size: 17px;}
a:hover{text-decoration:none; }
.rightblog{width:770px;margin-right:10px;}
.leftblog{width:300px;margin-right:10px;}
.imgcontainer{width:250px;min-height:200px;max-height:400px;}
.cardcontainer{width:480px;padding:15px;}
.cardcontainer p{text-align:justify;}
#share-buttons img {
width: 45px;
padding: 5px;
border: 0;
box-shadow: 0;
display: inline;
}   

.display-mobile{display: none;}
.display-desk{display: block;}

@media screen and (min-width: 200px) and (max-width: 399px){
#HomePage{width:300px;margin:auto;}
.display-mobile{display: block;}
.display-desk{display: none;}   
.rightblog{width:300px;margin-right:0px;}
.leftblog{width:300px;margin-right:0px;margin-top:20px;}
.imgcontainer{width:300px;min-height:200px;max-height:400px;}
.cardcontainer{width:290px;padding:10px;}    
.cardcontainer p{text-align:justify;padding:10px;}  
.tag-area{margin-top:10px;width:150px;}    
}
@media screen and (min-width: 400px) and (max-width: 499px){
#HomePage{width:400px;margin:auto;}
.display-mobile{display: block;}
.display-desk{display: none;}   
.rightblog{width:400px;margin-right:0px;}
.leftblog{width:400px;margin-right:0px;margin-top:20px;}
.imgcontainer{width:400px;min-height:200px;max-height:400px;}
.cardcontainer{width:390px;padding:10px;}    
.cardcontainer p{text-align:justify;padding:10px;}  
.tag-area{margin-top:10px;width:150px;}    
}
@media screen and (min-width: 500px) and (max-width: 699px){
#HomePage{width:500px;margin:auto;}
.display-mobile{display: block;}
.display-desk{display: none;}   
.rightblog{width:500px;margin-right:0px;}
.leftblog{width:500px;margin-right:0px;margin-top:20px;}
.imgcontainer{width:500px;min-height:200px;max-height:400px;}
.cardcontainer{width:490px;padding:10px;}    
.cardcontainer p{text-align:justify;padding:10px;}  
.tag-area{margin-top:10px;width:150px;}    
}
@media screen and (min-width: 700px) and (max-width: 859px){
#HomePage{width:700px;margin:auto;}
.display-mobile{display: block;}
.display-desk{display: none;}   
.rightblog{width:380px;margin-right:0px;}
.leftblog{width:300px;margin-right:15px;margin-top:0px;}
.imgcontainer{width:370px;min-height:200px;max-height:400px;}
.cardcontainer{width:370px;padding:10px;}    
.cardcontainer p{text-align:justify;padding:10px;}  
.tag-area{margin-top:10px;width:170px;}    
}
@media screen and (min-width: 850px) and (max-width: 980px){
#HomePage{width:850px;margin:auto;}
.display-mobile{display: block;}
.display-desk{display: none;}   
.rightblog{width:530px;margin-right:0px;}
.leftblog{width:300px;margin-right:10px;margin-top:0px;}
.imgcontainer{width:530px;min-height:200px;max-height:400px;}
.cardcontainer{width:510px;padding:10px;}    
.cardcontainer p{text-align:justify;padding:10px;}  
.tag-area{margin-top:10px;width:170px;}    
}