coloringTemplate{
   color: #003135;
   color: #024950;
   color: #964734;
   color: #0FA4AF;
   color: #AFDDE5;

   color: #C6E7FF;
   color: #D4F6FF;
   color: #FBFBFB;
   color: #FFDDAE;
}
/* ------------------------------------- FOXI ----------------------------------------- */
body.foxi {
   background-color: #AFDDE5;
}
header.foxi{
    background: #AFDDE5;
    color: #003135;
}
footer.foxi {
   background-color: rgb(29, 29, 29);
   color:  #AFDDE5;
}
footer div.foxiFooter span a{
   color: rgb(250, 250, 250);
}

/* ----------------------------------- Main Navbar ----------------------------------- */
nav.menu_horizontal ul.mainMenu{
   background: linear-gradient(90deg, #00313577 0%, #003135FF 50%, #00313577 100%);
}
nav.menu_horizontal a{
   color: #AFDDE5;
}
nav.menu_horizontal a.menuLink.activ {
   box-shadow: 0 0 10px #FFDDAEBB;
   background: #0FA4AFBB;
}
nav.menu_horizontal a.menuLink:hover, .dropDown:hover .dropDownBtn {
   box-shadow: 0 0 10px #FFDDAEBB;
   background: #D4F6FF99;
   color: #FBFBFB;
}
header.foxi button.login, div.foxi button.login  {
   background: #024950;
   color: #AFDDE5;
}
.dropDownContent a {
   background: #024950CC;
   color: #FBFBFB;
}
.dropDownContent a:hover {
   box-shadow: 0 8px 16px 0 #FFDDAE88;
   background: #02495080;
}

/* ---------------------------------- Chapter Navbar ---------------------------------- */
nav.menu_vertical ul li.sideMenuChapter {
   background: #0FA4AF;
   color: #FBFBFB;
}
nav.menu_vertical ul li.sideMenuChapter.active {
    background: #003135; !important;
    color: #D4F6FF;
}
nav.menu_vertical ul li.sideMenuTask {
   background: linear-gradient(90deg, #C6E7FF44 0%, #FBFBFB 25%, #FBFBFB 75%, #C6E7FF44 100%);
   color: rgba(0, 0, 0, 0.9);
}
nav.menu_vertical ul li.sideMenuTask.active {
   background: linear-gradient(90deg, #C6E7FF44 0%, #C6E7FF 25%, #C6E7FF 75%, #C6E7FF44 100%);
   color: rgba(0, 0, 0, 0.9);
}
nav.menu_vertical ul li.sideMenuChapter:hover {
   background: #964734 !important;
   box-shadow: 0 0 10px #96473455;
   color: rgb(255, 255, 255);
}
nav.menu_vertical ul li.sideMenuTask:hover {
   background: #964734DD !important;
   box-shadow: 0 0 10px #96473455;
   color: rgb(255, 255, 255);
}
/* -------------------------------------------------------------------------- Heading ------------------------------- */
h1 {
    color: orangered;
}
h2 {
    color: orangered;
}
h3 {
    color: rgb(78, 180, 250);
}
h4 {
    color: #ff8100;
}
h5 {
    color: rgb(0, 0, 0);
}

/* -------------------------------------------------------------------------- Generel ------------------------------- */
.outputField{
    background-color: #0d150d;
    color: #FFFFFF;
}
.blueFont{
    color: #001aff;
}

/* -------------------------------------------------------------------------- Divs ---------------------------------- */
div.contentContainer, div.contentContainerSmall, div.clissContent {
    color: rgb(0, 0, 0);
}
div.output{
     background-color: rgba(135, 158, 192, 0.5);
     color: #000;
 }
div.webpage{
    background-color: #D4F6FF;
    color: #000;
}
div.greenRect{
    background: #11c515;
}
div.blueRect{
   background: #11c5c5;
}
div.orangeRect{
   background: #ff8218;
}
span.green{
   color: #0c6b0c;
}
span.red{
   color: #de0606;
}

/* ----------------------------------------*/
button.blue, select.blue, input.blue{
   background: #3498db;
   background-image: -webkit-linear-gradient(top, #3498db, #2980b9);
   background-image: -moz-linear-gradient(top, #3498db, #2980b9);
   background-image: -ms-linear-gradient(top, #3498db, #2980b9);
   background-image: -o-linear-gradient(top, #3498db, #2980b9);
   background-image: linear-gradient(to bottom, #3498db, #2980b9);
   color: #ffffff;
   border-color: #0d150d;
   font-family: Arial, serif;
   text-decoration: none;
}
button.blue:hover, input.blue:hover, select.blue:hover {
   background: #3cb0fd;
   background-image: -webkit-linear-gradient(top, #3cb0fd, #3498db);
   background-image: -moz-linear-gradient(top, #3cb0fd, #3498db);
   background-image: -ms-linear-gradient(top, #3cb0fd, #3498db);
   background-image: -o-linear-gradient(top, #3cb0fd, #3498db);
   background-image: linear-gradient(to bottom, #3cb0fd, #3498db);
   text-decoration: none;
}
button.red, input.red, select.red{
   background: #db3434;
   background-image: -webkit-linear-gradient(top, #db3434, #b92929);
   background-image: -moz-linear-gradient(top, #db3434, #b92929);
   background-image: -ms-linear-gradient(top, #db3434, #b92929);
   background-image: -o-linear-gradient(top, #db3434, #b92929);
   background-image: linear-gradient(to bottom, #db3434, #b92929);
   color: #ffffff;
   font-family: Arial, serif;
   text-decoration: none;
}
button.red:hover, input.red:hover, select.red:hover {
   background: #b92929;
   background-image: -webkit-linear-gradient(top, #b92929, #db3434);
   background-image: -moz-linear-gradient(top, #b92929, #db3434);
   background-image: -ms-linear-gradient(top, #b92929, #db3434);
   background-image: -o-linear-gradient(top, #b92929, #db3434);
   background-image: linear-gradient(to bottom, #b92929, #db3434);
   text-decoration: none;
}

button.green, input.green, select.green {
   background-color: #397f39;
}
button.black, input.black, select.black {
   background-color: #0d150d;
   color: #b5bab5;
}

ul.green{
   background: linear-gradient(90deg, rgba(191, 191, 191, 0.05) 0%, rgb(89, 255, 0) 50%, rgba(191, 191, 191, 0.05) 100%);
}
ul.red{
   background: linear-gradient(90deg, rgba(191, 191, 191, 0.05) 0%, rgb(255, 0, 0) 50%, rgba(191, 191, 191, 0.05) 100%);
}

table th.split, td.split{
   background-color: rgb(226, 226, 226);
   color: rgb(226, 226, 226);
   border: 0;
   border-left: 2px solid #000000;
   border-right: 2px solid #000000;
}
table.blueBorders td, table.blueBorders th{
   border: 2px solid #001aff;
}
table.red th{
   background-color: #e82a2a;
}
table.blue th{
   background-color: #5b9ef3;
}
table.grey th{
   background-color: #a5a5a5;
}
table.red tr:nth-child(even),
table.blue tr:nth-child(odd),
table.grey tr:nth-child(odd){
   background-color: #b4b4b4;
   color: #000000;
}
table.red tr:nth-child(odd),
table.blue tr:nth-child(even),
table.grey tr:nth-child(even){
   background-color: #E2E2E2FF;
   color: #000000;
}
table.blueComplete tr:nth-child(even) {
   background-color: #84daec;
   color: #000;
}
table.blueComplete tr:nth-child(odd) {
   background-color: #5b9ef3;
   color: #000;
}
input.thButton {
   color: #fdfbfb;
   background: rgba(0, 0, 0, 0);
}