.only-mobile,
#inspirator-landscape-menu,
#inspirator-portrait-menu,
.fullscreen-image-outer,
.step-hints.only-portrait,
.scroll-down{
	display: none;
}
@media (min-width: 2100px) {
	#ofen-detail .detail-info{
		left: 24%;
	}
}
@media (min-width: 1600px) {
	#ofen-detail .detail-info{
		left: 30%;
	}
}
@media (max-width: 1400px) {
	#img360outer{
		margin-top: 0px;
	}
	.title{
	    min-height: 80px;
	}
	div.single-ofen img.rotate180{
		display: none;
	}
}
@media (min-width: 1280px) {
	.single-ofen .preview-outer{
		position: relative;
	}
	/*.single-ofen .preview-outer::after{
        content: ' ';
	    background-image: url(../img/rotate-180-small.svg);
	    background-repeat: no-repeat;
	    background-size: contain;
	    width: 63px;
	    position: absolute;
	    bottom: 0px;
	    left: 110px;
	    height: 43px;
	}*/
	.rotate{
		max-width: 7%;
	}
}
@media (max-width: 1280px) {
	#modal #ofen-detail{
	    margin-left: 0%;
	}
	#img360outer{
		width: 40%;
	}
	.rotate{
		width: 8%;
	}
	#ofen-detail .detail-info{
		left: 41%;
	}
}
@media (max-width: 1100px) {
	.rotate{
		min-width: 60px;
		display: none;
	}
	#img360outer{
		width: 90%;
		margin-left: 0%;
		margin-top: 10px;
	}
	.single-ofen, .single-overview-elem{
		width: 48%;
	}
	#img360outer::after{
	    /*content: ' ';
	    background-image: url(../img/rotate-180-small.svg);
	    background-repeat: no-repeat;
	    background-size: contain;
	    width: 90px;
	    position: absolute;
	    bottom: 4%;
	    left: 0;
	    height: 43px;*/
	}
	#ofen-detail .detail-info {
	    left: 41%;
	    position: relative;
	    left: 0%;
	    width: 90%;
	}
}

.portrait .instagram, .landscape .instagram{
	display:block !important;  
}

@media  (max-width: 768px){ /* and (orientation: landscape) {*/
	.vimeo-wrapper:before{
		background-image: none;
	}
	#capture{
		position: fixed;
	}
	.title{
	    min-height: auto;
        line-height: 17px;
    	margin-bottom: 4px;
	}
	#inspirator{
		bottom :auto;
		left: auto;
		top: auto;
		height: 100%;
		overflow-y: auto;
		position: relative;
	}
	body{overflow-y: auto;}
	.subtitle{
		display: none;
	}
	.only-mobile{
		display: block;
	}
	#footer, #buttons{
		display: none;
	}
	#logo{
		width: 70px;
		top: 20px;
		left: 40px;
	}
	.vimeo-wrapper{
		position: relative;
	}
	#start-content{
		position: relative;
		left: auto;
		top: auto;
		background-color: #000;
		padding: 20px;
	}
	#start-content h1{
		font-size: 30px;
		line-height: 36px;
	}
	#start-content .footer-menu{
		left: auto;
		right: auto;
	}
	#menu.visible .close{
		right: 50%;
		top: 0;
    	padding: 7px;
	}
	#modal.visible{
		left:0;
		width: 50%;
		height: 100%;
	}
	#modal .inspirator-modal-content{
		padding: 25px;
		padding-top: 15px;
	}
	#menu{
		width: 50%;
		padding-top: 20px;
		padding-left: 20px;
	}
	.single-ofen, .single-overview-elem{
		width: 100%;
		position: relative;
		float: none;
	}
	div.single-ofen img{
		max-width: 30%;
		position: absolute;
		left: 0;
		top: 0;
	}
	div.single-ofen{
		padding-left: 35%;
    	min-height: 270px;
	}
	div.single-ofen .title{
		margin-bottom: 15px;
	}

	div.single-overview-elem .btn{
		padding: 5px 13px;
		font-size: 10px;
	}
	.footer-menu .footer-content{
		font-size: 12px;
	}
	.footer-menu .footer-logo{
		width: 60px;
	}
	.footer-menu{
		left: auto;
		right: auto;
		padding-right: 10px;
		margin-top: 20px;
		margin-bottom: 20px;
	}
	.footer-menu .footer-content .icon{
		width: 25px;
	}
	#img360{
		max-width: 100%;
	}
	#img360outer{
		min-height: 100px;
	}
	#ofen-detail .detail-info {
	    position: relative;
	    width: 100%;
	    right: auto;
	    bottom: auto;
	}
	#ofen-detail .rotate{
		position: relative;
		left: 50%;
		margin-left: -60px;
		margin-bottom: 20px;
	}

	#modal .inspirator-modal-content h2{
		font-size: 20px;
		margin-bottom: 4px;
	}
	#modal{
		bottom: 0px;
	}
	.vimeo-wrapper iframe::before{
		display: none;
	}
	#inspirator-wrapper{
		height: 100%;
	}
	.product-carousel-nav {
	    width: 20px;
	    position: absolute;
	    top: 50%;
	    margin-top: -10px;
	    z-index: 1;
	    right: 15px;
	    cursor: pointer;
	}
	.product-carousel-nav.prev{
		right: auto;
		left: 15px;
	}
	.mobile .slide-elem:not(.current){
		display: none;
	}
	#modal .inspirator-modal-content h2.mb3{
		margin-bottom: 5px;
		padding-right: 15px;
	}

	.landscape.menu-open #inspirator-wrapper{
		width: 50%;
	}
	.landscape.menu-open #inspirator{
	    width: 100%;
	    height: 50%;   
	}
	.landscape.menu-open.rendered #inspirator-landscape-menu{
		display: block;
		height: 38px;
    	padding: 7px;
		background-color: #000;
	}
	.landscape.menu-open.rendered #inspirator-landscape-menu img{
		height: 100%;
	}
	.landscape.rendered:not(.menu-open) #buttons{
		display: block;
		left: 10px;
		bottom: 25px;
	}

	.share-modal {
		margin-left: auto;
		max-width: 100%;
	}
	.close.visible{
		right: 50%;
	}
	.landscape.rendered .close.visible{
		top: 0;
	    height: 20px;
	    font-size: 20px;
	    padding-top: 8px;
	}
	.bottom-button:not(.email-button):hover .bottom-button-info,
	.bottom-button.email-button .icon:hover .bottom-button-info{
		display: none;
	}
	.mobile .mobile-show-hover div.bottom-button-info {
	    display: block !important;
	    /*position: fixed;
	    width: 50%;
	    margin-left: 25%;
	    bottom: 10%;
	    z-index: 9;*/
	}
	.mobile .mobile-show-hover.email-button .only-info{
		display: none !important;
	}
	.mobile .mobile-show-hover.email-button .email-box{
        width: 100%;
	    left: 0;
	    z-index: 999;
	    position: fixed;
	    /*position: -webkit-sticky;
	    transform: translate3d(0,0,0);*/
	    bottom: 0;
	    height: auto;
	    overflow-y: auto;
	    margin-left: 0;
	    padding-bottom: 0px;
	    min-height: 40%;
	}
	div.email-box.visible{
		display: none;
	}
	.close{
		z-index: 1;
	}
	#menu .share, #menu .bottom-button-info{
		color: #000;
	}
	.landscape.menu-open #loader{
		left: 26%;
	}
	.p20{
		padding: 10px;
	}
	#dynamic-content{
		margin: 0 20px;
	}
	.landscape:not(.rendered) .scroll-down{
		display: block;
		width: 30px;
		position: fixed;
		bottom: 15%;
		left: 50%;
		margin-left: -15px;
		cursor: pointer;
	}
	@-webkit-keyframes bounce {
	  0%, 100% {
	    -webkit-transform: translateY(0);
	  }
	  50% {
	    -webkit-transform: translateY(-5px);
	  }
	}
	@keyframes bounce {
	  0%, 100% {
	    transform: translateY(0);
	  }
	  50% {
	    transform: translateY(-5px);
	  }
	}
	.bounce {
		-webkit-animation-duration: 1s;
	  animation-duration: 1s;
	  -webkit-animation-fill-mode: both;
	  animation-fill-mode: both;
	  -webkit-animation-timing-function: linear;
	  animation-timing-function: linear;
	  animation-iteration-count: 5;
	  -webkit-animation-iteration-count: 5;
	  -webkit-animation-name: bounce;
	  animation-name: bounce;
	}
	#menu ul.sub img.preview.visible{
		display: none;
	}
	.small-hint{
		margin-top:0px;
		padding-top:10px;
	}

	.share-box .closecross{
		display: block;
	}
	#img360outer {
	    width: 60%;
	    margin-left: 15%;
	    margin-top: 0px;
	}
	.landscape #burger-menu.visible{
		z-index: 2;
	}
	.landscape .email-box{
		max-height: 100%;
    	overflow: auto;
	}
}


@media  (max-width: 768px) and (orientation: portrait){
	.email-box label,.email-box input, .email-box textarea{
		font-size:10px;
	}
	.email-box .btn{
		font-size: 12px;
		margin-top: 10px;
		padding: 3px 12px;
	}
	.email-box textarea {
		height: 65px;
	}
	.buttons-wrapper, #buttons{
		display: none;
	}
	.buttons-wrapper.footer{
		display: block;
	}
	.buttons-wrapper.footer #buttons{
		display: block;
	    position: relative;
	    width: 100%;
	    left: 0;
	    bottom: auto;
	    margin-top: 20px;
	    height: auto;
	}
	.portrait.menu-open #inspirator-portrait-menu{
		display: block;
		position: absolute;
		bottom: 10px;
		right: 10px;
	}
	.portrait.menu-open #inspirator-wrapper,
	.portrait #inspirator-wrapper,
	#inspirator-wrapper{
		width: 100% !important;
	}
	.portrait #menu .bottom-button-info:not(.email-box){
		/*width: 90% !important;
		margin-left: 3%;
		position: fixed;
		left:0;
		bottom: 15%;
		z-index: 12;*/
		width: 90% !important;
	    position: absolute;
	    left: 0;
	    bottom: 15%;
	    z-index: 12;
	    top: -45px;
	}
	.portrait #menu .bottom-button-info.share-box{
		top: -190px;
	}
	#inspirator-portrait-menu img.fullscreen-portrait{
		height: 30px;
		cursor: pointer;
	}

	.fullscreen-image-outer.visible{
		background-color: #FFF;
		position: fixed;
		top:0;
		left:0;
		right:0;
		bottom:0;
		display: block;
	}
	.fullscreen-image-outer.visible .fullscreen-image{
		position: fixed;
	    display: block;
	    width: 90%;
	    height: auto;
	    top: 10%;
	    z-index: 10;
	    left: 3%;
	    cursor: pointer;
	}
	.fullscreen-image-outer.visible .close-fullscreen{
		width: 30px;
		position: fixed;
		top: 10px;
		right: 10px;
		cursor: pointer;
	}

	body{
		overflow-y: auto;
	}
	#burger-menu.visible{
		display: none;
	}
	/*
	.portrait .vimeo-wrapper{
		height: 100%;
		background-color: #000;
		width: 150%;
	}
	.portrait .vimeo-wrapper iframe {
	    top: 0;
	    left: 0;
	    width: 120%;
	    height: 100%;
	    object-fit: cover;
	    min-height: auto;
	    min-width: 140vw;
	    position: inherit;
	    transform: none;
	    margin-left: -10%;
	    width: 100vw;
		  height: 56.25vw; 
		  min-height: 100vh;
		  min-width: 177.77vh; 
		  position: absolute;
		  top: 50%;
		  left: 10%;
		  transform: translate(-50%, -50%);
	}*/

	.portrait .vimeo-wrapper{
		height: 100%;
		background-color: #000;
	}
	.portrait .vimeo-wrapper iframe {
	    top: 0;
	    left: 0;
	    width: 120%;
	    height: 100%;
	    object-fit: cover;
	    min-height: auto;
	    min-width: 140vw;
	    position: inherit;
	    transform: none;
	    margin-left: -10%;
	}
	body:not(.rendered):not(.menu-open).portrait .vimeo-wrapper{
		width: 100%;
	}
	body:not(.rendered):not(.menu-open).portrait .vimeo-wrapper iframe{
		position: relative;
		min-width: 100%;
	}
	body:not(.rendered):not(.menu-open) #inspirator{
		height: 40%;
	}

	#menu{
		position: relative;
		top: auto;
		left: auto;
		padding-top: 20px;
		width: 100%;
		background-color: #000;
		right: auto;
		display: none;
	}
	.menu-open #menu,.rendered #menu{
		display: block;
	}
	.close.visible{
		display: none;
	}
	#loader{
		top: 20%;
	}
	.mobile .mobile-show-hover div.bottom-button-info {
	    width: 90%;
	    margin-left: 3%;
	}
	.portrait div.single-ofen img{
		max-width: 30%;
	}
	.portrait .single-overview-elem img{
		max-width: 70%;
		max-height: 100% !important;
	}

	#menu.visible .close, #modal.visible {
	    right: auto;
	    left: 11px;
	    top: 20px;
	    background: none;
	}
	#modal.visible{
		width: 100%;
		display: block;
	}
	#menu.visible .close{
		display: none;
	}
	#inspirator{
	    position: relative;
	    height: 50%;
	    width: 100%;
	    bottom: auto;
	    overflow: hidden;
	    z-index: 1;
	}
	#modal.visible{
	    background-color: #FFF;
	    left: 0;
	    top: 0;
	    overflow-y: auto;
	    right: 0;
	    height: 50%;
	}
	.single-overview-elem{
		margin-bottom: 20px;
	}
	#start-content.hide{
		display: none;
	}
	.portrait #start-button{
		margin-bottom: 100px;
	}
	.portrait .step-hints{
		display: none;
	}
	.portrait .step-hints.only-portrait{
		position: absolute;
		bottom: 0;
		left: 0;
		opacity: 0.7;
		display: block;
		width: 100%;
	}
	.portrait .step-hints.only-portrait > div{
		width: 99%;
	}

	/*.portrait > div.email-box.visible{
		display: block;
	    position: fixed;
	    top: 0;
	    left: 0;
	    z-index: 129;
	    width: 100%;
	    background-color: #000;
	    height: 100%;
	    padding-top: 10px;
	}
	.portrait > div.email-box .closecross {
		top: 15px;
	}*/


}