assets/css/style.css (117 lines of code) (raw):

.site-title { text-align: center; font-size: 3.5rem; /* Adjust the font size as needed */ font-family: "Arial", sans-serif; /* Replace with your desired font */ margin-top: 15px; margin-bottom: 0; } .title { text-align: center; /* Adjust the margin as needed */ margin: 30px auto; max-width: 1390px; /* Adjust the maximum width as needed */ margin-left: 20px; /* Move the title slightly to the left */ } .title h2 { font-size: 2rem; /* Adjust the font size as needed */ } .centered-paragraph { text-align: center; margin: 50px auto; /* Adjust the margin as needed */ max-width: 800px; /* Adjust the maximum width as needed */ font-size: 1.25rem; } .navigation { display: flex; justify-content: center; list-style: none; padding: 0; } .navigation { display: flex; justify-content: center; list-style: none; padding: 10px 0; /* Add padding to the top and bottom */ border-top: 2px solid black; /* Border on top */ border-bottom: 2px solid black; /* Border on bottom */ margin: 0 auto; /* Center the navigation menu */ max-width: 850px; /* Adjust the maximum width as needed */ } body { margin: 0; padding: 0; display: flex; flex-direction: column; min-height: 100vh; background-color: #dfebec; /* Replace with your desired light gray color */ } .footer { display: flex; justify-content: center; list-style: none; padding: 0; margin-top: auto; background-color: #8B9EB7; padding: 20px; flex-grow: 1; } .flex-wrapper { display: flex; min-height: 100vh; flex-direction: column; justify-content: space-between; } .footer li { margin: 0 1rem; position: relative; } .footer li a { text-decoration: none; /* Remove underline */ font-size: 1.2rem; /* Adjust the font size as needed */ color: black; /* Change the color to blue */ font-family: "Arial", sans-serif; } .navigation li { margin: 0 1rem; position: relative; } .navigation li a { text-decoration: none; /* Remove underline */ font-size: 1.2rem; /* Adjust the font size as needed */ color: #192A51; font-family: "Arial", sans-serif; } .navigation li:not(:last-child)::after { content: ""; position: absolute; top: 50%; left: calc(100% + 16px); /* Position lines outside the links */ transform: translateY(-50%); height: calc(160% - 8px); /* Adjust the height of the lines */ width: 2px; background-color: black; /* Line color */ font-weight: bold; /* Make the lines bold */ } .container { background-color: #8B9EB7; padding: 20px; display: flex; justify-content: center; align-items: center; } .logo { position: relative; margin-right: auto; margin-left: auto; text-align: center; } .logo img { max-width: 100%; height: 7.5rem; } .support-image img{ position: absolute; top: 20px; right: 20px; width: 100px; height: auto; }