/* Google Fonts */
@import url('https://fonts.googleapis.com/css2?family=Pattaya&family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap');


/* -- BaseStyle -- */

* { box-sizing: border-box } 
html { font-size: 62.5%; }
body { font-family: 'Roboto', sans-serif; margin: 0; background-color: #fefefe; font-size: 1.6rem; height: 100%; padding: 20px; background-color: #f4f4f4; }
img { width: 100%; height: auto; display: block; }
a:link, a:visited, a:active { color: #00607B; text-decoration: none; }
a:hover, a:focus { text-decoration: underline; }
strong { font-weight: 500; }

/* Link with icon */
a.urlicon { text-align: left; padding-left: 3rem; display: inline-block; background: no-repeat left url('icons/link_FILL0_wght400_GRAD0_opsz24.svg'); }
a .trunk { display: inline-block; vertical-align: text-bottom; max-width: 55px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; text-decoration: underline; margin:0; }
a .break { word-break: break-all; }

/* -- SiteLayout-- */

.siteheader { /* border-bottom: 4px solid #bbb; */ margin: 1rem auto 2rem; max-width: 2100px; }
h1 { text-align: left; font-size: 3rem; font-weight: 400; color: #a42545; margin: 0 0 2rem; font-family: 'Pattaya', sans-serif; }
.headerbody { text-align: left; max-width: 90ch; font-size: 1.8rem; line-height: 1.4; }
.content { margin: 0 auto; max-width: 2100px; }

/* -- MediaQueries -- */

@media (min-width:400px) {
	body { font-size: 1.8rem; }
	h1 { font-size: 5rem; }
}

@media (min-width:730px) {
	h1 { font-size: 7rem; }
	.headerbody { font-size: 2.2rem; }
}