@charset "UTF-8";
/* CSS Document */

html{
	font-size: 16px;
}
body {
  width: 100%;
  padding: 0;
  margin: 0;
  box-sizing: border-box;
  font-family: "Montserrat", sans-serif;
  font-size: 20px;
  color: #4d4d4d;
overflow-x: hidden;
}


.intro-text {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  margin: 50px auto 0px;
  font-size: 50px;
  width: 100%;
}

.intro-text-2 {
  padding: 0px 300px 30px 300px;
}
@keyframes slide-in {
  0% {
    -webkit-transform: translateX(-100%);
  }
  100% {
    -webkit-transform: translateX(0%);
  }
}

@-webkit-keyframes slide-in {
  0% {
    transform: translateX(-100%);
  }
  100% {
    transform: translateX(0%);
  }
}
.slider {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin: 50px auto 50px;
  max-width: 1450px;
}
.slide-bild{
	display: flex;
	flex-direction: column;
	width: 100%;
}
.slide {
  align-items: center;
  width: 100%;
  padding-top: 57%;
}
.slide-bild-1 {
  background-image: url("../images/Slide_Canada_Square.jpg");
  background-size: cover;
  background-repeat: no-repeat;
  /*width: 100%;
  padding-top: 57%;*/
}
.slide-bild-2 {
  background-image: url("../images/Slide_Canada_street.jpg");
  background-size: cover;
  background-repeat: no-repeat;
  /*width: 100%;
  padding-top: 57%;*/
}

.slide-bild-3 {
  background-image: url("../images/Slide-4.jpg");
  background-size: cover;
  background-repeat: no-repeat;
  /* width: 100%;
  padding-top: 57%; */
}
.slide-bild-4 {
  background-image: url("../images/Slide-CaterPillar.jpg");
  background-size: cover;
  background-repeat: no-repeat;
  /*width: 100%;
  padding-top: 57%;*/
}
.slide-bild-5 {
  background-image: url("../images/Slide_Mel_back.jpg");
  background-size: cover;
  background-repeat: no-repeat;
  /*width: 100%;
  padding-top: 57%;*/
}
.slide-bild-6 {
  background-image: url("../images/Slide_Canada_street.jpg");
  background-size: cover;
  background-repeat: no-repeat;
  /*width: 100%;
  padding-top: 57%;*/
}
.slider .slide-bild .slide-in {
  animation: slide-in 0.2s cubic-bezier(0.55, 0.085, 0.68, 0.53) both;
}
.dot {
  cursor: pointer;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  border: 1px solid #4d4d4d;
  display: inline-flex;
  justify-content: space-between;
  margin: 30px 5px 0 5px;
}
.active,
.dot:hover {
  background-color: #4d4d4d;
}

.team {
  margin: 4rem 0 2rem 0;
  width: 100%;
}

.team p {
  font-size: 20px;
  line-height: 1.6em;
  border-top: solid 1px #4d4d4d;
  width: 80%;
  margin: 0 auto;
  padding-top: 30px;
}
strong{
	font-weight: 950;
}


/*-------SECTION-2----------*/

#section-2 {
  display: flex;
  flex-direction: column;
  width: 80vw;
  margin:0 auto;
}
#section-2 p{
	font-size: 20px;
  line-height: 1.6em;
}
.lista li{
	padding-bottom: 0.8em;
}
.box-tjanster{
	display: flex;
	flex-direction: row;
	align-items: center;
	border-top: solid 1px #4d4d4d;
	border-bottom: solid 1px #4d4d4d;
	width:100%;
}

.icon-box{
	width: 60px;
	height:60px;;
	background-image:linear-gradient(to right, rgba(216, 217, 109, 81%), rgba(249, 249, 246, 55%));
	margin-bottom:0;
	padding-right:25px;
}

.icon-1{
	background-image:url("../images/Icon_NB.png");
	background-size:cover;
	background-repeat: no-repeat;
	height:100%;
}
.icon-2{
	background-image:url("../images/icon_recycling.png");
	background-size:cover;
	background-repeat: no-repeat;
	height:100%;
}
.icon-3{
	background-image:url("../images/Icon_3D-model.png");
	background-size:cover;	
	background-repeat: no-repeat;
	height:100%;
}
.icon-4{
	background-image:url("../images/Icon_doc.png");
	background-size:cover;
	background-repeat: no-repeat;
	height:100%;
}
h2{
	font-size: 32px;
	padding-left:25px;
}
  .lista li {
  font-size: 20px;
  line-height: 1.6em;
}

/*-------SECTION-3----------*/
#section-3{
	width: 80vw;
  	margin:0 auto;
	border-top: solid 1px #4d4d4d;
	padding-top:2rem;
	padding-bottom:2rem;
}
#section-3 h2{
	padding-left:0px;
}
#section-3 p{
	font-size: 20px;
  	line-height: 1.6em;
}
#section-3-flexbox{
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
	width:100%;
	
}
#print-bild-box{
	width:70%;
	
}
#print-bild{
	width:100%;
	padding-top:70%;
	background-image: url("../images/3d-utskrift-7.jpg");
	background-size: contain;
	background-repeat: no-repeat;
}
#print-text{
	width:30%;
}
#print-text p{
	font-size:18px;
	font-weight:200;
  	line-height: 1.4em;
}
/*---------------cta-----------------*/
#call-for-action{
	width: 80vw;
	margin:0 auto;
	border-top: solid 1px #4d4d4d;
	border-bottom:solid 1px #4d4d4d;;
	padding-top:2em;
	padding-bottom:2rem;
	margin-bottom:2rem;
}
#call-for-action h2{
	padding-left:0px;
}
#call-for-action p{
	font-size: 20px;
  line-height: 1.6em;
}

@media screen and (max-width: 1440px) {
  .slider {
    margin: 50px auto 50px;
    max-width: 1200px;
  }

  .slide-bild-1 {
    background-image: url("../images/Slide_Canada_Square_M.jpg");
  }
  .slide-bild-2 {
    background-image: url("../images/Slide_Canada_Street_M.jpg");
  }
  .slide-bild-3 {
    background-image: url("../images/Slide-4-M.jpg");
  }
  .slide-bild-4 {
    background-image: url("../images/Slide-CaterPillar_M.jpg");
  }
  .slide-bild-5 {
    background-image: url("../images/Slide_Mel_back_M.jpg");
  }
	 }
    .slide-bild-6 {
    background-image: url("../images/Slide_Canada_street_M.jpg");
  }



  @media screen and (max-width: 1366px) {
    .intro-text {
      font-size: 40px;
      width: 100%;
    }

    .intro-text-1 {
      border-top: solid 10px white;
      padding-top: 30px;
    }

    .intro-text-2 {
      border-bottom: solid 10px white;
      padding: 0px 235px 30px 235px;
    }
   
	  .team, #section-2, #section-3, #call-for-action{
		  width:85vw;
	  }
  }

  @media screen and (max-width: 1280px) {
    .intro-text {
      font-size: 30px;
      width: 100%;
    }
    .intro-text-2 {
      border-bottom: solid 10px white;
      padding: 0px 210px 30px 210px;
    }
    .slider {
      margin: 40px auto 40px;
      max-width: 1024px;
    }

    .slide-bild-1 {
      background-image: url("../images/Slide_Canada_Square_S.jpg");
    }
    .slide-bild-2 {
      background-image: url("../images/Slide_Canada_Street_S.jpg");
    }
    .slide-bild-3 {
      background-image: url("../images/Slide-4S.jpg");
    }
    .slide-bild-4 {
      background-image: url("../images/Slide-CaterPillar_S.jpg");
    }
    .slide-bild-5 {
      background-image: url("../images/Slide_Mel_back_S.jpg");
    }
	  .slide-bild-6 {
      background-image: url("../images/Slide_Canada_street_S.jpg");
    }
	
  }
  @media screen and (max-width: 1024px) {
    .intro-bild {
      background-image: url("../images/Sala-skyline-1M.jpg");
    }
    .intro-text {
      font-size: 30px;
      width: 100%;
    }
    .intro-text-1 {
      border-top: solid 5px white;
      padding-top: 10px;
    }

    .intro-text-2 {
      border-bottom: solid 5px white;
      padding: 0px 200px 10px 200px;
    }
    .team, #section-2, #section-3, #call-for-action {
      width:90vw;
    }
    .team p, #section-2 p, #section-3 p, .lista li, #call-for-action p {
      font-size: 18px;
    }
	  h2{
		  font-size:26px;
	  }
	  #section-3-flexbox{
		display: flex;
		flex-direction: column;
		width:100%;
		  padding-bottom: 1.2rem;
	
}
#print-bild-box{
	width:100%;
	
}
#print-bild{
	width:100%;
	padding-top:70%;

}
#print-text{
	width:100%;
}
#print-text p{
	font-size:16px;
	font-weight:200;	
}  
}

    @media screen and (max-width: 900px) {
		.intro-text {
        font-size: 30px;
        width: 100%;
      }
      .intro-text-1 {
        border-top: solid 5px white;
        padding-top: 10px;
      }

      .intro-text-2 {
        border-bottom: solid 5px white;
        padding: 0px 120px 10px 120px;
      }
      .team {
        margin: 30px 0 30px 0;
        width: 100%;
      }
		.team p, #section-2 p, #section-3 p{
			width: 95%;
		}

      .toggle .line-1 {
        transform: rotate(-45deg) translate(-10px, 4px);
      }

      .toggle .line-2 {
        opacity: 0;
      }
      .toggle .line-3 {
        transform: rotate(45deg) translate(-10px, -4px);
      }
	.team, #section-2, #section-3, #call-for-action {
     		 width:96vw;
    }
 	  .team p, #section-2 p, #section-3 p,
       .lista li, #call-for-action p{
        font-size: 16px;
        line-height: 1.7rem;
      }
		h2{
			font-size:22px;
		}
    .lista p,
	.lista li {
		width: 95%;
		}
   
    }
    @media screen and (max-width: 600px) {
      .intro-bild {
        background-image: url("../images/Sala-skyline-1S.jpg");
      }
    }

    @media screen and (max-width: 568px) {
      .intro-text {
        font-size: 24px;
        width: 100%;
      }
      .intro-text-1 {
        border-top: solid 5px white;
        padding-top: 10px;
      }

      .intro-text-2 {
        border-bottom: solid 5px white;
        padding: 0px 80px 10px 80px;
      }
      .team p, #section-2 p, #section-3 p,
       .lista li, #call-for-action p{
        font-size: 16px;
        line-height:  1.7rem;
      }

      .team {
        margin: 20px auto 20px;
      }
      .team p {
        border-top: 1px solid #4d4d4d;
        border-bottom: 1px solid #4d4d4d;
        padding: 10px 0 10px 0;
      }
    }
    @media screen and (max-width: 414px) {
    
    
    }

    @media screen and (max-width: 375px) {
   
  }