You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
201 lines
2.9 KiB
CSS
201 lines
2.9 KiB
CSS
@font-face {
|
|
font-family: 'jgs7';
|
|
src: url("https://hub.xpub.nl/sandbot/~eunalee/flaskplay/templates/jgs7.ttf");
|
|
}
|
|
|
|
body{
|
|
font-family: 'jgs7', monospace;
|
|
background-color: green;
|
|
font-size: 1.1rem;
|
|
color: green;
|
|
margin-top: 0;
|
|
}
|
|
|
|
|
|
|
|
button{
|
|
background-color: green;
|
|
margin-left: 0.3rem;
|
|
margin-bottom: 0.5rem;
|
|
padding: 0.5rem 1rem;
|
|
border: 2px solid green;
|
|
font-size: 1.1rem;
|
|
color: white;
|
|
cursor: pointer;
|
|
font-family: 'jgs7', monospace;
|
|
}
|
|
|
|
button:hover{
|
|
background-color: white;
|
|
color: green;
|
|
}
|
|
|
|
button:active {
|
|
background-color: #f44082;
|
|
color: white;
|
|
border-color: #f44082;
|
|
}
|
|
|
|
|
|
|
|
a{
|
|
font-family: 'jgs7', monospace;
|
|
text-decoration: none;
|
|
color: white;
|
|
}
|
|
|
|
|
|
|
|
pre{
|
|
font-family: 'jgs7', monospace;
|
|
margin-top: 0;
|
|
line-height: 1.1rem;
|
|
text-align: left;
|
|
}
|
|
|
|
.input{
|
|
height: 1.1rem;
|
|
font-family: "jgs7";
|
|
}
|
|
|
|
input[type=submit]{
|
|
background-color: white;
|
|
margin-left: 5px;
|
|
margin-bottom: 5px;
|
|
padding: 5px 15px;
|
|
border: 2px solid green;
|
|
font-size: 1.1rem;
|
|
color: green;
|
|
cursor: pointer;
|
|
font-family: "jgs7";
|
|
}
|
|
|
|
/* .box{
|
|
width: 100%;
|
|
text-align: center;
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items:center;
|
|
min-height: 100vh;
|
|
}
|
|
*/
|
|
|
|
.box{
|
|
position: relative;
|
|
margin: 0 auto;
|
|
}
|
|
|
|
.cnt{
|
|
position: absolute;
|
|
top: 0%;
|
|
left: 50%;
|
|
transform:translate(-50%, 0);
|
|
background-color: white;
|
|
padding: 3% 5%;
|
|
min-height: 1200px;
|
|
}
|
|
|
|
|
|
.txt{
|
|
line-height: 1.8rem;
|
|
/* width: 60%;
|
|
margin-left: 10%;
|
|
margin-top: 5%; */
|
|
text-align: center;
|
|
max-width: 836px;
|
|
}
|
|
|
|
.letter{
|
|
line-height: 1.5rem;
|
|
}
|
|
|
|
.left{
|
|
color: white;
|
|
position: fixed;
|
|
left: 0;
|
|
top: 0;
|
|
height: 100%;
|
|
width: 15%;
|
|
padding: 3%;
|
|
max-width: 476.05px;
|
|
}
|
|
|
|
.right{
|
|
color: white;
|
|
position: fixed;
|
|
right:0;
|
|
top:0;
|
|
height: 100%;
|
|
width: 15%;
|
|
padding: 3%;
|
|
}
|
|
|
|
.right p{
|
|
position: fixed;
|
|
top: 90%;
|
|
right: 3%;
|
|
}
|
|
|
|
.left pre:hover{
|
|
cursor: pointer;
|
|
}
|
|
|
|
.left pre:hover > .petit{
|
|
color: #f44082;
|
|
}
|
|
|
|
.left pre:active > .grr{
|
|
color: green;
|
|
}
|
|
|
|
.left pre:active {
|
|
transform: translateY(10px) translateX(10px);
|
|
}
|
|
|
|
|
|
@media only screen and (max-width: 600px) {
|
|
body {
|
|
width: 90%;
|
|
font-size: 2vw;
|
|
}
|
|
|
|
button{
|
|
font-size: 2vw;
|
|
padding: 1vw 1vw;
|
|
margin-bottom: 0.3rem;
|
|
margin-left: 0.2rem;
|
|
/*margin: 1vw;*/
|
|
/*padding: 1vw;*/
|
|
}
|
|
|
|
table, th, td{
|
|
border: 1px solid green;
|
|
padding: 1vw;
|
|
text-align: center;
|
|
}
|
|
|
|
table{
|
|
width: 12rem;
|
|
}
|
|
|
|
.cnt {
|
|
width: 100%;
|
|
margin-left: 0;
|
|
}
|
|
|
|
.txt{
|
|
margin: 5%;
|
|
line-height: 3vw;
|
|
}
|
|
|
|
.right{
|
|
display: none;
|
|
}
|
|
|
|
.left{
|
|
display: none;
|
|
}
|
|
|
|
|
|
|
|
} |