@import url('https://fonts.googleapis.com/css2?family=Libre+Baskerville:wght@400;700&family=Open+Sans:wght@300;400;700&family=Raleway:wght@300;400;600&family=Vollkorn:wght@400;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Markazi+Text:wght@400;600;700&display=swap');/*arabic fonts*/
/*{
    margin: 0;
    padding: 0;
}*/
body{
	font-family: 'Open Sans', sans-serif;
}

body:lang(ar){
    direction: rtl;
    text-align: right;
}


.img1 {
    width: 100%;
    height: 700px;
    position: absolute;
    z-index: -22;
    top: 0;
}

.sections{
	padding:50px 0;
}

.navbar-brand {
    background-color:transparent;
}
.my-header{
    /*height: 700px;*/
    width: 100%;
    position: absolute;
    
}

.my-header .my-navbar  {
    background:rgba(3, 37, 27, 0.4) !important;
    width:100%
    
}

.img2 {
    text-align: center;
    padding: 5px;
    width: 70px;
}

.dropdown-toggle::after{
    display:none;
}

.dropdown-item:lang(ar){
    text-align:  right;
}

.dropdown-menu:lang(ar){
    left:initial;
    right:0;
}

.nav-item .nav-link{
    margin-top:18px;
    color: #fff !important;
    transition: color 0.5s;
    font-family: 'Raleway', sans-serif;
    font-size: 15px;
	font-weight:600;
	letter-spacing:2px;
}

.nav-item .nav-link:lang(ar){
    letter-spacing:0.5px;
}

.nav-item .nav-link:hover{
color: black !important;
}

.nav-item .nav-link .fas{
	font-size: 12px;
	transition: color 0.5s;
	position: relative;
    top: -1px;
}
.nav-item .nav-link:hover .fas{
	font-size: 12px;
	color: black;
}

.navbar-nav .nav-item{
	margin-right: 10px;
    position: relative;
}

.navbar-nav .nav-item:lang(ar){
    margin-right: 0;
    margin-left: 10px;
}

.read_more{
	color:#cb4f2d;
	font-family: 'Raleway', sans-serif;
}

.underline_div a{
	position:relative;
	transition:all 0.5s;
}
.underline_div a:before{
	position:absolute;
	content:"";
	transition:all 0.5s;
	left:0;
	bottom:0;
	width:100%;
	height:2px;
	background: #cb4f2d;
}

.underline_div a:after{
	position:absolute;
	content:"";
	transition:all 0.5s;
	left:0;
	bottom:0;
	width:0;
	height:2px;
	background: #558277;
}

.underline_div a:hover{
	text-decoration:none;
	color: #558277;
}

.underline_div a:hover:after{
	width:100%;
}

.view_our_gallery{
	letter-spacing:2px;
	text-transform: uppercase;
	font-size: 15px;
    font-weight: 600;
	
}

@media all and (min-width: 992px) {
	.navbar .nav-item .dropdown-menu{ display: none; }
	.navbar .nav-item:hover .nav-link{ color: #fff;  }
	.navbar .nav-item:hover .dropdown-menu{ display: block; }
    .navbar .nav-item .dropdown-menu{ margin-top:0; }
    
    
}	

.fas {
    color: #fff;
}

.logo-div {
    margin-left: auto;
margin-right: auto;
left: 0;
right: 0;
text-align: center;
top: 30%;

}

.img3 {
width: 350px;
}

.head2 {
    font-size: 50px;
    color: #558277;
    text-align: center;
    margin-bottom: 20px;
	font-family: 'Vollkorn', serif;
	letter-spacing:2px;
}
.head2:lang(ar){
    font-family: 'Markazi Text', serif;
}

.img6 {
    display: block;
    margin-left: auto;
    margin-right: auto;
    width: 10%;
    margin-bottom: 20px;
}

.img4 {
    /*padding-right: 20px;*/
}

.my-header1 {
    height: 700px;
    width: 100%;
    position: relative;
    background: rgb(230, 43, 52);
}

.link{
    color:#cb4f2d;
    text-decoration: underline;
    background: #efefe7;
    padding-left: 16px;
    font-family: 'Raleway', sans-serif;
	transition: all 0.5s;
}

.link:hover{
	color:#558277;
}
.coll_link{
	letter-spacing: 2px;
    font-weight: 600;
    font-size: 15px;
}


header{
    background-image: url('../../images/library-services-bkgd-img.jpg');
}


.sec_title{
	color:white;
	text-align:center;
	margin-top:22px;
	/*font-family: 'Raleway', sans-serif;*/
	font-family: 'Vollkorn', serif;
	padding-top: 40px;
	letter-spacing: 2px;
	font-size: 50px;
}

.sec_title:lang(ar){
    font-family: 'Markazi Text', serif;
}

.img10{
    text-align:center;
    margin-top:10px;
    margin-bottom:20px;
}

.parent{
    position: relative;
    padding-bottom: 70px;
}

.section2-imgs{
    height: 260px;
    overflow: hidden;
}

.section3-imgs{
    overflow: hidden;
}
.search_div{
    background-color: #c05237;
    padding: 37px;
    color: #FFF;
    font-family: 'Vollkorn', serif;
    
}
.search_div:lang(ar){
    font-family: 'Markazi Text', serif;
}
.search{
    margin: auto;
    text-align: center;
}
.search .row{
    display: inline-flex;
}
.serach-box {
    border-radius: 20px;
    padding: 5px;
    border: none;
	font-family: 'Vollkorn', serif;
	letter-spacing: 0.3px;
	padding-left:5px;
}

.serach-box:lang(ar){
    font-family: 'Markazi Text', serif;
    padding-left: 0;
    padding-right: 5px;
}

.serach-box:focus, .serach-box1:focus, .serach-btn:focus, .serach-btn1:focus{
	outline: 0;
}

.serach-box::-webkit-input-placeholder { /* Edge */
	color: #c05237;
	font-family: 'Vollkorn', serif;
}

.serach-box:-ms-input-placeholder { /* Internet Explorer */
	color: #c05237;
	font-family: 'Vollkorn', serif;
}

.serach-box::placeholder {
	color: #c05237;
	font-family: 'Vollkorn', serif;
}

.serach-box:lang(ar)::-webkit-input-placeholder{
    font-family: 'Markazi Text', serif;
}
.serach-box:lang(ar):-ms-input-placeholder{
    font-family: 'Markazi Text', serif;
}
.serach-box:lang(ar)::placeholder{
    font-family: 'Markazi Text', serif;
}

.serach-box1::-webkit-input-placeholder { /* Edge */
	color: #ffffff8;
	text-transform: uppercase;
}

.serach-box1:-ms-input-placeholder { /* Internet Explorer */
	color: #ffffff8;
	text-transform: uppercase;
}

.serach-box1::placeholder {
	color: #ffffff8;
	text-transform: uppercase;
}


.serach-btn{
    padding: 5px;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    color:#c05237 ;
	background: #FFF;
    border: 1px solid #FFF;
    margin-left: 3px;
    padding-top: 6px;
	transition:all 0.5s;
}

.serach-btn:lang(ar){
    margin-right: 3px;
    margin-left: 0;
}

.serach-btn:hover, .serach-box:focus{
	background: #efefe7;
}
.sec3 .col-sm-6{
    padding:0;
}
.sec3 .row{
    margin:0;
}
.sec3Txt{
    padding:3rem 2rem;
    line-height: 2.3;
}
.sec3Txt span{
	letter-spacing:3px;
	text-transform:capitalize;
}
.sec3Txt h2{
	text-transform:capitalize;
}

.bg-color{
    background: #efefe7;
   
}

.title-h5{
    font-family: 'Vollkorn', serif;
    font-size: 28px; 
	letter-spacing: 2px;
}

.title-h5:lang(ar){
    font-family: 'Markazi Text', serif;
}

.width-half{
    width:50%;
    float:left;
    height:395px;
    
}

.width-half img{
    min-height:395px;
}
.img7{
    width: 612px;
    height: 397px;
}
.img8{
    width: 612px;
    height: 397px;
}
.serach-btn .fas {
    color:#c05237 ;
}

 .icon{
    margin-top: 10px;
}

.text-box{
    font-family: 'Raleway', sans-serif;
    font-size: 22px;
    font-weight: bold;
    margin-bottom: 15px;
}

.services_div{
	background-image:url('../../images/library-services-bkgd-img.jpg');min-height:500px;	
}

.services_box{
    background-color: #FFFFFF;
}

.services_box.full-height{
    height: 300px;
    padding-top:20%;
}
.services_box.half-height{
    height: 145px;
    margin-bottom: 10px;
    padding-top:5%;
}

.section3-imgs {
   
    overflow: hidden;
}

.donation{
	padding:24px 0 0px 0px;
    background-color: #558277;
    border-left: solid 70px #558277;
    border-right: solid 70px #558277;
}

.donation_div{
	background-image:url('../../images/donation.gif');
	height:220px; 
	background-size: contain;
	background-repeat:no-repeat;
}	
.section6text{
    padding-top: 60px;  
    color: #fff;
    font-family: 'Raleway', sans-serif;
    font-size: 22pt;
    font-weight: bold;
	letter-spacing:2px;
}

.section7text {
	Color: #9d9d9d;
    font-size: 16px;
	padding-top: 60px;
	transition:all 0.5s;
	text-transform:uppercase;
	letter-spacing:2px;
}

.underline_div .section7text:before{
	background:#9d9d9d;
}



.gallery-img{
    display: block;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 15px;
    width: 50%;
}
.gallery-link{
    color: #cb4f2d;
    font-family: 'Raleway', sans-serif;
    font-size: 20px;
    text-decoration: underline;
}

.footer_fb{
    float: right;
}

.footer_fb:lang(ar){
    float: left;
}

.section5-imgs{
    margin-left: 150px;
    overflow: hidden;
}

.section5-imgs:lang(ar){
    margin-left: 0;
    margin-right: 150px;
}


.bg-color.text-right{
    padding-right:15px;
}


.bg-color.text-left{
    padding-left:15px;
}


.khaldyyah-section {
    /*font-family: 'Open Sans', sans-serif;*/
   
}

footer{
    background-color: #29413e;
    margin-top: 2rem;
}


.footer_search{
	margin-top: 25px;
}

footer .fas {
    color: #9ca7a6;
}

.lines hr{
    float: right;
}
.lines hr:lang(ar){
    float: left;
}

.links {
    clear: both;
}

.contact-info{
    color: white;
    font-family: 'Raleway', sans-serif;
    padding-top: 50px;
    
}

.contact-info div{
	margin-bottom:15px;
}

.contact-info h6 {
    color: #9d9d9d;
    font-family: 'Raleway', sans-serif;
    padding-top: 50px;
    font-size: 13px;
	padding: 2px;
}

.contact-info h6 a{
	color:#9d9d9d;
}

.contact-info h4 {
    font-size: 12px;
    padding-bottom: 40px;
}

.serach-btn1{
    color:#29413e ;
    padding: 5px;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: #ffffff8a;
    border: none;
    line-height: 1;
}

button.serach-btn1 .fas {
    color: #29413e;
    font-size: 14px;
}

.serach-box1 {
    border-radius: 20px  ;
    padding: 5px;
    border: 2px solid;
    border-color: #d7dbdb;
    font-size: 11px;
    width: 70%;
    background: none;
	padding-left: 10px;
}


 footer hr { 
    display: block;
    margin-top: 1.5em;
    margin-bottom: 0.5em;
    margin-left: auto;
    margin-right: auto;
    border-style: inset;
    border-width: 1px;
    border-color: #9d9d9d
    
  } 
  .family{
      margin-bottom: 3rem;
  }

.khalidifamily{
    /*font-family: 'Open Sans', sans-serif;*/
   /* font-size: 13px;*/
}

.nav-toggle{
    text-decoration: underline;
    color: #cb4f2d;
    font-family: 'Raleway', sans-serif;
    font-size: 18px;
}

.footer_tag{
    color: #9d9d9d;
    font-size: 14px;
    font-family: 'Raleway', sans-serif;
    padding: 1px 0 3px 0;
}

.footer_tag a, .footer_tag .fab, .footer_tag .fab{
	color:#9d9d9d;
    margin-left: 5px;
}

.footer_tag .fab{
	font-size:19px;
}
.fbtag {
    
    padding-left: 840px;
}

.forthsec{
    min-height:300px; 
    width:100%;
    background-color:#c05237b0;
    padding:40px 80px;
}

.forthsec a{
    color: #212529;
}

@media(min-width:768px){
    .my-header.relative{
        position: relative;
    }
}

@media (max-width:767px){
    .donation {
        border: none;
    }

    .img1{
      
     width: 100%;
     height: auto;
        position: absolute;
        z-index: -22;
        top: 0;
    }
    .img3{
        width: 100px;
        margin-top: 50px;
    }
    .my-header{
        /*height: auto;*/
      
    }
    .my-header .my-navbar{
        z-index: 100;
    }
    .head2{
        font-size: 32px;
        color: #1c3e3a;
        text-align: center;
    }
    .section2-imgs{
        height:auto;
        overflow: hidden;
		margin-bottom: 15px;
    }
    .section2-imgs img{
        /*max-width: none;*/
    }
    .img-fluid {
         /*height: auto;
        padding-bottom: 20px;
    }

    .khaldyyah-section{
        margin-top: 40px;
        /*font-family: 'Open Sans', sans-serif;*/
    }
    .search_div {
        padding: 20px;
    }
    .serach-box {
        border-radius: 20px;
        padding: 5px;
        border: none;
        font-size: 14px;
	}
	.title-h5 {
		font-size: 17px;
	}
	.links {
		clear: both;
		text-align: center;
	}
	h2, h2 {
		font-size: 2rem;
		text-align: center;
	}
	.sec3Txt {
		padding: 1rem 1rem;
		line-height: 2;
		text-align: center!important;
	}
	.lines hr, .lines2 hr{
	   margin: auto !important;
	   float: none;
	}
	.sec_title {
		
		font-size: 25px;
	}
	.forthsec{
		padding: 30px 15px;
	}


	.text-box {
		font-size: 14px; 
	}
	.services_box.full-height {
		margin-bottom: 15px;
	}

	.family .head2{
		font-size: 32px;
		color: #1c3e3a;
		text-align: center;
		margin: 0;
		margin-bottom: 20px;
		padding-top: 15px;
	}
	.img6{
		/*margin-bottom: 0;*/
		width: initial;
		
	}
	.Khalidi-family-img{
		margin: auto;
	  
	}
	.section5-imgs {
		margin-left: 0px; 
        margin-right: 0px; 
		overflow: hidden;
		text-align: center;
		margin-bottom:15px;
	}
	.nav-toggle {
		font-size: 12px;
	}
	.gallery .head2{
		padding-top: 1px;
		/*margin-top: 30px;*/
	}
	.gallery-img {
		display: block;
		 margin-left: 0; 
		 margin-right: 0; 
		 width: 100%; 
	}
	.gallery-link {
		
		font-size: 19px;
	   
	}
	.contact-info h4{
		padding-bottom: 0;
	}
}
@media (min-width:768px)and (max-width:1024px){
 
	.img4{
		padding-right: 0;
	}

	.khaldyyah-section {
	   
		margin-top: 15px;
	}
	  .img8{

	max-width: 100%;

	}
	.text-box{
		font-size: 13px;
	}
	.icon {
		margin-top: 34px;
	}
	.family {
		
		margin-right: 75px;
	}
}

.slider_div{
	background-image: url("../../images/Hero_image-Khalidiyya_entrance.jpg");
	background-repeat: no-repeat;
	height:700px;
	background-size: cover;
}

@media (min-width:768px){
	.hidden-md{
		display:none !important;
	}
}
@media (max-width:767px){
	.hidden-sm{
		display:none !important;
	}
	
	.slider_div{
		height:300px;
		
	}
	.logo-div{
		top:5%;
	}
	.sec3 .row{
		margin-bottom:15px;
	}
	.donation_div{
		height: 165px;
	}
	
	.footer_tag{
		padding: 1px 0 7px 0;
	}
	
	.navbar-dark .navbar-toggler{
		border-color: rgb(255 255 255);
	}
}