@charset "CP850";
/* DEFINITIONS START */
/* VALUES */
/* COLORS */
/* farver - HER SKAL RENSES UUUDDDDDDDDDDDDDDD 
	colLCQPh
	tekstStor
	Skygger om firkant
	inkMenu
	da/fr  InkMenu
	menuLine
	*/
/* FONTS */
/* ANIMATION */
/* GRAFIC */
/* My gridsize */
/* Space top of page */
/* $grid WITH px-unit */
/* RESPONSIVE */
/*
		@media (min-width: $respXlimitL){
			
		} 
		
		@media (min-width: $respXlimitS+1px) and (max-width: $respXlimitM) {
			
		}	
		
		@media (max-width: $respXlimitS) {
			
		}
		
		@media (max-width: $respXlimitXS) {
			
		}
		
*/
/* FUNCTION */
/* end DEFINITIONS */
/* MIXINS */
/* end MIXINS */
/* @include($attrib:'attrib', $value:value, $duration:duration[$hoverTransitionTime*?])*/
/*

/* This is not used (a Microsoft compability thing)*/
/* FONT */
@font-face {
  font-family: "journal";
  src: local("journal"), url("../font/journal-webfont.eot"), url("../font/journal-webfont.eot?#iefix") format("embedded-opentype"), url("../font/journal-webfont.woff2") format("woff2"), url("../font/journal-webfont.woff") format("woff"), url("../font/journal.ttf") format("truetype"), url("../font/journal-webfont.svg#journalregular") format("svg");
  font-weight: normal;
  font-style: normal; }
@font-face {
  font-family: "Segoe UI";
  src: local("Segoe UI"), url("../font/SEGOEUI.TTF") format("truetype");
  src: local("Segoe UI"), url("../font/segoeui-webfont.eot?#iefix") format("embedded-opentype"), url("../font/segoeui-webfont.woff") format("woff"), url("../font/SEGOEUI.TTF") format("truetype"), url("../font/segoeui-webfont.svg#segoeuiRegular") format("svg");
  font-weight: normal;
  font-style: normal; }
@font-face {
  font-family: "Segoe Script";
  src: local("Segoe Script"), url("../font/segoesc-webfont.eot?#iefix") format("embedded-opentype"), url("../font/segoesc-webfont.woff") format("woff"), url("../font/SEGOESC.TTF") format("truetype"), url("../font/segoesc-webfont.svg#segoescRegular") format("svg");
  font-weight: normal;
  font-style: normal; }
@font-face {
  font-family: 'segoe ui symbol';
  src: local("segoe ui symbol"), url("../font/seguisym-webfont.eot?#iefix") format("embedded-opentype"), url("../font/seguisym-webfont.woff") format("woff"), url("../font/SEGUISYM.TTF") format("truetype"), url("../font/seguisym-webfont.svg#seguisymRegular") format("svg");
  font-weight: normal;
  font-style: normal; }
/* end FONT */
/* FUNCTION SKAL SLETTES NÅR SITET KØRER NOGENLUND, som p i #topbar!
/* Chrome, Safari, Opera */
@-webkit-keyframes bouge {
  from {
    background-color: rgba(241, 208, 120, 0.5);
    left: 0px; }

  to {
    background-color: rgba(75, 44, 53, 0.5);
    left: 10px; } }
/* Standard syntax */
@keyframes bouge {
  from {
    background-color: rgba(241, 208, 120, 0.5);
    left: 0px; }

  to {
    background-color: rgba(75, 44, 53, 0.5);
    left: 10px; } }
/* LAYOUT */
#middle h1, #middle h2 {
  margin-right: 54px; }
@media (max-width: 640px) {
  #middle #head {
    top: 81px;
    left: 0;
    right: auto; } }
#middle #head p {
  line-height: 150%; }
#middle span .niceFrame {
  border: solid 3px #af9733;
  box-shadow: inset 5px 5px 5px white, inset 0px 0px 24px rgba(255,255,255,1), 0px 0px 4px rgba(0, 0, 0, 0.5) }
#middle span img {
  position: absolute;
  padding: 0;
  margin: 0;
  max-width: 80px;
  height:auto;
}
  
#middle div table .row_header {
	font: italic 700 120% "Segoe UI";
    color: black;
    }
#middle span .stage_example {
  position: relative;	
  font-family:Times New Roman;
  font-size:0.9em;
  font-size:13px;
  top: -190px;
  right: 50px;
  width:300px;   
  /*transform: rotate(0deg);*/ 
  color:black;
  background-color:#e7dcb0;
  padding:10px;
  border: solid 3px #af9733;
  box-shadow: inset 5px 5px 5px rgba(255, 235, 124, 0.5), inset 0px 0px 24px rgba(255, 235, 124, 1), 0px 0px 4px rgba(255, 235, 124, 0.5);
  transform:scale(0.2);
  z-index: 3;
  transition-property: transform, right, top;
  transition-duration: 1.0s;
  transition-timing-function: ease-out;
  -webkit-transition-property: transform, right, top;
  -webkit-transition-duration: 1.0s;
  -webkit-transition-timing-function: ease-out;  
  }
#middle span .stage_example:hover {  
  	transform:scale(1);
  	transform:rotate(10deg);
  	right:70px;
  	//left: -107px;
  	top:20px;
  	-webkit-transform:scale(1);
  	-webkit-transform:rotate(10deg); 
  	z-index: 10 !important;
  	overflow-x: visible;	
  }
#middle td, #middle tr {
  padding:5px;
  }
#middle td {
  line-height:1.2;
  }   
#middle span #activity {
  left: 605px;
  top: 340px;
  height: 140px;
  transform: rotate(0deg); }
#middle span #repas {
  left: 690px;
  top: 140px;
  height: 180px;
  transform: rotate(0deg); }
#middle span #armleft {
  left: 684px;
  top: 401.4px;
  height: 100px; }
div#middle a {
	position: absolute;
	left:690px;
	top: 350px;
	font: normal normal 400 1.1em/1.0 "Segoe UI";
    color: rgba(255, 255, 127, 1); //#f9f7eb
    box-shadow: 0px 0px 15px rgba(0,0,0,0.3);
    background-color: rgba(0,0,0,0.3);
}

@-webkit-keyframes bouge {
  from {
    background-color: rgba(241, 208, 120, 0.5);
    left: 0px; }

  to {
    background-color: rgba(75, 44, 53, 0.5);
    left: 10px; } }
/* Standard syntax */
@keyframes bouge {
  from {
    background-color: rgba(241, 208, 120, 0.5);
    left: 0px; }

  to {
    background-color: rgba(75, 44, 53, 0.5);
    left: 10px; } }
#middle {
  width: 80%; }
 
  #middle #head {
    /* style */
    /* layout */
    overflow-y: scroll;
    height: 400px;
    overflow-x: hidden;
    width: 100%;
    top: 72px; }
   
    #middle #head p {
      line-height: 150%; }
      
  #middle div#head span {
    /* layout */
    position: absolute;
    top: 0px;
    left: 576px;
    padding: 0;
    margin: 0;
    width: 236px;
    height: 356px;
    max-width: 100%; }

/* Let's get this party started */
.scroll-pane::-webkit-scrollbar {
    width: 12px;
}
 
/* Track */
.scroll-pane::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3); 
    -webkit-border-radius: 10px;
    border-radius: 10px;
}
 
/* Handle */
.scroll-pane::-webkit-scrollbar-thumb {
    -webkit-border-radius: 10px;
    border-radius: 10px;
    background: rgba(224, 224, 224,0.8); 
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5); 
}
 div.crop{
	background-image: url('../images/bg_stages.jpg');
}