fixed tab colours in light theme

This commit is contained in:
Thomas G 2022-08-08 03:25:06 +10:00
parent 56095d7bda
commit a69fe5c5aa
2 changed files with 686 additions and 666 deletions

View File

@ -8,9 +8,9 @@
background-position-x: 2000px; background-position-x: 2000px;
animation-timing-function: linear; animation-timing-function: linear;
} }
} }
@keyframes alertanim { @keyframes alertanim {
0% { 0% {
top: 0px; top: 0px;
animation-timing-function: linear; animation-timing-function: linear;
@ -20,25 +20,26 @@
background-position-x: 72px; background-position-x: 72px;
animation-timing-function: linear; animation-timing-function: linear;
} }
} }
.catalogitem, .catalogitemimage { .catalogitem,
.catalogitemimage {
width: 126px; width: 126px;
padding: 5px; padding: 5px;
} }
.arkoticon_small { .arkoticon_small {
margin: 0px; margin: 0px;
width: 12px; width: 12px;
} }
.arkoticon_navbar { .arkoticon_navbar {
margin: 0px; margin: 0px;
margin-right: 3px; margin-right: 3px;
width: 20px; width: 20px;
} }
.arkotcontainer { .arkotcontainer {
position: relative; position: relative;
padding-right: 10px; padding-right: 10px;
margin-right: 0%; margin-right: 0%;
@ -49,23 +50,24 @@
align-content: center; align-content: center;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
} }
.smallnavbarbuttoncontainer { .smallnavbarbuttoncontainer {
display: flex; display: flex;
flex-direction: row; flex-direction: row;
flex-wrap: nowrap; flex-wrap: nowrap;
align-content: center; align-content: center;
justify-content: flex-end; justify-content: flex-end;
align-items: center; align-items: center;
} }
.arkotlabel { .arkotlabel {
color: rgb(35, 98, 222); color: rgb(35, 98, 222);
font-weight: bold; font-weight: bold;
} }
#alert, #success { #alert,
#success {
height: fit-content; height: fit-content;
margin: 0px; margin: 0px;
animation: alertanim; animation: alertanim;
@ -80,60 +82,66 @@
padding-left: 5px; padding-left: 5px;
width: 100%; width: 100%;
text-align: center; text-align: center;
} }
#alert { #alert {
background: linear-gradient(#f07575 10%, #de2323 100%); background: linear-gradient(#f07575 10%, #de2323 100%);
} }
#success { #success {
background:linear-gradient(#a3e2bd 10%,#02b757 100%) background: linear-gradient(#a3e2bd 10%, #02b757 100%)
} }
.warningtext { .warningtext {
color: red; color: red;
}
#logo_full {
display: none;
}
#logo_small {
display: block;
}
@media (min-width: 1688px) {
#logo_full {
display: block;
} }
#logo_full {
display: none;
}
#logo_small {
display: block;
}
@media (min-width: 1688px) {
#logo_full {
display: block;
}
#logo_small { #logo_small {
display: none; display: none;
} }
} }
@media (max-width: 730px) {
@media (max-width: 730px) {
.navbarbuttoncontainer a { .navbarbuttoncontainer a {
position: relative; position: relative;
} }
} }
@media (max-width: 970px) {
@media (max-width: 970px) {
.navbarbuttoncontainer a { .navbarbuttoncontainer a {
font-size: 14px; font-size: 14px;
} }
} }
@media (max-width: 640px) {
@media (max-width: 640px) {
.navbarbuttoncontainer a { .navbarbuttoncontainer a {
font-size: 12px; font-size: 12px;
} }
} }
.popupcontainer { .popupcontainer {
top: 0%; top: 0%;
position: fixed; position: fixed;
background-color: rgba(0, 0, 0, 0.5); background-color: rgba(0, 0, 0, 0.5);
width: 100%; width: 100%;
height: 100%; height: 100%;
z-index: 100000000; z-index: 100000000;
} }
.popup { .popup {
color: #000000; color: #000000;
text-align: center; text-align: center;
position: fixed; position: fixed;
@ -150,9 +158,9 @@
background: rgb(80, 80, 80); background: rgb(80, 80, 80);
/* Fallback for IE 11*/ /* Fallback for IE 11*/
background: linear-gradient(#cacbcc 10%, #2d2d2d 100%); background: linear-gradient(#cacbcc 10%, #2d2d2d 100%);
} }
.navbar { .navbar {
height: 40px; height: 40px;
margin: 0px; margin: 0px;
padding-right: 5px; padding-right: 5px;
@ -171,10 +179,10 @@
background: #2362DE; background: #2362DE;
/* Fallback for IE 11*/ /* Fallback for IE 11*/
background: linear-gradient(#5082ed 10%, #0a44b7 100%); background: linear-gradient(#5082ed 10%, #0a44b7 100%);
} }
.navbarbuttoncontainer, .navbarbuttoncontainer,
.navbarlogincontainer { .navbarlogincontainer {
padding-left: 5px; padding-left: 5px;
vertical-align: middle; vertical-align: middle;
display: flex; display: flex;
@ -183,10 +191,10 @@
align-content: center; align-content: center;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
} }
#navbarlogincontainer, #navbarlogincontainer,
#navbarsignedincontainer { #navbarsignedincontainer {
position: relative; position: relative;
padding-right: 10px; padding-right: 10px;
margin-right: 0%; margin-right: 0%;
@ -197,79 +205,80 @@
align-content: center; align-content: center;
justify-content: flex-end; justify-content: flex-end;
align-items: center; align-items: center;
} }
#profilefriendscontainer p, #profilefriendscontainer p,
#profilefriendscontainer a { #profilefriendscontainer a {
display: inline; display: inline;
} }
#profiletopcontainer { #profiletopcontainer {
margin-bottom: 30px; margin-bottom: 30px;
display: block; display: block;
width: 100%; width: 100%;
} }
.onlinestatus_website { .onlinestatus_website {
color: #2260DD; color: #2260DD;
} }
.onlinestatus_studio { .onlinestatus_studio {
color: rgb(185, 135, 20); color: rgb(185, 135, 20);
} }
.onlinestatus_ingame { .onlinestatus_ingame {
color: green; color: green;
} }
.onlinestatus_offline { .onlinestatus_offline {
color: black; color: black;
} }
.important { .important {
color: red; color: red;
font-weight: bold; font-weight: bold;
} }
#yes,
#no { #yes,
#no {
width: 50%; width: 50%;
} }
#FeedBox { #FeedBox {
width: 100%; width: 100%;
height: 22px; height: 22px;
} }
#FeedButton { #FeedButton {
width: 100%; width: 100%;
height: 22px; height: 22px;
} }
#logo_signup, #logo_signup,
#logo-signup p { #logo-signup p {
margin: auto; margin: auto;
text-align: center; text-align: center;
width: 200px; width: 200px;
} }
#feed, #feed,
#profileleftcontainer { #profileleftcontainer {
text-align: center; text-align: center;
padding-left: 5px; padding-left: 5px;
padding-right: 5px; padding-right: 5px;
width: 50%; width: 50%;
} }
#gamesframe, #gamesframe,
#profilerightcontainer { #profilerightcontainer {
text-align: center; text-align: center;
padding-left: 5px; padding-left: 5px;
padding-right: 5px; padding-right: 5px;
width: 50%; width: 50%;
} }
.FeedContainerBox, .FeedContainerBox,
.ProfileContainerBox { .ProfileContainerBox {
border-radius: 1px; border-radius: 1px;
text-align: left; text-align: left;
width: 100%; width: 100%;
@ -280,9 +289,9 @@
overflow-x: hidden; overflow-x: hidden;
border-width: 1px; border-width: 1px;
margin-bottom: 5px; margin-bottom: 5px;
} }
.FriendsContainerBox { .FriendsContainerBox {
border-radius: 1px; border-radius: 1px;
text-align: left; text-align: left;
width: 100%; width: 100%;
@ -292,27 +301,27 @@
border: 1px solid #000000; border: 1px solid #000000;
border-width: 1px; border-width: 1px;
margin-bottom: 5px; margin-bottom: 5px;
} }
#btncontainer { #btncontainer {
margin-left: 75%; margin-left: 75%;
} }
.navbarbutton { .navbarbutton {
position: relative; position: relative;
padding-right: 5px; padding-right: 5px;
text-align: center; text-align: center;
font-size: 18px; font-size: 18px;
} }
.smallnavbarbutton { .smallnavbarbutton {
position: relative; position: relative;
padding-right: 5px; padding-right: 5px;
text-align: center; text-align: center;
font-size: 15px; font-size: 15px;
} }
.smallnav { .smallnav {
height: 25px; height: 25px;
margin: 0px; margin: 0px;
padding-left: 5px; padding-left: 5px;
@ -331,14 +340,14 @@
text-align: left; text-align: left;
background: #000000; background: #000000;
background: linear-gradient(#303030 10%, #000000 100%); background: linear-gradient(#303030 10%, #000000 100%);
} }
.invisible, .invisible,
#invisible { #invisible {
display: none !important; display: none !important;
} }
html { html {
animation-name: animatedbackground; animation-name: animatedbackground;
animation-duration: 50s; animation-duration: 50s;
animation-iteration-count: infinite; animation-iteration-count: infinite;
@ -353,9 +362,9 @@
background-color: rgb(49, 107, 223); background-color: rgb(49, 107, 223);
height: 100%; height: 100%;
color: white; color: white;
} }
body { body {
margin-left: 0px; margin-left: 0px;
margin-right: 0px; margin-right: 0px;
margin-top: 0px; margin-top: 0px;
@ -363,10 +372,10 @@
margin-bottom: 0px; margin-bottom: 0px;
padding-bottom: 0px; padding-bottom: 0px;
height: 100%; height: 100%;
} }
.content_special, .content_special,
#content_special { #content_special {
display: inline-flex; display: inline-flex;
width: 100%; width: 100%;
flex-direction: row; flex-direction: row;
@ -374,9 +383,9 @@
align-content: center; align-content: center;
justify-content: flex-start; justify-content: flex-start;
flex-wrap: nowrap; flex-wrap: nowrap;
} }
.content { .content {
color: black; color: black;
max-width: 1000px; max-width: 1000px;
margin: auto; margin: auto;
@ -389,9 +398,9 @@
background-color: rgb(255, 255, 255); background-color: rgb(255, 255, 255);
padding-bottom: 5px; padding-bottom: 5px;
padding-top: 5px; padding-top: 5px;
} }
.content_signup { .content_signup {
color: black; color: black;
max-width: 500px; max-width: 500px;
margin: auto; margin: auto;
@ -403,26 +412,26 @@
background-color: rgb(255, 255, 255); background-color: rgb(255, 255, 255);
padding-bottom: 5px; padding-bottom: 5px;
padding-top: 5px; padding-top: 5px;
} }
.content_signup button { .content_signup button {
width: 100%; width: 100%;
} }
.content_signup input { .content_signup input {
width: 98%; width: 98%;
} }
.content p a, .content p a,
.content a, .content a,
.content_signup p a, .content_signup p a,
.content_signup a, .content_signup a,
.content_special p a, .content_special p a,
.content_special a { .content_special a {
color: black color: black
} }
#footer { #footer {
text-align: center; text-align: center;
max-width: 1000px; max-width: 1000px;
margin: auto; margin: auto;
@ -434,11 +443,27 @@
/* Fallback for IE 11*/ /* Fallback for IE 11*/
background-color: rgb(172, 172, 172); background-color: rgb(172, 172, 172);
min-height: fit-content; min-height: fit-content;
} }
.tab { /*Button gradients by TersisWilvin*/
background: #747474;
background: linear-gradient(#cacbcc 10%, #99999a 49%, #747474 50%, #2d2d2d 100%); .tab {
background: rgb(255, 255, 255);
background: linear-gradient(0deg, #fff 0%, #b8b8b8 49%, #e3e3e3 50%, #f2f2f2 95%, #fff 100%);
font-weight: 400;
text-align: center;
height: 20px;
border-radius: 1px;
border: 1px solid #3D414A;
font-family: "Helvetica";
padding-left: 5px;
padding-right: 5px;
color: rgb(0, 0, 0) !important;
}
.tab_selected {
background: rgb(35, 98, 222);
background: linear-gradient(0deg, #00a2ff 0%, #0074bd 49%, #08f 50%, #57c2fe 95%, #99daff 100%);
font-weight: 400; font-weight: 400;
text-align: center; text-align: center;
height: 20px; height: 20px;
@ -448,28 +473,12 @@
padding-left: 5px; padding-left: 5px;
padding-right: 5px; padding-right: 5px;
color: #fff !important; color: #fff !important;
} }
.tab_selected { button {
background: #2362DE; background: rgb(255, 255, 255);
background: linear-gradient(#759CF0 10%, #3B72E1 49%, #2260DD 50%, #2362DE 100%);
font-weight: 400;
text-align: center;
height: 20px;
border-radius: 1px;
border: 1px solid #3D414A;
font-family: "Helvetica";
padding-left: 5px;
padding-right: 5px;
color: #fff !important;
}
/*Button gradients by TersisWilvin*/
button {
background: rgb(45, 45, 45);
/*Fallback for IE 11*/ /*Fallback for IE 11*/
background: linear-gradient(#cacbcc 10%, #99999a 49%, #747474 50%, #2d2d2d 100%); background: linear-gradient(0deg, #fff 0%, #b8b8b8 49%, #e3e3e3 50%, #f2f2f2 95%, #fff 100%);
font-weight: 400; font-weight: 400;
text-align: center; text-align: center;
height: 20px; height: 20px;
@ -477,65 +486,66 @@
border: 1px solid #3D414A; border: 1px solid #3D414A;
font-family: "Helvetica"; font-family: "Helvetica";
color: #fff; color: #fff;
} }
button:hover { button:hover {
cursor: pointer; cursor: pointer;
} }
button:disabled { button:disabled {
opacity: 0.5; opacity: 0.5;
cursor: not-allowed; cursor: not-allowed;
} }
button.bluebutton { button.bluebutton {
background: rgb(35, 98, 222); background: rgb(35, 98, 222);
/*Fallback for IE 11*/ /*Fallback for IE 11*/
background: linear-gradient(0deg,#00a2ff 0%,#0074bd 49%,#08f 50%,#57c2fe 95%,#99daff 100%); background: linear-gradient(0deg, #00a2ff 0%, #0074bd 49%, #08f 50%, #57c2fe 95%, #99daff 100%);
} }
button:hover.bluebutton { button:hover.bluebutton {
background: linear-gradient(0deg,#32b5ff 0%,#0074bd 49%,#2c99f8 50%,#71c9fa 95%,#b6e5ff 100%); background: linear-gradient(0deg, #32b5ff 0%, #0074bd 49%, #2c99f8 50%, #71c9fa 95%, #b6e5ff 100%);
} }
button:active.bluebutton, button:focus.bluebutton { button:active.bluebutton,
background: linear-gradient(0deg,#32b5ff 0%,#0074bd 49%,#2c99f8 50%,#71c9fa 95%,#b6e5ff 100%); button:focus.bluebutton {
} background: linear-gradient(0deg, #32b5ff 0%, #0074bd 49%, #2c99f8 50%, #71c9fa 95%, #b6e5ff 100%);
}
button.greybutton { button.greybutton {
background: rgb(255, 255, 255); background: rgb(255, 255, 255);
color: black; color: black;
/*Fallback for IE 11*/ /*Fallback for IE 11*/
background: linear-gradient(0deg,#fff 0%,#b8b8b8 49%,#e3e3e3 50%,#f2f2f2 95%,#fff 100%); background: linear-gradient(0deg, #fff 0%, #b8b8b8 49%, #e3e3e3 50%, #f2f2f2 95%, #fff 100%);
} }
button:hover.greybutton { button:hover.greybutton {
background: linear-gradient(0deg,#fff 0%,#b8b8b8 49%,#e3e3e3 50%,#f2f2f2 95%,#fff 100%); background: linear-gradient(0deg, #fff 0%, #b8b8b8 49%, #e3e3e3 50%, #f2f2f2 95%, #fff 100%);
} }
button.redbutton { button.redbutton {
background: rgb(223, 24, 24); background: rgb(223, 24, 24);
/*Fallback for IE 11*/ /*Fallback for IE 11*/
background: linear-gradient(0deg,#d86868 0%,#a95151 49%,#bc5c5c 50%,#e96f6f 95%,#fe7979 100%); background: linear-gradient(0deg, #d86868 0%, #a95151 49%, #bc5c5c 50%, #e96f6f 95%, #fe7979 100%);
} }
button:hover.redbutton { button:hover.redbutton {
background: linear-gradient(0deg,#e27676 0%,#a95151 49%,#ca6363 50%,#f07272 95%,#fd8888 100%); background: linear-gradient(0deg, #e27676 0%, #a95151 49%, #ca6363 50%, #f07272 95%, #fd8888 100%);
} }
button.greenbutton { button.greenbutton {
background: rgb(26, 92, 46); background: rgb(26, 92, 46);
/*Fallback for IE 11*/ /*Fallback for IE 11*/
background: linear-gradient(0deg,#02b757 0%,#118237 49%,#01a64e 50%,#3fc679 95%,#a3e2bd 100%); background: linear-gradient(0deg, #02b757 0%, #118237 49%, #01a64e 50%, #3fc679 95%, #a3e2bd 100%);
} }
button:hover.greenbutton { button:hover.greenbutton {
background: linear-gradient(0deg,#3fc679 0%,#15933f 49%,#3cc175 50%,#46dc86 95%,#53ff9d 100%); background: linear-gradient(0deg, #3fc679 0%, #15933f 49%, #3cc175 50%, #46dc86 95%, #53ff9d 100%);
} }
#footer_signup { #footer_signup {
text-align: center; text-align: center;
max-width: 500px; max-width: 500px;
margin: auto; margin: auto;
@ -547,41 +557,41 @@
/* Fallback for IE 11*/ /* Fallback for IE 11*/
background-color: rgb(172, 172, 172); background-color: rgb(172, 172, 172);
min-height: fit-content; min-height: fit-content;
} }
#footer p, #footer p,
#footer a, #footer a,
#footer_signup p, #footer_signup p,
#footer_signup a { #footer_signup a {
color: black; color: black;
} }
p, p,
h1, h1,
h2, h2,
h3, h3,
h4, h4,
h5, h5,
h6 { h6 {
margin: 0px; margin: 0px;
} }
img { img {
object-fit: contain; object-fit: contain;
} }
a, a,
#navbarusername { #navbarusername {
color: white; color: white;
text-decoration: none; text-decoration: none;
font-weight: bolder; font-weight: bolder;
} }
.nonbolded { .nonbolded {
font-weight: normal !important; font-weight: normal !important;
} }
.logoutframe { .logoutframe {
color: black; color: black;
max-width: fit-content; max-width: fit-content;
margin: auto; margin: auto;
@ -592,36 +602,36 @@
background-color: rgb(255, 255, 255); background-color: rgb(255, 255, 255);
padding-bottom: 5px; padding-bottom: 5px;
padding-top: 5px; padding-top: 5px;
} }
.w-5 { .w-5 {
display: none; display: none;
} }
.flex { .flex {
display: table; display: table;
margin-right: auto; margin-right: auto;
margin-left: auto; margin-left: auto;
} }
.iphone-sidebar { .iphone-sidebar {
position: fixed; position: fixed;
color: rgb(255, 255, 255); color: rgb(255, 255, 255);
width: 20%; width: 20%;
height: 100%; height: 100%;
margin-left: 0px; margin-left: 0px;
background-color: rgb(0,0,0); background-color: rgb(0, 0, 0);
padding-bottom: 5px; padding-bottom: 5px;
padding-top: 5px; padding-top: 5px;
} }
.iphone-content { .iphone-content {
position: relative; position: relative;
color: white; color: white;
width: 80%; width: 80%;
height: 100%; height: 100%;
left: 20%; left: 20%;
background-color: rgb(0,0,0); background-color: rgb(0, 0, 0);
padding-bottom: 5px; padding-bottom: 5px;
padding-top: 5px; padding-top: 5px;
padding-left: 5px; padding-left: 5px;
@ -629,8 +639,8 @@
overflow-x: hidden; overflow-x: hidden;
position: fixed; position: fixed;
height: 100%; height: 100%;
} }
#InviteTreeContainer { #InviteTreeContainer {
background-color: rgb(255, 255, 255); background-color: rgb(255, 255, 255);
} }

View File

@ -22,7 +22,8 @@
} }
} }
.catalogitem, .catalogitemimage { .catalogitem,
.catalogitemimage {
width: 126px; width: 126px;
padding: 5px; padding: 5px;
} }
@ -65,7 +66,8 @@
font-weight: bold; font-weight: bold;
} }
#alert, #success { #alert,
#success {
height: fit-content; height: fit-content;
margin: 0px; margin: 0px;
animation: alertanim; animation: alertanim;
@ -87,7 +89,7 @@
} }
#success { #success {
background:linear-gradient(#a3e2bd 10%,#02b757 100%) background: linear-gradient(#a3e2bd 10%, #02b757 100%)
} }
.warningtext { .warningtext {
@ -97,31 +99,37 @@
#logo_full { #logo_full {
display: none; display: none;
} }
#logo_small { #logo_small {
display: block; display: block;
} }
@media (min-width: 1688px) { @media (min-width: 1688px) {
#logo_full { #logo_full {
display: block; display: block;
} }
#logo_small { #logo_small {
display: none; display: none;
} }
} }
@media (max-width: 730px) { @media (max-width: 730px) {
.navbarbuttoncontainer a { .navbarbuttoncontainer a {
position: relative; position: relative;
}
} }
}
@media (max-width: 970px) { @media (max-width: 970px) {
.navbarbuttoncontainer a { .navbarbuttoncontainer a {
font-size: 14px; font-size: 14px;
}
} }
}
@media (max-width: 640px) { @media (max-width: 640px) {
.navbarbuttoncontainer a { .navbarbuttoncontainer a {
font-size: 12px; font-size: 12px;
} }
} }
.popupcontainer { .popupcontainer {
@ -230,6 +238,7 @@
color: red; color: red;
font-weight: bold; font-weight: bold;
} }
#yes, #yes,
#no { #no {
width: 50%; width: 50%;
@ -384,7 +393,7 @@ body {
padding-left: 5px; padding-left: 5px;
padding-right: 5px; padding-right: 5px;
min-height: 300px; min-height: 300px;
background: rgb(25,25,25); background: rgb(25, 25, 25);
padding-bottom: 5px; padding-bottom: 5px;
padding-top: 5px; padding-top: 5px;
} }
@ -396,7 +405,7 @@ body {
margin-top: 30px; margin-top: 30px;
padding-left: 5px; padding-left: 5px;
padding-right: 5px; padding-right: 5px;
background: rgb(25,25,25); background: rgb(25, 25, 25);
padding-bottom: 5px; padding-bottom: 5px;
padding-top: 5px; padding-top: 5px;
} }
@ -426,7 +435,7 @@ body {
padding-right: 5px; padding-right: 5px;
padding-bottom: 5px; padding-bottom: 5px;
padding-top: 5px; padding-top: 5px;
background: rgb(0,0,0); background: rgb(0, 0, 0);
/* Fallback for IE 11*/ /* Fallback for IE 11*/
min-height: fit-content; min-height: fit-content;
} }
@ -435,7 +444,7 @@ body {
.tab { .tab {
background: rgb(255, 255, 255); background: rgb(255, 255, 255);
background: linear-gradient(0deg,#fff 0%,#b8b8b8 49%,#e3e3e3 50%,#f2f2f2 95%,#fff 100%); background: linear-gradient(0deg, #fff 0%, #b8b8b8 49%, #e3e3e3 50%, #f2f2f2 95%, #fff 100%);
font-weight: 400; font-weight: 400;
text-align: center; text-align: center;
height: 20px; height: 20px;
@ -449,7 +458,7 @@ body {
.tab_selected { .tab_selected {
background: rgb(35, 98, 222); background: rgb(35, 98, 222);
background: linear-gradient(0deg,#00a2ff 0%,#0074bd 49%,#08f 50%,#57c2fe 95%,#99daff 100%); background: linear-gradient(0deg, #00a2ff 0%, #0074bd 49%, #08f 50%, #57c2fe 95%, #99daff 100%);
font-weight: 400; font-weight: 400;
text-align: center; text-align: center;
height: 20px; height: 20px;
@ -464,7 +473,7 @@ body {
button { button {
background: rgb(255, 255, 255); background: rgb(255, 255, 255);
/*Fallback for IE 11*/ /*Fallback for IE 11*/
background: linear-gradient(0deg,#fff 0%,#b8b8b8 49%,#e3e3e3 50%,#f2f2f2 95%,#fff 100%); background: linear-gradient(0deg, #fff 0%, #b8b8b8 49%, #e3e3e3 50%, #f2f2f2 95%, #fff 100%);
font-weight: 400; font-weight: 400;
text-align: center; text-align: center;
height: 20px; height: 20px;
@ -487,46 +496,47 @@ button:disabled {
button.bluebutton { button.bluebutton {
background: rgb(35, 98, 222); background: rgb(35, 98, 222);
/*Fallback for IE 11*/ /*Fallback for IE 11*/
background: linear-gradient(0deg,#00a2ff 0%,#0074bd 49%,#08f 50%,#57c2fe 95%,#99daff 100%); background: linear-gradient(0deg, #00a2ff 0%, #0074bd 49%, #08f 50%, #57c2fe 95%, #99daff 100%);
} }
button:hover.bluebutton { button:hover.bluebutton {
background: linear-gradient(0deg,#32b5ff 0%,#0074bd 49%,#2c99f8 50%,#71c9fa 95%,#b6e5ff 100%); background: linear-gradient(0deg, #32b5ff 0%, #0074bd 49%, #2c99f8 50%, #71c9fa 95%, #b6e5ff 100%);
} }
button:active.bluebutton, button:focus.bluebutton { button:active.bluebutton,
background: linear-gradient(0deg,#32b5ff 0%,#0074bd 49%,#2c99f8 50%,#71c9fa 95%,#b6e5ff 100%); button:focus.bluebutton {
background: linear-gradient(0deg, #32b5ff 0%, #0074bd 49%, #2c99f8 50%, #71c9fa 95%, #b6e5ff 100%);
} }
button.greybutton { button.greybutton {
background: rgb(255, 255, 255); background: rgb(255, 255, 255);
color: black; color: black;
/*Fallback for IE 11*/ /*Fallback for IE 11*/
background: linear-gradient(0deg,#fff 0%,#b8b8b8 49%,#e3e3e3 50%,#f2f2f2 95%,#fff 100%); background: linear-gradient(0deg, #fff 0%, #b8b8b8 49%, #e3e3e3 50%, #f2f2f2 95%, #fff 100%);
} }
button:hover.greybutton { button:hover.greybutton {
background: linear-gradient(0deg,#fff 0%,#b8b8b8 49%,#e3e3e3 50%,#f2f2f2 95%,#fff 100%); background: linear-gradient(0deg, #fff 0%, #b8b8b8 49%, #e3e3e3 50%, #f2f2f2 95%, #fff 100%);
} }
button.redbutton { button.redbutton {
background: rgb(223, 24, 24); background: rgb(223, 24, 24);
/*Fallback for IE 11*/ /*Fallback for IE 11*/
background: linear-gradient(0deg,#d86868 0%,#a95151 49%,#bc5c5c 50%,#e96f6f 95%,#fe7979 100%); background: linear-gradient(0deg, #d86868 0%, #a95151 49%, #bc5c5c 50%, #e96f6f 95%, #fe7979 100%);
} }
button:hover.redbutton { button:hover.redbutton {
background: linear-gradient(0deg,#e27676 0%,#a95151 49%,#ca6363 50%,#f07272 95%,#fd8888 100%); background: linear-gradient(0deg, #e27676 0%, #a95151 49%, #ca6363 50%, #f07272 95%, #fd8888 100%);
} }
button.greenbutton { button.greenbutton {
background: rgb(26, 92, 46); background: rgb(26, 92, 46);
/*Fallback for IE 11*/ /*Fallback for IE 11*/
background: linear-gradient(0deg,#02b757 0%,#118237 49%,#01a64e 50%,#3fc679 95%,#a3e2bd 100%); background: linear-gradient(0deg, #02b757 0%, #118237 49%, #01a64e 50%, #3fc679 95%, #a3e2bd 100%);
} }
button:hover.greenbutton { button:hover.greenbutton {
background: linear-gradient(0deg,#3fc679 0%,#15933f 49%,#3cc175 50%,#46dc86 95%,#53ff9d 100%); background: linear-gradient(0deg, #3fc679 0%, #15933f 49%, #3cc175 50%, #46dc86 95%, #53ff9d 100%);
} }
@ -538,7 +548,7 @@ button:hover.greenbutton {
padding-right: 5px; padding-right: 5px;
padding-bottom: 5px; padding-bottom: 5px;
padding-top: 5px; padding-top: 5px;
background: rgb(0,0,0); background: rgb(0, 0, 0);
min-height: fit-content; min-height: fit-content;
} }
@ -603,7 +613,7 @@ a,
width: 20%; width: 20%;
height: 100%; height: 100%;
margin-left: 0px; margin-left: 0px;
background-color: rgb(0,0,0); background-color: rgb(0, 0, 0);
padding-bottom: 5px; padding-bottom: 5px;
padding-top: 5px; padding-top: 5px;
} }
@ -614,7 +624,7 @@ a,
width: 80%; width: 80%;
height: 100%; height: 100%;
left: 20%; left: 20%;
background-color: rgb(0,0,0); background-color: rgb(0, 0, 0);
padding-bottom: 5px; padding-bottom: 5px;
padding-top: 5px; padding-top: 5px;
padding-left: 5px; padding-left: 5px;