/*System Style - DO NOT REMOVE!*/
body{
margin: 0px;
padding: 0px;
background:#000;
font-family:Arial, Helvetica, sans-serif;
font-size:17px;
line-height:23px;
color:#3a3939;
/**background: #000 url("/images/cust/end_of_earth_by_faabbiii_uhd.jpg") no-repeat fixed center top;**/
background: #000 url("/images/cust/bg_wave_01.png") no-repeat fixed center top;
}

button:hover{
	text-shadow: 0 0 10px #fff; 
}

.footer{
width:100%;
background: #141414 url('../images/system/footer_bg.gif') repeat-x top right;
padding-top: 15px;
text-align : center;
font-size: 12px;
color:#E4E4E4;
margin-top: 20px;
padding-bottom: 20px;
position: absolute;
height: 40px;
left:0px;
bottom: 0px;
right:0px;
}

.footertable{
    border-spacing: 50px 10px !important;
    border-collapse: separate !important; 
    margin-top:20px !important; 
    margin-bottom: 20px !important; 
    margin-left: auto !important; 
    margin-right: auto !important; 
    text-align:center !important; 
    font-size: 14px;
}

.footertable td {
    text-align:center !important;
    padding:10px !important;
}

.footertable a{
    font-size: 18px !important;
}

.productitem{
width:250px; 
height: 400px; 
cursor: pointer;
float:left;
margin: 20px 25px 20px 25px;
border: 1px solid #fff;
}

.productitem:hover{
border: 1px solid #ccc;
box-shadow: 0 0 13px rgba(0, 0, 0, 0.17);
}

.productitem:hover > .productheader{
	background: #1B6EAE;
}

.productitem:hover > .productbuy{
	display: block;
}

.productitem:hover > .productprice{
	background: url(../images/system/productPrice.gif);
	color: #fff;
}

.productheader{
background: #ccc;
height: 40px;
overflow:hidden;
color: #fff;
padding: 10px;
text-align: center;
font-size: 19px;
}

.productpic{
 border: 1px solid #ccc;
height: 200px;
overflow:hidden;
padding: 10px;
}

.productprice{

height: 40px;
overflow:hidden;
font-size: 19px;
padding: 10px;
text-align: center;
}

.productname{
 
height: 60px;
overflow:hidden;
padding: 10px;
font-size: 15px;
text-align: center;
}

.productbuy{
 display: none;
height: 60px;
overflow:hidden;
padding: 10px;
text-align: center;
}

.mainmenu{
	text-shadow: 0 0 10px #fff; 
	margin-bottom: 15px;
}

.wrapper{
width: 100%; 
max-width: 1400px;
margin:auto;
/*background: #fff;*/
background-color: rgba(30, 30, 30, 0.5);
}

.headwrapper{
height: 140px;
}

.wrapperbig{
width: 100%;
margin:auto;
/*background: #fff;*/
}

.headwrapperbig{
height: 60px;
background-color: rgba(30, 30, 30, 0.5);
}

.headbox{
	width: 400px;
	position:relative;
}

#logo_video{
	width:100px;
	height:100px;
	margin:5px;
	margin-right: 20px;
	margin-left: 10px;
	cursor:pointer;
}

#logo_header_video{
	height:140px;
	margin:0px;
    position:relative;
    z-index:0;
}

.logo_header_text_frame{
	position:absolute;
    padding-top:60px;
    padding-left:170px;
	top:0px;
	left:0px;
    z-index:1;
	cursor:pointer;
	width:400px;
	height:140px;
}

.logo_header_text{
	color: #F9F9F9;
	font-size: 50px;
	display:none;
	cursor:pointer;
}

.left{
	float:left;
}

.center{
	margin:auto;
}

.right{
	float:right;
}

.slideinfotop{
	width: 380px; 
	height: 140px; 
	margin-bottom: 20px; 
	margin-left: 20px; 
	padding: 10px;
}

.slideinfobottom{
	width: 380px; 
	height: 140px; 
	margin-left: 20px;  
	padding: 10px;
}

.clearfloat{
	clear: both;
}

.HighLightTextFrame{
margin-left: 350px;
}

.ProductviewImageFrame{
width: 420px; border: 1px solid #eee; padding: 10px; margin-right: 20px;
}

.ProductlistFilterFrame{
width: 270px; border: 1px solid #eee; padding: 10px;
}

.ProductlistMainFrame{
border: 1px solid #eee; width: 905px;
}

.productitembig{
width:860px; 
cursor: pointer;
float:left;
margin: 20px 25px 20px 25px;
border: 1px solid #ccc;
box-shadow: 0 0 13px rgba(0, 0, 0, 0.17);
}

.productheaderbig{
background: #1B6EAE;
height: 40px;
overflow:hidden;
color: #fff;
padding: 10px;
font-size: 19px;
text-align: center;
}

.productpicbig{
border: 1px solid #ccc;
width: 226px;
overflow:hidden;
padding: 10px;
margin:10px;
float: left;
}

.productpricebig{
height: 40px;
overflow:hidden;
font-size: 19px;
padding: 10px;
text-align: right;
background: url(../images/system/productPrice.gif);
color: #fff;
}

.productnamebig{
overflow:hidden;
padding: 10px;
font-size: 19px;
width:592px;
float:right;
margin-bottom:5px;
}

.productdescbig{
padding: 10px;
width:592px;
float:right;
}

.productbuybig{
height: 60px;
overflow:hidden;
padding: 10px;
text-align: center;
}

.inputerror{
border-color: #E51400 !important;
}

.loginmsg{
border: 1px solid #7AD61D;
text-align:center;
padding: 10px;
}

.bg-greylight{
    background-color: #EEEEEE !important;
}

.element-divider-dropdown{
    border-bottom: 1px #6E6E6E solid !important;
    height: 1px;
    
}

.ControlCenterMenuFrame{
width: 280px; 
position: absolute;
top: 50px;
left:0px;
bottom: 95px;
}

.ControlCenterMainFrame{
border-top: 1px solid #eee;  
border-bottom: 1px solid #eee;  
border-right: 1px solid #eee; 
padding:10px;
position: absolute;
top: 50px;
left: 280px;
bottom: 95px;
right: 10px;
overflow:auto;
}

#main-video{
	margin:auto;
	width: 100%;
	max-height: 788px;
	margin-top: 0px;
	background: rgba(0,0,0,0.5);
}

#StreamData{
	z-index: 999;
	position: relative;
	top: 5px;
	right: 10px;
	float: right;
	opacity: 0.7;
}

#PlayerControls{
	z-index: 999;
	position: relative;
	top: -45px;
	right: 0px;
	left: 0px;
	height: 42px;
	opacity: 0.8;
	padding-top:5px;
	padding-left: 15px;
	padding-right: 15px;
	background: rgba(0, 0, 0, 0.7);
}

#PlayerVolumeControl{
	width: 100px; 
	height: 25px;
	margin-left: 35px;
	margin-right: 35px;
	cursor: pointer;
}

#PlayerVolumeButton{
	cursor: pointer;
	font-size: 25px;
}

#PlayerVolumeButton:hover{
	color: #1BA1E2 !important;
}

#PlayerPlayButton{
	cursor: pointer;
	font-size: 25px;
}

#PlayerPlayButton:hover{
	color: #1BA1E2 !important;
}

#PlayerVolumeControl > .marker{
	height: 25px;
}

#PlayerFullscreenButton{
	cursor: pointer;
	font-size: 25px;
}

#PlayerFullscreenButton:hover{
	color: #1BA1E2 !important;
}

.vjs-big-play-button{
	position: absolute !important;
	margin-top: -21px !important;
	top: 50% !important;
	margin-left: -42px !important;
	left: 50% !important;
}

video#bgvid { 
    position: fixed;
    top: 50%;
    left: 50%;
    min-width: 100%;
    min-height: 100%;
    width: auto;
    height: auto;
    z-index: -100;
    -ms-transform: translateX(-50%) translateY(-50%);
    -moz-transform: translateX(-50%) translateY(-50%);
    -webkit-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
    background-size: cover; 
	background-color: #000;
}

.RadioPlayer{
	background: rgba(255,255,255,0.8);
	padding: 20px;
}

.RadioSongIMGFrame{
	float:left;
	width: 200px;
	height: 200px;
	overflow:hidden;
	margin: 20px;
	background-color: #000;
}

.RadioSongData{
	position:relative:;
	top: 0px;
	right: 0px;
	left: 0px;
	height: 200px;
	margin: 20px;
	margin-bottom: 40px;
	overflow: hidden;
}

.RadioSongIMGFrame > img{
	max-width: 200px;
	max-height: 200px;
	margin:auto;
	position: relative;
	top: 50%;
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
}

.RadioHistorySongIMGFrame{
	width: 50px;
	height: 50px;
	float:left;
	margin-right: 10px;
	background-color: #000;
}

.RadioHistorySongIMGFrame > img{
	max-width: 50px;
	max-height: 50px;
	margin:auto;
	position: relative;
	top: 50%;
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
}

#RadioHistory{
	margin: 20px;
}

.DisplayNone{
	display:none;
}

#RadioPlayer{
	display:none;
	width: 100%;
	margin: 20px;
	background-color: #bbb;
}

.Global_Dice{
	background: #fff;
	display:block;
	margin-left:auto;
	margin-right:auto;
}

.MonopolyPlayer{
	width: 50px;
	height: 50px;
	display: none;
	position: absolute;
	color:#fff;
	font-size:30px;
	padding-top:20px;
	text-align: center;
	background-repeat: no-repeat;
	-webkit-background-size: contain;
    -moz-background-size: contain;
    -o-background-size: contain;
    background-size: contain;
	background-position: center bottom;
}

#MonopolyPlayer0{
	z-index:10;
	top:140px;
	left:1158px;
	background-image: url("/images/game/Monopoly/Player0.png");
}

#MonopolyPlayer1{
	z-index:11;
	top:200px;
	left:1158px; 
	background-image: url("/images/game/Monopoly/Player1.png");
}

#MonopolyPlayer2{
	z-index:12;
	top:150px;
	left:1188px;
	background-image: url("/images/game/Monopoly/Player2.png");
}

#MonopolyPlayer3{
	z-index:13;
	top:210px;
	left:1188px;
	background-image: url("/images/game/Monopoly/Player3.png");
}

.Dice {
	height: 100px;
	width: 100px;
	position: relative;
	transform-style: preserve-3d;
	transform: translateZ(-100px) rotateY(-45deg) rotateX(-45deg);
	/**transition: transform 2s;**/
}

.DiceScene {
	border-radius: 10px;
	width: 100px;
	height: 100px;
	perspective: 200px;
	margin:auto;
	/**transform: translate(-50%, -50%);**/
}

.DiceSide {
	position: absolute;
	background-color: black;
	width: 100px;
	height: 100px;
	border-radius: 10px;
	line-height: 100px;
	background-color: #fff;
	background-repeat: no-repeat;
	-webkit-background-size: contain;
	-moz-background-size: contain;
	-o-background-size: contain;
	background-size: contain;
	background-position: center bottom;
}

.DiceOne {
	display: flex;
	justify-content: center;
	align-items: center;
	transform: rotateX(-90deg) translateZ(50px);
	z-index: 1;
	background-image: url("/images/game/Global/dice-1.png");
}

.DiceTwo {
	display: flex;
	justify-content: space-between;
	transform: rotateY(180deg) translateZ(50px);
	z-index: 2;
	background-image: url("/images/game/Global/dice-2.png");
}

.DiceThree {
	display: flex;
	justify-content: space-between;
	transform: rotateY(90deg) translateZ(50px);
	z-index: 3;
	background-image: url("/images/game/Global/dice-3.png");
}

.DiceFour {
	z-index: 4;
	transform: rotateY(0deg) translateZ(50px);
	background-image: url("/images/game/Global/dice-4.png");
}

.DiceFour,
.DiceSix {
	display: flex;
	justify-content: space-between;
}

.DiceFive {
	display: flex;
	justify-content: space-between;
	transform: rotateY(-90deg) translateZ(50px);
	z-index: 5;
	background-image: url("/images/game/Global/dice-5.png");
}

.DiceSix {
	transform: rotateX(90deg) translateZ(50px);
	z-index: 6;
	background-image: url("/images/game/Global/dice-6.png");
}

.MonopolyPlayerListItem{
	border-bottom: 2px solid #aaa; 
	padding: 10px;
	background-repeat: no-repeat;
	-webkit-background-size: contain;
	-moz-background-size: contain;
	-o-background-size: contain;
	background-size: contain;
	background-position: right center;
}

.MonopolyPlayerFrame{
	width:100%;
	height:530px;
	padding:0px;
	background: #000;
	background-repeat: no-repeat;
	background-position: center top;
	background-image: url('/images/game/Monopoly/MonopolyBackground.png');
	position:relative;
	overflow:hidden;
}
.MonopolyPlayerFrameBG{
	z-index:0;
	height:530px;
	width:1360px;
}

.MonopolyPlayerFrameContent{
	width:100%;
	height:530px;
	padding:0px;
	z-index:1;
	position: absolute;
	top:0px;
	left:0px;
	background-repeat: repeat-x;
	background-position: center top;
	background-image: url('/images/game/Monopoly/monopoly_border02.png');
}

.MonopolyCardMini{
	width:170px;
	height:260px;
	text-align: center;
	font-size: 15px;
	padding: 15px;
	color: #000;
	margin: 12px;
	cursor: pointer;
	background: transparent;
	background-repeat: no-repeat;
	-webkit-background-size: contain;
	-moz-background-size: contain;
	-o-background-size: contain;
	background-size: contain;
	background-image: url("/images/game/Monopoly/MONOPOLY_Card_mini.png");
}

.MonopolyCard{
	width:250px;
	height:382px;
	text-align: center;
	font-size: 15px;
	padding: 15px;
	color: #000;
	margin:8px;
	background: transparent;
	background-repeat: no-repeat;
	background-position: center center;
	-webkit-background-size: contain;
	-moz-background-size: contain;
	-o-background-size: contain;
	background-size: contain;
	background-image: url("/images/game/Monopoly/MONOPOLY_Card.png");
}

.MonopolyCardColor{
	background: #000;
	height:40px;
	width:100%;
	margin-bottom:10px;
	padding-top: 10px;
	text-align: center;
	font-size:18px;
}

.MonopolyPlayerObjects{
	margin-top:60px;
	height:488px;
	width:418px;
	padding:5px;
	overflow:auto;
	overflow-x:scroll;
}

.MonopolyPlayerCards{
	margin-top:60px;
	height:485px;
	width:415px;
	padding:5px;
	overflow:auto;
	overflow-x:scroll;
	display:none;
}

.MonopolyEventCard{
	margin: auto;
	width:350px;
	height:240px;
	text-align: center;
	padding: 20px;
	color: #000;
	margin-bottom:10px;
	background: transparent;
	background-repeat: no-repeat;
	-webkit-background-size: contain;
	-moz-background-size: contain;
	-o-background-size: contain;
	background-size: contain;
	background-position: center center;
	background-image: url("/images/game/Monopoly/MONOPOLY_EventCard.png");
}

.MonopolyHouse{
	position: absolute;
	width:25px;
	height:30px;
	background: transparent;
	background-repeat: no-repeat;
	-webkit-background-size: contain;
	-moz-background-size: contain;
	-o-background-size: contain;
	background-size: contain;
	background-position: center center;
	background-image: url("/images/game/Monopoly/House.png");
	display:none;
}

.MonopolyHotel{
	position: absolute;
	width:25px;
	height:30px;
	background: transparent;
	background-repeat: no-repeat;
	-webkit-background-size: contain;
	-moz-background-size: contain;
	-o-background-size: contain;
	background-size: contain;
	background-position: center center;
	background-image: url("/images/game/Monopoly/Hotel.png");
	display:none;
}

#MonopolyBuildings{
	position:absolute;
	top:0px;
	left:0px;
	right:0px;
	bottom:0px;
	overflow:hidden;
}

.notice{
	z-index:99 !important;
}

.MonopolyFieldImage{
	height:480px;
	width:600px;
	position:absolute;
	top:0px;
	left:400px;
	z-index:0;
	background: transparent;
	background-repeat: no-repeat;
	-webkit-background-size: contain;
	-moz-background-size: contain;
	-o-background-size: contain;
	background-size: contain;
	background-position: center bottom;
	overflow:hidden;
}

.MonopolyFieldList{
	width:24000px;
	height:480px;
	position:absolute;
	top:0px;
	left:0px;
}

.MonopolyFieldListItem{
	height:480px;
	width:600px;
	float:left;
	background: transparent;
	background-repeat: no-repeat;
	-webkit-background-size: contain;
	-moz-background-size: contain;
	-o-background-size: contain;
	background-size: contain;
	background-position: center bottom;
}

.MonopolyPlayerList{
	overflow:hidden;
	height: 100px;
	position: absolute;
	right:0px;
	left:0px;
	bottom:0px;
	color:#fff;
}

.MonopolyGameChat{
	width:356px;
	height:530px;
	float:right;
	padding:10px;
	background: rgba(10,10,10,0.5);
	overflow:auto;
}

/*   FMPLAYER    */
#TVPlayer{
	position: relative;
	width: 100%;
	height: 788px;
	margin-top: 0px;
	background: rgba(0,0,0,0.5);
}

#FMPlayer{
	right: 0px;
	left: 0px;
	bottom: 0px;
	top: 0px;
	overflow: hidden;
}

.FMPLAYER_Video{
	background-color: #000 !important;
	width: 100%;
	max-height: 100%;
	position: absolute;
	transform: translateY(-50%);
	top: 50%;
	right: 0px;
	left: 0px;
}

.FMPLAYER_MainPButton{
	cursor: pointer;
	font-size: 80px !important;
	transform: translateY(-50%);
	top: 50%;
	left: 50%;
	margin-left: -30px;
	z-index: 999;
	position: absolute;
	opacity: 0.8;
	color: #fff;
}

.FMPLAYER_Controls{
	z-index: 999;
	position: absolute;
	right: 0px;
	left: 0px;
	bottom: 0px;
	height: 45px;
	opacity: 0.8;
	padding-top:5px;
	padding-left:10px;
	padding-right:10px;
	background: rgba(0, 0, 0, 0.7);
	color: #fff;
	font-size: 20px;
}

.FMPLAYER_Controls > table{
	padding: 0px;
	width: 100%;
	margin: 0px !important;
	border: 0px !important;
}

.FMPLAYER_Con_PButton{
	width:25px;
	cursor:pointer;
	padding: 5px;
	padding-left: 10px;
	padding-right: 10px;
	border: 0px !important;
}

.FMPLAYER_Con_PButton > i:hover{
	color: #1BA1E2 !important;
}

.FMPLAYER_Con_Status{
	width:150px;
	color: #fff;
	padding: 5px;
	font-size: 16px;
	margin-left: 10px;
	border: 0px !important;
}

.FMPLAYER_Con_Seekbar{
	padding: 5px;
	padding-left: 10px;
	padding-right: 10px;
	border: 0px !important;
}

.FMPLAYER_Con_Seekbar > input{
	width:100%;
	height: 25px;
	cursor: pointer;
	margin-top: -5px;
}

.FMPLAYER_Con_Seekbar > .marker{
	height: 25px;
	cursor: pointer;
}


.FMPLAYER_Con_Menu{
	width:30px;
	cursor:pointer;
	padding: 5px;
	padding-left: 10px;
	padding-right: 10px;
	border: 0px !important;
}

.FMPLAYER_Con_Menu > i:hover{
	color: #1BA1E2 !important;
}

.FMPLAYER_Con_Mute{
	width:30px;
	cursor:pointer;
	padding: 5px;
	padding-left: 10px;
	padding-right: 10px;
	border: 0px !important;
}

.FMPLAYER_Con_Mute > i:hover{
	color: #1BA1E2 !important;
}

.FMPLAYER_Con_Volume{
	width:100px;
	padding: 5px;
	padding-left: 10px;
	padding-right: 10px;
	border: 0px !important;
}

.FMPLAYER_Volume{
	width:100%;
	height: 25px;
	cursor: pointer;
	margin-top: -5px;
}

.FMPLAYER_Volume > .marker{
	height: 30px;
	cursor: pointer;
}

.FMPLAYER_Con_Fullscreen{
	width:25px;
	cursor:pointer;
	padding: 5px;
	padding-left: 10px;
	padding-right: 10px;
	border: 0px !important;
}

.FMPLAYER_Con_Fullscreen > i:hover{
	color: #1BA1E2 !important;
}

.FMPLAYER_Seekbar{
	
}

.FMPLAYER_Titel{
	font-size: 20px;
	left: 50px;
	top: 100px;
	max-width: 95%;
	z-index: 999;
	position: absolute;
	padding: 10px;
	opacity: 0.8;
	background: rgba(0, 0, 0, 0.7);
	overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.FMPLAYER_Logo{
	position: absolute;
	top: 0px;
	left: 0px;
	width: 200px;
	height: 200px;
	overflow: hidden;
	z-index: 999;
}

.FMPLAYER_LogoVideo{
	position: relative; 
	width:100%; 
	height:100%; 
	object-fit:contain; 
	object-position:center;
}

.FMPLAYER_StreamInfo{
	position: absolute;
	bottom: 70px; 
	right: 0px; 
	height: 120px; 
	width: 80%; 
	display:none; 
	z-index:999;
	background-image: linear-gradient(to right, rgba(0,0,0,0), rgba(0, 127, 224, .45), rgba(0, 127, 224, .55), rgba(0, 127, 224, .65)); 
	backdrop-filter: blur(5px);
}

.FMPLAYER_StreamInfoLogo{
	position: absolute; 
	left:-80px; 
	top:-70px; 
	height:200px; 
	z-index:999;
}

.FMPLAYER_StreamTitle{
	height: 100px; 
	margin-left:215px; 
	padding-top: 50px; 
	overflow: hidden; 
	font-size: 50px;
	color: #fff;
}

/*   FMPLAYER    */

.marquee {
	max-width: 100vw; /* iOS braucht das */
	white-space: nowrap;
	overflow: hidden;
	/* hier evtl. noch font-size, color usw. */
}

.marquee span {
	display: inline-block;
	padding-left: 100%;
	animation: marquee 30s linear infinite;
}

/* Make it move */
@keyframes marquee {
	0%   { transform: translateX(0); }
	100% { transform: translateX(-100%); }
}

/*Chrome*/
@media screen and (-webkit-min-device-pixel-ratio:0) {
    input[type='range'] {
      overflow: hidden;
	  height: 25px;
      -webkit-appearance: none;
      background-color: #eeeeee;
    }
    
    input[type='range']::-webkit-slider-runnable-track {
      height: 25px;
      -webkit-appearance: none;
      color: #13bba4;
      margin-top: -1px;
    }
    
    input[type='range']::-webkit-slider-thumb {
      width: 15px;
      -webkit-appearance: none;
      height: 30px;
      cursor: ew-resize;
      background: #434343;
      box-shadow: -99999px 0 0 99999px #1BA1E2;
    }

}
/** FF*/
input[type="range"]::-moz-range-progress {
  background-color: #1BA1E2; 
}
input[type="range"]::-moz-range-track {  
  background-color: #eeeeee;
}
/* IE*/
input[type="range"]::-ms-fill-lower {
  background-color: #1BA1E2; 
}
input[type="range"]::-ms-fill-upper {  
  background-color: #eeeeee;
}
