.ss53-banner {
   border-radius: 30px;
   background: url('/global/banners/202102-soundsource53/background.png') no-repeat center center;
   background-size: 930px 290px;
   text-align: left;
   overflow: hidden !important;
   height: 140px;
   padding: 0;
   margin: 0 0 0;
   width: 100%;
   color: #fff;
   
   -webkit-font-smoothing: antialiased;
   
   	-webkit-transition: all 300ms ease;
    -moz-transition: all 300ms ease;
    -o-transition: all 300ms ease;
    transition: all 300ms ease;
    
    opacity: 1;
    transform: scale(1,1);
    
    box-shadow: 0 0 0 1px rgba(255,255,255,0);
} 

.ss53-banner .images {
	width: 282px;
	height: 145px;
	overflow: hidden;
	background: url('/global/images/icons/256/soundsource@2x.png') no-repeat center -10px;
	background-size: 220px 220px;
}

.ss53-banner .sshot {
	vertical-align: middle;
	float: left;
	padding: 0;
	margin: -8px 15px 0 -5px;
	width: 350px;
	height: 215px;
	
	filter: drop-shadow(0px 0px 8px rgba(43,151,154,1));
	
	-webkit-transition: all 300ms ease;
	-moz-transition: all 300ms ease;
	-o-transition: all 300ms ease;
	transition: all 300ms ease;
} 

.ss53-banner .icon {
	position: absolute;
	left: 20px;
	top: -10px;
} 
  
     
.ss53-banner h3 {
	color: #fff;
	font-size: 61px;
	line-height: 60px;
	font-weight: 800;

	position: absolute;
	left: 280px;
	top: 25px;
	width: 600px;
	text-transform: uppercase;
}

.ss53-banner h4 {
	color: #333;
	font-size: 33px;
	line-height: 35px;
	font-weight: 400;
	margin: 0;
	padding: 0;
	
	position: absolute;
	left: 280px;
	top: 82px;
	width: 600px;
	
	text-shadow: 0 1px 20px #009C95;
}



@media (max-width: 631px) {
	
	.ss53-banner {
		text-align: center;
		margin: 10px 0 0;
		padding: 15px 30px;
		height: auto;
		border-radius: 40px;
		height: 270px;
	}
	
	.ss53-banner .images {
		margin: 0px auto;
		width: 282px;
		height: 171px;
		background-size: 170px 170px;
		display: inline-block;
	}
	
	.ss53-banner .icon {
		vertical-align: middle;
		margin: 0px auto 0px;
		float: none;
		top: 60px;
		left: 50%;
		transform: translate(-64px,0);
		
		width: 128px;
		height: 138px;
		
		-webkit-transition: all 300ms ease;
	    -moz-transition: all 300ms ease;
	    -o-transition: all 300ms ease;
	    transition: all 300ms ease;
	}
	
	.ss53-banner .sshot {
		vertical-align: middle;
		margin: 0px auto 0px;
		float: none;
		
		width: 262px;
		height: 161px;
		
		-webkit-transition: all 300ms ease;
	    -moz-transition: all 300ms ease;
	    -o-transition: all 300ms ease;
	    transition: all 300ms ease;
	}

	.ss53-banner .images {
		width: 100%;
		height: 161px;
	}
	
	.ss53-banner h3 {
   		margin: 0;
   		padding: 0;
   		font-size: 28px;
		line-height: 32px;
		clear: both;
		width: 100%;
		
		top: 170px;
		left: 0;
	}
	
	.ss53-banner h4 {
   		margin: 0 0 0;
   		padding: 0 20px 10px;
   		font-weight: 400;
   		clear: both;
   		width: 100%;
   		
   		font-size: 22px;
		line-height: 26px;
		top: 200px;
		left: 0;
	}
	
	.ss53-banner .zoom-new {
		display: none;
	}
	
}

/* Extra Small */
@media (max-width: 375px) {
	
	/* .ss53-banner {
		height: 290px;
	} */
	
	.ss53-banner h3 {
   		margin: 0;
   		padding: 0;
   		font-size: 28px;
		line-height: 28px;
		clear: both;
	}
}

.ss53-banner:hover {
	
	box-shadow: 0 0 0 15px #BDF3E1;
	 transform: scale(1,1);
	 
	-webkit-transition: all 100ms ease;
	-moz-transition: all 100ms ease;
	-o-transition: all 100ms ease;
	transition: all 100ms ease;
}

.ss53-banner:active {

	box-shadow: 0 0 0 20px #A8E1E9;
	transform: scale(0.99,0.99);
	 
	-webkit-transition: all 100ms ease;
	-moz-transition: all 100ms ease;
	-o-transition: all 100ms ease;
	transition: all 100ms ease;
}