#popover-filter {
	position: fixed;
	background-color: rgba(0,0,0,0.8);
	width: 100%;
	left:0;
	top: 0;
	height: 100vh;
	z-index: 100000;
	justify-content: center;
	align-items: center;
	display: none;
    color: #00345b;
	font-family: 'ElMessiri' !important;
    direction: rtl !important;
    line-height: 1.8 !important;
}

#popover-filter img{
    max-width: 100%;
	height: auto !important;
}

#popover-main {
	box-sizing: border-box;
	width: 96%;
	max-height: 85vh;
	background: url("../../images/bg-body.png"), linear-gradient(#d2e7fa,#ffffff);
	margin-bottom: 6px;
	padding: 20px;
	-webkit-box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.2);
	-moz-box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.2);
	-o-box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.2);
	box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.2);
	position: relative;
	overflow: auto;
	display: flex;
	flex-direction: column;
	border-radius: 12px;
	}

#popover-menu {
	width: 100%;
	min-height: 50px;
	display: flex;
	justify-content: flex-end;
	align-items: flex-end;
}

#popover-menu a {
	border:thin dashed #00345bd1;
	border-radius: 25px;
	padding: 5px 20px;
	color: #00345bd1;
	font-size: 14px;
	transition: 0.4s all ease;
    text-decoration: none;
}	

#popover-menu a:hover {
	background-color: #00345bd1;
	color: #FFF;
	transition: 0.6s all ease;
}
#popover-cont {
	overflow: auto;
	flex-grow: 1;
	padding-right: 15px;
}


#popover-cont h1{
	color:#C92B68;
	color:#00345b;
	font-size: 1.3rem;
	font-weight: 400;
	border-bottom: thin dotted #00345bd1;
	padding-bottom: 20px;
	margin-bottom:30px;
}


#popover-cont h1>span:first-of-type{
    display: flex;
    align-items: center;
    margin-bottom: 10px;
}
#popover-cont h1>span:last-of-type{
    display: block;
    line-height: 1.5;
    padding-left:40px;
    
}

#popover-cont h1>span i{
    margin-right: 15px;
}

#popover-cont h2{
	color:#C92B68;
	border-bottom: thin dashed #C92B68;
	padding-bottom: 5px;
	margin: 20px 20px 10px 20px;
	border: none;
	font-weight: 400;
	font-size: 18px;
	text-align: justify;
	line-height: 1.5;
	
}

#popover-cont h2~span{
	display: block;
	margin-right: 20px;
	color:#C92B68;
	font-size: 1rem;
	margin-bottom: 20px;
	
}

#popover-cont h3{
	color:#458861;
	font-size: 18px;
	font-weight: 400;
	margin-bottom: 10px;
	margin-top: 15px;
	padding-left: 25px;
	background: url("../images/ico-green.png") no-repeat left top/18px auto;
}

#popover-cont p,
#popover-cont ul,
#popover-cont ol{
	font-size: 1rem;
	margin-bottom: 15px;
	line-height: 1.8;
	text-align: justify;
	padding-right: 20px;
	padding-left: 20px;
}
#popover-cont ul,
#popover-cont ol{
    padding-left: 20px !important;
}

#popover-cont h3~p,
#popover-cont h3~ul,
#popover-cont h3~ol {
	margin-left: 10px;
}




.popup-sep{

	border-bottom: thin dotted #C92B68;
	margin: 30px 10px;
}

#popover-cont::-webkit-scrollbar {
  width: 10px;
}

/* Track */
#popover-cont::-webkit-scrollbar-track {
  background: #0000090; 
}

/* Handle */
#popover-cont::-webkit-scrollbar-thumb {
  background: #888;
  border-radius: 20px;
}

/* Handle on hover */
#popover-cont::-webkit-scrollbar-thumb:hover {
  background: #555; 
}

#popover-cont .pop-imgs img{
	display: block;
	margin-bottom: 20px;
	border-radius: 6px;

}


blockquote {
	margin-left: 80px;
    text-align: justify;
    line-height: 1.7;
	font-size: 17px;
}


@media(min-width: 576px) {
    
 }
 @media(min-width: 768px) {
 }
 @media(min-width: 992px) {
    #popover-main {
        width: 80%;
        	max-height: 90vh;

     }
    #popover-cont h1{
        font-size: 24px;
     }
     #popover-cont>div {
	padding-left: 40px;
	padding-right: 40px;
}

     
     #popover-cont h3{
         margin-left: 40px;
     }
    #popover-cont p,
    #popover-cont ul,
    #popover-cont ol{
        font-size: 16px;
        text-align: justify;
    }
    #popover-cont ul,
    #popover-cont ol{
        margin-left: 1rem;
    }
    #popover-cont h3~p,
    #popover-cont h3~ul,
    #popover-cont h3~ol {
        margin-left: 100px;
    }
     #popover-cont>ol ol,
        #popover-cont>ol ul,
        #popover-cont>ul ul,
        #popover-cont>ul ol
        {
            margin-left: 10px !important;
        }
     
 #popover-cont .pop-imgs{
	display: flex;
	justify-content: space-between;
}

 #popover-cont .pop-imgs img{
	width: 49%;

}

     
     
     
}
 @media(min-width: 1200px) {
    
 }

 @media(min-width: 1400px) {
 }

