.side-by-side {
    margin-bottom:0;
}

.side-by-side .slide .inner {
    display: flex;
    flex-direction: column;
}

.side-by-side .slide .img-cont {
    position: relative;
}

.side-by-side .slide .img-cont .img {
    height: 0;
    padding-top: calc(100% * 720 / 1080);
    display: block;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    margin: 0;
}

.side-by-side .title {
    margin-bottom: 1rem; 
    font-family: var(--font-magazine);
    letter-spacing: normal;   
}

.side-by-side .title a {
    text-decoration: none;
    color: inherit;
    font-size: 26px;
    font-weight: 400;
    line-height: 32px;
    letter-spacing: 0.04em;
}

.side-by-side .slide .content-section {
    box-sizing: border-box;
    padding: 2rem 1rem 1rem;
    margin-bottom: 1rem;
    position: relative;
    margin-top: 5px;
    max-width: 660px;
}

.side-by-side .slide .content-section .custom-button {
    padding-top: 4.25rem;
}

.side-by-side .slide .content-section .sv-button {
    display: inline-block;
    width: 100%;
    padding: 16px 50px;
    display: flex;
    justify-content: center;
    align-items: center;
}

@media (min-width: 1024px) {
    .side-by-side .slide .inner {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
    }
    
    .side-by-side .slide .img-cont,
    .side-by-side .slide .content-section {
        padding: 70px;
        margin: 0;
    }
    
    .side-by-side:not(.info-on-right) .slide:nth-child(odd) .inner .img-cont {
        order: 1;
    }
    
    .side-by-side.info-on-right .slide:nth-child(even) .inner .img-cont {
        order: 1;
    }
    
    .side-by-side .slide .content-section .sv-button {
        width: auto;
        display: inline;
    }
}

/* THEMES */
[class*="theme"] .side-by-side .slide + .slide { border-top: 1px solid transparent; }

.theme-default .side-by-side .slide + .slide,
.theme-summergreen .side-by-side .slide + .slide { border-color: var(--lightgray); }
.theme-springblue .side-by-side .slide + .slide { border-color: var(--gray); }
.theme-vlexblue .side-by-side .slide + .slide { border-color: var(--springblue); }
.theme-darkgreen .side-by-side .slide + .slide { border-color: var(--summergreen); }
.theme-fallyellow .side-by-side .slide + .slide { border-color: var(--darkgray); }

/* PATTERNS */
.side-by-side[class*="pattern"] .img-cont .img {
    margin: 16px;
    z-index: 1;
    position: relative;
}

.side-by-side[class*="pattern"] .img-cont::before {
    display: block;
    position: absolute;
    bottom: 0;
    width: 100%;
	content: "";
    height: 45px;
	background-size: 70px;
	background-position: center;
	background-repeat: repeat;
    z-index: 0;
}

@media (min-width: 1024px) {
    .side-by-side[class*="pattern"] .img-cont .img {
        margin: 0;
    }
    
	.side-by-side[class*="pattern"] .img-cont::before {
		height: 100%;
        width: 140px;
        left: 0;
        right: unset;
	}
    
    .side-by-side[class*="pattern"].info-on-right .slide:nth-child(even) .img-cont::before,
    .side-by-side .slide:nth-child(odd) .img-cont::before {
        right: 0;
        left: unset;
    }
    
    .side-by-side[class*="pattern"].info-on-right .slide:nth-child(odd) .img-cont::before {
        left: 0;
        right:unset;
    }
}

.side-by-side.pattern-summerday .img-cont::before {
	background-image: var(--pattern-summerday);
}

.side-by-side.pattern-summernight .img-cont::before {
	background-image: var(--pattern-summernight);
}

.side-by-side.pattern-kentucky .img-cont::before {
	background-image: var(--pattern-kentucky);
}

.side-by-side.pattern-twilight .img-cont::before {
	background-image: var(--pattern-twilight);
}

.side-by-side.pattern-dandelion .img-cont::before {
	background-image: var(--pattern-dandelion);
}