/*!
 * SonixTrip Reader default.css
 * http://sonixtrip.be
 *
 * Authors: Marc Thunissen
 * Copyright Oc&eacute;  Software Laboratories, 2014-2015
 */

    html,body
    {
      margin: 0;
      padding: 0;
      color: white;
    }

    #ViewPort
    {
      position :fixed;
      top : 0;
      left : 0;
      right : 0;
      bottom : 0;
      overflow : hidden;
      background-color: white;
      transition-delay : 0;
      transition-property : background-color;
      transition-duration : 0;
      transition-timing-function : linear;
    }

    #MainPicture,
    #SecondPicture
    {
      opacity : 0;
      position : absolute;
      top : 250px;
      left : 500px;
      z-index: 1000;
      transition-delay : 0;
      transition-property : top,left,width,height,opacity;
      transition-duration : 0;
      transition-timing-function : linear;
    }
    
    
    #Thumbnails
    {
      position :absolute;
      top : 40px;
      left : 10px;
      display: none;
    }
    
    #Traces,#Logs
    {
    	position: absolute;
    	top: 20px;
    	bottom: 20px;
    	left: 20px;
    	right: 20px;
    	overflow: scroll;
    	border: 1px solid black;
    	background-color: whitesmoke;
    	color: black;
      display: none;
    }
    
    #LeftShutter,
    #RightShutter,
    #TopShutter,
    #BottomShutter
    {
      position : absolute;
      background-color : #000040;
      z-index: 2000;
      transition-delay : 0;
      transition-property : top,left,width,height,background-color;
      transition-duration : 0;
      transition-timing-function : ease-in-out;
    }
    
    #LeftShutter
    {
      top: 0px;
      bottom: 0px;
      left: 0px;
      width: 1000px;
    }
    
    #RightShutter
    {
      top: 0px;
      bottom: 0px;
      right: 0px;
      width: 1000px;
    }

    #TopShutter
    {
      top: 0px;
      height: 1000px;
      left: 0px;
      right: 0px;
    }
    
    #BottomShutter
    {
      bottom: 0px;
      height: 1000px;
      left: 0px;
      right: 0px;
    }
    
    #IconBack,#IconNext,#IconPlay,#IconAuto,#IconPause,#IconEnd,#IconMenu
    {
      z-index: 2000;
      position: absolute;
      margin: -24px;
      right: 25px;
      bottom: 25px;
      cursor: pointer;
    }
    
    #IconPlay
    {
      right: 25px;
      bottom: 25px;
    }
    
    #IconPause
    {
      right: 25px;
      bottom: 25px;
    }
    
    #IconEnd
    {
      right: 25px;
      bottom: 25px;
    }
    
    #IconMenu
    {
      left: 25px;
      bottom: 25px;
    }
    
    #IconBack
    {
      top: 50%;
      left: 25px;
    }
    
    #IconNext
    {
      top: 50%;
      right: 25px;
    }
    
  	#EndOfStory
  	{
      z-index: 1900;
      position: absolute;
  		width: 100%;
  		text-align: center;
  		color: red;
  		font-size: 120px;
  		top: 50%;
  		margin-top: -60px;
  		opacity: 0;
  		transition-property: opacity;
  		transition-duration: 3s;
  		font-family: "Comic Sans MS","Tahoma";
  		text-shadow: 0 0 10px #FFFFFF;
  	}

		#TouchBoard
		{
			position: fixed;
			z-index: 5000;
			top: 0;
			bottom: 0;
			left: 0;
			right: 0;
			background-color: rgba(0,0,32,0.5);
		}
		
		#TouchThumbnails
		{
			position: absolute;
			top: 50%;
			bottom: 5%;
			left: 5%;
			right: 5%;
		}
		
		#TouchThumbnails img
		{
			width: 10%;
		}
		
		#IconTouchPlay,
		#IconTouchPause,
		#IconTouchDebug,
		#IconTouchLogs
		{
			position: absolute;
			top: 5%;
			left: 50%;
		}

		#IconTouchDebug
		{
			left: 8px;
		}
		
		#IconTouchLogs
		{
			left: 80px;
		}
		
		#IconTouchPlay
		{
			margin-left: 16px;
		}
		
		#IconTouchPause
		{
			margin-left: -80px;
		}
		
		#IconClose
		{
			position: fixed;
			z-index : 3000;
			top: 8px;
			right: 8px;
		}
		
		#DebugMsg
		{
			position: fixed;
			z-index: 9000;
			top: 0;
			right: 0;
			padding: 3px;
			color: red;
		}
		
		#Welcome
		{
			position: fixed;
			z-index: 8500;
			top: 0;
			bottom: 0;
			left: 0;
			right: 0;
			display: inline-block;
			vertical-align: middle;
			text-align: center;
			background-color: black;
		}
		
		#Welcome p
		{
			color: yellow;
			cursor: pointer;
		}