/* soulellis.com */ @font-face { font-family: "ArialNarrow"; src: url('/build/font/ArialNarrow.woff') format('woff'), src: url('/build/font/ArialNarrow.ttf') format('truetype'); font-weight: normal; font-style: normal; } html, body{ padding: 0px; margin: 0px; font-size: 15px; font-family: "ArialNarrow", ArialNarrow, Arial, sans-serif; max-width: 1750px; background-color: #100000; box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; } body{ min-height: 100vh; padding-bottom: 4rem; padding-top: 2rem; padding-left: 2rem; padding-right: 2rem; } div{ padding: 0px; margin: 0px; line-height: 6rem; box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -webkit-hyphens: auto; -ms-hyphens: auto; hyphenate-limit-chars: auto 3; hyphenate-limit-lines: 3; hyphens: auto; } /* Responsive layout - makes a two column-layout instead of four columns */ @media screen and (max-width: 100%) { .column { -ms-flex: 50%; flex: 50%; max-width: 50%; } } /* Responsive layout - makes the two columns stack on top of each other instead of next to each other */ @media screen and (max-width: 800px) { .column { -ms-flex: auto%; flex: auto; max-width: auto; } } a{ color: #cccccc; text-decoration: none; } a:link { color: #9900ff; text-decoration: underline; } a:hover { background-color: #9900ff; color: #000000; } a:visited { color: #9900ff; text-decoration: none; } a:hover { background-color: #9900ff; color: #000000; } h2{ display: block; position: relative; color: #9900ff; font-weight: normal; text-align: left; padding: 0; margin: 0; } h3{ display: block; position: relative; font-size: 4rem; line-height: 4.5rem; color: #9900ff; font-weight: normal; text-align: left; padding: 0; margin: 0; } h4{ display: block; position: relative; font-size: 1rem; line-height: 1.5rem; color: #9900ff; font-weight: normal; text-align: center; padding: 0; margin: 0; }