Let the article cover use flexbox for sizing; reduce padding on mobile

parent 79a7c681
{"version":3,"sourceRoot":"","sources":["style.scss"],"names":[],"mappings":"AAAQ;AACA;AAkBR;AAAA;AAAA;AAAA;AAKA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EAaE;EACA;EACA;EACA;EACA;EACA;;;AAGF;AACA;AAAA;EAEE;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;AAAA;EAEE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;;;AAGF;EACE;EACA;EACA;EACA,kBAhFS;EAiFT,OAlFS;EAmFT;EACA;EACA;;;AAGF;EACE,WA7Ec;EA8Ed;;AAEA;EAJF;IAKI;;;;AAIJ;EACE;EACA;EACA;EACA;;AAEA;EANF;IAOI;IACA;IACA;;;AAGF;EACE;;AAEA;EACE;EACA;;AAGF;EACE;EACA;EACA;EAEA,OA1HK;EA2HL;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE,OArIG;EAsIH;;AAGF;EACE,OA3IG;;AA6IH;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;;AAEA;EACE;;AAMR;EACE;;AAGF;EACE;;;AAKN;EACE;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EAZF;IAaI;;;AAKF;EACE;;;AAKN;EACE;EACA;EACA;;AAEA;EACE;EACA;EACA;;AAGF;EACE;EACA;EACA,OArNO;EAsNP;;AAGF;EAlBF;IAmBI;;EAEA;IACE;;;;AAKN;EACE;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;;AAEA;EAPF;IAQI;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;;AAGF;EACE,OAlQK;EAmQL;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAEA;EACE;EACA,OAtRC;;AAyRH;EACE;EACA;;AAEA;EACE;;AAKN;EACE;EACA,OArSG;;AAwSL;EACE;EACA;EACA;EACA;EACA;;;AAMR;EACE;;;AAIA;EACE;EACA;;AAGF;EACE;EACA;EACA;EACA,OArUO;EAsUP;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAIJ;EACE;EACA;EACA;EACA,OA3VO;EA4VP;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA,OA1WO;;AA6WT;EACE,OA9WO;EA+WP;EACA;EACA;EAGA;EACA;;AAGF;EACE;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;EACA;;AAGF;EACE;EACA;EACA,OAzZO;EA0ZP;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAIJ;EACE;;AAEA;EACE;EACA;;;AAKN;EACE;;AAEA;EACE;;AAEA;EACE,OAxbK;EAybL;;;AAKN;EACE;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;;AAGF;EACE;;;AAIJ;EAKE;EACA;EACA;EACA;EACA;EACA;;AATA;EACE;;;AAWJ;EACE;EACA;EACA;EACA;;AAEA;EACE;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE,OAxfO;;AA2fT;EACE;;;AAIJ;EACE,YA/fS;EAggBT;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;;AAGF;EACE;EACA,OArhBO;EAshBP;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;;AAGF;EAzBF;IA0BI;;;;AAKN;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EACE;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA","file":"css"}
\ No newline at end of file
@charset "UTF-8";
@import url("https://fonts.googleapis.com/css?family=Quando|Judson|Montserrat:400,600|Roboto:400,500,700");
@import url("https://unpkg.com/ionicons@4.2.0/dist/css/ionicons.min.css");
/* http://meyerweb.com/eric/tools/css/reset/
v2.0 | 20110126
License: none (public domain)
*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
font: inherit;
vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
display: block;
}
body {
line-height: 1;
box-sizing: border-box;
text-rendering: optimizelegibility;
font-feature-settings: "kern";
text-size-adjust: none;
}
ol, ul {
list-style: none;
}
blockquote, q {
quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
content: "";
content: none;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
a {
outline: 0;
}
body {
box-sizing: border-box;
font-family: "Roboto", sans-serif;
text-rendering: optimizeLegibility;
background-color: #1F232B;
color: #9baec8;
font-size: 13px;
line-height: 18px;
font-weight: 400;
}
.container {
max-width: 800px;
margin: 0 auto;
}
@media screen and (max-width: 600px) {
.container {
padding: 0 20px;
}
}
.navbar {
padding-top: 15px;
margin-bottom: 90px;
display: flex;
justify-content: space-between;
}
@media screen and (max-width: 600px) {
.navbar {
flex-wrap: wrap;
justify-content: center;
margin-bottom: 30px;
}
}
.navbar ul {
list-style: none;
}
.navbar ul li {
display: inline-block;
vertical-align: bottom;
}
.navbar ul a {
display: flex;
justify-content: center;
align-items: center;
color: #9baec8;
text-decoration: none;
padding: 12px 14px;
line-height: 32px;
transition: color 250ms linear;
font-family: "Montserrat", sans-serif;
font-weight: 600;
font-size: 14px;
}
.navbar ul a.active, .navbar ul a:hover {
color: #d9e1e8;
transition: color 100ms linear;
}
.navbar ul a.brand {
color: #fff;
}
.navbar ul a.brand img {
width: auto;
height: 32px;
opacity: 1;
position: relative;
mix-blend-mode: normal;
top: 4px;
left: -10px;
}
.navbar ul a.brand:hover {
border-bottom-color: transparent;
}
.navbar ul a.brand:hover img {
opacity: 1;
}
.navbar ul li:first-child a {
padding-left: 0;
}
.navbar ul li:last-child a {
padding-right: 0;
}
.brand {
display: inline-block;
position: relative;
z-index: 2;
}
.brand::before {
content: "";
display: block;
background: url("elephant-friend-top.png");
position: absolute;
width: 393px;
height: 176px;
z-index: -1;
top: -21px;
left: -28px;
pointer-events: none;
}
@media screen and (max-width: 600px) {
.brand::before {
display: none;
}
}
.brand:hover::before {
top: -20px;
}
.intro {
text-align: center;
padding: 90px 0;
padding-top: 20px;
}
.intro img {
display: block;
margin: 0 auto;
margin-bottom: 30px;
}
.intro h1 {
font-size: 42px;
font-weight: 500;
color: #d9e1e8;
line-height: 1;
}
@media screen and (max-width: 600px) {
.intro {
padding-top: 20px;
}
.intro h1 {
font-size: 28px;
}
}
.thumbnail-grid {
display: flex;
flex-wrap: wrap;
margin: 0 -15px;
}
.thumbnail-grid li {
box-sizing: border-box;
width: 50%;
flex: 0 0 auto;
padding: 0 15px;
margin-bottom: 30px;
}
@media screen and (max-width: 600px) {
.thumbnail-grid li {
width: 100%;
}
}
.thumbnail-grid li .cover {
display: block;
background: #282d37;
border-radius: 4px 4px 0 0;
width: 100%;
height: 220px;
text-decoration: none;
font-weight: 600;
background-size: cover;
}
.thumbnail-grid li .overlay {
height: 100%;
}
.thumbnail-grid li h2 {
color: #d9e1e8;
position: relative;
vertical-align: middle;
top: 50%;
transform: translateY(-50%);
text-align: center;
font-size: 26px;
line-height: 1.58;
padding: 20px;
}
.thumbnail-grid li .article-information {
padding: 20px;
background: #303643;
border-radius: 0 0 4px 4px;
font-size: 16px;
letter-spacing: -0.003em;
line-height: 1.58;
}
.thumbnail-grid li .article-information .author {
float: left;
}
.thumbnail-grid li .article-information .author strong {
font-weight: 600;
color: #687590;
}
.thumbnail-grid li .article-information .author a {
text-decoration: none;
color: inherit;
}
.thumbnail-grid li .article-information .author a i {
font-weight: initial;
}
.thumbnail-grid li .article-information time {
float: right;
color: #687590;
}
.thumbnail-grid li .article-information .summary {
margin-top: 46px;
clear: both;
height: 80px;
overflow: hidden;
text-overflow: ellipsis;
}
.related-articles {
margin-top: 30px;
}
.article main {
max-width: 600px;
margin: 0 auto;
}
.article h1 {
font-size: 36px;
line-height: 1.08;
font-weight: 600;
color: #d9e1e8;
padding-top: 35px;
margin-left: -2.63px;
text-align: center;
position: relative;
}
.article h1::before {
display: block;
content: "";
border-top: 2px solid #2b90d9;
width: 100px;
height: 0;
position: absolute;
left: 50%;
top: 0;
transform: translateX(-50%);
}
.article h2 {
font-size: 21px;
line-height: 1.22;
font-weight: 500;
color: #9baec8;
margin-top: 25px;
margin-left: -1.75px;
text-align: center;
}
.article h3 {
font-size: 26px;
margin-left: -1.63px;
line-height: 1.22;
text-align: center;
margin-top: 50px;
margin-bottom: 30px;
font-weight: 600;
color: #d9e1e8;
}
.article p {
color: #d9e1e8;
font-size: 16px;
line-height: 28px;
font-weight: normal;
margin-bottom: 26px;
hyphens: auto;
}
.article a {
color: #79b9e7;
}
.article img {
display: block;
margin: 0 auto;
max-width: 100%;
height: auto;
border-radius: 4px;
box-shadow: 4px 6px 18px rgba(0, 0, 0, 0.35);
}
.article .image-large {
margin-bottom: 50px;
}
.article .image-pull-left {
float: left;
}
.article em {
font-style: italic;
}
.article ul {
counter-reset: post;
margin-bottom: 26px;
}
.article ul li {
margin-left: 30px;
margin-bottom: 14px;
color: #d9e1e8;
font-size: 16px;
line-height: 28px;
}
.article ul li::before {
position: absolute;
display: inline-block;
-webkit-box-sizing: border-box;
box-sizing: border-box;
width: 78px;
margin-left: -78px;
text-align: right;
padding-top: 4px;
padding-right: 15px;
content: "•";
}
.article-header {
padding: 50px 0;
}
.article-header .image-large {
margin-top: 50px;
margin-bottom: 0;
}
.footer {
padding-bottom: 30px;
}
.footer .legal {
margin-top: 30px;
}
.footer .legal a {
color: #687590;
text-decoration: none;
}
.entry-nav {
overflow: hidden;
margin-bottom: 30px;
}
.entry-nav a {
color: #79b9e7;
display: inline-block;
border: 1px solid #303643;
padding: 10px 14px;
border-radius: 4px;
font-weight: 500;
text-decoration: none;
}
.entry-nav .prev-entry {
float: left;
}
.entry-nav .next-entry {
float: right;
}
.pagination-container {
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
margin-left: 15px;
margin-right: 15px;
}
.pagination-container ::before, .pagination-container ::after {
box-sizing: border-box;
}
.pagination {
display: flex;
justify-content: center;
margin-bottom: 30px;
flex: 0 0 100%;
}
.pagination li {
flex: 0 0 auto;
padding: 0 15px;
}
.pagination a {
color: #79b9e7;
display: inline-block;
border: 1px solid #303643;
padding: 10px 14px;
border-radius: 4px;
font-weight: 500;
text-decoration: none;
}
.pagination .disabled a {
color: #687590;
}
.pagination .active a {
border-color: #79b9e7;
}
.cta-banner {
background: #2b90d9;
border-radius: 4px;
text-align: center;
padding: 40px;
}
.cta-banner h4 {
font-size: 24px;
line-height: 1.08;
font-weight: 600;
margin-bottom: 20px;
color: #fff;
}
.cta-banner p {
color: #fff;
font-size: 18px;
line-height: 1.22;
margin-bottom: 20px;
}
.cta-banner > a {
font-weight: 500;
color: #2b90d9;
background: #fff;
border-radius: 4px;
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
font-family: inherit;
display: inline-block;
text-align: center;
font-size: 16px;
text-decoration: none;
line-height: 36px;
padding: 4px 16px;
margin: 0 auto;
border: 0;
cursor: pointer;
}
.cta-banner > a.secondary {
padding: 2px 14px;
border: 2px solid #fff;
background: transparent;
margin-left: 4px;
color: #fff;
}
@media screen and (max-width: 375px) {
.cta-banner > a {
margin-bottom: 10px;
}
}
.panel {
display: block;
border-radius: 4px;
background: #000;
text-decoration: none;
background-size: 60%;
background-repeat: no-repeat;
background-position: top right;
text-align: left;
}
.panel .overlay {
padding: 20px;
}
.panel h5 {
padding-top: 90px;
font-size: 26px;
font-weight: 600;
line-height: 1.58;
color: #fff;
}
.panel p {
color: #fff;
font-size: 16px;
}
/*# sourceMappingURL=style.css.map */
{"version":3,"sourceRoot":"","sources":["../style.scss"],"names":[],"mappings":"AAAQ;AACA;AAkBR;AAAA;AAAA;AAAA;AAKA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EAaE;EACA;EACA;EACA;EACA;EACA;;;AAGF;AACA;AAAA;EAEE;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;AAAA;EAEE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;;;AAGF;EACE;EACA;EACA;EACA,kBAhFS;EAiFT,OAlFS;EAmFT;EACA;EACA;;;AAGF;EACE,WA7Ec;EA8Ed;;AAEA;EAJF;IAKI;;;;AAIJ;EACE;EACA;EACA;EACA;;AAEA;EANF;IAOI;IACA;IACA;;;AAGF;EACE;;AAEA;EACE;EACA;;AAGF;EACE;EACA;EACA;EAEA,OA1HK;EA2HL;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE,OArIG;EAsIH;;AAGF;EACE,OA3IG;;AA6IH;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;;AAEA;EACE;;AAMR;EACE;;AAGF;EACE;;;AAKN;EACE;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EAZF;IAaI;;;AAKF;EACE;;;AAKN;EACE;EACA;EACA;;AAEA;EACE;EACA;EACA;;AAGF;EACE;EACA;EACA,OArNO;EAsNP;;AAGF;EAlBF;IAmBI;;EAEA;IACE;;;;AAKN;EACE;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;;AAEA;EAPF;IAQI;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;;AAGF;EACE,OAlQK;EAmQL;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAEA;EACE;EACA,OAtRC;;AAyRH;EACE;EACA;;AAEA;EACE;;AAKN;EACE;EACA,OArSG;;AAwSL;EACE;EACA;EACA;EACA;EACA;;;AAMR;EACE;;;AAIA;EACE;EACA;;AAGF;EACE;EACA;EACA;EACA,OArUO;EAsUP;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAIJ;EACE;EACA;EACA;EACA,OA3VO;EA4VP;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA,OA1WO;;AA6WT;EACE,OA9WO;EA+WP;EACA;EACA;EAGA;EACA;;AAGF;EACE;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;EACA;;AAGF;EACE;EACA;EACA,OAzZO;EA0ZP;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAIJ;EACE;;AAEA;EACE;EACA;;;AAKN;EACE;;AAEA;EACE;;AAEA;EACE,OAxbK;EAybL;;;AAKN;EACE;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;;AAGF;EACE;;;AAIJ;EAKE;EACA;EACA;EACA;EACA;EACA;;AATA;EACE;;;AAWJ;EACE;EACA;EACA;EACA;;AAEA;EACE;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE,OAxfO;;AA2fT;EACE;;;AAIJ;EACE,YA/fS;EAggBT;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;;AAGF;EACE;EACA,OArhBO;EAshBP;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;;AAGF;EAzBF;IA0BI;;;;AAKN;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EACE;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA","file":"style.css"}
\ No newline at end of file
...@@ -217,25 +217,28 @@ body { ...@@ -217,25 +217,28 @@ body {
} }
} }
.thumbnail-grid li .cover { .thumbnail-grid li .cover {
display: block; display: flex;
background: #282d37; background: #282d37;
border-radius: 4px 4px 0 0; border-radius: 4px 4px 0 0;
width: 100%; width: 100%;
height: 220px; height: auto;
min-height: 220px;
text-decoration: none; text-decoration: none;
font-weight: 600; font-weight: 600;
background-size: cover; background-size: cover;
justify-content: center;
}
@media screen and (max-width: 600px) {
.thumbnail-grid li .cover {
min-height: 125px;
}
} }
.thumbnail-grid li .overlay { .thumbnail-grid li .overlay {
height: 100%; align-self: center;
} }
.thumbnail-grid li h2 { .thumbnail-grid li h2 {
color: #fff; color: #fff;
text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.35); text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.35);
position: relative;
vertical-align: middle;
top: 50%;
transform: translateY(-50%);
text-align: center; text-align: center;
font-size: 26px; font-size: 26px;
line-height: 1.58; line-height: 1.58;
......
{"version":3,"sourceRoot":"","sources":["style.scss"],"names":[],"mappings":"AAAQ;AACA;AAkBR;AAAA;AAAA;AAAA;AAKA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EAaE;EACA;EACA;EACA;EACA;EACA;;;AAGF;AACA;AAAA;EAEE;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;AAAA;EAEE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;;;AAGF;EACE;EACA;EACA;EACA,kBAhFS;EAiFT,OAlFS;EAmFT;EACA;EACA;;;AAGF;EACE,WA7Ec;EA8Ed;;AAEA;EAJF;IAKI;;;;AAIJ;EACE;EACA;EACA;EACA;;AAEA;EANF;IAOI;IACA;IACA;;;AAGF;EACE;;AAEA;EACE;EACA;;AAGF;EACE;EACA;EACA;EAEA,OA1HK;EA2HL;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE,OArIG;EAsIH;;AAGF;EACE,OA3IG;;AA6IH;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;;AAEA;EACE;;AAMR;EACE;;AAGF;EACE;;;AAKN;EACE;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EAZF;IAaI;;;AAKF;EACE;;;AAKN;EACE;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA,OAvNO;EAwNP;;AAGF;EApBF;IAqBI;;EAEA;IACE;;;;AAKN;EACE;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;;AAEA;EAPF;IAQI;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAEA;EACE;EACA,OAzRC;;AA4RH;EACE;EACA;;AAEA;EACE;;AAKN;EACE;EACA,OAxSG;;AA2SL;EACE;EACA;EACA;EACA;EACA;;;AAMR;EACE;;;AAIA;EACE;EACA;;AAGF;EACE;EACA;EACA;EACA,OAxUO;EAyUP;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAIJ;EACE;EACA;EACA;EACA,OA9VO;EA+VP;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA,OA7WO;;AAgXT;EACE,OAjXO;EAkXP;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAIJ;EACE,OAjYO;EAkYP;EACA;EACA;EACA;EACA;;AAGF;EACE;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;EACA;;AAGF;EACE;EACA;EACA,OA1aO;EA2aP;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAKF;EACE;EACA;;AAEA;AAAA;EAEE,OA/bG;;AAocT;EACE;;AAEA;EACE;EACA;;;AAKN;EACE;;AAEA;EACE;;AAEA;EACE,OArdK;EAsdL;;;AAKN;EACE;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;;AAGF;EACE;;;AAIJ;EACE;EACA;EACA;EACA;;AAEA;EACE;EACA;;AAEA;EAJF;IAKI;;;AAIJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE,OA5gBO;;AA+gBT;EACE;;;AAIJ;EACE,YAnhBS;EAohBT;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;;AAGF;EACE;EACA,OAziBO;EA0iBP;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;;AAGF;EAzBF;IA0BI;;;;AAKN;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EACE;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA","file":"style.css"} {"version":3,"sourceRoot":"","sources":["style.scss"],"names":[],"mappings":"AAAQ;AACA;AAkBR;AAAA;AAAA;AAAA;AAKA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EAaE;EACA;EACA;EACA;EACA;EACA;;;AAGF;AACA;AAAA;EAEE;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;AAAA;EAEE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;;;AAGF;EACE;EACA;EACA;EACA,kBAhFS;EAiFT,OAlFS;EAmFT;EACA;EACA;;;AAGF;EACE,WA7Ec;EA8Ed;;AAEA;EAJF;IAKI;;;;AAIJ;EACE;EACA;EACA;EACA;;AAEA;EANF;IAOI;IACA;IACA;;;AAGF;EACE;;AAEA;EACE;EACA;;AAGF;EACE;EACA;EACA;EAEA,OA1HK;EA2HL;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE,OArIG;EAsIH;;AAGF;EACE,OA3IG;;AA6IH;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;;AAEA;EACE;;AAMR;EACE;;AAGF;EACE;;;AAKN;EACE;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EAZF;IAaI;;;AAKF;EACE;;;AAKN;EACE;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA,OAvNO;EAwNP;;AAGF;EApBF;IAqBI;;EAEA;IACE;;;;AAKN;EACE;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;;AAEA;EAPF;IAQI;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EAZF;IAaI;;;AAIJ;EACE;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAEA;EACE;EACA,OA3RC;;AA8RH;EACE;EACA;;AAEA;EACE;;AAKN;EACE;EACA,OA1SG;;AA6SL;EACE;EACA;EACA;EACA;EACA;;;AAMR;EACE;;;AAIA;EACE;EACA;;AAGF;EACE;EACA;EACA;EACA,OA1UO;EA2UP;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAIJ;EACE;EACA;EACA;EACA,OAhWO;EAiWP;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA,OA/WO;;AAkXT;EACE,OAnXO;EAoXP;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAIJ;EACE,OAnYO;EAoYP;EACA;EACA;EACA;EACA;;AAGF;EACE;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;EACA;;AAGF;EACE;EACA;EACA,OA5aO;EA6aP;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAKF;EACE;EACA;;AAEA;AAAA;EAEE,OAjcG;;AAscT;EACE;;AAEA;EACE;EACA;;;AAKN;EACE;;AAEA;EACE;;AAEA;EACE,OAvdK;EAwdL;;;AAKN;EACE;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;;AAGF;EACE;;;AAIJ;EACE;EACA;EACA;EACA;;AAEA;EACE;EACA;;AAEA;EAJF;IAKI;;;AAIJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE,OA9gBO;;AAihBT;EACE;;;AAIJ;EACE,YArhBS;EAshBT;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;;AAGF;EACE;EACA,OA3iBO;EA4iBP;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;;AAGF;EAzBF;IA0BI;;;;AAKN;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EACE;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA","file":"style.css"}
\ No newline at end of file \ No newline at end of file
...@@ -247,27 +247,29 @@ body { ...@@ -247,27 +247,29 @@ body {
} }
.cover { .cover {
display: block; display: flex;
background: lighten($darkest, 4%); background: lighten($darkest, 4%);
border-radius: 4px 4px 0 0; border-radius: 4px 4px 0 0;
width: 100%; width: 100%;
height: 220px; height: auto;
min-height: 220px;
text-decoration: none; text-decoration: none;
font-weight: 600; font-weight: 600;
background-size: cover; background-size: cover;
justify-content: center;
@media screen and (max-width: 600px) {
min-height: 125px;
}
} }
.overlay { .overlay {
height: 100%; align-self: center;
} }
h2 { h2 {
color: #fff; color: #fff;
text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.35); text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.35);
position: relative;
vertical-align: middle;
top: 50%;
transform: translateY(-50%);
text-align: center; text-align: center;
font-size: 26px; font-size: 26px;
line-height: 1.58; line-height: 1.58;
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment