.swiper {
    margin: 10px 30px;
				padding-left:70px 20px 20px 20px!important;

}

.swiper-slide{
    background:none;
    overflow:visible;
	   box-shadow:0 0px 0px rgba(0,0,0,0)!important;

}

/* ---------- Flip Card ---------- */

.flip-card{
    width:100%;
    height: 380px!important;
    perspective:1500px;
}

.flip-card-inner{
    position:relative;
    width:100%;
    height: 380px!important;
    transition:transform .8s;
    transform-style:preserve-3d;
}

.swiper-slide:hover .flip-card-inner{
    transform:rotateY(180deg);
}

/* ---------- Front / Back ---------- */

.flip-front,
.flip-back{

    position:absolute;
    inset:0;

    border-radius:16px;
    overflow:hidden;

    backface-visibility:hidden;
    -webkit-backface-visibility:hidden;

    box-shadow:0 5px 10px rgba(0,0,0,.3);
}

/* ---------- FRONT ---------- */

.flip-front{

    background:#000;

}

.flip-front img{

    width:100%;
 
    object-fit:cover!important;
    display:block;
	    aspect-ratio: 4/3!important;
    object-fit: cover;

    transition: transform 0.3s ease;

}

.title-overlay{

    position:absolute;
    left:0;
    right:0;
    bottom:0;

    padding:35px 50px 20px 50px;


}

.title-overlay h5{

    color:#fff;
    font-size:2em!important;
    line-height:1.4!important;
    margin:0;
	text-align: center!important;

}

/* ---------- BACK ---------- */

.flip-back{

    transform:rotateY(180deg);

    background:#fff;

    display:flex;
    flex-direction:column;
    justify-content:center;

 

    text-align:center;
	    padding:20px 40px;
    text-align: center;
    color: #1f3a69;
    background: #ffffff;
    border-top: 6px solid #00a7e1;

}

.flip-back h5{

    color:#153D75;
    font-size:30px!important;
	line-height:45px!important;
    margin-bottom:30px;
	text-align: center!important;

}

.flip-back p{

    color:#555;
    font-size:1rem;
    line-height:1.7;

}

.flip-back .post_info_date{

    color:#888;
    margin:15px 0;

}

/* ---------- Button ---------- */

.btn-news{

    display:inline-block;

    margin-top:20px;

    padding:15px 40px;

    border-radius:40px;

    background:#153D75;

    color:#fff;


    text-decoration:none;

    transition:.3s;
	font-size:18px!important;

}

.btn-news:hover{

    background:#0e2952;

}
		a .btn-news{}
.fall-back{  background-color: #1F3A69; }
		
		.mcps-flip-overlay{   position: absolute;
  inset: 0;
    background: linear-gradient(
    180deg,
    rgba(31, 58, 105, 0.05) 0%,
    rgba(31, 58, 105, 0.25) 40%,
    rgba(31, 58, 105, 0.85) 62%,
    #1f3a69 75%,
    #1f3a69 100%
    );}
		
		

<!--calendar CSS -->

	.swiper-button-prev,
.swiper-button-next {
    display: flex !important;
    z-index: 20;
	
}
* {
  box-sizing: border-box;
}

.swiper {
   
	padding-top: 40px;}
.newsSwier.swiper-pagination{top:60px!important;}
.slider-controls .swiper-pagination{position:relative!important;
top:auto!important; bottom:auto!important; width:100%; text-align:center;}
.event-card {
  position: relative;
  margin-left: 42px;
	margin-top: 30px;
    padding: 18px 8px 18px 50px;
  background: #fff;
  border: 1px solid #dfe5e9;
  border-radius: 16px;
  box-shadow: 0 8px 22px rgba(25, 45, 60, 0.08); 
	min-height:180px;
	    width: 90%;
	border-top: 6px solid #0285b6 !important;}


.event-date {

   position: absolute;
  top: -15px;
  left: -20px;
  width:64px!important;
	min-height:75px;
	z-index: 9999;
  padding: 12px 8px;
  text-align: center;
  border: 1px solid #cbdde7;
  border-radius: 10px;
  box-shadow: 0 5px 14px rgba(25, 45, 60, 0.12); 
border-top: 5px solid #1688b8;
  background-color: #f2f8fb!important;
}
.event-item {
    position: relative;
    padding-left: 5px;

}
.event-content {
  min-width: 0;
}
.event-date .day {
    color: #087fae;
    font-size: 2.1rem;
    font-weight: 700;
    line-height: 1;
	display: block;
}
.event-date .month {
    margin-bottom: 2px;
    color: #5f7887;
    font-size: 0.9rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
	display: block;
}

.event-card h3, .event-card h3 a {
  margin: 0 0 10px 0;
  color: #333;
  font-size:15px;
  line-height: 1.2em;
	font-weight:600;
}

.event-time span {

	    background-color: #f3f3f3 !important;
    padding: 3px 10px;
    border-radius: 0.3em;
    font-size: 12px;
}


.event-card a {
  color: #303030;

  font-size: 13px;
  text-decoration: none;
}
	.event-card p a{border-bottom: 0px; color:#5f7887!important; margin:10px 0 0 0!important;}
	
a.expand-colapse::after {
    flex-shrink: 0;
    width: var(--mdb-accordion-btn-icon-width);
    height: var(--mdb-accordion-btn-icon-width);
    margin-left: auto;
    content: "";
    background-image: url(data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%234f4f4f' stroke-linecap='round' stroke-linejoin='round'%3e%3cpath d='M2 5L8 11L14 5'/%3e%3c/svg%3e);
    background-repeat: no-repeat;
    background-size: var(--mdb-accordion-btn-icon-width);
    transition: var(--mdb-accordion-btn-icon-transition);
}
.event-card a:hover,
.event-card a:focus {
  text-decoration: underline;
}

.expand-icon{
    transition: transform .3s ease;
    font-size:.8rem;
    margin-left:.35rem;
}

.read-more:not(.collapsed) .expand-icon{
    transform: rotate(180deg);
}
	 p span.cal-event-time {margin:10px 0 5px 0;}
	p a .read-more {margin:0px ; border-bottom:0px!important; margin-bottom:0px!important;}
	p.more {margin-bottom:0px!important; margin-top:10px!important;}
	
	.cal-event-time {
    background-color: #fff !important;
    padding: 0px;
    border-radius: 0em;
		font-size: 12px;}
		
		.more span, .event-details {   background-color: #f3f3f3 !important; padding: 3px 10px;  border-radius: 0.3em;	font-size: 12px;}
.event-divider {   display: block;  width: 140px;  height: 1px;  margin: 10px 0px 15px 0; background: linear-gradient(
        to right,
        transparent,
        #d8dfe5,
        transparent;
	)}
	

.slider-controls {
    top: -5px !important;
}
.slider-controls h1 {text-align:center;}
.slider-controls {
    position: relative;
    z-index: 999;
padding-top:20px;
    margin: 0 auto;
   
}
.newsSwiper .slider-controls{max-width:600px!important;}
.calendarSwiper .slider-controls{max-width:540px!important;}
#slideCounter{ justify-content: center; font-size: 1em; display:none; visibility: hidden; text-align: center!important;}
.slider-controls .swiper-button-prev{position:absolute;left:15px; top:90%; transform:translateY(-50%); color: #087fae;     height: 35px;}
.slider-controls .swiper-button-next{position:absolute;right:-30px; top:90%; transform:translateY(-50%); z-index: 99999!important; color: #087fae;     height: 35px;}
.event-content h6{ margin-top:0!important;color:#5f7887
	}
.event-item {
   padding-left:0!important; 
}

@media (max-width: 650px) {
  .events-grid {
    grid-template-columns: 1fr;
  }

  .event-card {
    grid-template-columns: 48px 1fr;
    gap: 16px;
    min-height: auto;
    padding: 15px 10px 20px 26px;
  }

  .event-date {
    width: 48px;
    height: 54px;
  }
	.slider-controls {
    position: relative;
    z-index: 999;
    width: 350px!important;
    margin: 0 auto;
    top: 15px;
}
	.event-date {

   position: absolute;
  top: -25px;
		left: -40px;}
	.newsSwiper .slider-controls{max-width:420px!important;}
.calendarSwiper .slider-controls{max-width:420px!important;}
	h1.upcoming-events {  font-size: 30px!important;}
	#slideCounter{visibility: visible!important; width:100px; margin:10px auto; display:block!important;}
	.slider-controls h1 {font-size:20px!important;}
	.slider-controls .swiper-button-next  {right:0px!important;
top:50px!important; height:25px!important;}
	.slider-controls .swiper-button-prev{left:0px!important; top:50px!important; height:25px!important;}
	.swiper-slide-active{margin-right:25px!important;}
	

}

@media only screen and (max-width: 991.9px) {
	
	
.title-overlay h5{


    font-size:20px!important;
    line-height:30px!important;


}
	.title-overlay{    padding:10px;}
	.flip-back h5{


    font-size:18px!important;
	line-height:30px!important;
    margin-bottom:10px;


}
	.events-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}