:root {
 --pen-slider-gap: 10px;
 --pen-grab-color: #eeeeee;
 --pen-slider-border-radius: 10px;
}

/* Containers - START */

.wp-block-pen30-slider-block {
	max-width: 320px !important;
}

.be-slider-controls {
	padding-right: 0.9rem;
}

.wp-block-pen30-slider-block {
	/* max-width: 310px !important; */
}

.wp-block-pen30-slider-block {
	margin-top: 1rem;
}

.be-slider-container {
	padding: 1.1rem 1rem;
}

.be-slider-card-4-wrapper {
	flex: 0 0 100%;
	box-sizing: border-box;
	max-width: 256px;
	margin-left: 56px;
	margin-bottom: 20px;
}

.be-slider-card-4-wrapper:first-of-type {
	margin-left: 0px;
}

/* Containers - END */

/* Arrows - START */
.be-slider-controls {
	display: flex;
	justify-content: flex-end;
	align-items: center;
	gap: 10px;
	margin-bottom: 15px;
	padding-right: 3.0rem;
}
.be-slider-arrow-left, .be-slider-arrow-left::after, .be-slider-arrow-right, .be-slider-arrow-right::after {
	transition: transform 200ms ease-in-out, box-shadow 200ms ease-in-out;
}

.be-slider-arrow-left {
	display: inline-block;
	text-align: center;
	height: 25px;
	width: 25px;
	border: 2px solid black;
	border-radius: 25px;
	margin-right: 15px;
}

.be-slider-arrow-right {
	display: inline-block;
	text-align: center;
	height: 25px;
	width: 25px;
	border: 2px solid black;
	border-radius: 25px;
	/* margin-right: 20px; */

}

/* Arrows - END */

/* General Content - START */
a.be-slider-card-4 {
	transition: transform 0.2s ease-in-out, box-shadow 200ms ease-in-out;
}

.be-slider-card-4 {
	/* box-shadow: 3px 6px 16px 0 #44444433; */
	box-shadow: 0.2rem 0.4rem 1rem 0 #44444433;
	flex-grow: 1;
	display: flex;
	flex-direction: column;
	/* height: auto; */
	height: 100%;
}

.be-slider-card-4:hover {
	box-shadow: 0rem 0rem 1rem #44444433;
}

a.be-slider-card-4:link,
a.be-slider-card-4:visited,
a.be-slider-card-4:hover,
a.be-slider-card-4:active {
	text-decoration: none !important;
}

.card-img {
	width: 100%;
	height: auto;
	flex-shrink: 0;
}

/* General Content - END */


/* Slider Style One - START */
/* Slider Style One - ARROWS - START */

.is-style-slider-style-one .be-slider-arrow-left, .is-style-slider-style-one .be-slider-arrow-right {
	width: 2.5rem;
	height: 2.5rem;
	background: none;
	border: 3px solid var( --wp--preset--color--pen-gray-01 );
	cursor: pointer;
}
.is-style-slider-style-one .be-slider-arrow-left:hover, .is-style-slider-style-one .be-slider-arrow-right:hover {
	border: 3px solid white;
}

.is-style-slider-style-one .be-slider-arrow-left svg, .is-style-slider-style-one .be-slider-arrow-right svg {
	fill: var( --wp--preset--color--pen-gray-01 );
	color: var( --wp--preset--color--pen-gray-01 );
	margin-top: 4px;
}
.is-style-slider-style-one .be-slider-arrow-left:hover svg, .is-style-slider-style-one .be-slider-arrow-right:hover svg {
	fill: white;
}
/* Slider Style One - ARROWS - END */
/* Slider Style One - Cards - START */

.is-style-slider-style-one .be-slider-card-4 {
	display: flex;
	flex-direction: column;
	background-color: white;
	box-sizing: border-box;
	border-radius: var( --pen-slider-border-radius );

}

.is-style-slider-style-one .card-img {
	order: 1;
	border-top-left-radius: var( --pen-slider-border-radius );
	border-top-right-radius: var( --pen-slider-border-radius );
	border-bottom-left-radius: 0px;
	border-bottom-right-radius: 0px;
	object-fit: cover;
	object-position: center center;
}


.is-style-slider-style-one .card-line-decor {
	order: 2;
	height: 3px;
	width: 60px;
	margin-left: 30px;
	background-color: var( --wp--preset--color--pen-red-new );
}

.is-style-slider-style-one .card-subtitle {
	order: 3;
	color: var( --wp--preset--color--pen-red-new );
	text-transform: capitalize;
	font-size: 1.0rem;
	font-weight: 700;
	padding: 20px 20px 5px;
}

.is-style-slider-style-one .card-title {
	order: 4;
	font-size: 1.8rem;
	font-weight: 500;
	padding: 10px 20px 10px;
	line-height: 2rem;
	color: var( --wp--preset--color--pen-text-primary );
}

.is-style-slider-style-one .card-link {
	order: 5;
	padding: 20px 20px 30px;
	text-decoration: none;
	color: var( --wp--preset--color--pen-red-new );
	font-weight: 700;
}

.is-style-slider-style-one .card-link-arrow {
	fill: var( --wp--preset--color--pen-red-new );
	display: inline-block;
	transition: transform 0.2s ease-in-out;
	position: relative;
	top: 2px;
	left: 5px;
}

.is-style-slider-style-one .card-img-id {
	order: 5;
	display: none !important;
}

.is-style-slider-style-one a.be-slider-card-4:hover {
	transform: translateY( -3px );
}

.is-style-slider-style-one a.be-slider-card-4:hover .card-link-arrow {
	transform: translateX( 5px );
}

/* Slider Style ONE - Cards - END */
/* Slider Style ONE - END */


/* Slider Style TWO - START */



/* Slider Style Two - ARROWS - START */
.is-style-slider-style-two .be-slider-arrow-left, .is-style-slider-style-two .be-slider-arrow-right {
	width: 2.5rem;
	height: 2.5rem;
	background: none;
	border: 3px solid var( --wp--preset--color--pen-red-new );
	cursor: pointer;
}
.is-style-slider-style-two .be-slider-arrow-left:hover, .is-style-slider-style-two .be-slider-arrow-right:hover {
	border: 3px solid var( --wp--preset--color--pen-red-muted );
}

.is-style-slider-style-two .be-slider-arrow-left svg, .is-style-slider-style-two .be-slider-arrow-right svg {
	/* fill: var( --wp--preset--color--pen-red-new ); */
	color: var( --wp--preset--color--pen-red-new );
	margin-top: 4px;
}
.is-style-slider-style-two .be-slider-arrow-left:hover svg, .is-style-slider-style-two .be-slider-arrow-right:hover svg {
	/* fill: var( --wp--preset--color--pen-red-muted ); */
	color: var( --wp--preset--color--pen-red-muted );

}
/* Slider Style TWO - ARROWS - END */

/* Slider Style TWO - Cards - END */

.is-style-slider-style-two .be-slider-card-4 {
	display: flex;
	flex-direction: column;
	background-color: white;
	box-sizing: border-box;
	border-radius: var( --pen-slider-border-radius );
	padding: 2.5rem 0.7rem;
}

.is-style-slider-style-two .card-img {
	order: 1;
	border-top-left-radius: var( --pen-slider-border-radius );
	border-top-right-radius: var( --pen-slider-border-radius );
	border-bottom-left-radius: 0px;
	border-bottom-right-radius: 0px;
	object-fit: cover;
	object-position: center center;
}

.is-style-slider-style-two .card-line-decor {
	display: none;
	order: 99;
	height: 3px;
	width: 60px;
	margin-left: 30px;
	background-color: var( --wp--preset--color--pen-red-new );
}

.is-style-slider-style-two .card-subtitle {
	display: none;
	order: 99;
	color: var( --wp--preset--color--pen-red-new );
	text-transform: capitalize;
	font-size: 1.0rem;
	font-weight: 700;
	padding: 20px 20px 5px;
}

.is-style-slider-style-two .card-title {
	order: 4;
	/* font-size: 1.8rem; */
	font-size: 1.0rem;
	font-weight: 700;
	padding: 10px 20px 10px;
	line-height: 2rem;
	color: var( --wp--preset--color--pen-text-primary );
	text-align: center;
}

.is-style-slider-style-two .card-link {
	order: 5;
	padding: 20px 20px 30px;
	text-decoration: none;
	color: var( --wp--preset--color--pen-red-new );
	font-weight: 700;
	text-align: center;
}

.is-style-slider-style-two .card-link-arrow {
	fill: var( --wp--preset--color--pen-red-new );
	display: inline-block;
	transition: transform 0.2s ease-in-out;
	position: relative;
	top: 2px;
	left: 5px;
}

.is-style-slider-style-two .card-img-id {
	order: 5;
	display: none !important;
}

.is-style-slider-style-two a.be-slider-card-4:hover {
	transform: translateY( -3px );
}

.is-style-slider-style-two a.be-slider-card-4:hover .card-link-arrow {
	transform: translateX( 5px );
}
/* Slider Style TWO - Cards - END */
/* Slider Style TWO - END */

/* Slider Style Three - START */
.is-style-slider-style-three .be-slider-card-4 {
	display: flex;
	flex-direction: column;
	padding: 10px;
	box-sizing: border-box;
	border: 2px solid rgb(0, 31, 199);
	border-radius: 25px;
}

/* Slider Style Three - END */


/* Extra Extra Small devices XXS */
@media (min-width: 200px) {
	.be-slider-controls {
		padding-right: 1.0rem;
	}
}

/* Extra Small devices XS */
@media (min-width: 350px) {
	.be-slider-controls {
		padding-right: 1.6rem;
	}
}

/* Small devices (landscape phones) */
@media (min-width: 576px) {
	.wp-block-pen30-slider-block {
		max-width: 550px !important;
	}

	.be-slider-controls {
		padding-right: 0.9rem;
	}

	.be-slider-card-4-wrapper {
		flex: 0 0 50%;
		box-sizing: border-box;
		max-width: 240px;
		margin-left: 26px;
	}

	/* .is-style-slider-style-two .be-slider-card-4-wrapper {
		flex: 0 0 50%;
		box-sizing: border-box;
		max-width: 264px;
		margin-left: 10px;
	} */
}

/* Medium devices (tablets) - Mobile Nav */
@media (min-width: 768px) {
	.wp-block-pen30-slider-block {
		max-width: 736px !important;
	}

	.be-slider-controls {
		padding-right: 1.1rem;
	}

	.be-slider-card-4-wrapper {
		/* flex: 0 0 50%; */
		flex: 0 0 50%;
		box-sizing: border-box;
		max-width: 333px;
		margin-left: 30px;
	}

	/* .is-style-slider-style-two .be-slider-card-4-wrapper {

		flex: 0 0 33%;
		box-sizing: border-box;
		max-width: 240px;
		margin-left: 2px;

	} */
}

/* Large devices (desktops) - Desktop Nav */
@media (min-width: 992px) {
	.wp-block-pen30-slider-block {
		/* max-width: 768px !important; */
		max-width: 940px !important;
	}

	.be-slider-controls {
		padding-right: 1.1rem;
	}

	.be-slider-card-4-wrapper {
		flex: 0 0 33%;
		box-sizing: border-box;
		max-width: 282px;
		margin-left: 25px;
	}

	/* .is-style-slider-style-two .be-slider-card-4-wrapper {
		flex: 0 0 33%;
		box-sizing: border-box;
		max-width: 245px;
		margin-left: 10px;
	} */

}

/* Extra large devices (large desktops) */
@media (min-width: 1200px) {
	.wp-block-pen30-slider-block {
		/* max-width: 992px !important; */
		max-width: 1150px !important;
	}

	.be-slider-controls {
		padding-right: 1.5rem;
	}

	.be-slider-card-4-wrapper {
		flex: 0 0 25%;
		box-sizing: border-box;
		max-width: 256px;
		margin-left: 25px;
	}

	/* .is-style-slider-style-two .be-slider-card-4-wrapper {
		flex: 0 0 25%;
		box-sizing: border-box;
		max-width: 235px;
		margin-left: 10px;
	} */
}

/* Extra large devices (extra-large desktops) */
@media (min-width: 1400px) {
	.wp-block-pen30-slider-block {
		max-width: 1350px !important;
		margin-left: auto;
		margin-right: auto;
		overflow: hidden;
	}

	.be-slider-controls {
		padding-right: 1.2rem;
	}

	.be-slider-card-4-wrapper {
		flex: 0 0 25%;
		box-sizing: border-box;
		max-width: 302px;
		margin-left: 30px;
	}

	/* .is-style-slider-style-two .be-slider-card-4-wrapper {
		flex: 0 0 25%;
		box-sizing: border-box;
		max-width: 330px;
		margin-left: 33px;
	} */
}

/* Extra EXTRA large devices (XXL desktops) */
@media (min-width: 1600px) {
	.wp-block-pen30-slider-block {
		max-width: 1510px !important;
		margin-left: auto;
		margin-right: auto;
		overflow: hidden;
	}

	.be-slider-controls {
		padding-right: 1.5rem;
	}

	.be-slider-card-4-wrapper {
		flex: 0 0 25%;
		box-sizing: border-box;
		max-width: 333px;
		margin-left: 40px;
	}

	/* .is-style-slider-style-two .be-slider-card-4-wrapper {
		flex: 0 0 25%;
		box-sizing: border-box;
		max-width: 330px;
		margin-left: 33px;
	} */
}


/* =========================================
 * 2-Card Slider Overrides (is-two-card)
 * ========================================= */

.is-two-card .card-img {
	width: 100%;
	max-width: 400px;
	max-height: 400px;
	aspect-ratio: 1 / 1;
	object-fit: cover;
	object-position: center center;
	margin-left: auto;
	margin-right: auto;
	display: block;
}

.is-two-card .be-slider-card-4 {
	padding: 25px;
}

/* Small devices (landscape phones) */
@media (min-width: 576px) {
	.is-two-card .be-slider-card-4-wrapper {
		flex: 0 0 50%;
		box-sizing: border-box;
		max-width: 240px;
		margin-left: 26px;
	}
}

/* Medium devices (tablets) - Mobile Nav */
@media (min-width: 768px) {
	.is-two-card .be-slider-card-4-wrapper {
		flex: 0 0 50%;
		box-sizing: border-box;
		max-width: 333px;
		margin-left: 30px;
	}
}

/* Large devices (desktops) - Desktop Nav */
@media (min-width: 992px) {
	.is-two-card .be-slider-card-4-wrapper {
		flex: 0 0 50%;
		box-sizing: border-box;
		max-width: 425px;
		margin-left: 25px;
	}
}

/* Extra large devices (large desktops) */
@media (min-width: 1200px) {
	.is-two-card .be-slider-card-4-wrapper {
		flex: 0 0 50%;
		box-sizing: border-box;
		max-width: 530px;
		margin-left: 25px;
	}
}

/* Extra large devices (extra-large desktops) */
@media (min-width: 1400px) {
	.is-two-card .be-slider-card-4-wrapper {
		flex: 0 0 50%;
		box-sizing: border-box;
		max-width: 625px;
		margin-left: 30px;
	}
}

/* Extra EXTRA large devices (XXL desktops) */
@media (min-width: 1600px) {
	.is-two-card .be-slider-card-4-wrapper {
		flex: 0 0 50%;
		box-sizing: border-box;
		max-width: 695px;
		margin-left: 40px;
	}
}


/* =========================================
 * 3-Card Slider Overrides (is-three-card)
 * ========================================= */

.is-three-card .card-img {
	width: 100%;
	max-width: 350px;
	max-height: 350px;
	aspect-ratio: 1 / 1;
	object-fit: cover;
	object-position: center center;
	margin-left: auto;
	margin-right: auto;
	display: block;
}

.is-three-card .be-slider-card-4 {
	padding: 20px;
}

/* Small devices (landscape phones) */
@media (min-width: 576px) {
	.is-three-card .be-slider-card-4-wrapper {
		flex: 0 0 33.333%;
		box-sizing: border-box;
		max-width: 200px;
		margin-left: 20px;
	}
}

/* Medium devices (tablets) - Mobile Nav */
@media (min-width: 768px) {
	.is-three-card .be-slider-card-4-wrapper {
		flex: 0 0 33.333%;
		box-sizing: border-box;
		max-width: 260px;
		margin-left: 25px;
	}
}

/* Large devices (desktops) - Desktop Nav */
@media (min-width: 992px) {
	.is-three-card .be-slider-card-4-wrapper {
		flex: 0 0 33.333%;
		box-sizing: border-box;
		max-width: 320px;
		margin-left: 25px;
	}
}

/* Extra large devices (large desktops) */
@media (min-width: 1200px) {
	.is-three-card .be-slider-card-4-wrapper {
		flex: 0 0 33.333%;
		box-sizing: border-box;
		max-width: 400px;
		margin-left: 25px;
	}
}

/* Extra large devices (extra-large desktops) */
@media (min-width: 1400px) {
	.is-three-card .be-slider-card-4-wrapper {
		flex: 0 0 33.333%;
		box-sizing: border-box;
		max-width: 450px;
		margin-left: 30px;
	}
}

/* Extra EXTRA large devices (XXL desktops) */
@media (min-width: 1600px) {
	.is-three-card .be-slider-card-4-wrapper {
		flex: 0 0 33.333%;
		box-sizing: border-box;
		max-width: 500px;
		margin-left: 35px;
	}
}
