/* soulellis.com */ * { -moz-hyphens:none; -ms-hyphens:none; -webkit-hyphens: none; hyphens:none; } @font-face { font-family: "Arial Narrow"; src: local("Arial Narrow"); src: local("ArialNarrow"); src: local("Arial-Narrow"); src: url("/build/font/ArialNarrow.woff2") format("woff2"); 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: "Arial Narrow", ArialNarrow, Arial, sans-serif; max-width: 1750px; background-color: #ffffff; 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; box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -webkit-hyphens: none; -ms-hyphens: none; hyphenate-limit-chars: auto 3; hyphenate-limit-lines: 3; hyphens: none; } .row { display: -ms-flexbox; /* IE10 */ display: flex; -ms-flex-wrap: wrap; /* IE10 */ flex-wrap: wrap; padding: 0 4px; } /* Create four equal columns that sits next to each other */ .column { -ms-flex: 25%; /* IE10 */ flex: 25%; max-width: 100%; padding: 0 4px; } .column img { margin-top: 8px; vertical-align: middle; width: 100%; } /* 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: black; text-decoration: underline; } a:visited { color: black; text-decoration: underline; } a:hover { background-color: black; color: blueviolet; } a.nav {color: blueviolet; text-decoration: underline;} a.nav:link {color: blueviolet; text-decoration: underline;} a.nav:hover {background-color: blueviolet; color: black; text-decoration: underline;} p{ padding: 5vw; margin: 1vw; border: 2px dashed #000000; } .colorblock { border: 0px; margin: 1vw; padding: 1rem; background-color: #ff3300 } .colorblock2 { border: 0px; background-color: #000000; -moz-hyphens:none; -ms-hyphens:none; -webkit-hyphens: none; hyphens:none; } .colorblock3 { border: 0px; padding: 1.5rem; background-color: goldenrod; } .colorblock4 { border: 0px; padding: 1.5rem; background-color: rosybrown; } .colorblock5 { border: 0px; padding: 1.5rem; background-color: maroon; } .colorblock6 { border: 0px; padding: 1.5rem; background-color: deepskyblue; } .colorblock7 { text-align: center; color: black; border: 0px; background-color: deepskyblue; margin: 1rem; padding-top: 5rem; padding-bottom: 5rem; } h2{ display: block; position: relative; color: #000000; font-size: 4vw; line-height: 4.75vw; font-weight: normal; text-align: center; padding: 0; margin: 0; } h3{ display: block; position: relative; font-size: 4vw; line-height: 4.75vw; color: #000000; font-weight: normal; text-align: left; padding: 0; margin: 0; } h4{ display: block; position: relative; font-size: 2vw; line-height: 2vw; color: #000000; font-weight: normal; text-align: center; padding: 0; margin: 0; } h5{ display: block; position: relative; font-size: 8vw; line-height: 9vw; color: #000000; font-weight: normal; text-align: center; padding: 0; margin: 0; } h6{ display: block; position: relative; font-size: 3vw; line-height: 3vw; color: #000000; font-weight: normal; text-align: center; padding: 0; margin: 0; }