:root{ --body-bg: inherit/*var(--silver)/*linear-gradient(to bottom, #AEB2B8, #C7C9CB, #D7D7D8, #D7D7D8, #C7C9CB, #AEB2B8, #959BA3)*/; --body-bg-color: rgba(0,0,0,0); --body-font: Fira; --header-bg: default/*linear-gradient(rgba(0,0,0,0), rgba(0,0,0,0), rgba(0,0,0,0), rgba(0,0,0,0.2))*/; --header-bg-color: var(--azure); --header-color: #D8D8D8; --header-fontsize:250%; --header-font: Beleren; --footer-bg:inherit; --footer-bg-color: #333333; --footer-color:white; --footer-fontsize:150%; --footer-font: inherit; --nav-bg:/*inherit;*/var(--silver); --nav-bg-color: inherit; --nav-color: var(--azure); --nav-fontsize:125%; --nav-font: inherit; --navtab-default-bg: inherit; --navtab-default-bg-color: var(--shadow-gradient); --navtab-default-color: inherit; --navtab-hover-bg: inherit; --navtab-hover-bg-color: var(--darker-gradient); --navtab-hover-color: inherit; --navtab-active-bg: inherit; --navtab-active-bg-color: var(--lighter-gradient); --navtab-active-color: inherit; --main-bg: inherit; --main-bg-color: white; --main-color: black; --main-fontsize:100%; --main-font: inherit; --hr-border: 2px solid black; } body{ background: var(--body-bg); background-color: var(--body-bg-color); background-repeat: no-repeat; background-attachment: fixed; font-family: var(--body-font); } header{ background: var(--header-bg); background-color: var(--header-bg-color); color: var(--header-color); font-size: var(--header-fontsize); font-family: var(--header-font); /*text-shadow: 1px 0 2px black, -1px 0 2px black, 0 1px 2px black, 0 -1px 2px black;*/ } .silver-text{ background: var(--silver); background-clip: text; -webkit-background-clip: text; -moz-background-clip: text; -moz-text-fill-color: transparent; -webkit-text-fill-color: transparent; } nav{ background-color: var(--nav-bg-color); background: var(--nav-bg); color: var(--nav-color); font-size: var(--nav-fontsize); font-family: var(--nav-font); } main{ background: var(--main-bg); background-color: var(--main-bg-color); color: var(--main-color); font-size: var(--main-fontsize); font-family: var(--main-font); text-align: justify; text-justify: inter-word; padding:20px; } footer{ background: var(--footer-bg); background-color: var(--footer-bg-color); color: var(--footer-color); font-size: var(--footer-fontsize); font-family: var(--footer-font); } .copyright{ font-size:60%; } a{ color:var(--azure); text-decoration:underline; } .nav-tab{ background: var(--navtab-default-bg); background-color: var(--navtab-default-bg-color); color: var(--navtab-default-color); padding-top: 5px; padding-bottom: 5px; border-left: 1.5px solid #000; border-right: 1.5px solid #000; border-top: 1.5px solid #000; border-bottom: 1.5px solid #000; border-spacing:2.5px; border-radius: 10px; } .nav-tab:hover{ background: var(--navtab-hover-bg); background-color: var(--navtab-hover-bg-color); color: var(--navtab-hover-color); } .nav-tab:active{ background: var(--navtab-active-bg); background-color: var(--navtab-active-bg-color); color: var(--navtab-active-color); } h1{ text-align:left; /*margin-left:auto; margin-right:auto;*/ font-size:150%; } h2{ text-align:left; /*margin-left:auto; margin-right:auto;*/ font-size:120%; margin-top:1rem; margin-bottom:0.5rem; } hr{ border: none; border-top: var(--hr-border); } article{ font-size:130%; line-height:130%; } ul{ list-style-type: disc; } ul li ul{ list-style-type: circle; /*Nested list*/ } u{ text-underline-offset: 0.14em; /*Without this, underlines won't show under descender characters (g,y,j,p,q)*/ } .list-key{ font-weight:bold; } .list-album{ display:inline-block; margin:0.75em; text-align:center; padding:0; } .list-album-cover{ width:10em; height:10em; margin:0; }