494 lines
8.9 KiB
CSS
494 lines
8.9 KiB
CSS
/*
|
|
This file could be used under both CC-BY-SA 4.0 or at your chosing GNU GPLv3 or any later version
|
|
*/
|
|
|
|
html {
|
|
background: linear-gradient(
|
|
135deg,
|
|
#1a1b26 0%,
|
|
#24283b 25%,
|
|
#2f3553 50%,
|
|
#24283b 75%,
|
|
#1a1b26 100%
|
|
) fixed;
|
|
background-size: 400% 400%;
|
|
animation: gradientBG 15s ease infinite;
|
|
}
|
|
|
|
@keyframes gradientBG {
|
|
0% {
|
|
background-position: 0% 50%;
|
|
}
|
|
50% {
|
|
background-position: 100% 50%;
|
|
}
|
|
100% {
|
|
background-position: 0% 50%;
|
|
}
|
|
}
|
|
|
|
* {
|
|
font-size: 15px;
|
|
list-style-type: none;
|
|
}
|
|
|
|
body{
|
|
color: #FFFFFF;
|
|
font-family:"Sans";
|
|
|
|
margin-top: 5%;
|
|
margin-bottom: 5%;
|
|
margin-right: 5%;
|
|
margin-left: 5%;
|
|
}
|
|
|
|
/* @font-face { */
|
|
/* font-family: "Open-Sans-Extrabold" Open Sans; */
|
|
/* /\*src: url(/font);*\/ */
|
|
/* } */
|
|
|
|
pre {
|
|
/*background: #a89984;*/
|
|
border: 10px solid #928374;
|
|
border-radius: 10px;
|
|
/*padding: 1em;*/
|
|
/*margin: 1em;*/
|
|
white-space: pre-wrap;
|
|
}
|
|
|
|
table td {
|
|
border-style:hidden;
|
|
padding: 50 50;
|
|
}
|
|
|
|
h1 {
|
|
font-size: 30px;
|
|
color: #7aa2f7;
|
|
text-shadow: 2px 2px 4px rgba(0,0,0, 0.3);
|
|
}
|
|
|
|
h2 {
|
|
font-size: 25px;
|
|
color: #FFFFFF;
|
|
}
|
|
|
|
h3 {
|
|
font-size: 15px;
|
|
color: #dda800;
|
|
}
|
|
|
|
code {
|
|
background-color: #000000;
|
|
/*border: 5px solid #928374;*/
|
|
border-radius: 5px;
|
|
word-wrap: break-word;
|
|
overflow-wrap: break-word;
|
|
}
|
|
|
|
ul li {
|
|
list-style: inside circle;
|
|
display:list-item;
|
|
}
|
|
|
|
table {
|
|
border-collapse: collapse;
|
|
border: 2px solid #7c6f64;
|
|
}
|
|
|
|
th,td {
|
|
border: 2px solid #7c6f64;
|
|
}
|
|
|
|
a {
|
|
color: #7aa2f7;
|
|
text-decoration: none;
|
|
|
|
|
|
}
|
|
|
|
a:hover {
|
|
color: #FFFFFF;
|
|
text-decoration: none;
|
|
}
|
|
|
|
|
|
|
|
img {
|
|
max-width: 70%;
|
|
height: auto;
|
|
border-radius:14px;
|
|
}
|
|
|
|
.video_frame {
|
|
|
|
|
|
border-radius:30px;
|
|
border: 10px solid #ffb800;
|
|
}
|
|
video {
|
|
border-radius:20px;}
|
|
|
|
|
|
|
|
input[type=text] {
|
|
padding: 5px 20px;
|
|
margin: 8px 5px;
|
|
box-sizing: border-box;
|
|
background: linear-gradient(135deg, #2a3352 0%, #1a1b26 100%);
|
|
color: #7aa2f7;
|
|
border: 1px solid rgba(122, 162, 247, 0.3);
|
|
border-radius: 8px;
|
|
font-weight: 600;
|
|
box-shadow:
|
|
0 2px 4px rgba(0, 0, 0, 0.2),
|
|
inset 0 1px 0 rgba(255, 255, 255, 0.1);
|
|
transition: all 0.2s ease;
|
|
backdrop-filter: blur(5px);
|
|
letter-spacing: 0.5px;
|
|
line-height: 3;
|
|
}
|
|
button, .button, select {
|
|
padding: 5px 20;
|
|
margin: 8px 5px;
|
|
/* box-sizing: border-box; */
|
|
/* border: 0px solid black; */
|
|
|
|
|
|
|
|
word-break: break-all;
|
|
display: inline-block;
|
|
|
|
/* background-color: rgba(18, 83,140, 0.7); */
|
|
|
|
|
|
|
|
background: linear-gradient(135deg, #2a3352 0%, #1a1b26 100%);
|
|
color: #7aa2f7;
|
|
border: 1px solid rgba(122, 162, 247, 0.3);
|
|
border-radius: 8px;
|
|
font-weight: 600;
|
|
box-shadow:
|
|
0 2px 4px rgba(0, 0, 0, 0.2),
|
|
inset 0 1px 0 rgba(255, 255, 255, 0.1);
|
|
transition: all 0.2s ease;
|
|
backdrop-filter: blur(5px);
|
|
letter-spacing: 0.5px;
|
|
}
|
|
|
|
.flexity {
|
|
|
|
display: flex;
|
|
flex-direction: row;
|
|
flex-wrap: wrap;
|
|
justify-content: center;
|
|
margin: 0;
|
|
padding: 0;
|
|
|
|
|
|
}
|
|
|
|
.login_fixed {
|
|
position: fixed;
|
|
right:10;
|
|
top:10;
|
|
}
|
|
|
|
sup {
|
|
background-color: #FF6600;
|
|
border-radius: 12px;
|
|
padding: 3px 3px 3px 3px;
|
|
margin: 5px;
|
|
|
|
}
|
|
|
|
.graph_line {
|
|
position: absolute;
|
|
background-color: #ffb800;
|
|
height: 80%;
|
|
margin-top: 20%;
|
|
width: 30px;
|
|
border-radius: 25px;
|
|
}
|
|
|
|
.graph_line:hover {
|
|
background-color: white;
|
|
}
|
|
|
|
.article_box {
|
|
color: #ffffff;
|
|
padding: 5px 20;
|
|
margin: 8px 5px;
|
|
/* box-sizing: border-box; */
|
|
/* border: 0px solid black; */
|
|
|
|
max-width:300px;
|
|
vertical-align: top;
|
|
|
|
word-break: break-word;
|
|
display: inline-block;
|
|
|
|
/* background-color: rgba(18, 83,140, 0.7); */
|
|
background: rgba(36, 40, 59, 0.8);
|
|
backdrop-filter: blur(10px);
|
|
border: 2px solid rgba(122, 162, 247, 0.1);
|
|
border-radius: 12px;
|
|
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.2);
|
|
transition: all 0.2s ease;
|
|
}
|
|
|
|
.quote {
|
|
background-color: rgba(53,56,73, 0.99);
|
|
backdrop-filter: blur(10px);
|
|
padding: 10px 20px;
|
|
margin: 8px 0;
|
|
border-radius: 25px;
|
|
box-shadow: 2px 2px 4px rgba(0,0,0, 0.3);
|
|
}
|
|
|
|
.toot {
|
|
padding: 5px 20px;
|
|
margin: 8px 5px;
|
|
word-wrap: break-word;
|
|
overflow-wrap: break-word;
|
|
display: inline-block;
|
|
|
|
background: rgba(36, 40, 59, 0.8);
|
|
backdrop-filter: blur(10px);
|
|
border: 1px solid rgba(122, 162, 247, 0.1);
|
|
border-radius: 12px;
|
|
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.2);
|
|
transition: all 0.2s ease;
|
|
color: #FFFFFF;
|
|
}
|
|
button, .button > img {background-color: rgba(53,56,73, 0);}
|
|
button, .button { line-height: 3 }
|
|
|
|
.in_scene_link {
|
|
background-color: rgba(18, 83,140, 0.7);
|
|
color: #FFFFFF;
|
|
border-radius: 25px;
|
|
padding-left: 5px;
|
|
padding-right: 5px;
|
|
font-weight: bold;
|
|
}
|
|
|
|
|
|
.vcschekbox_checked {
|
|
padding: 5px 12px;
|
|
margin: 8px 0;
|
|
/* box-sizing: border-box; */
|
|
border: 0px solid black;
|
|
|
|
word-break: break-all;
|
|
display: inline-block;
|
|
|
|
background-color: rgba(18, 83,140, 0.7);
|
|
color: #FFFFFF;
|
|
font-weight: bold;
|
|
background-image: url("/icon/checked");
|
|
background-repeat: no-repeat;
|
|
background-position: center left;
|
|
padding-left: 40px;
|
|
border-radius: 25px;
|
|
}
|
|
|
|
.vcschekbox_unchecked {
|
|
padding: 5px 12px;
|
|
margin: 8px 0;
|
|
/* box-sizing: border-box; */
|
|
border: 0px solid black;
|
|
|
|
word-break: break-all;
|
|
display: inline-block;
|
|
|
|
background-color: rgba(18, 83,140, 0.7);
|
|
color: #FFFFFF;
|
|
font-weight: bold;
|
|
background-image: url("/icon/unchecked");
|
|
background-repeat: no-repeat;
|
|
background-position: center left;
|
|
padding-left: 40px;
|
|
border-radius: 25px;
|
|
}
|
|
|
|
.vcschekbox_comment {
|
|
padding: 5px 12px;
|
|
margin: 8px 0;
|
|
/* box-sizing: border-box; */
|
|
border: 0px solid black;
|
|
|
|
word-break: break-all;
|
|
display: inline-block;
|
|
|
|
background-color: rgba(0, 0,0, 0.5);
|
|
color: #FFFFFF;
|
|
font-weight: bold;
|
|
border-radius: 25px;
|
|
}
|
|
|
|
/* details[open] summary { */
|
|
|
|
/* color: #FFFFFF; */
|
|
/* font-weight: bold; */
|
|
/* background-image: url("/icon/open"); */
|
|
/* background-repeat: no-repeat; */
|
|
/* background-position: center left; */
|
|
/* padding-left: 40px; */
|
|
}
|
|
summary:hover, summary:hover > h1 {
|
|
color: white;
|
|
cursor: pointer;
|
|
background-color: #4e526b;
|
|
}
|
|
button:hover, input:hover, button:focus, input:focus, .button:hover, .button:focus {
|
|
/**background-color: #4e526b;**/
|
|
color: white;
|
|
box-shadow: 4px 4px 4px rgba(0,0,0, 0.5);
|
|
}
|
|
|
|
hr {
|
|
border-top: 1px solid #b058c6;
|
|
}
|
|
|
|
p {
|
|
margin-right: 5%;
|
|
margin-left: 5%;
|
|
}
|
|
|
|
.searchbar {
|
|
width: 90%;
|
|
height: 70;
|
|
position: fixed;
|
|
top: 0;
|
|
margin-top: 1%;
|
|
left: 5%;
|
|
}
|
|
|
|
.side_found { margin-top: 100}
|
|
|
|
|
|
|
|
|
|
/*
|
|
If a screen is at least 1024 pixels wide, we do some more things.
|
|
*/
|
|
|
|
@media screen and (min-width: 950px) {
|
|
|
|
.column {width:50%}
|
|
.searchbar {
|
|
width: 35%;}
|
|
|
|
|
|
.scenes_section {
|
|
position: absolute;
|
|
left:20%;
|
|
top:200;
|
|
width:15%;
|
|
}
|
|
.middle_section {
|
|
position: absolute;
|
|
left:20%;
|
|
top:200;
|
|
width:39%;
|
|
}
|
|
.checklist_section {
|
|
position: absolute;
|
|
left:60%;
|
|
top:200;
|
|
width:20%;
|
|
}
|
|
|
|
.middle_section_article {
|
|
position: absolute;
|
|
left:20%;
|
|
top:200;
|
|
width:39%;
|
|
}
|
|
.checklist_section_article {
|
|
position: absolute;
|
|
left:60%;
|
|
top:200;
|
|
width:20%;
|
|
}
|
|
|
|
body{
|
|
color: #FFFFFF;
|
|
font-family:"Sans";
|
|
|
|
/* margin-top: 5%; */
|
|
/* margin-bottom: 5%; */
|
|
/* margin-right: 20%; */
|
|
/* margin-left: 20%; */
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
.shot_1, .shot_2, .shot_3, .shot_4, .shot_5 {
|
|
color: #FFFFFF;
|
|
font-weight: bold;
|
|
border-radius: 25px;
|
|
}
|
|
|
|
.shot_1 {background-color: #ff783a;}
|
|
.shot_2 {background-color: #abbf28;}
|
|
.shot_3 {background-color: #de80d1;}
|
|
.shot_4 {background-color: #638fff;}
|
|
.shot_5 {background-color: #00bd73;}
|
|
|
|
#background_video {
|
|
position: fixed;
|
|
object-fit: cover;
|
|
right: 0;
|
|
bottom: 0;
|
|
min-width: 100%;
|
|
min-height: 100%;
|
|
z-index:-1;
|
|
}
|
|
|
|
.dark_box {
|
|
background: rgba(36, 40, 59, 0.8);
|
|
backdrop-filter: blur(10px);
|
|
border: 1px solid rgba(122, 162, 247, 0.1);
|
|
border-radius: 12px;
|
|
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.2);
|
|
transition: all 0.2s ease;
|
|
}
|
|
|
|
.dark_box:hover, .article_box:hover, .toot:hover {
|
|
transform: translateY(-2px);
|
|
box-shadow: 0 6px 8px rgba(0, 0, 0, 0.3);
|
|
border-color: rgba(122, 162, 247, 0.3);
|
|
}
|
|
|
|
.frase {
|
|
background-color: rgba(0, 0,0, 0.5);
|
|
padding: 1%;
|
|
position: static;
|
|
margin-top: 5px;
|
|
margin-left:30%;
|
|
width: 40%;
|
|
color: #FFFFFF;
|
|
font-weight: bold;
|
|
border-radius: 25px;}
|
|
|
|
/* prgoress bar theme */
|
|
|
|
.back_progress {background-color: #101010;
|
|
width: 100%;
|
|
height: 14;
|
|
border-radius: 7px}
|
|
.front_progress {background-color: #ffb800;
|
|
height: 14;
|
|
border-radius:7px}
|
|
.middle_progress {background-color: #000000;
|
|
height: 14;
|
|
border-radius:7px}
|
|
.moriasrace_banner {position: static;
|
|
top: 100;
|
|
left: 20%;}
|
|
|
|
}
|