* { | |
box-sizing: border-box; | |
} | |
body { | |
font-family: 'Source Sans Pro', sans-serif; | |
font-size: 16px; | |
} | |
.container { | |
width: 100%; | |
margin: 0 auto; | |
} | |
.title { | |
font-size: 24px ; | |
font-weight: 600 ; | |
letter-spacing: 0em; | |
text-align: center; | |
color: #374159 ; | |
} | |
.subtitle { | |
font-size: 24px ; | |
font-style: italic; | |
font-weight: 400 ; | |
letter-spacing: 0em; | |
text-align: center; | |
color: #1d652a ; | |
padding-bottom: 0.5em; | |
} | |
.overview-heading { | |
font-size: 24px ; | |
font-weight: 600 ; | |
letter-spacing: 0em; | |
text-align: left; | |
} | |
.overview-content { | |
font-size: 14px ; | |
font-weight: 400 ; | |
line-height: 30px ; | |
letter-spacing: 0em; | |
text-align: left; | |
} | |
.content-image { | |
width: 100% ; | |
height: auto ; | |
} | |
.vl { | |
border-left: 5px solid #1d652a; | |
padding-left: 20px; | |
color: #1d652a ; | |
} | |
.grid-container { | |
display: grid; | |
grid-template-columns: 1fr 2fr; | |
gap: 20px; | |
align-items: flex-start; | |
margin-bottom: 0.7em; | |
} | |
@media screen and (max-width: 768px) { | |
.container { | |
width: 90%; | |
} | |
.grid-container { | |
display: block; | |
} | |
.overview-heading { | |
font-size: 18px ; | |
} | |
} |