#logo { display: inline-block; float: center; height: 7.0vmax; width: auto; /* correct proportions to specified height */ } * { box-sizing: border-box; } /* Header/Blog Title */ .header { padding: 0px; font-size: 40px; text-align: center; background: gold radial-gradient(lightgreen, green); } body { font-family: "Verdana", sans-serif; background: gold radial-gradient(lightgreen, green); } ul { list-style-type: none; margin: 2px; padding: 0; overflow: hidden; background-color: #333; border-radius: 25px; float: center; } li { float: left; } li a { display: block; color: white; text-align: center; padding: 15px 35px; text-decoration: none; font-size: 3.0vmin; } @media only screen and (max-width: 1000px) { li a { display: block; color: white; text-align: center; padding: 15px 35px; text-decoration: none; font-size: 3.0vmax; } } li a:hover:not(.active) { background-color: #111; } /* Add a card effect for articles */ .content { color: white; background-color: #333; padding: 1.5em; margin-top: 1.5em; border-radius: 1.1em; font-size: 2.0vmin; } @media only screen and (max-width: 1000px) { .content { color: white; background-color: #333; padding: 1.5em; margin-top: 1.5em; border-radius: 1.1em; font-size: 2.0vmax; } } .active { background-color: #04AA6D; } .footer { color: white; background-color: #333; padding: 1em; margin-top: 1em; font-size: 2.0vmin; } @media only screen and (max-width: 1000px) { .footer { color: white; background-color: #333; padding: 1em; margin-top: 1em; font-size: 2.0vmax; } } /* URL color */ a { color: lightgreen; } /* Dropdown button */ .dropdown .dropbtn { display: block; border: none; color: white; text-align: center; padding: 15px 35px; text-decoration: none; font-size: 3.0vmin; background-color: inherit; } @media only screen and (max-width: 1000px) { .dropdown .dropbtn { border: none; display: block; color: white; text-align: center; padding: 15px 35px; text-decoration: none; font-size: 3.0vmax; background-color: inherit; } } /* Dropdown content (hidden by default) */ .dropdown-content { display: none; position: absolute; background-color: #333; min-width: 160px; box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2); z-index: 1; } /* Links inside the dropdown */ .dropdown-content a { float: none; color: white; padding: 12px 16px; text-decoration: none; display: block; text-align: left; } /* Add a grey background color to dropdown links on hover */ .dropdown-content a:hover { background-color: #ddd; } /* Show the dropdown menu on hover */ .dropdown:hover .dropdown-content { display: block; } input[type="submit"] { display: block; color: white; background-color: #04aa6d; text-align: center; padding: 5px 15px; text-decoration: none; font-size: 2.0vmin; border-radius:1.1em; border-color:green; }