@font-face {
  font-family: 'Noto Sans';
  font-display: swap;
  src: url('/fonts/noto-sans-v9-latin-regular.eot'); /* IE9 Compat Modes */
  src: local('Noto Sans'), local('NotoSans'),
       url('/fonts/noto-sans-v9-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('/fonts/noto-sans-v9-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('/fonts/noto-sans-v9-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('/fonts/noto-sans-v9-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('/fonts/noto-sans-v9-latin-regular.svg#NotoSans') format('svg'); /* Legacy iOS */
    font-style: normal;
	font-weight: 400;
}

/*--------------------------------------------------
	01. General Settings
---------------------------------------------------*/		
	
	html,body{
		font-family: 'Noto Sans';
		font-size: 1rem;
		height:100%;
		width:100%;
		color: #3b3a39;
		background-color:#e51c23;
		-webkit-text-size-adjust: 100%;
		box-sizing: border-box;
		position:fixed;
		overflow-x: hidden;
	-webkit-font-smoothing:antialiased;
	-moz-font-smoothing:antialiased;
	-ms-font-smoothing:antialiased;
	-o-font-smoothing:antialiased;
	}
	
	body {
	  margin: 0;
	  padding: 0;
	}
	
	body.hidden {
		opacity:0;
	}
	p {
		#font-size: 120%;
		margin:0px;
		line-height: 1.6;
		font-weight: 400;
	}
	
	h1, h2, h3, h4, h5, h6 {
		display: inline-block;
		width: 100%;
		font-weight: 500;
		color:#3b3a39;
	}
	
	h1{
		font-size: 2.4rem;
		margin: 0;
	}
	/*------------------------------------------------------------------
	h1::before{
		position: absolute;
		content: "Fallstudie";
		margin-left: -5%;
		margin-top: -6%;
		color: #fff;
		font-weight: normal;
		z-index: 1;
		font-size: 0.8rem;
	}
	-------------------------------------------------------------------*/
	h2{
		font-size: 36px;
		line-height: 48px;
	}
	
	h3{
		font-size:30px;
		line-height: 40px;
		margin-left:-1px;
	}
	
	h4{
		font-size:24px;
		line-height: 36px;
		margin-left:-1px;	
	}
	
	h5{
		font-size:18px;
		line-height: 24px;
		margin-left:-1px;
	}
	
	h6{
		font-size:14px;
		line-height: 18px;
	}
	
	a { color:#3b3a39; }
	a:hover { text-decoration: none; color: #00b2e3; transition: 0.2s;}
	.lh-0 { line-height: 0.1;}
	.bg-b { position: relative; }
	.bg-b::before { 
		position: fixed;
		height: 100%;
		width: 100%;
		content: "BBRY";
		display: flex;
		align-items: center;
		justify-content: center;
		color: #fff;
		left: 0;
		top: 0;
		opacity: 0.1;
		font-weight: bold;
		overflow-x: hidden;
		line-height: auto;
		z-index: 1090;
		font-size: 3rem;
	}

.navbar,footer {
	  animation-delay: 0.5s;
  -moz-animation: fadein  0.25s; /* Firefox */
  -moz-animation-delay:0.5s;
  -webkit-animation: fadein  0.25s; /* Safari and Chrome */
  -webkit-animation-delay:0.5s;
  -o-animation: fadein  0.25s; /* Opera */  
  opacity: 0;
  animation-fill-mode: forwards;
}
.navbar { padding: 1.125rem 1rem;}
.navbar-brand { padding-top: 0;}
.text-more{ color: #7a7a86;}
.text-red{ color: #ff0000;}
.svg-white { position: absolute; bottom: 1.025rem;}
.logo { width: 60vw; height: auto; max-width: 420px;}

.scroll-downs {
  position: absolute;
  top: 65vh;
  right: 0;
  left: 0;
  margin: auto;  
  z-index: 1090;
  width :18px;
  height: 35px;
  animation-delay: 0.5s;
  -moz-animation: fadein  0.25s; /* Firefox */
  -moz-animation-delay:0.5s;
  -webkit-animation: fadein  0.25s; /* Safari and Chrome */
  -webkit-animation-delay:0.5s;
  -o-animation: fadein  0.25s; /* Opera */  
  opacity: 0;
  animation-fill-mode: forwards;
}
.mousey {
  width: 3px;
  padding: 10px 7px;
  height: 16px;
  border: 1px solid #7a7a86;
  border-radius: 25px;
  opacity: 0.75;
  box-sizing: content-box;
}
.scroller {
  width: 3px;
  height: 10px;
  border-radius: 25%;
  background-color: #7a7a86;
  animation-name: scroll;
  animation-duration: 1.2s;
  animation-timing-function: cubic-bezier(.15,.41,.69,.94);
  animation-iteration-count: infinite;
}
@keyframes scroll {
  0% { opacity: 0; }
  10% { transform: translateY(0); opacity: 1; }
  100% { transform: translateY(15px); opacity: 0;}
}
	
.over {
  height: 100%;
  width: 0;
  position: fixed;
  z-index: 1080;
  top: 0;
  left: 0;
  background-color: #080a1f;
  overflow-x: hidden;
  transition: 0.2s;
}

.over-content {
  position: relative;
  top: 0;
  width: 100%;
  text-align: center;
}

.over a {
  padding: 12px 0;
  text-decoration: none;
  font-size: 4.125vh;
  color: #ffffff;
  display: block;
  transition: 0.3s;
}


.over a:hover, .over a:focus, .over a.active {
  color: #7a7a86;
}

.over .closebtn {
  position: absolute;
  top: -15px;
  right: 14px;
  font-size: 3rem;
  z-index: 1090;
}

.openbtn { display: inline-block; float: right; margin: -8px 0 0 0; padding: 0; color: #fff; cursor:pointer }


	
.overlay {
    position: absolute;
	z-index: 1;
    left: 0px;
    top: 0px;
    right: 0px;
    bottom: 0px;
    opacity: 1;
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -ms-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
}
.overlay:before {
	position: absolute;
	z-index: 0;
	content:'';
	top: 0;
	left: calc(33.3333% - 1px);
	height: 100vh;
	width: 1px;
	background-color: rgba(255, 255, 255, 0.033);
}
.overlay:after {
	position: absolute;
	z-index: 0;
	content:'';
	top: 0;
	right: calc(33.3333% - 1px);
	height: 100vh;
	width: 1px;
	background-color: rgba(255, 255, 255, 0.033);
}
.blue { background: radial-gradient(circle, rgba(8, 10, 31, 0.65) 0%, #080a1f 85%); }
.black { background: radial-gradient(circle, rgba(0, 0, 0, 0.65) 0%, #000000 85%); }

.display-4 {
    font-size: 1.125rem;
	display:block;
	#color: rgb(233,72,50);
    font-weight: normal;
    line-height: 2.4;
}

.carousel-inner {
    height: 100vh;
}

    .carousel-item {
    height: 100%;
    max-height: 100vh;
    background: no-repeat center center scroll;
    background-size: cover;
    }
	

.carousel-indicators{
	position: absolute;
	width: 100px;
	height: 50px;
	bottom: 75vh;
	left: calc(50% - 50px);
	margin: 0;
	padding: 0;
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    transform: rotate(90deg);
  animation-delay: 0.5s;
  -moz-animation: fadein  0.25s; /* Firefox */
  -moz-animation-delay:0.5s;
  -webkit-animation: fadein  0.25s; /* Safari and Chrome */
  -webkit-animation-delay:0.5s;
  -o-animation: fadein  0.25s; /* Opera */  
  opacity: 0;
  animation-fill-mode: forwards;
}

.carousel-indicators li {
    box-sizing: content-box;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    width: 1px;
    height: 30px;
    margin-left: 1px;
    margin-right: 1px;
    text-indent: -999px;
    cursor: pointer;
    background-color: #7a7a86;
    background-clip: padding-box;
    border-left: 3px solid transparent;
    border-right: 3px solid transparent;
    opacity: 1;
    transition: opacity .6s ease;
}

.carousel-indicators li:hover { opacity: 0.5; }
.carousel-indicators li.active { background-color: #fff; }

.carousel-caption { z-index: 20;}
.carousel-caption > p { color: #fff;}

@media (max-width: 575px) {
h1{	font-size: 1rem;}
}

@media (max-width: 767px) {
.carousel-caption { left: 15px; right: 15px;}
.carousel-caption > p { font-size: 1rem; line-height: 1.5;}
h1{	font-size: 1.15rem;	}
}

@media (max-width: 992px) { 
h1{	font-size: 1.3rem;	}
.display-4 {font-size: 0.875rem;}

}


@media (min-width: 1200px) {
.carousel-caption { left: 25vw; right: 25vw;}
}


.carousel-control-next, .carousel-control-prev { 
	border-radius: 0.125rem;
	top: 64vh;
	height: 44px;
	width: 44px;
	background: transparent;
	color: #7a7a86;
  animation-delay: 0.5s;
  -moz-animation: fadein  0.25s; /* Firefox */
  -moz-animation-delay:0.5s;
  -webkit-animation: fadein  0.25s; /* Safari and Chrome */
  -webkit-animation-delay:0.5s;
  -o-animation: fadein  0.25s; /* Opera */  
  opacity: 0;
  animation-fill-mode: forwards;
}
.carousel-control-next { left: calc(50% + 0px); }
.carousel-control-prev { left: calc(50% - 45px); }

.navbar-toggler { border: none; }
.navbar-dark .navbar-toggler { color: #fff; }

.fadeinup {
    opacity: 1;
    transform: translate(0px, 0px);
}

.fadeinup {
    opacity: 0;
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -ms-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
        transition-delay: 0s;
    transform: translate(0px, 10px);
}
.carousel-caption {
  animation-delay: 0.5s;
  -moz-animation: fadein  0.25s; /* Firefox */
  -moz-animation-delay:0.5s;
  -webkit-animation: fadein  0.25s; /* Safari and Chrome */
  -webkit-animation-delay:0.5s;
  -o-animation: fadein  0.25s; /* Opera */  
  opacity: 0;
  animation-fill-mode: forwards;
}
@keyframes fadein {
  0% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}
.modal-body h6{ font-weight: bold;color:#3b3a39; margin-top: 10px; line-height: 1.6;}
.modal-body p {
    font-size: small;
	#color: rgb(233,72,50);
    font-weight: normal;
    margin-bottom: 12px;
	line-height: 1.5;
}