.motors-elementor-single-listing-gallery-mosaic {
position: relative;
}
@media (max-width: 767px) {
.motors-elementor-single-listing-gallery-mosaic {
display: flex;
flex-direction: column-reverse;
}
}
.motors-elementor-single-listing-gallery-mosaic .stm-gallery-meta-top {
display: flex;
justify-content: space-between;
}
@media (min-width: 1200px) {
.motors-elementor-single-listing-gallery-mosaic .stm-gallery-meta-top {
margin-bottom: 5px;
}
}
@media (max-width: 767px) {
.motors-elementor-single-listing-gallery-mosaic .stm-gallery-meta-top {
padding-top: 15px;
}
}
.motors-elementor-single-listing-gallery-mosaic .stm-gallery-actions-box {
display: flex;
flex-wrap: wrap;
min-width: 190px;
position: relative;
left: unset;
top: unset;
max-width: 60%;
}
.motors-elementor-single-listing-gallery-mosaic .stm-gallery-actions-box .stm-gallery-action-unit {
width: 28px;
height: 28px;
margin-right: 9px;
margin-bottom: 10px;
background: var(--motors-filter-inputs-color);
text-align: center;
line-height: 28px;
border-radius: 2px;
transition: 0.2s;
}
.motors-elementor-single-listing-gallery-mosaic .stm-gallery-actions-box .stm-gallery-action-unit:hover i {
color: var(--motors-text-color, #777);
}
.motors-elementor-single-listing-gallery-mosaic .stm-gallery-actions-box .stm-gallery-action-unit:hover i:before {
color: var(--motors-text-color, #777);
}
.motors-elementor-single-listing-gallery-mosaic .stm-gallery-actions-box .stm-gallery-action-unit > a {
border: 0;
display: block;
position: relative;
width: 100%;
height: 100%;
padding: 0;
text-decoration: none;
}
.motors-elementor-single-listing-gallery-mosaic .stm-gallery-actions-box .stm-gallery-action-unit > a i {
position: absolute;
left: 50%;
top: 50%;
transform: translateY(-50%) translateX(-50%);
}
.motors-elementor-single-listing-gallery-mosaic .stm-gallery-actions-box .stm-gallery-action-unit i {
transition: 0.2s;
color: var(--motors-text-alpha-color, #777);
}
.motors-elementor-single-listing-gallery-mosaic .stm-gallery-actions-box .stm-gallery-action-unit i:before {
color: var(--motors-text-alpha-color, #777);
}
.motors-elementor-single-listing-gallery-mosaic .stm-gallery-actions-box .stm-gallery-action-unit:hover {
cursor: pointer;
}
.motors-elementor-single-listing-gallery-mosaic .stm-gallery-actions-box .stm-gallery-action-unit.active {
background: var(--motors-accent-color, var(--mvl-primary-color));
}
.motors-elementor-single-listing-gallery-mosaic .stm-gallery-actions-box .stm-gallery-action-unit.active i {
color: var(--motors-contrast-text-alpha-color, #777);
}
.motors-elementor-single-listing-gallery-mosaic .stm-gallery-actions-box .stm-gallery-action-unit.active i:before {
color: var(--motors-contrast-text-alpha-color, #777);
}
.motors-elementor-single-listing-gallery-mosaic .stm-gallery-actions-box .stm-gallery-action-unit .st_sharethis_large {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
opacity: 0;
}
.motors-elementor-single-listing-gallery-mosaic .stm-gallery-actions-box .stm-gallery-action-unit .stm-a2a-popup {
display: none;
opacity: 0;
position: absolute;
top: 100%;
left: 0;
min-width: 100%;
z-index: -1;
padding: 0 9px 0 0;
}
.motors-elementor-single-listing-gallery-mosaic .stm-gallery-actions-box .stm-gallery-action-unit .stm-a2a-popup.stm-a2a-popup-active {
display: flex;
justify-content: flex-end;
opacity: 1;
z-index: 10;
transform: translateX(0);
}
.motors-elementor-single-listing-gallery-mosaic .stm-gallery-actions-box .stm-gallery-action-unit .stm-a2a-popup.stm-a2a-popup-active .addtoany_shortcode {
background: var(--motors-bg-color, #fff);
padding: 5px 2px 1px;
border-radius: 3px;
border: 1px solid var(--motors-border-color, #fff);
}
.motors-elementor-single-listing-gallery-mosaic .stm-gallery-actions-box .stm-gallery-action-unit .stm-a2a-popup.stm-a2a-popup-active .addtoany_shortcode .a2a_kit {
display: flex;
flex-direction: row;
flex-wrap: nowrap;
}
.motors-elementor-single-listing-gallery-mosaic .stm-gallery-listing-info {
display: flex;
align-items: center;
flex-wrap: wrap;
justify-content: flex-end;
}
.motors-elementor-single-listing-gallery-mosaic .stm-gallery-listing-info-item {
display: inline-block;
text-align: center;
background: var(--motors-bg-lowestalpha-contrast, rgba(0, 0, 0, 0.1));
border-radius: 2px;
color: var(--motors-text-alpha-color, #777);
font-size: 12px;
text-transform: uppercase;
min-width: 85px;
padding: 5px 15px;
margin: 0 0 10px 15px;
}
.motors-elementor-single-listing-gallery-mosaic .stm-gallery-listing-info-item.accented {
background-color: var(--motors-accent-color, var(--mvl-secondary-color));
color: var(--motors-contrast-text-color, #fff);
}
.motors-elementor-single-listing-gallery-mosaic .stm-gallery-listing-info-item.special-label-inline {
background-color: transparent;
padding: 0;
font-weight: 700;
text-transform: uppercase;
display: flex;
align-items: center;
min-width: auto;
}
.motors-elementor-single-listing-gallery-mosaic .stm-gallery-listing-info-item.special-label-inline i {
font-size: 1.1em;
margin-right: 0.5em;
}
.motors-elementor-single-listing-gallery-mosaic .stm-gallery-listing-info-item.stm-car-videos {
cursor: pointer;
}
body.rtl .motors-elementor-single-listing-gallery-mosaic .stm-gallery-listing-info-item {
margin: 0 15px 10px 0;
}
body.rtl .motors-elementor-single-listing-gallery-mosaic .stm-gallery-listing-info-item.special-label-inline i {
margin-right: 0;
margin-left: 0.5em;
}
body.rtl .motors-elementor-single-listing-gallery-mosaic .stm-gallery-actions-box .stm-gallery-action-unit {
margin-right: 0;
margin-left: 9px;
}
body.rtl .motors-elementor-single-listing-gallery-mosaic .stm-gallery-actions-box .stm-gallery-action-unit .stm-a2a-popup {
left: auto;
right: 0;
padding: 0 0 0 9px;
}
body.rtl .motors-elementor-single-listing-gallery-mosaic .stm-gallery-actions-box .stm-gallery-action-unit .stm-a2a-popup.stm-a2a-popup-active {
justify-content: flex-start;
}
.mosaic-gallery {
display: flex;
align-items: stretch;
}
.mosaic-gallery .item {
position: relative;
}
.mosaic-gallery .item a {
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
display: block;
}
.mosaic-gallery .item a.video:before {
display: block;
font-family: "Font Awesome 6 Free";
font-weight: 600;
font-style: normal;
text-rendering: auto;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
transform: translate(0, 0);
content: "\f144";
position: absolute;
top: 50%;
left: 50%;
margin: -25px 0 0 -25px;
width: 51px;
height: 51px;
background: var(--motors-bg-highalpha-color, rgba(255, 255, 255, 0.9));
border-radius: 50%;
text-align: center;
line-height: 51px;
color: var(--motors-text-color, #232628);
font-size: 30px;
z-index: 20;
}
.mosaic-gallery .item a.video:hover:before {
color: var(--motors-accent-color, var(--mvl-secondary-color));
}
.mosaic-gallery .item img {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
margin: 0;
display: block;
-o-object-fit: cover;
object-fit: cover;
transition: all 0.2s ease;
}
.mosaic-gallery .item a:hover img {
filter: brightness(1.1);
}
.mosaic-gallery .item.item-small .more-label {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
color: var(--motors-contrast-text-color, #fff);
font-size: 28px;
background-color: var(--motors-bg-alpha-contrast, rgba(0, 0, 0, 0.5));
}
@media (max-width: 992px) {
.mosaic-gallery .item.item-small .more-label {
font-size: 4.3vw;
}
}
.mosaic-gallery.items-1 .item {
height: 440px;
flex-basis: 100%;
flex-grow: 1;
max-height: 52vh;
}
@media (max-width: 992px) {
.mosaic-gallery.items-1 .item {
max-height: 55vw;
}
}
.mosaic-gallery.items-2 {
margin: 0 -5px 10px;
}
@media (max-width: 992px) {
.mosaic-gallery.items-2 {
flex-direction: column;
}
}
.mosaic-gallery.items-2 .item a {
left: 5px;
right: 5px;
top: 5px;
bottom: 5px;
}
.mosaic-gallery.items-2 .item-big {
height: 350px;
flex-basis: 50%;
flex-grow: 1;
}
@media (max-width: 992px) {
.mosaic-gallery.items-2 .item-big {
height: auto;
flex-basis: auto;
}
.mosaic-gallery.items-2 .item-big a {
position: static;
width: auto;
height: auto;
}
.mosaic-gallery.items-2 .item-big img {
position: static;
width: auto;
height: auto;
}
}
.mosaic-gallery.items-3 {
margin: 0 -10px 10px;
}
@media (max-width: 992px) {
.mosaic-gallery.items-3 {
margin: 0 -4px 10px;
flex-direction: column;
}
}
.mosaic-gallery.items-3 .item a {
left: 10px;
right: 10px;
top: 10px;
bottom: 10px;
}
@media (max-width: 992px) {
.mosaic-gallery.items-3 .item a {
left: 4px;
right: 4px;
top: 4px;
bottom: 4px;
}
}
.mosaic-gallery.items-3 .item-big {
height: 450px;
flex-basis: 65%;
flex-grow: 1;
}
@media (max-width: 992px) {
.mosaic-gallery.items-3 .item-big {
height: auto;
flex-basis: auto;
}
.mosaic-gallery.items-3 .item-big a {
position: static;
width: auto;
height: auto;
}
.mosaic-gallery.items-3 .item-big img {
position: static;
width: auto;
height: auto;
}
}
.mosaic-gallery.items-3 .item-small {
flex-basis: 100%;
}
@media (max-width: 992px) {
.mosaic-gallery.items-3 .item-small {
flex-basis: 50%;
height: 22vw;
}
}
.mosaic-gallery.items-3 .wrapper-small {
flex-basis: 35%;
display: flex;
flex-wrap: wrap;
}
.mosaic-gallery.items-4 {
margin: 0 -10px 10px;
}
@media (max-width: 992px) {
.mosaic-gallery.items-4 {
margin: 0 -4px 10px;
flex-direction: column;
}
}
.mosaic-gallery.items-4 .item a {
left: 10px;
right: 10px;
top: 10px;
bottom: 10px;
}
@media (max-width: 992px) {
.mosaic-gallery.items-4 .item a {
left: 4px;
right: 4px;
top: 4px;
bottom: 4px;
}
}
.mosaic-gallery.items-4 .item-big {
height: 450px;
flex-basis: 65%;
flex-grow: 1;
}
@media (max-width: 992px) {
.mosaic-gallery.items-4 .item-big {
height: auto;
flex-basis: auto;
}
.mosaic-gallery.items-4 .item-big a {
position: static;
margin: 4px;
}
.mosaic-gallery.items-4 .item-big img {
position: static;
width: auto;
height: auto;
}
}
.mosaic-gallery.items-4 .item-small {
flex-basis: 100%;
}
@media (max-width: 992px) {
.mosaic-gallery.items-4 .item-small {
flex-basis: 33.3%;
height: 20vw;
}
}
.mosaic-gallery.items-4 .wrapper-small {
flex-basis: 35%;
display: flex;
flex-wrap: wrap;
}
.mosaic-gallery.items-5 {
margin: 0 -7px 10px;
}
@media (max-width: 992px) {
.mosaic-gallery.items-5 {
margin: 0 -4px 10px;
flex-direction: column;
}
}
.mosaic-gallery.items-5 .item a {
left: 7px;
top: 7px;
right: 7px;
bottom: 7px;
}
@media (max-width: 992px) {
.mosaic-gallery.items-5 .item a {
left: 4px;
top: 4px;
right: 4px;
bottom: 4px;
}
}
.mosaic-gallery.items-5 .item-big {
height: 400px;
flex-basis: 50%;
flex-grow: 1;
}
@media (max-width: 992px) {
.mosaic-gallery.items-5 .item-big {
height: auto;
flex-basis: auto;
}
.mosaic-gallery.items-5 .item-big a {
position: static;
margin: 4px;
}
.mosaic-gallery.items-5 .item-big img {
position: static;
width: auto;
height: auto;
}
}
.mosaic-gallery.items-5 .item-small {
flex-basis: 50%;
}
@media (max-width: 992px) {
.mosaic-gallery.items-5 .item-small {
height: 23vw;
}
}
.mosaic-gallery.items-5 .wrapper-small {
flex-basis: 50%;
display: flex;
flex-wrap: wrap;
}
.mosaic-gallery.items-6 {
margin: 0 -10px 10px;
}
@media (max-width: 992px) {
.mosaic-gallery.items-6 {
margin: 0 -4px 10px;
flex-direction: column;
}
}
.mosaic-gallery.items-6 .item a {
left: 10px;
right: 10px;
top: 10px;
bottom: 10px;
}
@media (max-width: 992px) {
.mosaic-gallery.items-6 .item a {
left: 4px;
right: 4px;
top: 4px;
bottom: 4px;
}
}
.mosaic-gallery.items-6 .item-big {
height: 400px;
flex-basis: 100%;
}
@media (max-width: 992px) {
.mosaic-gallery.items-6 .item-big {
height: auto;
flex-basis: 100%;
}
.mosaic-gallery.items-6 .item-big a {
position: static;
margin: 4px;
}
.mosaic-gallery.items-6 .item-big img {
position: static;
width: auto;
height: auto;
}
}
.mosaic-gallery.items-6 .wrapper-big {
flex-basis: 66.6%;
flex-grow: 1;
display: flex;
flex-wrap: wrap;
}
.mosaic-gallery.items-6 .wrapper-big .item-small {
flex-basis: 50%;
height: 200px;
}
@media (max-width: 992px) {
.mosaic-gallery.items-6 .wrapper-big .item-small {
height: 23vw;
}
}
.mosaic-gallery.items-6 .wrapper-small {
flex-basis: 33.3%;
display: flex;
flex-wrap: wrap;
}
.mosaic-gallery.items-6 .wrapper-small .item-small {
flex-basis: 100%;
}
@media (max-width: 992px) {
.mosaic-gallery.items-6 .wrapper-small .item-small {
flex-basis: 33.3%;
height: 20vw;
}
}
.mosaic-gallery .additional-images {
display: none;
}
.stm-template-car_dealer_two_elementor.inventory-dark .motors-elementor-single-listing-gallery-mosaic .stm-gallery-listing-info-item {
background: var(--motors-contrast-bg-color, #373c3f);
color: var(--motors-contrast-text-color, #fff);
}
.stm-template-car_dealer_two_elementor.inventory-dark .motors-elementor-single-listing-gallery-mosaic .stm-gallery-listing-info-item.special-label-inline {
background: transparent;
}