/******************************************************************************************************
 * Standard-Einstellungen
 ******************************************************************************************************/

/* Very Small devices (kleiner ) */
@media screen and (max-width: 576px) { ... }

/* Small devices (landscape phones, 576px and up - 36em ) */
@media screen and (min-width: 576px) { ... }

/* Medium devices (tablets, 768px and up - 48em ) */
@media screen and (min-width: 768px) { ... }

/* Large devices (desktops, 992px and up - 57em ) */
@media screen and (min-width: 992px) { 

 h1					{ font-size: 1.5rem !important; margin-top: 20px }
 h2					{ font-size: 1.1rem !important }

 .content_prefix			{ padding: 0 5px; margin: 0 15px }
 .content_prefix .container		{ padding: 0 5px }
 .content_column			{ padding: 0 5px }
 .content_column .container		{ padding: 0 5px }
 .content_column .row		{ display: block }

 .field--name-body			{ padding: 0 10px }
 .views-field-field-image		{ clear: float !important; width: 100%; padding: 0 0 15px 0 }

 .navbar-toggler			{ margin-right: 15px }


}

/* Extra large devices (large desktops, 1200px and up - 75em) */
@media screen and (min-width: 1200px) { 



}


@media screen and (max-width: 75em) { /* 1200px */

}

/******************************************************************************************************
 * Navigation
 ******************************************************************************************************/

@media screen and (max-width: 60em) { /* 1200px */
 
 .navbar-sidebar			{ display: none !important }
 .navbar-brand			{ height: 100px; width: auto; padding: 10px 0 0 5px }
 .navbar-brand img			{ height: 90px; width: auto; padding: 10px 0 0 5px }

 .nav-link-header			{ display: none }
 #block-headernavigation .fas	{ width: 30px; color: #415eab }

}

/******************************************************************************************************
 * Titel
 ******************************************************************************************************/

@media screen and (max-width: 70em) {

 #block-bannerstartseite 		{ height: 150px; margin-top: 100px }

}

@media screen and (max-width: 75em) { /* 992px */
 #block-views-block-aktuelles-block-1	{ margin: 20px 0 0 20px !important; position: relative; text-align: left }
 ##block-views-block-aktuelles-block-1	{ background-color: #ffffff; opacity: 0.8; max-width: 330px }
 #block-views-block-aktuelles-block-1 img			{ width: 100px; height: auto; float: left; padding: 15px }
}

@media screen and (max-width: 100em) { /* 992px */
 #block-views-block-aktuelles-block-1			{ margin: 20px 0 0 20px !important; position: relative; text-align: left }
 #block-views-block-aktuelles-block-1			{ background-color: #ffffff; opacity: 0.8; max-width: 100% }
 #block-views-block-aktuelles-block-1 img			{ width: 100px; height: auto; float: left; padding: 15px }


/******************************************************************************************************
 * Direktlinks
 ******************************************************************************************************/

@media screen and (max-width: 75em) {

 
 .direktlink .col		{ margin-bottom: 15px; padding: 0 5px 0 5px }

 .region-direktlink-1 img	{ width: 100px; height: auto; padding-top: 10px }
 .region-direktlink-2 img	{ width: 100px; height: auto }
 .region-direktlink-3 img	{ width: 80px; height: auto }
 .region-direktlink-4 img	{ width: 80px; height: auto; padding-top: 5px }
 .region-direktlink-5 img	{ width: 100px; height: auto }
 .region-direktlink-6 img	{ width: 80px; height: auto }

 .region-direktlink-1,
 .region-direktlink-2,
 .region-direktlink-3,
 .region-direktlink-4,
 .region-direktlink-5,
 .region-direktlink-6	{ height: 180px; border: 1px solid green }

}

/******************************************************************************************************
 * Content
 ******************************************************************************************************/

@media screen and (max-width: 75em) { /* 992px */

 .breadcrumb				{ padding: 0 2% }
 .content				{ padding: 0 2% }

 #block-textstartseite		{ padding: 0 5px }
 #block-bannerstartseite		{ margin-top: 20px }
 #block-bs-one-content		{ padding: 0 }

 #block-bs-one-page-title				{ width: 100%; padding: 5px; margin-bottom: 20px; overflow: hidden }

 .node--type-page .field--name-body		{ width: 100%; padding: 5px; margin-bottom: 20px; overflow: hidden }
 .node--type-page .field--name-field-image	{ float: left; width 100%; padding: 0 }
 .node--type-page .field--name-field-image img	{ padding: 0 5px 15px 5px }


 .views-field-field-bild			{ clear: float; width: 100%; padding: 0 0 15px 0 }

 #block-views-block-accordion-block-1	{ padding: 0 10px }
 .ui-accordion .ui-accordion-content	{ padding: 10px }


 .view-teams .col-md-4:nth-child(1)	{ max-width: 100%; float: none; margin: 0 1% 0 0; padding: 0 !important }
 .view-teams .col-md-4:nth-child(2)	{ max-width: 100%; float: none; margin: 0 1% 0 0; padding: 0 !important }
 .view-teams .col-md-4:nth-child(3)	{ max-width: 100%; float: none; margin: 0; padding: 0 !important }

 .view-teams .col-md-4 img			{ max-width: 60% }


}


/******************************************************************************************************
 * Kontaktformular
 ******************************************************************************************************/

@media screen and (max-width: 75em) { /* 992px */

 .field--name-field-webform			{ padding: 0 5px !important }

 #webform-submission-kontakt-add-form	{ padding: 0 5% !important } 

 #webform-submission-kontakt-add-form .js-form-item-organisation 	{ clear: float }
 #webform-submission-kontakt-add-form .js-form-item-name-vorname 	{ clear: float }
 #webform-submission-kontakt-add-form .js-form-item-e-mail-adresse 	{ clear: float }

 #edit-organisation 			{ width: 100% }
 #edit-name-vorname 			{ width: 100% }
 #edit-e-mail-adresse		{ width: 100% }
 #edit-mitteilung	 		{ width: 100%; margin-left: 0 !important }

 
}

/******************************************************************************************************
 * sub-features
 ******************************************************************************************************/

@media screen and (max-width: 60em) { /* 992px */

 .sub_content				{ padding: 5% } 
 .sub_content .col			{ clear:   float!important; width: 100%!important; margin-bottom: 15px }
 .sub_content .container .row 	{ display: block!important;  }

 .sub_features .col			{ clear: float!important; width: 100%!important; margin-bottom: 15px }
 .sub_features .container .row 	{ display: block!important }

 .navbar-brand-footer		{ padding: 3px 0 0 0 }

 .view-teams .col-md-4 img		{ max-width: 100% }
}


