fredboniface.co.uk/css/styles.css
2022-10-10 21:29:01 +01:00

138 lines
2.3 KiB
CSS

html {
height: 100%;
}
body {
min-height: 100%;
background-color: #444444;
}
.page-title {
text-align: center;
font-family: cursive;
color: #eeeeee;
padding-top: 65px;
padding-bottom: 10px;
width: 95%;
overflow: hidden;
margin: auto;
}
.title-image img {
max-width: 30%;
padding-top: 30px;
padding-bottom: 30px;
margin-left: 35%;
margin-right: 35%;
}
.page-main-content {
text-align: center;
font-family: sans-serif;
color: #f0f0f0f0;
width: 95%;
overflow: hidden;
margin: auto;
}
.page-main-content h2 {
padding-top: 45px;
}
footer {
background-color: rgb(61, 61, 61);
color: #eeeeee;
font-family: monospace;
text-align: center;
width: 100%;
position: fixed;
bottom: 0;
left: 0;
}
/* The sidebar menu */
.sidebar {
height: 100%;
width: 0; /* Hidden by default */
position: fixed;
z-index: 1;
top: 0;
right: 0;
background-color: #111;
overflow-x: hidden; /* Disable horizontal scroll */
padding-top: 60px; /* Place content 60px from the top */
transition: 0.5s; /* 0.5 second transition effect to slide in the sidebar */
}
/* The sidebar links */
.sidebar a {
padding: 8px 8px 8px 32px;
text-decoration: none;
text-align: right;
font-size: 25px;
color: #818181;
display: block;
transition: 0.3s;
}
/* When you mouse over the navigation links, change their color */
.sidebar a:hover {
color: #f1f1f1;
}
/* Position and style the close button (top right corner) */
.sidebar .close {
position: absolute;
top: 0;
right: 25px;
font-size: 36px;
margin-left: 50px;
}
/* Position the div containing the open button */
.inflate {
position: absolute;
top: 10px;
right: 10px;
}
/* The button used to open the sidebar */
.open {
font-size: 20px;
cursor: pointer;
background-color: rgba(0, 0, 0, 0);
color: white;
padding: 10px 15px;
border: none;
}
.open:hover {
background-color: #444;
}
/* Display menu bar on arger screens */
@media screen and (min-width: 600px) {
/*Hide sidebar open/close buttons*/
.inflate {display: none;}
.sidebar .close {display: none;}
/*Change Menu Dimensions*/
.sidebar {
width: 100%;
height: 10px;
padding-top: 30px;
padding-bottom: 15px;
padding-left: 50px;
}
/* Float links */
.sidebar a {
float: left;
padding-top: 10px;
}
.sidebar a:first-child {
margin-left: 30px;
}
}