body
{
   margin-top  : 0;
   font-family : 'Cabin', sans-serif;
   font-size   : 12pt;
   color       : #555555;
}

*
{
   font-family : 'Cabin', sans-serif;
}

.fade
{
   opacity : 1 !important;
}

.mymodal
{
   position          : fixed;
   xtop              : 10%;
   xbottom           : 10%;
   xleft             : 10%;
   xright            : 10%;
   xwidth            : 400px;
   xheight           : 400px;
   border            : 1px solid gray;
   xbackground-color : #e0e0e0;
   xleft             : 50%;
   xtop              : 50%;
   xmargin-left      : -200px;
   xmargin-top       : -200px;
   box-shadow        : 6px 6px 16px 0px rgba(0, 0, 0, 0.75);
   xpadding          : 4px;
}

.mymodal.panel .footer > button
{
   margin : 0 10px;
}

/*.mymodal > .caption*/
/*{*/
/*border-bottom    : 1px solid #bbbbbb;*/
/*font-size        : 14px;*/
/*background-color : #ebebeb;*/
/*padding          : 4px;*/
/*text-align       : center;*/
/*}*/

/*.mymodal > .footer*/
/*{*/
/*position         : absolute;*/
/*bottom           : 0px;*/
/*height           : 30px;*/
/*left             : 0px;*/
/*right            : 0px;*/
/*border-top       : 1px solid #bbbbbb;*/
/*font-size        : 150%;*/
/*text-align       : right;*/
/*padding-right    : 10px;*/
/*padding-top      : 5px;*/
/*background-color : #ebebeb;*/
/*}*/

.lookup_table
{
   xborder         : 1px solid red;
   width           : 100%;
   border-collapse : collapse;
}

.lookup_table thead td
{
   font-size     : larger;
   border-bottom : 1px solid #cccccc;
}

.lookup_table tbody td
{
   padding : 4px 2px;
}

.lookup_table tbody tr:nth-child(even)
{
}

.lookup_table tbody tr:nth-child(odd)
{
   background-color : #eef9ff;
}

.lookup_table tbody tr:hover
{
   background-color : #faffd1;
}

/* Nur für Auto-Nummerierung */
.lookup_table tbody
{
   counter-reset : rowNumber;
}

.lookup_table tbody tr
{
   counter-increment : rowNumber;
}

.lookup_table tbody tr td.rownumber::before
{
   content : counter(rowNumber);
}

table.nowrap td
{
   white-space : nowrap;
}

.filter_table
{
   width           : 100%;
   border-collapse : collapse;

}

.filter_table td
{
   padding        : 2px 6px;
   vertical-align : middle;
   line-height    : 18px;
}

.filter_table td label
{
   margin-bottom : 0;

   position      : relative;
   bottom        : -2px;

}

.filter_table tr:nth-child(odd) td
{
   vertical-align : bottom;
   padding        : 0px 6px;
}

.ausstattung_table
{
   width           : 100%;
   border-collapse : collapse;
   xorder          : 1px solid #ececec;
   table-layout    : fixed;

}

.nowrap
{
   white-space : nowrap;
}

/*.wheel*/
/*{*/
/*background : url('/img/icon_scroll.svg') no-repeat 100% 50%/auto 80%;*/
/*}*/

/*.smallwheel*/
/*{*/
/*background    : url('/img/icon_scroll.svg') no-repeat 100% 50%/auto 60%;*/
/*padding-right : 0px;*/
/*}*/

.bootbox.modal > .modal-dialog
{
   z-index : 999999 !important;
}

.mytable
{
   width           : 100%;
   border-collapse : collapse;
}

.mytable th
{
   background-color : #e7e7e7;
   padding          : 2px 10px;
   text-align       : left;
}

.mytable td
{
   padding     : 4px 10px;
   line-height : 12pt;
   xborder-top : 1px solid white;
   height      : 20px;
}

.mytable tr:nth-child(even)
{
   background-color : #f7f7f7;
}

.mytable tr:nth-child(odd)
{

}

.mytable tr:hover td
{
   background-color : #e5e5e5;
   /*border-top       : 1px solid #b4ffc3;*/
}

.mytable tr:not(:first-child).p1 td
{
   border-top   : 1px solid #a1b2ce;
   xborder-left : 4px solid #b0a0f8;
}

.gridfooter
{
   display : flex;
   xborder : 1px solid green;
}

.gridfooter > *
{
   xborder     : 1px solid red;
   margin-left : 5px;
}

.gridfooter #divErgebnisse
{
   margin-right : auto;
   padding-top  : 4px;
}

.gridfooter #divSeite
{
   width          : 200px;
   text-align     : center;
   vertical-align : middle;
   padding-top    : 4px;
}

th.sortable
{
   cursor : pointer;
}

th.sortable.sorted:after
{
   content      : "\f15d";
   font-family  : FontAwesome, serif;
   padding-left : 10px;
}

th.sortable.sorted.desc:after
{
   font-family  : FontAwesome, serif;
   content      : "\f15e";
   padding-left : 10px;
}

.link
{
   cursor : pointer;
}

.filter_div
{
   display : flex;
}

.filter_div > .left
{
   flex-grow : 1;
   display   : flex;
   flex-wrap : wrap;
}

.filter_div > .left > *
{
   align-self : flex-start;
}

.filter_div > .left > button
{
   margin-right : 4px;
   margin-top   : 4px;
}

.filter_div > .right
{
   border-left     : 1px solid #d9d9d9;
   width           : 200px;
   flex-grow       : 0;
   flex-shrink     : 0;
   flex-basis      : 200px;
   flex-wrap       : wrap;
   display         : flex;
   justify-content : space-between;
   padding-left    : 10px;
   xpadding-right  : 4px;
}

.filter_div > .right > *
{
   box-sizing   : border-box;
   xflex-grow   : 0;
   xflex-shrink : 0;
   xalign-self  : flex-end;
   xmargin      : 4px;
}

.filter_div > .right select
{
   width : 100%;
}

.myinputblock
{
   padding : 2px;
   width   : 200px;
   xborder : 1px solid red;
   margin  : 2px;

}

.myinputblock > label
{
   width   : 100px;
   xborder : 1px solid blue;
}

.myinputblock > *
{
   width      : 100% !important;
   xborder    : 1px solid yellow;
   box-sizing : border-box;
}

.checkbox
{
   width      : 20px;
   height     : 20px;
   /*border     : 1px solid red;*/
   margin-top : 5px !important;
}

.navbar
{
   display          : flex;
   width            : 100%;
   flex-wrap        : wrap;
   background-color : #f5f5f5;

   border-bottom    : 1px solid #e5e5e5;
   border-left      : 1px solid #e5e5e5;
   border-right     : 1px solid #e5e5e5;
   margin-bottom    : 20px;
   align-items      : center;
}

.navbar > *
{
   xborder         : 1px solid red;
   xalign-self     : center;
   display         : block;
   padding         : 5px 10px;
   color           : #777777;
   text-decoration : none;
}

.navbar *
{
   xcolor          : #777777 !important;
   text-decoration : none;
   white-space     : nowrap;

}

.navbar a, .link
{
   color           : #777777 !important;
   text-decoration : none;
   white-space     : nowrap;

}

.navbar a:hover, .link:hover
{
   text-decoration : underline;
}

.navbar > *.active
{
   background : rgb(231, 231, 231);
}

.hint
{
   font-size : 85%;
   color     : #1a802c;
}

.panel
{
   border         : 1px solid #e5e5e5;
   xborder-radius : 6px;
   overflow       : hidden;
   display        : flex;
   flex-direction : column;
}

.panel > .header
{
   padding          : 8px;
   background-color : #f5f5f5;
   xtext-shadow     : 1px 1px 1px rgba(0, 0, 0, 0.2);
   border-bottom    : 1px solid #e5e5e5;
   font-size        : 14pt;
   flex-grow        : 0;
   text-align       : center;
}

.panel > .body
{
   padding          : 10px;
   xoverflow-x      : auto;
   background-color : #ffffff;
   flex-grow        : 1;
   xborder          : 1px solid red;
   xmargin          : 10px;
}

.panel > .footer
{
   padding          : 8pt;
   background-color : #f5f5f5;
   text-shadow      : 1px 1px 1px rgba(0, 0, 0, 0.1);
   border-top       : 1px solid #e5e5e5;
   display          : flex;
   color            : #777777 !important;
   flex-grow        : 0;
   align-items      : center;
}

.panel > .footer > span, .panel > .footer > a
{
   color : #777777;
}

.red_caption
{
   font-size   : 20pt;

   color       : #6b6b6b;
   font-weight : 300;
}

.center
{
   text-align : center;
}

input[type="text"], input[type="password"], input[type="url"]
{
   padding   : 4px;
   font-size : 12pt;
   border    : 1px solid #d1d1d1;
}

input[type="text"][readonly], input[type="url"][readonly]
{
   background-color : #e8e8e8;
   color            : #808080;
}

select
{
   padding   : 4px;
   font-size : 12pt;
   border    : 1px solid #d1d1d1;
}

input[type="button"], button
{
   padding          : 6px 12px;
   font-size        : 12pt;
   xborder          : 1px solid #d1d1d1;
   border           : none;
   color            : #505050;
   xline-height     : 0pt;
   xheight          : 50px !important;
   transition       : all 0.3s ease;
   background-color : #e5e5e5;
}

input[type="button"].blue, button.blue
{
   background-color : #5c98ff;
   color            : white;
}

input[type="button"].yellow, button.yellow
{
   background-color : #e2c43d;
   color            : white;
}

input[type="button"].red, button.red
{
   background-color : #ff5b5b;
   color            : white;
}

input[type="button"].green, button.green
{
   background-color : #27a724;
   color            : white;
}

input[type="button"]:hover, button:hover
{
   xbox-shadow   : 1px 1px 1px #223322;
   xborder-color : black;
   opacity       : 0.8;
   transition    : all 0.1s ease;
}

input[type="button"][disabled], button[disabled]
{
   opacity : 0.5 !important;
   cursor  : not-allowed;
}

#infobox
{
   z-index       : 9999;
   text-align    : center;
   box-shadow    : rgba(0, 0, 0, 0.2) 3px 3px 3px 0;
   bottom        : 20px;
   position      : fixed;
   padding       : 4px;
   border-radius : 2px;
   left          : 30%;
   right         : 30%;
   font-weight   : 300;
   min-height    : 30px;
   line-height   : 2;
   font-size     : 16pt;
   display       : block;

   animation     : fadeout 1200ms ease-in-out both;
}

@keyframes fadein
{
   from
   {
      opacity : 0;
   }
   to
   {
      opacity : 1;
   }
}

@keyframes fadeout
{
   from
   {
      opacity : 1;
   }
   to
   {
      opacity : 0;
   }
}

#infobox.visible
{
   animation : fadein 200ms ease-in-out both;
}

#infobox.good
{
   color            : #ffffff;
   background-color : #4ba04b;
   border           : 1px solid #86a57b;
}

#infobox.bad
{
   background-color : #d64949;
   border           : 1px solid #daa6a6;
   color            : #ffffff;
}

.detail_table
{
   xborder         : 1px solid red;
   border-collapse : collapse;
   width           : 100%;
}

.detail_table td
{
   padding : 4px;
}

.detail_table > tbody > tr > td:first-child
{
   min-width : 200px;
}

.detail_table input[type="text"], .detail_table input[type="password"], .detail_table select
{
   width      : 300px;
   box-sizing : border-box;
}

.ajax_loader
{
   background-image : url('/img/ajax_loader.svg');
   width            : 24px;
   height           : 24px;
   background-size  : contain;
   visibility       : hidden;
   opacity          : 0;
   transition       : all 0.5s linear;
}

.ajax_loader.visible
{
   visibility : visible;
   opacity    : 1;
   transition : all 0s linear;
}

#div_search
{
   margin-bottom : 20px;
}

.blinking
{
   animation : blink 2s linear 0s infinite normal;
}

@keyframes blink
{
   0%
   {
      opacity : 1;
   }
   25%
   {
      opacity : 0;
   }
   50%
   {
      opacity : 1;
   }
   75%
   {
      opacity : 0;
   }
   100%
   {
      opacity : 1;
   }
}

.grid_table
{
   width  : 100%;
   border : 1px solid red;
}

.grid_table th
{
   white-space : nowrap;
}

.grid_table td
{
   white-space : nowrap;
}

.grid_table td input[type='text']
{
   width      : 100%;
   box-sizing : border-box;
   padding    : 1px 4px;
}

.grid_table
{

}

.grey
{
   color : #727272;
}

.code
{
   font-family : 'Source Code Pro', monospace;

}