/*  Fonts  */

@font-face {
  font-family: 'mansoorbari';
   src: url('../fonts/PDMS_Saleem_QuranFont-signed.eot'); /*IE9 Compat Modes */
   src: url('../fonts/PDMS_Saleem_QuranFont-signed.eot?#iefix') format('embedded-opentype'),  /* IE6-IE8 */
        url('../fonts/PDMS_Saleem_QuranFont-signed.woff2') format('woff2'),  /*Super Modern Browsers */
        url('../fonts/PDMS_Saleem_QuranFont-signed.woff') format('woff'), /* Pretty Modern Browsers */
        url('../fonts/PDMS_Saleem_QuranFont-signed.ttf')  format('truetype'), /* Safari, Android, iOS */
        url('../fonts/PDMS_Saleem_QuranFont-signed.svg#svgFontName') format('svg');  /* Legacy iOS */
	   
}


@font-face {
  font-family: 'qalam';
  src: url('../fonts/AlQalamQuranMajeed.eot'); /* IE9 Compat Modes */
  src: url('../fonts/AlQalamQuranMajeed.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/AlQalamQuranMajeed.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/AlQalamQuranMajeed.woff') format('woff'), /* Pretty Modern Browsers */
       url('../fonts/AlQalamQuranMajeed.ttf')  format('truetype'), /* Safari, Android, iOS */
       url('../fonts/AlQalamQuranMajeed.svg#svgFontName') format('svg'); /* Legacy iOS */
	   font-weight: normal;
       font-style: normal;
}
	
@font-face {
    font-family: 'Al_Mushaf';
    src: url('../fonts/Al_Mushaf.ttf');
}


@font-face {
    font-family: 'raleway-regular';
    src: url('../fonts/raleway-regular.eot');
    src: url('../fonts/raleway-regular.eot?#iefix') format('embedded-opentype'),
         url('../fonts/raleway-regular.woff') format('woff'),
         url('../fonts/raleway-regular.ttf') format('truetype'),
         url('../fonts/raleway-regular.svg#ralewayregular') format('svg');
    font-weight: normal;
    font-style: normal;

}


@font-face {
    font-family: 'raleway-bold';
    src: url('../fonts/raleway-bold.eot');
    src: url('../fonts/raleway-bold.eot?#iefix') format('embedded-opentype'),
         url('../fonts/raleway-bold.woff') format('woff'),
         url('../fonts/raleway-bold.ttf') format('truetype'),
         url('../fonts/raleway-bold.svg#ralewaybold') format('svg');
    font-weight: normal;
    font-style: normal;

}


@font-face {
    font-family: 'raleway-semibold';
    src: url('../fonts/raleway-semibold.eot');
    src: url('../fonts/raleway-semibold.eot?#iefix') format('embedded-opentype'),
         url('../fonts/raleway-semibold.woff') format('woff'),
         url('../fonts/raleway-semibold.ttf') format('truetype'),
         url('../fonts/raleway-semibold.svg#ralewaysemibold') format('svg');
    font-weight: normal;
    font-style: normal;

}



/*  General CSS*/
.faddbf {background:#faddbf;}

.facebook{position:relative;display:inline; padding:10px; }
.facebook .page
{position:relative; float:left; margin-bottom:20px; }
.facebook .post
{position:relative; float:left; margin-bottom:20px;}


.footerlist{
        display: flex;
        column-gap: 1px;
        justify-content: center;
		text-align:center;
        flex-wrap: wrap;
		margin-top: 10px;
  		width:80%;
		vertical-align:bottom;
		background-color:#cda760;
		
		font-family:Verdana, Geneva, sans-serif;
        font-size: 14px;
		margin-left:250px;
    }
	.footerlist ul{background-color:#cda760; text-align:left; }
	.footerlist ul li
	{
		display:block;
		margin-top:15px;
		margin-bottom:15px;
	}
	.footerlist ul li a
	{
		
		color:#fff;
		text-decoration:none;
	}	
		
		.footerlist .part
		{
		display: flex;
		width: 16%;
		height: auto;
		float: left;
		position: relative;
		overflow:hidden;
		vertical-align: middle;
		text-align:left;
		
		/*justify-content: center;*/ 
		margin:10px;
		border-right:solid 2px #fff;
	}
		.footerlist .part:last-child
		{
			border:none;
		}
		.footerlist .part:nth-child(5) img
		{
			height:40px;
			text-align:left;
		}
.newfooter{
        display: flex;
        column-gap: 1px;
        justify-content: center;
		text-align:center;
        flex-wrap: wrap;
		margin-top: 0px;
  		width:80%;
		vertical-align:bottom;
		background-color:#cda760;
		color:#fff;
		font-family:Verdana, Geneva, sans-serif;
        font-size: 14px;
		
		margin-left:250px;
		padding-top:5px;
		padding-bottom:25px;
    }
	.newfooter p{ padding-top:10px; padding-left:5px; padding-right:5px; }
    .newfooter a{
        
        display: inline-block;
		padding:5px;
		color:#fff;
        
    }
    .newfooter a:hover{
        opacity: 0.8;
    }
	.newfooter img{
		height:30px; width:30px;
		
	}
	
div.centered{
		width:70%;
		margin-left:250px;
        display: flex;
        column-gap: 1px;
        justify-content: center;
		text-align:center;
        flex-wrap: wrap;
		margin-top: 10px;
  		
    }
    div.centered a{
        
        display: inline-block;
		padding-top:20px;
		padding-bottom:20px;
		padding-left:5px; padding-right:5px;
        
    }
    div.centered a:hover{
        opacity: 0.8;
    }
	div.centered img{
		height:40px; width:40px;
		
	}
		

body{
    background: #fff;
}

.wrapper{
    
    width: 99%;
    margin: 0 auto;
}

header ul.social li a,
.main .work a .caption,
header nav ul li a{
    transition:all .1s linear;
    -webkit-transition:all .1s linear;
    -moz-transition:all .1s linear;
    -o-transition:all .1s linear;
}

h1, h2, h3, h4, h5 ,h6{
    color:#3d3d3d;
    font-family:Verdana, Geneva, sans-serif;
    letter-spacing: 1px;
}

h1              { font-size: 1.5em; margin: .67em 0 }
h2              { font-size: 1.5em; margin: .75em 0 }
h3              { font-size: 1.17em; margin: .83em 0 }
h5              { font-size: .83em; margin: 1.5em 0 }
h6              { font-size: .75em; margin: 1.67em 0 }
h1, h2, h3, h4,
h5, h6          { font-weight: bolder }

.clearfix:before,  
.clearfix:after {  
    content: " ";  
    display: table;  
}  
.clearfix:after {  
    clear: both;  
}  
 
.clearfix {  
    *zoom: 1;  
}


.zero
{padding:0px; margin-top:0px;}

.logo img{  border-top-left-radius:50px;
		border-bottom-right-radius:50px; }


/*  Header  
@media (min-width:1099px) */
@media (min-width:800px)
{
	
    header{
        display: block;
        position: fixed;
        top: 0;
        left: 0;
        width: 200px;
        min-height: 100%;
        padding: 0 0 0 25px;
        background: #ffffff; 
        float: left;
        overflow: hidden;
        z-index: 9999;
  /* fallback #93d8f8 */
  
  background: -webkit-gradient(linear, left top, right top, from(#fff), to(#cda760));
  background: -webkit-linear-gradient(left, #cda760, #fff);
  background: -moz-linear-gradient(left, #cda760, #fff);
  background: -ms-linear-gradient(left, #cda760, #fff);
  background: -o-linear-gradient(left, #cda760, #fff);
  
  border-top-left-radius:40px;
	
	
    }

    header .logo{
        margin-top: 2px; margin-left:-24px; 
		
    }
	
    header nav ul{
        display: block;
        overflow: visible;
        margin-top: 25px;
        list-style: none;
		
    }

    header nav ul li{
        display: block;
        margin-bottom: 20px;
		
    }

    header nav ul li a{
        color:#000000;
        font-family:Verdana, Geneva, sans-serif;
        font-size: 14px;
        text-decoration: none;
        letter-spacing: 1px;
		padding-left:5px;
		padding-right:15px;
		padding-bottom:5px;
		padding-top:5px;
		
		
		background-color:#fff;
		border-top-left-radius:10px;
		border-bottom-right-radius:10px;
		
    }

    header nav ul li a:hover,
    header nav ul li a.selected{
        color: #ffffff;
		background-color:#311e24;
		/**/
        font-family:Verdana, Geneva, sans-serif;
        font-size: 14px;
        text-decoration: none;
        letter-spacing: 1px;
		padding-left:5px;
		padding-right:15px;
		padding-bottom:5px;
		padding-top:5px;
				
		border-top-left-radius:10px;
		border-bottom-right-radius:10px;
    }
	
    header .footer{
        position: relative;
        bottom: 0px;
		margin-bottom:0px;
		margin-top:50px;
    }

    header ul.social{
        list-style: none;
        margin-bottom: 5px;
    }

    header ul.social li{
        display: block;
        float: left;
        position: relative;
        margin: 0 0px 15px 0;
    }


    header ul.social li a{
        display: block;
        width: 30px;
        height: 30px;
        background: url('../img/sm.png') no-repeat;
        background-position: 0 0;
    }


    header ul.social li a:hover{
        background: url('../img/sm_hover.png') no-repeat;
    }



    header ul.social li a.fb,
    header ul.social li a.fb:hover{
        background-position: 0 0;
    }


    header ul.social li a.google,
    header ul.social li a.google:hover{
        background-position: -31px 0;
    }

    header ul.social li a.behance,
    header ul.social li a.behance:hover{
        background-position: -62px 0;
    }

    header ul.social li a.twitter,
    header ul.social li a.twitter:hover{
        background-position: -93px 0;
    }

    header ul.social li a.dribble,
    header ul.social li a.dribble:hover{
        background-position: -124px 0;
    }

    header ul.social li a.rss,
    header ul.social li a.rss:hover{
        background-position: -155px 0;
    }

    header .rights p{
        color:#3d3d3d;
        font-family:Verdana, Geneva, sans-serif;
        font-size: 11px;
        letter-spacing: 1px;
        line-height: 18px;
    }

    header .rights a{
        font-family:Verdana, arial;
        font-weight: bold;
        text-decoration: none;
    }
    #menu_icon,
    .close_menu{
        display: none;
    }
	
	
	

}
/*-----------------------------*/
/*End of @media (min-width:800px)*/
/*-----------------------------*/







#menu_icon,
.close_menu{
    float: right;
    margin-right: 40px;
    width: 40px;
    height: 40px;
    cursor: pointer;
    background: url('../img/men_icons.png') no-repeat;
	
}

#menu_icon{    
    background-position: 0 0;
}
.close_menu{
    background-position: -41px 0!important;
}






/*  Main  */
.main{
    width: 100%;
    height: 100%;
    padding-left: 250px;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    position: relative;
    z-index: 55;
    background: #fff;
	/*background: -webkit-gradient(linear, left top, left bottom, from(#e8e8e8), to(#fff));
	background: -moz-linear-gradient(top,  #e8e8e8,  #fff);*/
    clear: both;
}

.white{background:#ffffff;}

.top10{margin-top:10px;}



/*  Home/portfolio 999999999999999999999999999999999999 */
/*  mansoor ------------------------------------------- */
.main .mansoor{
    display: block;
    width: 20%;
    height: auto;
    float: left;
    position: relative;
    overflow:hidden;
	vertical-align: middle;
	text-align:center;
	/*border:10px #ffffff solid;*/
	margin:10px;
		
}

.main .mansoor .media{
    width: 99%; 
    vertical-align: middle;
	text-align:center;
	border:none;

	border-top-left-radius:40px;
	border-bottom-right-radius:40px;
}
.main .mansoor h2{ max-width:80%;}

.main .mansoor .ali{
    color: #ffffff; background: #311e24;
    font-family:Verdana, Geneva, sans-serif;
	text-align:center;
    font-size: 14px;
    line-height: 28px; max-height:28px;
    width: 99%;
	border-top-left-radius:10px;
	border-bottom-right-radius:10px;
	
}

.main .mansoor .caption{
    position: absolute;
    display: block;
    width: 100%;
    height: 100%;
    top: 0; 
    left: 0;
    background: #ffffff;
    opacity: 0;
}

.main .mansoor a:hover .caption{
    opacity: 1;
	
}
.opacity40 { filter: alpha(opacity=60); opacity: 0.6; }

.work .mansoor .work_title{
    display: block;
    width: 100%; 
	margin-left:0px;
    position: absolute;
    text-align: center; vertical-align:middle;
    top: 50%;
    margin-top: -40px;
	background: #311e24;
}

.main .mansoor .caption h1{
    position: relative;
    display: block;
    width: 98%;
    padding: 5px;
	text-align:center;
    z-index: 77;
    color: #ffffff;
    font-family:Verdana, Geneva, sans-serif; font-weight:normal;
    font-size: 14px;
    letter-spacing: .5px; line-height:20px;
    border-bottom: 1px solid #bfbbbb;
    border-top: 1px solid #bfbbbb;
}
.main .mansoor h2{ max-width:80%;}


/* --mansoor end--------------------------------------------*/
.main .work{
    display: block;
    width: 20%;
    height: auto;
    float: left;
    position: relative;
    overflow:hidden;
	vertical-align: middle;
	text-align:center;
	/*border:10px #ffffff solid;*/
	margin:10px;
		
}

.main .work .media{
    width: 99%; 
    vertical-align: middle;
	text-align:center;
	border:none;

	border-top-left-radius:40px;
	border-bottom-right-radius:40px;
}
.main .work p{
    color:#3d3d3d;
    font-family:Verdana, Geneva, sans-serif;
    font-size: 15px;
    line-height: 24px;
    max-width:80%;
}



.main .work h2{ max-width:80%;}


.main .work .caption{
    position: absolute;
    display: block;
    width: 100%;
    height: 100%;
    top: 0; 
    left: 0;
    background: #ffffff;
    opacity: 0;
}

.main .work a:hover .caption{
    opacity: 1;
	
}
.opacity40 { filter: alpha(opacity=60); opacity: 0.6; }

.work .caption .work_title{
    display: block;
    width: 100%; 
	margin-left:0px;
    position: absolute;
    text-align: center; vertical-align:middle;
    top: 50%;
    margin-top: -40px;
	background: #311e24;
}

.main .work .caption h1{
    position: relative;
    display: block;
    width: 98%;
    padding: 5px;
	text-align:center;
    z-index: 77;
    color: #ffffff;
    font-family:Verdana, Geneva, sans-serif; font-weight:normal;
    font-size: 14px;
    letter-spacing: .5px; line-height:20px;
    border-bottom: 1px solid #bfbbbb;
    border-top: 1px solid #bfbbbb;
}
.main .work h2{ max-width:100%;}


.alimah{
    width: 100%;
	height: 500px;
border-top-left-radius:30px;	
border-top-right-radius:30px;

    overflow: hidden;
    /*display: block;*/
    position: relative;
    background: url('../img/header-alimah1.jpg') no-repeat;
    background-size: cover;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-position: 50% 50%;
}

.alim{
    width: 100%;
	height: 500px;
border-top-left-radius:30px;	
border-top-right-radius:30px;
    overflow: hidden;
    display: block;
    position: relative;
    background: url('../img/header-alim.jpg') no-repeat;
    background-size: cover;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-position: 50% 50%;
}

.farz{
    width: 100%;
	height: 500px;
border-top-left-radius:30px;	
border-top-right-radius:30px;
    overflow: hidden;
    display: block;
    position: relative;
    background: url('../img/header-farz.jpg') no-repeat;
    background-size: cover;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-position: 50% 50%;
}

.grammar{
    width: 100%;
	height: 500px;
border-top-left-radius:30px;	
border-top-right-radius:30px;
    overflow: hidden;
    display: block;
    position: relative;
    background: url('../img/header-grammar.jpg') no-repeat;
    background-size: cover;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-position: 50% 50%;
}

.qaidah{
   height: 500px;
   width: 100%;
border-top-left-radius:30px;	
border-top-right-radius:30px;
    overflow: hidden;
    display: block;
    position: relative;
    background: url('../img/header-qaidah.jpg') no-repeat;
    background-size: cover;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-position: 50% 50%;
}

.tafseer{
    width: 100%;
	height: 500px;
border-top-left-radius:30px;	
border-top-right-radius:30px;
    overflow: hidden;
    display: block;
    position: relative;
    background: url('../img/header-tafseer.jpg') no-repeat;
    background-size: cover;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-position: 50% 50%;
}

.alimah2{
    width: 100%;
	height: 500px;
border-top-left-radius:30px;	
border-top-right-radius:30px;
    overflow: hidden;
    display: block;
    position: relative;
    background: url('../img/header-alimah2.jpg') no-repeat;
    background-size: cover;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-position: 50% 50%;
}

.aboutus{
    
	width: 100%;
	height: 500px;
border-top-left-radius:30px;	
border-top-right-radius:30px;
    overflow: hidden;
    display: block;
    position: relative;
    background: url('../img/header-aboutus.jpg') no-repeat;
    background-size: cover;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-position: 50% 50%;
}

.contactus{
    width: 100%;
	
	height: 500px;
border-top-left-radius:30px;	
border-top-right-radius:30px;
    overflow: hidden;
    display: block;
    position: relative;
    background: url('../img/header-contactus.jpg') no-repeat;
    background-size: cover;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-position: 50% 50%;
}

/*  Inner Page  */
.top{
    width: 100%;
height: 500px;
border-top-left-radius:30px;	
border-bottom-right-radius:30px;
    overflow: hidden;
    display: block;
    position: relative;
    background: url('../img/madani_qaida.jpg') no-repeat;
    background-size: cover;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-position: 50% 50%;
}
.top .title{
    display: block;
    width: 100%;color:#3d3d3d;
    font-family:Verdana, arial;
    font-size: 26px;
    font-weight: bold;
    background: rgba(255, 255, 255, .7);
    padding: 20px;
    text-transform: uppercase;
    line-height: 30px;
    margin: 0!important;
    overflow: hidden;

    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;

}
.top_madani{
    width: 100%;
height: 500px;
border-top-left-radius:30px;	
border-bottom-right-radius:30px;
    overflow: hidden;
    display: block;
    position: relative;
    background: url('../img/madani_qaida.jpg') no-repeat;
    background-size: cover;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-position: 50% 50%;
}
.top_madani .title{
    display: block;
    width: 100%;color:#3d3d3d;
    font-family:Verdana, arial;
    font-size: 26px;
    font-weight: bold;
    background: rgba(255, 255, 255, .7);
    padding: 20px;
    text-transform: uppercase;
    line-height: 30px;
    margin: 0!important;
    overflow: hidden;

    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;

}
.top_ahsan{
    width: 100%;
height: 500px;
border-top-left-radius:30px;	
border-bottom-right-radius:30px;
    overflow: hidden;
    display: block;
    position: relative;
    background: url('../img/ahsan_ul_qawaid.jpg') no-repeat;
    background-size: cover;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-position: 50% 50%;
}
.top_ahsan .title{
    display: block;
    width: 100%;color:#3d3d3d;
    font-family:Verdana, arial;
    font-size: 26px;
    font-weight: bold;
    background: rgba(255, 255, 255, .7);
    padding: 20px;
    text-transform: uppercase;
    line-height: 30px;
    margin: 0!important;
    overflow: hidden;

    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
}
.top_quran{
    width: 100%;
height: 500px;
border-top-left-radius:30px;	
border-bottom-right-radius:30px;
    overflow: hidden;
    display: block;
    position: relative;
    background: url('../img/Quraan.jpg') no-repeat;
    background-size: cover;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-position: 50% 50%;
}
.top_quran .title{
    display: block;
    width: 100%;color:#3d3d3d;
    font-family:Verdana, arial;
    font-size: 26px;
    font-weight: bold;
    background: rgba(255, 255, 255, .7);
    padding: 20px;
    text-transform: uppercase;
    line-height: 30px;
    margin: 0!important;
    overflow: hidden;

    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
}
.top_eslamic{
    width: 100%;
height: 500px;
border-top-left-radius:30px;	
border-bottom-right-radius:30px;
    overflow: hidden;
    display: block;
    position: relative;
    background: url('../img/eslamic_studies.jpg') no-repeat;
    background-size: cover;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-position: 50% 50%;
}
.top_eslamic .title{
    display: block;
    width: 100%;color:#3d3d3d;
    font-family:Verdana, arial;
    font-size: 26px;
    font-weight: bold;
    background: rgba(255, 255, 255, .7);
    padding: 20px;
    text-transform: uppercase;
    line-height: 30px;
    margin: 0!important;
    overflow: hidden;

    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
}
.top_courses{
    width: 100%;
	height: 380px;
border-top-left-radius:30px;	
border-bottom-right-radius:30px;
border-top-left-radius:30px;	
border-bottom-right-radius:30px; 
    overflow: hidden;
    display: block;
    position: relative;
    background: url('../img/header-alimah.jpg') no-repeat;
    background-size: cover;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-position: 50% 50%;
}
.top_courses .title{
    display: block;
    width: 100%;color:#3d3d3d;
    font-family:Verdana, arial;
    font-size: 26px;
    font-weight: bold;
    background: rgba(255, 255, 255, .7);
    padding: 20px;
    text-transform: uppercase;
    line-height: 30px;
    margin: 0!important;
    overflow: hidden;

    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
}
.top_register{
    width: 100%;
height: 500px;
border-top-left-radius:30px;	
border-bottom-right-radius:30px;
    overflow: hidden;
    display: block;
    position: relative;
    background: url('../img/how_to_register.jpg') no-repeat;
    background-size: cover;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-position: 50% 50%;
}
.top_register .title{
    display: block;
    width: 100%;color:#3d3d3d;
    font-family:Verdana, arial;
    font-size: 26px;
    font-weight: bold;
    background: rgba(255, 255, 255, .7);
    padding: 20px;
    text-transform: uppercase;
    line-height: 30px;
    margin: 0!important;
    overflow: hidden;

    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
}
.top_aboutus{
    width: 100%;
height: 500px;
border-top-left-radius:30px;	
border-bottom-right-radius:30px;
    overflow: hidden;
    display: block;
    position: relative;
    background: url('../img/about_us_top.jpg') no-repeat;
    background-size: cover;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-position: 50% 50%;
}
.top_aboutus .title{
    display: block;
    width: 100%;color:#3d3d3d;
    font-family:Verdana, arial;
    font-size: 26px;
    font-weight: bold;
    background: rgba(255, 255, 255, .7);
    padding: 20px;
    text-transform: uppercase;
    line-height: 30px;
    margin: 0!important;
    overflow: hidden;

    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
}
.top_contactus{
    width: 100%;
height: 500px;
border-top-left-radius:30px;	
border-bottom-right-radius:30px;
    overflow: hidden;
    display: block;
    position: relative;
    background: url('../img/contact_us.jpg') no-repeat;
    background-size: cover;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-position: 50% 50%;
}
.top_contactus .title{
    display: block;
    width: 100%;color:#3d3d3d;
    font-family:Verdana, arial;
    font-size: 26px;
    font-weight: bold;
    background: rgba(255, 255, 255, .7);
    padding: 20px;
    text-transform: uppercase;
    line-height: 30px;
    margin: 0!important;
    overflow: hidden;

    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
}
.top_books{
    width: 100%;
height: 500px;
border-top-left-radius:30px;	
border-bottom-right-radius:30px;
    overflow: hidden;
    display: block;
    position: relative;
    background: url('../img/fref.jpg') no-repeat;
    background-size: cover;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-position: 50% 50%;
}
.top_books .title{
    display: block;
    width: 100%;color:#3d3d3d;
    font-family:Verdana, arial;
    font-size: 26px;
    font-weight: bold;
    background: rgba(255, 255, 255, .7);
    padding: 20px;
    text-transform: uppercase;
    line-height: 30px;
    margin: 0!important;
    overflow: hidden;

    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
}
.top_durood{
    width: 100%;
height: 500px;
border-top-left-radius:30px;	
border-bottom-right-radius:30px;
    overflow: hidden;
    display: block;
    position: relative;
    background: url('../img/durood.jpg') no-repeat;
    background-size: cover;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-position: 50% 50%;
}
.top_durood .title{
    display: block;
    width: 100%;color:#3d3d3d;
    font-family:Verdana, arial;
    font-size: 26px;
    font-weight: bold;
    background: rgba(255, 255, 255, .7);
    padding: 20px;
    text-transform: uppercase;
    line-height: 30px;
    margin: 0!important;
    overflow: hidden;

    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;

}
.top_names{
    width: 100%;
height: 500px;
border-top-left-radius:30px;	
border-bottom-right-radius:30px;
    overflow: hidden;
    display: block;
    position: relative;
    background: url('../img/names_top.jpg') no-repeat;
    background-size: cover;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-position: 50% 50%;
}
.top_names .title{
    display: block;
    width: 100%;color:#3d3d3d;
    font-family:Verdana, arial;
    font-size: 26px;
    font-weight: bold;
    background: rgba(255, 255, 255, .7);
    padding: 20px;
    text-transform: uppercase;
    line-height: 30px;
    margin: 0!important;
    overflow: hidden;

    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;

}
.top_kalimas{
    width: 100%;
height: 500px;
border-top-left-radius:30px;	
border-bottom-right-radius:30px;
    overflow: hidden;
    display: block;
    position: relative;
    background: url('../img/kalimas_top.jpg') no-repeat;
    background-size: cover;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-position: 50% 50%;
}
.top_kalimas .title{
    display: block;
    width: 100%;color:#3d3d3d;
    font-family:Verdana, arial;
    font-size: 26px;
    font-weight: bold;
    background: rgba(255, 255, 255, .7);
    padding: 20px;
    text-transform: uppercase;
    line-height: 30px;
    margin: 0!important;
    overflow: hidden;

    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;

}
.work_nav{
    display: block;
    width: 100%;
}

.work_nav .btn{
    float: right;
}

.work_nav ul{
    list-style: none;
}

.work_nav ul li{
    display: block;
    float: left;
    margin: 0 0 1px 1px;
    position: relative;
}

.work_nav a{
    display: block;
    width: 40px;
    height: 40px;
    background: url('../img/p_navigation.png') no-repeat;
    background-position: 0 0;
}

.work_nav a.previous{
    background-position: 0 0;
}

.work_nav a.grid{
    background-position: -41px 0;
}

.work_nav a.next{
    background-position: -82px 0;
}



.content_header{
    position: absolute;
    bottom: 0;
    margin: 0 auto;
    left: 50%;
    margin-left: -46.36363636363637%;
}

.content{
    color:#3d3d3d;
    font-family:Verdana, Geneva, sans-serif;
    font-size: 15px;
    line-height: 22px;
    padding: 0px 10px;
	padding-top:0px;
	padding-bottom:25px;
	padding-left:20px;
	padding-right:20px;
    background: #fff;
	/*background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#e8e8e8));
	background: -moz-linear-gradient(top,  #fff,  #e8e8e8);*/
	height:100%;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
}
.content .poster
{
border-top-left-radius:20px;	
border-top-right-radius:20px;	
}
.content .work{
    display: block;
    width: 30%;
    height: auto;
    float: left;
    position: relative;
    overflow: hidden;
	vertical-align: middle;
	text-align:center;
}
.content .work .media{
    width: 50%;
	margin-left:-75px;
    
	
}

.content iframe{
width:100%;
min-height:100%;
margin-left:0px;	
}
.content p
{
    color:#3d3d3d;
    font-family:Verdana, Geneva, sans-serif;
    font-size: 15px;
    line-height: 24px;
    margin-bottom: 10px;
}
.content ul li{
    color:#3d3d3d;
    font-family:Verdana, Geneva, sans-serif;
    font-size: 15px;
    line-height: 24px;
    margin-bottom: 5px;
	margin-left:60px;
}
/*.content ul li:hover{
	background-color:#311e24;
	color:#ffffff;
}*/

.content h1,
.content h3,
.content h4,
.content h5,
{
    color:#3d3d3d;
    font-family:Verdana, Geneva, sans-serif;
    font-weight: bold;
    line-height: 28px;
    margin-bottom: 10px;

}
.content .work h3
{
text-align:center;
}
.content h6,
{ margin-bottom:0px;

line-height: 18px;
}

.content h2 {
	background-color:#311e24;	
	color:#ffffff;
	font-family:Verdana, Geneva, sans-serif; font-size:16px;
    font-weight: bold;
    line-height: 28px;
    margin-bottom: 10px; 
	padding:2px;
	border-top-left-radius:20px;
	border-bottom-right-radius:20px;
	text-align:center;
}

/*  Contact page map  */
#map .map_adresse{
    font-family:Verdana, Geneva, sans-serif;
    font-size: 14px;
    line-height: 22px;
    letter-spacing: 1px;
}

#map .map_address,
#map .map_tel{
    padding: 5px;
}

#map .map_address .address,
#map .map_tel .tel{
    font-family: 'raleway-bold', arial;
    font-weight: bolder;
}

#map img{
    max-width: none;
}







/*  Tooltip  */
.tooltip{
    display: block;
    padding: 7px 10px;
    background: #311e24;
    color: #fff;
    font-family:Verdana, Geneva, sans-serif;
    font-size: 12px;
    position: absolute;
    white-space: nowrap;
    z-index: 999;
    opacity: 0;
    text-align: center;
    letter-spacing: .5px;

}

.tooltip:after{
    content: '';
    width: 0px;
    height: 0px;
    border-style: solid;
    border-width: 3px 3px 0 3px;
    border-color: #182b19 transparent transparent transparent;
    display: block;
    text-align: center;
    position: absolute;
    bottom: -3px;
    left: 50%;
    margin-left: -3px;
}






/*  Responsive code  */

@media (max-width:800px)
{
	.wrapper{
    width: 99%;
    margin: 0 auto;
	}
	
	
	body{background-color:#fff;}
        
    .main{background-color:#fff;}
    header .footer{display: none;}
        
    
   
        
       
   
    
    header nav{
        width: 100%;
        position: absolute;
        top: 88px;
        left: 0;
        z-index: 9999;
    }

    header nav ul{
        list-style: none;
        display: none;
        position: relative;
    }
    header nav ul li a{
        display: block;
        width: 60%; margin-left:20%;
        padding: 10px 0;
        text-align: center;
        color:#ffffff;
        font-family:Verdana, Geneva, sans-serif;
        font-size: 18px;
        text-decoration: none;
		
        border-top:thin #454545 solid; 
		background-color:#311e24;
		/*background: -webkit-gradient(linear, left top, left bottom, from(#182b19), to(#000000));
		background: -moz-linear-gradient(left,  #182b19,  #000000);*/
    }
    header nav ul li a:active{
		border-top:thin #f1f1f1 solid;
		background-color:#ffffff;
		color:#3d3d3d;

    }
    #menu_icon,
    .close_menu,
    .show_menu{
        display: block;
    }
    .show_menu{
        display: block;
    }

.main{
width: 100%;
position: relative;
padding-left: 0px;
margin-left:0px;
		
    }
/*--.main .work-------- */	
.main .work{ 
display:inline-block;
width: 44%; /*margin-left:24.9%;*/
height: auto;
float: left;
position: relative;
overflow: hidden;
vertical-align: middle;
text-align:center;

}

.main .work .media
{
width: 100%; 
vertical-align: middle;
border:none;
}
.main .work p{
    color:#3d3d3d;
    font-family:Verdana, Geneva, sans-serif;
    font-size: 15px;
    line-height: 24px;
    max-width:100%;
}

.main .mansoor{ 
display:inline-block;
width: 44%; /*margin-left:24.9%;*/
height: auto;
float: left;
position: relative;
overflow: hidden;
vertical-align: middle;
text-align:center;

}

.main .mansoor .media
{
width: 100%; 
vertical-align: middle;
border:none;
}
.main .mansoor p{
    color:#3d3d3d;
    font-family:Verdana, Geneva, sans-serif;
    font-size: 15px;
    line-height: 24px;
    max-width:100%;
}

    #map{
        margin: 0!important;
    }
.top .title{font-size: 16px; line-height:20px;}
.top_madani .title{font-size: 16px; line-height:20px;}
.top_ahsan .title{font-size: 16px; line-height:20px;}
.top_quran .title{font-size: 16px; line-height:20px;}
.top_eslamic .title{font-size: 16px; line-height:20px;}
.top_courses .title{font-size: 16px; line-height:20px;}
.top_register .title{font-size: 16px; line-height:20px;}
.top_aboutus .title{font-size: 16px; line-height:20px;}
.top_contactus .title{font-size: 16px; line-height:20px;}
.top_books .title{font-size: 16px; line-height:20px;}

.top			{margin-top:-130px; z-index:99999;}
.top_madani		{margin-top:-130px; z-index:99999;}
.top_ahsan		{margin-top:-130px; z-index:99999;}
.top_quran		{margin-top:-130px; z-index:99999;}
.top_eslamic	{margin-top:130px; z-index:99999;}
.top_courses	{margin-top:-130px; z-index:99999;}
.top_register	{margin-top:-130px; z-index:99999;}
.top_aboutus	{margin-top:-130px; z-index:99999;}
.top_contactus	{margin-top:-130px; z-index:99999;}
.top_books		{margin-top:-130px; z-index:99999;}

header{	margin-top:0px;
        display: block;
        width: 100%;
        max-height:50px;
        padding: 0;
        position: relative;
		z-index:100000;
    }
/*header .logo{ height:100px;}*/
	header .logo{padding:5px;float: left; width:25%;}
	header .logo img {margin-top:5px;}
    
    header #menu_icon,    header .close_menu{float: right; margin: 30px 30px 0 0; } 
								.content {background-color:#fff;width:100%;}
								.content h3 {font-size: 12px; margin-bottom:5px;}
								.content h2 {font-size: 14px; margin-bottom:2px; padding:5px;}
								.content p{font-size: 12px; margin:0px;}
								.content ul li{font-size: 12px;  margin-left:15px;}
	
.content .work{
	font-family:Verdana, Geneva, sans-serif;font-size: 14px;
    display:inline-block;
    width: 99%; 
	margin-left:0%;
    height: auto;
    float: left;
    position: relative;
    overflow: hidden;
	vertical-align: middle;
	
}
.content .work .media{ width: 50%; position:relative; margin-left:0;}
.content .work h2{padding-left:0px;}

.content .mansoor{
	font-family:Verdana, Geneva, sans-serif;font-size: 14px;
    display:inline-block;
    width: 44%; 
	margin-left:0%;
    height: auto;
    float: left;
    position: relative;
    overflow: hidden;
	vertical-align: middle;
	
}
.content .mansoor .media{ width: 50%; position:relative; margin-left:0;}
.content .mansoor h2{padding-left:0px;}

}

@media (max-width:550px)
{
	div.centered{
      		
		width:100%;
		margin-left:0px;
    }
	div.centered img{
		height:35px; width:35px;
	}
	
	.footerlist
	{
        flex-wrap: wrap;
		margin-top: 10px;
  		width:100%;
		margin-left:0px;
    }
			
		.footerlist .part
		{
		width: 42%;
		/*margin:10px;*/
	}
	.footerlist .part:nth-child(2)
		{
			border:none;
		}
	.footerlist .part:nth-child(4)
		{
			border:none;
		}
		.footerlist .part:nth-child(5)
		{
			width:100%;
			border-top:solid 2px #fff;
			border-bottom:solid 2px #fff;
			text-align:center;
			justify-content: center;
		}
		.footerlist .part:nth-child(5) img
		{
			height:40px;
			text-align:center;
		}
		.footerlist .part:nth-child(5) ul
		{
			text-align:center;
		}
.newfooter{
                
        justify-content: center;
		text-align:center;
        flex-wrap: wrap;
  		width:100%;
		margin-left:0px;		
    }
	.newfooter p{padding-top:0px; padding-left:5px; padding-right:5px;}
    .newfooter a{
        
        display: inline-block;
		padding-bottom:10px;
		      
    }
    .newfooter a:hover{
        opacity: 0.8;
    }
	.newfooter img{
		height:30px; width:30px;
		
	}
	/* code for Mobile Devices -- */
	/* code for Mobile Devices -- */
	/* code for Mobile Devices -- */
	/* code for Mobile Devices -- */
	/* code for Mobile Devices -- */
	/* code for Mobile Devices -- */
	
	/* code for Mobile Devices -- */
	/* code for Mobile Devices -- */
	/* code for Mobile Devices -- */
	/* code for Mobile Devices -- */
	/* code for Mobile Devices -- */
	/* code for Mobile Devices -- */
	
	/* code for Mobile Devices -- */
	/* code for Mobile Devices -- */
	/* code for Mobile Devices -- */
	/* code for Mobile Devices -- */
	/* code for Mobile Devices -- */
	/* code for Mobile Devices -- */
	
	/* code for Mobile Devices -- */
	/* code for Mobile Devices -- */
	/* code for Mobile Devices -- */
	/* code for Mobile Devices -- */
	/* code for Mobile Devices -- */
	/* code for Mobile Devices -- */
body{background-color:#fff;}
    .content {background-color:#fff;}    
    .main{background-color:#fff;}
	
.content .work{
	
	font-family:Verdana, Geneva, sans-serif;
	font-size: 14px;
    display:inline-block;
    width: 44%; margin-left:0;
    height: auto;
    float: left;
    position: relative;
    overflow: hidden;
	vertical-align: middle;
	}
	

.content .work .media{ width: 50%; position:relative; margin-left:0;}


.content .work h2{padding-left:0px;}

/*  mansoor ------------------------------------------- */
.main .mansoor{
    font-family:Verdana, Geneva, sans-serif;
	font-size: 14px;
    display:inline-block;
    width: 44%; margin-left:0;
    height: auto;
    float: left;
    position: relative;
    overflow: hidden;
	vertical-align: middle;
		
}

.main .mansoor .media{
    width: 50%; position:relative; margin-left:0;
}
.main .mansoor h2{ max-width:80%;}

.main .mansoor .ali{
    color: #ffffff; background: #311e24;
    font-family:Verdana, Geneva, sans-serif;
	text-align:center;
    font-size: 14px;
    line-height: 28px; max-height:28px;
    width: 99%;
	border-top-left-radius:10px;
	border-bottom-right-radius:10px;
	
}

.main .mansoor .caption{
    position: absolute;
    display: block;
    width: 100%;
    height: 100%;
    top: 0; 
    left: 0;
    background: #ffffff;
    opacity: 0;
}

.main .mansoor a:hover .caption{
    opacity: 1;
	
}
.opacity40 { filter: alpha(opacity=60); opacity: 0.6; }

.work .mansoor .work_title{
    display: block;
    width: 100%; 
	margin-left:0px;
    position: absolute;
    text-align: center; vertical-align:middle;
    top: 50%;
    margin-top: -40px;
	background: #311e24;
}

.main .mansoor .caption h1{
    position: relative;
    display: block;
    width: 98%;
    padding: 5px;
	text-align:center;
    z-index: 77;
    color: #ffffff;
    font-family:Verdana, Geneva, sans-serif; font-weight:normal;
    font-size: 14px;
    letter-spacing: .5px; line-height:20px;
    border-bottom: 1px solid #bfbbbb;
    border-top: 1px solid #bfbbbb;
}
.main .mansoor h2{ max-width:80%;}


/* --mansoor end--------------------------------------------*/

header .logo{padding:5px;float: left; width:25%;}
header .logo img {margin-top:5px; }
.top .title{ display:none;}
.top_madani .title{display:none;}
.top_ahsan .title{display:none;}
.top_quran .title{display:none;}
.top_eslamic .title{display:none;}
.top_courses .title{display:none;}
.top_register .title{display:none;}
.top_aboutus .title{display:none;}
.top_contactus .title{display:none;}
.top_books .title{display:none;}

.top			{margin-top:-60px; z-index:99999;}
.top_madani		{margin-top:-60px; z-index:99999;}
.top_ahsan		{margin-top:-60px; z-index:99999;}
.top_quran		{margin-top:-60px; z-index:99999;}
.top_eslamic	{margin-top:-60px; z-index:99999;}
.top_courses	{margin-top:-60px; z-index:99999;}
.top_register	{margin-top:-60px; z-index:99999;}
.top_aboutus	{margin-top:-20px; z-index:99999;}
.top_contactus	{margin-top:-60px; z-index:99999;}
.top_books		{margin-top:-60px; z-index:99999;}

header{	margin-top:0px;
        display: block;
        width: 100%;
        max-height:50px;
        padding: 0;
        position: relative;
		z-index:100000;
    }
								.content {background-color:#fff;width:100%;}
								.content h3 {font-size: 15px; margin-bottom:5px; text-align:center;}
								.content h2 {font-size: 15px; margin-bottom:5px; padding:2px;}
								.content p{font-size: 15px; margin:0px;}
								.content ul li{font-size: 15px;  margin-left:15px;}



header .logo{  
margin-top: 5px;

 width:50%;
margin-left: 23%;  }
    

    header nav{
        width: 100%;
        position: absolute;
        top: 90px;
        left: 0px;
        z-index: 9999;
    }

    header nav ul{
        list-style: none;
        display: none;
        position: relative;
    }
    header nav ul li a{
        display: block;
        width: 60%; margin-left:20%;
        padding: 10px 0;
        text-align: center;
        color:#ffffff;
        font-family:Verdana, Geneva, sans-serif;
        font-size: 18px;
        text-decoration: none;
		
        border-top:thin #454545 solid; 
		background-color:#311e24;
		
    }
    header nav ul li a:active{
		border-top:thin #f1f1f1 solid;
		background-color:#ffffff;
		color:#3d3d3d;

    }
	header #menu_icon,
    header .close_menu{
        float: right;
        /*margin: 30px 30px 0 0;*/
    }
    #menu_icon,
    .close_menu,
    .show_menu{
        display: block;
    }
    .show_menu{
        display: block;
    }
	.main{
        width: 100%;
        position: relative;
        padding-left: 0px;
		margin-left:0px;
    }
/* .main .work for mobile device ---------- */
    
	
	.main .content .work h2{width:100%;}
	
.main .work{
display:inline-block;
width: 99%;
height:auto;
float: left;
position: relative;
overflow: hidden;
vertical-align: middle;
text-align:center;

}

.main .work .media{
    width: 100%; 
    vertical-align: middle;
	border:none;
}






.main .work .caption{display: none;}
.main .work a:hover .caption{opacity: 1;}
.work .caption .work_title{display: none;}
.main .work .caption h1{display: none;}

.opacity40 { filter: alpha(opacity=60); opacity: 0.6; }

.main .work h2{ max-width:100%;}

/*  mansoor ------------------------------------------- */
.main .mansoor{
    display:inline-block;
width: 44%;
height:auto;
float: left;
position: relative;
overflow: hidden;
vertical-align: middle;
text-align:center;
left:20px;		
}

.main .mansoor .media{
    width: 100%; 
    vertical-align: middle;
	border:none;
}
.main .mansoor h2{ max-width:80%;}

.main .mansoor .ali{
    color: #ffffff; background: #311e24;
    font-family:Verdana, Geneva, sans-serif;
	text-align:center;
    font-size: 14px;
    line-height: 28px; max-height:28px;
    width: 99%;
	border-top-left-radius:10px;
	border-bottom-right-radius:10px;
	
}

.main .mansoor .caption{
    position: absolute;
    display: block;
    width: 100%;
    height: 100%;
    top: 0; 
    left: 0;
    background: #ffffff;
    opacity: 0;
}

.main .mansoor a:hover .caption{
    opacity: 1;
	
}
.opacity40 { filter: alpha(opacity=60); opacity: 0.6; }

.work .mansoor .work_title{
    display: block;
    width: 100%; 
	margin-left:0px;
    position: absolute;
    text-align: center; vertical-align:middle;
    top: 50%;
    margin-top: -40px;
	background: #311e24;
}

.main .mansoor .caption h1{
    position: relative;
    display: block;
    width: 98%;
    padding: 5px;
	text-align:center;
    z-index: 77;
    color: #ffffff;
    font-family:Verdana, Geneva, sans-serif; font-weight:normal;
    font-size: 14px;
    letter-spacing: .5px; line-height:20px;
    border-bottom: 1px solid #bfbbbb;
    border-top: 1px solid #bfbbbb;
}
.main .mansoor h2{ max-width:80%;}
.main .mansoor .caption{display: none;}
.main .mansoor a:hover .caption{opacity: 1;}
.mansoor .caption .work_title{display: none;}
.main .mansoor .caption h1{display: none;}

.opacity40 { filter: alpha(opacity=60); opacity: 0.6; }



/* --mansoor end--------------------------------------------*/
	
} 


@media (width:600px)
{
	div.centered{
      		
		width:100%;
		margin-left:0px;
    }
	div.centered img{
		height:35px; width:35px;
	}
	.footerlist
	{
        flex-wrap: wrap;
		margin-top: 10px;
  		width:100%;
		margin-left:0px;
    }
			
		.footerlist .part
		{
		width: 40%;
		margin:10px;
	}
	.footerlist .part:nth-child(2)
		{
			border:none;
		}
	.footerlist .part:nth-child(4)
		{
			border:none;
		}
		
	.newfooter{
                
        justify-content: center;
		text-align:center;
        flex-wrap: wrap;
		
  		width:100%;
		margin-left:0px;		
    }
	.newfooter p{ padding-top:10px; padding-left:5px; padding-right:5px;}
    .newfooter a{
        
        display: inline-block;
		padding:5px;
		      
    }
    .newfooter a:hover{
        opacity: 0.8;
    }
	.newfooter img{
		height:30px; width:30px;
		
	}
header .logo{padding:5px;float: left; width:25%;}
header .logo img {margin-top:5px; }
	
.top .title{ display:none;}
.top_madani .title{display:none;}
.top_ahsan .title{display:none;}
.top_quran .title{display:none;}
.top_eslamic .title{display:none;}
.top_courses .title{display:none;}
.top_register .title{display:none;}
.top_aboutus .title{display:none;}
.top_contactus .title{display:none;}
.top_books .title{display:none;}

.top			{margin-top:-140px; z-index:99999;}
.top_madani		{margin-top:-140px; z-index:99999;}
.top_ahsan		{margin-top:-140px; z-index:99999;}
.top_quran		{margin-top:-140px; z-index:99999;}
.top_eslamic	{margin-top:-140px; z-index:99999;}
.top_courses	{margin-top:-140px; z-index:99999;}
.top_register	{margin-top:-140px; z-index:99999;}
.top_aboutus	{margin-top:-140px; z-index:99999;}
.top_contactus	{margin-top:-140px; z-index:99999;}
.top_books		{margin-top:-140px; z-index:99999;}
header #menu_icon,    header .close_menu{float: right; margin: 10px;  }

.content .work{
display:inline-block;
width: 44%; 
float: left;
position: relative;
overflow:hidden;
}
.content .work .media
{ 
width: 100%; 
position:relative; 
margin-left:0;
} 

/*  mansoor ------------------------------------------- */
.main .mansoor{
    display:inline-block;
width: 44%; 
float: left;
position: relative;
overflow:hidden;
		
}

.main .mansoor .media{
    width: 100%; 
position:relative; 
margin-left:0;
}
.main .mansoor h2{ max-width:80%;}

.main .mansoor .ali{
    color: #ffffff; background: #311e24;
    font-family:Verdana, Geneva, sans-serif;
	text-align:center;
    font-size: 14px;
    line-height: 28px; max-height:28px;
    width: 99%;
	border-top-left-radius:10px;
	border-bottom-right-radius:10px;
	
}

.main .mansoor .caption{
    position: absolute;
    display: block;
    width: 100%;
    height: 100%;
    top: 0; 
    left: 0;
    background: #ffffff;
    opacity: 0;
}

.main .mansoor a:hover .caption{
    opacity: 1;
	
}
.opacity40 { filter: alpha(opacity=60); opacity: 0.6; }

.work .mansoor .work_title{
    display: block;
    width: 100%; 
	margin-left:0px;
    position: absolute;
    text-align: center; vertical-align:middle;
    top: 50%;
    margin-top: -40px;
	background: #311e24;
}

.main .mansoor .caption h1{
    position: relative;
    display: block;
    width: 98%;
    padding: 5px;
	text-align:center;
    z-index: 77;
    color: #ffffff;
    font-family:Verdana, Geneva, sans-serif; font-weight:normal;
    font-size: 14px;
    letter-spacing: .5px; line-height:20px;
    border-bottom: 1px solid #bfbbbb;
    border-top: 1px solid #bfbbbb;
}

}

@media (width:320px)
{
	
	div.centered{
      		
		width:100%;
		margin-left:0px;
    }
	div.centered img{
		height:35px; width:35px;
	}
	.footerlist
	{
        flex-wrap: wrap;
		margin-top: 10px;
  		width:100%;
		margin-left:0px;
    }
			
		.footerlist .part
		{
		width: 40%;
		margin:10px;
	}
	.footerlist .part:nth-child(2)
		{
			border:none;
		}
	.footerlist .part:nth-child(4)
		{
			border:none;
		}
		
	.newfooter{
                
        justify-content: center;
		text-align:center;
        flex-wrap: wrap;
		
  		width:100%;
		margin-left:0px;		
    }
	.newfooter p{ padding-top:10px; padding-left:5px; padding-right:5px;}
    .newfooter a{
        
        display: inline-block;
		padding:5px;
		      
    }
    .newfooter a:hover{
        opacity: 0.8;
    }
	.newfooter img{
		height:30px; width:30px;
		
	}
	
header .logo{padding:5px;float: left; width:35%;}
header .logo img {margin-top:0px; }
	
.top .title{ display:none;}
.top_madani .title{display:none;}
.top_ahsan .title{display:none;}
.top_quran .title{display:none;}
.top_eslamic .title{display:none;}
.top_courses .title{display:none;}
.top_register .title{display:none;}
.top_aboutus .title{display:none;}
.top_contactus .title{display:none;}
.top_books .title{display:none;}

.top			{margin-top:-55px; z-index:99999;}
.top_madani		{margin-top:-55px; z-index:99999;}
.top_ahsan		{margin-top:-55px; z-index:99999;}
.top_quran		{margin-top:-55px; z-index:99999;}
.top_eslamic	{margin-top:-55px; z-index:99999;}
.top_courses	{margin-top:-55px; z-index:99999;}
.top_register	{margin-top:-55px; z-index:99999;}
.top_aboutus	{margin-top:-55px; z-index:99999;}
.top_contactus	{margin-top:-55px; z-index:99999;}
.top_books		{margin-top:-55px; z-index:99999;}

header #menu_icon,    header .close_menu{float: right; margin: 5px; margin-top:15px; }

.content .work{
display:inline-block;
width: 44%; 
float: left;
position: relative;
overflow:hidden;
}
.content .work .media
{ 
width: 100%; 
position:relative; 
margin-left:0;
} 

/*  mansoor ------------------------------------------- */
.main .mansoor{
   display:inline-block;
width: 44%; 
float: left;
position: relative;
overflow:hidden;
		
}

.main .mansoor .media{
    width: 100%; 
position:relative; 
margin-left:0;
}
.main .mansoor h2{ max-width:80%;}

.main .mansoor .ali{
    color: #ffffff; background: #311e24;
    font-family:Verdana, Geneva, sans-serif;
	text-align:center;
    font-size: 14px;
    line-height: 28px; max-height:28px;
    width: 99%;
	border-top-left-radius:10px;
	border-bottom-right-radius:10px;
	
}

.main .mansoor .caption{
    position: absolute;
    display: block;
    width: 100%;
    height: 100%;
    top: 0; 
    left: 0;
    background: #ffffff;
    opacity: 0;
}

.main .mansoor a:hover .caption{
    opacity: 1;
	
}
.opacity40 { filter: alpha(opacity=60); opacity: 0.6; }

.work .mansoor .work_title{
    display: block;
    width: 100%; 
	margin-left:0px;
    position: absolute;
    text-align: center; vertical-align:middle;
    top: 50%;
    margin-top: -40px;
	background: #311e24;
}

.main .mansoor .caption h1{
    position: relative;
    display: block;
    width: 98%;
    padding: 5px;
	text-align:center;
    z-index: 77;
    color: #ffffff;
    font-family:Verdana, Geneva, sans-serif; font-weight:normal;
    font-size: 14px;
    letter-spacing: .5px; line-height:20px;
    border-bottom: 1px solid #bfbbbb;
    border-top: 1px solid #bfbbbb;
}



}

@media (width:768px)
{
header .logo{padding:5px;float: left; width:35%;}
header .logo img {margin-top:0px; }
	
.top .title{ display:none;}
.top_madani .title{display:none;}
.top_ahsan .title{display:none;}
.top_quran .title{display:none;}
.top_eslamic .title{display:none;}
.top_courses .title{display:none;}
.top_register .title{display:none;}
.top_aboutus .title{display:none;}
.top_contactus .title{display:none;}
.top_books .title{display:none;}

.top			{margin-top:-150px; z-index:99999;}
.top_madani		{margin-top:-150px; z-index:99999;}
.top_ahsan		{margin-top:-150px; z-index:99999;}
.top_quran		{margin-top:-150px; z-index:99999;}
.top_eslamic	{margin-top:-150px; z-index:99999;}
.top_courses	{margin-top:-150px; z-index:99999;}
.top_register	{margin-top:-150px; z-index:99999;}
.top_aboutus	{margin-top:-150px; z-index:99999;}
.top_contactus	{margin-top:-150px; z-index:99999;}
.top_books		{margin-top:-150px; z-index:99999;}

header #menu_icon,    header .close_menu{float: right; margin: 10px; }

.content .work{
display:block;
width: 44%; 
float: left;
position: relative;
overflow:hidden;
}
.content .work .media
{ 
width: 100%; 
position:relative; 
margin-left:0;
} 

/*  mansoor ------------------------------------------- */
.main .mansoor{
    display:block;
width: 44%; 
float: left;
position: relative;
overflow:hidden;
		
}

.main .mansoor .media{
    width: 100%; 
position:relative; 
margin-left:0;
}
.main .mansoor h2{ max-width:80%;}

.main .mansoor .ali{
    color: #ffffff; background: #311e24;
    font-family:Verdana, Geneva, sans-serif;
	text-align:center;
    font-size: 14px;
    line-height: 28px; max-height:28px;
    width: 99%;
	border-top-left-radius:10px;
	border-bottom-right-radius:10px;
	
}

.main .mansoor .caption{
    position: absolute;
    display: block;
    width: 100%;
    height: 100%;
    top: 0; 
    left: 0;
    background: #ffffff;
    opacity: 0;
}

.main .mansoor a:hover .caption{
    opacity: 1;
	
}
.opacity40 { filter: alpha(opacity=60); opacity: 0.6; }

.work .mansoor .work_title{
    display: block;
    width: 100%; 
	margin-left:0px;
    position: absolute;
    text-align: center; vertical-align:middle;
    top: 50%;
    margin-top: -40px;
	background: #311e24;
}

.main .mansoor .caption h1{
    position: relative;
    display: block;
    width: 98%;
    padding: 5px;
	text-align:center;
    z-index: 77;
    color: #ffffff;
    font-family:Verdana, Geneva, sans-serif; font-weight:normal;
    font-size: 14px;
    letter-spacing: .5px; line-height:20px;
    border-bottom: 1px solid #bfbbbb;
    border-top: 1px solid #bfbbbb;
}

}


@media (width:1280px)
{

.top			{margin-top:-41px; z-index:99999;}
.top_madani		{margin-top:-41px; z-index:99999;}
.top_ahsan		{margin-top:-41px; z-index:99999;}
.top_quran		{margin-top:-41px; z-index:99999;}
.top_eslamic	{margin-top:-41px; z-index:99999;}
.top_courses	{margin-top:-41px; z-index:99999;}
.top_register	{margin-top:-41px; z-index:99999;}
.top_aboutus	{margin-top:-41px; z-index:99999;}
.top_contactus	{margin-top:-41px; z-index:99999;}
.top_books		{margin-top:-41px; z-index:99999;}
}