.flexslider {
	margin: 0 auto;
	background: #fff;
	border: none;
	position: relative;
	max-width: 2400px; /*3.1.23*/

}

.Banner-Overlay
{
	position: absolute;
	left: 10%;
	display: block;
	padding-top: 30px;
}

/*
 * This is Button added in the banner view and style modified here.
 * */
.See-More-Overlay-Button
{
	position: absolute;
	font-weight: 700;
	color: white;
	font-size: 20px;
	text-transform: uppercase;
	padding: 10px 10px;
	border-style: solid;
	border-width: medium;
	border-color: rgba(153, 0, 0, 1);
	background-color: rgba(153,0,0,1);
}

.See-More-Overlay-Button::after
{
	content:"\f105";
	font-family: FontAwesome;
	font-size 1.5vw;
	padding-left: 0.7vw;
	line-height: 1;
}

.See-More-Overlay-Button:hover
{
	background-color: rgba(153,0,0,0);
	border-style: solid;
	border-width: medium;
	border-color: white;
}

/*
 * This is the overlay text
 * */
.Banner-Overlay-Text
{
	font-weight: 900;
	color: white;
	font-size: clamp(1.4em, 3vw, 3em);
	padding: 0vw 0vw;
	display: block;
	max-width: 600px;
	line-height: 1.2em;
	overflow:hidden;
	text-overflow: ellipsis;
	padding-bottom: 10px;
}

.Banner-Overlay-Text-Linked
{
	font-weight: 900;
	color: white;
	font-size: clamp(1.4em, 3vw, 3em);
	padding: 0vw 0vw;
	display: none;
	max-width: 600px;
	line-height: 1.2em;
	overflow:hidden;
	text-overflow: ellipsis;
	padding-bottom: 10px;
}


.Banner-Overlay-Text-Secondary
{
	font-weight: 500;
	color: white;
	padding: 0vw 0vw;
	display: block;
	display: -webkit-box;
	max-width: 400px;
	overflow:hidden;
	text-overflow: ellipsis;
}

.Banner-Overlay-Text-Secondary > p{
	font-size: 1.2em !important;
	line-height: 1.2em !important;
	font-weight: Effra-He;
}

/*This is the oerlay gradient(shadow area)*/
.banner-gradient-overlay{
	position: absolute;
	background-image: url('https://www.stonybrook.edu/commcms/_resources/images/bkg/left-gradient.png');
	display: block;
	opacity: 1;
	width: 100%;
	background-repeat:repeat-y;
}

.Banner-Image-Wrapper {
	background-size: contain;
	width: 100%;
	float: left;
	background-repeat: no-repeat;
	background-position: right top;
	margin-top: 0px;
}

.banner-gradient-overlay {
	height: 0;
	padding-top: 28.57142857%;
}

.front-page-slideshow-block-background {
	background-color: black;
}

/* added by kazi 05/31/2023 for second banner image on smaller screens */
.views-field.views-field-field-bannerimage2 {
	display: none;
}

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

	.views-field.views-field-field-image {
		display: none;
	}

	.views-field.views-field-field-bannerimage2 {
		display: block;
	}

	.banner-gradient-overlay {
		padding-top: 0%;
	}

}

@media only screen and (max-width: 640px) {
	.Banner-Image-Wrapper img {
		min-height: 200px;
		object-fit: cover;
	}

}