/**
 * Filename: style.css
 * Description:
 * User: Ahmed Gamal
 * Date: 8/3/2023
 */
.image_single_page{
	margin-top:50px;
	height:600px;
}
.image_single_page img{
	width:100%;
	height:100%;
	object-fit:cover;
}
.title-content-container{
	background-color: rgb(255,255,255,1);
    padding: 50px;
    margin-top: -125px;
    position: relative;
	    
}
.single-post{
	    margin-bottom: 100px;
}
.uni-gallery{
	margin-top:100px;
}
.title-content-container p{
	font-family: "Kufam";
    font-size: 20px;
   margin-top: 20px;
}
.gallery-list.list-group.list-group-flush{
	display: flex;
    flex-direction: row;
    flex-wrap: wrap;
}
.gallery-list.list-group.list-group-flush .gallery-item {
	width: calc( 25% - 10px );
    padding: 0;
    margin: 0 10px 10px 0;
    border: 1px solid #0b202d;

}
.gallery-list.list-group.list-group-flush .gallery-item img{
	width:100%;
	height:100%;
	object-fit:cover;
}
.gallery-item-popup {
	    position: fixed;
    width: 70%;
    height: 70%;
    top: 50%;
    background: red;
    transform: translate(-50%,-50%);
    left: 50%;
	z-index:999
}
.gallery-item-popup  img{
	width: 100%;
    height: 100%;
	object-fit: cover;
    object-position: top;
}
.overlay{
	    position: fixed;
    width: 100%;
    height: 100%;
    background: #000000a1;
    top: 0;
    z-index: 9;
    right: 0;
	visibility:hidden
}
.overlay.active{
	visibility:visible;
}
.close-popup{
	    position: absolute;
    width: 70px;
    height: 70px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #0b202d;
    color: white;
	cursor: pointer;
}
.gallery-item-popup.hide{
	display:none;
}
.gallery-item-popup.show{
	display:block;
}
.uni-gallery h4{
	    text-align: center;
    margin-bottom: 50px;
}
.single-post-container{display: flex;justify-content: space-between;}
.single-post-container .uni-content{width: 65%;}
.single-post-container .related-posts{
	order: 2;
    width: 30%;
    padding: 0 30px;
	margin-top: 50px;
}
.single-related{
	border-top: 3px solid #BFD583;
    padding: 15px;
}
.single-related:last-of-type{border-bottom: 3px solid #BFD583;}
.single-related .uni-tags{display: inline-block;padding-right: 0;list-style-type: none;margin-bottom: 0px;}
.single-related .uni-tags li a{
	background-color: #4FB3B3;
    color: #fff;
    padding: 7px;
	opacity: 0.6;
}
.single-related .related-head{
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.single-related .uni-tags li a:hover{color: #fff !important;}
.single-related .uni-date{display: inline-block;}
@media screen and (max-width: 1500px){
	.image_single_page{
		height:450px;
	}
}
