125 lines
1.9 KiB
CSS
125 lines
1.9 KiB
CSS
:root{
|
|
--text: #729b78;
|
|
--backing: white;
|
|
}
|
|
|
|
body{
|
|
background-image: url("wallpaper.png");
|
|
background-size: 250px;
|
|
color: var(--text);
|
|
}
|
|
|
|
header, article, section{
|
|
background-color: var(--backing);
|
|
padding: 10px;
|
|
border-radius: 0 0 0px 0px;
|
|
}
|
|
|
|
main{
|
|
border-radius: 0 0 0px 0px;
|
|
width: 60vw;
|
|
margin: auto;
|
|
margin-top: 15px;
|
|
margin-bottom: 20vh;
|
|
padding: 5px;
|
|
text-align: center;
|
|
}
|
|
|
|
ul{
|
|
text-align: left;
|
|
margin: 10px 20% 10px 20%;
|
|
}
|
|
|
|
/*
|
|
NAV BAR
|
|
*/
|
|
|
|
nav{
|
|
display:flex;
|
|
flex-direction: row;
|
|
justify-content: center;
|
|
background-color: var(--backing);
|
|
color: var(--text);
|
|
font-size: 1.5rem;
|
|
gap: 20px;
|
|
|
|
padding: 10px;
|
|
margin-top: 20vh;
|
|
}
|
|
|
|
nav a{
|
|
font-size: 1.5rem;
|
|
color: var(--text);
|
|
text-decoration: none;
|
|
border-bottom: solid var(--text) 0px;
|
|
transition: border-bottom 0.1s,font-size 0.7s;
|
|
}
|
|
nav a:hover{
|
|
font-size: 1.6rem;
|
|
border-bottom: solid var(--text) 2px;
|
|
}
|
|
nav a:visited{
|
|
color: var(--text);
|
|
text-decoration: none;
|
|
}
|
|
|
|
table{
|
|
margin: auto;
|
|
width: 80%;
|
|
font-size: 1rem;
|
|
}
|
|
|
|
.white_backing{
|
|
background-color: var(--backing);
|
|
padding-bottom: 20px;
|
|
}
|
|
|
|
.hover_rotate{
|
|
transition: transform 0.25s;
|
|
}
|
|
.hover_rotate:hover{
|
|
transform: rotate(5deg);
|
|
}
|
|
|
|
@media screen and (max-width:1000px){
|
|
|
|
table{
|
|
width: 80%;
|
|
font-size: 1.5rem;
|
|
}
|
|
|
|
table, th, td{
|
|
/* border: 2px solid; */
|
|
/* border-radius: 5px; */
|
|
/* border-collapse: collapse; */
|
|
}
|
|
|
|
header, article, section{
|
|
background-color: var(--backing);
|
|
padding: 10px;
|
|
padding-bottom: 20px;
|
|
border-radius: 0 0 0px 0px;
|
|
}
|
|
|
|
main{
|
|
width: 90vw;
|
|
font-size:2rem;
|
|
}
|
|
|
|
|
|
nav a{
|
|
font-size: 2.5rem;
|
|
color: var(--text);
|
|
text-decoration: none;
|
|
border-bottom: solid var(--text) 0px;
|
|
transition: border-bottom 0.1s,font-size 0.7s;
|
|
}
|
|
nav a:hover{
|
|
font-size: 2.6rem;
|
|
border-bottom: solid var(--text) 2px;
|
|
}
|
|
|
|
ul{
|
|
margin: 10px;
|
|
}
|
|
}
|