@charset "utf-8";
@font-face { font-family: "Serpentine"; src: url("/css/serpentine.ttf") format("truetype"); }
@font-face { font-family: Serpentine; src: local("Serpentine"), local("SerpentineDBol"), url("css/serpentine.ttf"); }

@media screen{

.reminder
	{
	width: 17%; 
	height: 60px; 
	top: 125px; 
	left: 82%; 
	position: absolute; 
	border-style: none; 
	background: rgba(220,160,140,0);
	}

.m-signature-pad--body canvas 
	{
     position: relative;
     left: 0;
     top: 0;
     width: 80%;
     height: 150px;
     border: 2px solid #CCCCCC;
     }    
	
.art-header
	{
/* 	border-top: 1px solid #000000;
	border-left: 1px solid #000000;
	border-right: 1px solid #000000;
	border-bottom: none; */
	border: none;
	margin: 0 auto; 
	position: relative;
	height: 190px;
	background-image: url('/images/header_logo.jpg');
	background-size: contain;
	background-position: center top;
	background-repeat: no-repeat;
	font-family: Serpentine;
	background-color: #f4eeee;
	color: #1a2b83;
	font-size: 50px;
	}

.art-header:before, #art-header-bg:before, .art-layout-cell:before, .art-layout-wrapper:before, .art-footer:before, .art-nav:before, #art-hmenu-bg:before, .art-sheet:before
	{
	width: 100%;
	content: " ";
	display: table;
	}

.art-header:after, #art-header-bg:after, .art-layout-cell:after, .art-layout-wrapper:after, .art-footer:after, .art-nav:after, #art-hmenu-bg:after, .art-sheet:after, .cleared, .clearfix:after
	{
	clear: both;
	font: 0/0 serif;
	display: block;
	content: " ";
	}
	
.responsive .art-header
	{
	background-image: url('/images/wiesecker_logo.png');
	background-size: contain;
	background-position: center center;
	font-family: Signika, Arial;
	}

.art-header-inner
	{
	position: relative;
	min-width: 690px;
	max-width: 1536px;
	width: 75%;
	z-index: auto !important;
	margin: 0 auto;
	}

.art-header>div.art-nostyle, .art-header>div.art-block, .art-header>div.art-post
{
  position: relative;
  z-index: 101;
}	

body {
color:#000000;
background-color: #FFFFFF; 
font-size: 13px;
text-align: center;
font-family: Signika, Arial;
font-weight: normal;
font-style: normal;
overflow: auto; 
}

.fixedsticky {
  background-color: #FFFFFF;
  position: -webkit-sticky;
  position: sticky;
  margin: 0px auto;
  top: 0px;
  width: 100%;
  z-index: 100;
  opacity: 1;
}

/* .fixedsticky {
	position: -webkit-sticky;
	position: -moz-sticky;
	position: -ms-sticky;
	position: -o-sticky;
	position: sticky;
} */

/* When position: sticky is supported but native behavior is ignored */
.fixedsticky-withoutfixedfixed .fixedsticky-off,
.fixed-supported .fixedsticky-off {
	position: static;
}

.fixedsticky-withoutfixedfixed .fixedsticky-on,
.fixed-supported .fixedsticky-on {
	position: fixed;
}

.fixedsticky-dummy {
	display: none;
}

.fixedsticky-on + .fixedsticky-dummy {
	display: block;
}

article
{
margin: 100px 100px;
width: 90%;
}

article100
{
position: absolute;
display: block;
margin: 20px 0px 0px 0px;
width: 100%;
padding: 0;
}

#popup {
color:#000000;
background-color: #FFFFFF; 
font-size: 13px;
font-family: Signika, Arial;
font-weight: normal;
font-style: normal;

background: white; /* url(../images/wiesecker_logo.png) no-repeat center center fixed; */
background-size: auto;
overflow: auto; 
}

table {
background-color: #FbFbFb; 
}
  
table, tr, td, tbody {
font-size: 13px;
font-family: Signika, Arial;
font-weight: normal;
font-style: normal;
}

th {
background:#F7F7F7;
padding: 0.2em 0.5em;
border-radius: 0.0em;
background-color: #182b83;
color: #F7F7F7;

font-size: 13px;
font-family: Signika, Arial;
font-weight: normal;
font-style: normal;
}

.th_Uhrzeit {
padding: 0.0em 0.5em;
color: #000000;

font-size: 13px;
font-family: Signika, Arial;
font-weight: normal;
font-style: normal;
}

.th {
background: #F7F7F7;
padding: 0.2em 0.5em;
background-color: #182b83;
color: #F7F7F7;
font-size: 13px;
font-family: Signika, Arial;
font-weight: bold;
font-style: normal;
}

.tdh {
text-align: center;
font-family: Signika, Arial;
font-weight: normal;
font-size: 13px;
}

table {
border: 1px solid #AAAAAA;
border-collapse: separate;
}

#table_ohne_rahmen {
border: 0px;
background: #FFFFFF;
line-height: 30px;
border: 0px solid #AAAAAA;
border-collapse: separate;
position: sticky;
z-index: -100;
}

#table_ohne_rahmen_2 {
border: 0px;
background: #FFFFFF;
line-height: 30px;
border: 0px solid #AAAAAA;
}

td {
border: 0px solid #AAAAAA;
line-height: 1.75em;
vertical-align: top;
}

.textarea {
height: 150px;
width: 80%;
background: #F5F5F5;
border: 1px dotted #888888;
font-family: Signika, Arial;
font-weight: normal;
}

.textarea2 {
height: 75px;
width: 98%;
background: #F5F5F5;
border: 1px dotted #888888;
font-family: Signika, Arial;
font-weight: normal;
}

.formfield {
height: 25px;
width: 80%;
background: #F5F5F5;
border: 1px dotted #888888;
font-family: Signika, Arial;
font-weight: normal;
}

.form-10 {
height: 25px;
width: 10%;
background: #F5F5F5;
border: 1px dotted #888888;
font-family: Signika, Arial;
font-weight: normal;
}

.checkbox {
height: 25px;
width: 25px;
background: #F5F5F5;
border: 1px dotted #888888;
color: #000000;
font-family: Signika, Arial;
font-weight: normal;
display: block;
}

.radio {
height: 25px;
width: 25px;
background: #F5F5F5;
border: 1px dotted #888888;
color: #000000;
font-family: Signika, Arial;
font-weight: normal;
display: block;
}

.form-20 {
height: 25px;
width: 20%;
background: #F5F5F5;
border: 1px dotted #888888;
font-family: Signika, Arial;
font-weight: normal;
}

.form-30 {
height: 25px;
width: 30%;
background: #F5F5F5;
border: 1px dotted #888888;
font-family: Signika, Arial;
font-weight: normal;
}

.form-40 {
height: 25px;
width: 40%;
background: #F5F5F5;
border: 1px dotted #888888;
font-family: Signika, Arial;
font-weight: normal;
}

.form-45 {
height: 25px;
width: 40%;
background: #F5F5F5;
border: 1px dotted #888888;
font-family: Signika, Arial;
font-weight: normal;
}

.form-50 {
height: 25px;
width: 50%;
background: #F5F5F5;
border: 1px dotted #888888;
font-family: Signika, Arial;
font-weight: normal;
}

.form-60 {
height: 25px;
width: 60%;
background: #F5F5F5;
border: 1px dotted #888888;
font-family: Signika, Arial;
font-weight: normal;
}

.form-65 {
height: 25px;
width: 59%;
background: #F5F5F5;
border: 1px dotted #888888;
font-family: Signika, Arial;
font-weight: normal;
}

.form-70 {
height: 25px;
width: 70%;
background: #F5F5F5;
border: 1px dotted #888888;
}

.form-75 {
height: 25px;
width: 75%;
background: #F5F5F5;
border: 1px dotted #888888;
font-family: Signika, Arial;
font-weight: normal;
}

.form-80 {
height: 25px;
width: 80%;
background: #F5F5F5;
border: 1px dotted #888888;
font-family: Signika, Arial;
font-weight: normal;
}

.form-85 {
height: 25px;
width: 85%;
background: #F5F5F5;
border: 1px dotted #888888;
font-family: Signika, Arial;
font-weight: normal;
}

.form-90 {
height: 25px;
width: 90%;
background: #F5F5F5;
border: 1px dotted #888888;
font-family: Signika, Arial;
font-weight: normal;
}

.form-95 {
height: 25px;
width: 95%;
background: #F5F5F5;
border: 1px dotted #888888;
font-family: Signika, Arial;
font-weight: normal;
}

.form-100 {
height: 25px;
width: 100%;
background: #F5F5F5;
border: 1px dotted #888888;
font-family: Signika, Arial;
font-weight: normal;
}

.button-90 {
height: 25px;
width: 90%;
background: #B5B5B5;
border: 1px dotted #888888;
}

.form-Home {
height: 100px;
width: 350px;
background: #E5E5E5 url("/images/buttonbg.png") no-repeat left top;
border: 1px solid #888888;
font-size: 13px;
font-family: Signika, Arial;
font-weight: normal;
font-style: normal;
}

.redStar {
height: 100px;
width: 350px;
background: #E5E5E5 url("/images/buttonbgrs.png") no-repeat left top;
border: 1px solid #888888;
font-size: 13px;
font-family: Signika, Arial;
font-weight: normal;
font-style: normal;
}

.formbutton {
height: 25px;
width: 50%;
background-color: #F5F5F5;
border: 1px dashed #182b83;
}

input[required] {
border: 1px dashed #182b83;
background-color: #F4F4ff;
/* border-color: red; */
}

#Geraet {
height: 100px;
width: 50%;
background: #F5F5F5;
border: 1px solid #888888;
}

#GeraeteZusatz {
height: 25px;
width: 50%;
background: #F5F5F5;
border: 1px solid #888888;
}

.notizblock {
height: 275px;
width: 90%;
background: #F5F5F5;
border: 1px solid #888888;
}

.delete {
height: 25px;
width: 25%;
background-color: #DDDDDD;
border: 1px solid #888888;
}

a:link, a:hover, a:active, a:visited {
color:#000099;
font-size: 13px;
font-family: Signika, Arial;
font-weight: normal;
font-style: normal;
text-decoration: none;
}

#aschwarz {
color: #000000;
}

/* Tooltip container */
.tooltip 
{
position: relative;
display: inline-block;
border: 0px dotted black; 			/* If you want dots under the hoverable text */
}



/* Tooltip NEU */
.ttneu .tttextNeu 
{
color: #FF0000;
font-size: 15px;
font-style: normal;
width: 135px;
height: 40px;
padding: 3px;
text-align: center;
line-height: 1.3em;
left: 200px;
margin-left: 60px;
 
/* Position the tooltip text - oben! */
position: absolute;
z-index: -50;
}

/* Tooltip text */
.tooltip .tooltiptext 
{
color: #FF0000;
font-size: 15px;
visibility: hidden;
width: 200px;
height: 30px;
background-color: #FFFFFF;
padding: 3px;
text-align: left;
line-height: 1.3em;
border-radius: 4px;
border: 1px solid white;

top: -30px;
left: 200px;
/* margin-left: 60px;
/* height: 25px; */
 
/* Position the tooltip text - oben! */
position: absolute;
z-index: 1;
bottom: 100%;
left: 150px;
margin-left: -60px;

/* opacity: 0;
transition: opacity 1s; */
}

/* Tooltip arrow 
.tooltip .tooltiptext::after {
    content: "";
    position: absolute;
    top: 100%;
    left: 50%;
    margin-left: -5px;
    border-width: 5px;
    border-style: solid;
    border-color: #555 transparent transparent transparent;
} */

/* Show the tooltip text when you mouse over the tooltip container */
.tooltip:hover .tooltiptext {
    visibility: visible;
    opacity: 1;
}

a.mtooltips {
  color: #000000;
  position: relative;
  display: inline;
}
a.mtooltips span {
  color: #000000;
  position: absolute;
  width:300px;
  color: #000000;
  background: #FFFFFF;
  border: 2px solid #182B83;
  height: auto;
  text-align: center;
  visibility: hidden;
  border-radius: 2px;
  box-shadow: 3px 3px 1px #B3B1B3;
}
a.mtooltips span:before {
  content: '';
  position: absolute;
  bottom: 100%;
  left: 50%;
  margin-left: -12px;
  width: 0; height: 0;
  border-bottom: 12px solid #182B83;
  border-right: 12px solid transparent;
  border-left: 12px solid transparent;
}
a.mtooltips span:after {
  content: '';
  position: absolute;
  bottom: 100%;
  left: 50%;
  margin-left: -8px;
  width: 0; height: 0;
  border-bottom: 8px solid #FFFFFF;
  border-right: 8px solid transparent;
  border-left: 8px solid transparent;
}
a:hover.mtooltips span {
  visibility: visible;
  opacity: 1;
  top: 30px;
  left: 50%;
  margin-left: -76px;
  z-index: 999;
}

#borderLeftlong {
  border-left: 1px solid #888888;
  line-height: 10px;
  vertical-align: baseline;
}

/* Tooltip container */
.ttk 
{
position: relative;
display: inline-block;
border: 0px dotted black; 			/* If you want dots under the hoverable text */
}

.ttk .toolttk 
{
color: #000000;
font-size: 13px;
visibility: hidden;
width: 250px;
height: 20px;
background-color: #FFFFFF;
padding: 3px;
text-align: left;
line-height: 1.3em;
border-radius: 2px;
border: 1px solid white;

top: -30px;
left: 30px;
 
/* Position the tooltip text - oben! */
position: absolute;
z-index: 1;
bottom: 125%;
left: 30px;
margin-left: -60px;

opacity: 0;
transition: opacity 1s;
}

/* Show the tooltip text when you mouse over the tooltip container */
.ttk:hover .toolttk {
visibility: visible;
opacity: 1;
}

 /* Dropdown Button */
.dropbtn
{
padding: 2px 5px 2px 5px;
font-size: 13px;
border: 1px solid #BBBBBB;
width: 100px;
font-family: Signika, Arial;
}

/* The container <div> - needed to position the dropdown content */
.dropdown 
{
position: relative;
display: inline-block;
}

/* Dropdown Content (Hidden by Default) */
.dropdown-content
{
display: none;
position: absolute;
background-color: #FFFFFF;
min-width: 200px;
min-height: 20px;
border: 1px solid #000000;
z-index: 1;
}

/* Links inside the dropdown */
.dropdown-content a
{
color: black;
padding: 2px 5px 2px 5px;
font-family: Signika, Arial;
font-size: 13px;
text-decoration: none;
display: block;
}

/* Change color of dropdown links on hover */
.dropdown-content a:hover 
{
background-color: #cccccc; 
}

/* Show the dropdown menu on hover */
.dropdown:hover .dropdown-content
{
display: block;
position: absolute;
background-color: #FFFFFF;
min-width: 200px;
min-height: 20px;
border: 1px solid #000000;
z-index: 1;
}

/* Change the background color of the dropdown button when the dropdown content is shown */
.dropdown:hover .dropbtn
{
background-color: #3ed841;
} 

footer {
position: absolute;
width: 100%;
background: #2a2a2a;
margin-left: 0px !important;
font-size: 18px;
color: #fff;
}

tr .spnTooltip {
    z-index:10;display:none; padding:14px 20px;
    margin-top:-30px; margin-left:28px;
    width:300px; line-height:16px;
}
tr:hover .spnTooltip{
    display:inline; position:absolute; color:#111;
    border:1px solid #DCA; background:#fffAF0;}
.callout {z-index:20;position:absolute;top:30px;border:0;left:-12px;}


.blink 
{ 
animation: blink 2s linear infinite;
}

@keyframes blink 
	{
	0%, 50%
		{ opacity: 0; }
  	50.01%, 100% 
  		{ opacity: 1; }
	}

}

#blink 
{ 
animation: blink 2s linear infinite;
}

@keyframes blink 
	{
	0%, 50%
		{ opacity: 0; }
  	50.01%, 100% 
  		{ opacity: 1; }
	}

@media print
{
body { display : block; }
#navigation { display: none }

a { color: #000; }

th { font-size: 13px; color: #000; }
td { font-size: 13px; color: #000; }
}