@import "animate.css";
@import "font-awesome.min.css";
@import "fonts.css";

body {
	color:#8c9398;
	font-family: 'Fira Sans', sans-serif;
	font-size:1.7em;
}
img {
	border:none;
}


#top {
	padding:2% 0;
}

.navbar-default {
	padding:0;
	margin:0;
	background:none;
	border:0px;
	z-index:30;
	top:5%;
}
.navbar-toggle {
	position:relative !important;
}

#bs-example-navbar-collapse-1 {
	padding:20px;
	border:none;
	width:100%;
}

.container-fluid {
	padding:0;
	margin:0;
}
.navbar-default .navbar-nav > li > a {
	color: #353535;
	font-family: 'Open Sans', sans-serif;
	font-size:1.2em;
	padding:20px 8px;
	text-transform:uppercase;
}

.navbar-default .navbar-nav > li > a:hover {
	color: #3b76cc;

}

.container-fluid > .navbar-collapse, .container-fluid > .navbar-header, .container > .navbar-collapse, .container > .navbar-header {
	margin-top:0px;
	margin-bottom:0;
}

h1, h2 {
	font-family: 'Cormorant', serif;
	font-weight:bold;
	color:#000000;
	text-align:center;
	padding:0 0 18px 0;
	margin-bottom:3%;
	background:url(../images/bg-headlines.png) center bottom no-repeat;
}

h4 {
	font-family: 'Cormorant', serif;
	font-weight:bold;
	color:#3b76cc;
	text-transform:uppercase;
	
	font-size:1.5em;
}


.blau {
	color:#467ecc;
	text-transform:uppercase;
	font-size:1.3em;
}

.schwarz {
	color:#000000;
}

#ueber {
	padding-bottom:3%;
}

.beratung-1 img {
	width:100%;
	height:auto;
	box-sizing:content-box;
}

.beratung-2 ul {
	float:left;
	list-style:none;
	margin:5% 0;
	padding:3 5%;
}

.beratung-2 ul li {
	padding-left:30px;
	background:url(../images/icon-list.png) left no-repeat;
	line-height:1.8;
}

#referenzen {
	text-align:center;
}

#referenzen h3 {
	text-transform:uppercase;
	color:#353535;
	font-weight:bold;
	padding-bottom:4%;
	background:url(../images/bg-h3.jpg) center bottom no-repeat;
}

#referenzen a {
	background:#467bc9 url(../images/mehr-erfahren.png) center center no-repeat;
	display:block;
		}
		
#referenzen a img {
	width:100%;
	height:auto;
		}
		
#referenzen a img:hover, #team a img:hover {
	opacity: 0.6;	
		}
		
.shortlink {
	padding:5%;
}

#team {
	background:url(../images/bg-team.jpg) center top no-repeat;
	background-size:cover;
	box-sizing: content-box;
	color:#FFFFFF;
	padding:35px 0;
}

#team h2 {
	color:#FFFFFF;
}

.teamlink img {
	background-clip: padding-box;
    border: 5px solid rgba(255, 255, 255, 0.3);
    border-radius: 50%;
	width:30%;
	height:auto;
	float:left;
	margin:8%;
}

.teamlink h3 {
	float:left;
	margin:8% 0 2%;
	width:50%
}

.teamlink h3 {
	float:left;
	margin:8% 0 2%;
	width:50%
}

.teamlink h3:after {
	clear:both;
}

.bg-h3-weiss {
	background:url(../images/bg-h3-weiss.jpg) left bottom no-repeat;
	padding-bottom:10px;
}

.teamlink a {
	background:url(../images/bg-team-link.png) left no-repeat;
	color:#ffffff;
	padding:5px 0 5px 30px;
	text-decoration:none;
}

.teamlink a:hover {
	background:url(../images/bg-team-link-hover.png) left no-repeat;
}

.content h4 {
	text-align:center;
	padding:20px 0;
	font-size:32px;
}

.content {
	margin-bottom:50px;
}

.content img {
	border:5px solid #dddddd;
}

.content ul {
	list-style:square;
}

.adresse {
	color:#467ecc;
	text-align:center;
	padding:1% 0;
}

/* Formular */

#contactfix {
	display:none;
}

.col-sm-2 {
	width:25%;
	float:left;
}

.col-sm-10 {
	width:65%;
	float:left;
}

#anfrageformular {
	padding-bottom:5%;
}

#kontakt {
	background:#f4f6f9;
	color:#8c9398;
}

.form-control {
	background:none;
	border-color:#8c9398;
	border-radius:0;
	font-family: 'Fira Sans', sans-serif;
	font-size:1em;
}

input.form-control {
	height:60px;
}

.control-label {
	font-family: 'Fira Sans', sans-serif;
	font-size:1em;
}

label.einwilligung {
	text-align:left !important;
}

.robotic {
	display: none;
}

.span100 {
	padding-top:3%;
	color:#467ecc;
}

div.box {
	text-align:center;
	padding:2%;
	background:#FFFFFF;
	font-size:1em;	
	border:#f4f6f9 10px solid;
}

div.box:last-child {
	margin-bottom:25px;
}

.fa {
	font-size:1.5em;
	color:#000000;
}


#anfrageformular {
	color:#646363;
	text-align:left;
	display:block;
	margin:0 auto;
}

.footer {
	background:#22242d;
	padding:25px 0 0;
}

.footer ul {
	list-style:none;
	margin:0;
}

.footer ul li {
	float:left;
	padding:0 5px;
	border-right:2px solid #ffffff;
}

.footer ul li:last-child {
	border-right:none;
	border-bottom:none;	
}

.footer ul li a{
	color:#FFFFFF;
	text-decoration:none;
}

.copy {
	float:right;
}

.copy a {
	text-decoration:none;
}

#m21, #m23 {
width:16px;
height:16px;
}

.glyphicon-menu-up {
	color:#ffffff;
}

.logo {
 	width:160px;
	height:auto;
	position:relative;
 }

 @media (max-width:767px) {
 
 .content, .footer, .copy, .footer ul{
 	text-align:center;
	width:100%;
	padding:20px 10px;
 }
 
.footer ul li {
 	text-align:center;
	width:100%;
	float:none;
	padding:0 5px;
	border-right:none;
	border-bottom:2px solid #393a40;
 }
 
 .logo {
 	width:75px;
	height:auto;
	position:absolute;
	left:5%;
 }

}
 @media (max-width:745px) {

}
 @media (max-width:725px) {

}

@media (max-width:380px) {
#anfrageformular label {
	font-size:0.7em;
}
}
/*Sonstige*/

.clear {
	clear:both;
	height:0;
}
.float {
	float:left;
}

/*Artikel-List Start*/

#articleList {
	width: 100%;
}

#articleList h1 {
	font-size: 18px;
	text-transform: normal;
}

#articleList .newsPagination a {
	display: block;
	float: left;
	width: 20px;
	height: 20px;
	line-height: 20px;
	text-align: center;
	margin-right: 10px;
	border: 1px solid gray;
}

#articleList .newsPagination a:hover {
	background: #cccccc;
}

#articleList .newsPagination a.active {
	background: black;
	color: white;
}

#articleList .newsArticle {
	width: 100%;
}

#articleList p.artDate {
	font-style: italic;
	float: left;
}

#articleList p.artAuthor {
	float: right;
}

#articleList .artImage {
	float: left;
	margin-right: 30px;
}

#articleList .artImage img {
	display: block;
}

#articleList p.linkMore {
	clear: both:
}

#articleList p.linkOverview {
	padding: 10px 0;
	margin-top: 20px;
	border-top: 1px solid #cccccc;
	border-bottom: 1px solid #cccccc;
}
