html, body { min-width: 100vw; min-height: 100vh; } body { background-color: black; color: snow; } a:hover { font-weight: 500; } .title-page a { font-size: min(6vw,40px); animation: 3s ease-out 0s 1 fadeIn; color: snow; } .title-page a:hover { color: snow; } .shift-left { margin-right: 60%; text-align: end; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; } .shift-right { margin-left: 60%; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; } .title-page>h1 { font-size: 12vw; height: 12vh+12vw; font-family: "Times New Roman", Times, serif; text-align: center; padding-left: 7vw; padding-bottom: 5vw; } .lift { display: inline-block; } .lift.anim { animation: 3s ease-out 0s 1 slideDown; } .drop { display: inline-block; position: relative; transform: translateY(50%); } .drop.anim { animation: 3s ease-out 0s 1 slideInFromRight; } .title-desc { animation: 6s ease-out 0s 1 fadeIn; } @keyframes slideDown { 0% { transform: translate(50%); opacity: 0.0; } 50% { transform: translateY(50%); opacity: 0.0; } 100% { transform: translateY(0); opacity: 1.0; } } @keyframes slideInFromRight { 0% { transform: translate(50%, 50%); opacity: 0.0; } 50% { transform: translate(50%, 50%); opacity: 0.0; } 100% { transform: translateY(0, 50%); opacity: 1.0; } } @keyframes fadeIn { 0% { opacity: 0.0; } 50% { opacity: 0.0; } 100% { opacity: 1.0; } } .title-page p { font-size: max(16px, 1vw); } .warn { padding-top: 25vh; height: 100%; } .warn h1 { font-size: max(48px, 4vw); } .warn p { font-size: max(18px, 1.5vw); } .warn a { font-size: max(24px, 2vw); color: snow; } .list h1 { font-size: max(2.5vw, 40px); } .list p { font-size: max(2vw, 30px); } .list li { font-size: max(1.5vw, 25px); } @media only screen and (max-width: 500px) { .list .date { display: none; } } .page { background-color: floralwhite; /* background-image: linear-gradient(to right,rgba(0,0,0,1) 0%, rgba(255,255,255,1) 3%, rgba(255,255,255,1) 97%, rgba(0,0,0,1) 100%); */ width: 100%; color: black; filter: drop-shadow(0 0 30px white); } .page article { min-height: 95vh; padding-left: 5%; padding-right: 5%; padding-top: 2vh; padding-bottom: 3vh; } .page a { color: black; } .page a:hover { color: black; } .header { width: 100%; display: none; } .header .page { filter: none; padding-bottom: 5vh; } @media only screen and (min-width: 993px) { .header.large { display: initial; } } @media only screen and (min-width: 768px) and (max-width: 992px) { .header.medium { display: initial; } } @media only screen and (max-width: 767px) { .header.small { display: initial; } } .navbar { padding-left: 10px; } nav span, nav a { font-size: max(30px,2vw); } nav.bg-dark span, nav.bg-dark a { color: ivory; } nav .logo { text-decoration: none; } nav .logo:hover { font-weight: initial; } nav .spacer { margin-left: 1vw; margin-right: 1vw; } .footer { margin-top: 5vh; }