/* =================================== */
/* Fickity Carousels - Slider with card style
/* =================================== */

.carousel-section .section-inner {
	padding-right: 0px !important;
	padding-left: 0px !important;
}

.main-carousel {
	width: 100%;
	margin: auto;
	padding: 0 3%;
}
.main-carousel  .white-panel {
	padding: 2rem !important;
	margin-bottom: 3rem;
}
.main-carousel  .white-panel h3 {
	padding-top: 1.5rem;
	font-size: 1.2em !important;
}
.main-carousel .fujitsu-btn {
	padding-top: -1rem;
	display: block;
}
.carousel-cell {
			width: 31%; /* half-width */
			height: auto; 
			margin-right: 3rem;
			transition: opacity 2s;
			  -webkit-transition: opacity 2s;
			  opacity: 1;
			  min-height: 100%;
			  background-clip: padding-box;
			  min-height: 64rem; 
		  }
	  .carousel-cell[aria-hidden="true"] {
		  opacity: 1;
	  }	
	  .carousel-cell[aria-hidden="true"] h3, .carousel-cell[aria-hidden="true"] p {
		  opacity: 1;
	  }
	  
.flickity-button-icon {
	fill: #222;
	}	  
	.flickity-button:hover .flickity-button-icon {
		fill: #e90085;
		}	  
.flickity-prev-next-button {
	top: 50%;
	width: 64px;
	height: 64px;
	border-radius: 50%;
	transform: translateY(-50%);
	}	
	.flickity-button {
		position: absolute;
		
		border: none;
		color: #333;
		}
		.flickity-button:hover {
			
			cursor: pointer;
			}
			.flickity-page-dots {
				position: relative;
				bottom: -15px;
				}
.flickity-page-dots .dot {
	background: #222;
	}
	
	.flickity-resize .carousel-cell {
		  min-height: 100%;
		}
		
	
@media screen and (max-width : 992px) {
		.main-carousel  .white-panel p {
			font-size: 0.9em !important;
		}
		.main-carousel  .white-panel h3 {
			font-size: 1.1em !important;
		}
		.carousel-cell {
				width: 31%; /* half-width */
				margin-right: 2rem;
				   min-height: 54rem; 
			  }
	}	
	@media screen and (max-width : 768px) {
			.carousel-cell {
					width: 100%; /* half-width */
					margin-right: 5rem;
				  }
				  .flickity-prev-next-button.previous {
					  left: -30px;
					  }
					  .flickity-prev-next-button.next {
						  right: -20px;
						  }
		}	
/* =================================== */
/* White panels
/* =================================== */

.white-panel {
    background: #fff;
    padding: 6rem;
}
.wrapper-3col .white-panel {
        padding: 4rem;
    }
.white-panel .article-type {
    font-size: 0.9em;
    padding-bottom: 1rem;
}
.white-panel .btn-outline {
    text-decoration: none !important;
    background: #fff;
    color: #ea0086 !important;
    border: #ea0086 solid 3px;
    font-weight: bold;
    padding: 8px 12px;
    margin-top: 1%;
    }

    .white-panel .btn-outline:hover {
        color: #2300b0 !important;
        text-decoration: underline !important;
        border: #2300b0 solid 3px;
    }

@media screen and (max-width : 992px) {
    .white-panel {
        padding: 3rem !important;
    }
}

#cardcarousel {
	background-size: cover;
	text-align: center;
	
}
#cardcarousel a {
	text-decoration: none !important;
}
#cardcarousel .white-panel:hover, #cardcarousel-grey .white-panel:hover  {
	box-shadow: 0 2rem 2rem rgba(0, 0, 0, 0.2);
}
#cardcarousel h2 {
		text-align: center;
		color: #fff;
	}
#cardcarousel h3, #cardcarousel h3 a, #cardcarousel-grey h3, #cardcarousel-grey h3 a {
		text-align: left;
		margin-top: 1.7rem;
		padding-bottom: 0rem;
		font-size: 1.3em;
		text-decoration: none !important;
	}
	#cardcarousel h3 a:hover, #cardcarousel-grey h3 a:hover  {
		text-decoration: underline;
	}
#cardcarousel  .white-panel p, #cardcarousel-grey .white-panel p {
	font-size: 0.9em;
	padding-bottom: 2rem;
	text-align: left;
}
#cardcarousel  .wrapper-3col, #cardcarousel-grey  .wrapper-3col  {
	margin-top: 4rem;
	text-align: left;
	grid-gap: 2rem;
	padding: 0rem 0rem !important;
	row-gap: 2rem;
}
#cardcarousel .white-panel, #cardcarousel-grey .white-panel  {
padding: 2rem;
transition: box-shadow 0.6s;
text-align: left;
position: relative;
padding-bottom: 6rem;
}
#cardcarousel .grey-panel {
	background: #f0eeee;
	position: relative;
	padding-bottom: 6rem;
}

#cardcarousel  .wrapper-2col {
	row-gap: 4rem;
}

#cardcarousel .c-btn,  #cardcarousel-grey .c-btn {
	  position: absolute;
	  bottom: 2rem;
	  left: 2rem;
  }

 #cardcarousel-grey h2 {
	 text-align: center;
	 /* padding-bottom: 6rem; */
 }