Skip to content

Instantly share code, notes, and snippets.

@nonaybay
Created January 25, 2021 04:36
Show Gist options
  • Save nonaybay/807f0625bff3d7bbdb95876aa1b382a1 to your computer and use it in GitHub Desktop.
Save nonaybay/807f0625bff3d7bbdb95876aa1b382a1 to your computer and use it in GitHub Desktop.
@charset "UTF-8";
* {
border: none;
box-sizing: border-box;
margin: 0;
outline: none;
padding: 0;
user-select: none;
}
.largeTitle {
font-family: "SF Pro Display", "SF Pro Text", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif;
font-size: 2.125em;
line-height: 1.2058823529;
font-weight: 400;
}
.largeTitle.condensed {
font-family: "SF Compact Display", "SF Compact Text", "SF Pro Text", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif;
}
.title1 {
font-family: "SF Pro Display", "SF Pro Text", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif;
font-size: 1.75em;
line-height: 1.2142857143;
font-weight: 400;
letter-spacing: -0.0153571429em;
}
.title1.condensed {
font-family: "SF Compact Display", "SF Compact Text", "SF Pro Text", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif;
}
.title2 {
font-family: "SF Pro Display", "SF Pro Text", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif;
font-size: 1.375em;
line-height: 1.2727272727;
font-weight: 400;
letter-spacing: -0.0118181818em;
}
.title2.condensed {
font-family: "SF Compact Display", "SF Compact Text", "SF Pro Text", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif;
}
.title3 {
font-family: "SF Pro Display", "SF Pro Text", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif;
font-size: 1.25em;
line-height: 1.25;
font-weight: 400;
letter-spacing: -0.0225em;
}
.title3.condensed {
font-family: "SF Compact Display", "SF Compact Text", "SF Pro Text", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif;
}
.headline {
font-family: "SF Pro Text", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif;
font-size: 1.0625em;
line-height: 1.2941176471;
font-weight: 600;
letter-spacing: -0.0252941176em;
}
.headline.condensed {
font-family: "SF Compact Text", "SF Pro Text", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif;
}
.subHeadline, main .body {
font-family: "SF Pro Text", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif;
font-size: 0.9375em;
line-height: 1.3333333333;
font-weight: 400;
}
.subHeadline.condensed, main .condensed.body {
font-family: "SF Compact Text", "SF Pro Text", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif;
}
.body {
font-family: "SF Pro Text", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif;
font-size: 1.0625em;
line-height: 1.2941176471;
font-weight: 400;
letter-spacing: -0.0252941176em;
}
.body.condensed {
font-family: "SF Compact Text", "SF Pro Text", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif;
}
html {
background-color: #8e8e8e;
}
body {
min-height: 297mm;
width: 210mm;
background-color: white;
color: #3a3a3c;
}
header {
display: flex;
flex-direction: row;
justify-content: space-between;
color: #2c68eb;
padding: 1em 0;
margin: 0 1em;
border-bottom: 2px solid #2c68eb;
}
header > div {
width: 100%;
display: flex;
flex-direction: row;
align-content: center;
align-items: center;
margin-right: 17px;
}
header > div:last-of-type {
margin-right: 0;
}
header > div > div p {
text-transform: uppercase;
text-shadow: 0.03125em 0.03125em 0.03125em #e3e3e3;
}
header > div > div:first-of-type {
width: 75%;
}
.box1 {
border-top: 2px solid #2c68eb;
}
.box1 > div:first-of-type > p:last-of-type {
font-weight: 800;
margin-top: 0.5em;
}
.box1 > div:first-of-type > p:first-of-type {
margin-top: 0.25em;
}
.box1 > div:last-of-type {
display: flex;
align-items: center;
align-content: center;
}
.box1 > div:last-of-type > p {
background-color: #2c68eb;
color: #f2f2f7;
height: 2em;
width: 1.2941176471em;
text-align: center;
line-height: 2em;
font-weight: 900;
border-radius: 0.125em;
text-shadow: 0.03125em 0.03125em 0.03125em #275dd1;
}
.box3 {
width: 100%;
text-align: right;
align-content: center;
justify-content: flex-end;
}
img {
display: block;
max-width: 100%;
}
.box2 {
display: flex;
width: 100%;
align-content: center;
align-items: center;
justify-content: center;
height: 128px;
}
main {
display: block;
padding: 5mm;
}
main .headline {
text-align: center;
color: #27458d;
margin-bottom: 0.5em;
}
main .body {
text-align: justify;
color: #1c1c1e;
}
footer {
display: flex;
height: 256px;
position: relative;
bottom: 0;
flex-direction: row;
justify-content: space-between;
align-items: center;
text-align: center;
}
footer p {
display: flex;
width: 100%;
flex-direction: column;
align-content: center;
align-items: center;
}
footer p::before {
display: block;
content: "";
width: 55%;
height: 2px;
background-color: #8e8e8e;
border-radius: 1px;
}
footer p:first-of-type::after {
display: "block";
content: "MCD";
}
footer p:last-of-type::after {
display: "block";
content: "Secretário";
}
.mono {
font-family: "SF Mono";
font-size: 0.8125em;
line-height: 1.3846153846em;
font-weight: 400;
}
/*# sourceMappingURL=global.css.map */
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment