conex-pages/themes/default/static/css/default.css
2023-12-26 02:52:04 -06:00

108 lines
1.6 KiB
CSS

/* PROPERTIES */
html,body {
font-family: sans-serif;
margin: 0 auto;
height: 100%;
}
body {
display: flex;
flex-direction: column;
}
/* HEADER */
.banner {
box-shadow: 0 15vh 30vh black inset;
background-position: 50%;
background-size: cover;
margin-bottom: 4vh;
height: 30vh;
}
div.desc {
vertical-align: middle;
text-align: center;
padding: 10px;
}
div.banner h1 {
font-size: min(8cqw, 5em);
margin-top: 8vh;
line-height: 1vh;
color: white;
}
div.banner p {
font-size: min(3cqw, 1em);
color: white;
}
/* SEARCH */
div.search {
text-align: center;
margin-bottom: 4vh;
}
input {
background-color: #dcdcdc;
border-radius: 50px;
border-style: solid;
border-color: white;
border-width: 1px;
text-align: left;
max-width: 500px;
width: 90%;
padding: 1.1rem;
font-size: 1em;
}
/* CARDS */
div.cardscontainer {
grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
display: grid;
line-height: 0.6em;
margin: 0 auto;
width: 90%;
}
div.card {
color: black;
border-radius: 10px;
padding: 1px 15px;
margin-bottom: 2vh;
}
div.card h2,a {
text-decoration: none;
}
div.card:hover {
transition: all 0.3s ease 0s;
background-color: #dcdcdc;
}
/* CONTENT */
.content {
flex: 1 0 auto;
margin: 0 auto;
max-width: 800px;
width: 90%;
margin-bottom: 4vh;
}
/* FOOTER */
footer {
background-color: #dcdcdc;
color: #757575;
text-align: center;
width: 100%;
margin: 0 auto;
padding-top: 2vh;
padding-bottom: 2vh;
}