:root {
    font-size: 1em;
}



* {
	margin: 0;
	padding: 0;
}

html {
	font-family: -apple-system, BlinkMacSystemFont, "Roboto", "Helvetica Neue", sans-serif;
}

body {
	background: #444;
	text-align: center;
}

main {
    max-width: 27.5rem;
    width: calc(100% - 2.5rem);
	margin-left: 2.5rem;

	box-sizing: border-box;
	padding: 2rem 0 1rem;

	background: #fff;
	border-bottom-left-radius: 1rem;
	border-bottom-right-radius: 1rem;

	color: #000;
	font-size: 0.8rem;
	line-height: 140%;
	text-align: left;

    overflow: hidden;
}

@media (max-width: 30rem) {
    main {
        width: 100%;
        max-width: initial;
        margin: 0;
        border-radius: 0;
    }
}


h1 {
    white-space: nowrap;
    padding: 0 1rem;
	color: #000;
	font-size: 2rem;
	font-weight: bold;
	text-transform: lowercase;
    margin-bottom: 1rem;
}
h1 em {
	color: #aaa;
}
h1 svg {
    position: relative;
	top: -0.5rem;
	width: 2.5rem;
	vertical-align: middle;
	fill: #367ebd;
}

main > h2 {
    padding: 4rem 1rem 0.5rem;
    text-transform: lowercase;
    font-size: 1.4rem;
    color: #aaa;
}
main > p {
    padding: 0 1rem;
    font-size: 0.8rem;
}

article {
    display: inline-block;
    margin: 1rem 1rem 0 1rem;
    width: calc(100% - 2rem);
    max-width: 30rem;
}
article a {
    display: grid;
    grid-template-columns: 5rem auto;
    grid-template-rows: 1rem auto;
    grid-gap: 1rem;

    color: #000;
    text-decoration: none;
}
article h2 {
    grid-column: 2 / 3;
    color: #367ebd;
    font-size: 1.4rem;
    text-transform: lowercase;
}
article p {
    grid-column: 2 / 3;
    font-size: 0.8rem;
    padding-right: 1rem;
}
article img {
    border-radius: 0.5rem;
    grid-column: 1 / 2;
    grid-row: span 2;
    width: 5rem;
}




/* Github link */

#about {
	display: block;
    padding: 4rem 0 2.5rem 2.5rem;
    text-align: left;
}
#about a {
	font-size: 0.8rem;
	text-decoration: none;
	color: #999;
}
#about svg {
	display: inline-block;
	height: 1.3rem;
	vertical-align: bottom
}
#about svg path {
	fill: currentColor;
	fill-rule: evenodd;
}
#about:hover svg path {
	color: #cc174d;
}