.sonoma-banner {
   border-radius: 120px;
   background: url('/global/banners/2023-09-sonoma-initial/bg.jpg') no-repeat center center;
   background-size: cover;
   background-color: #F36D20;
   background-color: color(display-p3 0.953 0.427 0.125);
   text-align: center;
   overflow: hidden !important;
   padding: 10px 10px 2px 10px;
   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 0 #fff, 0 0 0 1px rgba(255,255,255,0);
} 

.sonoma-banner h2 {
	font-size: 38px;
	line-height: 42px;
	font-weight: 300;
	margin-left: 30px;
}


.sonoma-banner .check {
	position: absolute;
	left: 10px;
	top: 10px;
	width: 88px;
	height: 88px;
	transition: all 200ms ease;
}
  
.sonoma-banner .icons {
	position: relative;
	left: -20px;
	-webkit-transition: all 300ms ease;
	-moz-transition: all 300ms ease;
	-o-transition: all 300ms ease;
	transition: all 300ms ease;
} 

.sonoma-banner .text {
	position: relative;
	left: -12px;
} 
  

@media (max-width: 890px) {
	.sonoma-banner {
		padding: 10px 30px;
		border-radius: 40px;
	}
	
	.sonoma-banner .check {
		width: 56px;
		height: 56px;
	}
	
	.sonoma-banner h2 {
		font-size: 24px;
		line-height: 28px;
		margin: 0;
	}

	.sonoma-banner .text, .sonoma-banner .icons {
		position: relative;
		left: 0;
	} 
	
}

@media (max-width: 590px) {
	.sonoma-banner .check {
		display: none;
	}
}

@media (max-width: 350px) {
	.sonoma-banner {
		padding: 10px 15px;
		border-radius: 30px;
	}
	
	.sonoma-banner h2 {
		font-size: 22px;
		line-height: 24px;
		margin: 0;
	}
}

.sonoma-banner:hover {
	
	box-shadow: 0 0 14px 7px rgba(236, 103, 96, 0.5) inset;
	 transform: scale(1,1);
	 
	-webkit-transition: all 100ms ease;
	-moz-transition: all 100ms ease;
	-o-transition: all 100ms ease;
	transition: all 100ms ease;
}

.sonoma-banner:hover .check {
	
	 transform: scale(1.21,1.21) rotate(-360deg);
	 
	-webkit-transition: all 300ms ease;
	-moz-transition: all 300ms ease;
	-o-transition: all 300ms ease;
	transition: all 300ms ease;
}

.sonoma-banner:hover .icons {
	
	 transform: scale(1.05,1.05);
	 
	-webkit-transition: all 300ms ease;
	-moz-transition: all 300ms ease;
	-o-transition: all 300ms ease;
	transition: all 300ms ease;
}

.sonoma-banner:active {

	box-shadow: 0 0 0 10px #ec6760 inset;
	transform: scale(1,1);
	 
	-webkit-transition: all 100ms ease;
	-moz-transition: all 100ms ease;
	-o-transition: all 100ms ease;
	transition: all 100ms ease;
}
