/* ************************************************************** */
/* *************************** WICHTIG ************************** */
/* In css defines bezüglich Grösse und Position nur in px erlaubt */
/* ************************************************************** */


/* define font for whole page */
/* DINMit looks awful in the popups - so use Arial there */
html * {
	font-family: Arial;
}

#resizableMainPage  *{
	font-family: DINMit;
}

@font-face {
	font-family: DINMit;
	src: url('../fonts/DINMit.ttf');
}

body {
	/* On iPhone OS, when you touch and hold a touch target such as a link, Safari displays a callout containing information about the link. This property allows you to disable that callout. */
    /* -webkit-touch-callout: none; */
	
	/* Determines whether a user can select the content of an element. */
    /*-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;*/
	
	/* Overrides the highlight color shown when the user taps a link or a JavaScript clickable element in Safari on iPhone. */
	/* -webkit-tap-highlight-color:rgba(0,0,0,0); */
}


/* ******************* */
/* DropDownMenu-Widget */
/* ******************* */

/* Font color of all elements in the widget's div when the Drop-Down-Menu is closed or opened respectively */
.closedFontColor {
	color: #ffffff;
}
.openedFontColor {
	color: #0C76B4;
}
.cursorDefault {
	cursor: default;
}

/* itemBackground: Viereckiger Bereich, welcher hinter dem Item angezeigt wird */
.itemBackground {
	border-style:solid;
	border-width:2px 0px 2px 0px; 
	border-color:white;
	color:#676767;
	font-size:1.5em;
	left: 30px;
	width: 545px;
}

.itemBackgroundColor {
	background-color:#d1d1d1;
}

.itemBackgroundColorHover  {
	background-color:#0C76B4;
}

.dropDownItem {
	color:#676767;
}

.dropDownItemHover {
	color:#ffffff;
}



/* ********** */
/* Animations */
/* ********** */

.runningProgramAnimation {
	-webkit-animation: spin 2s infinite linear;
	-moz-animation: spin 2s infinite linear;
	-o-animation: spin 2s infinite linear;
	-ms-animation: spin 2s infinite linear;
}
@-webkit-keyframes spin {
	0% { -webkit-transform: rotate(0deg);}
	100% { -webkit-transform: rotate(359deg);}
}
@-moz-keyframes spin {
	0% { -moz-transform: rotate(0deg);}
	100% { -moz-transform: rotate(359deg);}
}
@-o-keyframes spin {
	0% { -o-transform: rotate(0deg);}
	100% { -o-transform: rotate(359deg);}
}
@-ms-keyframes spin {
	0% { -ms-transform: rotate(0deg);}
	100% { -ms-transform: rotate(359deg);}
}



.statusErrorAnimationOff {
	display:none;
}


.statusErrorAnimationOn {
    -webkit-animation-duration: 1.5s;
    -webkit-animation-name: startStatusErrorAnimation;
	-webkit-animation-iteration-count: infinite;
	-webkit-animation-direction: alternate;
	
    -moz-animation-duration: 1.5s;
    -moz-animation-name: startStatusErrorAnimation;
	-moz-animation-iteration-count: infinite;
	-moz-animation-direction: alternate;

    animation-duration: 1.5s;
    animation-name: startStatusErrorAnimation;
	animation-iteration-count: infinite;
	animation-direction: alternate;	
}
@-webkit-keyframes startStatusErrorAnimation {
    0% {
        display: block; 
        opacity: 0.0;
    }

    100% {
        display: block; 
        opacity: 1;
    }
}
@-moz-keyframes startStatusErrorAnimation {
    0% {
        display:block; 
        opacity: 0.1;
    }

    100% {
        display: block; 
        opacity: 1;
    }
}	
@keyframes startStatusErrorAnimation {
    0% {
        display:block; 
        opacity: 0.1;
    }

    100% {
        display: block; 
        opacity: 1;
    }
}

/* *********** */
/* Info Window */
/* *********** */
.infoWindow {
	color:#575756;
	font-size:1.6em;
	position:absolute;
	left:136px;
	top:352px;
	width:800px
}
.infoWindowTable {
	text-align:left;
	width:500px;
	color:#575756
}
.infoWindowLink {
	text-decoration:none
}
.infoWindowLink:visited {
	color:#575756
}
.infoWindowLink:hover {
	color:black
}
.infoWindowTitle {
	font-size:1.6em;
	font-weight:bold
}