/* -----------------------------------------------------------------------------

	Website TWIINZ, CSS

------------------------------------------------------------------------------*/

:root {
	--font-1 : Helvetica Neue,Helvetica,Arial,sans-serif;
	--primary : hsl(213, 10%, 18%);
	--white : #fafafa;
	--active : #d8c455;
	--lightgray : #f1f3f5;	
	--gray : #9E9E9E;
}

/* -----------------------------------------------------------------------------

	Mobile

------------------------------------------------------------------------------*/

@media screen and (min-width: 100px) { 
	
	:root {--spacer-0 : 0;--spacer : .58rem;--border: .1rem;}
	@keyframes fadeIn {to {opacity: 1;transform: translateY(0);}}

/* Layout */
	html {font-size: 100%;scroll-behavior: smooth;}
	body {margin: 0; padding: 0;font-family: var(--font-1);color: var(--primary);line-height: 1.58rem;letter-spacing: .01rem;background: var(--white);overflow-x: hidden;hyphens: auto;}
	[id="wrapper"] {padding: 40px 0 20px 0;}
	[id="header"] .content-element-group {display: flex;align-items: center;justify-content: space-between;}
	.kundenbereich .content-element-group {display: flex;flex-direction: column;justify-content: space-between;align-items: start;}
	.header-logo {display: flex}
	.login-logo {display: flex;justify-content: center;align-items: flex-start;}
	.copyright {margin-top: -4px;margin-left: 3px;font-size: 12px;line-height: 12px;font-weight: 800;}
	[id="footer"] {margin-bottom: calc(var(--spacer) * 8);}
	[id="footer"] .mod_navigation {border-top: var(--border) solid var(--primary);}
	.news [id="footer"] .mod_navigation {padding-top: 0;border-top: none;}
	.headline-startseite p {margin-left: 20px;margin-right: 20px;}
	.mod_navigation li,ul.level_1 {list-style: none;}
	.border-1,.border-2,.border-top,.login button.submit {background: var(--primary);}
	h1,h2,h3,h4,p,a,ul,.close,.login [id="wrapper"],.login form,.download-element figure a {margin: 0;padding: 0;}

/* Margin */	
	.news [id="footer"],.kundenbereich [id="footer"] {margin-top: var(--space-0);}
	figure {margin: 0;}
	[id="footer"],.startseite-img,.margin-top,.passwort-vergessen p,.startseite-news-teaser h2,.border-top,.mod_newslist,[id="footer"] .mod_navigation,.margin-headline h2,.margin-headline h3,.margin-headline h4,.content-gallery ul,.kundenbereich h2,.downloads-default-img ul li figure,#gallery-work,.footer-contact,.news .ce_swiperStart,#fotoshooting-submenu,.news .more_news {margin-top: calc(var(--spacer) * 3);}
	.kundenbereich [id="header"],.kundenbereich [id="header"] .inside,.border-none .layout_latest p.more,.kundenbereich form,.news .mod_newslist:last-of-type {margin-bottom: var(--space-0);}
	[id="header"],.margin-bottom,.kundenbereich .border-1,.fotoshooting-beschreibung-container,.startseite-news-teaser p,.border-top,.mod_newslist,.layout_latest p.more,.margin-headline h2,.margin-headline h3,.margin-headline h4,p.home,.kundenbereich-header,.startseite .only-mobil-portrait p,.downloads-img.content-downloads ul,.downloads-liste.content-downloads ul,.kundenbereich h2,.content-gallery ul,.downloads-default-img ul,.kundenbereich [id="header"] h1,.work .beschreibung-1,.work .beschreibung-2,.slogan,.kundenbereich p.login_info {margin-bottom: calc(var(--spacer) * 3);}
	.startseite-name .only-mobil-portrait p.margin-bottom {margin-bottom: calc(var(--spacer) * 8);}
	
/* Padding */
	.news-headline h1,.news-headline h2 {margin-bottom: 25px;}
	[id="footer"] .mod_navigation,.mod_newslist .layout_latest,.news-footer {padding-top: calc(var(--spacer) * 3);}	
    
/* Schriftgröße */
	h1 {display: inline-block}
	.login label,.form-link p,.new-login {font-size: .7rem;}
	img {font-size: 0.8rem;}
	h1,h2,h3,h4,.link-latest-news-bottom,.fotoshooting-detail h2,p.login_info,.startseite-beschreibung h2,p,ul,li,input,label,button.submit,.passwort-vergessen p,.overlay p,.overlay a,.overlay li,.overlay li.active,.mod_newslist, #cboxClose,[id="footer"] p,[id="footer"] a,.downloads-img.content-downloads li a,.downloads-liste.content-downloads li a,#cboxTitle,#cboxCurrent,.fotoshooting-detail h1 {font-size: 1rem}
	.slogan p {font-size: 1.5rem;line-height: 1.8rem;}

/* Schriftstärke */
	.beschreibung-1 h1,li.download-element a {font-weight: normal}
	h1,h2,h3,h4,.slogan,.fotoshooting-detail h3,.bold,span.bold,.home,input,li.trail,li a.active,.active,.navigation-header li a,#fotoshooting-submenu.mod_navigation ul::before,a.trail,.login button.submit,p.login_info,.login .error,.download-element a,.login p.new-login a,.download-element a:before,.headline-startseite p,.mobil-menu-extra-content span.headline {font-weight: bold;}
	#fotoshooting-submenu li.active {text-transform: uppercase;}
	
/* Links */
	a,.active {text-decoration: none;}
	a:link,a:visited,a:active,a:focus {color: var(--primary);}
	a:hover {color: var(--active);}
	:is(h2,p,li) a:hover,a.submenu.sibling,.submenu.trail {border-bottom: none;}
	.startseite-beschreibung h2 a:hover,#main p a:hover,#main li a:hover,#footer p a:hover,#footer li a:hover {position: relative;}
	.startseite h2 a {text-transform: uppercase;}
	.fotoshooting-detail .ce_swiperStart figure {pointer-events: none;}
    
/* Border */
	.border-1,.border-2,.border-top {width: 100%;height: var(--border);}
	.border-2 {margin: 10px 0;}

/* Bilder */
	figcaption {height: 150px;position: relative;margin-top: -150px;visibility: hidden;}
	.startseite-flexbox-item img,.ce_swiperStart img {width: 100%;height: 100%;}
	.fotoshooting-detail .previous a {padding-left: 30px;background: url('https://twiinz.de/files/twiinz/theme/pfeil-links.svg');background-position: left;background-repeat: no-repeat;background-size: 18px;}
	.fotoshooting-detail .next a {padding-right: 30px;background: url('https://twiinz.de/files/twiinz/theme/pfeil-rechts.svg');background-position: right;background-repeat: no-repeat;background-size: 18px;}
	.startseite-name .only-mobil-portrait a,.headline-startseite a {padding: 30px 30px 30px 0;background: url('https://twiinz.de/files/twiinz/theme/pfeil-rechts.svg');background-position: right;background-repeat: no-repeat;background-size: 18px;}
	.fotoshooting-detail .previous.empty,.fotoshooting-detail .next.empty {background: none;}
	.news-img img {display: block;width: 24px;height: 24px;}
	.news-img figure {padding: 12px;position: absolute;top: 0;right: 0;border: 2px solid var(--primary);border-radius: 999rem;}
	.ext-zip figure {min-width: 100px;min-height: 100px;}
	.content-gallery img,.img-fullwidth img, img {width: 100%; min-width: 100%;max-width: 100%;height: auto;}
	
/* Nav Burger */
	.nav-burger {margin-top: -10px;}
	.nav-burger .icon-line, .nav-burger .icon-line::after, .nav-burger .icon-line::before {background: var(--primary);}
	.nav-burger.is-active .icon-line::after, .nav-burger.is-active .icon-line::before {background: var(--active);}
	.nav-burger.is-active .i con-line {display: none;}
	body.nav-is-mobile .navigation-main {padding-left: 20px; padding-right: 20px}
	body.nav-is-mobile .navigation-main, body.nav-is-mobile .navigation-main li.active {background: var(--primary);}
	body.nav-is-mobile .navigation-main strong.active {--nav-mobile-color: var(--active);}	
	body.nav-is-mobile .navigation-main a, body.nav-is-mobile .navigation-main strong.active, body.nav-is-mobile .navigation-main strong {font-size: 20px;}
	body.nav-is-mobile .mobil-menu-extra-content {margin: 80px 0 40px 0; padding-left: 10px;}
	
/* Work */
	.beschreibung-1 p,.beschreibung-2 p {max-width: 90%;}
    .beschreibung-3 p {max-width: 70%;}
	.beschreibung-3 {display: flex;flex-direction: row-reverse;justify-content: space-between;}
	.beschreibung-3 div.rte {width: 100%;}
	#fotoshooting-submenu.mod_navigation ul::before {width: 100%;content: 'Check out work';margin-right: 25px;display: block;}
	#fotoshooting-submenu.mod_navigation ul {display: flex;flex-wrap: wrap;gap: calc(var(--spacer) * 1);}
	#fotoshooting-submenu.mod_navigation li a,#fotoshooting-submenu.mod_navigation li.active {display: flex;align-items: center;padding: .4rem .7rem;line-height: 1rem;border: var(--border) solid var(--primary);border-radius: 5rem;}    

/* News */	
	.startseite-name .only-startseite {display: block;}
	.startseite-news-teaser .news-img {position: relative;top: 40px;}
	.startseite-news-teaser .mod_newslist {margin: 0;}
	.startseite-news-teaser .layout_latest {border-bottom: none;}
	.news-latest-inhalt-inside {width: calc(100% - 70px);max-width: calc(100% - 70px);display: flex;flex-direction: column;}
	.news-img {position: relative;}
	.news-content {display: flex;flex-direction: row;}
	.news p.more a {padding-right: 30px;margin-top: 20px;display: inline-block;background: url('https://twiinz.de/files/twiinz/theme/pfeil-rechts.svg');background-repeat: no-repeat;background-position: right;background-size: 18px;}
	.featured h2 a::before {content: 'Latest News:';margin-right: 4px;}
	.news .layout_latest {border-bottom: var(--border) solid var(--primary);}
	.mod_newslist .layout_latest:first-of-type {padding-top: 0;}
	.news .mod_newslist {margin-top: 0;margin-bottom: 0;border: none;}
	.news-footer {border-top: var(--border) solid var(--primary);}
	.news .news_instagram {float: right;}
	.news_instagram img {width: 24px;height: 24px;}

/* Swiper */
	.swiper {visibility: hidden;}
	.swiper.swiper-initialized {visibility: visible;}
	
/* Swiper: Bilder nacheinander laden */	
	.work .swiper-slide {opacity: 0;transform: translateY(20px);animation: fadeIn 0.5s ease forwards;}
	.work .swiper-slide:nth-child(1) { animation-delay: 0.2s;}
	.work .swiper-slide:nth-child(2) { animation-delay: 0.5s;}
	.work .swiper-slide:nth-child(3) { animation-delay: 0.8s;}
	.work .swiper-slide:nth-child(4) { animation-delay: 1.1s;}
	.swiper-wrapper {display: flex;align-items: stretch;}
	.swiper-slide .item,.swiper-slide figure,.swiper-slide a,.swiper-slide picture {display: flex;align-items: center;justify-content: center;width: 100%;height: 100%;object-fit: cover;}
	.swiper-button-prev {display: block;text-align: left;margin-left: 10px !important;}
	.swiper-button-next {display: block;text-align: right;margin-right: 10px;}
	.ce_swiperStart img:hover {cursor: grab;}
	.swiper-button-prev,.swiper-button-next,.swiper-button-next::after,.swiper-button-prev::after {width: 25px;height: 25px;display: block;}
	.swiper-button-prev::after {content: url('https://twiinz.de/files/twiinz/theme/pfeil-links.svg');filter: invert(1);line-height: 0;}
	.swiper-button-next::after {content: url('https://twiinz.de/files/twiinz/theme/pfeil-rechts.svg');filter: invert(1);line-height: 0;}
	.swiper-pagination {width: 100%;min-width: 100%;font-weight: normal;font-size: .7rem;color: var(--white);}
	.swiper-pagination-fraction {display: flex;align-items: center;justify-content: center; bottom: 10px;}
	.swiper-pagination-fraction span {display: flex;justify-content: center;align-items: center;font-weight: normal;font-size: .7rem;color: var(--white);}
	.swiper-pagination-current {padding-right: 3px;}
	.swiper-pagination-total {padding-left: 2px;}
	#swiper-max-height .swiper-slide {flex-shrink: 0;width: 100%;height: auto;position: relative;transition-property: transform;}
	.startseite-flexbox-item:not(:has(.swiper-initialized)) .content-text {opacity: 0;}
	
/* Colorbox */
	#colorbox,#cboxWrapper,#cboxContent,#cboxLoadedContent,#cboxTitle,#cboxCurrent {background: transparent !important;border: 0 !important;box-shadow: none !important;padding: 0 !important;margin: 0 !important;}
	#cboxTopLeft,#cboxTopCenter,#cboxTopRight,#cboxMiddleLeft,#cboxMiddleRight,#cboxBottomLeft,#cboxBottomCenter,#cboxBottomRight {background: transparent !important;width: 0 !important;height: 0 !important;}
	#cboxLoadedContent img {display: block !important;margin: 0 auto !important;background: transparent !important;border: 0 !important;}
	#cboxClose{position: fixed !important;left: auto !important;bottom: auto !important;margin: 0 !important;transform: none !important;z-index: 99999 !important;}
	body:not(.cbox-fadein-ready) #cboxClose {opacity: 0 !important;pointer-events: none !important;}
	body.cbox-fadein-ready #cboxClose {opacity: 1 !important;pointer-events: auto !important;}
	#cboxLoadedContent img.cboxPhoto {opacity: 0;transition: opacity 0.5s ease;}
	body.cbox-fadein-ready #cboxLoadedContent img.cboxPhoto {opacity: 1;}
	@media (prefers-reduced-motion: reduce) {#cboxLoadedContent img.cboxPhoto {transition: none;}}
	#cboxPrevious,#cboxNext {border: none !important;outline: none !important;box-shadow: none !important;}
	#cboxPrevious:focus,#cboxNext:focus,#cboxPrevious:focus-visible,#cboxNext:focus-visible {outline: none !important;box-shadow: none !important;}
	#cboxCurrent {display: none !important;}

/* Flexbox */ 
	.startseite-flexbox-wrapper {display: flex;flex-wrap: wrap;gap: 3px;}
	.startseite-flexbox-item {width: 100%;display: flex;flex-direction: column;flex-grow: 1;flex-shrink: 0;flex-basis: auto;}  
	.fotoshooting-beschreibung-container {column-gap: calc(var(--spacer) * .3);}
	
/* Overlay */
	#cboxOverlay {background: var(--primary);}
	#cboxLoadedContent {border: none;}
	#cboxClose {padding-top: 2px;top: 8px;right: 8px;display: block;background: var(--primary);border: var(--border) solid var(--primary);width: 70px;height: 35px;content: 'Close';text-transform: uppercase;color: var(--white);text-indent: 0;letter-spacing: 1px;}
	#cboxClose:hover {background: none;border: var(--border) solid var(--white);mix-blend-mode: difference;}
	#cboxTitle {position: fixed;mix-blend-mode: difference;}
	#cboxCurrent {position: fixed;top: 60px;left: 20px;}
	#cboxPrevious,#cboxPrevious:hover {background: url('https://twiinz.de/files/twiinz/theme/pfeil-links-weiss.svg');background-position: center;background-repeat: no-repeat;background-size: 18px;}
	#cboxNext,#cboxNext:hover {background: url('https://twiinz.de/files/twiinz/theme/pfeil-rechts-weiss.svg');background-position: center;background-repeat: no-repeat;background-size: 18px;}
	#cboxPrevious:hover,#cboxNext:hover {opacity: .5;}

/* Formular */
	.login [id="wrapper"] {width: 100vw;height: 100vh;display: flex;justify-content: center;align-items: center;}
	.container-login {width: 250px;padding: 0;text-align: center;}
	.container-login.password {padding: 20px 0 0 0;}
	h1.headline-login {margin: 10px 0 20px;}
	label {padding-bottom: 2px;display: block;}
	input {width: calc(100% - 24px);max-width: calc(100% - 24px);padding: 10px;border: var(--border) solid var(--primary);border-radius: 0.1em;}
	.widget-password,.form-link {margin-top: 10px;}  
	.login button.submit {width: 100%;display: inline;padding: 12px 20px;margin-top: 20px;color: var(--white);text-transform: uppercase;border: 2px solid var(--primary);border-radius: 0.1em;letter-spacing: 1px;}
	.login button.submit:hover {color: var(--primary);background: var(--white);cursor: pointer;} 
	.login .error {width: calc(100% - 20px);max-width: calc(100% - 20px);padding: 10px;margin-bottom: 1.5em;color: var(--white);background: var(--primary);}
	p.new-login  {margin-top: 20px;text-align: center;}

/* Kundenbereich */
	.kundenbereich-header {width: 100%;display: flex;flex-direction: row;justify-content: space-between;}
	.kundenbereich button.submit {font-size: 28px;line-height: 30px;background: none;border: none;}
	.kundenbereich button.submit:hover {cursor: pointer;}
	.kundenbereich [id="header"] .inside {border-bottom: var(--border) solid var(--primary);}
	.downloads-default-img li.download-element a,.downloads-img li.download-element a,.downloads-liste li.download-element a {display: flex;flex-direction: column;justify-content: center;align-items: flex-start;}
	.kundenbereich [id="footer"] {border-top: 1px solid var(--primary);}
	.kundenbereich #cboxCurrent {top: 30px;}
	[id="logout"] {position: relative;top: -18px;padding: 8px 10px 10px 10px;border: 2px solid var(--primary);border-radius: 25em;}
	
/* Downloads */
	.downloads-default-img,.downloads-img.content-downloads,.downloads-liste.content-downloads {clear: both;}
	.downloads-default-img ul li a:hover,.download-element a:hover,.downloads-zip li a:hover {text-decoration: underline;color: var(--primary);}
	.download-element a::before {height: 25px;}
	.download-element {display: flex;flex-direction: column-reverse;justify-content: flex-end;}
	.downloads-img .download-element {display: flex;flex-direction: row-reverse;justify-content: flex-end;}	
	.downloads-default-img ul {float: left;}
	.downloads-default-img .download-element figure a:before {margin-right: 0;content: '';}
	.downloads-default-img ul li a:before {margin-right: 4px;content: 'Download:';}
	.download-element,.content-gallery ul li,li.download-element a {width: 100%}
	.download-element {display: flex;flex-direction: column-reverse;gap: calc(var(--spacer) * 2);background: var(--lightgray);}
	.download-element figure a:before,.download-element figure a:hover:before {padding: 0;margin: 0;content: '';}
	.download-element a:before {margin-right: 4px;content: 'Download: ';}
	.download-element a {display: flex;align-items: center;}	

/* Display */
	.layout_latest .info,.fotoshooting-first .previous,.kundenbereich p span.nav-kundenbereich,.login [id="footer"],.fotouebersicht .kundenbereich-abmelden,.news .margin-bottom,.only-startseite,.mod_newslist .empty,.fotoshooting-detail .swiper-container p,.startseite-name .name-default,.mod_navigation li.submenu ul.level_2,.login [id="header"],#logout p.login_info,#login-info button.submit,.kundenbereich-link,#logout h1,a.invisible,.news .news-footer,.border-none .border-1,.swiper-navigation-icon,.startseite .swiper-button-prev, .startseite .swiper-button-next,.startseite .swiper-pagination,.startseite-news-teaser .more,.startseite-news-teaser .border-1,.startseite nav#fotoshooting-submenu,.news nav#fotoshooting-submenu,.default nav#fotoshooting-submenu,.kundenbereich .news-footer,.kundenbereich nav.mod_navigation,.mod_newslist time,.news .layout_latest span.invisible,.swiper-button-disabled,.news .fotoshooting-beschreibung-container {display: none;}
	.darkmode,.kundenbereich .kundenbereich-link {display: block;}  

}

/* -----------------------------------------------------------------------------

	Mobile max. 767px

------------------------------------------------------------------------------*/

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

/* Anpassungen fuer separate Fullwidth-Darstellung */
	[id="header"],[id="footer"] .inside,.content-headline,.mod_newslist,.startseite h1,.default h1,.startseite-news-teaser,.only-mobil-portrait,.fotoshooting-beschreibung-container,.rte,.download-element a,.downloads-img h2,.downloads-liste h2,.content-gallery h2,.downloads-default-img h2,.downloads-default-img li a,#fotoshooting-submenu,.kundenbereich h2 {width: auto;margin-left: 20px;margin-right: 20px;}
	.rte h1,.fotoshooting-beschreibung-container .rte,h1.headline-login,.download-element a,.downloads-default-img li figure a,.startseite .only-mobil-portrait .rte,.startseite p.only-mobil-portrait,.startseite span.only-mobil-portrait,.kundenbereich h1 {margin-left: 0;margin-right: 0;}
	.login-logo {padding-top: 4px;}
	.startseite .news-footer,.news .news-footer {padding-top: 0;border-top: none;}
	.mod_newslist .layout_latest:last-of-type {border-bottom: none;}
	
/* Schrift */
	.news-headline h1,.slogan {padding-left: 20px;}
	.news-headline h1 {margin-bottom: 25px;}
	.startseite h2 a:before {content: 'Work';margin-right: 4px;}

/* News */
	.startseite.news .mod_newslist .news-default h2 a::before {content: 'News:';margin-right: 4px;}
	
/* Work */
	.beschreibung-3 figure {min-width: 53px!important;max-width: 53px!important;}
	
/* Colorbox */
	#cboxPrevious {left: 10px;scale: 1.5;}
	#cboxNext {right: 10px;scale: 1.5;}
	#cboxTitle {display: block;}
    #cboxClose {top: 10px,right: 10;scale: .8;}

}

/* -----------------------------------------------------------------------------

	Tablet 768px

------------------------------------------------------------------------------*/

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

:root {--border: .08rem;}

/* Layout */
	body {line-height: 1.4rem;}
	[id="wrapper"] {padding: 40px 70px 80px 70px;}
	.startseite-name [id="footer"] {margin-top: 0;}
	.fotoshooting-detail [id="footer"] {margin: 40px 0;}
	.fotoshooting-beschreibung {margin-top: 15px}
	.startseite-news-teaser h2 a::before {content: '';margin-right: 0;}
	.headline-startseite p {margin-left: 0;margin-right: 0;}
	[id="footer"] {line-height: 1.2rem;}
	
/* Schriftgröße */
    h1,h2,h3,h4,.work .beschreibung-1 p,.mod_newslist h2,p.login_info,.startseite-name h2 a,p,ul,li,input,label,button.submit,.passwort-vergessen p,.mod_newslist,[id="footer"] a,.startseite-beschreibung h2 a,#cboxClose,.link-latest-news-bottom,[id="footer"] p,[id="footer"] a,.beschreibung-1 h1,.fotoshooting-detail h2,.fotoshooting-detail h3,#cboxTitle,#cboxCurrent {font-size: .9rem;}

/* Margin */
	.kundenbereich .formbody,.kundenbereich button.submit {margin-top: var(--space-0);}
	.mod_newslist {margin-top: calc(var(--spacer) * 4);}
	.work .beschreibung-1,.work .beschreibung-2,.work .beschreibung-3,.news-img {margin-bottom: var(--space-0);}
	.startseite-flexbox-item p {margin-bottom: calc(var(--spacer) * 3);}
	
/* Liste */
    #fotoshooting-submenu ul.level_1::before {display: block;}
    
/* Nav Burger */
	body.nav-is-mobile .navigation-main {padding-left: 15vw;padding-right: 15vw}

/* Work */
	.fotoshooting-beschreibung-container {flex-wrap: wrap;}
	.fotos-uebersicht p {display: block;}
	.fotoshooting-beschreibung-container {width: 100%;display: flex;flex-direction: column;}
	.beschreibung-2 {display: flex;flex-direction: column;}
	.fotoshooting-beschreibung-container {flex-direction: row;}
	.beschreibung-1,.beschreibung-2,.beschreibung-3 {width: 33%;margin: 0;}
	.beschreibung-3 figure {right:0;}
    
/* Flexbox */ 
	.startseite-flexbox-item {width: 33%;max-width: 33%;}

/* News */
	.news p.more a {padding-right: 0;background: none;}
	.news .mod_newslist:last-of-type {border: none;}
	.news-latest-inhalt-inside {width: calc(100% - 80px);max-width: calc(100% - 80px);}

/* Swiper */
	.swiper-wrapper {display: flex;align-items: center;}
	.swiper-bilder-vertikal .swiper-slide {height: auto;}
	.swiper-bilder-vertikal .item.content-image {width: 100%;align-items: center;justify-content: center;}
	.swiper-bilder-vertikal .item.content-image figure,.swiper-bilder-vertikal .item.content-image a,.swiper-bilder-vertikal .item.content-image picture {width: 100%;align-items: center;justify-content: center;margin: 0;}
	.swiper-bilder-vertikal .item.content-image img {display: block;margin: 0 auto;}
	.swiper-pagination {width: calc(100% - 10px);min-width: calc(100% - 10px);}
	.swiper-pagination-fraction {bottom: 40px;}
	
/* Colorbox */
	#cboxTitle {top: 30px;left: 20px;display: block;}
	#cboxClose {top: 20px !important;right: 20px !important;}

/* Formular */
	.container-login {padding: 40px;border: var(--border) solid var(--primary);border-radius: 0.1em;}

/* Kundenbereich */
	.kundenbereich [id="main"] li {padding-right: 0;line-height: 0;}
	.kundenbereich button.submit:hover {color: var(--gray);}
	.kundenbereich ul {display: flex;flex-wrap: wrap;gap: 3px;}
	.kundenbereich li {display: flex;flex-direction: column;flex-grow: 1;flex-shrink: 0;flex-basis: auto;width: 100%;}
	.kundenbereich .content-gallery li {width: 33%;max-width: 33%;display: flex;flex-direction: column;flex-grow: 1;flex-shrink: 0;flex-basis: auto;}

/* Display */    
	.startseite-news-teaser p,.startseite-name .swiper-button-prev,.startseite-name .swiper-button-next,.startseite-mobil,#logout p.login_info,.startseite-news-teaser .news-img,[id="header"] .kontakt {display: none;}
	.startseite-name #footer .mod_customnav, .work nav#fotoshooting-submenu {display: block;}	

}

/* -----------------------------------------------------------------------------

	Tablet 940px

------------------------------------------------------------------------------*/

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

/* Layout */
	body {font-size: 1rem;line-height: 1.1rem;text-transform: uppercase;}
	[id="wrapper"] {padding-bottom: 40px 40px 5vh 40px;}
	[id="header"] {line-height: 1.4rem;}
	.instagram figure:hover,.news-img figure:hover,.beschreibung-3 figure:hover {opacity: .5;}
	.news-img {top: 44px;}
	.fotoshooting-beschreibung {margin-top: 0;}
	.headline-startseite.art-photography h1 {margin-bottom: calc(var(--spacer) * 2);}
	.startseite .headline-startseite {border-bottom: 0px solid var(--primary);}
	.headline-startseite {border-bottom: 1px solid var(--primary);}

/* Schriftgröße */
	h1,.slogan p {font-size: .9rem;}
	h2,h3,h4,.work .beschreibung-1 p,.mod_newslist h2,p.home {font-size: .7rem;}
	.startseite-name h2 a,p,ul,li,input,label,button.submit,.passwort-vergessen p,.mod_newslist,[id="footer"] a,.startseite-beschreibung h2 a,#cboxClose,.link-latest-news-bottom,[id="footer"] p,[id="footer"] a,.beschreibung-1 h1,.fotoshooting-detail h2,.fotoshooting-detail h3,.downloads-img.content-downloads li a,.downloads-liste.content-downloads li a,#cboxTitle,#cboxCurrent,.mod_newslist h2,p.login_info,.fotoshooting-detail h1 {font-size: .7rem;}
	.headline-startseite h1 {line-height: 0;}

/* Links */
	.fotoshooting-detail .ce_swiperStart figure {pointer-events: auto;}
	
/* Margin */	
	.fotoshooting-beschreibung-container,.mod_newslist.first,.kundenbereich [id="footer"],.headline-startseite h1 {margin-top: var(--spacer-0);}
	[id="footer"],[id="footer"] .mod_navigation,[id="footer"] .footer-kontakt,.fotoshooting-detail [id="footer"],.fotoshooting-detail .footer-kontakt,.startseite-img,.margin-top,.passwort-vergessen p,.startseite-news-teaser h2,.border-top,.mod_newslist,.margin-headline h2,.margin-headline h3,.margin-headline h4,.content-gallery ul,.downloads-default-img ul li figure,.kundenbereich h2,.footer-contact,.news .ce_swiperStart,#fotoshooting-submenu {margin-top: calc(var(--spacer) * 1.75);}
	[id="footer"] .mod_navigation {padding-top: calc(var(--spacer) * 1.75);}
	.kundenbereich [id="header"],.beschreibung-1,[id="header"] .inside,.mod_newslist.first,.headline-startseite h1,.headline-startseite h1,.work .beschreibung-1,.work .beschreibung-2 {margin-bottom: var(--spacer-0);}
	[id="header"],.margin-bottom,.kundenbereich .border-1,.fotoshooting-beschreibung-container,.container-login,.startseite-news-teaser p,.border-top,.mod_newslist,.layout_latest p.more,.news [id="footer"] .mod_customnav,.margin-headline h2,.margin-headline h3,.margin-headline h4,.border-none .layout_latest p.more,#slider-news,p.home,.kundenbereich-header,.downloads-default-img ul,.downloads-img.content-downloads ul,.downloads-liste.content-downloads ul,.downloads-img h2,.downloads-liste h2,.content-gallery ul,.kundenbereich [id="header"] h1,.headline-startseite,.kundenbereich p.login_info,.kundenbereich h2,.slogan,.startseite-flexbox-item p {margin-bottom: calc(var(--spacer) * 1.75);}

/* Padding */		
	.mod_newslist .layout_latest,.news-footer {padding-top: calc(var(--spacer) * 1.75);}
	
/* Flexbox */
    .startseite-flexbox-item {width: calc(25% - 3px);max-width: calc(25% - 3px);}
	
/* Work Subnavigation */	
	#fotoshooting-submenu.mod_navigation {padding: 0;border-top: none;}
	#fotoshooting-submenu.mod_navigation ul::before {width: auto;content: 'Work';margin-right: 4px;}
	#fotoshooting-submenu.mod_navigation ul {align-items: center;gap: calc(var(--spacer) * 1.5);}
	#fotoshooting-submenu.mod_navigation li a {display: inline-block;padding: 0;border: none;border-radius: 0;}
	#fotoshooting-submenu.mod_navigation li.active {display: inline-block;padding: 4px 10px;}

/* News */	
	.news-img {top: 4px;}
	.border-none .border-1 {display: block;}
	.news p.more a {margin-top: 5px;}
	.news-img figure {padding: 0;border: none;border-radius: 0;}
	
/* Kundenbereich */
	.download-element a::before {height: 20px;}
	
/* Display */
	.headline-startseite p,.swiper-scrollbar,.swiper-pagination-fraction {display: none;}
	.border-none .border-1 {display: block;}
	
}

/* -----------------------------------------------------------------------------

	Desktop 1024px

------------------------------------------------------------------------------*/
 
@media screen and (min-width: 1024px) {

/* Layout */
	[id="wrapper"] {padding: 30px 40px 80px 40px;}

/* Links */
	h2 a:hover,p a:hover,li a:hover {color: var(--primary);border-bottom: var(--border) solid var(--primary);cursor: pointer;}
	#fotoshooting-submenu li a:hover {color: var(--primary);border-bottom: var(--border) solid var(--primary);border-radius: 0;cursor: pointer;line-height: .8rem;}
	.startseite-flexbox-item:hover h2 a {border-bottom: var(--border) solid var(--primary);}
	.kundenbereich li a:hover {border-bottom: 0;}
	
/* Image Zoom on Hover */	
	.startseite-flexbox-item img,.swiper-slide img {transition-duration: .4s;} 
	.startseite-flexbox-item img:hover,.swiper-slide:hover img {transform: scale(1.1);}
	.swiper-slide,.swiper-slide .content-image {overflow: hidden;}

/* Margin */	
	.fotoshooting-detail [id="footer"] {margin-top: var(--space-0);}
	[id="footer"],.startseite-img,.margin-top,.passwort-vergessen p,.startseite-news-teaser h2,.border-top,.margin-headline h2,.margin-headline h3,.margin-headline h4,#slider-news,.content-gallery ul,.downloads-default-img ul li figure,.kundenbereich h2,[id="footer"] .mod_navigation,.footer-contact,.news .ce_swiperStart {margin-top: calc(var(--spacer) * 1.75);}
	.startseite-flexbox-item p,#fotoshooting-submenu {margin-bottom: 0;}
	[id="header"],.margin-bottom,.kundenbereich .border-1,.fotoshooting-beschreibung-container,.startseite-news-teaser p,.border-top,[id="footer"] .mod_customnav,.news [id="footer"] .mod_customnav,.margin-headline h2,.margin-headline h3,.margin-headline h4,.border-none .layout_latest p.more,p.home,.kundenbereich-header,.downloads-default-img ul,.downloads-img.content-downloads ul,.downloads-liste.content-downloads ul,.downloads-img h2,.downloads-liste h2,.content-gallery ul,.kundenbereich [id="header"] h1,.mod_newslist,.layout_latest p.more,.headline-startseite,.fotoshooting-beschreibung-container,[id="footer"],.startseite-img,.margin-top,.passwort-vergessen p,.startseite-news-teaser h2,.border-top,#slider-news,.content-gallery ul,.downloads-default-img ul li figure,.kundenbereich h2,[id="footer"] .mod_navigation,.footer-contact,.news .ce_swiperStart {margin-bottom: calc(var(--spacer) * 1.75);}

/* Padding */		
	[id="footer"] .mod_navigation,#fotoshooting-submenu,.mod_newslist .layout_latest {padding-top: calc(var(--spacer) * 1.75);}
	.news-footer {padding-top: calc(var(--spacer) * 2);}
	
/* Mouseover Submenu work */
	#header::after {content: ""; position: fixed;inset: 0;
	    background: linear-gradient(to bottom,rgba(255,255,255,.80) 0%,rgba(0,0,0,.20) 100%);backdrop-filter: blur(40px);-webkit-backdrop-filter: blur(40px);/* Safari */ opacity: 0;transition: opacity .35s ease; pointer-events: none;z-index: 100;}
	#header:has(.navigation-header .level_1 > li.submenu:hover)::after {opacity: 1;}
	.navigation-header {position: relative;z-index: 101;}
	body.nav-is-desktop .navigation-main strong:not(.does-not-exist), body.nav-is-desktop .navigation-main a.trail, body.nav-is-desktop .navigation-main a:hover {color: var(--active);}	
	body.nav-is-desktop .navigation-main a {color: var(--primary); border-bottom: none;}
	body.nav-is-desktop .navigation-main {margin-top: -9px;}
	body.nav-is-desktop .navigation-main a, body.nav-is-desktop .navigation-main strong:not(.does-not-exist) {font-size: 27px;}
	body.nav-is-desktop .navigation-main .level_1 > li.submenu {padding: 0px;}
	body.nav-is-desktop .navigation-main .li.li {padding: 0px}
	body.nav-is-desktop .btn-toggle-submenu {display: none;}
	body.nav-is-desktop .navigation-main ul ul li:not(:last-of-type) {border-bottom: none;}
	body.nav-is-desktop .navigation-main .level_1 ul a, body.nav-is-desktop .navigation-main .level_1 ul strong {padding:9px 15px;}
	body.nav-is-desktop .navigation-main ul ul li a:hover {color: var(--primary);text-decoration: underline;text-decoration-thickness: 1px;}
	body.nav-is-desktop .navigation-main .level_1 ul a, body.nav-is-desktop .navigation-main .level_1 ul strong {font-size: .9rem;}
	body.nav-is-desktop .mobil-menu-extra-content,[id="header"] .hide-header-menu {display: none;}	

/* Work */  
	.ce_text.beschreibung-1 p {width: 62%;}
	
/* News */
	.startseite-flexbox-wrapper .news-latest-inhalt-inside {width: 100%;}
    .news-img {top: 4px;}
	.news .mod_newslist a {border-bottom: var(--border) solid var(--white);}
	.news .mod_newslist h2 a:hover,p.more a:hover {border-bottom: var(--border) solid var(--primary);}

/* Flexbox */
	.startseite-flexbox-item {width: calc(20% - 3px);max-width: calc(20% - 3px);}
	.startseite-flexbox-item p {padding-right: 10px;}

/* Kundenbereich */
	[id="logout"] {top: -8px;}	

}

/* -----------------------------------------------------------------------------

	Desktop 1200px

------------------------------------------------------------------------------*/

@media screen and (min-width: 1200px) {
	
	:root {--border: .07rem;}
	@keyframes fadeIn {to {opacity: 1;transform: translateY(0);}}

/* Swiper-Elemente auf der Startseite nacheinander einfaden */
	.startseite-flexbox-item {opacity: 0;transform: translateY(10px);animation: fadeIn 0.4s ease forwards;animation-delay: calc(var(--i) * .3s);}

/* Padding */
	.news-footer {padding-top: calc(var(--spacer) * 2.5);}

/* Flexbox */
	.startseite-flexbox-item {width: calc(12.5% - 3px);max-width: calc(12.5% - 3px);}
    
/* Kundenbereich */
	.kundenbereich [id="wrapper"] {max-width: 1100px;padding: 40px 0;margin-left: auto;margin-right: auto;}
	.kundenbereich .content-gallery li {width: calc(25% - 3px);max-width: calc(25% - 3px);}

}

/* -----------------------------------------------------------------------------

	Desktop 1400px

------------------------------------------------------------------------------*/

@media screen and (min-width: 1400px) {
	
	:root {--spacer : .4rem;}	
    
/* Margin */
	[id="footer"],.startseite-img,.margin-top,.passwort-vergessen p,.startseite-news-teaser h2,.border-top,.margin-headline h2,.margin-headline h3,.margin-headline h4,#slider-news,#fotoshooting-submenu,.content-gallery ul,.downloads-default-img ul li figure,.kundenbereich h2,[id="footer"] .mod_navigation ,.footer-contact,.news .ce_swiperStart {margin-top: calc(var(--spacer) * 2.5);}
	[id="header"],.margin-bottom,.kundenbereich .border-1,.startseite-news-teaser p,.border-top,[id="footer"] .mod_customnav,.news [id="footer"] .mod_customnav,.margin-headline h2,.margin-headline h3,.margin-headline h4,.border-none .layout_latest p.more,p.home,.kundenbereich-header,.downloads-default-img ul,.downloads-img.content-downloads ul,.downloads-liste.content-downloads ul,.downloads-img h2,.downloads-liste h2,.content-gallery ul,.kundenbereich [id="header"] h1,.mod_newslist,.layout_latest p.more {margin-bottom: calc(var(--spacer) * 2.5);}

/* Padding */
	[id="footer"] .mod_navigation, .mod_newslist .layout_latest {padding-top: calc(var(--spacer) * 2.5);}
	
/* Work */ 
	.beschreibung-1 {width: calc(50% - 4px);}
	.beschreibung-2 {width: calc(25% - 4px);}
	.beschreibung-3 {width: 25%;}

}

/* -----------------------------------------------------------------------------

	Desktop 1500px

------------------------------------------------------------------------------*/

@media screen and (min-width: 1500px) {
	
/* Layout */
	body {letter-spacing: .02rem;}

/* Header, Instagram default */
	.instagram img {padding-top: 0;}
	.news-img {top: 45px;}
	
/* Margin */
	[id="footer"],.startseite-img,.margin-top,.passwort-vergessen p,.startseite-news-teaser h2,.border-top,.margin-headline h2,.margin-headline h3,.margin-headline h4,#slider-news,#fotoshooting-submenu,.content-gallery ul,.downloads-default-img ul li figure,.kundenbereich h2,[id="footer"] .mod_navigation,.footer-contact,.news .ce_swiperStart {margin-top: calc(var(--spacer) * 2);}
	.margin-bottom,.kundenbereich .border-1,.fotoshooting-beschreibung-container,.startseite-news-teaser p,.border-top,[id="footer"] .mod_customnav,.news [id="footer"] .mod_customnav,.margin-headline h2,.margin-headline h3,.margin-headline h4,.border-none .layout_latest p.more,p.home,.kundenbereich-header,.downloads-default-img ul,.downloads-img.content-downloads ul,.downloads-liste.content-downloads ul,.downloads-img h2,.downloads-liste h2,.content-gallery ul,.kundenbereich [id="header"] h1,.mod_newslist,.layout_latest p.more,.headline-startseite,.slogan {margin-bottom: calc(var(--spacer) * 2);}

/* Padding */		
	.news-footer {padding-top: calc(var(--spacer) * 2.5);}
	[id="footer"] .mod_navigation, .mod_newslist .layout_latest {padding-top: calc(var(--spacer) * 2);}
    
/* Flexbox */
	.startseite-flexbox-item {width: calc(11.11% - 3px);max-width: calc(11.11% - 3px);}

/* News */	
	.news-img {top: 4px;}

}

/* -----------------------------------------------------------------------------

	Desktop 1900px

------------------------------------------------------------------------------*/

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

/* Flexbox */
	.startseite-flexbox-item {width: calc(12.5% - 3px);max-width: calc(12.5% - 3px);}
	
/* Work */
	.beschreibung-3 p {max-width: 100%;}

}

/* -----------------------------------------------------------------------------

	Desktop 2000px

------------------------------------------------------------------------------*/

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

/* Layout */
	[id="wrapper"] {width: 84vw;padding-left: 14vw;}

}

/* -----------------------------------------------------------------------------

	Displayeinstellungen fuer Media Querries

------------------------------------------------------------------------------*/

/* Mobile */
@media screen and (min-width: 100px) {
  
/* Display */
	.only-mobil,.only-mobil-and-tablet-portrait,.until-desktop {display: block;}
	.from-tablet-portrait,.from-tablet-landscape,p.from-tablet-landscape,.from-desktop,.only-tablet-portrait,.menu-slogan,.large-devices,.from-mobil-landscape,.startseite .startseite-from-tablet-portrait {display: none;}
 
}

@media screen and (max-width: 767px) and (orientation: portrait) {  
	
/* Display */
	.only-mobil-portrait {display: block;}

}

/* Tablet ------------------------------------------------------------------- */
@media screen and (min-width: 768px) {
 
/* Display */ 
	.from-tablet-portrait,.only-tablet-portrait,.from-mobil-landscape,.menu-slogan,.startseite .startseite-from-tablet-portrait {display: block;}
	.only-mobil,.only-mobil-portrait {display: none;}

}

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

/* Display */ 	
	.from-tablet-landscape,p.from-tablet-landscape,.from-desktop {display: block;}
	.only-tablet-portrait,.only-mobil-and-tablet-portrait,.until-desktop {display: none;}

}