/* DEFINITIONS START */
/* Values */
/*7f6e3f*/
/*5dfc22*/
/* mixins */
/* @include($attrib:'attrib', $value:value, $duration:duration[$hoverTransitionTime*?])*/
/*

/* ***************  DEFINITIONS END  **************************/
/* This is not used (a Microsoft compability thing)*/
@font-face {
  font-family: SCRIPTIN;
  src: local(SCRIPTIN), url("../font/scriptin-webfont.eot?#iefix") format("embedded-opentype"), url("../font/scriptin-webfont_.woff") format("woff"), url("../font/SCRIPTIN_.TTF") format("truetype"), url("../font/scriptin-webfont_.svg#scriptinRegular") format("svg");
  font-weight: normal;
  font-style: normal; }
/*
play with glyph: asc ORIG: 1638, Desc 410
try 819, 205
, no vertical METRICS = table = -178 -> 0
*/
@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; }
body {
  background-image: url("../images/portefolio_baggrund2.png");
  background-position: fixed;
  background-repeat: repeat;
  font-size: 100%; }

#page {
  box-shadow: 5px 5px 10px rgba(83, 143, 36, 0.1);
  background-color: rgba(155, 122, 244, 0.25); }

#header #topbar {
  background: -webkit-linear-gradient(-81deg, #44881c, #f1d078);
  background: -o-linear-gradient(-81deg, #44881c, #f1d078);
  background: -moz-linear-gradient(-81deg, #44881c, #f1d078);
  background: -ms-linear-gradient(-81deg, #44881c, #f1d078);
  background: linear-gradient(-81deg, #44881c, #f1d078);
  border-style: solid;
  border-width: 0 1px 1px 0;
  border-color: white rgba(0, 0, 0, 0.5) rgba(68, 136, 28, 0.5) white;
  /*@include gradient(-81, rgba(7f6e3f, 0.5), rgba(5dfc22, 0.5));*/
  box-shadow: 1px 1px 2px rgba(255, 255, 0, 0.5); }
  #header #topbar h1 {
    font: normal normal 900 6.25em/1 SCRIPTIN;
    text-decoration: none;
    display: block;
    color: black; }
  #header #topbar p {
    text-decoration: none;
    display: block;
    font: normal normal 500 0.55em /0.5 sans;
    color: black; }
#header #menu {
  /*@include gradient(99, rgba($darkGreen, 1), rgba($lightGreen, 1));*/
  background: -webkit-linear-gradient(-81deg, rgba(93, 252, 34, 0.5), rgba(127, 110, 63, 0.5));
  background: -o-linear-gradient(-81deg, rgba(93, 252, 34, 0.5), rgba(127, 110, 63, 0.5));
  background: -moz-linear-gradient(-81deg, rgba(93, 252, 34, 0.5), rgba(127, 110, 63, 0.5));
  background: -ms-linear-gradient(-81deg, rgba(93, 252, 34, 0.5), rgba(127, 110, 63, 0.5));
  background: linear-gradient(-81deg, rgba(93, 252, 34, 0.5), rgba(127, 110, 63, 0.5)); }
  #header #menu h2 {
    font: normal normal 900 1em /1 sans;
    text-decoration: none;
    display: block;
    color: black; }
  #header #menu p {
    text-decoration: none;
    display: block;
    font: normal normal 800 1.1em "Segoe Script";
    color: white; }

#middle #navigation {
  background: -webkit-linear-gradient(23deg, rgba(93, 250, 34, 0.5), rgba(128, 107, 64, 0.5));
  background: -o-linear-gradient(23deg, rgba(93, 250, 34, 0.5), rgba(128, 107, 64, 0.5));
  background: -moz-linear-gradient(23deg, rgba(93, 250, 34, 0.5), rgba(128, 107, 64, 0.5));
  background: -ms-linear-gradient(23deg, rgba(93, 250, 34, 0.5), rgba(128, 107, 64, 0.5));
  background: linear-gradient(23deg, rgba(93, 250, 34, 0.5), rgba(128, 107, 64, 0.5));
  		/*
  		.accordion-item-input:checked ~ .accordion-item-hd > .accordion-item-hd-cta {
  			-webkit-transform: rotate(0);
  			-ms-transform: rotate(0);
  			transform: rotate(0);
  		}
  
  		.accordion-item-hd-cta {
  			display: block;
  			width: 30px;
  			position: absolute;
  			top: calc(50% - 6px );
  			right: 0;
  			pointer-events: none;
  			-webkit-transition: -webkit-transform .3s ease;
  			transition: transform .3s ease;
  			-webkit-transform: rotate(-180deg);
  			-ms-transform: rotate(-180deg);
  			transform: rotate(-180deg);
  			text-align: center;
  			font-size: 12px;
  			line-height: 1;
  		}
  	*/ }
  #middle #navigation label.accordion-item-hd {
    font: normal normal 800 1em/1 SCRIPTIN;
    text-decoration: none;
    display: block;
    color: #094a09;
    letter-spacing: 0.15em;
    overflow: hidden; }
  #middle #navigation a {
    text-decoration: none;
    display: block;
    font: normal normal 500 0.6em/0.5 "Segoe UI";
    color: black;
    border-radius: 4px;
    cursor: pointer; }
    #middle #navigation a:hover, #middle #navigation a.a_clicked {
      color: #a4ea8f;
      -webkit-transition: color 0.08333s linear;
      -moz-transition: color 0.08333s linear;
      -ms-transition: color 0.08333s linear;
      -o-transition: color 0.08333s linear;
      transition: color 0.08333s linear;
      background-color: rgba(68, 136, 28, 0.5);
      -webkit-transition: background-color 0.25s linear;
      -moz-transition: background-color 0.25s linear;
      -ms-transition: background-color 0.25s linear;
      -o-transition: background-color 0.25s linear;
      transition: background-color 0.25s linear; }
    #middle #navigation a.a_auto {
      background-color: rgba(68, 136, 28, 0.2);
      -webkit-transition: background-color 0.25s linear;
      -moz-transition: background-color 0.25s linear;
      -ms-transition: background-color 0.25s linear;
      -o-transition: background-color 0.25s linear;
      transition: background-color 0.25s linear; }
  #middle #navigation .accordion > * + * {
    border-top: 1px solid #44881c; }
  #middle #navigation .accordion-item-input:checked ~ .accordion-item-bd {
    max-height: 1000px;
    padding-top: 3px;
    /*3 begge */
    margin-bottom: 0px; }
  #middle #navigation .accordion-item-input:checked ~ .accordion-item-bd {
    -webkit-transition: max-height 0.375s ease-in, margin 0.75s ease-in, padding 0.75s ease-in;
    transition: max-height 0.375s ease-in, margin 0.75s ease-in, padding 0.75s ease-in; }
  #middle #navigation .accordion-item-bd {
    max-height: 0;
    margin-bottom: 0;
    overflow: hidden;
    -webkit-transition: max-height 0.375s ease-out, margin-bottom 0.75s ease-out;
    /*, padding $imageTransitionTime ease-out;*/
    transition: max-height 0.375s ease-out, margin-bottom 0.75s ease-out;
    /*, padding $imageTransitionTime ease-out;*/ }
#middle #description {
  background-color: white;
  box-shadow: 5px 5px 10px rgba(83, 143, 36, 0.6);
  font: normal normal 400 0.85em/1.45 "Segoe UI"; 
    font-size: 1vmin;}
  #middle #description h4 {
    font: normal normal 700 1.3em/1.2 "Segoe UI";
    text-align: center;
    color: #307408; }
  #middle #description p {
    font: normal normal 300 0.95em/1.2 "Segoe UI";
    color: #3a7e12; }
#middle #picture h3 {
  color: black;
  background-color: #a4ea8f;
  font: normal normal 400 1em/1 "Segoe Script"; }
#middle #picture #bar ol li {
  background-color: #a4ea8f;
  cursor: pointer; }
  #middle #picture #bar ol li:hover {
    background-color: #e6e1f5; }
  #middle #picture #bar ol li.li_clicked {
    background-color: #44881c;
    -webkit-transition: background-color 0.25s linear;
    -moz-transition: background-color 0.25s linear;
    -ms-transition: background-color 0.25s linear;
    -o-transition: background-color 0.25s linear;
    transition: background-color 0.25s linear; }
#middle #picture #bar.passive {
  opacity: 0.5; }
#middle #screen {
  background: url("../images/pf_screen.png") repeat;
  z-index: 0;
  background-color: #e6e1f5;
  border: 4.5px outset #44881c; }

#footer p#question {
  background-color: blue;
  cursor: pointer;
  color: white;
  text-align: center;
  vertical-align: middle;
  font: normal normal 900 0.8em arial;
  opacity: 0.3; }
  #footer p#question:hover, #footer p#question.hover {
    opacity: 1;
    -webkit-transition: opacity 0.25s linear;
    -moz-transition: opacity 0.25s linear;
    -ms-transition: opacity 0.25s linear;
    -o-transition: opacity 0.25s linear;
    transition: opacity 0.25s linear; }
#footer p#magnifier, #footer p#off_magnifier {
  background-color: transparent;
  cursor: pointer;
  color: brown;
  text-align: center;
  vertical-align: middle;
  font: normal normal 900 0.8em 'segoe ui symbol'; }
#footer p#magnifier {
  opacity: 0.3; }
  #footer p#magnifier:hover {
    opacity: 1;
    -webkit-transition: opacity 0.25s linear;
    -moz-transition: opacity 0.25s linear;
    -ms-transition: opacity 0.25s linear;
    -o-transition: opacity 0.25s linear;
    transition: opacity 0.25s linear; }
  #footer p#magnifier.off {
    color: red;
    border-color: red;
    opacity: 1; }
#footer p#off_magnifier {
  opacity: 0;
  color: black;
  font-size: 1.2em; }
  #footer p#off_magnifier.off {
    opacity: 1;
    z-index: 1; }
#footer #linkedin {
  background-color: blue;
  cursor: pointer;
  color: white;
  text-align: center;
  text-decoration: none;
  vertical-align: baseline;
  font: normal normal 900 0.9em arial;
  opacity: 0.3; }
  #footer #linkedin:hover {
    opacity: 1;
    -webkit-transition: opacity 0.25s linear;
    -moz-transition: opacity 0.25s linear;
    -ms-transition: opacity 0.25s linear;
    -o-transition: opacity 0.25s linear;
    transition: opacity 0.25s linear; }
#footer p#help {
  background-color: #e6e1f5;
  color: black;
  text-align: left;
  vertical-align: middle;
  font: normal normal 500 0.8em/1.3 "Segoe UI";
  border: solid 0 rgba(0, 0, 0, 0.1);
  border-width: 0 1px 1px 0;
  box-shadow: 0 0 6px rgba(0, 0, 0, 0.3); }
#footer #hallo {
  background: -webkit-linear-gradient(39deg, rgba(105, 201, 44, 0.5), rgba(127, 108, 63, 0.5));
  background: -o-linear-gradient(39deg, rgba(105, 201, 44, 0.5), rgba(127, 108, 63, 0.5));
  background: -moz-linear-gradient(39deg, rgba(105, 201, 44, 0.5), rgba(127, 108, 63, 0.5));
  background: -ms-linear-gradient(39deg, rgba(105, 201, 44, 0.5), rgba(127, 108, 63, 0.5));
  background: linear-gradient(39deg, rgba(105, 201, 44, 0.5), rgba(127, 108, 63, 0.5));
  color: #062d06;
  text-align: left;
  font: normal normal 500 1em/1.5 "Segoe Script"; }
#footer div#profInfo {
  background: -webkit-linear-gradient(120deg, rgba(255, 255, 255, 0.9), rgba(235, 235, 235, 0.8));
  background: -o-linear-gradient(120deg, rgba(255, 255, 255, 0.9), rgba(235, 235, 235, 0.8));
  background: -moz-linear-gradient(120deg, rgba(255, 255, 255, 0.9), rgba(235, 235, 235, 0.8));
  background: -ms-linear-gradient(120deg, rgba(255, 255, 255, 0.9), rgba(235, 235, 235, 0.8));
  background: linear-gradient(120deg, rgba(255, 255, 255, 0.9), rgba(235, 235, 235, 0.8));
  color: #062d06;
  text-align: left;
  font: normal normal 500 1em/1 "Segoe UI" !important; }
#footer #personal_info {
  /*			@include gradient(120, rgba(255, 255, 255, 0.9), rgba(235, 235, 235, 0.8));*/
  color: #062d06;
  text-align: center;
  font: normal normal 600 1.15em/1.4 "Segoe UI"; }
#footer p#copyright {
  font: normal normal 300 0.95em/1 "Segoe UI";
  color: #3a7e12; }
