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

::selection {
	background-color: #f7a71f;
}

.text-dbrown::selection {
	background-color: #f7a71f;
}

.text-orange::selection {
	background-color: #734719;
}

h1::selection,
h2::selection,
h3::selection,
h4::selection {
	background-color: #734719;
}

body, html {
	/*overflow-x: hidden!important;*/
	margin: 0!important;
	padding: 0!important;
}

header {
	position: relative;
	background-color: #86cdd2;
	z-index: 95;
}

header .logo {
	background-image: url("../images/wts-tv-logo.svg");
    background-repeat: no-repeat;
    background-position: center; 
    background-size: 80% 80%;
	height: 400px;
}

header nav {
	background-color: #86cdd2;
	z-index: 95;
}

header .navbar-white a {
	font-family: 'Teko', sans-serif;
	font-size: 1.8rem;
	color: #fff;
	letter-spacing: 0.03em;
	-webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
	border: none;
}

header .navbar-white a:hover {
	color: #e8f5f7;
}

header .navbar-white .navbar-toggler-icon {
	background-image: url("data:image/svg+xml,%3csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3e%3cpath stroke='rgba(255, 255, 255, 1)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
	width: 25px;
	height: 25px;
}

header .nav-item {
	margin-left: 2.5rem;
	margin-right: 2.5rem;
	border: none;
	outline: none;
}

header .nav-link:active,
header .nav-link:hover,
header .nav-link:focus {
	border: none;
	outline: none;
}

header .navbar-brand {
	display: none;
	margin-left: 6%;
	animation: fadein 1s;
    -moz-animation: fadein 1s; /* Firefox */
    -webkit-animation: fadein 1s; /* Safari and Chrome */
    -o-animation: fadein 1s; /* Opera */
}

header .navbar-brand .logo-small {
	height: 100px;
}

.dropdown-menu {
	background-color: #86cdd2;
}

.dropdown-item:hover,
.dropdown-item:focus,
.dropdown-item:active {
	background-color: transparent;
	outline: none;
}

.dropdown-toggle {
	color: #fff;
	background-color: none;
 	border-color: none;
	outline: none;
}

.dropdown-toggle:active,
.dropdown-toggle:focus {
  	box-shadow: 0 0 0 0rem transparent;
	outline: none;
}

.dropdown-toggle::after {
	border-top: 0.2em solid;
	border-right: 0.2em solid transparent;
	border-left: 0.2em solid transparent;
}

#carousel-start {
	height: 370px;
	margin-bottom: 30px;
}

#carousel-start-content-wrapper {
	background-color: rgba(255,255,255,0.9);
	position: absolute;
	height: 100%;
	z-index: 9;
}

#carousel-start-content {
	position: relative;
	top: 50%;
	-webkit-transform: translateY(-60%);
  	-ms-transform: translateY(-60%);
  	transform: translateY(-60%);
}

#carousel-start-item-1 {
	background-image: url("../images/Header-2-Comcom.png");
}

#carousel-start-item-2 {
	background-image: url("../images/Header-5-Schindler.png");
}

#carousel-start-item-3 {
	background-image: url("../images/Header-7-Tempolimit.png");
}

#carousel-start-item-4 {
	background-image: url("../images/Header-8-Workday.jpg");
}

#carousel-start .carousel-item {
	background-repeat: no-repeat;
    background-position: center; 
    background-size: cover;
	height: 370px;
}

.mt-scrolldown {
	margin-top: 127px;
}

.text-dbrown {
	color: #734719;
}

.text-orange {
	color: #f7a71f;
}

.welcome-text {
	padding: 0;
}

.framed {
	border: 1px solid #393939;
}

.html5-title {
	text-shadow: 1px 1px 6px rgba(0,0,0,0.9);
}

p, a, li {
	font-family: 'Jura', sans-serif;
	font-size: 1em;
	color: #393939;
}

ul {
	padding-left: 20px;
}

content h1, h2, h3, h4 {
	font-family: 'Teko', sans-serif;
	color: #f7a71f;
	letter-spacing: 0.025em;
}

content a {
	color: #734719;
	-webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}

content a:hover,
#kontakt a:hover {
	color: #f7a71f;
	text-decoration: none;
}

#kontakt {
	padding-top: 40px;
	background-color: #e1f2f4;
	margin-bottom: -25px;
}

#kontakt p, 
#kontakt a {
	color: #734719;
}

.erecht {
	padding: 20px 0;
	background-color: #e1f2f4;
}

footer {
	background-color: #86cdd2;
}

footer p, 
footer a {
	font-family: 'Jura', sans-serif;
	color: #fff;
}

footer a {
	text-decoration: none;
	-webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}

footer a:hover {
	text-decoration: underline;
	color: #fff;
}

hr {
	border: 2px solid #e1f2f4;
	margin-top: 40px;
}

/* back to top */
#toTop{
	position: fixed;
	bottom: 30px;
	right: 30px;
	cursor: pointer;
	display: none;
	z-index: 1000;
}

.btn-top {
	color: #fff;
	background-color: #86cdd2;
	border-radius: 50%;
}

.btn-top:hover {
	color: #fff;
	-moz-transition: all 200ms linear;
  	-webkit-transition: all 200ms linear;
  	-o-transition: all 200ms linear;	
  	transition: all 200ms linear;
 	-moz-transform: scale(1.2, 1.2);
 	-webkit-transform: scale(1.2, 1.2);
 	-o-transform: scale(1.2, 1.2);
 	-ms-transform: scale(1.2, 1.2);
 	transform: scale(1.2, 1.2);
}

@keyframes fadein {
    from {
        opacity:0;
    }
    to {
        opacity:1;
    }
}
@-moz-keyframes fadein { /* Firefox */
    from {
        opacity:0;
    }
    to {
        opacity:1;
    }
}
@-webkit-keyframes fadein { /* Safari and Chrome */
    from {
        opacity:0;
    }
    to {
        opacity:1;
    }
}
@-o-keyframes fadein { /* Opera */
    from {
        opacity:0;
    }
    to {
        opacity: 1;
    }
}

@-webkit-keyframes fadein { /* Safari and Chrome */
    from {
        opacity:0;
    }
    to {
        opacity:1;
    }
}

@media (max-width: 320px) {
	.welcome-text {
		font-size: 0.75em;
	}
}

@media (max-width: 414px) {
	footer p, footer a {
		font-size: 0.9em;
	}
	.welcome-text .text-white {
		font-weight: 600;
	}
}

@media (min-width: 768px) and (max-width: 788px) {
	#carousel-start-content h1 {
		font-size: 1.8rem;
	}
}

@media (min-width: 789px) and (max-width: 888px) {
	#carousel-start-content h1 {
		font-size: 2rem;
	}
}

@media (min-width: 889px) and (max-width: 988px) {
	#carousel-start-content h1 {
		font-size: 2.2rem;
	}
}

@media (min-width: 992px) {
	header nav {
		min-height: 127px;
	}
	
	#head-content {
		margin-top: 57px;
	}
	
	.mb-lg-15 {
		margin-bottom: 150px !important;
	}
}

@media (min-width: 736px) and (max-width: 1300px) {
	header .fixed-top a {
		font-size: 1.7rem;
	}
	
	header .nav-item {
		margin-left: 1rem;
		margin-right: 1rem;
	}
}