diff --git a/_sass/components/_events.scss b/_sass/components/_events.scss index 9b3eb9e6de..a5046d1593 100644 --- a/_sass/components/_events.scss +++ b/_sass/components/_events.scss @@ -238,13 +238,31 @@ .meetings-message { text-align: center; } -.location-image { + +.location-img-pos { + flex: 0 0 auto; + width: 372px; + overflow: hidden; margin: -5px; - border-radius: 5px; - max-width: 372px; + @media #{$bp-below-tablet} { + margin: 0; + width: 100%; + height: 40vh; + } @media #{$bp-below-mobile} { - height: auto; + height: 231px; + } +} + +.location-image { + width: 100%; + height: 100%; + object-fit: cover; + + @media #{$bp-below-tablet} { + /* Positions image so location text is visible */ + object-position: center 80%; } } @@ -264,11 +282,14 @@ @media #{$bp-below-tablet} { padding: 16px 16px; } + @media #{$bp-below-mobile} { + margin: 45px 16px; + } } .locations-1 { display: flex; - height: 388px ; + height: 388px; margin: -17px; @media #{$bp-below-tablet} { @@ -461,6 +482,7 @@ @media #{$bp-below-tablet} { display: none; background: $color-gold; + width: 100vw; } }