/* MEDIA QUERIES - RESPONSIVE CSS
-------------------------------------------------- */



@media screen and (max-width: 1500px) { 
	/*
    #wrap-topbild {
		height: 36vw;
	}

	#topbild, #topbild .ce-image img {
		width: 112% !important;
		height: auto;
	}
    */
    .slidetext h1 {
		font-size: 170px;
	}
}


@media screen and (max-width: 1322px) { 
	#logo {
		left: 12px;
		/*top: 50%;
		transform: translateY(-50%);*/
		margin-left: 0px;
	}
}



@media screen and (max-width: 1300px) { 
	.container {
  		width:100% !important;
  		max-width:100% !important;
  		margin-left: auto;
  		margin-right: auto;
  		padding-left: 15px;
  		padding-right: 15px;
	}
	.slidetext h1 {
		font-size: 130px;
	}
}

@media screen and (max-width: 1230px) { 
     .kachel {
    	width: 484px;
    	height: 340px;
    }
}

@media screen and (max-width: 1130px) { 
    
    .claim {
    	  margin-left: 250px;
    }
}



@media screen and (max-width: 1065px) { 
     .kachel {
    	  width: 400px;
    	  height: 280px;
    	  padding-top: 106px;
    }
    .slidetext h1 {
       font-size: 60px;
       /*hyphens: auto;
       -webkit-hyphens:  auto;*/
    }
    div.wissensvermittlung-top, div.mandate-top {
       margin-right: 0;
    }
    #mc_embed_signup {
    	margin-top:  30px;
    }
}
@media screen and (max-width: 1010px) { 

	.container {
  		padding-left: 30px;
  		padding-right: 30px;
	}

	#nav li:nth-of-type(1n) {
	  width: auto !important;
	  text-align: left;
    }
    #nav li:nth-of-type(2n) {
	  width: auto !important;
	  text-align: left;
    }
    #nav li:nth-of-type(3n) {
	  width: auto !important;
	  text-align: left;
    }
	
	#megura-swissness {
	right: 15px !important;
	}

	.inhalt .row, #footer .row {
      margin-left:  0px !important;
      margin-right: 0px !important; 
    }

    body.home #wrap-inhalt{
    	 padding-top: 0;
    }

    #logo {
    	top: 6px;
		left: 30px;
    }
    .mobile-menu{
    	position: absolute !important;
    	left: 0;
    	top: 120px !important;
        height:  calc(100vh - 120px) !important;
        width: 100vw !important;
    }
    .mobile-menu .mobile-menu__items {
    	padding: 20px !important;
    	vertical-align: top !important;
    }

    .slick-prev, .slick-next {
    	display: none !important;
    }

    div#hamburger.active .welten {
    	visibility: hidden;
    }

    .claim {
    	visibility: hidden;
    }

	.mobile-menu__items .dropdown.show{
		height: 4.5em;
	}

	#nav ul.dropdown-menu{
		margin-left: 0 !important;
		padding: 0;
	}
}




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

	#wrap-inhalt {
		margin-top: 40px;
	}

	.home #wrap-inhalt {
		margin-top:0px; 
		padding-top: 80px;
	}
}


@media screen and (max-width: 868px) { 
     .kachel {
    	width: 340px;
    	height: 240px;
    	font-size: 26px;
    }
    
    .kachel h3{
    	font-size: 26px;
    }
    
    .modal {
	  padding: 5px !important;
    }
    
    #mc_embed_signup input.email {
    	width: 83% !important;
    }
}


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

	#wrapper {
	 display:block !important;
	}

	#wrap-topbild {
		margin-top: 80px;
		height:auto;
		height: 40vw;
	}

	#topbild, #topbild .ce-image img {
		width: 128% !important;
		height: auto;
	}

    /*
	.bg-white:first-child {
		border-top:0px !important; 
	}
    */

	.col-12, .col-6 {
		/* margin-bottom:25px; */
	}

	#wrap-footer {
		border-left: 0px;
		border-right: 0px;
		border-bottom:0px;
	}

	#frow1 .col-12 {
		margin-bottom:20px; 
	}

	#frow2 {
		margin-top:10px; 
	}

	#frow3 .ce-column {
		margin-bottom: 0px !important;
	}
		
	main img {
		max-width: 100% !important;
		height: auto; 
	}

	#wrap-inhalt.notb {
		/* margin-top: 100px; */
	}

	.home .claim {
		top: 65%;
		left: 50%;
		transform: translate(-50%,-65%);
		width: 349px;
		height: 86px;
	}

    .kacheln-box .row div:not(:first-of-type) a:first-of-type {
        margin-top: 75px;
    }
    .claim {
    	margin-left: 0;
    }

}



/*
@media screen and (max-width: 680px) { 
	
	#megura-swissness {
	width:80px;
	height:80px;
	bottom:0px;
	}
}
*/



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

	#logo {
		width: 150px;
	}	

	#wrap-topbild {
		height: 48vw;
	}

	#topbild, #topbild .ce-image img {
		width: 145% !important;
		height: auto;
	}

	#frow1 .col-12 {
		margin-bottom:30px; 
	}

	footer .empty {
		display:none; 
	}

	.claim {
    	visibility: hidden;
    }
    
    body.home #inhalt ul {
       margin-left: 0;
    }

    .slidetext h1 {
        font-size: 120px;
        text-align: center;
    }

    #slides {
    	 top: 40%;
    }

    body.home .geschmackserlebnis div div:first-of-type {
    	 width: 100%;
    }
    body.home .geschmackserlebnis div div:nth-of-type(2n) {
    	 width: 100%;
    }
    #mc_embed_signup input.email{
    	 margin-left: 0;
    }

    #mc_embed_signup input.email {
        width: 88% !important;
    }
    #mc_embed_signup {
    	margin-top:  20px;
    }
    div.genug-verzapft{
    	padding-left: 0;
    }
    .lautsprecher {
    	bottom: 40%;
    }
    .videotext {
    	width: 80%;
    }
    .suess-trocken {
    	margin-bottom: 30px;
    }
    .pfeil-nach-oben {
    	top:  85vh;
    	right: -5vh;
    }

    .modal {
    	width: 95% !important;
    }

    .modal .row .col-12 {
    	padding-right: 25px;
    	padding-left: 25px;
    }
    
    .modal .modal-title{
    	margin-top: 35px;
    	margin-bottom: 35px;
    }

    .modal a.close-modal {
    	top:  7px !important;
    	left: 20px !important;
    }

    .referenzen .referenzen-logos .ce-column .image img{
    	max-width: 100% !important;
    }

    .pfeil-nach-oben {
    	display: none;
    }

    body.degustationen .kachel h3 {
    	font-size: 26px;
    }

    .kachel {
    	width: 100%;
    	text-align: center;
    }

    a.popup-link{
	    display:  block;
    }

    .referenzen-logos img {
    	margin-top: 30px;
    	margin-bottom: 30px;
    }
    
    footer .ce-gallery, #footer-c3 div{
    	display: flex;
    	justify-content: center;
    	text-align: center;
    }

    #footer-c1 img {
        margin-left: 0 !important;
    }

    #frow1 {
    	margin-bottom: 100px !important;
    	margin-top: 50px;
    }
    #footer-c4 a div {
    	margin-bottom: 10px;
    }
    #mc_embed_signup input.email {
        float: left;
    }

    .referenzen-title {
    	margin-top: 50px !important;
    }

    body.degustationen .modal h3 {
        font-size:  22px !important;
    }

    .desktop-only {
	    display: none ;
	}

	.mobile-only {
		display: block;
	}
   
	#text1 h1, #text2 h1, #text3 h1, #text4 h1, #text5 h1{
		animation: marquee 7s linear infinite;
	}

	@keyframes marquee {
		from {transform: translateX(100%); }
		to {transform: translateX(-100%); }
	}

	.videotext {
		bottom: 35px;
	}
}




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

	
	
  } 

@media screen and  (max-width: 320px) { 
	    .slidetext h1 {
            font-size: 45px;
    } 
}