@import url("https://fonts.googleapis.com/css2?family=Lato:wght@100;300;400;700&display=swap");
@import url(https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css);
.whats-on-block, .venues-overview-block .boxes, .sponsors-list-block, .slider-block, .logos-block .logos, .icon-venue-block .iblock, .icon-block-block .iblock, .contact-block, .boxes-block .boxes {
max-width: 1180px;
width: 100%;
margin: 0 auto;
padding: 0 20px;
box-sizing: border-box;
}
.whats-on-block .events .event .content .col a {
padding: 7px 40px;
font-size: 20px;
text-transform: uppercase;
display: inline-block;
margin: 0 10px;
transition: all 0.3s ease-in-out;
border: 2px solid black;
color: black;
border-radius: 0;
background-color: white;
transition: all 0.3s ease-in-out;
}
.whats-on-block .events .event .content .col a:hover {
background-color: black;
color: white;
cursor: pointer;
}
:root {
--c-purple-light: #cdc9ec;
--c-yellow: #fff4df;
--c-line: #645c9c;
--c-blue: #18284a;
--c-mediumgrey: #c5c5c5;
--c-grey: #696f6e;
--c-fgrey: #323232;
--c-lightgrey: #f1f1f1;
--c-darkred: #a70009;
--c-red: #e5202a;
--c-dred: #b9151d;
--c-black: black;
--c-teal: #006c6c;
--c-gold: #c2b69d;
--c-lgold: #efebe5;
}
.dev {
background-color: red;
color: white;
position: absolute;
top: 0;
left: 0;
text-transform: uppercase;
padding: 10px 15px;
font-size: 14px;
z-index: 110;
}
[data-type="acf/boxes"] .boxes-block:after {
content: "";
width: 100%;
height: 100%;
position: absolute;
background-color: transparent;
z-index: 100;
top: 0;
}
.boxes-block {
position: relative;
}
.boxes-block .boxes {
position: relative;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}
.boxes-block .boxes .block {
background-color: var(--c-gold);
display: flex;
flex-wrap: wrap;
justify-content: center;
align-items: center;
margin: 0;
min-height: 135px;
transition: all 0.3s ease-in-out;
text-decoration: none;
width: 32.9%;
height: 360px;
position: relative;
overflow: hidden;
}
.boxes-block .boxes .block img {
width: 101%;
height: 101%;
object-fit: cover;
object-position: center;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
transition: all 0.3s ease-in-out;
}
.boxes-block .boxes .block p {
width: auto;
padding: 10px 15px;
box-sizing: border-box;
color: white;
text-transform: uppercase;
font-size: 20px;
position: absolute;
bottom: 15px;
left: 15px;
z-index: 1;
background-color: var(--c-red);
}
.boxes-block .boxes .block:hover {
background-color: var(--c-dred) !important;
cursor: pointer;
}
.boxes-block .boxes .block:hover img {
width: 105%;
height: 105%;
}
.boxes-block .boxes .block:nth-child(2n) {
background-color: var(--c-red);
width: calc(33% - 15px);
}
.wp-block-columns .boxes-block {
padding: 0;
}
.wp-block-columns .boxes-block .boxes {
padding: 0;
}
.wp-block-columns .boxes-block .boxes .block {
width: 48%;
margin: 0 0 15px;
}
.wp-block-columns .boxes-block .boxes .block:nth-child(even) {
background-color: var(--c-red);
width: 50%;
margin-left: 2%;
}
@media screen and (max-width: 844px) {
.boxes-block {
margin: 15px 0;
}
.boxes-block .boxes .block {
width: 100% !important;
margin-left: 0 !important;
margin-bottom: 15px;
}
}
[data-type="acf/contact"] .contact-block {
min-height: 38px;
background-color: #f7f7f7;
}
[data-type="acf/contact"] .contact-block:after {
content: "";
width: 100%;
height: 100%;
position: absolute;
background-color: transparent;
z-index: 100;
top: 0;
}
.contact-block form {
display: flex;
flex-wrap: wrap;
}
.contact-block form label {
width: 100%;
padding: 5px 0;
box-sizing: border-box;
}
.contact-block form label input {
display: inline-block;
box-sizing: border-box;
width: 100%;
border: 1px solid var(--c-mediumgrey);
padding: 10px;
}
.contact-block form label textarea {
display: inline-block;
box-sizing: border-box;
width: 100%;
border: 1px solid var(--c-mediumgrey);
padding: 10px;
}
.contact-block form [type=submit] {
background-color: var(--c-red);
color: white;
text-transform: uppercase;
padding: 10px 80px;
box-sizing: border-box;
border: none;
margin: 5px 0;
}
.wp-block-columns .contact-block {
padding: 0;
}
@media screen and (max-width: 844px) {
.contact-block form [type=submit] {
width: 100%;
}
}
.f-header {
background-color: var(--c-lgold);
}
.f-header .cont {
flex-wrap: wrap;
padding: 30px 20px;
}
.f-header .cont h1 {
font-size: 30px;
margin: 0;
padding: 0;
width: 100%;
display: inline-block;
}
.f-header .cont > p {
margin: 0;
padding: 5px 0 0;
width: 100%;
display: inline-block;
font-size: 18px;
}
.f-header .cont .col {
display: flex;
flex-wrap: wrap;
padding: 0 30px;
margin-top: 20px;
}
.f-header .cont .col p {
margin: 0;
padding: 3px 0;
width: 100%;
position: relative;
}
.f-header .cont .col p:first-child {
font-weight: 600;
}
.f-header .cont .col.first {
border-right: 2px solid var(--c-red);
max-width: 25%;
}
.f-header .cont .col.first p:first-child:before {
content: "";
width: 25px;
height: 25px;
background: transparent url(//www.petworthfestival.org.uk/wp-content/themes/petworth/images/calendar.svg);
background-size: 19px;
background-repeat: no-repeat;
background-position: center;
position: absolute;
left: -30px;
}
.f-header .cont .col.first p:last-child:before {
content: "";
width: 25px;
height: 25px;
background: transparent url(//www.petworthfestival.org.uk/wp-content/themes/petworth/images/location.svg);
background-size: 21px;
background-repeat: no-repeat;
background-position: center;
position: absolute;
left: -30px;
}
.f-header .cont .col.last {
width: 440px;
padding: 0;
margin-left: auto;
}
.f-header .cont a.btn {
padding: 10px 40px 11px;
text-decoration: none;
font-size: 20px;
color: white;
background-color: var(--c-gold);
transition: all 0.3s ease-in-out;
align-items: center;
text-transform: uppercase;
display: flex;
margin-right: 10px;
max-height: 29px;
margin-left: auto;
}
.f-header .cont a.btn.whats-on {
margin-left: auto;
}
.f-header .cont a.btn.book {
background-color: var(--c-red);
}
.f-header .cont a.btn:hover {
background-color: black;
}
@media screen and (max-width: 844px) {
.f-header .cont .col.first {
padding-left: 35px;
border: none;
border-bottom: 2px solid var(--c-red);
margin-top: 20px;
}
.f-header .cont .col.last {
padding: 0;
width: 100%;
}
.f-header .cont .col {
padding: 0 35px 10px;
margin-top: 10px;
}
.f-header .cont a.btn {
padding: 10px 0 11px;
margin: 0;
margin-bottom: 10px;
width: 100%;
text-align: center;
box-sizing: border-box;
display: inline-block;
}
}
[data-type="acf/hero"] .icon-block-block:after {
content: "";
width: 100%;
height: 100%;
position: absolute;
background-color: transparent;
z-index: 100;
top: 0;
}
.hero-block {
position: relative;
}
.hero-block img {
width: 100%;
height: 435px;
object-fit: cover;
object-position: center;
}
[data-type="acf/icon-block"] .icon-block-block:after {
content: "";
width: 100%;
height: 100%;
position: absolute;
background-color: transparent;
z-index: 100;
top: 0;
}
.icon-block-block {
position: relative;
}
.icon-block-block .iblock {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}
.icon-block-block .iblock .block {
background-color: var(--c-gold);
display: flex;
flex-wrap: wrap;
justify-content: center;
align-items: center;
min-height: 135px;
transition: all 0.3s ease-in-out;
text-decoration: none;
width: 32.9%;
}
.icon-block-block .iblock .block img {
width: 30%;
height: auto;
}
.icon-block-block .iblock .block p {
width: 70%;
padding: 15px;
box-sizing: border-box;
color: white;
text-transform: uppercase;
font-size: 20px;
}
.icon-block-block .iblock .block:hover {
background-color: var(--c-dred) !important;
cursor: pointer;
}
.icon-block-block .iblock .block:nth-child(odd) {
background-color: var(--c-red);
}
.icon-block-block .iblock .block:nth-child(3n+2) {
width: calc(33% - 15px);
}
.icon-block-block .iblock .block:nth-child(3n+4) {
margin-top: 15px;
}
.icon-block-block .iblock .block:nth-child(3n+5) {
margin-top: 15px;
}
.icon-block-block .iblock .block:nth-child(3n+6) {
margin-top: 15px;
}
.icon-block-block .iblock .block:nth-child(3n+7) {
margin-top: 15px;
}
.icon-block-block .iblock .block:nth-child(3n+8) {
margin-top: 15px;
}
.icon-block-block .iblock .block:nth-child(3n+9) {
margin-top: 15px;
}
.icon-block-block .iblock .block:nth-child(3n+10) {
margin-top: 15px;
}
.icon-block-block .iblock .block:nth-child(3n+11) {
margin-top: 15px;
}
.icon-block-block .iblock .block:nth-child(3n+12) {
margin-top: 15px;
}
.icon-block-block .iblock .block:nth-child(3n+13) {
margin-top: 15px;
}
.icon-block-block .iblock .block:last-child {
margin-bottom: 0;
}
.wp-block-columns .iblock {
padding: 0;
}
.wp-block-columns .iblock .block {
width: 100% !important;
margin-bottom: 15px !important;
margin-top: 0 !important;
}
@media screen and (max-width: 844px) {
.icon-block-block .iblock {
margin: 15px 0;
}
.icon-block-block .iblock .block {
width: 100% !important;
margin: 7px 0;
}
}
[data-type="acf/icon-block"] .icon-block-block:after {
content: "";
width: 100%;
height: 100%;
position: absolute;
background-color: transparent;
z-index: 100;
top: 0;
}
.icon-venue-block {
position: relative;
}
.icon-venue-block .iblock {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}
.icon-venue-block .iblock .block {
background-color: var(--c-gold);
display: flex;
flex-wrap: wrap;
justify-content: center;
align-items: center;
min-height: 135px;
transition: all 0.3s ease-in-out;
text-decoration: none;
width: 32.9%;
}
.icon-venue-block .iblock .block img {
width: 30%;
height: auto;
}
.icon-venue-block .iblock .block p {
width: 70%;
padding: 15px;
box-sizing: border-box;
color: white;
text-transform: uppercase;
font-size: 20px;
}
.icon-venue-block .iblock .block:hover {
background-color: var(--c-dred) !important;
cursor: pointer;
}
.icon-venue-block .iblock .block:nth-child(odd) {
background-color: var(--c-red);
}
.icon-venue-block .iblock .block:nth-child(2n) {
width: calc(33% - 15px);
}
.icon-venue-block .iblock .block:last-child {
margin-bottom: 0;
}
.wp-block-columns .iblock {
padding: 0;
}
.wp-block-columns .iblock .block {
width: 100% !important;
margin-bottom: 15px;
}
@media screen and (max-width: 844px) {
.icon-venue-block .iblock {
margin: 15px 0;
}
.icon-venue-block .iblock .block {
width: 100% !important;
margin: 7px 0;
}
}
.logos-block {
position: relative;
}
.logos-block .logos {
display: flex;
flex-wrap: wrap;
}
.logos-block .logos .item {
border: 1px solid var(--c-lightgrey);
position: relative;
width: calc(20% - 14px);
height: 185px;
margin: 7px 15px 7px 0;
}
.logos-block .logos .item img {
position: absolute;
width: 90%;
height: 90%;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
object-fit: contain;
object-position: center;
}
.logos-block .logos .item:nth-child(5n) {
margin-right: 0;
}
@media screen and (max-width: 844px) {
.logos-block .logos .item {
width: calc(50% - 10px);
}
.logos-block .logos .item:nth-child(2n) {
margin-right: 0;
}
.logos-block .logos .item:nth-child(5n) {
margin-right: auto;
}
}
.map-block {
position: relative;
}
.map-block #map {
width: 100%;
height: 435px;
}
.notification-block {
position: relative;
display: flex;
align-items: center;
justify-content: center;
text-align: center;
}
.notification-block .cont {
max-width: 760px;
flex-wrap: wrap;
padding: 30px 20px;
box-sizing: border-box;
}
.notification-block .cont h1 {
width: 100%;
margin: 0;
padding: 0;
color: var(--c-grey);
}
.notification-block .cont p {
width: 100%;
}
.notification-block .cont .date {
border: 2px solid var(--c-red);
width: 100%;
box-sizing: border-box;
padding: 15px;
}
.notification-block .cont .date h2 {
color: var(--c-red);
font-size: 21px;
width: 100%;
display: inline-block;
margin-top: 0;
padding-top: 0;
font-weight: 600;
}
.notification-block .cont .date p {
color: var(--c-red);
width: 100%;
display: inline-block;
padding: 0;
margin: 0;
line-height: 21px;
font-size: 16px;
}
[data-type="acf/slider"] .slider-block .slick-dots {
height: 20px;
}
.slider-block {
position: relative;
}
.slider-block .slick-slide {
position: relative;
}
.slider-block .slick-slide img {
width: 100%;
max-height: 650px;
height: auto;
object-fit: cover;
object-position: center;
}
.slider-block .slick-slide .content {
position: absolute;
left: 15px;
bottom: 15px;
background-color: var(--c-red);
padding: 10px 20px;
}
.slider-block .slick-slide .content p {
padding: 0;
margin: 0;
color: white;
font-size: 24px;
}
.slider-block .slick-arrow {
position: absolute;
top: 50%;
transform: translate(0, -50%);
z-index: 10;
background: transparent;
border: none;
text-indent: -5000px;
width: 50px;
height: 50px;
transition: all 0.3s ease-in-out;
left: 0;
}
.slider-block .slick-arrow.slick-next {
right: 0;
left: auto;
}
.slider-block .slick-arrow.slick-next:hover {
right: -3px;
left: auto;
}
.slider-block .slick-arrow.slick-next:before {
transform: translate(-50%, -50%) rotate(0deg);
}
.slider-block .slick-arrow:before {
content: "";
background-image: url(//www.petworthfestival.org.uk/wp-content/themes/petworth/images/arrow-slider.svg);
background-size: 50px;
background-position: center;
width: 40px;
height: 40px;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%) rotate(180deg);
opacity: 1;
transition: all 0.3s ease-in-out;
opacity: 0.5;
}
.slider-block .slick-arrow:hover {
left: -3px;
}
.slider-block .slick-arrow:hover:before {
opacity: 1;
cursor: pointer;
}
.slider-block .slick-dots {
position: absolute;
right: 15px;
top: 15px;
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: flex-end;
margin: 0;
padding: 0;
}
.slider-block .slick-dots li {
list-style: none;
margin: 0 2px;
line-height: 0;
}
.slider-block .slick-dots li button {
border: none;
background-color: var(--c-red);
text-indent: -5000px;
width: 20px;
height: 10px;
margin: 0;
padding: 0;
transition: all 0.3s ease-in-out;
}
.slider-block .slick-dots li button:hover {
cursor: pointer;
}
.slider-block .slick-dots li.slick-active button {
background-color: white;
height: 15px;
}
.wp-block-columns .slider-block {
padding: 0;
}
.wp-block-columns .slider-block img {
height: 585px;
}
@media screen and (max-width: 844px) {
.slider-block {
padding: 0;
}
.slider-block img {
min-height: 70vh;
}
}
.sponsors-list-block {
position: relative;
}
.sponsors-list-block p {
font-weight: 600;
display: inline-block;
border-bottom: 1px solid var(--c-red);
width: 100%;
padding: 0;
margin: 5px 0;
}
.sponsors-list-block .dev {
left: auto;
right: 0;
}
.sponsors-list-block .lists {
display: flex;
flex-wrap: wrap;
}
.sponsors-list-block .lists .list {
flex: 1 0 33%;
}
.sponsors-list-block .lists .list .item {
width: 100%;
display: inline-block;
line-height: 23px;
}
@media screen and (max-width: 844px) {
.sponsors-list-block {
margin: 20px 0;
}
.sponsors-list-block .lists .list {
flex: 1 0 100%;
}
}
.venues-list-block {
position: relative;
}
.venues-list-block .dev {
left: auto;
right: 0;
}
.venues-list-block h4 {
color: var(--c-red);
padding: 10px 0 10px;
}
.venues-list-block a.item {
list-style: none;
color: var(--c-dgrey);
text-decoration: none;
display: inline-block;
width: 100%;
padding: 5px 0;
transition: all 0.3s ease-in-out;
}
.venues-list-block a.item:hover {
color: var(--c-red);
}
@media screen and (max-width: 844px) {
.venues-list-block {
margin-bottom: 20px;
}
}
.venues-overview-block .boxes {
position: relative;
text-align: justify;
font-size: 74px;
}
.venues-overview-block .boxes .block {
background-color: var(--c-gold);
display: flex;
flex-wrap: wrap;
justify-content: center;
align-items: center;
margin: 0;
min-height: 135px;
transition: all 0.3s ease-in-out;
text-decoration: none;
width: 32.9%;
height: 360px;
position: relative;
overflow: hidden;
display: inline-block;
}
.venues-overview-block .boxes .block img {
width: 101%;
height: 101%;
object-fit: cover;
object-position: center;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
transition: all 0.3s ease-in-out;
}
.venues-overview-block .boxes .block p {
width: auto;
padding: 10px 15px;
box-sizing: border-box;
color: white;
text-transform: uppercase;
font-size: 20px;
position: absolute;
bottom: 15px;
left: 15px;
z-index: 1;
background-color: var(--c-red);
text-align: left;
max-width: 92%;
}
.venues-overview-block .boxes .block:hover {
background-color: var(--c-dred) !important;
cursor: pointer;
}
.venues-overview-block .boxes .block:hover img {
width: 105%;
height: 105%;
}
.venues-overview-block .boxes .block:nth-child(2), .venues-overview-block .boxes .block:nth-child(5), .venues-overview-block .boxes .block:nth-child(8), .venues-overview-block .boxes .block:nth-child(11), .venues-overview-block .boxes .block:nth-child(14), .venues-overview-block .boxes .block:nth-child(17), .venues-overview-block .boxes .block:nth-child(20), .venues-overview-block .boxes .block:nth-child(23) {
background-color: var(--c-red);
width: calc(33% - 15px);
}
@media screen and (max-width: 844px) {
.venues-overview-block {
margin-bottom: 15px;
}
.venues-overview-block .boxes .block {
width: 100% !important;
margin: 7.5px 0;
}
}
.whats-on-block {
padding: 10px 20px;
box-sizing: border-box;
}
.whats-on-block .title {
text-align: center;
background-color: var(--c-gold);
padding: 20px;
box-sizing: border-box;
}
.whats-on-block .title h2 {
margin: 0;
padding: 0;
color: white;
font-size: 34px;
font-weight: 1000;
}
.whats-on-block .title p {
margin: 0;
padding: 0;
color: white;
font-size: 20px;
}
.whats-on-block .alert {
margin-top: 10px;
border: 1px solid var(--c-red);
display: inline-block;
padding: 10px 100px;
box-sizing: border-box;
text-align: center;
}
.whats-on-block .alert h1, .whats-on-block .alert h2, .whats-on-block .alert h3, .whats-on-block .alert h4, .whats-on-block .alert h5, .whats-on-block .alert p, .whats-on-block .alert a {
color: var(--c-red);
}
.whats-on-block .alert p {
font-size: 19px;
}
.whats-on-block .alert a:hover {
color: black;
}
.whats-on-block .events {
margin-top: 2.5%;
display: flex;
flex-wrap: wrap;
align-items: flex-start;
position: relative;
align-items: stretch;
}
.whats-on-block .events.grid {
display: flex;
flex-wrap: wrap;
position: relative;
}
.whats-on-block .events.grid .event {
width: 33.33%;
margin-right: 0;
border-bottom: none;
display: flex;
flex-wrap: wrap;
align-items: flex-start;
}
.whats-on-block .events.grid .event .img {
margin: 0 0 10px;
width: 100%;
height: 240px;
text-align: center;
background-color: #f2f2f2;
font-size: 0;
}
.whats-on-block .events.grid .event .img img {
width: auto;
height: 100%;
object-fit: cover;
object-position: center;
margin: 0 auto;
display: inline-block;
max-width: 100%;
}
.whats-on-block .events.grid .event .content {
display: flex;
flex-wrap: wrap;
align-items: flex-start;
width: 100%;
}
.whats-on-block .events.grid .event .content .col {
width: 100% !important;
flex-wrap: wrap;
}
.whats-on-block .events.grid .event .content .col p.excerpt {
margin: 5px 0;
}
.whats-on-block .events.grid .event .content .col p.date {
margin: 5px 0;
}
.whats-on-block .events.grid .event .content .col .status {
top: auto;
position: relative;
right: auto;
width: 100%;
padding: 10px 0;
}
.whats-on-block .events .event {
width: 49%;
margin-right: 2%;
margin-bottom: 10px;
box-sizing: border-box;
display: inline-block;
vertical-align: top;
border-bottom: 2px solid #f1ece1;
padding: 10px 15px;
}
.whats-on-block .events .event span.date {
text-transform: uppercase;
margin-bottom: 10px;
display: inline-block;
font-weight: 800;
}
.whats-on-block .events .event .content {
display: flex;
flex-wrap: wrap;
align-items: flex-start;
}
.whats-on-block .events .event .content .col:nth-child(2) {
width: 30%;
display: flex;
align-items: flex-end;
flex-wrap: wrap;
padding: 0 0 10px;
}
.whats-on-block .events .event .content .col:nth-child(2) .buttons {
display: flex;
flex-wrap: wrap;
width: 100%;
}
.whats-on-block .events .event .content .col:nth-child(2) .buttons a:nth-child(1) {
background-color: var(--c-gold);
}
.whats-on-block .events .event .content .col:nth-child(2) .buttons a:nth-child(1):hover {
background-color: black;
}
.whats-on-block .events .event .content .col {
width: 70%;
padding-right: 10px;
box-sizing: border-box;
position: relative;
}
.whats-on-block .events .event .content .col .img {
position: relative;
right: 0;
height: 100px;
width: 100%;
background-color: #f3f3f3;
}
.whats-on-block .events .event .content .col .img img {
width: 100%;
height: 100%;
object-fit: contain;
object-position: center;
}
.whats-on-block .events .event .content .col h3 {
font-size: 22px;
line-height: 25px;
font-weight: 600;
padding: 0;
margin: 0;
color: var(--c-red);
}
.whats-on-block .events .event .content .col p {
text-transform: none;
padding: 0;
margin: 15px 0;
font-size: 16px;
}
.whats-on-block .events .event .content .col p.excerpt {
text-decoration: none;
padding: 0;
margin: 15px 0;
}
.whats-on-block .events .event .content .col p.date {
text-transform: uppercase;
font-weight: 500;
line-height: 20px;
margin: 15px 0 5px;
}
.whats-on-block .events .event .content .col a {
text-decoration: none;
background-color: var(--c-red);
border: none;
color: white;
margin: 3px 0 0;
width: 100%;
box-sizing: border-box;
font-size: 14px;
padding: 10px 0px;
text-align: center;
}
.whats-on-block .events .event .content .col .status {
text-decoration: none;
color: white;
border: none;
margin: 3px 0 0 0;
box-sizing: border-box;
font-size: 14px;
padding: 0;
text-align: center;
background-color: var(--c-red);
text-transform: uppercase;
width: 100%;
padding: 10px;
}
.whats-on-block .events .event:nth-child(2n) {
margin-right: 0;
padding-right: 0;
}
@media screen and (max-width: 844px) {
.whats-on-block .alert {
padding: 10px 30px;
}
.whats-on-block .events {
margin-top: 30px;
}
.whats-on-block .events .event {
width: 100%;
margin: 0 0 30px;
border-bottom: 1px solid #dbdbdb;
padding: 0 0 30px 0;
}
.whats-on-block .events .event .content .col {
width: 100% !important;
}
.whats-on-block .events .event .content .col .img {
height: 220px;
background-color: #efefef;
}
.whats-on-block .events .event .content .col .status {
position: relative;
top: auto;
width: 100%;
}
.whats-on-block .events.grid .event {
width: 100%;
display: inline-block;
margin: 0;
}
.whats-on-block .events.grid .event .img {
height: 340px;
background-color: #efefef;
}
.whats-on-block .events.grid .event .content {
min-height: auto;
}
}
[data-type="core/spacer"] .components-resizable-box__container {
background-color: #f7f7f7;
}