/*
 * Responsive CSS 089-Webdesign
 */

@media(width: 320px) {

}

@media(width: 480px) {
	
}

@media(width: 600px) {
	
}

@media(width: 768px) {
	
}

@media(width: 800px) {
	
}

@media(width: 1024px) {
	
}
@media(max-width: 767px) {
	body#body {
	    padding-right: 0px;
	    padding-left: 0px;
	}
}
@media(max-width: 880px) and (orientation: portrait) {
	body#body.phone.start .above-the-fold {
	    background-position: 45% 50%;
	}	
	body#body.phone .header--img--container {
	    height: 120px;
	}
	body#body.phone .header--img--container img {
	    -o-object-fit: cover;
	    object-fit: cover;
	    width: 100%;
	    height: 100%;
	    object-position: right;
	}	
	body#body.phone .start-header-container img {
	    position: initial; 
	}		
	/*body#body.phone.medien .phone-header {
		background: url('/images/pichelmaier-medien-mobile.jpg') top left no-repeat;
		background-size: cover;
	}
	body#body.phone.rauchwarnmelder .phone-header {
		background: url('/images/pichelmaier-rauchmelder-mobile.jpg') top left no-repeat;
		background-size: cover;
	}
	body#body.phone.tresore .phone-header {
		background: url('/images/pichelmaier-tresor-mobile.jpg') top left no-repeat;
		background-size: cover;
	}
	body#body.phone.beschilderungen .phone-header {
		background: url('/images/pichelmaier-beschilderungen-mobile.jpg') top left no-repeat;
		background-size: cover;
	}
	body#body.phone.briefkastenanlagen .phone-header {
		background: url('/images/pichelmaier-briefkasten-mobile.jpg') top left no-repeat;
		background-size: cover;
	}
	body#body.phone.absicherungen .phone-header {
		background: url('/images/pichelmaier-absicherungen-mobile.jpg') top left no-repeat;
		background-size: cover;
	}
	body#body.phone.schliesszylinder .phone-header {
		background: url('/images/pichelmaier-schliesszylinder-mobile.jpg') top left no-repeat;
		background-size: cover;
	}
	body#body.phone.schliessanlagen .phone-header {
		background: url('/images/pichelmaier-schliessanlagen-mobile.jpg') top left no-repeat;
		background-size: cover;
	}
	body#body.phone.produkte .phone-header {
		background: url('/images/pichelmaier-produkte-mobile.jpg') top left no-repeat;
		background-size: cover;
	}
	body#body.phone.schluesselnotdienst .phone-header {
		background: url('/images/pichelmaier-notdienst-mobile.jpg') top right no-repeat;
		background-size: cover;
	}*/
	body.phone:not(.no-portrait-img) .article-body {
	    padding-top: 30px;
	}
/*	body#body.not_home.phone:not(.no-portrait-img) .page-header {
	    position: absolute;
	    top: 40vh;
	}*/
/*	body#body.not_home.phone:not(.no-portrait-img) .phone-header {
		position: relative;
	    height: 100vh;
	    width: 100%;
	}*/
/*	body.not_home.phone:not(.no-portrait-img) header#header {
	    display: none;
	}*/
	body.phone.kontakt.no-portrait-img .header--img--container {
	    height: 80px;
	}
	body#body.phone.kontakt.no-portrait-img .header--img--container img {
	    -o-object-position: -70px 0px;
	    object-position: -70px 0px;
	}
}
@media(max-width: 880px) and (orientation: landscape) {
	body#body.phone .content-flex-container {
	    width: 70%;
	    margin-left: auto;
	    margin-right: auto;
	}
}
@media(max-width: 880px) {
	/*critical*/
	body.phone .start-header-container img {
	    -webkit-filter: brightness(0.5);
	            filter: brightness(0.5);
	}
	body#body.start.phone .above-the-fold:after {
	    background: linear-gradient(to bottom, rgba(85, 115, 176, 0.4) 30%,rgba(255, 255, 255, 0.5) 100%);
	}
	body.phone .service-start .nav-kachel--item__container {
	    margin-bottom: 50px;
	}
	body#body.phone .service-start .nav-kachel--item {
	    width: 320px;
	    margin-left: auto;
	    margin-right: auto;
	}
	body#body.mobile.start .content-bottom--flex-item h2 {
		min-height: initial;
	}
	body#body.phone.start .content-bottom--flex-item {
	    margin-bottom: 60px;
	}
	body#body.phone.start .below-the-fold .top-bellow-content h2 {
		font-size: 24px;
	}
	body#body.phone.start .below-the-fold h2 {
		font-size: 21px;
	}
	body#body.phone .team-row__item {
	    width: 240px;
	    margin: 30px auto;
	    position: relative;
	}
	body#body.phone .prod-vertical .content-flex--item {
	    margin-bottom: 80px;
	}
	body#body.phone .content-flex--item h2 {
		font-size: 18px;
	}
	body#body.phone .faq .nav-kachel--text h2:after,
	body#body.phone .prod-horizontal .content-flex--item h2:after{
		content: initial;
	}
	body#body.phone .content-flex--item__img {
	    margin-bottom: 30px;
	}
	body#body.phone .content-flex-container {
	    margin-top: 30px;
	    margin-bottom: 30px;
	}	
	body#body.phone .content-header {
		font-size: 24px;
	}
	body#body.phone .navbar-wrapper p.tel {
		font-size: 14px;
		text-decoration: underline;
		letter-spacing: 0.5px;
	}
	body#body.phone a.brand img {
	    height: 60px;
	}
	body#body.phone .prod-vertical .content-flex--item h2 {
	    margin: 20px 0px;
	}
	body#body.phone .content-flex--item {
	    margin-bottom: 60px;
	}
	body#body.phone .produkte-content .content-flex--item img {
	    max-height: 264px;
	    max-width: 280px;
	}
	body#body.mobile.phone nav.navbar-wrapper .vcard {
	    padding: 10px 20px 0px 20px;
	}
	body#body.start.mobile.phone nav.navbar-wrapper {
	    position: relative;
	}	
	body#body.start.phone .content {
	    width: 100%;
	}	
	body.phone .navbar {
	    position: absolute;
	    z-index: 4;
	    right: 0;
	    top: 20px;
	}
	body#body.phone .navbar .nav {
	    background: #fff;
	    box-shadow: 0px 10px 30px -20px;
	    margin: 0px 0px 20px 20px;
	}	
	body#body.mobile.phone .item-page.start h1 {
	    font-size: 26px;
	}
	body#body.phone.start .content {
	    height: 80%;
	}
	body#body.mobile.phone .item-page.start h2 {
	    font-size: 21px;
	    line-height: 1.8em;
	    font-weight: bold;
	}
	body#body.phone .start-header-container img {
	    height: 100px;
	}	
	/*non.critical*/
	body#body.mobile.phone #ap_ajax_qc_87 label#dsgvo_label,
	body#body.mobile.phone #ap_ajax_qc_87 .datenschutzHint {
		font-size: 12px;
		letter-spacing: initial;
		line-height: initial;
	}
	body.kontakt .ap-btn {
	    width: 150px;
	    padding: 10px 20px;
	}
	body.phone.kontakt form {
	    padding: 20px;
	}	
	body#body.phone.referenzen .content-flex--item ul {
	    padding: 0px;
	}
	body#body.phone.referenzen .content-flex--item:first-child {
	    margin-bottom: 0px;
	}
	body.phone .bottom-slogan h2 {
	    font-size: 18px;
	}	
	body#body.phone .twoColumn--container__text h2 {
	    font-size: 21px;
	}
	body.phone .footer-nav--item h4 {
	    margin-bottom: 15px;
	}
	body.phone .footer-nav--container {
	    text-align: center;
	}
	body.phone .footer-nav--item {
	    margin-bottom: 60px;
	}
	body.phone.impressum .item-page h2,
	body.phone.datenschutz .item-page h2 {
	    font-size: 18px;
	}
	body.phone.no-portrait-img p,
	body.phone.no-portrait-img ul li {
	    font-size: 12px;
	}	

	
}
@media(max-width: 1280px) {
	body.desktop .innerwidth {
		padding-left: 30px;
		padding-right: 30px;
	}
}
@media(max-width: 1366px) and (orientation: portrait) {
	/*critical*/
	body#body.tablet .custom.modal-start {
		top: 50vh;
	}	
	body.tablet .prod-horizontal .content-flex--item__img {
	    flex-basis: 40%;
	}
	body.tablet .prod-horizontal .content-flex--item {
		flex-basis: 60%;
	}

	/*non-critical*/
	body.tablet .twoColumn--container__image img {
	    -o-object-fit: cover;
	       object-fit: cover;
	    width: 100%;
	    height: 100%;
	}	
	body.tablet .twoColumn--container__image {
	    height: 200px;
	}
	body.tablet .fachgeschaeft .flex {
	    -webkit-box-orient: vertical;
	    -webkit-box-direction: normal;
	        -ms-flex-direction: column;
	            flex-direction: column;
	}
	body.tablet .fachgeschaeft .twoColumn--container__text {
	    padding: 10px 0px 10px 0px;
	    text-align: center;
	}
	body#body.mobile .content-bottom--flex-item h2,
	body.tablet .service-start .nav-kachel--text h2 {
	    font-size: 16px;
	}	
}
@media(max-width: 1366px) {
	/*critical*/
	body#body.not_home.phone .navbar {
	    position: relative;
	    top: 0px;
	    margin: 0px;
	}	
/*	body.phone h2.first-color.null1-18 {
	    text-shadow: 1px 2px 3px #909090;
	}*/
	body.mobile .nav-collapse .nav>li>a {
	    margin-bottom: 0px;
	    margin-top: 0px;
	}	
	body#body.tablet .custom.modal-start {
	    -webkit-transform: scale(0.8) translateX(50px);
	        -ms-transform: scale(0.8) translateX(50px);
	            transform: scale(0.8) translateX(50px);
	    z-index: 3;
	}	
	body#body.mobile .navbar li.active.dropdown.parent>a,
	body#body.mobile .navbar li.active.current>a {
	    color: #fff;
	    background-color: #5573b0;
	}	
	body#body.mobile .navbar .btn-navbar .icon-bar {
	    background-color: var(--first-color);
    }	
	body.mobile .content-flex--item p,
	body.mobile .prod-horizontal .content-flex--item h2 {
	    padding-right: 0px;
	}
	body.mobile header#header {
		clear: both;
	}
	body.mobile .breadcrumb {
	    padding: 8px 0px 8px 20px;
	}
	body#body.mobile .attent-getter {
	    font-size: 18px;
	}
	body#body.tablet .item-page .article-body>h2 {
	    font-size: 21px;
	}
	body.phone .item-page h2 {
	    font-size: 24px;
	}	
	body.tablet h2 {
	    font-size: 26px;
	}	
	body.mobile.not_home .item-page,
	body.mobile.not_home .custom.footer-nav {
		padding-left: 20px;
		padding-right: 20px;
	}
	body#body.mobile nav.navbar-wrapper {
	    position: absolute;
	    width: 100%;
	    opacity: 1;
	    box-shadow: 0px 2px 40px -15px rgba(74,74,74,0);
	    transform: translateY(0px);
	    animation: fadein 1s ease forwards;
	    transition: all 0.5s ease;
	    z-index: 2;
	}	
	body#body.mobile .navbar .nav>.active>a,
	body#body.mobile .navbar .nav>.active>a:hover,
	body#body.mobile .navbar .nav>.active>a:focus {
		color: var(--second-color);
	}	
	body#body.mobile .navbar .nav>li:not(.active)>a,
	body#body.mobile ul.nav-child.dropdown-menu li a {
	    color: #5573b0;
	}	
	body#body.tablet .start-header-container img {
	    left: 80px;
	    height: 120px;
	    top: 60px;
	}	
	body#body.mobile .item-page.start h2 {
	    font-size: 26px;
	    line-height: 1.6em;
	}
	body#body.mobile .item-page.start h1 {
	    color: #fff;
	    font-size: 36px;
	}
	body.mobile .navbar-wrapper .vcard .tel {
	    padding-top: 5px;
	}
	body.mobile .navbar-wrapper .vcard p {
	    margin-bottom: 5px;
	    line-height: 1em;
	    font-size: 12px;
	}	
	body#body.mobile nav.navbar-wrapper .vcard {
	    padding: 20px 20px 0px 20px;
	}
	body#body.mobile p.photo {
	    padding: 0px 20px 10px 0px;
	}	
	body.mobile.start .below-the-fold .custom {
	    padding: 0px 20px;
	}
	body.mobile ul.nav-child.dropdown-menu {
	    display: block;
	}
	body.mobile .navbar .nav > li {
	    display: block;
	}
	body#body.tablet .nav-collapse, body#body.tablet .nav-collapse.collapse {
	    height: 0!important;
	    overflow: hidden!important;
	    padding: 0 0 80px 20px;
	}
	body.tablet .nav-collapse.collapse {
	    position: absolute;
	    right: -30px;
	    top: 0;
	    width: 80%;
	}
	body.tablet .nav-collapse {
	    clear: both;
	}
	body.tablet .nav-collapse ul.nav.menu.nav-pills {
	    background: #fff;
	    width: 100%;
	    top: 60px;
	    -webkit-box-shadow: 0 14px 30px -11px rgba(74,74,74, 0);
	    box-shadow: 0 14px 30px -11px rgba(74,74,74, 0);
	    border-radius: 0 0 0 10px;
	    padding: 30px 0 10vh;
	    -webkit-transform: translateX(100%);
	    -ms-transform: translateX(100%);
	    transform: translateX(100%);
	    -webkit-transition: all 0.3s;
	    -o-transition: all 0.3s;
	    transition: all 0.3s;
	}
	body#body.tablet .nav-collapse.collapse,
	body#body.tablet .nav-collapse {
	    height: auto!important;
	}
	body.tablet .nav-collapse.openMenu ul.nav.menu.nav-pills {
	    -webkit-box-shadow: 0 14px 30px -11px rgba(74,74,74, 1);
	    box-shadow: 0 14px 30px -11px rgba(74,74,74, 1);	    
	    -webkit-transform: translateX(0);
	    -ms-transform: translateX(0);
	    transform: translateX(0);
	    -webkit-transition: all .5s ease-in-out;
	    -o-transition: all .5s ease-in-out;
	    transition: all .5s ease-in-out;	    
	}
	body.tablet .navbar .nav>li {
	    display: block;
	    float: none;
	}
	body.tablet .navbar .btn-navbar {
	    display: block;
	    position: relative;
	    z-index: 1;
	}
	body.tablet .navbar {
	    margin: 0 30px 0 auto;
	}
	body.tablet .navbar-wrapper {
	    -ms-flex-preferred-size: 75%;
	    flex-basis: 75%;
	}
	body.mobile ul.nav-child.dropdown-menu {
	    display: block;
	}
	body#body.mobile ul.nav-child.dropdown-menu {
	    background: transparent;
	    position: initial;
	    float: none;
	    box-shadow: none;
	    border: none;
	}
	body#body.mobile .dropdown-menu:before,
	body#body.mobile .navbar .nav>li>.dropdown-menu:after {
		content: initial;
		display: none !important;
	}
	body#body.mobile .navbar .nav li.dropdown>.dropdown-toggle .caret {
		display: none;
	}
	body#body.mobile ul.nav-child.dropdown-menu li a {
	    padding: 10px 30px;
	}
	body#body.mobile #wrapper .dropdown-menu>.active>a {
	    color: #fff;
	}
	body#body.mobile .nav-collapse .nav>li>a,
	body#body.mobile .nav-collapse .dropdown-menu a {
		font-weight: normal;
	}
	body#body.tablet .team-row__item {
		position: relative;		
	    -ms-flex-preferred-size: 24%;
	    flex-basis: 24%;
	}
	body#body.tablet .produkte .produkte-content .content-flex--item img {
	    max-height: 184px;
	    max-width: 260px;
	}
	body.tablet .prod-horizontal h2 {
	    font-size: 18px;
	}	


/*non-critical*/
	body#body.mobile .twoColumn--container__text h2 {
	    font-size: 21px;
	}
	body#body.mobile .custom.service-start {
	    padding: 20px;
	}
	body.tablet .service-start .nav-kachel--text p {
	    font-size: 12px;
	}
	body.tablet .service-start .nav-kachel--text h2,
	body.tablet .faq .nav-kachel--text h2 {
	    font-size: 18px;
	}	
	body.tablet .service-start .nav-kachel--item {
	    -ms-flex-preferred-size: 30%;
	    flex-basis: 30%;
	}
	body#body.mobile .content-bottom--flex-item p {
	    font-size: 12px;
	}	
	body.mobile .content-bottom--flex-item h2 {
	    font-size: 18px;
	    min-height: 50px;
	}
	body#body.tablet .content-bottom--flex-item {
	    -ms-flex-preferred-size: 32%;
	    flex-basis: 32%;
	}
	body#body.tablet footer.footer .space-between {
	    -ms-flex-pack: distribute;
	        justify-content: space-around;
	}
	body#body.mobile .footer-nav--item h4 {
	    font-size: 12px;
	}
	body#body.mobile .footer-nav--item nav a {
	    font-size: 10px;
	}


}
@media(max-width: 1440px) {
	body#body.desktop.site .navbar .nav>li a {
	    font-size: 12px;
	    padding: 5px 10px;
	}
	body#body.desktop #wrapper nav.navbar-wrapper div.vcard {
	    -ms-flex-preferred-size: 30%;
	        flex-basis: 30%;
	}
	body#body.desktop #wrapper nav.navbar-wrapper div.navbar {
	    -ms-flex-preferred-size: 70%;
	        flex-basis: 70%;
	}	
}
@media(max-width: 1700px) {
	body#body.desktop nav.navbar-wrapper div.vcard {
	    -ms-flex-preferred-size: 40%;
	        flex-basis: 40%;
	}
	body#body.desktop nav.navbar-wrapper div.navbar {
	    -ms-flex-preferred-size: 60%;
	        flex-basis: 60%;
	}	
}
@media(max-width: 1800px) {
	body#body .header--img--container img {
	    -o-object-position: initial;
	    object-position: initial;
	}	
}
@media(min-width: 1921px) {
	/*critical*/
	.header--img--container img {
	    -o-object-fit: cover;
	       object-fit: cover;
	    width: 100%;
	    height: 100%;
	}	
}

/*specials*/
@media(max-width: 1023px) {
	body#body.desktop div#wrapper {
		-webkit-filter: blur(10px);
		        filter: blur(10px);
	}
	body.desktop #resizeAlarm {
		display: block;
	}	
}
@media(min-width: 1024px) {
	body.desktop #resizeAlarm {
		display: none !important;
	}
}