.bgImg{
  display:block;
  width:100%;
  background-size:cover;
  background-repeat: no-repeat;
  background-position: center center;
  position:fixed;
  top:0px;
  left:0px;
    filter: contrast(60%);
    transition:0.5s all;

}

.darkBg{
  display: block;
  position: absolute;;
  left:0px;
  top:0px;
  width:100%;
  background-color: rgba(0,0,0,0.1);
    transition:0.5s all;
}
.campains{
  display: block;
  width: 100%;
  text-align: center;
  margin-top: 250px;
  font-size: 40%;
  opacity:1;
  transition:0.5s all;
  transform:rotateY(0deg) rotateZ(0deg);
}

.campains.loading{
  opacity:0.02;
}

.campains.loading a{
  transform:rotateY(180deg) rotateZ(20deg);
}

.campains a{
  display:inline-block;
  width:100%;
  max-width: 260px;
  background:rgba(70,70,70,0.5);
  color:rgba(255,255,255,0.9);
  background:rgba(255,255,255,0.8);
  color:rgba(0,0,0,0.5);
  margin-left:10px;
  margin-right: 10px;

  padding: 20px;
  vertical-align: top;
transition:0.5s all;
  text-align: center;
  margin-bottom:15px;
  margin-top:15px;
}

.campains a:hover{
  background-color:rgba(100,199,219,0.9);
}


@media only screen and (max-width: 1100px) {
.campains{
  margin-top: 70px;
}
}

#startside .campains a{
  background:none;
  color: rgba(100,199,219,0.9);
  color:#FFF;
    border-bottom:2px solid rgba(100,199,219,0);
    text-shadow:0px 0px 5px rgba(0,0,0,0.4);
    padding:10px;
    font-size:130%;
}

#startside .campains a:hover{
  border-bottom:2px solid rgba(100,199,219,0.9);
  text-shadow:0px 0px 5px rgba(0,0,0,0.7);
}
.intro{
  display: block;
  width:100%;
  border: 1px solid rgba(0,0,0,0);
}
body,html{
	padding:00px;
	margin:0px;
	color:#FFF;
	text-align:center;
overflow-x: hidden;
}



a{
	text-decoration: none;
	outline:none;
}

div,span,select,a,textarea{
	box-sizing:border-box;
}

body,input,textarea,select{
 font-weight: 300; font-style: normal;
font-family: 'Roboto', sans-serif;
	font-size:19px;
	font-weight:300;
color:rgb(40,40,40);
}
.menu{
  background-color: rgba(100,100,100,0.8);
  padding: 10px;
  width: 100%;
  color:rgba(222,222,222,0.6);
  z-index:99999;
  width:100%;
  position: fixed;;
  top:0px;
  left:0px;
  font-size:95%;
}

.menu a{
  color:rgba(222,222,222,0.9);
  display: inline-block;;
  margin-left:10px;
  margin-right:10px;
  border-bottom:2px solid rgba(0,0,0,0);
}

.menu a:hover{
  color:rgba(222,222,222,0.9);
  border-bottom:2px solid rgba(255,255,255,0.6);
}

.home{
  display: block;
  top:60px;
  position: fixed;
  left: 15px;
  z-index: 9999999;
  color:rgba(255,255,255,0.8);
  text-shadow: 0px 0px 5px rgba(0,0,0,0.5);
}

.homeIcon{
  display: block;
  height: 50px;
  width:50px;
  margin-bottom: 12px;
}


.homeIcon>span{
  display: block;
  background-color: rgba(255,255,255,0.8);
  width:80%;
  height:5px;
  position: absolute;
  left: 0px;
  top:0px;
}

.homeIcon>span:nth-child(1){
  transform:rotate(45deg);
  top:35px;
}
.homeIcon>span:nth-child(2){
  transform:rotate(-45deg);
  top:10px;
}
.page{
  display:block;
  width:100%;
  overflow:auto;
  padding:20px;

}

.intro{
  display:block;
  z-index:9999;
}

.pageContent{
    z-index:999;
    display:block;
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    padding-top: 30px;
}

h1{
  margin:0px;
  margin-bottom: 30px;
  font-weight: 200;
  font-size: 300%;
  display:block;
  text-align: left;
  padding:30px;
  margin-top: 90px;
  color:rgba(60,60,60,0.8);
  text-shadow:0px 0px 8px rgba(255,255,255,0.8), 0px 0px 15px rgba(255,255,255,0.5);
  transition:0.5s all;
}

.intro:not(.campaigned) h1{
  margin-top:280px;
}

@media only screen and (min-height: 800px) {
h1{
  padding:80px;
  margin-top: 150px;
}
}

@media only screen and (min-width: 1100px) {

}


h1 span{
display:block;
font-size:40%;
  color:rgba(255,255,255,0.8);
  text-shadow:0px 0px 5px rgba(0,0,0,0.9), 0px 0px 8px rgba(0,0,0,0.5);
}

h1 span strong{
  display: block;
  font-weight:300;
  color:rgba(255,255,255,0.9);
  margin-bottom:5px;
}
@media only screen and (max-width: 800px) {
#startside h1{
  padding:30px;
  margin-top: 20px !important;
}

#startside .campains a{
  margin-bottom:6px;
  margin-top:6px;
  padding:14px;
}
}
.txt{
  display: block;
  padding:30px;
  background-color: rgba(200,200,200,0.9);
  box-shadow:0px 0px 13px rgba(0,0,0,0.5);
  color: rgb(40,40,40);
  width:100%;
  text-align: center;
}


.txtC{
  display: inline-block;
  padding: 40px;
  font-size: 120%;
  max-width: 670px;
  width: 100%;
  text-align: left;
}

.txtC h2{
  font-weight: normal;
  color: rgba(0,0,0,0.3);
  font-size: 170%;
  padding:0px;
  margin: 0px;
  margin-top: 60px;
}

.txtC .ingress{
  font-size: 130%;
  color: rgba(0,0,0,0.6);

}

.txtC a{
  color: #000;
  border-bottom:2px solid #666;
}

.txtC a:hover{
  border-bottom:2px solid #000;
}

@media only screen and (max-width: 1100px) {
.txtC{
  padding: 13px;
  font-size: 100%;
}

.txt{
  padding:20px;
}
}
.varegrupper>div{
  display:inline-block;
  width:300px;
  padding:10px;
  background:rgba(255,255,255,0.3);
  text-align: center;
  margin:6px;
  vertical-align:top;
  transition:0.4s all;
}

.varegrupper div a{
  color:rgba(0,0,0,0.6);
}

.varegrupper div a:hover{
  border-bottom:2px solid rgba(0,0,0,0.5);
}

.varegrupper>div>a{
  color:rgba(0,0,0,0.5);
  font-size: 150%;
}

.varegrupper>div:hover{
  background:rgba(255,255,255,0.5);
}

.txtC .vgToggler{
  text-decoration: none;
  border-bottom:0px;
  font-size: 120%;
}



.varegrupper ul{
display:none;
text-align: left;
}

.varegrupper li{
  margin-bottom: 4px;
  font-size: 90%;
}

.varegrupper div.open ul{
  display:block;
}
.suppliers{
  display:block;
  width:100%;
  padding:10px;
}

a.supplier{
  display: inline-block;
  width:100%;
  max-width:145px;
  height:100px;
  margin:15px;
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center center;
  border-bottom:0px;
  opacity:0.5;
  transition:0.4s all;
}

a.supplier:hover{
  opacity:0.8;
  border-bottom:0px;
}

.supplier.linn{
  background-image:url(gfx/linn.svg);
}

.supplier.viking{
  background-image:url(gfx/viking.svg);
}

.supplier.foss{
  background-image:url(gfx/foss.svg);
}
