/*** popup  csss start **/


 body.bodyFixed{ overflow:hidden;}

.opening-popup{text-align:center; overflow:hidden; position:fixed;  top:0; right:0; bottom:0; left:0; -webkit-overflow-scrolling:touch; outline:0; opacity: 0; -webkit-transition: opacity 0.15s linear, z-index 0.15; -o-transition: opacity 0.15s linear, z-index 0.15; transition: opacity 0.15s linear, z-index 0.15; z-index: -1; overflow-x:hidden; overflow-y: auto;}

.opening-popup-inner{transition: transform 0.3s ease-out; -moz-transition: transform 0.3s ease-out; -webkit-transition: 0.3s ease-out; width:60%; margin:1rem auto; max-width:100%; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); }


.modal-header{ display:flex; justify-content: space-between; padding:1.5rem 2rem; border-bottom: 1px solid #fbd4d5; gap:1rem; align-items:center;}
.modal-header .button-tag{ flex:1;}
.modal-header h5{  font-size:1.25rem; font-weight:700;  color:var(--blue); flex:6;}
.modal-header .applyButton{ color:#fff; padding:0.7rem 1rem; font-weight:600;  font-size:1rem; background:var(--black); border-radius: 0.3rem;  display:flex; justify-content:center; min-width:9rem;}

.modal-content h2,
.modal-content h3,
.modal-content h4,  
.modal-content h5,
.modal-content h6{color: var(--dc-primary);  margin-bottom:10px; font-size:20px; }
 
.modal-content h3 a{ color:red;}

.modal-content{ width:100%; background-color:#fff; outline:0; text-align:left; max-height:calc(100vh - 70px); overflow-y:auto; position:relative;  border-radius:7px;}
.modal-content .popup-content{height:500px; padding:2rem; overflow-y:auto;}
.modal-content .popup-content p{ /*padding-right: 20px;*/ margin-bottom:1rem; font-size:1rem; line-height:1.80rem;}
.modal-content .popup-content p a{color: #f44336;}
.modal-content .popup-content ul{list-style: none; margin: 0 0 20px; display: flex; flex-wrap: wrap; flex-direction: row; padding: 0;}
.modal-content .popup-content ul li{margin-bottom:1.25rem; width: 100%; font-size:1rem;  color: #333333; position:relative; padding-left:1.5rem;}
.modal-content .popup-content ul li:before { border-radius:100%; height: 0.80rem; width: 0.80rem; background: rgb(247,0,208); background: radial-gradient(circle, rgba(247,0,208,1) 0%, rgba(255,31,47,1) 15%, rgba(242,83,73,1) 25%, rgba(255,169,63,1) 35%, rgba(172,241,183,1) 45%, rgba(95,233,255,1) 55%, rgba(0,0,255,1) 75%); position: absolute; top:0.3rem; left:0; content: '';}
.close-btn {position: absolute;right: 20px;top: 20px;cursor: pointer;font-size: 50px;border: 0;background: transparent;z-index: 1000;border-radius: 100%;line-height: 40px;background: #fff;color: #333;
width: 40px;height: 40px;}

.model-open{z-index:99999; opacity:1; overflow:hidden;}
.model-open .bg-overlay{background: rgba(0, 0, 0, 0.8); z-index: 99;}
.model-open .opening-popup-inner{z-index: 999; }
.opening-popup-inner:after{border: double 5px transparent; background-image: linear-gradient(white, white), linear-gradient(90deg, rgba(241,0,215,1) 0%, rgba(255,31,47,1) 15%, rgba(242,83,73,1) 33%, rgba(255,169,63,1) 49%, rgba(179,214,118,1) 63%, rgba(0,134,202,1) 83%, rgba(0,0,255,1) 100%); background-origin: border-box; background-clip: content-box, border-box; position:absolute; left:0;  bottom:0; content:''; width:100%;
  border-radius:0px 0px 7px 7px;
} 


/*** popup  csss start **/


.bg-overlay{background:rgba(0, 0, 0, 0); height:100vh; width 100%; position:fixed; left:0; top:0; right:0; bottom:0; z-index: 0; -webkit-transition: background 0.15s linear; -o-transition: background 0.15s linear; transition: background 0.15s linear;}




@media (max-width:1199px) and (min-width:992px){

.opening-popup-inner{ width:80%;}

}



@media (max-width:991px) and (min-width:768px){

.opening-popup-inner{ width:80%;} 

}



@media screen and (max-width: 767px){

.opening-popup-inner{ width:90%;}
.modal-header { padding:1rem;}
.modal-content .popup-content{ padding:1rem;}
.modal-header h5{ font-size:18px;}
.modal-header .applyButton{  min-width:8rem;}
    
}