Files
jc-ng/src/static/style/mobile.css
2025-01-04 00:17:15 +00:00

170 lines
2.5 KiB
CSS

body{
margin: 0;
color: #e5e5e5;
font-family: "Noto Sans", sans-serif;
background-color: rgba(23, 22, 20, 1);
}
h1, h2, h3{
font-family: "Orbitron", sans-serif;
font-optical-sizing: auto;
font-weight: 500;
font-style: normal;
}
header{
background-color: 4c4c4c;
height: 25vh;
width: 100%;
}
footer{
background-color: 4c4c4c;
display: flex;
justify-content: center;
align-items: center;
height: 10vh;
}
#logo-container{
width: 100%;
justify-content: center;
display: flex;
}
#logo{
text-align: center;
margin: 0 auto 0 auto;
}
#logo>a{
text-decoration: none;
}
footer h2, section h2{
margin: 0;
}
#technology{
background-image: url(../images/njr-code.png);
height: 100vh;
margin: 0;
background-position: center;
background-position-x: -400px;
}
#motorsport{
background-image: url(../images/topfuel_startline.jpg.jpeg);
height: 100vh;
margin: 0;
background-position: center;
background-position-x: -65px;
background-position-y: -90px;
background-size: 200%;
}
.gradient{
width: 100%;
height: 100%;
background-image: linear-gradient(to top, rgba(23, 22, 20, 1) 70%, rgba(23, 22, 20, 0));
display: flex;
align-items: flex-end;
}
.text{
height: 70%;
width: 100%;
}
.text>div{
padding: 30px;
}
.button{
padding: 10px;
border: 1px solid #e5e5e5;
border-radius: 10px;
text-decoration: none;
color: #e5e5e5;
}
.button:hover{
color: rgba(23, 22, 20, 1);
background-color: #e5e5e5;
}
.social{
text-align: center;
padding: 20px;
font-size: 1.5rem;
}
a{
color: #e5e5e5;
}
#projects{
align-items: center;
display: flex;
flex-direction: column;
}
.project{
width: 80vw;
border: 2px solid #e5e5e5;
margin: 10px;
}
.project-thumb{
max-width: 100%;
max-height: 100%;
}
#filter {
float: right;
}
#top-nav{
width: 100%;
text-align: center;
padding-bottom: 30px;
padding-top: 20px
}
#top-nav>a{
text-decoration: none;
padding: 0 10px 0 10px;
font-weight: bold;
}
#top-nav>a:hover{
text-decoration: underline;
}
#error-container{
display: flex;
align-items: center;
justify-content: center;
height: 65vh;
}
#error{
text-align: center;
}
#project-main{
padding: 0 10px 0 10px;
min-height: 65vh;
}
.project-text{
padding: 10px;
}
.article-category{
text-decoration: none;
}
.article-category:hover{
text-decoration: underline;
}