/*DELATE MARGIN TOP ON #mainNav only vor develope purpose */

html, body{
	height:100%;
	font-family: 'Roboto', sans-serif;
}

h1, h3{
	font-size:35px;
	color: rgba(55,55,55, 1) !important;
}

a, a:hover{
	color: rgba(55,55,55, 1);
}

.intro-heading{
	padding:5px;
}

h3{
	font-size:18px;
}

section{ padding-top:100px;
 	padding-bottom:100px;
}

.no-padding{
 	padding:0;
}

.spacer{
	height:150px;
}

.spacer-half{
	height:75px;
}


#mainNav{
	background-color:rgba(255,255,255,1);
	padding-top:30px; /*DELATE THIS AFTER DEVELOPMENT */
	top:75px;
}

.percent{
	padding:50px 0;
	text-align: center;
	background-color: rgba(0,0,0,.1)
}

.percent .number{
	display:block;
	font-size:4em;
}


#mainNav.navbar-shrink{
	background-color: white;
}

#mainNav .navbar-nav .nav-item .nav-link{
	color:black;
}

#mainNav .navbar-nav .nav-item .nav-link.active{
	color:white;
	background-color:rgba(55,55,55, 1);
	border-radius:5px;
}

@media (max-width:994px){
		

	#mainNav .navbar-nav {	
		margin:20px 0 10px 0;
	}

	#mainNav .navbar-nav .nav-item .nav-link.active, li.active .nav-link{
		padding: 10px !important;
		margin-left:0px;
	}
}

.social-icon{
	float:left;
	text-align:left;
	padding:0;
}



.top-line{
	z-index:20;
	width:100%;
	max-width:100%;
	position:fixed;
	background-color: rgba(55,55,55, 1);
	padding:12px 0;
	text-align: left;
	color:white;
	font-size:1.2em;
	height:auto;
	overflow:hidden;

}

.hover-title{
	background-color: rgba(55,55,55, 1) !important;
}

.top-line .container div{
	min-width:300px;
}

@media (min-width:500px){
		#mainNav{ top:50px;}

	.top-line{text-align:right;}
	.top-line .container div{
		display:inline;
		min-width:0;
	}
}

.social a{
	color:rgba(55,55,55, 1);;
	padding-right:10px;
}

.top-line  a{
	color:white;
}

#portfolio {
    background-color: rgba(55, 55, 55, 1) !important;
}

#portfolio .btn{
	color: rgba(55, 55, 55, 1) !important;
}

#portfolio .btn:hover, #portfolio .btn.active{
	background-color: rgba(55, 55, 55, 1) !important;
	color:white !important;
}

.top-line a:hover{
	color:black;
	text-decoration: none;
}

.top-line .fa{
	padding-right:5px;
}


@media (min-width:500px){
	.top-line .fa{
		padding-left:25px;
	}
}

#mainNav .navbar-nav .nav-item .nav-link:hover{
	color:rgba(55,55,55, 1);
}

#mainNav .navbar-nav .nav-item .nav-link.active:hover{
	color:white;
}

li.active .nav-link{
	background-color:rgba(55,55,55,1);
	border-radius: 5px;
	color:white !important;
}


@media (max-width:994px){
	li.active .nav-link{
		padding-left: 10px;
		margin-left:0px;
		display: block;
	}
}

#mainNav{
	position:fixed;
	height:90px;
}

.navbar-brand{
	position:absolute;
	top:-50px;

}
.navbar-brand img{
	height:175px;
}

.bg-lightblue{
	background-color: rgba(0, 0, 0, .02)
}

.btn-primary{
	background-color: rgba(55,55,55, 1);
	border:none;
}

#mainNav .navbar-toggler{
	background-color:rgba(55,55,55, 1);
}

.btn-primary:active, .btn-primary:focus, .btn-primary:hover{

	background-color: rgba(55,55,55, 1) !important;
}


.masthead-start, .masthead-referenz{
	max-height:calc(100% - 42px);
	overflow: hidden;
	background:none;
	background-color:rgba(55,55,55, 1);
}

.masthead-start video{
	margin-top:100px;
	width: 100%;
}

@media (min-width:398px){
	.masthead-start video{
	margin-top:260px;
}}

@media (min-width:500px){
	.masthead-start video{
	margin-top:220px;
}}

@media (min-width:737px){
	.masthead-start video{
	margin-top:120px;
}}

.masthead-start video img{
	max-width:100%;
	height:auto;
}

/* Domain */

#domain{
	margin:0;
	padding:0;
	background-color:rgba(55,55,55, 1);
}

#domain .intro-heading, #domain .intro-heading a, #domain .intro-heading a:hover{
	font-size:25px;
	font-weight:700;
	line-height:75px;
	font-family: 'Roboto', sans-serif;
	color:white;
	width:100%;
	text-align:center;
	text-decoration:none;
}



/* SELBSSTVERSTÄNDNIS */
.big-sentence{
	font-size:25px;
	color:#777777;
}


/* AUFGABENSCHWERPUNKTE */
#activities{
	background-color:rgba(204, 204, 204, 0.25);
}

#activities p{

	color:#777777;
}

.task-item{
	margin-bottom:20px;
}

.py-5{
	background-color: rgba(204, 204, 204, 0.25);
}


/* MITARBEITER*/
ul.social-buttons li a:active, ul.social-buttons li a:focus, ul.social-buttons li a:hover{
	background-color: rgba(59, 172, 228,1);
}

/*SERVICE*/
.service-item{
	margin-top:50px;
}

.service-item img{
	max-width:90%;
}

/* MEMBERSHIP*/
.membership .container{
	overflow:hidden;
}

.membership .row{

}

.single-membership{
	margin:10px 0;
}
.single-membership img{
	height:100px;
	width:auto;
}




/* SINGLE PROJECT PAGE*/
/* STATEMENT */

#statement .team-member, #statement .team-member p{
	margin-bottom:0;
}


/* SLIDER */
#slider{
}

.flexslider{
	border:0;
}



#slider img{
	height:400px;
	width:auto;
	margin:0 auto;
}


#slider .flex-nav-next a, #slider .flex-nav-prev a{
	height:50px;

}

/* FULLIMAGE */
.fullimg{
	background-size: cover;
	background-position: center center;
}

.fullimg a:hover{
	text-decoration: none;
}

.fullimg-text{
	background-color:rgba(55,55,55, .6);
	color:rgba(255, 255, 255, 1);
	height:100%;
	width:100%;
}

.fullimg-text:hover{
	background-color:rgba(255, 255, 255, .9);
	color:rgba(55,55,55, 1);
}

.fullimg-text div{
	padding:50px 0;
	font-size:1.2em;
	text-align: center;
}

@media (min-width:800px){
	.fullimg-text div{
		font-size:2em;
		padding:150px 0;
	}
}

.fullimg-text iframe{
	width:100%;
	height:100%;
}


/* BLOG */
.post{
	border-bottom:1px solid #3333;
	margin-bottom:50px;
	padding-bottom:25px;
}

.post .author{
	margin-bottom:25px;
}


@media (min-width:1000px){
.post .post-text{
	padding-left:520px;
}

.post .img{
	width:500px;
	float:left;
	margin-right:20px;
}

.img img{
	margin-top:8px;
	max-width:100%;
	height:auto;
}
}


/*CONTACT */
section#contact{
	background-image:none;
}

.textline{
	padding:20px;
}

.wpcf7-submit{
	background-color: white;
	
	font-size:18px;
	padding:20px 40px;
	font-family: 'Roboto', sans-serif;
	font-weight: 700;
	text-transform:uppercase;
	color:black;
	border:0;
	margin-top:25px;
	border-radius: .25rem;

}

.wpcf7-list-item, .wpcf7-list-item a{
	color:white;
}

.wpcf7-list-item a{
	text-decoration:underline;
}

.wpcf7-recaptcha > div{
	width:100% !important;
	margin-top:25px;
}

@media (max-width:767px){
	.contactform-first{
		margin-bottom:25px;
	}
}

.wpcf7-textarea{
	padding:20px;
	height:248px;

}

.wpcf7-validation-errors{
	background-color: #fed136;
	border-radius: 0.25rem;
}

.wpcf7-mail-sent-ng{
background-color: red;
color:white;
border-radius: .25em;
}

.wpcf7-spam-blocked{
	background-color: #fed136;
}



.wpcf7-mail-sent-ok{
	border-radius: 0.25rem;
	background-color: rgba(59, 172, 228, 1);
	border:1px solid transparent !important;
	color:white;

}

.wpcf7-not-valid-tip{
	margin-top:5px;
	color: #fed136 !important;
}


/* FOOTER */

footer #menu-footer{
	text-align:center;
	padding:0;
	margin-top:10px;
}

footer a{
	color:black;
}

@media (min-width:768px){
	footer #menu-footer{
	text-align:right;
	padding-left:40px;
	margin-top:0;
}
}

footer .menu-footer-container ul{
	text-align:right;
}
footer .menu-footer-container ul li{
	display:inline-block;
	padding-left:20px;
}



@media (max-width:767px){
	.hide-xs{
		display:none !important;
	}
	
	footer div{
		padding-bottom:20px;
		text-align:center;
	}
}


#domain .intro-heading, #domain .intro-heading a, #domain .intro-heading a:hover{
	font-size:40px;
}



	.hide-lg{
		display:none !important;
	}


@media (max-width:992px){
	.top-line{
		height:230px
	}

	.navbar-collapse{
		background-color: white !important;
		transition:all 1s;
		width:100%;
		margin-top:400px;
		padding:25px;

	}
	#mainNav.navbar-shrink{padding:0;}
	.navbar-toggler{
		position:absolute;
		top:28px;
		right:20px;

	}
}

@media (max-width:767px){
	.social-icon{
		display:none !important;
	}

	.navbar-collapse{
		margin-top:400px;
	}

	#mainNav{margin-top:80px}
}

@media (max-width:536px){
	

	.spacer{
	height:150px;
}
}

.navbar-brand img{
	background-color:white;
	border-radius:50%;
	border:6px solid white;
}