/*************************************************************************************************
 * Theme Name: Bueroformel
 * Theme URI: http://www.bueroformel.de/
 * Description: Responsive WordPress-Theme
 * Version: 1.2
 * Author: Juliane Krause
 * Author URI: http://www.krause-webkonzepte.de
 * Responsive WordPress Theme, Copyright (C) 2013 Juliane Krause (juliane@krause-webkonzepte.de)

 * Based on Bootstrap v3.0.0
/********************************************************************************/

/*********************************************************************
 * General Settings
*********************************************************************/

body {	
	font-family: 'Arimo', sans-serif;
	background: #f4f8fb;
	line-height: 1.6em;
	text-align: justify;
}

td {
	vertical-align: top;
	padding: 7px 0;
}

a {
  color: #428bca;
  text-decoration: none;
}

p {
	margin: 0 0 10px;
	text-align: justify;
}

a:hover,
a:focus {
  color: #2a6496;
  text-decoration: underline;
}

ul {
    margin-top: 0;
    margin-bottom: 10px;
    padding-left: 40px;
    padding-right: 40px;
}

/*********************************************************************
 * Main Elements  
*********************************************************************/
#wrapper {
	max-width: 1200px;
	margin: 5px auto;
}

#content {
	margin: 0 4.16666666667%; /*8.333333333333332%/2 = halbe Spaltenbreite*/
	padding: 1px 4.16666666667% 20px 4.16666666667%; /*8.333333333333332%/2 = halbe Spaltenbreite*/ 
}

main {
	background: url(images/papier.png);
	padding: 0 8.333333333333332%;
	overflow: hidden;
}

/*********************************************************************
 * Header  
*********************************************************************/
header {
	overflow: hidden;
}

.spiral img {
	width: 100%;
	height: auto;
}

.formel {
	background: url(images/papier.png);
	padding: 0px 0 20px 0;
	overflow: auto;
}

.bxslider {
	position: relative;
	z-index: 52;
}

.startseite {
	background: url(images/papier.png);
	text-align: center;
	padding: 0px 8.333333333333332% 20px 8.333333333333332%;
}

header h1 {
	margin-top: 0;
	position: relative;
	z-index: 52;
}

.maus {
	position: absolute;
	left: 56%;
	margin-top: 348px;
	z-index: 51;
}

.maus img {
	width: 500px;
	height: auto;
}
/*********************************************************************
 * Navigation  
*********************************************************************/
nav {
	background: url(images/weisser-hintergrund.png); /*#ecede4;*/
	padding: 15px 0;
	/* font-family: 'Gloria Hallelujah', cursive; */
	font-size: 120%;
}

.container { 
	padding: 0 20px; 
	width: auto;
	margin: 0 auto;
	}

ul.nav { text-align: center; }

.nav  > li {
	display: inline;
}


.navbar {
	border-radius: 0;
	margin: 0 0 4px 0;
	z-index: 50;
}

.nav > li > a { 
	padding: 0 7px; 
	display: inherit;
	}

.nav > li:hover, .current_page_item {
	background: url(images/highlighter.png) no-repeat;
	background-size: 100% 100%;
}

.nav > li > a:hover,
.nav > li > a:focus {
  text-decoration: none;
  background-color: transparent;
}

.start-nav a {
	color: #000000;
	font-weight: 600;	
}

/*.start-nav .navbar-nav > li {
	padding: 4px 0;
	margin: 0 -3px;
	float: none;
	clear: left;
	display: inline-block;
	*display: inline /*IE 7*/
	/**zoom:1; /*IE7*/
/*}*/

/* Nur Firefox */
@-moz-document url-prefix() {
    .container {
        padding: 0 5px;
    }
}

/*********************************************************************
 * Collapsed Navigation  
*********************************************************************/
.navbar-toggle {
display: none
}
.navbar-toggle .icon-bar {
 	background-color: #428bca;
}

.navbar-collapse {
	padding-right: 0;
	padding-left: 0;
}
.container > .navbar-header, .container > .navbar-collapse {
		margin-right: 0;
		margin-left: 0;
		}
		
.navbar-nav {	margin: 0; }

/*********************************************************************
 * Section
*********************************************************************/
section { overflow: hidden; }

.entry {
	padding-top: 15px;
	padding-left: 55px;
	padding-right: 55px;
	padding-bottom: 30px;
	margin-top: 4px;
	overflow: hidden;
}

.paper { background: url(images/weisser-hintergrund.png); /*#ecede4;*/ }

hr {
	height: 3px;
	width: 150%;
	margin-left: -56px;
	clear: left;
	background: #eeeeee;
}


/*********************************************************************
 * Section: Startseite
*********************************************************************/

#startseite h4 + p { 
	padding-left: 40px;
	padding-right: 40px;
	text-align: justify;
}

#preise h4 + p { 
	padding-left: 40px;
	padding-right: 40px; 
	text-align: justify;
}

/*********************************************************************
 * Section: Preise
*********************************************************************/

#preise h6, #preise h6 + p {
	position: relative;
 	min-height: 1px;
  	padding: 0 15px;
  	float: left;
}

#preise h6 {
  	width: 33.33333333333333%;
  	font-size: 1em;
	font-weight: bold;
}
#preise h6 + p	{
	width: 66.66666666666666%;
	border-left: 4px solid #eeeeee;
	padding: 27px 11px 21px 11px;
	margin-top: -21px;
	margin-bottom: -21px;
}

#preise h6 + p + p {
	float: none;
	clear: left;
	margin-left: 33.33333333333333%;
	padding: 21px 11px;
	margin-top: -21px;
	margin-bottom: -21px;
	border-left: 4px solid #eeeeee;		
}


/*********************************************************************
 * Section: Portrait
*********************************************************************/
/*.portrait {
	position: absolute;
	padding: 20px 0 0 20px;
}

.profiltext { padding: 10px 0 0 245px; }

.profiltext ul { padding-left: 17px; }*/

.profiltext img {
	float: left;
	margin: 15px 60px 45px 10px;
}


.vita p:nth-child(odd) {
	float: left;
	width: 20%;
	margin-bottom: 20px;
}

.vita p:nth-child(even) {
	float: left;
	width: 80%;
	margin-bottom: 20px;
}


/*********************************************************************
 * Section: Referenzen
*********************************************************************/

#referenz .entry {
	padding-bottom: 0;
}

#referenz p:nth-child(1) {
	width: 50%;
	float: left;
	padding-right: 20px;
}

#referenz p:nth-child(1) img {
	width: 50%;
	height: auto;
	padding-bottom: 20px;
}

#referenz p:nth-child(2), #referenz p:nth-child(2) ~ p {
	float: left;
	width: 50%;
	padding-right: 30px;
	border-left: 4px solid #eeeeee;
	padding: 15px 11px 20px 11px;
	margin-top: -21px;
	margin-bottom: -3px;
}

#referenz p:nth-child(2) ~ p:last-child {
	height: 110px;
} 
/*********************************************************************
 * Section: Kontakt
*********************************************************************/

#kontakt h6, #kontakt h6 + p {
	position: relative;
 	min-height: 1px;
  	padding-right: 15px;
  	padding-left: 15px;
  	float: left;
}

#kontakt h6 {
  	width: 33.33333333333333%;
  	font-size: 1em;
	font-weight: bold;
}
#kontakt h6 + p	{
	width: 66.66666666666666%;		
	border-left: 4px solid #eeeeee;
	padding: 27px 11px 36px 11px;
	margin-top: -21px;
	margin-bottom: -21px;
}


#kontakt h6 + p + p {
	float: none;
	clear: left;
	margin-left: 33.33333333333333%;
	padding: 21px 11px;
	margin-top: -21px;
	margin-bottom: -21px;
	border-left: 4px solid #eeeeee;
}		

/*********************************************************************
 * Footer
*********************************************************************/
footer {
	color: #f4f8fb;
	background: #333;
	padding: 0 4.16666666667% 30px 4.16666666667%;
	clear: left;
} 


.copyright {
	width: 33.33333333333333%;
	float: left;
	font-size: 80%;
	  
}

.footer-menu {
	font-size: 80%;
	float: right;
	overflow: auto;
}

.footer-menu ul {
	list-style-type: none;
	padding: 0;
	margin: 0;
} 

.footer-menu li {
	float: left;
	padding: 0 10px;
	border-right: 1px solid #FFF;
}

.footer-menu li:first-child {
	padding-left: 0;
}
.footer-menu li:last-child {
	border-right: 0;
}

.footer-menu a, .footer-menu a:hover, .footer-menu a:focus, footer .current-menu-item {
	color: #FFFFFF;
	background-image: none;
	text-decoration: none;
}


/*********************************************************************
 * WIDGETS
*********************************************************************/

#widgets {
	float: none;
	padding: 20px 0;
	overflow: auto;
}

#widgets ul {
	list-style-type: none;
	padding: 0;
	margin: 0;
}

#widgets li {
	float: left;
	width: 50%;
	padding: 0 6.166667% 0 0; 
}

#widgets li:last-child {
	padding: 0  0 0 6.166667%; 
}

#widgets h2 {
	font-weight: normal;
}

/*********************************************************************
 * Headings
*********************************************************************/

h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
  font-family: 'Arimo', sans-serif;
}

h1 {
  margin: 0.67em 0;
  font-size: 1.5em;
}

h2 {
  margin: 0.67em 0;
  font-size: 1em;
  font-weight: bold;
}

h4 {
	font-size: 1.2em;
}

/*********************************************************************
 * Allgemeine Klassen
*********************************************************************/

.profil-title {
  padding-top: 105px;
  padding-left: 319px;
  margin: .67em 0;
  font-size: 1.5em;

}

.profil-main {
  overflow: scroll;
  height: 250px;
  overflow-x: hidden;
}

.profil-out {
  margin-bottom: 13px;
  margin-top: 13px;
  float: left;
}

.profil-in-pic {
  width: 200px;
  float: left;
}

.profil-in-text {
  width: 500px;
  float: right;
}

.profil-in-text-berufserfahrung {

}

.profil-in-text-pic-qualifikationen {
  font-weight: bold;
  height: 35px;
}

.profil-in-text-qualifikationen {
  width: 500px;
  float: right;
}

@media (max-width: 1167px) {
   .profil-main {
    overflow: scroll;
    height: 250px;
    overflow-x: hidden;
  }
 
  .profil-out {
    margin-bottom: 10px;
    float: left;
    width: 100%;
  }

  .profil-in-pic {
    width: 100%;
    float: left;
  }

  .profil-in-text {
    width: 100%;
    float: right;
  }

  .profil-in-text-berufserfahrung {
    width: 100%;
    float: right;
  }

  .profil-in-text-pic-qualifikationen {
    height: 35px;
  }

  .profil-in-text-qualifikationen {
    width: 100%;
    float: right;
    padding-top: 0px;
  }

}
.profil_text img {
	float: left;
	text-align: center;
	margin-bottom: 20px;
	padding-top: 10px;
}

@media (max-width: 574px) {
	.profil-title {
		padding-top: 0px;
		padding-left: 0px;
	}
	 .profil_text img {
		float: none
	}
}

@media (max-width: 768px) {
	
	.profil-header {
                text-align: center;
        }
  .profil-main {
    overflow: scroll;
    height: 250px;
    overflow-x: hidden;
  }
 
  .profil-out {
    margin-bottom: 10px;
    float: left;
  }

  .profil-in-pic {
    width: 100%;
    float: left;
  }

  .profil-in-text {
    width: 100%;
    float: right;
  }
  .profil-in-text-berufserfahrung {
    width: 100%;
    float: right;
  }
  .profil-in-text-pic-qualifikationen {
    height: 35px;
  }

  .profil-in-text-qualifikationen {
    width: 100%;
    float: right;
    padding-top: 0px;
  }

}
.fett {
  font-weight: bold;
}

.zentriert {
	text-align: center;
}

.abstand-oben {
	margin-top: 30px;
}

.abstand-unten {
	margin-bottom: 60px;
}

.inline {
	display: inline;
}

.glory {
	font-family: 'Gloria Hallelujah', cursive;
}

.laufweite {
	letter-spacing: 0.15em;
	font-weight: 600;
}

.blue {
	color: #428bca;
}

.black {
	color: #000000;
}

.riesig {
	font-size: 3.5em;
}

.groesser {
	font-size: 1.5em;
	font-weight: normal;
}
/*********************************************************************
 * Media Queries
*********************************************************************/
@media print {
	.dontprint{
		display: none;
	}
}


@media only screen and (max-width: 1160px) {
	.nav-justified > li:last-child {
		display: inline-block;
		width: 100%;
	}  
}

@media only screen and (max-width: 1090px) {
	.maus {
		left: 50%;
		margin-top: 395px;
	}  
}

@media only screen and (max-width: 1032px) {
	.nav-justified > li:nth-child(5), .nav-justified > li:nth-child(5) ~ li {
		display: block;
		width: 49%;
		float: left;
	}  
}

@media only screen and (max-width: 992px) {
	.col-md-offset-4 { margin-left: 33.33333333333333%;	}
}

@media only screen and (max-width: 991px) {
	.col-md-4, .col-md-8 {
		float: left;
		display: block;
	}
	.col-md-4 { width: 33.33333333333333%; }
  	.col-md-8 { width: 66.66666666666666%; }
}

@media only screen and (max-width: 982px) {
	.col-md-offset-4 { margin-left: 29%;}
	.maus {
		left: 39%;
		margin-top: 438px;
	}
}

@media only screen and (max-width: 950px) {
	.nav-justified > li:nth-child(4), .nav-justified > li:nth-child(4) ~ li {
		display: block;
		width: 32%;
		float: left;
	}  
}

@media only screen and (max-width: 840px) {
	.col-md-offset-4 { margin-left: 26%; }
	
	.maus {
		left: 35%;
		margin-top: 473px;
	}
	.maus img {
		width: 450px;
		height: auto;
	}
	
	#referenz p:nth-child(1), #referenz p:nth-child(2), #referenz p:nth-child(2) ~ p {
		width: 100%;
		float: none;
		padding: 15px 0 5px 0;
		border: 0;
		margin-top: 0;
		margin-bottom: 0; 
	}
	
	#referenz p:nth-child(2) ~ p {
		padding: 3px 0;
	}
	
	#referenz p:nth-child(2) ~ p:last-child {
		height: auto;
		padding-bottom: 15px;
	} 
	#kontakt h6, #kontakt h6 + p {
	  	padding-right: 0;
	  	padding-left: 0;
	  	float: none;
	  	clear: left;
	  	width: 100%;
	  	border: 0;
	}
	
	#kontakt h6 + p, #kontakt h6 + p + p {
		padding: 0;
		margin-top: 0;
		margin-bottom: 0;
	}
	
	
	#kontakt h6 + p + p {
		margin-left: 0;
		border-left: 0;
	}		
}

@media only screen and (max-width: 780px) {
	#startseite h4 + p { padding-left: 0; }
}


@media only screen and (max-width: 768px) {
	.col-md-offset-4 {
		margin-left: 157px;
	}
	
	.maus {
		left: 32%;
		margin-top: 478px;
	}
	
	.nav-justified > li, .nav-justified > li:nth-child(1), .nav-justified > li:nth-child(1) ~ li  {
		display: block;
		width: 99%;
		float: none;
		clear: left;
	}  
	
	.profiltext img { float: none; text-align: center; margin-bottom: 20px;}
	
	.vita p:nth-child(odd), .vita p:nth-child(even) { clear: both; float: none;	width: 100%;}
	.vita p:nth-child(odd) { font-weight: 600; margin-bottom: 0;}
	#widgets li { float: none; clear: both; width: 100%;}
	
	.footer-menu, .copyright { clear: both; float: none; width: 100%;}
	
}

@media only screen and (max-width: 992px) {
	#content {
		margin: 0;
		padding-left: 0;
		padding-right: 0;
	}
	
	.navbar-collapse.in {
		overflow-y: hidden;
	}
	.entry ul {
		padding-left: 17px;
	}
	
	.nav > ul {
		text-align: center;
	}
	.nav > li {
		float: none;
		clear: left;
		display: block;
	}
}


@media only screen and (max-width: 700px) {
	
	#preise h6, #preise h6 + p {
	  	padding: 0;
	  	float: none;
	  	clear: left;
	  	width: 100%;
	  	border-left: 0;
		margin-top: 0;
		margin-bottom: 0;
	}
	
	#preise h6 { padding: 5px 0 10px 0; }
	
	#preise h6 + p + p {
		margin-left: 0;
		padding: 0;
		margin-top: 0;
		margin-bottom: 0;
		border-left: 0;		
	}
}

@media only screen and (max-width: 640px) {
	.col-md-offset-4 { margin-left: 19%;}
	
	.maus {	display: none;	}
	
	/*.portrait img {	width: 120px; }*/
}


@media only screen and (max-width: 632px) {
	.col-md-4, .col-md-8 {
		float: none;
		width: 100%;
	}
		
	#kontakt h6, #kontakt p {
	  	padding-right: 0px;
	  	padding-left: 0px;
	  	float: none;
	  	width: 100%;
	}
}


@media only screen and (max-width: 600px) {
	.col-md-offset-4 { margin-left: 144px;}
}

@media only screen and (max-width: 580px) {
	.col-md-offset-4 { margin-left: 17%;	}
}

@media only screen and (max-width: 480px) {
	.col-md-offset-4 { margin-left: 80px;	}
	
	/*.portrait { position: relative;	text-align: center; width: 100%;}
	.portrait img {	width: 200px; padding: 0; }
	.profiltext { padding: 0; }*/
	.profiltext img {width: 180px; height: auto;}
	
	#referenz p:nth-child(1) img { width: 100% }
}

@media only screen and (max-width: 460px) {
	.col-md-offset-4 { margin-left: 75px;	}
}

@media only screen and (max-width: 360px) {
	.col-md-offset-4 { margin-left: 35px;}
}

@media only screen and (max-width: 320px) {
	.col-md-offset-4 { margin-left: 31px;}
	.bxslider img {
		width: 170px;
		height: auto;
	}
	
	h1 {font-size: 1.2em; }
	h4 {font-size: 1em;}
	.groesser {
		font-size: 1em;
		font-weight: 600;
	}
	
	/*.portrait {padding-left: 0;}
	.portrait img {	width: 120px;}*/
	.profiltext img {width: 120px; height: auto;}
	.entry { padding: 15px 10px; line-height: 1.2em;}
}

@media screen and (min-width:0\0) {  
    /* IE9 and IE10 rule sets go here */
   .container {
   		/*padding-left: 13.3px;*/
   }
   .nav-justified > li {
   		display: block;
   		width: auto;
   		float: left;
   		padding: 0 6px;
   	}     	   		
   	.nav-justified > li:last-child {
   		padding-right: 0;
   		padding-left: 14px;
	} 
}

.printplugin {
	float: right;
	padding-right: 42px;
	padding-top: 13px;
}

@media (max-width: 1024px) {
	.printplugin{
	  display: none;
	}
}