
/* default styles for extension "tx_frontend" */
    .ce-align-left { text-align: left; }
    .ce-align-center { text-align: center; }
    .ce-align-right { text-align: right; }

    .ce-table td, .ce-table th { vertical-align: top; }

    .ce-textpic, .ce-image, .ce-nowrap .ce-bodytext, .ce-gallery, .ce-row, .ce-uploads li, .ce-uploads div { overflow: hidden; }

    .ce-left .ce-gallery, .ce-column { float: left; }
    .ce-center .ce-outer { position: relative; float: right; right: 50%; }
    .ce-center .ce-inner { position: relative; float: right; right: -50%; }
    .ce-right .ce-gallery { float: right; }

    .ce-gallery figure { display: table; margin: 0; }
    .ce-gallery figcaption { display: table-caption; caption-side: bottom; }
    .ce-gallery img { display: block; }
    .ce-gallery iframe { border-width: 0; }
    .ce-border img,
    .ce-border iframe {
        border: 2px solid #000000;
        padding: 0px;
    }

    .ce-intext.ce-right .ce-gallery, .ce-intext.ce-left .ce-gallery, .ce-above .ce-gallery {
        margin-bottom: 10px;
    }
    .ce-image .ce-gallery { margin-bottom: 0; }
    .ce-intext.ce-right .ce-gallery { margin-left: 10px; }
    .ce-intext.ce-left .ce-gallery { margin-right: 10px; }
    .ce-below .ce-gallery { margin-top: 10px; }

    .ce-column { margin-right: 10px; }
    .ce-column:last-child { margin-right: 0; }

    .ce-row { margin-bottom: 10px; }
    .ce-row:last-child { margin-bottom: 0; }

    .ce-above .ce-bodytext { clear: both; }

    .ce-intext.ce-left ol, .ce-intext.ce-left ul { padding-left: 40px; overflow: auto; }

    /* Headline */
    .ce-headline-left { text-align: left; }
    .ce-headline-center { text-align: center; }
    .ce-headline-right { text-align: right; }

    /* Uploads */
    .ce-uploads { margin: 0; padding: 0; }
    .ce-uploads li { list-style: none outside none; margin: 1em 0; }
    .ce-uploads img { float: left; padding-right: 1em; vertical-align: top; }
    .ce-uploads span { display: block; }

    /* Table */
    .ce-table { width: 100%; max-width: 100%; }
    .ce-table th, .ce-table td { padding: 0.5em 0.75em; vertical-align: top; }
    .ce-table thead th { border-bottom: 2px solid #dadada; }
    .ce-table th, .ce-table td { border-top: 1px solid #dadada; }
    .ce-table-striped tbody tr:nth-of-type(odd) { background-color: rgba(0,0,0,.05); }
    .ce-table-bordered th, .ce-table-bordered td { border: 1px solid #dadada; }

    /* Space */
    .frame-space-before-extra-small { margin-top: 1em; }
    .frame-space-before-small { margin-top: 2em; }
    .frame-space-before-medium { margin-top: 3em; }
    .frame-space-before-large { margin-top: 4em; }
    .frame-space-before-extra-large { margin-top: 5em; }
    .frame-space-after-extra-small { margin-bottom: 1em; }
    .frame-space-after-small { margin-bottom: 2em; }
    .frame-space-after-medium { margin-bottom: 3em; }
    .frame-space-after-large { margin-bottom: 4em; }
    .frame-space-after-extra-large { margin-bottom: 5em; }

    /* Frame */
    .frame-ruler-before:before { content: ''; display: block; border-top: 1px solid rgba(0,0,0,0.25); margin-bottom: 2em; }
    .frame-ruler-after:after { content: ''; display: block; border-bottom: 1px solid rgba(0,0,0,0.25); margin-top: 2em; }
    .frame-indent { margin-left: 15%; margin-right: 15%; }
    .frame-indent-left { margin-left: 33%; }
    .frame-indent-right { margin-right: 33%; }

/* muli-300 - latin */
@font-face {
  font-family: 'Muli';
  font-style: normal;
  font-weight: 300;
  src: url('../../../fileadmin/templates/stream/fonts/muli-v20-latin-300.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../../../fileadmin/templates/stream/fonts/muli-v20-latin-300.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../../../fileadmin/templates/stream/fonts/muli-v20-latin-300.woff2') format('woff2'), /* Super Modern Browsers */
       url('../../../fileadmin/templates/stream/fonts/muli-v20-latin-300.woff') format('woff'), /* Modern Browsers */
       url('../../../fileadmin/templates/stream/fonts/muli-v20-latin-300.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../../../fileadmin/templates/stream/fonts/muli-v20-latin-300.svg#Muli') format('svg'); /* Legacy iOS */
}

/* muli-regular - latin */
@font-face {
  font-family: 'Muli';
  font-style: normal;
  font-weight: 400;
  src: url('../../../fileadmin/templates/stream/fonts/muli-v20-latin-regular.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../../../fileadmin/templates/stream/fonts/muli-v20-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../../../fileadmin/templates/stream/fonts/muli-v20-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('../../../fileadmin/templates/stream/fonts/muli-v20-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('../../../fileadmin/templates/stream/fonts/muli-v20-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../../../fileadmin/templates/stream/fonts/muli-v20-latin-regular.svg#Muli') format('svg'); /* Legacy iOS */
}

/* muli-600 - latin */
@font-face {
  font-family: 'Muli';
  font-style: normal;
  font-weight: 600;
  src: url('../../../fileadmin/templates/stream/fonts/muli-v20-latin-600.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../../../fileadmin/templates/stream/fonts/muli-v20-latin-600.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../../../fileadmin/templates/stream/fonts/muli-v20-latin-600.woff2') format('woff2'), /* Super Modern Browsers */
       url('../../../fileadmin/templates/stream/fonts/muli-v20-latin-600.woff') format('woff'), /* Modern Browsers */
       url('../../../fileadmin/templates/stream/fonts/muli-v20-latin-600.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../../../fileadmin/templates/stream/fonts/muli-v20-latin-600.svg#Muli') format('svg'); /* Legacy iOS */
}


* {
 border:0pt none;
 margin:0pt;
 padding:0pt;
}


body,html {
 font-family:'Muli',sans-serif;
 font-size:16px;
 margin:0px;
 min-width:300px;
 padding:0px;
 text-align:left;
 background-color: #555555;
 color: white;
 height:100%;
 margin: 0;
 padding: 0; 
}

#background {
  background-repeat:no-repeat;
  position:fixed;
  _position:absolute;
  top:0;
  _top:expression(eval(document.body.scrollTop));
	z-index: 0;
}

#background {
 height:100vh! important;
 overflow:hidden;
 width:100vw;
 z-index:1;
 background-size: cover;
}
#background img {
 height:auto;
 width:100% ! important;
}

#b-pic-copy {
	font-size: 0.7rem;
	position: relative;
	text-align: center;
	z-index: 3;
	margin-top:2rem;
	color:#AAAAAA;
}
#b-pic-copy a {
	color:#AAAAAA;
}
#page {
 width:100%;

}

#navigation {
	background: rgba(255,255,255,1) 80%;
	height:auto;
	color: black;
	text-transform: uppercase;
	width:50vw;
	position: absolute;
	top:2vh;
	font-size:1.5rem;
}
#navigation .nav {
	display: flex;
	djustify-content: space-around;
	line-height:4rem;
}
#navigation .nav-li {
	flex: 1 1 auto;
	list-style: none;
	text-align:center;
}
#navigation .nav-li a{
	width:10vw;
	color: black;
	text-decoration: none;
  padding:0.6rem 2rem;
	transition: background 0.5s linear; /* vendorless fallback */
    -o-transition: background 0.5s linear; /* opera */
    -ms-transition: background 0.5s linear; /* IE 10 */
    -moz-transition: background 0.5s linear; /* Firefox */
    -webkit-transition: background 0.5s linear; /*safari and chrome */
}
#navigation .nav-li a:hover{
  	padding:0.6rem 2rem;
	color: white;
		background: rgba(134,134,134,1) 20%;
		transition: background 0.5s linear; /* vendorless fallback */
    -o-transition: background 0.5s linear; /* opera */
    -ms-transition: background 0.5s linear; /* IE 10 */
    -moz-transition: background 0.5s linear; /* Firefox */
    -webkit-transition: background 0.5s linear; /*safari and chrome */
}
#navigation .nav-li a.active{
	color: orange;
}

#logo {
	padding:0vh 0vw;
	height:10vh;
	position:relative;
	text-align: right;
	padding:0vh 1vw;
	z-index: 2;
}
#logo img {
	padding:1vh 0vw;
	height: 8vh;
}
#wrap {
 height:auto !important;
 position:relative;
 min-height:78vh;
 z-index:3;
 display:flex;
 justify-content: space-around;
 width:90vw;
 margin: 0 auto;
}
.content {
 margin-top:10vh;
 display:flex;
 display:-webkit-box;
 display:-ms-flexbox;
 display:-webkit-flex;
 justify-content:space-between;
}
.ContentNormal .frame, .ContentLeft .frame, .ContentRight .frame, .ContentBorder{
	background-color: rgba(100,100,100,0.85);
	padding: 1vw;
	position: relative;
	margin:1vw 0vw;
}
.frame .frame{
	background-color:transparent;
	padding: 0vw;
	margin:0vw 0vw;
}
.ContentNormal {
	flex: 1 1 auto;
}
.ContentLeft {
	width:50vw;
}

.ContentRight{
	margin-left:5vw;
	width:40vw;
}

.ContentBorder {
position: relative;
	width:30vw;
	right:0vw;
	top:0vh;
	margin-left:1vw;
}

.footer {
	clear:both;
	text-align: center;
  text-transform: uppercase;
	font-size: 0.7rem;
	z-index: 2;
	position: absolute;
	width:100%;
}

a {
	color:white;
	
}

p{
	
	
}
h1,h2,h3 {
	text-transform: uppercase;
	margin:0.5rem 0rem;
}
h1 {
  font-size: 2rem;	
}

h2 {
	font-size:1.5rem;
}

h3 {
  font-size:1.2rem;
	
}
img {
	max-width: 100%;
	height:100%;
}
hr {
  border-top: 1px solid white;
}

iframe {
	
	height:auto !important;
}

#login-form {
	display: flex;
	flex-direction:  column;
	justify-content: space-between;
	margin: 0;
	padding: 0;
	padding-top:1rem;
	text-align: center;
}
#login-form label {
	width:90px;
	margin-right:1.5rem;
	font-size: 1rem;
	display: inline-block;
}
#login-form input{
	padding:0.8rem 1.5rem;
	font-size:1rem;
}

#login-form #user,#login-form #pass {
	border:2px solid #555555;
	margin: 0.5rem 1rem;
	width:280px;
	padding:0.8rem;
}
#login-form input[type=submit] {	
	-webkit-appearance: none;
	color:white;
	margin-top:1vw;
	text-transform:uppercase;
	border:2px solid #666666;
	background-color:#333333;
	cursor: pointer;
}
#login-form input[type=submit]:hover {
	border:2px solid white;
}
#login-form .forgot-pw{
	margin-left:250px;
}

.ce-center {
	text-align: center;
}
.ce-bodytext {
	text-align: left;
}



@media all and (max-width:699px), @media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : portrait)
and (-webkit-min-device-pixel-ratio: 2) {
	.content {
		flex-direction: column;
		justify-content: stretch;
		margin-left:1vw;
		margin-right:1vw;
	}
	.ContentLeft, .ContentRight, .ContentBorder, .ContentNormal {
		width: 90vw;
		margin-bottom:2vh;
		margin-left:2vw;
		margin-right:2vw;
	}
	.ContentNormal {
	  width: 92vw;
	}
	#b-pic-copy {
	margin-top:3rem;
	}
	#chat iframe {
	   min-height:60vh;
	   width:90vw;
  }
  #video iframe{	
	   width:90vw;
	   min-height:50.625vw;
	   z-index:2;
  }
	.ce-left .ce-gallery, .ce-right .ce-gallery{
		float: none;
		clear: both;
	}

}
@media only screen 
and (min-device-width : 700px) 
and (max-device-width : 1024px) 
and (orientation: landscape)
and (-webkit-min-device-pixel-ratio: 4) {
  .content {
	  flex-direction: column;
	}
	#chat {
		height: 140vh;
	}
  #chat iframe{
		min-height: 140vh;
	}
}
@media all and (min-width:700px) and (max-width:900px) {
	.content {
		flex-direction: column;
		justify-content: stretch;
		margin-left:1vw;
		margin-right:1vw;
	}
	.ContentLeft, .ContentRight, .ContentBorder, .ContentNormal {
		width: 90vw;
		margin-bottom:2vh;
		margin-left:2vw;
		margin-right:2vw;
	}
		.ContentNormal {
	  width: 92vw;
	}
	#b-pic-copy {
	margin-top:3rem;
	}
	#chat iframe {
	   min-height:60vh;
	   width:90vw;
  }
  #video iframe{	
	   width:90vw;
	   min-height:50.625vw;
	   z-index:2;
  }
}