/* latin */
@font-face {
  font-family: 'Calibri';
  font-style: italic;
  font-weight: 400;
  src: local('Calibri Italic');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin */
@font-face {
  font-family: 'Calibri';
  font-style: italic;
  font-weight: 700;
  src: local('Calibri Bold Italic');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin */
@font-face {
  font-family: 'Calibri';
  font-style: normal;
  font-weight: 400;
  src: local('Calibri');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin */
@font-face {
  font-family: 'Calibri';
  font-style: normal;
  font-weight: 700;
  src: local('Calibri Bold');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 300;
  src: local('Open Sans Light'), local('OpenSans-Light'),
       url('../../css/fonts/open-sans-v17-latin-ext_latin_greek_cyrillic-300.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
       url('../../css/fonts/open-sans-v17-latin-ext_latin_greek_cyrillic-300.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}

/* open-sans-regular - latin-ext_latin_greek_cyrillic */
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 400;
  src: local('Open Sans Regular'), local('OpenSans-Regular'),
       url('../../css/fonts/open-sans-v17-latin-ext_latin_greek_cyrillic-regular.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
       url('../../css/fonts/open-sans-v17-latin-ext_latin_greek_cyrillic-regular.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}

/* open-sans-italic - latin-ext_latin_greek_cyrillic */
@font-face {
  font-family: 'Open Sans';
  font-style: italic;
  font-weight: 400;
  src: local('Open Sans Italic'), local('OpenSans-Italic'),
       url('../../css/fonts/open-sans-v17-latin-ext_latin_greek_cyrillic-italic.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
       url('../../css/fonts/open-sans-v17-latin-ext_latin_greek_cyrillic-italic.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}

/* open-sans-300italic - latin-ext_latin_greek_cyrillic */
@font-face {
  font-family: 'Open Sans';
  font-style: italic;
  font-weight: 300;
  src: local('Open Sans Light Italic'), local('OpenSans-LightItalic'),
       url('../../css/fonts/open-sans-v17-latin-ext_latin_greek_cyrillic-300italic.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
       url('../../css/fonts/open-sans-v17-latin-ext_latin_greek_cyrillic-300italic.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}

/* open-sans-600italic - latin-ext_latin_greek_cyrillic */
@font-face {
  font-family: 'Open Sans';
  font-style: italic;
  font-weight: 600;
  src: local('Open Sans SemiBold Italic'), local('OpenSans-SemiBoldItalic'),
       url('../../css/fonts/open-sans-v17-latin-ext_latin_greek_cyrillic-600italic.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
       url('../../css/fonts/open-sans-v17-latin-ext_latin_greek_cyrillic-600italic.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}

/* open-sans-600 - latin-ext_latin_greek_cyrillic */
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 600;
  src: local('Open Sans SemiBold'), local('OpenSans-SemiBold'),
       url('../../css/fonts/open-sans-v17-latin-ext_latin_greek_cyrillic-600.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
       url('../../css/fonts/open-sans-v17-latin-ext_latin_greek_cyrillic-600.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}

/* open-sans-700 - latin-ext_latin_greek_cyrillic */
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 700;
  src: local('Open Sans Bold'), local('OpenSans-Bold'),
       url('../../css/fonts/open-sans-v17-latin-ext_latin_greek_cyrillic-700.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
       url('../../css/fonts/open-sans-v17-latin-ext_latin_greek_cyrillic-700.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}

/* open-sans-800 - latin-ext_latin_greek_cyrillic */
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 800;
  src: local('Open Sans ExtraBold'), local('OpenSans-ExtraBold'),
       url('../../css/fonts/open-sans-v17-latin-ext_latin_greek_cyrillic-800.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
       url('../../css/fonts/open-sans-v17-latin-ext_latin_greek_cyrillic-800.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}

/* open-sans-700italic - latin-ext_latin_greek_cyrillic */
@font-face {
  font-family: 'Open Sans';
  font-style: italic;
  font-weight: 700;
  src: local('Open Sans Bold Italic'), local('OpenSans-BoldItalic'),
       url('../../css/fonts/open-sans-v17-latin-ext_latin_greek_cyrillic-700italic.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
       url('../../css/fonts/open-sans-v17-latin-ext_latin_greek_cyrillic-700italic.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}

/* open-sans-800italic - latin-ext_latin_greek_cyrillic */
@font-face {
  font-family: 'Open Sans';
  font-style: italic;
  font-weight: 800;
  src: local('Open Sans ExtraBold Italic'), local('OpenSans-ExtraBoldItalic'),
       url('../../css/fonts/open-sans-v17-latin-ext_latin_greek_cyrillic-800italic.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
       url('../../css/fonts/open-sans-v17-latin-ext_latin_greek_cyrillic-800italic.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}


* {
margin: 0;
padding: 0;
} 


BODY, HTML
{
	margin: 0;
	padding: 0;
	width:100vw;
	height: 100vh;
	font-family: 'Calibri', 'Open Sans', Trebuchet MS;
	color: white;
	cursor: default;
	background: #d0d0d0;
	font-size: 1.6vmin;
	line-height: 3vmin;
	letter-spacing: 0.18vmin;
	
}

body	{
	background-image: url(../images/website_tunnel.jpg);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center center;
	
}
img{display: block;}
/*
Standart-Schriften, Gr��e und Farbe
*/
.small		 {
	font-size: 1.1vmin; 
	font-weight: bold;
	letter-spacing: 0.01vmin;
}
.middle		 {
	cursor: default;
	text-shadow: 0.1vmin 0.1vmin 0.1vmin rgba(0, 0, 0, 0.8);
	font-size: 1.7vmin;
	font-family: g;
} 
.normal		 {
	cursor: default;
	text-shadow: 0.1vmin 0.1vmin 0.1vmin rgba(0, 0, 0, 0.8);
	font-size: 2.3vmin;
} 
.slarge		 {
	font-size: 2.5vmin;
	text-shadow: 0.1vmin 0.1vmin 0.1vmin rgba(0, 0, 0, 0.8);
	font-family: gb;
} 

.large		 {
	font-size: 3.0vmin;
	text-shadow: 0.1vmin 0.1vmin 0.1vmin rgba(0, 0, 0, 0.8);
	font-family: gb;
} 

.xlarge		 {
	font-size: 3.5vmin;
	text-shadow: 0.1vmin 0.1vmin 0.1vmin rgba(0, 0, 0, 0.8);
	font-family: gb;
} 

.txt-shadow		 {
	text-shadow: 0.1vmin 0.1vmin 0.05vmin rgba(0, 0, 0, 0.6);
} 
.title		 {
	font-size: 2.6vmin;
	font-weight: 600;	
	text-transform: uppercase
} 

.times		{
	font-family: Times New Roman;	
}

/*
Schriftfarben & Ausrichtung
*/

.no-shadow
{
	text-shadow:  0 0 0 rgba(0, 0, 0, 0.0)!important;
}

.red	{
	color: #dc0b14;	
}
.white	{
	color: white;	
}
.black	{
	color: black;
	text-shadow:  0 0 0 rgba(0, 0, 0, 0.8)!important;
}
.lightgray	{
	color: #cecdce
}

.gray	{
	color: #414141	
}

.upper-case	{
	text-transform: uppercase;
}

.normal-letter-spacing	{
	letter-spacing: 1px;
}

.center		{
	text-align: center	
}

.bold	{
	font-weight: 600;	
}

/*
Links
*/
a, a:link	 {
	color: #164194;
	text-decoration:none;
}
a:visited	 {
	color: #164194;
	text-decoration:none
}
a:hover		 {
	color: #1c55c1;
	text-decoration: none;
	opacity: 1.0
}
a:active	 {
	color: #164194;
	text-decoration:none
}

/*
Copyright-Bereichder Seite
*/

a.copyright:link	 {
	color: white;
	text-decoration:none
}
a.copyright:visited	 {
	color: white;
}
a.copyright:hover		 {
	color: black;
	text-decoration: none
}
a.copyright:active	 {
	color: white;
	text-decoration:none
}

#canvas	{
	width: 100%;
	height: 100%;
	display: table-cell;
	vertical-align: center
}


#logo	{
	
	width: 50vmin;
	height: auto;
	top: -25vmin;
	left: 0vmin;
	position: absolute;	
}

#logo-shadow	{
	
	width: 50vmin;
	height: auto;
	top: -6vmin;
	left: 0vmin;
	position: absolute;
	
}

#box	{
	transform: skewX(-20deg);
	background: rgba(0,0,0,0.7);
	box-shadow: 0.5vmin 0.5vmin 0.5vmin 0vmin rgba(0, 0, 0, 0.5);
	width: 75vmin;
	height: 30vmin;
	border-radius: 5vmin;
	position: absolute;
	left: -5vmin;

}
#content	{


	

	top: 42vh;
  	left: calc(50vw - 35vmin);
  	
	width: 70vmin;
	height: 30vmin;
	
	
	align-items: start!important;	
	padding: 2vmin;	
	position: fixed;
	text-align: left;

	display: table-cell;
    vertical-align: middle;
	
	
	
	
}

.list	{
	list-style-type: none;
	margin: 0 auto;
	width: 90vw;
	padding-bottom: 1vmin;
	transition: 0s!important;
}

.list li	{
	float: left;
	display: inline;
	text-align: left;
	min-width: 22vmin;
}

.trans	{
	transition:  0.4s,  0.4s;
}

.no-trans	{
	transition:  0.0s,  0.0s!important;
}


.hover-from-100	{
	-o-transition:.5s;
	-ms-transition:.5s;
	-moz-transition:.5s;
	-webkit-transition:.5s;
	transition:.5s;
	opacity: 0.55;
	cursor: pointer;
	
	
}

.hover-from-100:hover	{
	opacity: 1.0;
}



.grow-up
{
    -webkit-animation: grow-up infinite .3s ease-in-out;
       -moz-animation: grow-up infinite .3s ease-in-out;
         -o-animation: grow-up infinite .3s ease-in-out;
            animation: grow-up infinite .3s ease-in-out;
    -webkit-animation-iteration-count: 1;  
       -moz-animation-iteration-count: 1;  
         -o-animation-iteration-count: 1;            
            animation-iteration-count: 1
            </* transform-origin: 20% 40%; 2DO z-achse verschieben f�r sauberere Animation*/
}

@keyframes grow-up
{  
	0%
    {
          transform: scale(0,0);
    }
    
    100%
    {
          transform: scale(1,1);
    }
    
}  

.loadingCircle
{
    width: 12vh;
    height: 12vh;
    margin: 0px auto;
    -webkit-animation: loadingCircle infinite .75s linear;
       -moz-animation: loadingCircle infinite .75s linear;
         -o-animation: loadingCircle infinite .75s linear;
            animation: loadingCircle infinite .75s linear;

    border: 2.5vh solid #fff;
    border-top-color: transparent;
    border-radius: 100%;
    opacity: 0.6;
}