$max-width: 1200px $site-margin: 40px $section-margin: 80px
$mobile: 'max-width: 600px' $tablet: 'max-width: 768px' $desktop: 'min-width: 1001px'
$nav-breakpoint: 'max-width: 1000px'
html
overflow-x: hidden &.mobile-menu-open overflow-y: hidden body font-family: 'Open Sans', sans-serif font-weight: 400 font-size: 16px overflow-x: hidden em font-style: italic #accordion a color: $blue !important a text-decoration: none color: $blue .page-content display: flex align-items: center flex-direction: column background-color: $white margin-bottom: $site-margin @media screen and ($tablet) margin-bottom: $site-margin/2 .margin max-width: $max-width + 80px width: 100% .wrapper &.page margin-bottom: $section-margin img position: relative left: 50% transform: translateX(-50%) max-width: 100% height: auto p font-size: 15px color: $dark-grey line-height: 2 margin-bottom: $site-margin*0.75 &.single-post img position: relative left: 50% transform: translateX(-50%) max-width: 100% height: auto p font-size: 15px color: $dark-grey line-height: 2 margin-bottom: $site-margin*0.75 // width: 100% max-width: $max-width margin-left: $site-margin margin-right: $site-margin margin-top: $section-margin margin-bottom: 0 @media screen and ($tablet) margin-top: $section-margin/2 @media screen and ($mobile) margin-left: $site-margin/2 margin-right: $site-margin/2 margin-top: $section-margin/2 margin-bottom: 0 &.home-content font-size: 25px @media screen and ($tablet) font-size: 20px @media screen and ($mobile) font-size: 18px color: $dark-grey line-height: 1.7 font-weight: 300 hyphens: auto .dark-section width: 100% height: auto display: flex justify-content: center align-items: center background-color: $white color: $black .wrapper display: flex flex-direction: row @media screen and ($nav-breakpoint) display: block flex-direction: column justify-content: space-between h3 &:first-of-type margin-top: 0 .col padding: $section-margin/2 $section-margin/2.5 @media screen and ($tablet) padding: $section-margin/2 $section-margin/3 @media screen and ($mobile) padding: $section-margin/2 $section-margin/4 // border: 1px solid red -webkit-box-shadow: 0px 0px 6px 0px rgba(0,0,0,0.16) -moz-box-shadow: 0px 0px 6px 0px rgba(0,0,0,0.16) box-shadow: 0px 0px 6px 0px rgba(0,0,0,0.16) margin-right: $site-margin/2 @media screen and ($nav-breakpoint) margin-right: 0 margin-bottom: $site-margin/2 &:last-of-type margin-bottom: 0 // @media screen and ($mobile) // margin-bottom: $site-margin/2 flex-basis: 100% flex-grow: 1 &:last-of-type margin-right: 0 p font-weight: 300 font-size: 14px line-height: 2 margin-top: 15px margin-bottom: 30px text-align: justify