/*
 * Copyright (c) 2025 Frank Fischer <frank2.fischer@tu-dortmund.de>
 *
 * This program is free software: you can redistribute it and/or
 * modify it under the terms of the GNU General Public License as
 * published by the Free Software Foundation, either version 3 of the
 * License, or (at your option) any later version.
 *
 * This program is distributed in the hope that it will be useful, but
 * WITHOUT ANY WARRANTY; without even the implied warranty of
 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the GNU
 * General Public License for more details.
 *
 * You should have received a copy of the GNU General Public License
 * along with this program.  If not, see  <http://www.gnu.org/licenses/>
 */

body {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 80%;
    background-color: #fff;
    color: rgb(20, 20, 20);
    padding: 0;
    border: 0;
    /* background-image: url("img/background.jpg"); */
}

div#kopfgrafikbereich {
    background: no-repeat right;
    height: 93px;
    position: relative;
}

a:link {
    color: rgb(57, 111, 146);
    text-decoration: underline;
}

a:link:hover, a:visited:hover {
    background: rgb(204, 204, 204);
}

a:visited {
    color: rgb(179, 94, 115);
    text-decoration: none;
}

#container {
    background: white;
    border: 1px solid rgb(80, 79, 79);
    margin: 30px 0;
    padding: 0;
    font-size: 1em;
    min-width: 38em;
}

h1 {

}

#topnav {
    background: #001a4b;
    padding: 0.2em 2%;
    margin: 0;
    padding-top: 1.1em;
    padding-bottom: 1.1em;
    color: #ccc;
    text-align: right;
    font-family: verdana, sans-serif;
    font-weight: normal;
    vertical-align: middle;

}

h1 span code {
    font-weight: bold;
    font-size: 150%;
    font-family: impact, sans-serif;
    letter-spacing: 0.02em;
}

h1 span code abbr {
    border: #FAFAFA;
}

/*
  h1:hover span{
  color: #248;
  border-color: #248;
  }

  h1:hover {
   background: url(img/body_bg.png) #bcd;
   color: #248;
  }
*/
h2 {
    font-size: 2.2em;
    margin-top: 1.5em;
    margin-right: 1em;
    color: #7b7c7e;
    padding: 0;
    padding-left: 0.5em;
    padding-right: 1.5em;
    border: none;
    border-left: 0.5em solid rgb(161, 161, 161);
}

h3 {
    font-size: 1em;
    color: #5b9094;
    margin-left: 1em;
    margin-right: 1em;
    border-bottom: 1px dotted #4d5341;
}

h4 {
    font-size: 0.9em;
    color: #7294b1;
    margin-left: 1em;
}

h4 code {
    font-size: 1.1em;
    font-family: courier new, monospace;
    color: rgb(54, 54, 54);
    margin-left: 1em;
}

#mainmenu {
    background: rgb(94, 114, 134);
    border-top: 2px solid rgb(190, 150, 150);
    border-bottom: 4px solid rgb(65, 27, 36);
    margin: 0;
    padding: 0 0 0 3%;
    padding-top: 0.5em;
    padding-bottom: 0.5em;
    text-align: left;
    font-family: verdana;
    font-size: 2.3em;
}

#mainmenu li {
    display: inline;
}

#mainmenu li a {
    color: rgb(110, 190, 201);
    text-decoration: none;
    padding: 0 0.75em;
    padding-left: 22px;
    background: url(img/menu_point.png) 10px 55% no-repeat;
    border: 1px solid #bcd;
}

#mainmenu li a#active {
    color: rgb(94, 9, 30);
    border-bottom: 1px solid rgb(39, 7, 15);
    font-style: italic;
    background: url(img/menu_point_active.png) 5px 55% no-repeat #FFFFCC;

}

#mainmenu li a:hover {
    color: rgb(143, 58, 79);
    background: url(img/menu_point_hoover.png) 5px 55% no-repeat #FFFFCC;
    text-decoration: none;
    border: 1px solid #bcd;
}

#menu {
    font-size: 90%;
    background: rgb(87, 103, 119);
    margin: 0;
    width: 20%;
    min-width: 13em;
    float: right;
    list-style-type: none;
    padding: 1em 0;
    border-left: 1px solid rgb(109, 102, 102);
    border-bottom: 1px solid rgb(27, 24, 24);
    border-right: 3px solid rgb(66, 2, 18);
}

#menu li a {
    display: block;
    text-decoration: none;
    color: rgb(180, 177, 177);
    padding: 0.1em 0.5em;
    background: rgb(68, 87, 124);
    margin: 0.5em 0 0 0;
}

* html #menu li a, * html #menu li li a {
    width: 100%;
}

#menu a:hover {
    background: #c03;
    color: #fff;
}

#menu li li a {
    display: block;
    color: black;
    padding: 0.07em 0.07em 0.07em 1em;
    background: #bcd;
    margin: 0;
    border-bottom: 1.4px dashed white;
}

#menu ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
}

#wisql_container {
    font-size: 90%;
    margin: 0;
    float: right;
    border-right: 3px solid #2f6da7;
    border-bottom: 2px solid rgb(190, 190, 186);
}

#wisql_container ul {
    margin: 0;
    padding: 0;
    list-style-type: none;
    font-family: verdana, arial, Helvetica, sans-serif;
}

#wisql_container li {
    margin: 0 0 1px 0;
}

#wisql_container a {
    display: block;
    padding: 5px 10px;
    width: 180px;
    color: rgb(255, 255, 255);
    background-color: #2f6da7;
    border-radius: 5px;
    text-decoration: none;
}

#wisql_container a:hover {
    color: #fff;
    background-color: #2f6da7;
    text-decoration: none;
}

#wisql_container ul ul li {
    margin: 0 0 1px 0;
}

#wisql_container ul ul a {
    display: block;
    padding: 5px 5px 5px 20px;
    width: 87%;
    font-size: 14px;
    color: rgb(255, 255, 255);
    text-decoration: none;
    border-radius: 5px;
}

#wisql_container ul ul a:hover {
    color: #fff;
    background-color: #2f6da7;
    border-radius: 5px;
    text-decoration: none;
}

#wisql_container ul a {
    /*background: url(img/menu_point_hoover.png) 2px 55% no-repeat #036;*/
    font-weight: bold;
}

#wisql_container ul ul a {
    /*background: none;
  background-color: #369;*/
    font-weight: normal;
}

#feedback_div {
    background-color: #e7f3fe;
    border-left: 6px solid #2196f3;
    padding-left: 5px;
}

.infobox {
    z-index: 3;
}

.infobox a {
}

#wisql_container ul .infobox a:hover {
    width: 180px;
}

#wisql_container ul ul .infobox a:hover {
    width: 175px;
}

.infobox a span {
    display: none;
}

#wisql_container ul .infobox a:hover span {
    color: #2f6da7;
    background: rgb(233, 231, 231);
    border: 1px solid #2f6da7;
    display: block;
    margin-top: 5px;
}

#wisql_container ul ul .infobox a:hover span {
    color: #2f6da7;
    border: 1px solid #2f6da7;
    background: rgb(233, 231, 231);
    display: block;
    margin-top: 5px;
    margin-left: -20px;
}

#content {
    padding: 1em 1.5em 1em 1.5em;
    max-width: 85em;
    line-height: 140%;
}

#doku #content {
    padding: 1em 22% 1em 1.5em;
    max-width: 55em;
}

#content p {
    margin-left: 1em;
    margin-right: 1em;
}

#content li {
    list-style-type: square;
}


#footer {
    font-weight: bold;
    clear: both;
    padding: 0.4em 1em;
    margin: 0;
    border-top: 1px solid rgb(27, 99, 109);
    background: #051636;
    color: rgb(57, 124, 113);
}

#footer a {
    color: #c03;
}

/* Formatierungen fuer Beispiele*/
.bb, .html, .demo, .php {
    padding: 4px;
    padding-left: 0.5em;
    border: 1px solid #649600;
    margin-left: 1em;
    margin-right: 1em;
    background: #efefff;
}

.logo {
    color: #ccc;
}

.logo_name {
    font-family: "Lucida sans", "Arial", "sans-serif";
    font-size: 90%;
    font-style: italic;
    color: #649600;
    margin-right: 0.5em;
}

.main_title {
    font-size: 90%;
    letter-spacing: 1px;
    color: #ccc;
}

#impressum_link a {
    font-size: 60%;
    color: #bcd;
    letter-spacing: 1px;
    padding: 0 0.75em;
    padding-left: 22px;
    background: url(img/menu_point.png) 10px 55% no-repeat;
    margin-left: 2em;
}

#impressum_link a#active {
    color: #c03;
    border-bottom: 1px solid #c03;
    font-style: italic;
    background: url(img/menu_point_active.png) 5px 55% no-repeat #FFFFCC;

}

#impressum_link a:hover {
    color: #c03;
    letter-spacing: 1px;
    background: url(img/menu_point_hoover.png) 5px 55% no-repeat;
    text-decoration: none;
}

.text {
    padding-left: 1em;
}

.bb, .html {
    font-family: "courier new", monospace;
    font-weight: normal;
    white-space: pre;
}

.bbtn {
    font-family: "courier new", monospace;
    font-weight: normal;
    color: #000;
}

.bben {
    font-family: "courier new", monospace;
    font-weight: normal;
    color: #f00;
}

.bben .bbtn {
    color: #060;
}

.bben .bben {
    color: #00f;
}

.bben .bben .bbtn {
    color: #0a0;
}

.b {
    font-weight: bold;
}

.i {
    font-style: italic;
}

.comment {
    color: #444;
}

.funcn {
    color: #090;
}

td, th {
    vertical-align: top;
    text-align: left;
}

.exclaim, .example {
    background-color: #fff;
    padding: 0.5em 2em 1.5em 2em;
    padding-left: 0em;
    padding-right: 0em;
    margin: 0;
    border: none;
}

.exclaim h4, .example h4 {
    padding-left: 0;
}

.exclaim p, .exclaim li, .exclaim dl {
    background: #eee url(img/exclam.gif) scroll no-repeat right top;
    padding: 0.5em 2em;
    padding-top: 1em;
    padding-bottom: 1em;
    padding-right: 2em;
    margin: 0;
    margin-right: auto;
    margin-bottom: 0.5em;
    border: none;
    border-bottom: 1px solid #ccc;
}

.exclaim dl {
    margin-left: 1em;
    margin-right: 1em;
}

.exclaim dl dt, .exclaim dl dd {
    margin-right: 1.5em;
}

.example p, .example li, .example dl {
    /*background-image: url("img/background.jpg");*/
    padding: 0.5em 2em 1.5em 4em;
    padding-top: 1em;
    margin: 0;
    font-size: 15px;
    border: none;
    border-top: 1px dashed #cc6;
    border-right: 1px solid #993;
    border-left: 1px solid #cc6;
}

.example dl dt {
    font-weight: bold;
}

.example dl dd {
    color: #248;
}

.exclaim li, example li {
    list-style-type: none;
}

.exclaim code, .example code {
    font: bold 1.2em/1.5em monospace;
    text-transform: uppercase;
}

.tableflags {
    border-collapse: collapse;
    border-spacing: 0;
    width: 100%;
    max-height: 500px;
    overflow-y: scroll;
    border: 1px solid #ddd;
}

.tableflags table {
    background-color: #fff;
    width: 100%;
    padding: 0.5em 2em 1.5em 2em;
}

.tableflags th {
    color: #000000;
    padding: 0.2em 0.5em;
}

.tableflags td {
    color: #000;
    background-color: #f1f1f1;
    padding: 0.2em 0.5em;
}

.tableflags tr:nth-child(odd) td {
    background-color: #fff;
    color: rgb(78, 77, 77);
}

.tooltip {
    color: #649600;
    background-color: transparent;
    padding: 0.1em;
    border: none;
    border-bottom: 1px dotted #649600;
    cursor: help;
}

.tooltip:focus, .tooltip:hover, .tooltip:active {
    background-color: #c3d2e1;
}

.bullet {
    padding-top: 2em;
    padding-bottom: 1em;
    margin-top: -1em;
}

.links li, .bullet li {
    color: #c03;
    list-style-type: square;
}

.links a:link {
    color: #000;
    text-decoration: none;
    border-bottom: 0.1em solid #bcd;
}

.links a:visited {
    color: #000;
    border-bottom: 0.1em solid #eef;
}

.links a:focus, .links a:hover, .links a:active {
    color: #000;
    border-bottom: 0.1em solid #c03;
}

.bullet span {
    color: #000;
}

.bullet span span {
    color: #c03;
    text-decoration: none;
    border: none;
}

#content .no_bullet li {
    list-style-type: none;
}

.links_extern li {
    margin-left: -1em;
    padding-left: 22px;
    display: block;
    list-style-type: none;
    background: url(img/link_extern.gif) 0px 55% no-repeat;
}

a.extlink:link {
    padding-left: 15px;
    color: #c03;
    text-decoration: none;
    font-weight: normal;
    background-image: url(img/link_extern.gif);
    background-repeat: no-repeat;
    background-position: top left;
}

a.extlink:visited {
    padding-left: 15px;
    color: #cc0033;
    text-decoration: none;
    font-weight: normal;
    background-image: url(img/link_extern.gif);
    background-repeat: no-repeat;
    background-position: top left;
}

a.extlink:hover {
    padding-left: 15px;
    color: #c03;
    text-decoration: underline;
    font-weight: normal;
    background-image: url(img/link_extern.gif);
    background-repeat: no-repeat;
    background-position: top left;
}

a.extlink:active {
    padding-left: 15px;
    color: #ff0000;
    text-decoration: none;
    font-weight: normal;
    background-image: url(img/link_extern.gif);
    background-repeat: no-repeat;
    background-position: top left;
}

.special_notice {
    padding-left: 25px;
    color: #c03;
    text-decoration: none;
    font-weight: normal;
    background-image: url(img/information.png);
    background-repeat: no-repeat;
    background-position: top left;
}

.special_button_add {
    color: #000000;
    margin-top: 0.5em;
    padding-left: 18px;
    text-decoration: none;
    background: #fff;
    border: 2px solid #0c121b;
    color: #383d3c;
    font-weight: normal;
    padding-top: 0.1em;
    padding-bottom: 0.1em;
    background-repeat: no-repeat;
    background-position: center left;
    cursor: pointer;
    transition: all 0.25s ease;
    margin-left: 2%;
    margin-right: 2%;
    width: 170px;
    height: 40px;
    text-align: center;
    font-size: 12px;
    margin-top: 1%;
    margin-bottom: 1%;
    padding: 10px;
}

.special_button_add:hover {
    color: rgb(248, 241, 241);
    background: #5692ca;
}

.special_button_add:active {
    letter-spacing: 2px;
    color: rgb(248, 241, 241);
}

.special_button_add:after {
    content: "";
}

.special_button_add.highlight {
    background-color: rgb(0, 137, 228);
    color: rgb(248, 241, 241);
}

.special_button_add.highlight:hover {
    background: #5692ca;
    color: rgb(248, 241, 241);
}

.fail {
    color: #c03;
}

.okay {
    font: bold 1em/1.2em sans-serif;
    color: #093;
    padding-left: 25px;
    text-decoration: none;
    background-image: url(img/accept.png);
    background-repeat: no-repeat;
    background-position: center left;
}

.hint {
    font-style: italic;
    padding-left: 25px;
    text-decoration: none;
    background-image: url(img/flag_green.png);
    background-repeat: no-repeat;
    background-position: center left;
}

.error {
    font: bold 1.2em/1.3em sans-serif;
    color: #c03;
    padding-left: 25px;
    text-decoration: none;
    background-image: url(img/error.png);
    background-repeat: no-repeat;
    background-position: center left;
}

.error_en {
    font: bold 1.2em/1.3em sans-serif;
    color: #c03;
    padding-right: 25px;
    text-decoration: none;
    background-image: url(img/gb.png);
    background-repeat: no-repeat;
    background-position: center right;
}

.error_de {
    font: bold 1.2em/1.3em sans-serif;
    color: #c03;
    padding-right: 25px;
    text-decoration: none;
    background-image: url(img/de.png);
    background-repeat: no-repeat;
    background-position: center right;
}

#error_message {
    background-color: #FFFF66;
}

input {
    margin-top: 5px;
    height: 20px;
}

input:focus {
    border-color: #0080ff;
}

.editor {
    border-radius: 10px;
    border: 2px solid transparent;
    margin-left: 1em;
    margin-right: 1em;
    margin-top: 0.5em;
    margin-bottom: 0.5em;
    padding: 0.5em;
    height: 400px;
}

.sql_formular {
    padding: 0;
    padding-top: 1em;
    padding-left: 1em;
    padding-right: 1em;
    margin: 0;
    padding: 10px;
}

.sql_formular form {

    padding: 0;
    margin: 0;
    border: 1px solid #ccc;
    padding: 10px;
}

.sql_formular form fieldset {
    border: none;
}

.sql_formular form legend {
    font: bold 1.3em/1.5em monospace;

    border-bottom: 2px dashed #44475a;

    color: #44475a;
    padding: 0;
    margin: 0;
    margin-bottom: 0.5em;
}

.sql_formular h3 {
    color: #5b9094;
}

.sql_formular label {
    margin: 2px;
    padding-left: 25px;
    color: #5b9094;;
    text-decoration: none;
    font-weight: normal;
    background-image: url(img/database_edit.png);
    background-repeat: no-repeat;
    background-position: top left;
}

.sql_formular form fieldset p {
    margin: 1em;
    color: #44475a;
    text-decoration: none;
    font-weight: normal;
}

.sql_formular form textarea {
    overflow: hidden;
    margin-left: 1em;
    margin-bottom: 0.5em;
    margin-top: 1.0em;
    padding: 1em;
    border-radius: 10px;
    border: 2px solid transparent;
    outline: none;
    font-family: "Heebo", sans-serif;
    font-weight: 500;
    font-size: 20px;
    color: #bcd;
    width: 96%;
    background-color: #44475a;
}

.sql_formular form textarea:focus {
    cursor: text;
    border-color: #bcd;
}

.sql_formular form select {
    margin-left: 1em;
    margin-bottom: 0.5em;
    width: auto;
}

.sql_formular form .buttons {
    text-align: right;
    padding: 0.5em;
    margin-bottom: 30px !important;

}

.sql_formular form p {
    color: #5b9094;
}

.sql_formular form .buttons input {
    width: auto;
    display: inline-block;;
    float: none;
    color: #000000;
    text-align: right;
    padding-left: 18px;
    text-decoration: none;
    font-weight: bold;
    padding-top: 0.2em;
    padding-bottom: 0.2em;
    /* background-image:url(img/control_play_blue.png); */
    background-repeat: no-repeat;
    background-position: center left;
}

.sql_formular form .captcha {
    text-align: left;
    margin-left: 0.5em;
    padding: 0.5em;
    width: auto;
    display: inline;
    float: none;
    color: #000000;
    text-decoration: none;
    font-weight: bold;
}

.sql_formular form .captcha li {
    display: inline;
}

.sql_formular form .captcha img {
    padding-right: 18px;
    background-image: url(img/arrow_right.png);
    background-repeat: no-repeat;
    background-position: bottom right;
}

.sql_login {
    background-color: #fff;
    padding: 0;
    padding-top: 1em;
    padding-left: 1em;
    padding-right: 1em;
    margin: 0;
    padding: 20px;
}

.sql_login form {
    background: #eee url(img/exclam.gif) scroll no-repeat right top;
    padding: 0;
    margin: 0;
    border: 1px solid #ccc;
    padding: 10px;
    font-size: 15px;
}

.sql_login form fieldset {
    border: none;
    padding: 10px;
}

.sql_login form legend {
    font: bold 1.3em/1.5em monospace;
    color: #5e789b;
    border-bottom: 2px dashed #5e789b;
    background-color: #eee;
    padding: 0;
    margin: 0;
    margin-bottom: 1.5em;
}

.sql_login h3 {
    color: #5b9094;
}

.sql_login label {
    margin: 1em;
    padding-left: 20px;
    color: #649600;
    text-decoration: none;
    font-weight: bold;
    background-repeat: no-repeat;
    background-position: top left;
    color: #5b9094;
}

.sql_login .name {
    background-image: url(img/user.png);

}

.sql_login .pwd {
    background-image: url(img/key.png);

}


.sql_login form .buttons {
    text-align: right;
    padding: 0.5em;
}

.sql_service {
    padding: 0;
    padding-top: 1em;
    padding-left: 1em;
    padding-right: 1em;
    margin: 0;
    padding: 10px;
}

.sql_service form {

    padding: 0;
    margin: 0;
    border: 1px solid #ccc;
    padding: 10px;
}

.sql_service form fieldset {
    border: none;
}

.sql_service form legend {
    font: bold 1.3em/1.5em monospace;

    border-bottom: 2px dashed #44475a;

    color: #44475a;
    padding: 0;
    margin: 0;
    margin-bottom: 0.5em;
}

.sql_service h3 {
    color: #5b9094;
}

.sql_service input {
    vertical-align: middle;
}

.sql_service label {
    margin: 2px;
    margin-top: 5px;
    padding-left: 25px;
    text-decoration: none;
    font-weight: normal;
    display: inline-block;
    vertical-align: middle;
}

.sql_service form fieldset p {
    margin: 1em;
    color: #44475a;
    text-decoration: none;
    font-weight: normal;
}

.sql_service form select {
    margin-left: 1em;
    margin-bottom: 0.5em;
    width: auto;
}

.sql_service form .buttons {
    text-align: right;
    padding: 0.5em;
    margin-bottom: 30px !important;

}

.sql_service form .buttons input {
    width: auto;
    display: inline-block;;
    float: none;
    color: #000000;
    text-align: right;
    padding-left: 18px;
    text-decoration: none;
    font-weight: bold;
    padding-top: 0.2em;
    padding-bottom: 0.2em;
    /* background-image:url(img/control_play_blue.png); */
    background-repeat: no-repeat;
    background-position: center left;
}

/* deactivate some stupid rules */
#inhalt div#sql_dump td {
    padding: 0
}

#inhalt div#sql_dump tr {
    border-bottom: 0;
}

#inhalt div#sql_dump div {
    margin-bottom: 0;
}

/* for block of numbers */
.hljs-ln-numbers {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;

    text-align: center;
    color: #ccc;
    border-right: 1px solid #CCC;
    vertical-align: top;
    padding-right: 5px;

    /* your custom style here */
}

/* for block of code */
.hljs-ln-code {
    padding-left: 10px;
}

#impressum dl {
    background-color: #fff;
    padding: 0;
    padding-left: 2em;
    margin: 0;
    margin-top: -1em;
}

#impressum dl dl {
    padding-left: 0;
    margin-top: 0;
}

#impressum dt {
    font: bold 1.0em/1.5em sans-serif;
    padding: 0;
    padding-top: 1em;
    padding-bottom: 0.5em;
    margin: 0;
    margin-top: -1em;
    border: none;
}

#impressum dd dt {
    font-weight: normal;
}

#impressum dd dt:after {
    content: ":";
}

#impressum dd {
    padding: 0;
    padding-bottom: 0.5em;
    margin: 0;
}

#impressum dd dd {
    padding-left: 5em;
}

#impressum dd dt + dd {
    margin-top: -2em;
}

#impressum dl a:link {
    color: #000;
    text-decoration: none;
    border-bottom: 0.1em solid #bcd;
}

#impressum dl a:visited {
    border-bottom: 0.1em solid #eef;
}

#impressum dl a:focus, #impressum dl a:hover, #impressum dl a:active {
    border-bottom: 0.1em solid #c03;
}

#impressum abbr {
    color: #248;
    text-decoration: none;
    border: none;
}

#impressum abbr:hover {
}

#impressum #impress {
    color: #bcd;
    cursor: default;
}

#impressum #impress:hover {
    cursor: default;
}

div.syntax_area {
    margin: 1em;
    padding: 0px;
    color: black;
    border-top: #bcd 2px solid;
    max-height: 500px;

    overflow: scroll;
    background: #FFFFCC;
}

div.syntax_area pre {
    margin: 0px 10px 0px 0px;
    padding: 0px 0px 0px 0px;
    font-family: "Courier New", "Courier";
    line-height: 15px;
    font-size: 12px;
    white-space: pre;
}

div.syntax_area b {
    color: black;
    font-weight: bold;
    background: #eeeeee;
    padding: 0px 4px;
    border-right: #bcd 2px solid;
    border-left: #bcd 2px solid;
}


.comment {
    color: #9f9f9f;
}

.string {
    color: #df0000;
}

.number {
    color: #00bf00;
    font-weight: bold;
}

.keyword {
    color: #0080ff;
    font-weight: bold;
}

.block {
    font-weight: bold;
}

.variable {
    color: #009F00;
}

#loading {
    position: fixed;
    left: 40%;
    top: 40%;
}

#shadow {
    position: fixed;
    left: 0;
    top: 0;

    width: 100%;
    height: 100%;

    background-color: #000000;
    opacity: 0.75;
}

/* #floatingBarsG{ */
/*     position:relative; */
/*     width:62px; */
/*     height:77px} */

/* .blockG{ */
/*     position:absolute; */
/*     background-color:#FFFFFF; */
/*     width:10px; */
/*     height:24px; */
/*     -moz-border-radius:8px 8px 0 0; */
/*     -moz-transform:scale(0.4); */
/*     -moz-animation-name:fadeG; */
/*     -moz-animation-duration:1.04s; */
/*     -moz-animation-iteration-count:infinite; */
/*     -moz-animation-direction:linear; */
/*     -webkit-border-radius:8px 8px 0 0; */
/*     -webkit-transform:scale(0.4); */
/*     -webkit-animation-name:fadeG; */
/*     -webkit-animation-duration:1.04s; */
/*     -webkit-animation-iteration-count:infinite; */
/*     -webkit-animation-direction:linear; */
/*     -ms-border-radius:8px 8px 0 0; */
/*     -ms-transform:scale(0.4); */
/*     -ms-animation-name:fadeG; */
/*     -ms-animation-duration:1.04s; */
/*     -ms-animation-iteration-count:infinite; */
/*     -ms-animation-direction:linear; */
/*     -o-border-radius:8px 8px 0 0; */
/*     -o-transform:scale(0.4); */
/*     -o-animation-name:fadeG; */
/*     -o-animation-duration:1.04s; */
/*     -o-animation-iteration-count:infinite; */
/*     -o-animation-direction:linear; */
/*     border-radius:8px 8px 0 0; */
/*     transform:scale(0.4); */
/*     animation-name:fadeG; */
/*     animation-duration:1.04s; */
/*     animation-iteration-count:infinite; */
/*     animation-direction:linear; */
/* } */

/* #rotateG_01{ */
/*     left:0; */
/*     top:28px; */
/*     -moz-animation-delay:0.39s; */
/*     -moz-transform:rotate(-90deg); */
/*     -webkit-animation-delay:0.39s; */
/*     -webkit-transform:rotate(-90deg); */
/*     -ms-animation-delay:0.39s; */
/*     -ms-transform:rotate(-90deg); */
/*     -o-animation-delay:0.39s; */
/*     -o-transform:rotate(-90deg); */
/*     animation-delay:0.39s; */
/*     transform:rotate(-90deg); */
/* } */

/* #rotateG_02{ */
/*     left:8px; */
/*     top:10px; */
/*     -moz-animation-delay:0.52s; */
/*     -moz-transform:rotate(-45deg); */
/*     -webkit-animation-delay:0.52s; */
/*     -webkit-transform:rotate(-45deg); */
/*     -ms-animation-delay:0.52s; */
/*     -ms-transform:rotate(-45deg); */
/*     -o-animation-delay:0.52s; */
/*     -o-transform:rotate(-45deg); */
/*     animation-delay:0.52s; */
/*     transform:rotate(-45deg); */
/* } */

/* #rotateG_03{ */
/*     left:26px; */
/*     top:3px; */
/*     -moz-animation-delay:0.65s; */
/*     -moz-transform:rotate(0deg); */
/*     -webkit-animation-delay:0.65s; */
/*     -webkit-transform:rotate(0deg); */
/*     -ms-animation-delay:0.65s; */
/*     -ms-transform:rotate(0deg); */
/*     -o-animation-delay:0.65s; */
/*     -o-transform:rotate(0deg); */
/*     animation-delay:0.65s; */
/*     transform:rotate(0deg); */
/* } */

/* #rotateG_04{ */
/*     right:8px; */
/*     top:10px; */
/*     -moz-animation-delay:0.78s; */
/*     -moz-transform:rotate(45deg); */
/*     -webkit-animation-delay:0.78s; */
/*     -webkit-transform:rotate(45deg); */
/*     -ms-animation-delay:0.78s; */
/*     -ms-transform:rotate(45deg); */
/*     -o-animation-delay:0.78s; */
/*     -o-transform:rotate(45deg); */
/*     animation-delay:0.78s; */
/*     transform:rotate(45deg); */
/* } */

/* #rotateG_05{ */
/*     right:0; */
/*     top:28px; */
/*     -moz-animation-delay:0.9099999999999999s; */
/*     -moz-transform:rotate(90deg); */
/*     -webkit-animation-delay:0.9099999999999999s; */
/*     -webkit-transform:rotate(90deg); */
/*     -ms-animation-delay:0.9099999999999999s; */
/*     -ms-transform:rotate(90deg); */
/*     -o-animation-delay:0.9099999999999999s; */
/*     -o-transform:rotate(90deg); */
/*     animation-delay:0.9099999999999999s; */
/*     transform:rotate(90deg); */
/* } */

/* #rotateG_06{ */
/*     right:8px; */
/*     bottom:7px; */
/*     -moz-animation-delay:1.04s; */
/*     -moz-transform:rotate(135deg); */
/*     -webkit-animation-delay:1.04s; */
/*     -webkit-transform:rotate(135deg); */
/*     -ms-animation-delay:1.04s; */
/*     -ms-transform:rotate(135deg); */
/*     -o-animation-delay:1.04s; */
/*     -o-transform:rotate(135deg); */
/*     animation-delay:1.04s; */
/*     transform:rotate(135deg); */
/* } */

/* #rotateG_07{ */
/*     bottom:0; */
/*     left:26px; */
/*     -moz-animation-delay:1.1700000000000002s; */
/*     -moz-transform:rotate(180deg); */
/*     -webkit-animation-delay:1.1700000000000002s; */
/*     -webkit-transform:rotate(180deg); */
/*     -ms-animation-delay:1.1700000000000002s; */
/*     -ms-transform:rotate(180deg); */
/*     -o-animation-delay:1.1700000000000002s; */
/*     -o-transform:rotate(180deg); */
/*     animation-delay:1.1700000000000002s; */
/*     transform:rotate(180deg); */
/* } */

/* #rotateG_08{ */
/*     left:8px; */
/*     bottom:7px; */
/*     -moz-animation-delay:1.3s; */
/*     -moz-transform:rotate(-135deg); */
/*     -webkit-animation-delay:1.3s; */
/*     -webkit-transform:rotate(-135deg); */
/*     -ms-animation-delay:1.3s; */
/*     -ms-transform:rotate(-135deg); */
/*     -o-animation-delay:1.3s; */
/*     -o-transform:rotate(-135deg); */
/*     animation-delay:1.3s; */
/*     transform:rotate(-135deg); */
/* } */

/* @-moz-keyframes fadeG{ */
/*     0%{background-color:#000000} */
/*     100%{background-color:#FFFFFF} */
/* } */

/* @-webkit-keyframes fadeG{ */
/*     0%{background-color:#000000} */
/*     100%{background-color:#FFFFFF} */
/* } */

/* @-ms-keyframes fadeG{ */
/*     0%{background-color:#000000} */
/*     100%{background-color:#FFFFFF} */
/* } */

/* @-o-keyframes fadeG{ */
/*     0%{background-color:#000000} */
/*     100%{background-color:#FFFFFF} */
/* } */

/* @keyframes fadeG{ */
/*     0%{background-color:#000000} */
/*     100%{background-color:#FFFFFF} */
/* } */