/* ======================================================================================================
    ====================================================================================================
    = Stylesheet
    = Datei: wq-style.css
    = Datum  27/05/2016
    = Autor: wquadrat Medien GmbH
    = Workaround für die falsche Reihenfolge der Styles in The7
    = Version 1.0
    ====================================================================================================
   ====================================================================================================== */
 
 


/* ======================================================================================================
   Hauptstyles
   ====================================================================================================== */


/*
*************************************************
Allgemein
*************************************************
*/
body {
	hyphens: auto;
	-ms-hyphens: auto;
    -webkit-hyphens: auto;
}
   
h2{
	color:#20baef;
}
h4{
	color:#F29400;
}
a{
	text-decoration:none;
}
 a:hover{
	 text-decoration:underline;
 }
.small-h3 h3 {
text-transform:none;
}

/* Header */
.branding > a:hover {
	padding-left:0px;	
}

/* Main Navi */
.main-nav > li.mobile{
	display:none;
}
.main-nav > li > a:before{
	content:"";
	position:relative;
	left:auto;
}
.content > .vc_row{
	padding-bottom:80px;
}
.page-id-27 .content > .vc_row{
	padding-bottom:40px;
}
.stripe-style-1 {
	padding-top:60px!important;
	padding-bottom:20px!important;
	margin-bottom:80px!important;
}
/* Footer */
.footer #nav_menu-2 a, 
.footer #nav_menu-2 a:hover, 
.footer #nav_menu-3 a, 
.footer #nav_menu-3 a:hover{
	padding-left:10px;
}
.footer #nav_menu-2 a:before, .footer #nav_menu-2 a:hover:before, .footer #nav_menu-3 a:before, .footer #nav_menu-3 a:hover:before{
	content:"\203A";
	position:absolute;
}
.footer .textwidget a:before,
.footer .textwidget a:hover,
.footer .widget_nav_menu a:hover{
	color:#fff;
}
.footer a::before, 
.footer a:hover::before {
	left: 0;
}
.footer .menu .current-menu-item > a{
color:#fff;
text-decoration:underline;
}
#nav_menu-2 li, #nav_menu-3 li{
	border-width:0px;
	margin-top:0px;
}
.footer .widget-title {
	text-transform:uppercase;
}
.footer #nav_menu-3 .menu-service2-footer-container{
	margin-top:40px;
}
.wp_user_stylesheet_switcher > a:after{
	content:"Farbkontrast";
	padding-left:10px;
	padding-top: 3px;
	position:absolute;
}
.wp_user_stylesheet_switcher > a:hover:after{
	color:#fff;
}
#bottom-bar a:before{
	content:"";
	position:relative;
	left:auto;
}
.a-size-1{
	font-size:24px;
	font-weight:600;
}
.a-size-2{
	font-size:smaller;
}

#text-4 a{
	padding-left: 0px;
	vertical-align:middle;	
}
#text-4 br {
	display: none;
}
#text-4 p:last-child{
	margin-top:10px;
}
/*Glossar*/
a.glossaryLink {
	color:#E5004F;
}
.cminds_poweredby {
	display:none !important;
}
/* Fixed Sidebar */
#fixed-sidebar{
	position:fixed;
	top:0;
	right:0;
	padding: 200px 50px 0px 20px;
	width:132px;
}

#fixed-sidebar h4{
	color:#ffffff;
	font-size:15px;
	font-weight:400;
	text-align:center;
}

#fixed-sidebar .big-link,
.big-link {
    bottom: 0;
    display: block;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 5;
}
.audience-1-side,
.audience-2-side,
.audience-3-side{
	padding:31px 5px;
	margin-bottom: 10px;
	position:relative;
}
.audience-1-side{
	background-color: #95c11a;
}
.audience-2-side{
	background-color: #20baef;
}
.audience-3-side{
	background-color: #e5004f;
}

/*
*************************************************
Elements
*************************************************
*/ 

/* Slogan */
.slogan h2,
.home .slogan h1{
	color:#20baef;
	font-size:80px;
	font-weight:600;
	line-height:91px;
	text-transform:uppercase;
}
.slogan h3,
.home .slogan h2{
	color: #95c11a;
	font-size:30px;
	font-weight:600;
	line-height:42px;
	text-transform:none;
}
.slogan-2 h3{
	color:#20baef;
	font-size:52px;
	line-height:62px;
	text-transform:none;	
}
/*Aufzählungspunkte*/

.zbsh-count h4{
text-transform:none;
color:#20BAEF;
font-size:28px;
line-height:30px ;
}
/*Row ohne Abstände*/
.content > .vc_row.no-space{
	padding-bottom:0px;
}
/*
*************************************************
Seitenbezogen
*************************************************
*/ 

/*************** Home ****************/
/* Haeder */
.home header.fancy-header{
	border-bottom: 2px solid #95c11a;
}

/*Kacheln*/
.audience-1, .audience-1 h2,
.audience-2, .audience-2 h2,
.audience-3, .audience-3 h2{
	color:#ffffff;
	text-align:center;
}
.audience-1{
	padding-right:5%;
}
.audience-1 .vc_column-inner,
.audience-2 .vc_column-inner,
.audience-3 .vc_column-inner{
	padding:10px 20px 0 20px;
}
.audience-1 .vc_column-inner{
	background-color:#95c11a;
}
.audience-2{
	padding-left:2.5%;
	padding-right:2.5%;
}
.audience-2 .vc_column-inner{
	background-color:#20baef;
}
.audience-3{
	padding-left:5%;
}
.audience-3 .vc_column-inner{
	background-color:#e5004f;
}

.tiles .wpb_wrapper{
	background-color:#20baef;
	color:#fff;
	margin-bottom:30px;
	padding: 5px;
}
.audience-1 .wpb_content_element,
.audience-2 .wpb_content_element,
.audience-3 .wpb_content_element,
.tiles .wpb_content_element{
	margin-bottom:20px;
}
.tiles .wpb_wrapper h3{
	color:#fff;
	line-height:24px;
	text-transform:none;
}

#content .materials .wpb_text_column h2:last-child{
	margin-bottom: 65px;
}
/* Aktuelles */
.home .vc_gitem-post-data-source-post_title h3{
	font-size:16px;
	line-height: 21px;
}
.home .vc_gitem-post-data-source-post_excerpt p{
	line-height: 21px;
}
/* Materialien */
.box-margin div{
	margin-bottom:20px;
}

/**********Unterrichtsmaterialen***************/

.vc_tta-title-text{
color:#20BAEF;
font-size:18px;
line-height:24px;
}
.vc_tta-controls-icon.vc_tta-controls-icon-plus::before, .vc_tta-controls-icon.vc_tta-controls-icon-plus::after{
border-color:#95C11A !important;
}
.zbsh-content-box li, .zbsh-content-box h3 {
color:#fff
}
/*********Kontakt*********/

.shortcode-action-box.plain-bg{
	background-color:#fff;
	border: 2px solid #E5004F;
	color:#686868;
}
.shortcode-action-box.plain-bg h2 {
	color:#E5004F;
	margin-bottom:20px;
}
.shortcode-action-box.plain-bg a{
	color:#E5004F;
}
.shortcode-action-box.plain-bg p{
	font-size:20px;
	line-height:25px;
}
/**************Aktuelles*****************/
.entry-meta{
display:none;
}
.entry-title a{
	color:#20BAEF;
}
.fancy-posts-title:after {
	content:"Neuste Meldungen";
	position:relative;
}
.fancy-posts-title .dt-fancy-title{
	display:none;
}
article.post-format-standard a{
	color:#20BAEF;
	text-transform: uppercase;
    font-size: 20px;
}
.paginator  a.nav-next:after,
.paginator  a.nav-next,
.paginator  a.nav-prev:after,
.paginator  a.nav-prev {
    background-color: transparent;
}

/***************Forum**********************/
.button:hover{
	background:#20BAEF !important;
}
.page-id-216  legend, .page-id-229 legend{
	color:#20BAEF !important;
	margin-bottom:20px !important;
}
div.bbp-template-notice.info {
    border: none !important;
    background-color: #20BAEF !important;
    padding: 3px !important;
}
div.bbp-template-notice, div.indicator-hint{
	border: none !important;
    background-color: #95C11A !important;
    padding: 3px !important;
}

/***************Unterstützung**********************/
	.page-id-143 .partner-helfer-acc h3 {
		min-height: 128px;
	}

/* ======================================================================================================
   Media queries für ein zugängliches Design
   Diese folgen nach dem primären Style, somit können diese erfolgreich Überschreiben.
   ====================================================================================================== */

 
@media all and (orientation:portrait) {
  /* Hier kommen die Style-anpassungen für den Hochformat-Modus rein */
   
}
 
@media all and (orientation:landscape) {
  /* Hier kommen die Style-anpassungen für den Querformat-Modus rein */
   
}

/* Styles für maximale Bildschirmbreiten von 1565px */

@media all and (max-width: 1565px) {
	#fixed-sidebar{background-color: #f0f0f0;bottom:0;box-shadow: 1px 1px 4px 1px rgba(0, 0, 0, 0.1);left:0;padding: 10px 0 0;right:auto;text-align:center;top:auto;width:100%;z-index: 9;}
	.audience-1-side, .audience-2-side, .audience-3-side {display:inline-block;margin-bottom: 10px;padding: 5px;position: relative;width: 20%;}
	#page{margin-bottom: 63px;}
}
/* Styles für maximale Bildschirmbreiten von 1200px */

@media all and (max-width: 1200px) {

}
/* Styles für maximale Bildschirmbreiten von 1155px */

@media all and (max-width: 1155px) {
	.audience-3 .vc_column-inner,
	.audience-2 .vc_column-inner,
	.audience-1 .vc_column-inner{min-height:164px;}
}

/* Styles für maximale Bildschirmbreiten von 1078px */

@media all and (max-width: 1078px) {
	.audience-3 .vc_column-inner,
	.audience-2 .vc_column-inner,
	.audience-1 .vc_column-inner{min-height:200px;}
	.page-id-143 .partner-helfer-acc h3 {min-height: 192px;}
	.orga-dev h2{font-size:21px;}
}

/* Styles für minimale Bildschirmbreiten von 992px und maximale Bildschirmbreiten von 1250px */
@media all and (min-width:992px ) and (max-width: 1250px) {
	.vc_gitem-zone h3{font-size:16px;line-height:24px; }
	.vc_gitem-zone p{font-size:14px;}
    .home .vc_gitem-post-data-source-post_title h3{font-size:14px;}
    .home .vc_gitem-zone .vc_gitem-col {padding: 10px 0;}
}
/* Styles für maximale Bildschirmbreiten von 1040px */
@media all and (max-width: 1040px) {
	#fixed-sidebar{display: none;}
	#page{margin-bottom: 0px;}
	.slogan h2, .home .slogan h1 {font-size: 70px;}
	#fancy-header {max-height:330px !important;min-height:200px !important;}
	.vc_gitem-zone{height:266px !important;}
}
/* Styles für maximale Bildschirmbreiten von 991px */
@media all and (max-width: 991px) {
	.slogan h2, .home .slogan h1 {font-size: 48px;line-height:60px;}
	.slogan h3, .home .slogan h2 {font-size: 27px;}
	.slogan-2 h3 {font-size: 42px;line-height: 56px;}
	.has-grid > .vc_col-sm-6 {width: 100%;}
	.audience-3 .vc_column-inner,
	.audience-2 .vc_column-inner,
	.audience-1 .vc_column-inner{min-height:244px;}
	.page-id-143 .partner-helfer-acc h3 {min-height: 256px;hyphens:auto;}
	.partner-helfer-acc .vc_tta-title-text{font-size: 12px; hyphens:auto;}
	.partner-helfer-acc h3{font-size:14px;}
	.vc_tta.vc_general {font-size: 12px;}

}
@media all and (min-width: 767px) and (max-width: 1135px){
	.orga-dev-tile h3{font-size:0px;position:relative;}
	.orga-dev-tile h3:after {color: #262b2e;content: "Organisations- entwicklung";font-size: 20px;left: 0;position: absolute;}
}

/* Styles für maximale Bildschirmbreiten von 767px */

@media all and (max-width: 767px) {
	.audience-1,
	.audience-2,
	.audience-3{padding:10px;}
	
	.audience-3 .vc_column-inner,
	.audience-2 .vc_column-inner,
	.audience-1 .vc_column-inner{min-height:144px;}
	.page-id-143 .partner-helfer-acc h3 {min-height: auto;hyphens:auto;}
}

/* Styles für maximale Bildschirmbreiten von 480px */

@media screen and (max-width: 480px) {
	h2 {font-size:19px;}
	.slogan h2, .home .slogan h1 {font-size: 40px;line-height:55px;}
	.slogan h3, .home .slogan h2 {font-size: 21px;line-height: 35px;}
	.slogan-2 h3 {font-size: 32px;line-height: 46px;font-weight: 600;}
	#fancy-header {min-height:200px !important;}
	.page-title {margin-top: 32px;}
	.orga-dev h2{font-size:18px;}
}

/* Klasse-A Mobile Browser (Opera Mobil, iPhone Safari, Android Chrome) 
   Bedenkt dabei: www.cloudfour.com/css-media-query-for-mobile-is-fools-gold/ */
@media screen and (max-device-width: 480px) {
   
   
  /* Uncomment if you don't want iOS and WinMobile to mobile-optimize the text for you
     j.mp/textsizeadjust
  html {-webkit-text-size-adjust:none; -ms-text-size-adjust:none;} */
}
    
   
/* ======================================================================================================
   Druck-Styles
   inline geschrieben, um zusätzlichen HTTP-Aufruf zu vermeiden www.phpied.com/delay-loading-your-print-css/
   ====================================================================================================== */

@media print {
  * {background: transparent !important; color: #444 !important; text-shadow: none !important;}
  /* Print-Logo sichtbar machen */
  h1#logo { text-indent: 0; }
  h1#logo span { display: none; }
  h1#logo img { display: inline; }
  /* Navigation, Sprachwahl ausblenden */
  #languages, #navigation { display: none; }
  a, a:visited {color: #444 !important; text-decoration: underline;}
  a:after {content: " (" attr(href) ")";}
  abbr:after {content: " (" attr(title) ")";}
  .ir a:after {content: "";}  /* Don't show links for images */
  pre, blockquote {border: 1px solid #999; page-break-inside: avoid;}
  thead {display: table-header-group;} /* css-discuss.incutio.com/wiki/Printing_Tables */
  tr, img {page-break-inside: avoid;}
  p, h2, h3 {orphans: 3; widows: 3;}
  h2, h3{page-break-after: avoid;}
}

.content {
	width: 100% !important;
}