body {
overflow-x: hidden; background-color: #fff;
}
.grid-container {
display: grid; grid-template-areas: "menu header header header header header" "menu main main main main main" "menu footer footer footer footer footer"; grid-gap: 10px; padding: 10px;
}
/*Banner styling section*/ /* HEADER/BANNER */ body, html {
height: 100%; background-color: #fff;
}
/* The banner image */ .banner-image {
/* Use "linear-gradient" to add a darken background effect to the image (photographer.jpg). This will make the text easier to read */ background-image: linear-gradient( to bottom, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.5) 100% ), url(""); /* Set a specific height */ height: 65vh; /* Position and center the image to scale nicely on all screens */ background-position: center; background-repeat: no-repeat; background-size: cover; position: relative; background-attachment: fixed; margin-top: ;
}
/* Place text in the middle of the image */ .banner-text {
font-size: ; font-weight: ; color: ; text-align: center; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);
}
.banner-text h1 {
color: #f1c23f; font-size: 5em; font-weight: 600; font-family: "Public Sans", sans-serif; margin-top: 25%;
}
.container2 h2 {
color: #000; /*changes h2 text color to black in the div class container2.*/ font-weight: 200;
}
.container1 {
grid-area: header; margin-left: -20px; margin-right: -20px; margin-top: -20px;
}
/*Main section styling*/ .container2 {
grid-area: main; background: ; padding: 7vw 10vw; background-color: #fff; margin-left: -10px; margin-top: -10px;
}
.hp-name {
font-weight: bold; color: #882916;
}
.hp-org {
font-style: italic;
}
.ind {
margin-top: 30px; margin-bottom: 30px;
}
.section {
margin-bottom: 40px;
}
- tm {
padding-top: 10px;
}
- hp {
padding-top: 20px;
}
- gs {
padding-top: 20px;
}
- gw {
padding-top: 20px;
}
- dl {
padding-top: 20px;
}
- en {
padding-top: 20px;
}
- ed {
padding-top: 20px;
}
.last-section {
padding-bottom: 40px;
} /* Sidebar styling section */ .container3 {
grid-area: menu;
}