/* ------------------------------------------------------------------------------------------------- Reset */
h1, h2, h3 {
  margin: 0;
  padding: 0;
}
p {
  padding: 0;
  margin: 0 0 10px 0;
}
/* ------------------------------------------------------------------------------------------------- Global */
body { 
  background-color: #000;
}
html, body {
  width: 100%;
  height: 100%;
  padding: 0;
  margin: 0;
}
.body a {
  color: #E97200;
  -webkit-transition: color .5s linear;
  -moz-transition: color .5s linear;
  -ms-transition: color .5s linear;
  -o-transition: color .5s linear;
  transition: color .5s linear;
}

/* ------------------------------------------------------------------------------------------------- Misc */
.messages, .krumo-root {
  text-align: left;
  position: relative;
  z-index: 10000;
}

/* ------------------------------------------------------------------------------------------------- Nodes */
.nodes {
  position: relative;
}

/* ------------------------------------------------------------------------------------------------- Sections */
#sections {
  width: 100%;
  height: 100%;
}
.section {
  min-height: 100%;
  width: 100%;
  
  /*
  background-repeat: no-repeat;
  background-position: 50% 0;
  background-size: cover;
  background-attachment: fixed;
  */
  
  overflow: hidden;
  position: relative;
}
  .section .backgrounds {
    position: fixed;
    width: 100%;
    min-height: 100%;
    overflow: hidden;
  }
  .section .backgrounds img {
    position: absolute;
    top: 0;
    left: 0;
    min-width: 100%;
    /*min-height: 100%;*/
    height: auto;
    
    /*
    z-index: 5;
    opacity: 0;
    -webkit-transition: opacity 5s linear;
    -moz-transition: opacity 5s linear;
    -ms-transition: opacity 5s linear;
    -o-transition: opacity 5s linear;
    transition: opacity 5s linear;
    */
  }
 /*.section .backgrounds img.selected {
    z-index: 4;
    opacity: 1;
    transition: none;
  }*/
  .section .content {
    margin-top: 200px;
    margin-bottom: 75px;
    
    position: relative;
    left: 0;
    /*
    position: fixed;
    left: 50%;
    margin-left: -50%;
    width: 100%;*/
  }
  .section .content.ready {
    -webkit-transition: min-height 2s ease;
    -moz-transition: min-height 2s ease;
    -ms-transition: min-height 2s ease;
    -o-transition: min-height 2s ease;
    transition: min-height 2s ease;
  }
  .section.first .content {
    /*
    margin-top: 500px;
    */
  }
    .section .content .sub-item {
      width: 100%;
      position: absolute;
      z-index: 10;
    }
      .section .content .sub-item .sub-content {
        width: 940px;
        margin: 0 auto;
      }
  .section .downloads {
    margin-top: 50px;
  }
    .section .downloads .field-label {
      font-size: 18px;
      margin-bottom: 20px;
    }
    .section .downloads img {
      display: none;
    }
    .section .downloads a {
      color: #fff;
      transition: all .5s;
      -moz-transition: all .5s;
      -webkit-transition: all .5s;
      -o-transition: all .5s;
    }
    .section .downloads a:hover {
      color: #E97200;
    }

/* ------------------------------------------------------------------------------------------------- Header */
#header {
  position: fixed;
  width: 100%;
  top: 10px;
  z-index: 10000;
}

#top-gradient {
  width: 100%;
  height: 170px;
  position: fixed;
  background-image: url('../images/top-gradient3.png');
  z-index: 9999;
  pointer-events:none;
}
#menu {
  margin-top: 5px;
}
  #menu a {
    margin-right: 25px;
  }
  #menu a:hover {
    color: #E97200;
  }
/*
#logo {
  position: absolute;
  z-index: -5;
  top: 200px;
  width: 100%;
}
  #logo a {
    width: 210px;
    margin: 0 auto;
    display: block;
  }
  
*/
#logo a {
  display: block;
  width: 70px;
  margin: 0 auto;
}
#logo .normal {
  display: none;
}
.page-sites #logo a {
  width: 210px;
  
}
.page-sites #logo .normal {
  display: block;
}
#logo img {
  width: 100%;
  image-rendering: optimizeQuality;
}

/* ------------------------------------------------------------------------------------------------- Logo/Sticker flip */
.flip-container {
  margin: 0 auto;
}
.flip-container,
.flipper-front,
.flipper-back {
  width: 210px;
  height: 210px;
}
.flipper-back {
  background-image: url('../images/NoerrebroBryghus_AOK_Nom2015_00.png');
  background-repeat: no-repeat;
  background-position: center center;
  background-size: 100% auto;
}

/* entire container, keeps perspective */
.flip-container {
  -webkit-perspective: 1000;
  -moz-perspective: 1000;
  -ms-perspective: 1000;
  -o-perspective: 1000;
	perspective: 1000;
	position: relative;
	top: 0;
}
	/* flip the pane when hovered */
	/*
	.flip-container.rotate .flipper {
		-webkit-transform: rotateY(180deg);
		-moz-transform: rotateY(180deg);
		-ms-transform: rotateY(180deg);
		-o-transform: rotateY(180deg);
		transform: rotateY(180deg);
	}
	*/
	.flip-container.rotate .flipper-front {
		-webkit-transform: rotateY(180deg);
		-moz-transform: rotateY(180deg);
		-ms-transform: rotateY(180deg);
		-o-transform: rotateY(180deg);
		transform: rotateY(180deg);
	}
	.flip-container.rotate .flipper-back {
		-webkit-transform: rotateY(0deg);
		-moz-transform: rotateY(0deg);
		-ms-transform: rotateY(0deg);
		-o-transform: rotateY(0deg);
		transform: rotateY(0deg);
	}

/* flip speed goes here */
.flipper {
	position: relative;
}

/* hide back of pane during swap */
.flipper-front, .flipper-back {
	-webkit-backface-visibility: hidden;
	-moz-backface-visibility: hidden;
	-ms-backface-visibility: hidden;
	-o-backface-visibility: hidden;
	backface-visibility: hidden;
	-ms-transform-style: preserve-3d;
	position: absolute;
	top: 0;
	left: 0;
	-webkit-transition: 0.6s;
  -moz-transition: 6s;
  -ms-transition: 0.6s;
  -o-transition: 0.6s;
	transition: 0.6s;
}

/* front pane, placed above back */
.flipper-front {
	z-index: 2;
	-webkit-transform: rotateY(0deg);
  -moz-transform: rotateY(0deg);
  -ms-transform: rotateY(0deg);
  -o-transform: rotateY(0deg);
	transform: rotateY(0deg);
}

/* back, initially hidden pane */
.flipper-back {
  -webkit-transform: rotateY(-180deg);
  -moz-transform: rotateY(-180deg);
  -ms-transform: rotateY(-180deg);
  -o-transform: rotateY(-180deg);
	transform: rotateY(-180deg);
}


  
/* ------------------------------------------------------------------------------------------------- Styles */
body.front {
  background-image: url('../images/default-background.jpg');
  background-position: 50% 0;
  background-size: cover;
}

/* ------------------------------------------------------------------------------------------------- Frontpage */
.view-id-sites {
  width: 800px;
  margin: 0 auto;
}

.view-id-sites .views-row {
  width: 360px;
  float: left;
  margin-top: 20px;
  padding-top: 20px;
  padding-bottom: 20px;
}
/* ------------------------------------------------------------------------------------------------- Footer */
#footer {
  position: fixed;
  left: 0;
  bottom: 0;
  width: 100%;
  z-index: 10000;
  font-family: 'a2_brewtypelight';
  font-size: 11px;
}
#footer a.site-link {
  position: absolute;
  right: 20px;
  bottom: 20px;
  text-align: right;
}
#footer a{
  display: block;
  background: url('../images/pointer-right.png') no-repeat top right;
  padding-top: 40px;
  -webkit-transition: all 0.5s;
  -moz-transition: all 0.5s;
  -o-transition: all 0.5s;
  transition: all 0.5s;
}
#footer .info a {
  background: none;
  padding-top: 0;
  margin-bottom: 10px;
}
#footer .info a.orange-link {
  margin-top: 10px;
  margin-bottom: 0;
}
#footer .info a.orange-link:hover {
  color: #fff;
}
#footer a:hover {
  opacity: 0.75;
}
#footer .info a:hover {
  opacity: 1;
  color: #E97200;
}
#footer a:hover .orange-link {
  color: #fff;
}
#footer .info {
  position: absolute;
  left: 20px;
  bottom: 20px;
  text-align: left;
  width: 200px;
}
#footer .info .left {
  width: 65px;
  float: left;
}
#footer .info p {
  margin: 0;
}
@media all and (max-width: 1320px) {
  #footer {
    display: none;
  }
}


div#DB-review-widget-wrapper-121 {
  margin: 40px auto 0;
  float: none;
}

/* ------------------------------------------------------------------------------------------------- Stiker */
/*
.aok-sticker {
  position: fixed;
  top: 20px;
  right: 10px;
  width: 276px;
  height: 276px;
  z-index: 9999;
}
.aok-sticker .sticker-part {
  position: absolute;
  width: 100%;
  height: 100%;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: 100% auto;
}
.aok-sticker .sticker-one {
  background-image: url('../images/NoerrebroBryghus_AOK_Nom2015_01.png');
  -webkit-transition: -webkit-transform 2s cubic-bezier(0.39, 0.58, 0.56, 1.19);
  -moz-transition: -moz-transform 2s cubic-bezier(0.39, 0.58, 0.56, 1.19);
  -ms-transition: -ms-transform 2s cubic-bezier(0.39, 0.58, 0.56, 1.19);
  -o-transition: -o-transform 2s cubic-bezier(0.39, 0.58, 0.56, 1.19);
  transition: transform 2s cubic-bezier(0.39, 0.58, 0.56, 1.19);
}
.aok-sticker .sticker-two {
  background-image: url('../images/NoerrebroBryghus_AOK_Nom2015_02.png');
  -webkit-transition: -webkit-transform 2.4s ease-in-out;
  -moz-transition: -moz-transform 2.4s ease-in-out;
  -ms-transition: -ms-transform 2.4s ease-in-out;
  -o-transition: -o-transform 2.4s ease-in-out;
  transition: transform 2.4s ease-in-out;
}
.aok-sticker .sticker-three {
  background-image: url('../images/NoerrebroBryghus_AOK_Nom2015_03.png');
}
.aok-sticker .sticker-four {
  background-image: url('../images/NoerrebroBryghus_AOK_Nom2015_04.png');
  -webkit-transition: -webkit-transform 2s cubic-bezier(0.45, 0.05, 0.55, 0.95);
  -moz-transition: -moz-transform 2s cubic-bezier(0.45, 0.05, 0.55, 0.95);
  -ms-transition: -ms-transform 2s cubic-bezier(0.45, 0.05, 0.55, 0.95);
  -o-transition: -o-transform 2s cubic-bezier(0.45, 0.05, 0.55, 0.95);
  transition: transform 2s cubic-bezier(0.45, 0.05, 0.55, 0.95);
}
*/
/*-------- Rotate */
/*
.aok-sticker.rotate .sticker-one {
  -webkit-transform: rotate(360deg);
  -moz-transform: rotate(360deg);
  -o-transform: rotate(360deg);
  transform: rotate(360deg);
}
.aok-sticker.rotate .sticker-two {
  -webkit-transform: rotate(-360deg);
  -moz-transform: rotate(-360deg);
  -o-transform: rotate(-360deg);
  transform: rotate(-360deg);
}
.aok-sticker.rotate .sticker-four {
  -webkit-transform: rotate(-360deg);
  -moz-transform: rotate(-360deg);
  -o-transform: rotate(-360deg);
  transform: rotate(-360deg);
}


@media all and (max-width: 1320px) {
  .aok-sticker {
    display: none;
  }
}
*/

.sticker {
  position: fixed;
  top: 30px;
  right: 30px;
  width: 180px;
  height: 180px;
  z-index: 9999; 
}
.sticker img {
  width: 100%;
  height: auto;
}

@media all and (max-width: 1320px) {
  .sticker {
    display: none;
  }
}