input {
padding: 10px;
font-size: 1em;
outline: none;
border: 1px solid var(--gray-8);
border-radius: 1px;
}
.progress-bar {
height: 25px;
background-color: var(--gray-8);
display: flex;
align-items: center;
width: 100%;
margin: 25px 0;
}
.progress-bar-loading {
height: 25px;
background-color: green;
width: auto;
}
.progress-bar-progress {
height: 100%;
display: flex;
align-items: center;
justify-content: center;
color: #fff;
}
.button-container {
margin-top: 25px;
display: flex;
justify-content: space-between;
flex-direction: row-reverse;
}
.input-container {
display: flex;
align-items: center;
}
.input-container span {
margin-left: 10px;
}
.input-container span.ok {
color: green;
}
.input-container span.error {
color: red;
}
.input-container label {
margin-right: 25px;
min-width: 50px;
}
.input-container:not(:first-child) {
margin-top: 15px;
}
button, a[role=button] {
font-size: 1em;
padding: 10px 25px;
border: 1px solid var(--gray-7);
background-color: var(--gray-8);
color: initial;
}
button, a[role="button"] {
cursor: pointer;
}
button:hover, a[role="button"]:hover {
background-color: var(--gray-7);
}
button[disabled], button:disabled, a[disabled], a:disabled {
cursor: not-allowed;
}
.hidden {
display: none !important;
}
.object_list a.selected {
background-color: var(--gray-8);
}
.algorithm_list, .task_list {
display: flex;
flex-wrap: wrap;
}
.task_list {
justify-content: center;
}
.algorithm_list li, .task_list li {
display: flex;
}
.algorithm_list a, .task_list a {
border: 1px solid var(--gray-8);
padding: 10px 15px;
margin: 10px 15px;
color: var(--gray-3);
}
.algorithm_list a.selected {
background-color: var(--gray-8);
}
.task_list a.selected {
background-color: var(--gray-8);
}
.loader {
width: 48px;
height: 48px;
border-radius: 50%;
position: relative;
animation: rotate 1s linear infinite;
}
.loader::before {
content: "";
box-sizing: border-box;
position: absolute;
inset: 0px;
border-radius: 50%;
border: 5px solid #FFF;
animation: prixCli pFix 2s linear infinite;
border-top: 6px solid black;
}
@keyframes rotate {
100% { transform: rotate(360deg); }
}
#loader {
position: fixed;
left: 0;
top: 0;
height: 100vh;
width: 100vw;
background-color: black;
opacity: 0.5;
display: flex;
align-items: center;
justify-content: center;
}
.feature_figures figure {
box-shadow: 0 1px 2px var(--shadow-2);
padding: 25px;
}
.feature_figures {
margin-top: 50px;
}