#logoff{
    display:block;
    width: 24px;
    height: 24px;
    background-image:url('../images/icons.png');
    background-repeat:no-repeat;
    background-position:-595px 0px;
}

/* Allgemein */
body.login {
    font-weight:bold;
    display:block;
    padding:5px;
    margin-bottom:5px;
    min-height:100%;
    font-family:helvetica;
    font-size:0.8em
}

body.login #alertBox01 {
    font-weight: 100;
}

body {
    display:block;
    padding:5px;
    margin-bottom:5px;
    line-height:1.4em;
    background:#FFF;
    min-height:100%;
    font-family:arial;
    font-size:0.75em;
}
body.isMobile {
    padding: 0px;
    margin: 0px;
    width: 100vw;
    height: 100vh;
}

.Stunde {
    text-align: center;
    padding: 0px;
    margin: 5px;
    background-color: #FFF000;
    display: block;
}

.notenAnmerkungen{
    display:none
}

a {
    cursor:pointer;
    text-decoration:underline;
    color:#185ca3;
}

h1 {margin:0 0 10px 0;padding:0;font-size:1.2em}

th {
    min-height:20px;
    margin-right: 5px;
    background: #e1e1e1;
    text-align: left;
    white-space:nowrap;
}

/* spezifische Formatierungen*/

#container {
    width:1000px;margin:auto auto
}

#container100w {
    width:100%;
    margin:auto auto;
    min-width:1000px;
    min-height:600px;
    max-height:100%;
}
body.isMobile #container100w {
    min-width: unset;
}

#spezi_navi a {cursor:pointer;text-decoration:none;	}
#spezi_navi a.spezi_navi {}
body:not(.isMobile) #spezi_navi a.spezi_navi:hover {text-decoration:none}
#spezi_navi a.spezi_navi.selected {text-decoration:none}


/* Login */

#login {
    position: absolute;
    top: 33%;left: 50%;
    width: 320px;
    min-height: 240px;
    margin-top: -110px;
    margin-left: -150px;
    color: #444444;
}


/* Registrierung */

#registration {display:none;position: absolute;top: 50%;left: 50%;width: 340px;height: 400px;margin-top: -200px;margin-left: -170px;border:3px double #000;padding:10px;background-color:#e7e7e7}
#messageRegisterOk {position: absolute;top: 50%;left: 50%;width: 260px;height: 50px;margin-top: -150px;margin-left: -130px;padding:10px;text-align:center;color:red}

#auswertungenListContainer {
    width: 320px;
    float: left;
}     

#left {
    width:200px;
    margin-left: 5px;
    float: left;
    margin-top: 10px;
}
#container100w #left {
    width:250px;
}
#page_auswertungen #container100w #left,
#page_auswertungenAtlLists #container100w #left {
    width: 320px;
}
body.isMobile #left {
    float: unset;
    width: 100% !important;
    margin-top: unset;
    margin-left: unset;
}

#left .dataTables_info {
    margin-top: 5px;
}

#left li {
    list-style-type:none;
}

#left a {
    text-decoration:none;
}

#left a:active {
    color:#F00;
}

#left a:selected {
    color:#F00;
}

.clicked {
    color:#F00;
}

#docTree .treeElem, #docUploadTree .treeElem, #appFctsTree .treeElem {
    height: 15px;
    margin-top: 7px;
    margin-bottom: 8px;
    cursor: pointer;
    float: left;
}

.treeItemContainer {
    overflow: auto;
}

.treeLvl_00 {
    margin-left: 0px;
}

.treeLvl_01 {
    margin-left: 15px;
}

.treeLvl_02 {
    margin-left: 35px;
}

#gesamteBreite {
    display:none;
}

/*#main {*/
#outerMain {
    margin-left:260px;
    padding-left:5px;
    min-width: 600px;
    min-height: 480px;
}
body.isMobile #outerMain {
    margin-left: unset;
    padding-left: unset;
    min-width: unset;
}

#main {
    min-width: 800px;
    margin: 0px auto;
}
body.isMobile #main {
    min-width: unset;
}

#main_ohne_left {
    margin-left:0px;
    margin-top: 10px;
    display:none;
}
body:not(.isMobile) #main_ohne_left {
    min-width: 600px;
    min-height: 480px;
}

#stammdaten_optional{
    float: right;
    margin-right: 40px;
    padding-left: 5px;
    height: 60px;
    text-align:right;
}

#stammdaten {
    height: 60px;
}


#details {
    width: 95%;
    padding-top:20px;
    min-height: 240px;
}


input, .eingabemitrahmen, select {
    border: 0px;
}

#left input[type="text"], #suchergebnisFilterAuswertungen {
    width: 99%;
    margin-top: 2px;
    margin-bottom: 2px;
}

#left select {
    width: 100%;
}

select.az {
    width: 150px;
}

#details .betrieb_stammdaten{
    width:100%;
    padding-bottom: 3px;
}

#details .pupil_klasse{
    width:100%;
    padding-bottom: 3px;
}

/* Global */

.center {text-align:center;}
.fach {width: 150px;}
.note,
.note.column_width_after_init {
    width: 32px;
}/* bei Änderung auch in noten.js in function toggleTable(element) und toggleTableZeugnis(element) anpassen!!! */
/*.schnittS {width: 35px; text-align:center;}
.schnittM {width: 35px; text-align:center;}
.schnittA {width: 35px; text-align:center;}
.schnittB {width: 35px; text-align:center;}
.schnittGes {width: 35px; text-align:center;}
.schnittZeu{width: 35px; text-align:center;}
.schnittMAN {width: 35px; text-align:center;}*/
.gewichtung{width: 32px;}

.bezeichnung {width: 120px;}
.bezeichnung10 {width: 100px;}
.bezeichnung12 {width: 120px;}
.bezeichnung16 {width: 160px;}
.bezeichnung21 {width: 210px;}
.bezeichnung30 {width: 300px;}
.bezeichnung40 {width: 400px;}
.bezeichnung50 {width: 500px;}
.telefon {width: 120px;}
.datum {width: 100px;}
/*.email {width: 140px;}*/
.email2 {width: 210px;}

/* Inputs */

input.login {width:150px}
input.regular {
    width:230px;
}
input.medium {width:170px}
input.short {width:52px}
input.datum{width:100px}
input.note_notenerfassung {
    text-align:center;
    border: 0px;
    height: 100%;
}

.inputContainer input {
    padding-left: 4px;
}

.inputContainer {
    font-size: 15px;
}

.lpx_datatables tr {
    height: 30px;
}

#formzeugnis  div.Faecher table tbody tr td input {width: 32px;height:22px}

input, input[readonly], select, textarea { 
    background: transparent;
    outline: none;
    cursor: auto;
}

select.regular {width:233px}
select.long {width:610px}

/* Button */
.rundeEcken{
    -moz-border-radius:10px;
    -khtml-border-radius:10px;
    -moz-box-shadow: 1px 2px 4px #6e6e6e;
    -khtml-box-shadow: 1px 2px 4px #6e6e6e;
    box-shadow: 1px 2px 4px #6e6e6e;
    border-radius:10px;

    background: #FFF;
    border: 1px solid #e1e1e1;
    /*-ms-filter:"progid:DXImageTransform.Microsoft.Shadow(color=#6e6e6e, Direction=135, Strength=6)";*/
    /*border-style:outset;*/

    /*filter:progid:DXImageTransform.Microsoft.Shadow(color=#6e6e6e, direction=135);*/
}

body:not(.isMobile) .rundeEcken:hover {
    background: transparent url('/template/images/menu_bg.png') no-repeat ;

}

.progressbar {
    clear:left;
    height: 18px;
    background: green;
}

/* Validierung */
.error::-webkit-input-placeholder {
  color: red;
}
.error::-moz-placeholder {
  color: red;
}
.error:-ms-input-placeholder {
    color: red;
}

.error.datenschutzja, .error.agbja {
    color: red;
}

.errorBorder {
    border: 1px solid red !important;
}

/* UI */
.ui-tabs {font-size:1em}
.ui-tabs-nav {min-height:31px}

/*Jquery Data tables*/

#suchergebnis a {
    display:block;
}

#suchergebnis, .auswertungenList {
    width: 100%;
    margin-top: 10px;
    margin-bottom: 10px;
}

#suchergebnis table {
    width: 100%;
}

body.isMobile #suchergebnis_wrapper .dataTables_scrollBody {
    height: unset !important;
}

.sorting_asc {
    background: url('../images/sort_asc.png') no-repeat center right;
    padding-right: 15px;
}

.sorting_desc {
    background: url('../images/sort_desc.png') no-repeat center right;
    padding-right: 15px;
}

.sorting_no {
    background: no-repeat center right;
    padding-right: 15px;

}

.sorting {
    background: url('../images/sort_both.png') no-repeat center right;
    padding-right: 15px;

}
.sorting .bezeichnung10 {width: 100px;}

.sorting_disabled {
    background-color: white;
}

.sorting_asc_disabled {
    background: url('../images/sort_asc_disabled.png') no-repeat center right;
}

.sorting_desc_disabled {
    background: url('../images/sort_desc_disabled.png') no-repeat center right;
}

/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * 
 * DataTables row classes
 */
.verticalTop{
    vertical-align: top;
}

.noWrapClass{
    white-space: nowrap;
}

.wrapClass{
    white-space: normal;
}

.tdfield, .tdfieldStyle {
    text-overflow: ellipsis;
    overflow: hidden;
    margin-top: 4px;
    margin-bottom: 4px;
    margin-left: 2px;
}

table.display tr.odd.gradeA {
    background-color: #ddffdd;
}

table.display tr.even.gradeA {
    background-color: #eeffee;
}

table.display tr.odd.gradeC {
    background-color: #ddddff;
}

table.display tr.even.gradeC {
    background-color: #eeeeff;
}

table.display tr.odd.gradeX {
    background-color: #ffdddd;
}

table.display tr.even.gradeX {
    background-color: #ffeeee;
}

table.display tr.odd.gradeU {
    background-color: #ddd;
}

table.display tr.even.gradeU {
    background-color: #eee;
}

tr.odd td.checkbox {
    text-align: center;
}

tr.even td.checkbox {
    text-align: center;
}

.dataTables_length {

    float:left;

}

.dataTables_filter {
    text-align: right;
    margin-top: 10px;
    margin-bottom: 10px;
}

.highlight { 
    background-color: yellow 
}

.dataTables_info {
    float: left;
}
body.isMobile .dataTables_info {
    float: unset;
}

.dataTables_paginate {
    width: 44px;
    float: right;
    text-align: right;
}

#betrieb{
    width:100%;
}
#abwesenheit {
    width:100%;
}
#strafkarte{
    width:100%;
}


/*Drag and Drop*/
#sortable1, #sortable2 {list-style-type: none; margin: 0; padding: 0; float: left; margin-right: 5px; }
#sortable1 li, #sortable2 li {font-size: 1.2em;}
.listItem{color:#000;position: relative;display: block; float: left;list-style-type: none;height: 50px;width: 280px;padding: 0px;margin: 5px; margin-left: 8px;background: #FFF;}

.tooltip {
    display:none;
    background:transparent url(../images/black_arrow.png);
    font-size:12px;
    height:70px;
    width:160px;
    padding:25px;
    color:#fff;
}

#stundenplan
{
    position:relative;
    margin: 10px 10px 10px 10px;
}

#stundenplan table
{
    border:0px;
    padding: 5px;
}

#stundenplan tr
{
    border:1px solid black;
    padding: 5px;
}

#stundenplan td
{
    border:1px solid black;
    margin: 2px;
}

#stundenplan th
{
    border:1px solid black;
    padding: 5px;
    text-align:center;
    width: 150px;
}

#stundenplan .Sun
{
    display:none;
}

#stundenplan .obenLinks
{
    background-color: #FFFFFF;
}

#tabs {
    border: 0px;
    margin-top:10px;
}
body.isMobile #tabs {
    margin-top: unset;
    padding: unset;
}
body.isMobile #tabs li {
    font-weight: 600;
}

.fachgruppe {
    overflow-y:none;
    -ms-overflow-y:hidden;
    min-height:550px;
}

/* Tabellen layout normal */

.normaleTabelle{
    border-collapse:collapse;
    table-layout:fixed;
}
.normaleTabelle tr{height:25px ;}

.normaleTabelle th, .normaleTabelle td:not(:first-child){text-align:center;}

.normaleTabelle td,
.normaleTabelle th{border:1px solid ;}

.normaleTabelle input,
.normaleTabelle td:not(first-child) ,
.normaleTabelle th:not(first-child) {
    width:50px;
    margin:0px;
    padding:0px;
    height:22px;
}



/* Tabelle spezial */


.letzteZelleBreiter td:last-child,
.letzteZelleBreiter th:last-child{
    width:150px;
    margin:0px;
    padding:0px;
    height:22px;
    text-align:left;

}

.ersteZeileWeiss tr:first-child th{
    background:white;

}
.ersteZelleWeiss th:first-child {
    background:white;
    text-align:left;
    /*width:100px;*/
    margin:0px;
    padding:0px;
    height:22px;
}



/* speziel Tabelle Zeugnisnoten erfassen breitere Zellen */
.breitereZellen{
    /*border-collapse:collapse;
    table-layout:fixed;*/
}


.breitereZellen th, .breitereZellen td:not(:first-child){text-align:center;}
.breitereZellen td.name,.breitereZellen th.name {width: 200px; white-space: nowrap}

.breitereZellen td,
.breitereZellen th{border:1px solid ;width: 32px;white-space: normal;}

.breitereZellen input,
.breitereZellen td {
    margin:0px;
    padding:0px;

}

.textUnten{
    vertical-align:bottom;
}

img {
    border: 0px;
}

textarea {
    overflow: auto;
    line-height:1.4em;
    width: 99.3%;
}

textarea[readonly] {
    background: transparent;
    border: 0px;
    width: 99.3%;
    resize: none;
}

.formular_einfach {
    width: 50%;
    margin: 5px 0px;
    min-height: 27px;
    display: flex;
    justify-content: space-between;
}

.schuelerInfo{
    width: 99.3%;
}

.formular_einfach.agbja, .formular_einfach.datenschutzja {
    display: block;
}

.formular_einfach .bezeichnung {
    width: 50%;
}

.formular_einfach .eingabe {
    width: 50%;
    position: relative;
}

.formular_einfach .eingabemitrahmen{
    width:63%;
    /* keine background-color definieren */
    border: 1px solid #c2c2c2; 
}


.formular_einfach .eingabe .required{
    width:99.3%;
}

.formular_einfach .eingabe .regular{
    width:99.3%;
}

/*.formular_einfach .eingabe .datum{
    width: 90%;
}

#gesamteBreite .formular_einfach .eingabe .datum,
#gesamteBreite .formular_einfach .eingabe .lupe_input {
    width: 90%;
}*/

input.lupe_input[readonly] {
    text-overflow: ellipsis;
}

#gesamteBreite .formular_doppelt .eingabe .datum {
    width: 96.5%;
}

.formular_einfach .eingabe .select {
    width:99%;
}

.formular_einfach .zeile {
    width: 100%;
}

.formular_einfach .bezeichnungMultilingual,
.formular_textfeld_dreifach .bezeichnungMultilingual {
    width: 25%;
}

.formular_einfach .bezeichnung_second_language,
.formular_textfeld_dreifach .bezeichnung_second_language {
    width: 25%;
    text-align: right;
}

.formular_textfeld_dreifach,
.formular_textfeld_zweifach {
    width: 50%;
    margin: 5px 0px;
    display: flex;
    justify-content: space-between;
}
.formular_textfeld_zweifach {
    height: 59px;
}

.formular_textfeld_dreifach {
    height: 91px;
}

.formular_textfeld_dreifach textarea,
.formular_textfeld_zweifach textarea {
    resize: none;
}

.formular_textfeld_dreifach .bezeichnung,
.formular_textfeld_zweifach .bezeichnung,
.formular_textfeld_dreifach .eingabe,
.formular_textfeld_zweifach .eingabe {
    width:50%;
    height:50px;
}

.formular_textfeld_dreifach .baustein,
.formular_textfeld_zweifach .baustein {
    width:20%;
}

.formular_textfeld_zweifach .eingabe .textfeld {
    font-family: arial;
}

.formular_textfeld_dreifach .eingabe .textfeld{
    height: 85px;
    padding: 0px;
}

.formular_textfeld_dreifach_doppelt,
.formular_textfeld_zweifach_doppelt {
    width:97%;
    margin:5px;
}
.formular_textfeld_zweifach_doppelt {
    height:50px;
}

.formular_textfeld_dreifach_doppelt {
    height:75px;
}

.formular_textfeld_dreifach_doppelt .bezeichnung,
.formular_textfeld_zweifach_doppelt .bezeichnung {
    width:17%;
    height:50px;
}
.formular_textfeld_dreifach_doppelt .eingabe,
.formular_textfeld_zweifach_doppelt .eingabe {
    width:83%;

}
.formular_textfeld_dreifach_doppelt .eingabe .textfeld,
.formular_textfeld_zweifach_doppelt .eingabe .textfeld,
.formular_textfeld_dreifach_doppelt .eingabe textarea,
.formular_textfeld_zweifach_doppelt .eingabe textarea {
    height: 100%;
}


.formular_doppelt {
    width: 100%;
    margin: 5px 0px;
    display: flex;
    justify-content: space-between;
}


.formular_doppelt_abschluss {
    width:100%;
    clear: before;
    margin-top:5px;
    height: auto;
}

.formular_doppelt .bezeichnung {
    width: 25%;
}

.formular_doppelt .eingabe{
    width: 75%;
    line-height: 27px;
}

.formular_doppelt .eingabe .regular{
    width:100%;
}

.formular_doppelt upload{
    width:100%;
}

.freitextContainer {
    min-height: 621px;
    /* !!! MUSS AUCH IN index_interessent.tpl GEÄNDERT WERDEN !!!
    Wert hier + 12px */
}

.multiLineText {
    width: 100%;
    margin-bottom: 5px;
}

#dialogNotiz {
    height:300px;
}

#dialog {
    height:240px;
}

#dialogNotiz .dialog_einfach {
    width:100%;
    float:left;
    margin:5px;
    height:20px;
    display:block
}

.dialog_einfach {
    width:100%;
    float:left;
    margin:5px;
    height:20px;
    display:block
}

.dialog_einfach .leistung_typ,
.dialog_einfach .bezeichnung {
    width:36%;
    float:left;
    display:block;
}

.dialog_einfach .eingabe{
    width:64%;
    display:block;
    float:left;
}

.dialog_einfach .eingabe .required{
    width:99.3%;
    display:block;
    float:left;
}

.dialog_einfach .eingabe .regular{
    width:99.3%;
    display:block;
    float:left;
}

.dialog_einfach .eingabe .datum{
    width:88%;
    display:block;
    float:left;
}

div.container {
    clear:left;
    border-color: 1px solid red;
    color:red;
    width: 100%;
    height:50px;
    display:none;

}

.clearer {
    clear: both;
}

/* * * * * * * * * * * * * * * * * *
 * * * * * * *  Schwarzesbrett*/
div.schwarzesbrett{
    border:1px solid black;
}
div.termin{
    display:table;
    min-width:10%;
    max-width:572px;
    padding-left:10px;
    background: url(/template/images/schwarzesbrett.png)no-repeat center top;
    margin-bottom:10px;
}
div.termin_title{

    padding:20px 15px 0px 5px;
    font-weight:bold;
}
div.termin_content{

    padding:0px 15px 15px 5px;
}

.dataTables_wrapper { width: 100%;}

#anmeldung_dialog {display:none}

#anmeldung_dialog div {width: 100%; height:100%; overflow: auto;}

.lpx_datatables {
    width: 100%;
    border-spacing: 0px;
}

.dataTables_scrollBody th {
    min-height: 1px;
}

/* #anmelung_dialog {
    display:none;
}
*/

#anmeldungok{
    display:none;
}

#agb_dialog {
    display:none;
}

#datenschutz_dialog {
    display:none;
}

div.buttonweiter {
/*    height: 30px;
    width: auto;
    float: right;*/
    margin-left: 10px;
}
div.buttonweiter input {
    cursor:pointer;
    height:30px;
    width:105px;
    color:#ffffff;
    font-weight:bold;
    border:none;
    overflow:visible;
    margin:0px;
    padding:0px 4px 2px 4px;
    font-size:11px;
    font-family:Verdana, Arial, Helvetica, sans-serif
}
.weiterstd {background:url('../images/weiter_hell.png') left  no-repeat;}
.weiterhover {background:url('../images/weiter_dunkel.png') left  no-repeat;}

div.buttonzurueck {
/*    height: 30px;
    width: auto;
    float: right;*/
}
div.buttonzurueck input {cursor:pointer; height:30px; width:105px; color:#ffffff; font-weight:bold; border:none; overflow:visible; display:inline; margin:0px; padding:0px 4px 2px 4px; font-size:11px; font-family:Verdana, Arial, Helvetica, sans-serif}
.zurueckstd {background:url('../images/Zurueck_hell.png') left  no-repeat;}
.zurueckhover {background:url('../images/Zurueck_dunkel.png') left  no-repeat;}


.weiter {
    clear:after;
    float:right;
}

.right {
    text-align:right;
}

.rechts {float:right}

.links {float:left}

.ui-tabs-panel {
    padding: 0.5em;
}
.ui-tabs-paging-next {
    float: right !important;
}
.ui-tabs-paging-prev a,
.ui-tabs-paging-next a {
    display: block;
    position: relative;
    top: 1px;
    border: 0;
    z-index: 2;
    padding: 0px;
    text-decoration: none;
    cursor: pointer;
}

.ui-datepicker-trigger {
    float: right;
    position: relative;
    cursor: pointer;
}

.ui-datepicker-title select {
    width: 100% !important;
}

.vorlage{
    width:80%;
    height:400px;
}

a.blau {
    color: #55abcf;
}

/* NAVIGATION */

/* Navigation */
#menue{
    clear:both;
    width: 100%;
    height: 38px;
}

#navi {
    width: 100%;
    overflow: hidden;
    line-height: 0;
    padding-top: 7px;
}

#navi ul {
    margin: 0;
    padding: 0;
}

#navi,#navi ul {
    z-index: 100;
}

#navi a {
    color: #000;
    text-decoration:none;
}

#navi ul li {
    display: inline;
    float: left;
    list-style-type: none;
    margin: 0;
    padding: 0;
}

#navi ul li a {
    display: block;
    width: auto;
    margin: 0 2em 0 1em;
    padding: 15px 0.5em 0 0.5em;
    text-decoration: none;
    color: #000000;
    height: 15px;
    font-size: 1.1em;
}

#navi ul li a.kurz {
    display: block;
    width: auto;
    margin: 0;
    padding: 0 0.5em 0 0.5em;
    text-decoration: none;
    color: #000000;
    height: 24px;
}

#navi ul li.navi  a {
    width: 110px;
    margin: 0 0.5em 0 0;
    white-space: nowrap;
}

#navi ul li.navi  a.kurz {
    width: 20px;
    margin: 0 0.5em 0 0;
}

#navi ul li a.selected {
    font-weight: bold;
    color: #006cb3;
}


body:not(.isMobile) #navi li a:hover {
    background: #DDDDDD;
}
/***Top-Navi 2. Ebene***/
#navi ul.subnavi {
    display: none;
    background: #ff0000;
    width: 200px;
}

#navi ul.subnavi li {
    float: none;
    display: block;
}

#navi ul.subnavi li a {
    background: #efefef;
    width: 200px;
}

#navi a.subnavi_link {
    padding-top: 18px;
    padding-bottom: 2px;
}

body:not(.isMobile) #navi ul.subnavi li a:hover {
    background: #DDDDDD;
}

.subnavi_hover{
    margin-bottom: 0 !important;
    position: absolute !important;
}

label.icon {
    width: 16px;
    height: 16px;
    margin: 0 2px;
    display:block;
    float:left;
}

label.pdf {
    background: transparent url(../images/icons/icon_pdf.gif) no-repeat center right;
}

label.doc,
label.docx,
label.ods,
label.rtf {
    background: transparent url(../images/icons/icon_doc.gif) no-repeat center right;
}

label.txt {
    background: transparent url(../images/icons/icon_txt.gif) no-repeat center right;
}

label.png,label.gif,label.bmp,label.jpg,label.tiff,label.jpeg    {
    background: transparent url(../images/icons/icon_pic.gif) no-repeat center right;
}

label.html {
    background: transparent url(../images/icons/icon_popup.gif) no-repeat center right;
}

label.download {
    background: transparent url(../images/icons/download_16.png) no-repeat center right;
    cursor:pointer;
}

label.sendMail {
    background: transparent url(../images/icons/email_forward_16.png) no-repeat center right;
    cursor:pointer;
}

label.preview {
    background: transparent url(../images/icons/view_16.png) no-repeat center right;
    cursor:pointer;
}

label.nopreview {
    background: transparent url(../images/icons/filler.png) no-repeat center right;
    cursor: auto;
}


label.xls, label.xlsx, label.odt {
    background: transparent url(../images/icons/icon_xls.gif) no-repeat center right;
}

.portlet {
    max-height:500px;

}

.portlet-content {
    overflow-x:hidden;
    overflow-y:auto;
}
.portlet-content table {
    background: transparent;
    margin: 0px;
    padding: 0px;
    border-collapse:collapse;
    border-spacing: 0px;
}

.portlet-content table thead {
    /*background: transparent;*/
    border: 0px;
    border-bottom: 1px solid #000;
}

.portlet-content table tr th,
.portlet-content table tr td {
    /*background: transparent;*/
}

.portlet-content table tr th.th-gebliste-name,
.portlet-content table tr td.td-gebliste-name {
    /*background: transparent;*/
    width: 53%;
}
th.th-gebliste-name,
td.td-gebliste-name {
    /*background: transparent;*/
    width: 53%;
}

.portlet-content table tr .th-gebliste-dat,
.portlet-content table tr .td-gebliste-dat {
    /*background: transparent;*/
    width: 30%;
    float:center;
}

.th-gebliste-dat,
.td-gebliste-dat {
    /*background: transparent;*/
    width: 30%;
    float:center;
}

.portlet-content table tr .th-gebliste-age,
.portlet-content table tr .td-gebliste-age {
    /*background: transparent;*/
    width: 17%;
    text-align:right;
}

.th-gebliste-age,
.td-gebliste-age {
    /*background: transparent;*/
    width: 17%;
    text-align:right;
}

#fullcalendar {
    width: 80%;
    margin: auto;
}

.schwarzesbrett_scrolling {
    height: 450px;
    width: 750px;
    overflow: auto;
}

.email_bezeichner_width {
    width: 20%;
}

.email_value_width {
    width: 80%;
}

button {
    cursor: pointer;
    background: transparent;
}


.jstree ul, .jstree li {
    display: block;
    list-style-type: none;
    margin: 0;
    padding: 0;
}
.jstree li {
    display: block;
    line-height: 18px;
    margin-left: 18px;
    min-height: 18px;
    min-width: 18px;
    white-space: nowrap;
}
.jstree-rtl li {
    margin-left: 0;
    margin-right: 18px;
}
.jstree > ul > li {
    margin-left: 0;
}
.jstree-rtl > ul > li {
    margin-right: 0;
}
.jstree ins {
    display: inline-block;
    height: 18px;
    margin: 0;
    padding: 0;
    text-decoration: none;
    width: 18px;
}


/*
 * Kalenderbereich
 */

.gcal-event-feiertag {
    background-color: red;
}

/*
 * Jquery Mask
 */


.loadmask {
    z-index: 100;
    position: absolute;
    top:0;
    left:0;
    -moz-opacity: 0.5;
    opacity: .50;
    filter: alpha(opacity=50);
    background-color: #CCC;
    width: 100%;
    height: 100%;
    zoom: 1;
}
.loadmask-msg {
    z-index: 20001;
    position: absolute;
    top: 0;
    left: 0;
    border:1px solid #6593cf;
    background: #c3daf9;
    padding:2px;
}
.loadmask-msg div {
    padding:5px 10px 5px 25px;
    background: #fbfbfb url('../images/loading.gif') no-repeat 5px 5px;
    line-height: 16px;
    border:1px solid #a3bad9;
    color:#222;
    font:normal 11px tahoma, arial, helvetica, sans-serif;
    cursor:wait;
}
.masked {
    overflow: hidden !important;
}
.masked-relative {
    position: relative !important;
}
.masked-hidden {
    visibility: hidden !important;
}

label.error {display:none; border:none;}


.p70 {
    width:70%;
}


.ui-tabs-vertical { /*width: 100%;*/ min-height: 500px; }
.ui-tabs-vertical > .ui-tabs-nav { padding: .2em .1em .2em .2em; float: left; width: 18%; background: none repeat scroll 0 0 #FFFFFF; min-height: 500px; }
.ui-tabs-vertical > .ui-tabs-nav li { clear: left; width: 100%; border-bottom-width: 1px; border-right-width: 0; margin: 1px 0 .2em 0; }
.ui-tabs-vertical > .ui-tabs-nav li a { display:block; width:100%}
.ui-tabs-vertical > .ui-tabs-nav li.ui-tabs-active { padding-bottom: 0; padding-right: .1em; border-right-width: 1px; border-right-width: 1px; }
.ui-tabs-vertical > .ui-tabs-panel { padding: 1em; float: right; width: 75%;}


#dateien .filter {
    width: 35%; float:left; height:auto;display:block; padding-left:0px; padding-right:10px;
}

#dateien h3{
    width: 100%;
}


#dateien .filter a.select {
    background: url('../images/ok.gif') top right no-repeat;
    padding-right: 20px;
}


#webDok, .beschreibungen, #filelist {
    width: 100%;
    display:block;
    margin-top: 10px;
}

.floatContainer{
    overflow: auto;
}

#documentTable tr, #aswPreviewTable tr {
    height: 26px;
}

#documentTable th, #aswPreviewTable th {
    text-align: center;
    background-color: #DDDDDD;
}

#aswPreviewTable input.text_filter {
    width: 5px;
}

.filterung {border:1px solid #000; padding:5px;margin-left:1px;}

.filterDok {display:block; float:left; width:60%; marging-left:0px; padding-left:0px; padding-right:0px;}
.filterDok b {padding-left:0px; padding-right:0px;}
.filterDok table {width: 100%; marging-left: 0px; padding-left:0px; padding-right:0px;}
.filterDok table tbody {width: 100%;}
.filterDok table td {width: 48%;}
.filterDok table td.left {width: 48%; marging-right: 0px; padding-left:0px; padding-right:20px;}
.filterDok table td.right {width: 48%; marging-right: 0px; padding-left:0px; padding-right:0px; text-align: left;}
.filterDok table td .bezeichnung {float:left; width: 35%;}
.filterDok table td .eingabe {float:right; width: 65%; white-space:nowrap;}
.filterDok table td .eingabe input {width: 100%;}
.filterDok table td .eingabe input.datum.hasDatepicker {width: 80%;}
.filterDok table td .eingabe select {width: 100%;}

.filterDok table td.label {width:100%; margin-left:0px; margin-right:5px}
.filterDok table td.select {width:50%; margin-left:0px; margin-right:5px}



.filterDok > div > label {width: 100px; display:block;float:left}
.filterDok > div > input, .filterDok > div > select {width: 55%; margin-left:10px;}

.pointer {
    cursor: pointer;
}
.noPointer {
    cursor: default !important;
}
.cursorNotAllowed {
    cursor: not-allowed !important;
}
.grabable {
    cursor: grab;
}
.grabable:active {
    cursor: grabbing;
}

.noBorderOnFocus:focus {
    outline: none;
}

.underline {
    text-decoration : underline;
}

.close{background: url('../images/close.gif') no-repeat right center}
.open{background: url('../images/open.gif') no-repeat right center}


input[type="radio"] { border: 0;}

.jstree a {
    width: auto !important;
}

.jstree-default.jstree-focused {
    background: none !important;
}

.selected_notenLinie {
    background: rgb(159,216,239);
}

.selected_DataTableRow {
    background: #DDDDDD !important;
}


#suchergebnis_bemerkung {
    max-height: 400px;
    overflow-y: scroll;
    padding: 10px;
    display:none;
    background-color: #4297D7;
}

#suchergebnis_bemerkung table tr td{
    vertical-align:top;
    color:#FFF;
    cursor: pointer;
}

body:not(.isMobile) #suchergebnis_bemerkung table tbody tr:hover{
    background-color: rgba(63,76,107,1);
    color:#000;
}

.hidden, .pdf_only{
    display: none !important;
}

.dataTables_scrollHead{
    clear: right;
}

.navi_categorie{
    text-align: center;
}

select.klasse, select.kurse {
    max-height:50px;
}

.ui-tabs-paging-disabled {
    display: none;
}

.floatRight {
    float: right;
}

.floatLeft {
    float: left;
}

.ui_like_button {
    display: block;
    padding: .4em 1em;
}

.ui-tabs-vertical > .ui-tabs-nav li a {
    display: block;
    width: 100%;
    padding: .5em 0em;
}

.noPadding{
    padding: 0px !important;
}

.noPaddingImportant{
    padding: 0px !important;
}

.bezeichner_span{
    display: inline-block;
    vertical-align: -webkit-baseline-middle;
    pointer-events: none;
}

#ta_text_vorschau, #ta_text_vorschau_ut, #ta_text_vorschau_ha{
    width: 99.4%;
    height: 4.2em;
    resize: none;
}

span.notenerfassung_text{
    float: left;
    width: 95%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.column_width_b4_init{
    width: 25px;
}

.column_width_after_init{
    width: 100%;
    padding-left: 0px;
    padding-right: 0px;
}

#faecherNotenerfasssung .fach{
    max-height: 200px;
}

.nok_bem_ta{
    height: 17px;
    width: 150px !important;
    resize: none;
    padding: 0px 0px 0px 2px;
    border: 0px;
    white-space: normal;
}

.nok_fach_ta{
    height: 17px;
    width: 200px;
    resize: none;
    padding: 0px 0px 0px 2px;
    border: 0px;
}

.nok_nok_select{
    width: 210px;
    height: 100%;
    padding: 0px;
    border: 0px;
}

.ze_select{
    width: 210px;
    height: 100%;
    padding: 0px;
    border: 0px;
}

.nok_nok_input {
    width: 100%;
    height: 100%;
    text-align: center;
    border: 0px;
    padding-left: 0px;
    padding-right: 0px;
}

.nok_bem_input {
    width: 50px;
    border: 0px;
    padding-left: 0px;
    padding-right: 0px;
    height: 100%;
    text-align: center;
}

.notenerkopf .column_name{
    text-align: left;
}

.ui_tabs_headline{
    margin-top: 5px;
}

#formzeugnis{
    margin-top: 10px;
}

.notenerkopf, .unterrichtsthemen{
    min-height: 600px;
}

/*.notenerkopf .notenkopf_table_scroll{
    overflow: auto;
    padding: 5px;
}*/
#tabs .DTFC_LeftHeadWrapper thead,
#notenkopf .DTFC_LeftHeadWrapper thead,
#bemerkungen .DTFC_LeftHeadWrapper thead,
#zusatzabschluss .DTFC_LeftHeadWrapper thead,
#facharbeiten .DTFC_LeftHeadWrapper thead,
#schulen_satz .DTFC_LeftHeadWrapper thead {
    background-color: transparent;
}
#tabs .DTFC_LeftHeadWrapper,
#tabs .DTFC_LeftBodyWrapper,
#notenkopf .DTFC_LeftHeadWrapper,
#notenkopf .DTFC_LeftBodyWrapper,
#bemerkungen .DTFC_LeftHeadWrapper,
#bemerkungen .DTFC_LeftBodyWrapper,
#zusatzabschluss .DTFC_LeftHeadWrapper,
#zusatzabschluss .DTFC_LeftBodyWrapper,
#facharbeiten .DTFC_LeftHeadWrapper,
#facharbeiten .DTFC_LeftBodyWrapper,
#schulen_satz .DTFC_LeftHeadWrapper,
#schulen_satz .DTFC_LeftBodyWrapper {
    background-color: white;
}

.input_td{
    padding: 0px !important;
}

input.notenkopf_fach_note {
    text-align:center;
    border: 0px;
    height: 100%;
}

.notenkopf_datum_td{
    min-width: 100px;
    max-width: 100px;
    padding: 0px !important;
}

.notenkopf_datum_td .datum{
    margin: 0px;
    border: 0px;
    height: 100%;
    padding-left: 0px;
    padding-right: 0px;
}

.notenkopf_datum_td .ui-datepicker-trigger{
    float: none;
    position: relative;
    top: 2px;
    left: -17px;
}

#tabs .DTFC_LeftBodyLiner th{
    min-height: 1px;
}

.pupilAdress_action_table{
    width: 100%;
}

.pupilAdress_action_table td{
    border: 0px;
    text-align: center;
}

#btn_delete, #btn_neuanlage{
    cursor: pointer;
    vertical-align: sub;
}

.schueler_pflege_neuanlage_table td{
    border: 0px;
}

#nok_nok_table > tbody > tr,
#nok_aust_table > tbody > tr{
    height: 22px;
}

.anmeld_required_info{
    font-size: 0.8em;
    vertical-align: sub;
}

.anmeld_buttons_with_info{
    text-align: center;
}

.lupe {
    cursor: pointer;
}

.eingabe .lupe {
    float: right;
}

.formular_doppelt .noBorder{
    border: 0px;
    padding-left: 7px;
}

.ui-state-disabled,
.ui-widget-content .ui-state-disabled,
.ui-widget-header .ui-state-disabled{
    opacity: .5 !important;
    filter: Alpha(Opacity=50) !important;
}

#deselect_button{
    float: right;
}
.withInput .dataTables_filter{
    text-align: left;
}

#impressum,
#datenschutzerklaerung {
    font-size: 0.8em;
    text-align: center;
}

body:not(.isMobile) #impressum a:hover,
body:not(.isMobile) #datenschutzerklaerung a:hover {
    font-weight: bold;
}

.name_ellipsis{
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 275px;
    display: block;
    padding-right: 5px;
    height: 20px;
}

.class_ellipsis{
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    /*    width: 220px;*/
    display: block;
    padding-right: 5px;
}

#admin_anmeld_file_table .datei_ole{
    white-space: nowrap;
}

.left_td{
    width: 60%;
}

.right_td{
    width: 30%;
}

.match_parent{
    width: 100%;
}

.datepicker_abwesenheit{
    position: absolute;
    left: 360px;
    top: 145px;
    z-index: 2;
}

.fullTdLabel { 
    display: block;
    min-height: 100%;
    height: auto !important;
}

.permissions_ok{
    color: green;
    font-size: 1.2em;
}

.permissions_fail{
    color: red;
    font-size: 1.2em;
}

.red_button {
    background-color: #FF3030 !important;
}

body:not(.isMobile) .red_button:hover {
    background-color: #D82828 !important;
}

.pupil_ausgetreten{
    text-decoration: line-through;
    color: grey;
}

.pupil_not_active{
    color: grey;
}

.abwInput{
    padding: 0px 2px 0px 2px;
    margin: 0px;
    border: 0px;
    width: 96px;
    resize: none;
    height: 16px;
    font-family: arial;
    font-size: 1.1em;
    overflow-y: hidden;
}

#dialogLehrerFach table{
    border-collapse: collapse;
}

#dialogLehrerFach td{
    padding: 5px;
    vertical-align: top;
}

#dialogLehrerFach .tdWithBottomBorder{
    border-bottom: 1px solid #000;
    padding-bottom: 5px;
}

.tab_button {
    margin: 1px .2em 0 0;
    border: 0px;
    border-bottom: 3px solid white;
    padding: .4em 1em;
    color: grey;
    outline: none;
}

body:not(.isMobile) .tab_button:hover {
    border-bottom: 3px solid grey;
}

.tab_button.selected {
    border-bottom: 3px solid #0d54d7;
}

.greyBackground {
    background: #dddddd;
}

.greyBorder {
    border: 1px solid #888888 !important;
}

.colorRed {
    color: red;
}

.alignRight {
    text-align: right;
}

.ui_button_inactive {
    border: 0px !important;
    background-color: #bababa !important;
    color: white !important;
    cursor: not-allowed !important;
}

.ui_button_progress {
    border: 0px;
    background-color: #bababa;
    color: white;
    cursor: progress;
}

.centerElement {
    margin-left: auto;
    margin-right: auto;
}

div.infoIcon {
    height: 16px;
    width: 16px;
    background: url(../images/icons/icon_info.png) no-repeat;
}

body:not(.isMobile) div.infoIcon:hover {
    background: url(../images/icons/icon_info_highlight.png) no-repeat;
}

.adminInfoIcon {
    display: inline-block;
    margin-bottom: -3px;
    margin-left: 5px;
    height: 14px;
    width: 14px;
    background-size: contain;
    background-repeat: no-repeat;
    background-image: url(../images/icons/icon_info.png);
    cursor: pointer;
}

body:not(.isMobile) .adminInfoIcon:hover {
    background-image: url(../images/icons/icon_info_highlight.png);
}

div.swhTooltip {
    height: auto;
    width: auto;
    max-width: 50%;
    position: fixed;
    border: 0px;
    font-family: Verdana,Arial,sans-serif;
    font-size: 1em;
    box-shadow: 0 0 0.75em #777777;
    z-index: 10000;
}

div.swhTooltipTitlebar {
    background: #32b7ec;
    font-weight: bold;
    color: white;
    line-height: 20px;
    padding: 0px 6px 0px 6px;
}

div.swhTooltipContent {
    position: relative;
    overflow: auto;
    padding: 5px 6px 3px 6px;
    background: white;
    line-height: 1.5em;
}

div.swhTooltipContentLONG {
    max-height: none !important;
}

div.swhTooltipProgress {
    background: white;
    position: relative;
    text-align: center;
}

div.swhTooltipFooter {
    padding: 2px 10px 4px 10px;
    background: white;
    position: relative;
}

div.swhTooltipCorner {
    background: url(../images/icons/tooltip_corner.png) no-repeat;
    display: block;
    margin-top: 3px;
    height: 16px;
    position: absolute;
    width: 16px;
    z-index: -1;
    transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    box-shadow: 0 0 0.75em #777777;
    -webkit-box-shadow: 0 0 0.75em #777777;
}

div.swhTooltipCornerLeft {
    left: -8px;
}

div.swhTooltipCornerRight {
    right: -8px;
}

div.swhTooltipCornerTop {
    top: -11px;
    left: 15px;
}

div.swhTooltipCornerBottom {
    bottom: -8px;
    left: 15px;
}

td.swhTooltip_NEI_labelTd {
    font-weight: bold;
}

td.swhTooltip_NEI_valueTd {
    padding-left: 20px;
}

.halfWidth {
    width: 50%;
}

.left {
    float: left;
}

li {
    outline: none;
}

table#passwoerter {
    margin-top: 25px;
    margin-bottom: 20px;
}

table#passwoerter td:first-of-type {
    height: 30px;
    padding-right: 20px;
}

/* TableDesign */
.textbausteinDialog thead tr, .notenerfassung thead tr, #textbausteinDialog thead tr, #zeugnisFormularDialog thead tr,
#notenerfassungZeugnissTable thead tr, #nok_nok_table_wrapper thead tr, #fileTable thead tr,
#nok_bem_table_wrapper thead tr, #nok_aust_table_wrapper thead tr, #nok_zusatz_table_wrapper thead tr, #nok_fach_table_wrapper thead tr,
#admin_anmeld_var_table_wrapper thead tr, #translationTable_wrapper thead tr,
#admin_anmeld_form_reiter_table_wrapper thead tr, #admin_anmeld_form_feld_table_wrapper thead tr,
#documentTable thead tr, #documentUploadTable thead tr, #aswPreviewTable thead tr, #webFormTable thead tr,
#webFormFieldTable thead tr, #notenSystemSuggestionsTable thead tr {
    height: 26px;
    background-color: #DDDDDD;
}

.rowBackgroundHover,
body:not(.isMobile) table.abwesenheiten tr:hover,
body:not(.isMobile) table.abwBemRowHighlight tr:hover,
body:not(.isMobile) #noten-einzel tbody tr:hover,
body:not(.isMobile) #noten-zeugnis tbody tr:hover,
body:not(.isMobile) .notenZeugnisInfoTable tbody tr:hover,
body:not(.isMobile) #translationTable_wrapper tbody tr:hover,
body:not(.isMobile) #documentTable tbody tr:hover,
body:not(.isMobile) #documentUploadTable tbody tr:hover,
body:not(.isMobile) #aswPreviewTable tbody tr:hover,
body:not(.isMobile) #webFormTable tbody tr:hover,
body:not(.isMobile) #webFormFieldTable tbody tr:hover,
body:not(.isMobile) #notenSystemSuggestionsTable tbody tr:hover {
    background-color: #E2E2E2;
}

.textbausteinDialog .selected_DataTableRow, #fileTable .selected_DataTableRow,
#admin_anmeld_var_table .selected_DataTableRow, #admin_anmeld_form_reiter_table .selected_DataTableRow,
#admin_anmeld_form_feld_table .selected_DataTableRow, #webFormTable .selected_DataTableRow,
#webFormFieldTable .selected_DataTableRow {
    background-color: lightgrey !important;
}

.tableDesign td, .tableDesign th, .tableDesign1column td, .tableDesign1column th {
    border-right: 1px solid #C8CACC;
    white-space: nowrap;
}

.tableDesign td:last-of-type, .tableDesign th:last-of-type {
    border-right: 0px;
}

.tableDesign, .tableDesign1column {
    border-spacing: 0px;
}

.tableRowHeight td {
    padding-top: 6px;
    padding-bottom: 4px;
}

/* adjustment for dataTables with fixedColumns */
#notenkopf .DTFC_LeftBodyLiner table,
#bemerkungen .DTFC_LeftBodyLiner table,
#schulen_satz .DTFC_LeftBodyLiner table,
#zusatzabschluss .DTFC_LeftBodyLiner table,
#facharbeiten .DTFC_LeftBodyLiner table {
    width: 99% !important;
    border-right: 1px solid #C8CACC;
}

#zeugnisFormularDialog tbody tr td {
    padding: 5px 0px;
    vertical-align: top;
}

.inputWithBorder {
    border: 1px solid transparent;
}

body:not(.isMobile) .inputWithBorder:hover {
    border: 1px solid lightgrey !important;
}

.filter_text .text_filter {
    background-color: white;
}

#documentUploadTable td {
    padding: 0px;
}

#documentUploadTable select {
    height: 100%;
    min-width: 100px;
}

.centerPlaceholder ::-webkit-input-placeholder {
   text-align: center;
}
.centerPlaceholder ::-moz-placeholder {
   text-align: center;
}
.centerPlaceholder :-ms-input-placeholder {  
   text-align: center; 
}

.cursorWait {
    cursor: wait !important;
}

.verticalLine {
    width: 0px;
    height: 100%;
    border-left: 1px solid lightgrey;
    margin: 0px 20px;
}

.padding0 {
    padding: 0px !important;
}

.padding10 {
    padding: 10px;
}

.printIcon {
    height: 16px;
}

.noBreakEllipsis {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.wrap_content {
    display: inline-block;
}

.textContainerElement {
    margin-top: 35px;
    margin-bottom: 45px;
}

.textContainerElement .ta_text {
    height: 90px;
}


/* fix for FF in abwesenheit */
@-moz-document url-prefix() {
    .DTFC_RightBodyLiner {
        height: 0;
    }
}

.italic {
    font-style: italic;
}

.textBlue {
    color: blue;
}

.columnWith10px {
    width: 10px;
}

.opacityZero {
    opacity: 0;
}

.dataTables_filter input {
    margin-left: 5px;
}

#toTopButton {
    position: fixed;
    right: 30px;
    bottom: 30px;
    cursor: pointer;
}

#saveSuccessfulBar {
    position: fixed;
    top: 0px;
    right: 20px;
    width: 250px;
    height: 100vh;
    pointer-events: none;
}

.saveSuccessfulElement {
    position: absolute;
    top: -10vh;
    right: 0px;
    width: 100%;
    height: 5vh;
    padding: 1vh;
    padding-right: 70px;
    z-index: 10000;
    transition-duration: 0.5s;
    background-color: white;
    border: 2px solid lightgrey;
    background-image: url(../images/check_128.png);
    background-repeat: no-repeat;
    background-position: right;
    background-size: contain;
}

#modalCursorWaitOverlay {
    cursor: wait;
    position: fixed;
    top: 0px;
    left: 0px;
    width: 100vw;
    height: 100vh;
    z-index: 999999;
}

.notClickable {
    pointer-events: none;
}

.rotatable {
    -moz-transition: transform 0.4s;
    -webkit-transition: transform 0.4s;
    transition: transform 0.4s;
}
.rotate90 {
    -webkit-transform: rotate(-90deg);
    -moz-transform: rotate(-90deg);
    filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2);
}
.rotate180 {
    -webkit-transform: rotate(-180deg);
    -moz-transform: rotate(-180deg);
    filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2);
}

.icn-spinner {
  animation: spin-animation 0.90s infinite;
  display: inline-block;
}
@keyframes spin-animation {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(359deg);
  }
}

.cardDesign {
    border-radius: 10px;
    box-shadow: 0 0 10px 4px #d0d0d0;
    transition: 0.3s;
}
body:not(.isMobile) .cardDesign:hover,
.cardDesign.cardSelected {
  box-shadow: 0 0 10px 4px #2a84c6;
}

.widthWrapContent {
    width: 1%;
}

.textDotDotDot {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.tdPadding5 td {
    padding: 5px;
}

.tdInputFieldsFull input, .tdInputFieldsFull select, .tdInputFieldsFull textarea {
    width: 100%;
}

body.showMacScollbars ::-webkit-scrollbar {
    -webkit-appearance: none;
    width: 6px;
    height: 6px;
}

body.showMacScollbars ::-webkit-scrollbar-thumb {
    border-radius: 6px;
    background-color: rgba(0, 0, 0, 0.5);
}

/* The select MUST be required */
select.emptyOptionGrey,
select.emptyOptionGrey option {
  color: black;
}
select.emptyOptionGrey:invalid,
select.emptyOptionGrey option[value=""] {
  color: grey;
}

.bold {
    font-weight: 600;
}

.bolder {
    font-weight: 900;
}

.lineThrough{
    text-decoration: line-through;
}

.widthFillAvailable {
    width: -webkit-fill-available;
    width: -moz-available;
}

.heightFillAvailable {
    height: -webkit-fill-available;
    height: -moz-available;
}

#notificationBlockedNote {
    position: fixed;
    width: 100vw;
    background-color: #ff6767;
    top: 0px;
    left: 0px;
    text-align: center;
    color: #383838;
    font-size: 1.1em;
    line-height: 1.3em;
    font-weight: 600;
}

#indicateSwipingIcon {
    -webkit-animation: wobble 2s ease infinite;
    animation: wobble 2s ease infinite;
    pointer-events: none;
}
@keyframes wobble {
    0% {
        transform: translateX(0%);
    }
    40% {
        transform: translateX(-100%) rotate(-5deg);
    }
    50% {
        transform: translateX(20%) rotate(3deg);
    }
    95% {
        transform: translateX(-5%) rotate(-1deg);
    }
    100% {
        transform: translateX(0%);
    }
}

.greyedOut {
    filter: grayscale(100%) opacity(0.5);
    pointer-events: none;
}