blob: 3b538e5fb641b42361558a7c2651ac5951bbdf4c (
plain) (
tree)
|
|
body {
margin: 0;
padding: 0;
font-family: monospace;
}
/* HEADER AND NAVBAR STYLING */
header {
background-color:black;
padding: 1rem;
}
header a {
background-color:black;
text-decoration: none;
font-size: 3rem;
color: white;
}
header a:hover {
text-decoration: underline;
}
nav {
background-color:black;
overflow-x: hidden;
}
nav a {
color: white;
background-color:black;
font-size: 1rem;
text-decoration: none;
text-align: center;
padding: 1rem;
float: left;
}
nav a.right {
float: right;
}
nav a:hover {
text-decoration: underline;
}
.active {
font-weight: bold;
}
.right {
float: right;
}
.mid {
max-width: 750px;
margin: 1rem auto;
}
.alert {
font-weight: bold;
color: red;
}
/* MAIN STYLING */
main {
margin: 1rem auto;
/*max-width: 750px;*/
line-height: 1.6rem;
font-size: 1rem;
color: #444;
padding: 0 10px;
}
h1,h2,h3 {
line-height: 1.2;
}
a {
color: #0077AA;
}
/* TABEL STYLING */
table {
margin: 0;
border-collapse: collapse;
width: 100%;
}
thead th {
color: white;
background-color: black;
border: 1px solid #ccc;
background-clip: padding-box;
position: sticky;
top: 0;
}
td, th {
border: 1px solid #ccc;
text-align: left;
padding: 8px;
white-space: nowrap;
}
.tablediv {
overflow-x: scroll;
max-height: 70vh;
}
/*div.tablediv {*/
/*overflow:scroll;*/
/*height: 80vh;*/
/*width: 100%;*/
/*display: block;*/
/*}*/
/*tbody {*/
/*overflow:scroll;*/
/*height: 80vh;*/
/*width: 80vw;*/
/*}*/
.center {
text-align: center;
}
.edit {
padding: 2px;
border-top: 1px solid #444;
border-left: 1px solid #444;
border-bottom: 1px solid #999;
border-right: 1px solid #999;
}
tr:nth-child(even) {
background-color: #ddd;
}
/* FORM STYLING */
form {
max-width: 750px;
margin: 0rem auto;
}
input, select {
width: 100%;
padding: 12px 10px;
margin: 8px 0;
display: inline-block;
border: 1px solid #ccc;
box-sizing: border-box;
font-size: 1rem;
}
input[type=submit] {
width: 100%;
background-color: #ddd;
color: black;
border: #ccc 1px solid;
padding: 14px 20px;
margin: 8px 0;
}
button {
background-color: #eee;
color: black;
border: #ccc 1px solid;
padding: 7px 10px;
margin: 2px;
}
button:hover {
background-color: #f6f6f6;
}
input[type=submit] {
background-color: #ddd;
}
input[type=checkbox] {
padding: 0;
margin: 0;
width: auto;
}
input[type=submit]:hover {
background-color: #ccc;
}
input[type=submit].abtn {
background-color: #afa;
}
input[type=submit].abtn:hover {
background-color: #8f8;
}
@media only screen and (max-width: 750px) {
header {
text-align: center;
}
nav a {
width: 100%;
text-align: center;
margin: 0;
padding: 1rem 0;
}
nav span.right {
text-align: center;
float: none;
}
}
|