body
{
	background-color: #fff;
}



html
{
	 font-size: 14px;
}

/*div when mobile display none*/

.top-mobile-div,
.mobile-d-search,
.mobile-d-block {
	display: block;
}

.desktop-d-block {
	display: block;
}

.desktop-d-none {
	display: none;
}


/*div when mobile display none*/


:root {
  --green: #047555;
  --blue: #0083BD;
  --white: #ffffff; 
}

/*:root {
  --blue: #6456B7;
  --green: #24500F;
  --white: #f7f7f7; 
}
*/

h1,h2,h3,h4{
  font-family: 'Playfair Display', serif;
}

h5,p,a{
  font-family: 'Open Sans', sans-serif;
}

a:hover{
    text-decoration: none;
}

.bg-blue{
	background: var(--blue);
}

.bg-green{
	background: var(--green);
}

.text-blue{
	color: var(--blue);
}

.text-green{
	color: var(--green);
}

p{
	color: var(--green);
}


#page-container {
	position: relative;
	min-height: 100vh;
}

#content-wrap {
	/*padding-bottom: 10.5rem;*/
	/* Footer height */
}


 .animated {
	 animation-duration: 500ms;
}


.shadow-sm{
	box-shadow: 0 .125rem .25rem rgba(0,0,0,.075)!important;
	-webkit-box-shadow: 0 .125rem .25rem rgba(0,0,0,.075)!important;
}

.shadow{
	box-shadow: 0 .5rem 1rem rgba(0,0,0,.15)!important;
	-webkit-box-shadow: 0 .5rem 1rem rgba(0,0,0,.15)!important;
}

.shadow-lg{
	box-shadow: 0 1rem 3rem rgba(0,0,0,.175)!important;
	-webkit-box-shadow: 0 1rem 3rem rgba(0,0,0,.175)!important;
}

img::selection {
    color: #fff;
    background: 0 0;
}

img::-moz-selection {
    color: #fff;
    background: 0 0;
}


::-webkit-scrollbar {
	background: var(--green);
	/*border-radius: 4px;*/
	height: 5px;
	width: 8px;
}

::-webkit-scrollbar-thumb {
	background: #ccc;
	border-radius: 4px;
}




/*btn style*/

.btn.btn-blue {
	 border: none;
	 background: rgb(0,131,189);
     background: linear-gradient(146deg, rgba(0,131,189,1) 0%, rgba(0,141,203,1) 74%);
	 color: #fff !important;
	 border-radius: 20px;
	padding: 5px 15px 5px 15px;
    font-family: "Open Sans";

}

.btn.btn-green {
	 border: none;
	 background: rgb(4,111,81);
     background: linear-gradient(146deg, rgba(4,111,81,1) 0%, rgba(4,111,81,1) 74%);
	 color: #fff !important;
	 border-radius: 20px;
	padding: 5px 15px 5px 15px;
    font-family: "Open Sans";

}

.btn.btn-white {
	 border: none;
	 background: rgb(255,255,255);
     box-shadow:0 3px 8px rgba(0, 0, 0, .3);
     -webkit-box-shadow:0 3px 8px rgba(0, 0, 0, .3);
	 color: var(--green) !important;
	 border-radius: 20px;
	padding: 5px 15px 5px 15px;
    font-family: "Open Sans";
}


.btn.btn-eee {
	 border: none;
	 background: #eee;
     box-shadow:0 3px 8px rgba(0, 0, 0, .3);
     -webkit-box-shadow:0 3px 8px rgba(0, 0, 0, .3);
	 color: var(--green) !important;
	 border-radius: 20px;
	padding: 5px 15px 5px 15px;
    font-family: "Open Sans";
}


.btn.btn-blue:hover,
.btn.btn-green:hover,
.btn.btn-white:hover,
.btn.btn-eee:hover {
	 box-shadow: 0 0 0 1px rgba(0,0,0,.1), 0 2px 3px rgba(0,0,0,.2);
	 -webkit-box-shadow:0 0 0 1px rgba(0,0,0,.1), 0 2px 3px rgba(0,0,0,.2);
}

.btn.btn-default {
	 border-color: #ccc;
	 background-color: #ccc;
	 color: #555;
}

 .btn.btn-default:hover {
	 background-color: #fafafa;
}
/*btn style*/

/*custom box shadows*/

.shadow-custom{
	 box-shadow:0 2px 2px 0 rgba(0,0,0,0.16), 0 0 0 1px rgba(0,0,0,0.08);
	 -webkit-box-shadow:0 2px 2px 0 rgba(0,0,0,0.16), 0 0 0 1px rgba(0,0,0,0.08);
}

/*custom box shadows*/

/*header section*/

/*top-title*/

.top-title{	
    background-color: rgb(255, 255, 255);
	background-image: url(../img/top-title.png);
    /*background-size: cover;*/
    background-position: center;
    background-repeat: no-repeat;
}

.top-title .title-text{
	/*font-size: 30px;*/
}

.top-title .form-control{
	border-top-right-radius: 0px ;
	border-bottom-right-radius: 0px ;
}


.top-title .search-box .btn-light:nth-of-type(1){
	border-top-left-radius: 0px !important;
	border-bottom-left-radius: 0px !important;
	margin-right: .5rem;
}



/*dashboard-btn*/

.dashboard-btn{
	font-size: 13px;
	padding: 0.3em;
}





/*dashboard-btn*/

.language-select select {
  -webkit-appearance: none;
  -moz-appearance: none;
  -ms-appearance: none;
  appearance: none;
  outline: 0;
  box-shadow: none;
  border: 0 !important;
  background: #ffffff;
  background-image: none;
}


/* Custom Select */
.language-select.select {
  /*position: relative;*/
  /*display: block;*/
  /*width: 20em;*/
  /*height: 4.5em;*/
  /*line-height: 3;*/
  /*background: var(--blue);*/
  /*overflow: hidden;*/
  border-radius: .25em;
}

.language-select select {
  flex: 1;
  padding: 0.3em;
  color: var(--blue);
  cursor: pointer;
}

/* Arrow */

/* Transition */
.language-select.select:hover::after {
  color: var(--blue);
}


/*top-title*/

/*home page css starts here*/

/*navbar*/
 .top-nav {
	 z-index: 100;
	 position: relative;
	 /*top: 0;*/
	 left: 0;
	 width: 100%;
	 background-color: rgb(255 255 255);
	 background-image: url(../img/nav-cta.png);
     background-size: auto;
     background-position: center;
     background-repeat: no-repeat;
     box-shadow:0 0 0 1px rgba(0,0,0,.1), 0 2px 3px rgba(0,0,0,.2);
	 -webkit-box-shadow:0 0 0 1px rgba(0,0,0,.1), 0 2px 3px rgba(0,0,0,.2);
}



.top-nav ul {
	 float: right;
}

.top-nav ul li.nav-item {
    margin-left: 7px;
}

 .top-nav a {
	 font-size: 14px;
	 font-weight: 600;
	 text-transform: uppercase;
	 letter-spacing: .5px;
	 color: var(--green) !important;
	 text-decoration: none;

    /* background-position: bottom;
	 border-bottom: 3px solid transparent;
	 /*padding: 0 0px 0px;*/
	 transition: 0.25s;
}

 .top-nav .nav-link:hover {
	 color: var(--blue) !important;

}

.navbar-nav .nav-link:nth-of-type(1){
	position: relative;
}

.navbar-nav .nav-link i{
	position: absolute;
	top: -6px;
	right: -5px;
	border-radius: 50%;
	background: var(--green);
    color: #fff;
	font-size: 11px;
	/*font-weight: 300;*/
	padding: 4px;
	
}

/*navbar toggler icon */

 .navbar-toggler {
	 background: none;
	 border: none;
}
 .navbar-toggler:active, .navbar-toggler:focus {
	 outline: 0;
}
 .navbar-toggler .navbar-toggler-icon {
	 display: block;
	 width: 22px;
	 height: 2px;
	 border-radius: 1px;
	 margin: 4px 0 4px 0;
	 transition: all 0.2s;

}
 .navbar-light .navbar-toggler .navbar-toggler-icon {
	 background: var(--green);
}
 .navbar-toggler .navbar-toggler-icon:nth-of-type(1) {
	 transform: rotate(45deg);
	 transform-origin: 10% 10%;
}
 .navbar-toggler .navbar-toggler-icon:nth-of-type(2) {
	 opacity: 0;
	 filter: alpha(opacity=0);
}
 .navbar-toggler .navbar-toggler-icon:nth-of-type(3) {
	 transform: rotate(-45deg);
	 transform-origin: 10% 90%;
}

 .navbar-toggler.collapsed .navbar-toggler-icon:nth-of-type(1) {
	 transform: rotate(0);
}
 .navbar-toggler.collapsed .navbar-toggler-icon:nth-of-type(2) {
	 opacity: 1;
	 filter: alpha(opacity=100);
}
 .navbar-toggler.collapsed .navbar-toggler-icon:nth-of-type(3) {
	 transform: rotate(0);
}
 

/*navbar toggler icon*/

/*navbar*/


/*header hero*/

 .top-hero {
	height: 50vh;
}

.top-hero-content{
	position: absolute;
	margin-left: auto;
	margin-right: auto;
	top: 40vh;
	left: 0;
	right: 0;
	text-align: center;
}


.meeting-update{
	background: rgb(255,255,255);
	box-shadow:0 3px 8px rgba(0, 0, 0, .3);
     -webkit-box-shadow:0 3px 8px rgba(0, 0, 0, .3);
     padding: 7px 14px 7px 14px;
     color: var(--green);
     border-radius: 20px;
     margin-top: 45px !important;
     text-align: left ;
     /*display: inline-block;*/
}

.meeting-update:hover{
	cursor: pointer;
}

/*header hero*/

/*header section*/



/*title's style*/

/*.section-title::before,*/

.section-title{
	margin-bottom: 15px;
}

.section-title::after {
    display: inline-block;
    content: "";
    border-top: 2px solid var(--green);
    width: 11rem;
    margin: 0 3px;
    transform: translateY(-.5rem);
    /*margin-bottom: 20px;*/
	/*letter-spacing: 2px;*/
}
/*title's style*/

/*media section*/

.media-vdo{
	border: 2px solid var(--blue);
/*	margin-left: -10px;*/
}

.media-vdo .video-frame iframe{
	margin-top: 10px;
	width: 100%; 
	height:calc(100% - 190px);
}

.media-vdo .video-frame{
	height: 100%;
}

.media-text{
	/*position: absolute;*/
	text-align: center;
}

.media-text h3{
	letter-spacing: 2px;
}

/*media section*/

/*section-speech*/

.section-speech{
	 background-image: url("../img/speech-pattern.jpg");
	 background-size: cover;
	 background-position: center;
	 background-attachment: fixed;
	 padding: 60px 50px;

}

.section-speech .col-md-3{
	position: relative;
}


.section-speech .col-md-3 img.minar-vector{
	position: absolute;
	left: -60px;
	bottom: -40px;
	z-index: 999;
}



.section-speech .facts{
	margin-top: auto;
	margin-bottom: auto;
/*	top: 0;
	bottom: 0;*/
	border-radius: 3px;
	padding: 5px 7px 5px 7px;
}


.section-speech .facts:nth-of-type(1),
.section-speech .facts:nth-of-type(2),
.section-speech .facts:nth-of-type(3),
.section-speech .facts:nth-of-type(4){
	margin-right: 15px;
} 

.muhtamim-img{
	/*margin-right: 0px;*/

}

.muhtamim-msg h2,
.muhtamim-msg h4,
.muhtamim-msg a{
	margin-left: 15px;
}

.muhtamim-msg h4{
	font-weight: 400;
    font-size: 17px;
    line-height: 30px;
}

.muhtamim-img img{
	width: 380px;
    height: 100%;
    object-fit: cover;
}

/*section-speech*/

.section-title-custom{
	margin-bottom: 25px !important;
}

/*notice panel*/
.notice-holder { 
  background-color: #ffffffd1;
  width:100%;
  height: 100%;
  overflow:hidden;
  padding:10px 0px 0px 15px;
}

.notice-holder .mask {
  position: relative;
  left: 0px;
  top: 10px;
  width:300px;
  height:300px;
  overflow: hidden;
  border-top: 1px solid var(--green);
}
.notice-holder ul {
  list-style:none;
  margin:0;
  padding:0;
  position: relative;
}
.notice-holder ul li {
  padding:10px 0px;
}

.notice-holder ul li p{
	font-weight: bold;
	color: var(--blue);
}

.notice-holder ul li a {
  color: var(--green);
  text-decoration:none;
}


/*notice panel*/

/*media page*/

.vid-main-wrapper {
	width: 100%;
	max-width: 800px;
	min-width: 440px;
	background: #fff;
	margin: 0 auto;
}

/*  VIDEO PLAYER CONTAINER
############################### */
.vid-container {
    position: relative;
    padding-bottom: 50%;
    padding-top: 30px; 
    height: 0; 
	width:70%;
	float:left;
}
 
.vid-container iframe,
.vid-container object,
.vid-container embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    min-height: 360px;
}


/*  VIDEOS PLAYLIST 
	############################### */
.vid-list-container {
	width: 30%;
	height:360px;
	overflow: hidden;
	float:right;
}

.vid-list-container:hover, .vid-list-container:focus {
	overflow-y: auto;
}

ol#vid-list {
	margin:0;
	padding:0;
	background: #222;
	height: 100%;
}

ol#vid-list li {
  list-style: none;
}

ol#vid-list li a {
	text-decoration: none;
	background-color: #222;
	height:65px;
	display:block;
	padding:10px;
}

ol#vid-list li a:hover {
	background-color:#666666
}

.vid-thumb {
	float:left;
	margin-right: 8px;
}

.active-vid { 
	background:#3A3A3A;
}

#vid-list .desc {
	color: #CACACA;
	font-size: 13px;
	margin-top:5px;
}


@media (max-width: 624px) {

	.vid-main-wrapper{
	    min-width: auto;
	}

	.vid-container {
		width: 100%;
 	    padding-bottom: 42vh;
	}

	.vid-list-container {
		padding-bottom: 20px;
		width: 100%;
    	float: inherit;
	}

}


/*media page*/


/*courses*/

.courses .section-title-custom{
	margin-bottom: 25px !important;
}


.courses .card{
	box-shadow: 0 0 0 1px rgba(0,0,0,.1), 0 2px 3px rgba(0,0,0,.2);
    -webkit-box-shadow: 0 0 0 1px rgba(0,0,0,.1), 0 2px 3px rgba(0,0,0,.2);
    width: 16rem; 
	height: 20rem;
	transition: all 0.3s cubic-bezier(.25, .8, .25, 1);
}

.courses .card img{
	width: 16rem;
    height: 100%;
    object-fit: cover;
}



.courses .card:hover{
	cursor: pointer;
	box-shadow: 0 .5rem 1rem rgba(0,0,0,.15)!important;
	-webkit-box-shadow: 0 .5rem 1rem rgba(0,0,0,.15)!important;
}

.courses .row .card .card-body{
	 background-image: url("../img/course-title-pattern.png");
	 background-size: auto;
	 background-position: center;
}

.courses .row .card .card-body .card-text{
	font-weight: 600;
	text-align: center;
	letter-spacing: 2px;
}

.courses .row:nth-of-type(2){
	margin-bottom: 25px;
}
/*courses*/



/*charity*/
.bg-f7{
	background-color: #F7F7F7 !important;
}

.charity{
	 background-image: url("../img/charity-bg.png");
	 background-size: cover;
	 background-position: center;
	 background-attachment: scroll;
}

.charity-hadith-title,
.charity-member{
	position: relative;
}


.charity-hadith-title{
	text-align: right;
}

.charity-hadith,
.charity-member-btn{
	/*text-align: right;*/
	margin: 0;
    position: absolute;
    top: 40%;
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
	/*vertical-align: middle;*/
}

.charity-hadith strong{
	font-family: 'Open Sans';
	font-size: 14px;
}

.grid-container {
  display: grid;
  grid-template-columns: auto auto;
  grid-gap: 3px;
  padding: 3px;
}

.grid-container .charity-img-div{
	position: relative;
}

.grid-container .charity-img-div:nth-of-type(1){
	grid-column-start: 2;
    grid-column-end: 1;
    
	/*height: 100%;*/
}

.grid-container .charity-img-div img{
	width: 168px;
    height: 168px;
    max-height: 168px;
    object-fit: cover;
}

.grid-container .charity-img-div .overlay-1 {
  position: absolute; 
  top: 0px;
  right: 2px;
  /*background: rgb(0, 0, 0);*/
  background: var(--green);
  color: #fff; 
  width: auto;
  transition: .5s ease;
  opacity: 1;
  font-size: 12px;
  padding: 3px;
  text-align: center;
}

.grid-container .charity-img-div .overlay-2 {
  position: absolute; 
  bottom: -13px; 
  /*background: rgb(0, 0, 0);*/
  background: linear-gradient(146deg, rgb(4 111 81 / 25%) 0%, #0062cc94 74%);
  width: 12rem;
  transition: .5s ease;
  opacity: 1;
  color: white;
  border-top: 1px solid #fff;
  font-size: 14px;
  padding: 5px;
  text-align: left;
  height: 30%;
}


.card-top{
	box-shadow: 0 16px 40px rgba(0,0,0,0.12);
	-webkit-box-shadow: 0 16px 40px rgba(0,0,0,0.12);
}



/*charity page css*/


/*charity donate project*/

img.charity-urgent-img{
	width: 555px;
    height: 253px;
    object-fit: cover;
}

.donate-project img{
	width: 338px;
    height: 200px;
    object-fit: cover;
}

/*
.courses .card img{
	width: 16rem;
    height: 100%;
    object-fit: cover;
}*/


.donate-project .card.card-cascade [class*=card-img-] {
	 border-radius: 0.25rem;
	 box-shadow: 0 5px 11px 0 rgba(0, 0, 0, .18), 0 4px 15px 0 rgba(0, 0, 0, .15);
}

.donate-project .card.card-cascade i img {
    /*width: 100%;*/
     -webkit-transition: all 0.4s ease-in-out;
    -moz-transition: all 0.4s ease-in-out;
    -ms-transition: all 0.4s ease-in-out;
    -o-transition: all 0.4s ease-in-out;
    transition: all 0.4s ease-in-out;
}


.donate-project .card.card-cascade i img:hover{
	cursor: pointer;
	transform: scale(0.92) translateY(-1.8rem);
	 margin-bottom: -1rem;
}

/*.donate-project .card.card-cascade.card-cascade-narrower i {
	 transform: scale(0.92) translateY(-1.8rem);
	 margin-bottom: -1rem;
}*/

.donate-project .card .card-title{
	margin-top: 15px;
	color: var(--green);
	font-weight: 600;
}

.donate-project .card .card-text{
	color: var(--green);
}

/*charity cta*/
.charity-cta-section{
	background: #fcfcfc;
    padding-top: 0px;
    padding-bottom: 50px;
    font-weight: 400;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale;
    /* padding: 75px 0 10px 0; */
    /* float: left; */
    width: 100%;
    text-align: center;
}

.charity-cta-section.charity-cta-urgent{
	background: #fcfcfc;
    width: 100%;
    text-align: center;
    padding-top: 30px;
	padding-bottom: 30px;
}

.charity-cta-section.charity-cta-urgent .wrapper-full {
    position: relative;
    width: auto;
    margin: 0;
    
}

.charity-cta-section .wrapper-full {
    position: relative;
    width: 1050px;
    margin: 0 auto;
}

.charity-cta-section.charity-cta-urgent  .cta-wrapper {
    
    text-align: left;
    padding: 0px;
}

.charity-cta-section .cta-wrapper {
    
    text-align: left;
    padding: 28px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -ms-border-radius: 3px;
    -o-border-radius: 3px;
    border-radius: 3px;
}

.charity-cta-section.charity-cta-urgent .cta-wrapper .details-wrapper {
    padding: 25px;
    float: left;
    width: 50%;
}


.charity-cta-section .cta-wrapper .details-wrapper {
    float: left;
    width: 60%;
}

.charity-cta-section.charity-cta-urgent .cta-wrapper .details-wrapper h2 {
    font-weight: 400;
    margin: 0 0 20px 0;
    color: var(--blue);
    font-size: 32px;
}

.charity-cta-section.charity-cta-urgent .cta-wrapper .details-wrapper p {
    font-size: 16px;
    color: var(--green);
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

.charity-cta-section.charity-cta-btm .cta-wrapper .details-wrapper h2 {
    font-weight: 400;
    margin: 0 0 4px 0;
    color: var(--green);
    font-size: 32px;
    margin-bottom: 15px;
}



.charity-cta-section .cta-wrapper .details-wrapper p {
    font-size: 16px;
    color: var(--blue);
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

.charity-cta-section.charity-cta-urgent .cta-wrapper .charity-urgent-img {
    /*display: inline-block;*/
    /*margin: 31px 0 25px 0;*/
    float: right;
    /*margin: 0;*/
    /*padding: 17px 0;*/
    /*width: auto;*/
}

.charity-cta-section .cta-wrapper .blue-cta-button {
    padding: 17px 50px;
    text-transform: uppercase;
    background: rgb(38 34 98);
    background: linear-gradient(-60deg, #047555 10%, #008cca 76%);
    color: #FFF;
    letter-spacing: 3px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -ms-border-radius: 3px;
    -o-border-radius: 3px;
    border-radius: 3px;
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -ms-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
    text-decoration: none;
    font-weight: 300;
    display: inline-block;
    white-space: pre;
    margin: 31px 0 25px 0;
    float: right;
    margin: 0;
    color: #fff;
    background-color: #FFF;
    padding: 17px 0;
    width: 30%;
    text-align: center;
    opacity: 0.7;
}

.charity-cta-section .cta-wrapper .blue-cta-button:hover {
	background: linear-gradient(-60deg, #008cca 10%, #047555 76%);
	box-shadow: 0 1rem 3rem rgba(0,0,0,.175)!important;
	-webkit-box-shadow: 0 1rem 3rem rgba(0,0,0,.175)!important;

}

.clearfix {
    clear: both;
}

.clearfix::after {
    display: block;
    clear: both;
    content: "";
}

/*charity page css*/

/*charity*/


/*charity-details page*/

.charity-details-sec,
.donation-form-sec{ 
	 margin-bottom: 55px;
}

.charity-details-sec img:nth-of-type(1){
	width: 100%;
    /*height: 318px;*/
    /*object-fit: cover;*/
    
}

.charity-details-sec .header h2.section-title-others,
.donation-form-sec .header h2.section-title-others{
	margin-top: 25px;
	margin-bottom: 25px;

}

.charity-details-sec .header h2.section-title-others span,
.donation-form-sec .header h2.section-title-others span {
    background: #ccc none repeat scroll 0 0;
    display: block;
    height: 2px;
    margin: 15px auto;
    width: 70px;
    
 }

.donation-form-sec .donate-form input[type=text],
.donation-form-sec .donate-form textarea{
 	border: none;
 	transition: 1s;
 	padding: 7px 14px 9px;
 	-webkit-transition: 1s; 
    
 }


 .donation-form-sec .donate-form input[type=text],
 .donation-form-sec .donate-form textarea,
  .donation-form-sec .donate-form .donation-type{
 	box-shadow: 0 .125rem .25rem rgba(0,0,0,.075)!important;
	-webkit-box-shadow: 0 .125rem .25rem rgba(0,0,0,.075)!important;
	text-align: left;
}

.donation-form-sec .donate-form input[type=text]:focus,
.donation-form-sec .donate-form textarea:focus{
 	box-shadow: 0 0 5pt 2pt #D3D3D3;
  	outline-width: 0px;
 }


/*charity donate btn-flip btn*/

.tip-button {
	 /*background: none;*/
	 border: 0;
	 border-radius: 20px;
	 cursor: pointer;

	 height: 2.6rem;
	 /*margin-bottom: -4rem;*/
	 outline: 0;
	 position: relative;
	 top: 0;
	 transform-origin: 0% 100%;
	 transition: transform 50ms ease-in-out;
	 width: 9.5rem;
	 -webkit-tap-highlight-color: transparent;
}
 .tip-button:active {
	 transform: rotate(4deg);
}
 .tip-button.clicked {
	 animation: 150ms ease-in-out 1 shake;
	 pointer-events: none;
}
 .tip-button.clicked .tip-button__text {
	 opacity: 0;
	 transition: opacity 100ms linear 200ms;
}
 .tip-button.clicked::before {
	 height: 0.5rem;
	 width: 60%;
}
 .tip-button.clicked .coin {
	 transition: margin-bottom 1s linear 200ms;
	 margin-bottom: 0;
}
 .tip-button.shrink-landing::before {
	 transition: width 200ms ease-in;
	 width: 0;
}
 .tip-button.coin-landed::after {
	 opacity: 1;
	 transform: scale(1);
	 transform-origin: 50% 100%;
}
 .tip-button.coin-landed .coin-wrapper {
	 background: radial-gradient(circle at 35% 97%, rgba(3, 16, 50, 0.4) 0.04rem, transparent 0.04rem), radial-gradient(circle at 45% 92%, rgba(3, 16, 50, 0.4) 0.04rem, transparent 0.02rem), radial-gradient(circle at 55% 98%, rgba(3, 16, 50, 0.4) 0.04rem, transparent 0.04rem), radial-gradient(circle at 65% 96%, rgba(3, 16, 50, 0.4) 0.06rem, transparent 0.06rem);
	 background-position: center bottom;
	 background-size: 100%;
	 bottom: -1rem;
	 opacity: 0;
	 transform: scale(2) translateY(-10px);
}
 .tip-button__text {
	 color: #fff;
	 margin-right: 1.8rem;
	 opacity: 1;
	 position: relative;
	 transition: opacity 100ms linear 500ms;
	 z-index: 3;
}
 .tip-button::before {
	 background: var(--blue);
	 border-radius: 20px;
	 bottom: 0;
	 content: '';
	 display: block;
	 height: 100%;
	 left: 50%;
	 position: absolute;
	 transform: translateX(-50%);
	 transition: height 250ms ease-in-out 400ms, width 250ms ease-in-out 300ms;
	 width: 100%;
	 z-index: 2;
}
 .tip-button::after {
	 bottom: -1rem;
	 color: #fff;
	 content: 'জাযাকাল্লাহু খাইর';
	 height: 110%;
	 left: 0;
	 opacity: 0;
	 position: absolute;
	 pointer-events: none;
	 text-align: center;
	 transform: scale(0);
	 transform-origin: 50% 20%;
	 transition: transform 200ms cubic-bezier(0, 0, 0.35, 1.43);
	 width: 100%;
	 z-index: 1;
}
 .coin-wrapper {
	 background: none;
	 bottom: 0;
	 height: 18rem;
	 left: 0;
	 opacity: 1;
	 overflow: hidden;
	 pointer-events: none;
	 position: absolute;
	 transform: none;
	 transform-origin: 50% 100%;
	 transition: opacity 200ms linear 100ms, transform 300ms ease-out;
	 width: 100%;
}
 .coin {
	 --front-y-multiplier: 0;
	 --back-y-multiplier: 0;
	 --coin-y-multiplier: 0;
	 --coin-x-multiplier: 0;
	 --coin-scale-multiplier: 0;
	 --coin-rotation-multiplier: 0;
	 --shine-opacity-multiplier: 0.4;
	 --shine-bg-multiplier: 50%;
	 bottom: calc(var(--coin-y-multiplier) * 1rem - 3.5rem);
	 height: 3.5rem;
	 margin-bottom: 3.05rem;
	 position: absolute;
	 right: calc(var(--coin-x-multiplier) * 34% + 16%);
	 transform: translateX(50%) scale(calc(0.4 + var(--coin-scale-multiplier))) rotate(calc(var(--coin-rotation-multiplier) * -1deg));
	 transition: opacity 100ms linear 200ms;
	 width: 3.5rem;
	 z-index: 3;
}
 .coin__front, .coin__middle, .coin__back, .coin::before, .coin__front::after, .coin__back::after {
	 border-radius: 50%;
	 box-sizing: border-box;
	 height: 100%;
	 left: 0;
	 position: absolute;
	 width: 100%;
	 z-index: 3;
}
 .coin__front {
	 background: radial-gradient(circle at 50% 50%, transparent 50%, rgba(115, 124, 153, 0.4) 54%, #c2cadf 54%), linear-gradient(210deg, #8590b3 32%, transparent 32%), linear-gradient(150deg, #8590b3 32%, transparent 32%), linear-gradient(to right, #8590b3 22%, transparent 22%, transparent 78%, #8590b3 78%), linear-gradient(to bottom, #fcfaf9 44%, transparent 44%, transparent 65%, #fcfaf9 65%, #fcfaf9 71%, #8590b3 71%), linear-gradient(to right, transparent 28%, #fcfaf9 28%, #fcfaf9 34%, #8590b3 34%, #8590b3 40%, #fcfaf9 40%, #fcfaf9 47%, #8590b3 47%, #8590b3 53%, #fcfaf9 53%, #fcfaf9 60%, #8590b3 60%, #8590b3 66%, #fcfaf9 66%, #fcfaf9 72%, transparent 72%);
	 background-color: #8590b3;
	 background-size: 100% 100%;
	 transform: translateY(calc(var(--front-y-multiplier) * 0.3181818182rem / 2)) scaleY(var(--front-scale-multiplier));
}
 .coin__front::after {
	 background: rgba(0, 0, 0, 0.2);
	 content: '';
	 opacity: var(--front-y-multiplier);
}
 .coin__middle {
	 background: #737c99;
	 transform: translateY(calc(var(--middle-y-multiplier) * 0.3181818182rem / 2)) scaleY(var(--middle-scale-multiplier));
}
 .coin__back {
	 background: radial-gradient(circle at 50% 50%, transparent 50%, rgba(115, 124, 153, 0.4) 54%, #c2cadf 54%), radial-gradient(circle at 50% 40%, #fcfaf9 23%, transparent 23%), radial-gradient(circle at 50% 100%, #fcfaf9 35%, transparent 35%);
	 background-color: #8590b3;
	 background-size: 100% 100%;
	 transform: translateY(calc(var(--back-y-multiplier) * 0.3181818182rem / 2)) scaleY(var(--back-scale-multiplier));
}
 .coin__back::after {
	 background: rgba(0, 0, 0, 0.2);
	 content: '';
	 opacity: var(--back-y-multiplier);
}
 .coin::before {
	 background: radial-gradient(circle at 25% 65%, transparent 50%, rgba(255, 255, 255, 0.9) 90%), linear-gradient(55deg, transparent calc(var(--shine-bg-multiplier) + 0%), #e9f4ff calc(var(--shine-bg-multiplier) + 0%), transparent calc(var(--shine-bg-multiplier) + 50%));
	 content: '';
	 opacity: var(--shine-opacity-multiplier);
	 transform: translateY(calc(var(--middle-y-multiplier) * 0.3181818182rem / -2)) scaleY(var(--middle-scale-multiplier)) rotate(calc(var(--coin-rotation-multiplier) * 1deg));
	 z-index: 10;
}
 .coin::after {
	 background: #737c99;
	 content: '';
	 height: 0.3181818182rem;
	 left: 0;
	 position: absolute;
	 top: 50%;
	 transform: translateY(-50%);
	 width: 100%;
	 z-index: 2;
}
 @keyframes shake {
	 0% {
		 transform: rotate(4deg);
	}
	 66% {
		 transform: rotate(-4deg);
	}
	 100% {
		 transform: rotate();
	}
}




/*charity donate btn-flip btn*/




/*charity-details page*/

/*fatwa/blog */

.fatwa{
	 background-image: url("../img/fatwa-bg.png");
	 background-size: cover;
	 background-position: center;
	 background-attachment: fixed;
	 padding: 70px;
}

.fatwa-title strong{
	font-family: 'Open Sans';
	font-size: 14px;
}


.fatwa .nav-pills .nav-link{
	/*font-size: 12px;*/
	/*margin-right: 50px;*/
	background-color: #fff;
	color: var(--green);
	box-shadow: 0 16px 40px rgba(0,0,0,0.12);
	-webkit-box-shadow: 0 16px 40px rgba(0,0,0,0.12);
}

.fatwa .nav-pills .nav-link:nth-of-type(1){
	/*margin-right: 130px;*/
}

.fatwa .nav-pills .nav-link.active, .nav-pills .show>.nav-link{
	color: #fff;
	background-color: var(--green);
}

.fatwa .tab-content .card{
	/*width: 35vh;*/
	/*font-size: 12px;*/
	margin-right: -20px;
	margin-bottom: 10px;
	padding: 10px 15px 0px 15px;
	height: 8rem;
}

.fatwa .tab-content .card:hover{
	cursor: pointer;
	background-color: #eee;
	transition: all 0.3s cubic-bezier(.25, .8, .25, 1);
}

.fatwa .tab-content .card .fatwa-text{
	/*margin-top: 20px;*/
	font-size: 14px;
	font-weight: bold;
}

.fatwa .tab-content .card .fatwa-writer{
	margin-top: 10px;
	font-size: 12px;
	font-style: italic;
}

.fatwa .tab-pane a{
	color: var(--green);
}

#pills-tab{
	/*display: flex;
	justify-content: space-around;*/
}

.fatwa .nav-pills::after {
    display: inline-block;
    content: "";
    border-bottom: 2px solid var(--green);
    border-radius: 18px;
    width: 100%;
    margin-top: 10px;
    /*transform: translateX(-.5rem);*/
}

/*hr.fatwa-hr{
	color: var(--green);
}*/

/*fatwa/blog */

/*fatwa page css starts here*/

.fatwa-blog-sec .fatwa-filter-title{
	background: var(--green);
	color: white;
	font-size: 14px;
	border-radius: 7px;
	padding: 5px 15px 5px 15px;
	display: inline-block;
	margin-bottom: 15px;
	box-shadow:0 3px 8px rgba(0, 0, 0, .3);
     -webkit-box-shadow:0 3px 8px rgba(0, 0, 0, .3);
}

.fatwa-blog-sec .filter-wrap,
.fatwa-blog-sec .fatwa-wrap,
.fatwa-blog-sec .filter-tag-wrap{
	border-radius: 7px;
}


.fatwa-blog-sec .filter-wrap form{
	font-size: 14px;
	color: var(--green);
}	


.fatwa-wrap{
    padding: 10px 15px 10px 15px ;
    background: #f7f7f7;
    color: var(--green);
    margin:0 0 3px;
    height: 12rem;
}	


.fatwa-wrap .fatwa-ques{
	font-weight: 600;
}

.fatwa-wrap .fatwa-ans{
	font-size: 13px;
	font-weight: normal;
}


/*fatwa filter tag*/





.tags-input 
{
  	list-style : none;     
  	display:inline-block;
  	padding:5px;
  	height: auto;
    font-size:12px;
}

.tags-input li
{
  	float:left;
}

.tags
{
  	background: var(--green);
  	color: #fff;
  	padding: 10px 25px 5px 10px;
    border-radius: 7px;
    position: relative;
    margin: 0px 3px 3px 0px;
}

.tags i
{
	position: absolute; 
	right:4px;
	top: 12px;
	width: 10px;
	height: 8px;
	content:'';
	cursor:pointer;
    font-size:12px;
}

.tags i:hover
{
	opacity: 1;
}

.tags-new input[type="text"]
{
    border:0;
	margin: 0;
	padding: 0 0 0 3px;
	font-size: 14px;
	margin-top: 5px;
    background:transparent;
}

.tags-new input[type="text"]:focus
{
  	outline:none; 
}


/*fatwa filter tag*/

/*fatwa page css ends here*/


/*ask fatwa page*/


.ask-fatwa-sec{ 
	 margin-bottom: 55px;
}

.ask-fatwa-sec .header h2.section-title-others{
	margin-top: 25px;
	margin-bottom: 25px;
}

.ask-fatwa-sec .header h2.section-title-others span {
    background: #ccc none repeat scroll 0 0;
    display: block;
    height: 2px;
    margin: 15px auto;
    width: 70px;
    
 }


.ask-fatwa-sec .contact-form input[type=text],
.ask-fatwa-sec .contact-form textarea{
 	border: none;
 	transition: 1s;
 	padding: 7px 14px 9px;
 	-webkit-transition: 1s; 
    
 }

 .ask-fatwa-sec .contact-form input[type=text],
 .ask-fatwa-sec .contact-form textarea{
 	box-shadow: 0 .125rem .25rem rgba(0,0,0,.075)!important;
	-webkit-box-shadow: 0 .125rem .25rem rgba(0,0,0,.075)!important;
}

.ask-fatwa-sec .contact-form input[type=text]:focus,
.ask-fatwa-sec .contact-form textarea:focus{
 	outline: none;
 }




/*ask fatwa page */

/*home page css ends here*/

/***************************************************/

/*administration page css starts here*/

/*administration tab*/

.administration-sec{ 
	 margin-bottom: 55px;
}

.administration-sec .header h2.section-title-others{
	margin-top: 25px;
	margin-bottom: 25px;
}

.administration-sec .header h2.section-title-others span {
    background: #ccc none repeat scroll 0 0;
    display: block;
    height: 2px;
    margin: 15px auto;
    width: 70px;
    position: relative;
 }
 
.administration-sec .tab-content {
	 padding: 0;
	 margin-bottom: 55px;
}


.administration-card.card {
	 border-radius: 10px;
	 /*border-top: 5px solid var(--green);*/
	 /*border-bottom: 5px solid var(--green);*/
	 height: 55vh;
	 overflow-y: scroll;
}


.administration-card.card::-webkit-scrollbar {
	background: none;
	height: 3px;
	width: 8px;
}

.administration-card.card::-webkit-scrollbar-thumb {
	background: #eee;
	/*border-radius: 20px;*/
	border-top-left-radius: 20px;
	border-bottom-left-radius: 20px;
}


.administration-sec .nav-tabs {
	 height: 42px;
	 padding: 0;
	 position: relative;
	 border-radius: 20px;
}

.administration-sec .nav-tabs .nav-item {
	 margin-left: 0;
}

.administration-sec .nav-tabs .nav-item a {
	 color: var(--green);
	 display: block;
	 padding: 8px 25px;
	 font-weight: 600;
}


.administration-sec .nav-tabs .nav-item a:hover,
.administration-sec .nav-tabs .nav-item a:focus,
.administration-sec .nav-tabs .nav-item a:active,
.administration-sec .nav-tabs .nav-item.show .nav-link,
.administration-sec .nav-tabs .nav-link.active{
	color: var(--blue);
	border: none;
	background: none;
}

.administration-sec .nav-tabs .nav-item.overflow-tab {
	 background-color: white;
	 display: none;
	 position: absolute;
	 right: 0;
	 width: 150px;
	 z-index: 1;
}

.administration-sec .nav-tabs .nav-item.overflow-tab a {
	 border: 1px solid lightgray;
	 border-radius: 0;
	 padding: 6px 10px;
	 background-color: #fff;

}
.administration-sec .nav-tabs .nav-item.overflow-tab a:hover, 
.administration-sec.nav-tabs .nav-item.overflow-tab a:focus,  
.administration-sec .nav-tabs .nav-item.overflow-tab a:active {
	 /*background-color: lightgray;*/
	 color: var(--blue);
	 border: 1px solid var(--blue);
}

.administration-sec .nav-tabs .nav-item.overflow-tab:last-child {
	 border-radius: 0 0 0 4px;
}

.administration-sec .nav-tabs .nav-item.overflow-tab-action {
	 position: absolute;
	 right: 0;
}
 

/*administration tab*/


/*administration page css ends here*/


/*gallery sec*/

.gallery-card {
	height: 55vh;
	overflow-y: scroll;
}

.gallery-card .card{
	width: 16rem; 
	height: 20rem;
}

.gallery-card .gallery-img-col{
	margin-top: 10px;
}

.gallery-card .card img{
	width: 16rem;
    height: 210px;
    object-fit: cover;
}



.gallery-card .card .card-text{
	text-align: center;
}

.gallery-card.card::-webkit-scrollbar {
	background: none;
	height: 3px;
	width: 8px;
}

.gallery-card.card::-webkit-scrollbar-thumb {
	background: #eee;
	/*border-radius: 20px;*/
	border-top-left-radius: 20px;
	border-bottom-left-radius: 20px;
}

/*gallery sec*/


/*single details page*/

.fatwa-filter-title{
	background: var(--green);
	color: white;
	font-size: 14px;
	border-radius: 7px;
	padding: 5px 15px 5px 15px;
	display: inline-block;
	margin-top: 15px;
	
}

/*single details page*/

/*notices page*/

.all-notices-sec .all-notices-title{
	background: var(--green);
	color: white;
	/*font-size: 14px;*/
	border-radius: 7px;
	padding: 5px 15px 5px 15px;
	display: inline-block;
	margin-bottom: 15px;
	box-shadow:0 3px 8px rgba(0, 0, 0, .3);
     -webkit-box-shadow:0 3px 8px rgba(0, 0, 0, .3);
}

/*notices page*/

/*e-learn page*/

.e-learn-sec{
/*	background-image: url("../img/e-learn-bg.png");
	background-size: cover;
	background-position: center;
	background-attachment: fixed;*/
}

.e-learn-adv .e-learn-adv-title {
	position: relative;
}

.e-learn-adv .e-learn-adv-title h2 {
	position: absolute;
	top: 5rem;
	left: 2rem;
	line-height: 40px;
	/*padding: 15px*/
}

.e-learn-adv .e-learn-adv-title a{
	position: absolute;
	top: 15rem;
	left: 2rem;
}


.e-learn-sec .e-learn-title{
	background: var(--green);
	color: white;
	/*font-size: 14px;*/
	border-radius: 7px;
	padding: 5px 15px 5px 15px;
	display: inline-block;
	margin-bottom: 15px;
	box-shadow:0 3px 8px rgba(0, 0, 0, .3);
     -webkit-box-shadow:0 3px 8px rgba(0, 0, 0, .3);
}


.e-learn-title-div .e-learn-subtitle{
	position: relative;
	text-align: center;
	overflow: hidden;
	z-index: 1;
}


.e-learn-title-div .e-learn-subtitle:before, 
.e-learn-title-div .e-learn-subtitle:after {
    position: absolute;
    top: 51%;
    overflow: hidden;
    width: 48%;
    height: 1px;
    content: '\a0';
    background-color: var(--green);
    margin-left: 2%;
}

.e-learn-title-div .e-learn-subtitle:before {
    margin-left: -50%;
    text-align: right;
}


.e-learn-sec .grid-container .card {
	margin-bottom: 1rem;
	box-shadow:0 3px 8px rgba(0, 0, 0, .3);
     -webkit-box-shadow:0 3px 8px rgba(0, 0, 0, .3);
	/*width: 16rem;*/
    height: 34rem;
}


.e-learn-sec .grid-container .card .e-course-img{
    width: auto;
    height: 255px;
    object-fit: cover;
}

.list-view .row > [class*='col-'] {
	 max-width: 100%;
	 flex: 0 0 100%;
}
 .list-view .card {
	 flex-direction: row;
}
 @media (max-width: 575.98px) {
	 .list-view .card {
		 flex-direction: column;
	}
}
 .list-view .card > .card-img-top {
	 width: auto;
}
 .list-view .card .card-body {
	 display: inline-block;
}
 

/*enroll-apply */

.course-select select {
  -webkit-appearance: none;
  -moz-appearance: none;
  -ms-appearance: none;
  appearance: none;
  outline: 0;
  box-shadow: none;
  border: 0 !important;
  background: var(--green);
  background-image: none;
}

/* Custom Select */
.course-select.select {
  position: relative;
  display: flex;
  width: 15em;
  height: 2em;
  /*line-height: 3;*/
  background: #2c3e50;
  overflow: hidden;
  border-radius: .25em;
}
.course-select select {
  flex: 1;
  padding: 0 .5em;
  color: #fff;
  cursor: pointer;
}
/* Arrow */
.course-select.select::after {
  content: '\25BC';
  position: absolute;
  top: 0;
  right: 0;
  padding: 5px 10px;
  color: #fff;
  background: var(--green);
  font-size: 12px;
  cursor: pointer;
  pointer-events: none;
  -webkit-transition: .25s all ease;
  -o-transition: .25s all ease;
  transition: .25s all ease;
}
/* Transition */
.course-select.select:hover::after {
  color: #fff;
}


/*enroll apply*/

/*e-learn page*/

/*login*/
.login-sec .global-container{
	height:100%;
	display: flex;
	align-items: center;
	justify-content: center;
}

.login-sec .login-card{
	 background: var(--green);
	 background-image: url("../img/login-bg.jpg");
	 background-size: cover;
	 background-position: center;
}

form.login-form{
	padding-top: 10px;
	font-size: 14px;
	margin-top: 30px;
}

.login-card .card-title{ font-weight:300; }


.login-card{ 
	width:330px;
	margin:20px;
}

.sign-up{
	text-align:center;
	padding:20px 0 0;
}

.alert{
	margin-bottom:-30px;
	font-size: 13px;
	margin-top:20px;
}

/*login*/

/*footer*/

.footer {
	 padding-top: 24px;
	 padding-bottom: 24px;
	 background: #212121;
}


.fas.fa-angle-up{
	margin-left: 90%;
	color: #03a4f0;
	font-size: 40px;
}

/*smooth scroll btn*/
.fas.fa-angle-up{
    margin-left: 90%;
    color: #ffffff;
    font-size: 20px;
    border-radius: 50%;
    border: none;
    padding: 5px 9px;
    background: var(--green);
    margin-bottom: 10px;
    width: 30px;
    height: 30px;
}
/*smooth scroll btn*/

.footer{
	background: var(--green);
	background-image: url("../img/footer-bg.png");
	 background-size: cover;
	 background-position: center;
	 background-attachment: scroll;
}
.footer .about {
	/*padding-right: 50px;*/
}
.footer .single-footer h4 {
	font-size: 17px;
	font-weight: 600;
	letter-spacing: 2px;
	color: #fff;
	text-transform: capitalize;
	margin-bottom: 30px;
}
.footer .about .logo{
	margin-bottom:20px;
}
.footer .about .logo img{}
.footer .about .text{
	color:#fff;
	font-weight: 400;
}
.footer .about .call {
	color: #fff;
	margin-top: 15px;
	font-weight: 400;
}
.footer .about .call span{
	display: block;
}
.footer .about .call a {
	color: #ffffff;
    font-size: 14px;
    font-weight: 600;
}
.footer .links ul{
    margin-left: -40px;
}
.footer .links ul li {
	display: block;
	margin-bottom: 8px;
	-webkit-transition: all 0.4s ease;
	-moz-transition: all 0.4s ease;
	transition: all 0.4s ease;
}
.footer .links ul li:last-child{
	margin-bottom:0;
}
.footer .links ul li a{
	color:#fff;
	font-size: 14px;
	font-weight: 400;
	-webkit-transition: all 0.4s ease;
	-moz-transition: all 0.4s ease;
	transition: all 0.4s ease;
}
.footer .links ul li a:hover{
	color: #555;
	padding-left:10px;
}
.footer .social{}
.footer .social .contact{}
.footer .social .contact ul{
    margin-left: -38px;
}
.footer .social .contact ul li {
	color: #fff;
	display: block;
	margin-bottom: 4px;
	font-weight: 400;
	-webkit-transition: all 0.4s ease;
	-moz-transition: all 0.4s ease;
	transition: all 0.4s ease;
}
.footer .contact ul li:last-child{
	margin-bottom:0;
}
.footer .social ul {
	margin-top: 20px;
	margin-left: -35px;
}
.footer .social ul li{
	display:inline-block;
	margin-right:25px;
}
.footer .social ul li:last-child{
	margin-right:0;
}
.footer .social ul li a{
	color:#fff;
	display:block;
	font-size:16px;
}
.footer .social ul li a:hover{
	color: var(--blue);
}
/* Copyright */
.footer .copyright{
	
}
.footer .copyright .inner{
	border-top:1px solid #eeeeee3d;
	padding: 10px 0;
}
.footer .copyright .left{}
.footer .copyright .right{
	float:right;
}
.footer .copyright p{
	color:#fff;
}
.footer .copyright p a{
	color:#fff;
	text-decoration: none;
}

/*footer*/



/*media query for responsive css*/

/*responsive css*/
/*for large desktop*/



@media (max-width: 768px){

	.mobile-d-none {
		display: none !important;
	}
	
	.mobile-d-block,
	.top-mobile-div,
	.mobile-d-search {
		display: block !important;
		/*margin-top: -10px;*/
	}

	/*text-size*/

	h2.section-title-others{
		font-size: 24px;
	}

	/*text-size*/

	/*top-title*/

	.top-nav.navbar{
 		padding: 0px 15px !important;
	}

	.top-nav ul {
    	
    	margin-top: 0vh;
    	text-align: right;
	}
 	
 	.nav-cta{
		display: inline-block;
    	margin-top: 3vh;
    	margin-bottom: 25px;
    	float: right;
	}

	.collapse.show {   
	    padding-bottom: 12px;
	}

	.navbar-nav .nav-link i{
		top: 0px !important;
		right: -20px !important;
	}

	.top-title .order_1{
	    -webkit-box-ordinal-group: 3;
    	-ms-flex-order: 2;
    	order: 1;
    	text-align: right;
	}

	.top-title .order_2{
    	-webkit-box-ordinal-group: 3;
    	-ms-flex-order: 2;
    	order: 2;
    	margin-top: -25px;
	}

	.top-title .order_3{
	    -webkit-box-ordinal-group: 3;
    	-ms-flex-order: 2;
    	order: 3;
	}

	select{
		font-size: 12px;
	}

	.select {
 	  width: 5em;
 	  height: 1.5em;
	}


	/*top-title*/

	/*header*/
	.nav-logo img{
		width: 100px;
    	height: 64px;
	}

	/*navbar-lateral-left*/

	 .navbar .navbar-collapse.collapsing{ 
    	/*height:auto !important;*/
  	}

  	.mobile-h2{
  		font-size: 24px;
  	}

	  .navbar .lateral-left{
	    left:-100%; 
	    animation: slide-out-left 500ms forwards;
	  }
	  .navbar .lateral-left.open{ 
	    animation: slide-in-left 500ms forwards;
	  }

	  .navbar .lateral-right{
	    right:-100%;
	    animation: slide-out-right 500ms forwards;
	  }
	  .navbar .lateral-right.open{ 
	    animation: slide-in-right 500ms forwards;
	  }
	  
	  .navbar .navbar-collapse{ 
	    top:0px; 
	    bottom:0px; 
	    position:fixed; 
	    width:80%; 
	    width:calc(100% - 60px); 
	    max-width: 290px; 
	    height:auto !important;

	    /* Optional styling */
	    background:#fff;
	    padding:30px;
	    /*top: 172px;*/
	    box-shadow: -2px 3px 20px 14px rgb(154 152 152 / 24%), 0 0 0 1px rgb(0 0 0 / 8%);
    	-webkit-box-shadow: -2px 3px 20px 14px rgb(154 152 152 / 24%), 0 0 0 1px rgb(0 0 0 / 8%);
	  }

	  .navbar .lateral-left.open,
	  .navbar .lateral-right.open{
	    display:block !important;
	    overflow-y:auto;
	  }


		@keyframes slide-in-left{ 
		  0%		{ left:-100%; }
		  100%	{ left:0px; }
		}
		@keyframes slide-out-left{
		  0%		{ left:0px; }
		  100%	{ left:-100%; }
		}
		@keyframes slide-in-right{ 
		  0%		{ right:-100%; }
		  100%	{ right:0px; }
		}
		@keyframes slide-out-right{
		  0%		{ right:0px; }
		  100%	{ right:-100%; }
		}


	/*navbar-lateral-left*/

	.title-text{
		font-size: 18px;
		padding: 15px;
	}
	.top-nav{
		background-image: none !important;
	}

	.top-title .form-control {
	    border-top-right-radius: .25rem;
	    border-bottom-right-radius: .25rem;
	}
	

	.top-hero {
	    background-position: center !important;
	    background-attachment: inherit !important;
	    height: 30vh; 
	}

	.top-hero-content{
		top: 20vh;
	}

	.top-hero-content .btn {
 	   margin-bottom: -50px;
 	   font-size: 11px;	
}

	.meeting-update {
		background: rgb(255,255,255);
		box-shadow:0 3px 8px rgba(0, 0, 0, .3);
     	-webkit-box-shadow:0 3px 8px rgba(0, 0, 0, .3);
		display: block;
		text-align: center !important;
		font-size: 13px;
		
	}


	/*header*/

	/*section-speech*/
	.section-title, .section-title h2{
		font-size: 20px;
	}

	.section-title::after{
		border-top: 2px solid var(--green);
    	margin-left: 70px;
    	width: 7rem;
	}

	.section-title.other-section-title::after{
		border-top: 2px solid var(--green);
    	margin-left: 0px;
    	width: 7rem;
	}

	.section-speech .facts {
		font-size: 13px;
	}

	.facts-title{
		font-size: 15px;
		margin-bottom: 15px;
	}

	.muhtamim-msg p{
		font-size: 14px;
    	line-height: 20px;
	}


	.muhtamim-img {
   		margin-top: 15px;
   		margin-bottom: 15px;
	}

	.muhtamim-img img {
		width: 230px;
		/*height: 270px;*/
		margin-bottom: 15px;
	}

	.section-speech{
		padding: 25px 50px !important;
	}

	.section-speech .facts:nth-of-type(1), 
	.section-speech .facts:nth-of-type(2), 
	.section-speech .facts:nth-of-type(3), 
	.section-speech .facts:nth-of-type(4) {
   		 margin-bottom: 10px;
	}

	.section-speech .col-md-3 img.minar-vector{
		bottom: -205px;
	}

	/*section-speech*/

	/*media video*/

	.media-vdo{
		padding: 15px;
	}

	/*media video*/
	/*notice panel*/
	.notice-holder{
		margin-top: 25px;
	}

	.notice-holder .mask{
		width: 200px;
	}

	.notice-holder ul li p{
		font-size: 13px;
	}

	/*notice panel*/


	/*courses*/

	.courses .card{
		width: 12rem !important;
		height: 17rem !important;
		margin-left: -5px;
		margin-bottom: 10px;

	}

	.courses .card img {
		height:170px;
		width: 100%;
	}
	/*courses*/

	/*charity*/
	
	.charity-details-sec .btn-blue{
		display: block;
	}

	.image-grid-card{
		padding: 0px !important;
	}

	.grid-container .charity-img-div .overlay-1{
		right: 0px;
	}

	.charity-hadith-title, .charity-member {
  	  margin-top: 70px;
	}

	.charity-member-btn{
		position: relative !important;
	}

	.charity-hadith-title{
		margin-bottom: 90px;
	}

	.charity-hadith,.charity-member{
		text-align: center;
		font-size: 22px;
	}

	.courses .row .card .card-body{
		padding: 12px;
	}          

	/*charity page*/
	.charity-cta-section {
	    padding-top: 0px;
	    padding-bottom: 115px;
	}
	.charity-cta-section .wrapper-full {
	    width: 40vh  !important;
	}

	.charity-cta-section.charity-cta-urgent .wrapper-full{
		margin: auto !important;
	}

	.charity-cta-section.charity-cta-urgent .details-wrapper h2{
		font-size: 24px !important;
		font-weight: 600 !important;
	}

	.charity-cta-section.charity-cta-btm .details-wrapper h2{
		font-size: 18px !important;
		font-weight: 600 !important;
		text-align: center;
	}

	.charity-cta-section.charity-cta-btm .details-wrapper p{

		text-align: center;
	}

	.charity-cta-section.charity-cta-urgent .cta-wrapper .details-wrapper {
	    padding: 25px !important;
	    width: 100% !important;
	}

	.cta-wrapper .details-wrapper {
	    width: auto !important;
	}

	.cta-wrapper .blue-cta-button {
	    padding: 8px 8px !important; 
	    margin-top: 15px !important; 
	    width: 100% !important;
	    /*float: left !important;*/
	    letter-spacing: 2px !important;
	}

	/*charity page*/

	/*donation form*/

	.donate-project img {
 	   width: 313px;
	}

	.donation-form-sec .row .col-12:nth-of-type(2){
		margin-top: 25px;
	} 

	.donation-form-sec .payment-method-select{
		text-align: center !important;
	}

	/*donation form*/

	/*charity*/


	/*fatwa*/

	.fatwa .nav-pills .nav-link {
   		margin-bottom: 10px;
   		text-align: center;
	}

	.fatwa .tab-content .card{
		margin-right: 0px !important;
	}

	.filter-col{
		margin-top: -25px;
	}

	.fatwa{
		padding: 25px;
	}

	.fatwa-col{
		margin-bottom: 25px;
	}

	.fatwa-title h2{
		text-align: center;
		margin-top: 25px;
	}


	.fatwa .col-md-3.order_1{
	    -webkit-box-ordinal-group: 3;
    	-ms-flex-order: 2;
    	order: 1;
	}

	.fatwa .col-md-9.order_2{
    	-webkit-box-ordinal-group: 3;
    	-ms-flex-order: 2;
    	order: 2;
    	height: 50vh;
    	overflow-y: scroll;
	}

	.filter-tag-wrap{
		margin-bottom: 25px;
	}

	.fatwa .tab-content .card{
		height: 8rem;
	}

	.fatwa .tab-content .card .fatwa-text{
		font-size: 12px;
	}

	.fatwa .tab-content .card .fatwa-writer{
		font-size: 12px;
	}



	/*fatwa*/

/*gallery sec*/



	.gallery-card .card{
		width: 145px;
		height: 15rem !important;
		margin-left: -10px;
		margin-bottom: 10px;

	}
/*
.gallery-sec .nav-tabs .nav-item.overflow-tab-action {
    right: -20px !important;
}	
*/

/*gallery sec*/


/*e-learn page*/


/*e-learn page*/
.e-learn-adv .e-learn-adv-title h2 {
    position: relative !important;
    top: 0px !important;
    left: 0px !important;
    margin-bottom: 8rem;
}

.e-learn-adv .e-learn-adv-title a{
	margin-top: 5rem;
}

.e-learn-adv-img img{
	margin-bottom: 3rem;
}

.e-learn-grid-btn{
	margin-top: 3rem;
	margin-bottom: 3rem;
}

/*notices page*/

.all-notices-sec .all-notices-title{
	font-size: 16px;
}

/*notices page*/

/*footer*/
.footer .about {
    padding-right: 0px;
}

.footer .about .logo {
    text-align: center;
}

.fas.fa-angle-up {
    margin-left: 90%;
    color: #ffffff;
    font-size: 20px;
    border-radius: 50%;
    border: none;
    padding: 5px 9px;
    background: var(--green);
    margin-bottom: 10px;
    width: 30px;
    height: 30px;
}

.fas.fa-angle-up:hover{
	background-color: var(--blue);
}

.footer-top .container .row{
    margin-top: 0px !important;
}

.footer .single-footer h4 {
    font-size: 18px;
}

.footer .links ul {
    margin-left: -35px;
}

.footer .links ul li a,
.footer .social .contact ul li{
    font-size: 15px;
}

.footer .social .contact {
    /*margin-left: -35px;*/
}

.footer .copyright .left {
	float:none;
	text-align:center;
}
.footer .copyright .right {
	float:none;
	text-align:center;
	margin-top:10px;
}


.footer .single-footer {
	/*padding:20px 0;*/
}


}




/*for large desktop*/
@media screen and (min-width: 1280px) {

}



/*for ipad and portrait*/

@media (width: 768px){
    .section-speech .col-md-3 img.minar-vector{
    	bottom: -40px;
    }
}

@media only screen and (device-width: 768px) {
  /* For general iPad layouts - ipad */

  /*header*/
   .top-title .title-text {
   	 	font-size: 22px;
	}

  	.top-hero-content{
		top: 22vh;
	}
  /*header*/

  /*facts&fig*/
  .section-speech .col-md-3 img.minar-vector{
    	bottom: -40px;
    }

    .section-speech .facts:nth-of-type(1), 
	.section-speech .facts:nth-of-type(2), 
	.section-speech .facts:nth-of-type(3), 
	.section-speech .facts:nth-of-type(4) {
   		 margin-bottom: auto;
	}

    .facts-title {
   		 font-size: 18px;
	}

	.section-speech .facts{
		padding: 3px 2px 3px 2px;
		font-size: 13px;
	}

	.section-title{
		font-size: 16px;
		margin-bottom: auto;
	}

	.section-title::after{
		border-top: 2px solid var(--green);
    	margin: 0 0;
	}

	.muhtamim-img{
		margin-top: inherit;
		margin-bottom: inherit;
	}

	.muhtamim-text{
		font-size: 14px;
		line-height: 24px;
	}	
  	/*facts&fig*/
  	
  	/*media section*/
  	.play-perspective{
  		left: -14.5em;
  	}

  	.media-text{
  		left: 1em;
  	}

	  ol#vid-list li a{
		padding: 3px;
	}

  	/*media section*/

  	/*notice board*/

  	.notice-holder{
  		margin-top: auto;
  		height: auto;
  	}

  	.notice-holder .mask{
  		width: 170px;
  	}

  	.notice-holder  a.btn {
  		margin-bottom: 15px;
  	}
  	/*notice board*/

  	/*charity sec*/
  	.grid-container .charity-img-div img {
 	   width: 100px;
       height: 100px;
       object-fit: fill;	
	}

	.grid-container .charity-img-div .overlay-1{
		font-size: 9px;
	}

	.grid-container .charity-img-div .overlay-2{
		width: 7.2rem;
		height: 30%;
		font-size: 9px;
    	padding: 3px;
	}

	.charity-hadith, .charity-member {
	    text-align: right;
	}

	.charity-hadith, .charity-member-btn h4{
		font-size: 16px;
	}

	.charity-member-btn a{
		font-size: 13px;
	}

	.charity-hadith strong {  
    	font-size: 13px;
	}

	.image-grid-container .card .card-title{
		font-size: 16px;
		line-height: 22px;
	}

	.charity-member{
		margin-top: 22px
	}

	.charity-member-btn{
		text-align: left;
	}

	/*charity donate btn-flip btn*/

	.tip-button {
		margin-top: 15px;
	}
	/*charity donate btn-flip btn*/
  	
	/*charity sec*/

	  /*donation page*/

  	img.charity-urgent-img {
    	width: 100%;
	}

  	.donate-project img {
 	   width: 198px;
	}

  	/*donation page*/

  	/*fatwa*/
  	.fatwa{
  		padding: 25px;
  	}

  	.fatwa-title h2{
  		font-size: 22px;
  	}

  	.fatwa .nav-pills .nav-link{
  		font-size: 12px;
  	}

  	.fatwa .tab-content .card{
  		height: 13rem;
  	}

  	.fatwa .tab-content .card .fatwa-text{
		font-size: 12px;
	}

	.fatwa .tab-content .card .fatwa-writer{
		font-size: 10px;
	}

	/*fatwa page*/
	.filter-col {
 	   margin-top: 0px;
	}

	.fatwa-blog-sec .filter-wrap form {
 	   font-size: 10px;
	}

	.fatwa-blog-sec .filter-wrap form label{
 	   margin-bottom: 2px;

	}

	.fatwa-wrap .fatwa-ques {
	    font-size: 14px;
	}

	.fatwa-wrap .fatwa-ans {
		font-size: 12px;
	}

	.tags-input{
		padding: 0px;
	}

	.tags-input .tags{
		font-size: 12px;
	}

	/*fatwa page*/

  	/*fatwa*/

  	/*e-learning*/

  

  	/*e-learning*/

}

/*particularly for ipad-pro*/
	@media (width: 1024px){
 	
 	/*top-bar*/

 	.top-title .title-text {
 	   font-size: 30px;
	}

 	.top-title .search-box .btn-light:nth-of-type(1){
 		margin-right: 0px;
 	}

 	/*top-bar*/

   /*header*/

   .top-hero {
    	height: 20vh !important;
	}

  	.top-nav ul li.nav-item {
 	   margin-left: 0px;
	}

	.top-nav ul li.nav-item .nav-link{
		font-size: 12px;
		padding-left: 6px;
	}

  	.top-hero-content{
		top: 15vh;
	}

	.nav-cta{
		 margin-right: -38px;
	}
	/*header*/

	/*facts&fig*/
	.section-title{
		font-size: 24px;
		margin-bottom: 15px;
	}

	.section-title::after{
		border-top: 2px solid var(--green);
    	margin: 0 0;
	}


	.muhtamim-text{
		font-size: 16px;
		line-height: 26px;
	}	
	/*facts&fig*/

	/*media section*/
  	.play-perspective{
  		left: -11.5em;
  	}

  	.media-text{
  		left: 4em;
  	}

  	/*all-media	*/
	  .vid-container{
		padding-bottom: 80%;
	}

  	/*all-media*/
  	/*media section*/

	/*notice board*/
	.notice-holder{
  		height: auto;
  	}

  	.notice-holder .mask{
  		width: 260px;
  	}

  	.notice-holder  a.btn {
  		margin-bottom: 15px;
  	}

  	.charity-hadith, .charity-member-btn h4 {
    	font-size: 18px;
	}

	.charity-member-btn a{
		font-size: 13px;
	}

  	.charity-hadith strong {
    	font-size: 13px;
	}

	.grid-container .charity-img-div img {
 	   width: 140px;
       height: 140px;
       object-fit: cover;	
	}

	.grid-container .charity-img-div .overlay-2{
		width: 10rem;
		height: 30%;
		font-size: 12px;
	}

	.image-grid-container .card .card-title{
		font-size: 16px;
		line-height: 22px;
	}

  	/*notice board*/

  	/*fatwa*/
  	.fatwa{
  		padding: 25px;
  	}


  	.fatwa .nav-pills .nav-link{
  		font-size: 12px;
  		text-align: center;
  	}

  	.fatwa .tab-content .card{
  		height: 8rem;
  	}

  	.fatwa .tab-content .card .fatwa-text{
		font-size: 12px;
	}

	.fatwa .tab-content .card .fatwa-writer{
		font-size: 10px;
	}

	/*fatwa page*/

	.fatwa-blog-sec .filter-wrap form {
 	   font-size: 10px;
	}


	/*fatwa page*/

  	/*fatwa*/


  	/*e-learning*/

  	.e-learn-sec .grid-container .card .btn{
  		padding: 5px 15px 5px 10px;
  	}

  	/*e-learning*/

}
/*particularly for ipad-pro*/

@media only screen and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation:portrait) {
  /* For portrait layouts only - ipad-pro */
  	

}

@media only screen and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation:landscape) {
  /* For landscape layouts only */
  
  
}

/*for ipad and portrait*/