
/* ---------------------------------------
	Responsive design code
-----------------------------------------*/

@media screen and (min-width: 1025px) {

.hidemobile5,
.tck-hide-desktop {
	display: none !important;
}

[class*="tck-cols"].tck-stack-5,
[class*="tck-cols"].tck-stack-desktop {
	flex-direction: column;
}

[class*="tck-cols"].tck-stack-5 > *,
[class*="tck-cols"].tck-stack-desktop > * {
	width: auto !important;
}


#kontakt_oben_rechts .tck-module-text {
    text-align: right;
}
.contatti {
    width: 300px;
    text-align: left;
    margin: 0.5rem 0.5rem 0.5rem auto;
}

}

@media screen and (max-width: 1024px) {

img {
	max-width: 100%;
	height: auto;
}

.hidemobile4,
.tck-hide-tablet-l {
	display: none !important;
}

[class*="tck-cols"].tck-stack-4,
[class*="tck-cols"].tck-stack-tablet-l {
	flex-direction: column;
}

[class*="tck-cols"].tck-stack-4 > *,
[class*="tck-cols"].tck-stack-tablet-l > * {
	width: auto !important;
}


/* um das Menu kleiner zu machen, damit auf eine zeile passt */
#hauptmenu ul.menu > li > a, #hauptmenu ul.menu > li > span.separator, #hauptmenu ul.maximenuck > li > a, #hauptmenu ul.maximenuck > li > span.separator {
    padding: 1rem;
    padding-top: 1.65rem;
    padding-bottom: 1.65rem;
}

/* um die kontaktdaten oben dezent zu machen */
#kontakt_oben_rechts .tck-module-text {
    text-align: right;
}
.contatti {
    width: 300px;
    text-align: left;
    margin: 0.5rem 0.5rem 0.5rem auto;
}


/* um in den blöcken, die buttons auf der gleichen Höhe */
#block-leiste > .inner {
    margin: 1.5rem;
    font-size: 0.94rem;
}


/* damit die ganze graue zeile mit Beruf auf eine Zeil bleibt */
h6 {
    font-size: 0.8rem;
}

}

@media screen and (max-width: 950px) {

img {
	max-width: 100%;
	height: auto;
}

.hidemobile3,
.tck-hide-tablet-p {
	display: none !important;
}

[class*="tck-cols"].tck-stack-3,
[class*="tck-cols"].tck-stack-tablet-p {
	flex-direction: column;
}

[class*="tck-cols"].tck-stack-3 > *,
[class*="tck-cols"].tck-stack-tablet-p > * {
	width: auto !important;
}


#kontakt_oben_rechts .tck-module-text {
    text-align: right;
}
.contatti {
    width: 300px;
    text-align: left;
    margin: 0.5rem 0.5rem 0.5rem auto;
}

/* um das Menu kleiner zu machen, damit auf eine zeile passt */
#hauptmenu ul.menu > li > a, #hauptmenu ul.menu > li > span.separator, #hauptmenu ul.maximenuck > li > a, #hauptmenu ul.maximenuck > li > span.separator {
    padding: 0.65rem;
    padding-top: 1rem;
    padding-bottom: 1rem;
    font-size: 0.75rem;
}

/* für Problem mit dem Breite, musste die padding right und left niedrigen sein; */
#maincontent > .inner {
    padding-right: 4rem;
    padding-left: 4rem;
    padding-top: 2rem;
    padding-bottom: 1rem;
}


 /* für die Boxes */
#block-leiste > .inner {
    margin: 0.5rem;
    font-size: 0.75rem;
}
#block01 > .inner, #block02 > .inner, #block03 > .inner, #block04 > .inner {
    margin: 0.15rem;
    padding: 0.25rem;
}


button {
    padding: 1rem 0rem;
    width: 100%;
    font-size: 0.7rem;
    font-weight: bold;
}

}

@media screen and (max-width: 750px) {

img {
	max-width: 100%;
	height: auto;
}

.hidemobile2,
.tck-hide-phone-l {
	display: none !important;
}

[class*="tck-cols"].tck-stack-2,
[class*="tck-cols"].tck-stack-phone-l {
	flex-direction: column;
}

[class*="tck-cols"].tck-stack-2 > *,
[class*="tck-cols"].tck-stack-phone-l > * {
	width: auto !important;
}


#body {
	height: auto !important;
}
#body .logobloc {
	float :none !important;
	width: auto !important;
}
#wrapper {
	height: auto !important;
}
#wrapper .logobloc {
	float :none !important;
	width: auto !important;
}
#kontakt_oben_rechts {
	height: auto !important;
}
#kontakt_oben_rechts .logobloc {
	float :none !important;
	width: auto !important;
}
#bannerrow > .inner {
	flex-direction: column;
}
#bannerrow .flexiblecolumn {
	width: 100% !important;
float: none;
}
#bannerrow .flexiblecolumn > div.inner {
	margin-left: 0 !important;
	margin-right: 0 !important;
}
#bannercolumn1 > .inner {
	flex-direction: column;
}
#bannercolumn1 .flexiblecolumn {
	width: 100% !important;
float: none;
}
#bannercolumn1 .flexiblecolumn > div.inner {
	margin-left: 0 !important;
	margin-right: 0 !important;
}
#bannerlogo {
	height: auto !important;
}
#bannerlogo .logobloc {
	float :none !important;
	width: auto !important;
}
#bannercolumn2 > .inner {
	flex-direction: column;
}
#bannercolumn2 .flexiblecolumn {
	width: 100% !important;
float: none;
}
#bannercolumn2 .flexiblecolumn > div.inner {
	margin-left: 0 !important;
	margin-right: 0 !important;
}
#hauptmenu {
	height: auto !important;
}
#hauptmenu ul {
	height: auto !important;
}
#hauptmenu li {
	float :none !important;
	width: 100% !important;
}
#hauptmenu div.floatck, #hauptmenu li > ul {
	width: 100% !important;
	position: relative !important;
	display: block !important;
	margin: 0 !important;
	left: auto !important;
}
#hauptmenu div.maximenuck2 {
	width: 100% !important;
	position: relative !important;
	display: block !important;
	float: none !important;
}
#hauptmenu .mobileckhambuger_togglerlabel {
	display: block !important;
	font-size: 33px !important;
	text-align: right !important;
	padding: 10px !important;
}
#hauptmenu .mobileckhambuger_toggler + * {
	display: none !important;
	overflow-x: hidden;
}
#hauptmenu .mobileckhambuger_toggler:checked + * {
	display: block !important;
}
#slideshow {
	height: auto !important;
}
#slideshow .logobloc {
	float :none !important;
	width: auto !important;
}
#maincontent > .inner {
	display: block;
}
#maincontent .column {
	width: 100% !important;
	clear:both;
	float:left
}
#maincontent .column1 div.inner, #maincontent .column2 div.inner {
	/*overflow:hidden;*/
}
#maincontent .column div.inner {
	margin-left: 0 !important;
	margin-right: 0 !important;
}
.items-row .item, .column {
	width: auto !important;
	float: none;
	margin: 0 !important;
}

.column div.moduletable, .column div.moduletable_menu {
	float: none;
	width: auto !important;
	/*margin: 0 !important;
	padding: 0 !important;*/
}

/** specifique au formulaire de contact **/
.contact form fieldset dt {
	max-width: 80px;
}

.contact input, .contact textarea {
	max-width: 160px;
}#linkscolumn1 > .inner {
	flex-direction: column;
}
#linkscolumn1 .flexiblecolumn {
	width: 100% !important;
float: none;
}
#linkscolumn1 .flexiblecolumn > div.inner {
	margin-left: 0 !important;
	margin-right: 0 !important;
}
#main {
	height: auto !important;
}
#main .logobloc {
	float :none !important;
	width: auto !important;
}
#maintop {
	height: auto !important;
}
#maintop .logobloc {
	float :none !important;
	width: auto !important;
}
#maintopmodule {
	height: auto !important;
}
#maintopmodule .logobloc {
	float :none !important;
	width: auto !important;
}
#maincenter {
	height: auto !important;
}
#maincenter .logobloc {
	float :none !important;
	width: auto !important;
}
#center {
	height: auto !important;
}
#center .logobloc {
	float :none !important;
	width: auto !important;
}
#centertop {
	height: auto !important;
}
#centertop .logobloc {
	float :none !important;
	width: auto !important;
}
#centertopmodule {
	height: auto !important;
}
#centertopmodule .logobloc {
	float :none !important;
	width: auto !important;
}
#content {
	height: auto !important;
}
#content .logobloc {
	float :none !important;
	width: auto !important;
}
#centerbottom {
	height: auto !important;
}
#centerbottom .logobloc {
	float :none !important;
	width: auto !important;
}
#centerbottommodule {
	height: auto !important;
}
#centerbottommodule .logobloc {
	float :none !important;
	width: auto !important;
}
#rechts {
	height: auto !important;
}
#rechts .logobloc {
	float :none !important;
	width: auto !important;
}
#rechtscolumn1 > .inner {
	flex-direction: column;
}
#rechtscolumn1 .flexiblecolumn {
	width: 100% !important;
float: none;
}
#rechtscolumn1 .flexiblecolumn > div.inner {
	margin-left: 0 !important;
	margin-right: 0 !important;
}
#mainbottom {
	height: auto !important;
}
#mainbottom .logobloc {
	float :none !important;
	width: auto !important;
}
#mainbottommodule {
	height: auto !important;
}
#mainbottommodule .logobloc {
	float :none !important;
	width: auto !important;
}
#block-leiste .flexiblemodule {
	width: 100% !important;
float: none;
}
#block-leiste .flexiblemodule > div.inner {
	margin-left: 0 !important;
	margin-right: 0 !important;
}
#block-leiste > .inner {
	flex-direction: column;
}
#block01 {
	height: auto !important;
}
#block01 .logobloc {
	float :none !important;
	width: auto !important;
}
#block02 {
	height: auto !important;
}
#block02 .logobloc {
	float :none !important;
	width: auto !important;
}
#block03 {
	height: auto !important;
}
#block03 .logobloc {
	float :none !important;
	width: auto !important;
}
#block04 {
	height: auto !important;
}
#block04 .logobloc {
	float :none !important;
	width: auto !important;
}
#footer {
	height: auto !important;
}
#footer .logobloc {
	float :none !important;
	width: auto !important;
}
#footer_designer {
	height: auto !important;
}
#footer_designer .logobloc {
	float :none !important;
	width: auto !important;
}
#layout_error404_html {
	height: auto !important;
}
#layout_error404_html .logobloc {
	float :none !important;
	width: auto !important;
}
/* um die kontaktdaten oben dezent zu machen */

#kontakt_oben_rechts > .inner {
    margin: 0 !important;
}

#kontakt_oben_rechts .tck-module-text {
    text-align: right;
}

.contatti {
    width: 300px;
    text-align: left;
    margin: 0.5rem 0.5rem 0.5rem auto;
}

/* um das Logo zu zentrieren */
   .tck-logo-img {
    display: inline-block;
} 
#bannerlogo > .inner {
    text-align: left;
}

/* um weniger abstand zwischen kontaktdaten und menu */
#kontakt_oben_rechts > .inner {
    margin-bottom: 0.5rem;
}

/* um mehr abstand zwischen menu und slideshow */
#hauptmenu .mobileckhambuger_togglerlabel {
    font-size: 4rem !important;
    text-align: right !important;
    padding-bottom: 1rem;
    padding-right: 0.5rem;
}


/* um die kontaktdaten als fake zu zentrieren */
#kontakt_oben_rechts > .inner {
    margin: 0.5rem auto;
}

/* für Problem mit dem Breite, musste die padding right und left niedrigen sein; */
#maincontent > .inner {
    padding-right: 1.5rem;
    padding-left: 1.5rem;
    padding-top: 1rem;
    padding-bottom: 1rem;
}
  /* für Margin der Blöcke auf der Startseite */
#block-leiste > .inner {
    margin: 0.5rem;
}

  /* für Slideshow stertseite */
.camera_caption_title {
    font-size: 1.2rem;
}
.camera_caption > div {
    width: auto;
    padding: 1rem;
}
.camera_target {
    overflow: auto;
}
.camera_target_content {
    overflow: visible;
}
.cameraContent {
    bottom: 0px;
}

  /* für Icons auf Unterseiten */

#rechts > .inner {
    text-align: center !important;
}


  /* für die Boxes */
#block-leiste > .inner {
    margin: 1.5rem;
}

button {
    padding: 1rem 0rem;
    width: 100%;
    font-size: 0.85rem;
    font-weight: bold;
}



  /* Um den Abstand top von Footer niedriger zu machen */
#footer > .inner {
    margin-top: 2rem;
    font-size: 0.75rem;
}

#footer div.moduletable h3, #footer div.module h3, #footer .widget h3, #footer .tck-module h3, #footer div.moduletable_menu h3, #footer div.module_menu h3, #footer .tck-module-title {
    font-size: 1.2rem;
}

}

@media screen and (max-width: 500px) {

img {
	max-width: 100%;
	height: auto;
}


.hidemobile1,
.tck-hide-phone-p {
	display: none !important;
}

[class*="tck-cols"].tck-stack-1,
[class*="tck-cols"].tck-stack-phone-p {
	flex-direction: column;
}

[class*="tck-cols"].tck-stack-1 > *,
[class*="tck-cols"].tck-stack-phone-p > * {
	width: auto !important;
}

#body {
	height: auto !important;
}
#body .logobloc {
	float :none !important;
	width: auto !important;
}
#wrapper {
	height: auto !important;
}
#wrapper .logobloc {
	float :none !important;
	width: auto !important;
}
#kontakt_oben_rechts {
	height: auto !important;
}
#kontakt_oben_rechts .logobloc {
	float :none !important;
	width: auto !important;
}
#bannerrow > .inner {
	flex-direction: column;
}
#bannerrow .flexiblecolumn {
	width: 100% !important;
float: none;
}
#bannerrow .flexiblecolumn > div.inner {
	margin-left: 0 !important;
	margin-right: 0 !important;
}
#bannercolumn1 > .inner {
	flex-direction: column;
}
#bannercolumn1 .flexiblecolumn {
	width: 100% !important;
float: none;
}
#bannercolumn1 .flexiblecolumn > div.inner {
	margin-left: 0 !important;
	margin-right: 0 !important;
}
#bannerlogo {
	height: auto !important;
}
#bannerlogo .logobloc {
	float :none !important;
	width: auto !important;
}
#bannercolumn2 > .inner {
	flex-direction: column;
}
#bannercolumn2 .flexiblecolumn {
	width: 100% !important;
float: none;
}
#bannercolumn2 .flexiblecolumn > div.inner {
	margin-left: 0 !important;
	margin-right: 0 !important;
}
#hauptmenu {
	height: auto !important;
}
#hauptmenu ul {
	height: auto !important;
}
#hauptmenu li {
	float :none !important;
	width: 100% !important;
}
#hauptmenu div.floatck, #hauptmenu li > ul {
	width: 100% !important;
	position: relative !important;
	display: block !important;
	margin: 0 !important;
	left: auto !important;
}
#hauptmenu div.maximenuck2 {
	width: 100% !important;
	position: relative !important;
	display: block !important;
	float: none !important;
}
#hauptmenu .mobileckhambuger_togglerlabel {
	display: block !important;
	font-size: 33px !important;
	text-align: right !important;
	padding: 10px !important;
}
#hauptmenu .mobileckhambuger_toggler + * {
	display: none !important;
	overflow-x: hidden;
}
#hauptmenu .mobileckhambuger_toggler:checked + * {
	display: block !important;
}
#slideshow {
	height: auto !important;
}
#slideshow .logobloc {
	float :none !important;
	width: auto !important;
}
#maincontent > .inner {
	display: block;
}
#maincontent .column {
	width: 100% !important;
	clear:both;
	float:left
}
#maincontent .column1 div.inner, #maincontent .column2 div.inner {
	/*overflow:hidden;*/
}
#maincontent .column div.inner {
	margin-left: 0 !important;
	margin-right: 0 !important;
}
.items-row .item, .column {
	width: auto !important;
	float: none;
	margin: 0 !important;
}

.column div.moduletable, .column div.moduletable_menu {
	float: none;
	width: auto !important;
	/*margin: 0 !important;
	padding: 0 !important;*/
}

/** specifique au formulaire de contact **/
.contact form fieldset dt {
	max-width: 80px;
}

.contact input, .contact textarea {
	max-width: 160px;
}#linkscolumn1 > .inner {
	flex-direction: column;
}
#linkscolumn1 .flexiblecolumn {
	width: 100% !important;
float: none;
}
#linkscolumn1 .flexiblecolumn > div.inner {
	margin-left: 0 !important;
	margin-right: 0 !important;
}
#main {
	height: auto !important;
}
#main .logobloc {
	float :none !important;
	width: auto !important;
}
#maintop {
	height: auto !important;
}
#maintop .logobloc {
	float :none !important;
	width: auto !important;
}
#maintopmodule {
	height: auto !important;
}
#maintopmodule .logobloc {
	float :none !important;
	width: auto !important;
}
#maincenter {
	height: auto !important;
}
#maincenter .logobloc {
	float :none !important;
	width: auto !important;
}
#center {
	height: auto !important;
}
#center .logobloc {
	float :none !important;
	width: auto !important;
}
#centertop {
	height: auto !important;
}
#centertop .logobloc {
	float :none !important;
	width: auto !important;
}
#centertopmodule {
	height: auto !important;
}
#centertopmodule .logobloc {
	float :none !important;
	width: auto !important;
}
#content {
	height: auto !important;
}
#content .logobloc {
	float :none !important;
	width: auto !important;
}
#centerbottom {
	height: auto !important;
}
#centerbottom .logobloc {
	float :none !important;
	width: auto !important;
}
#centerbottommodule {
	height: auto !important;
}
#centerbottommodule .logobloc {
	float :none !important;
	width: auto !important;
}
#rechts {
	height: auto !important;
}
#rechts .logobloc {
	float :none !important;
	width: auto !important;
}
#rechtscolumn1 > .inner {
	flex-direction: column;
}
#rechtscolumn1 .flexiblecolumn {
	width: 100% !important;
float: none;
}
#rechtscolumn1 .flexiblecolumn > div.inner {
	margin-left: 0 !important;
	margin-right: 0 !important;
}
#mainbottom {
	height: auto !important;
}
#mainbottom .logobloc {
	float :none !important;
	width: auto !important;
}
#mainbottommodule {
	height: auto !important;
}
#mainbottommodule .logobloc {
	float :none !important;
	width: auto !important;
}
#block-leiste .flexiblemodule {
	width: 100% !important;
float: none;
}
#block-leiste .flexiblemodule > div.inner {
	margin-left: 0 !important;
	margin-right: 0 !important;
}
#block-leiste > .inner {
	flex-direction: column;
}
#block01 {
	height: auto !important;
}
#block01 .logobloc {
	float :none !important;
	width: auto !important;
}
#block02 {
	height: auto !important;
}
#block02 .logobloc {
	float :none !important;
	width: auto !important;
}
#block03 {
	height: auto !important;
}
#block03 .logobloc {
	float :none !important;
	width: auto !important;
}
#block04 {
	height: auto !important;
}
#block04 .logobloc {
	float :none !important;
	width: auto !important;
}
#footer {
	height: auto !important;
}
#footer .logobloc {
	float :none !important;
	width: auto !important;
}
#footer_designer {
	height: auto !important;
}
#footer_designer .logobloc {
	float :none !important;
	width: auto !important;
}
#layout_error404_html {
	height: auto !important;
}
#layout_error404_html .logobloc {
	float :none !important;
	width: auto !important;
}
/* um die kontaktdaten oben dezent zu machen */

#kontakt_oben_rechts > .inner {
    margin: 0 !important;
}

#kontakt_oben_rechts .tck-module-text {
    text-align: center;
}

.contatti {
    width: 300px;
    text-align: left;
    margin: 0.5rem auto;
}

/* um das Logo zu zentrieren */
   .tck-logo-img {
    display: inline-block;
} 
#bannerlogo > .inner {
    text-align: center;
}

/* um weniger abstand zwischen kontaktdaten und menu */
#kontakt_oben_rechts > .inner {
    margin-bottom: 0.5rem;
}

/* um mehr abstand zwischen menu und slideshow */
#hauptmenu .mobileckhambuger_togglerlabel {
    font-size: 4rem !important;
    text-align: right !important;
    padding-bottom: 1rem;
    padding-right: 0.5rem;
}


/* um die kontaktdaten als fake zu zentrieren */
#kontakt_oben_rechts > .inner {
    margin: 0.5rem auto;
}

/* für Problem mit dem Breite, musste die padding right und left niedrigen sein; */
#maincontent > .inner {
    padding-right: 0.5rem;
    padding-left: 0.5rem;
    padding-top: 1rem;
    padding-bottom: 1rem;
}
  /* für Margin der Blöcke auf der Startseite */
#block-leiste > .inner {
    margin: 0.5rem;
}

  /* für Slideshow stertseite */
.camera_caption_title {
    font-size: 1.2rem;
}
.camera_caption > div {
    width: auto;
    padding: 1rem;
}
.camera_target {
    overflow: auto;
}
.camera_target_content {
    overflow: visible;
}
.cameraContent {
    bottom: 0px;
}

  /* für Icons auf Unterseiten */

#rechts > .inner {
    text-align: center !important;
}


  /* Um den Abstand top von Footer niedriger zu machen */
#footer > .inner {
    margin-top: 2rem;
    font-size: 0.85rem;
}

}
