body { z-index:1; font-family: Arial, sans-serif !important ; margin: 0; padding: 0; border: 0; min-width: 320px; color: #000; 
 -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
     -khtml-user-select: none; /* Konqueror HTML */
       -moz-user-select: none; /* Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
            user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome and Opera */

 scrollbar-3dlight-color: #7A7A7A; 
scrollbar-arrow-color: #1600DA;
scrollbar-base-color: #BDBDBD;
scrollbar-darkshadow-color: #4A4547;
scrollbar-face-color: #BDBDBD;
scrollbar-highlight-color: #BDBDBD;
scrollbar-shadow-color: #F2F2F2;								  
								  
}
 
 ::-webkit-scrollbar  { width: 14px; height: 14px; background: #E3E4F9; } 
 ::-webkit-scrollbar-button { height: 0; width: 0; background: transparent; } 
 ::-webkit-scrollbar-track { background-color: transparent; } 
 ::-webkit-scrollbar-track-piece  { background: #E3E4F9; } 
 ::-webkit-scrollbar-thumb:vertical, ::-webkit-scrollbar-thumb:horizontal { background-color: #B3B3B3; -webkit-border-radius: 8px; } 
 ::-webkit-scrollbar-thumb:vertical:hover, ::-webkit-scrollbar-thumb:horizontal:hover { background: #EFDA1D; }

body img
{border: 0px solid ; max-width: 100%;}


#main
{
    padding: 15%;
    padding-top: 50px;
    width: 70%;
	text-align:center;
/*	height:100%;
//	background-color:gray;*/
}

#dialog_box
{
	/*display:table;
	width:100%;*/
    min-height: 50px;
/*	background-color:black;/*#9292F3;*/
/*	position:relative;width:100%; float:left; */
    margin: auto;	
}

#background
{
}

.slide
{
	display:none;
}

.scene
{
	position:absolute;
	z-index:10;
}
.scene img
{
/*	display:none;*/
}

.hide
{
	z-index:0;
/*	display:none;*/
	visibility:hidden;
}

.flipped
{
	-moz-transform: scaleX(-1);
	-o-transform: scaleX(-1);
	-webkit-transform: scaleX(-1);
	transform: scaleX(-1);
	filter: FlipH;
	-ms-filter: "FlipH";	
}

.main
{height: 100%; width:100%; font-weight:bold; text-align:center; }

.main img
{ border:0px;}

.TITEL
{position:relative; vertical-align:center; min-height:50px; font-size:24px; float:left; width:100%;}

.containing_box
{
	position:relative;height:100%; width:100%; float:left; text-align:center;
}
.containing_box2
{
	position:absolute;height:100%; width:100%; bottom:0;
}

.obj_tooltip
{  
     background: #23618E;
    border-radius: 5%;
    -moz-border-radius: 5%;
    -webkit-border-radius: 5%;	 
}
.obj_title
{
    position: relative;
    float: left;
	width:70%;
	color: #A29815;
    font-weight: bold;
    text-align: center;	
}

.obj_description
{
	color: #FFFFFF;
    position: relative;
    float: left;
	padding:5px;
	width:100%;
	font-style:italic;
	text-align:center;
}

#black_back
{
	z-index:-10;
	//visibility:hidden;
}

.contain
{
	position:relative;width:100%; float:left;  

}
.contain img
{ 
	max-width: 100%;
	max-height:100%;
	border:0px;
	position: relative;
    float: left;
    top: 0px;
}

.BILD
{position:relative;height:100%; width:80%; height: 100vh ;float:left; text-align:center; }
.bild
{position:relative;max-width:100%; max-height:100%; top:0px;/* display:none;*/}

.bild2
{
	position:absolute; top:0; left:0;
}

.take_bild
{
	position:absolute;
}

.PFEIL
{position:relative;width:10%; float:left; }

.BACK
{position:relative; width:100%; float:left; font-size:16px;   }

#right_arrow,#left_arrow,#start_game,#continue
{
	cursor:pointer;
}

.stofftier
{
	width:100%;
	height:100%;
}

.animate
{
	transition: all 0.1s;
	-webkit-transition: all 0.1s;
}

.action-button
{
	cursor:pointer;	
	position: relative;
	float:left;
	padding: 10px 10px;
  margin: 0px 10px 10px 0px;
	border-radius: 10px;
	font-family: 'Pacifico', cursive;
	font-size: 20px;
	color: #FFF;
	text-decoration: none;
	width:100%;
}

#back_game
{
	position:relative;
	float:right;
	margin-right:25%;
}
#start_game
{
	position:relative;
	float:left;
	margin-left:25%;
}

#next_story
{
	position:relative;
	float:left;
	margin-left:25%;
}

#continue
{
    width: 20%;
    margin: auto;
}

.blue
{
	background-color: #3498DB;
	border-bottom: 5px solid #2980B9;
	text-shadow: 0px -2px #2980B9;
}

.red
{
	background-color: #E74C3C;
	border-bottom: 5px solid #BD3E31;
	text-shadow: 0px -2px #BD3E31;
}

.green
{
	background-color: #82BF56;
	border-bottom: 5px solid #669644;
	text-shadow: 0px -2px #669644;
}

.yellow
{
	background-color: #F2CF66;
	border-bottom: 5px solid #D1B358;
	text-shadow: 0px -2px #D1B358;
}

.action-button:active
{
	transform: translate(0px,5px);
  -webkit-transform: translate(0px,5px);
	border-bottom: 1px solid;
}

.table
{
	display:table;
	width:100%;
}
.m_auto_1
{
	display:table-cell;
	margin:auto;
	width:100%;
}
.m_auto_2
{
	display:table-cell;
	margin:auto;
	width:50%;
}

@media only screen and (max-width: 740px){	/*X Tablet*/

.BILD
	{height:100%; width:100%;}
	
}



@media only screen and (max-width: 480px){	/*X Mobile L-M-S*/

}


@media only screen and (min-width: 1200px){	/*X LAPTOP*/


}