@import url("fonts.css"); html { background-color: #010018; color: #e4e4e4; height: 100%; } body { font-family: Open Sans,Arial; font-size: 16px; line-height: 1.4; text-align: justify; margin: 0; padding: 0; min-height: 100%; display: flex; flex-direction: column; } #head { background-color: #178ca7; display: flex; justify-content: space-between; align-items: center; margin: 0; padding: 30px 60px; color: #010018; } #head .sitetitle { font-size: 1.4em; font-weight: bold; } #head a, #head a:visited { color: #010018; } #ingredients { max-width: 800px; box-sizing: border-box; margin: 30px auto; padding: 20px; border: 1px solid #178ca7; border-radius: 10px; text-align: left; } @media screen and (min-width: 1600px) { #ingredients { float: left; max-width: 300px; margin: 0; margin-top: 30px; margin-left: 50px; margin-right: 50px; position: fixed; box-sizing: border-box; } } #ingredients .ingred-title { font-size: 1.3em; font-weight: bold; } #ingredients .ingred-portions { text-align: right; font-style: italic; } #ingredients .ingred-qt { color: #efc586; } #ingredients ul { padding-left: 25px; } #content { margin: 0 auto; max-width: 800px; padding: 2em 1em; height: 100%; } #content h1 { font-size: 1.4em; } #content h2 { font-size: 1.3em; text-indent: 2ex; } #content h3 { font-size: 1.1em; text-indent: 4ex; } #content .pagenamerow { display: flex; align-items: center; justify-content: space-between; } #content #pagename { font-size: 1.5em; font-weight: bold; } #foot { font-size: 0.7em; color: #989898; display: flex; justify-content: flex-end; align-items: center; margin: 10px 20px; margin-top: auto; } #foot > div { margin: 0 15px; } a, a:visited { color: #2081c8; text-decoration: none; } ul { list-style-type: circle; } .headbadges { display: flex; align-items: center; margin-right: 20px; margin-left: 30px; } .headbadge { padding: 10px; border-radius: 10px; font-size: 1.2em; margin-left: 10px; /* Should be overriden */ border: 2px solid; border-color: #178ca7; color: #178ca7; } .headbadge-veganness-vegan { border-color: #40d540; color: #40d540; } .headbadge-veganness-veganisable { border-color: #bfce2a; color: #bfce2a; } .headbadge-veganness-vege { border-color: #ce8649; color: #ce8649; } .headbadge-season-winter { border-color: #02bace; color: #02bace; } .headbadge-season-summer { border-color: #ff3838; color: #ff3838; } .badges { display: inline-block; margin-left: 0.5ex; } .badge { font-weight: bold; display: inline-block; border: 2px solid black; padding: 0 0.5ex; border-radius: 1.5ex; margin: 0.2ex 0; margin-left: 0.6ex; font-size: 0.7em; position: relative; bottom: 0.2ex; } .badge-veganness-vegan { border-color: #40d540; color: #40d540; } .badge-veganness-veganisable { border-color: #bfce2a; color: #bfce2a; } .badge-veganness-vege { border-color: #ce8649; color: #ce8649; } .badge-season-winter { border-color: #02bace; color: #02bace; } .badge-season-summer { border-color: #ff3838; color: #ff3838; }