.yd_columns {
--ydcol-gap: 24px;
--ydcol-count: 2;
--ydcol-block-bg: transparent;
--ydcol-pad-t: 0px;
--ydcol-pad-b: 32px;
margin-top: var(--ydcol-pad-t);
margin-bottom: var(--ydcol-pad-b);
padding-top: 12px;
padding-bottom: 20px;
box-sizing: border-box;
}
.yd_columns.has-block-bg {
background-color: var(--ydcol-block-bg);
}
.yd_columns.is-full-bleed {
width: 100vw;
max-width: 100vw;
margin-left: calc(50% - 50vw);
margin-right: calc(50% - 50vw);
box-sizing: border-box;
}
.yd_columns__inner {
width: 100%;
max-width: 1100px;
margin: 0 auto;
padding-left: 20px;
padding-right: 20px;
box-sizing: border-box;
}
.yd_columns.is-full-bleed .yd_columns__inner {
max-width: 1200px;
}
.yd_columns__row {
display: flex;
flex-direction: column;
gap: var(--ydcol-gap);
align-items: stretch;
}
.yd_columns__col {
min-width: 0;
flex: 1 1 0;
display: flex;
flex-direction: column;
}
.yd_columns__col > .yd_socials.is-stretch {
flex: 1 1 auto;
width: 100%;
}
.yd_columns__col > *:first-child {
margin-top: 0;
}
.yd_columns__col > *:last-child {
margin-bottom: 0;
} .yd_columns .yd_socials.is-align-left:not(.is-full-bleed),
.yd_columns .yd_socials.is-align-right:not(.is-full-bleed) {
float: none;
width: 100%;
max-width: 100%;
margin-left: 0;
margin-right: 0;
}
.yd_columns .yd_socials .yd_socials__inner {
max-width: none;
padding-left: 0;
padding-right: 0;
margin: 0;
}
.yd_columns .yd_socials {
padding-top: 0;
padding-bottom: 0;
margin-top: 0;
margin-bottom: 0;
}
@media (max-width: 719px) {
.yd_columns.is-mobile-scroll .yd_columns__row {
flex-direction: row;
flex-wrap: nowrap;
overflow-x: auto;
-webkit-overflow-scrolling: touch;
scroll-snap-type: x mandatory;
padding-bottom: 12px;
}
.yd_columns.is-mobile-scroll .yd_columns__col {
flex: 0 0 82%;
scroll-snap-align: start;
}
}
@media (min-width: 720px) {
.yd_columns {
padding-top: 20px;
padding-bottom: 28px;
}
.yd_columns__row {
flex-direction: row;
}
.yd_columns.is-cols-2 .yd_columns__col,
.yd_columns.is-cols-3 .yd_columns__col,
.yd_columns.is-cols-4 .yd_columns__col {
flex: 1 1 0;
}
}