@media (max-width: 749px) {
	.top { 
	min-height: 250px;

	}
	
	#slideshow {
 
	
	}
	
	.sprachwahl {
	right: unset;
	margin-right: unset;
	color: #c6c6c6;
	left: 70px;
	position: absolute;
	}
	
	
	.sprachwahl a img {	
	display: inline-block !important; 
	}
	
	.flyout .nav {
		margin-left: 0;
		    z-index: 2000 !important;

    }
  
	.logo-responsive {
	   	left: unset !important;
	   	margin-left: 0 !important;
	   	display: block;

    }
    
    .top .logo-responsive img {
	   	
	   	display: block !important;

    }
    
    .large {
    width: 280px !important;
top: 70px !important;
right: 50%;
margin-right: -140px;
height: auto !important;

   
    }
    
    /*    .large img {
    
	filter: drop-shadow(0px 0px 2px rgba(255,255,255,1));
	-webkit-filter: drop-shadow(0px 0px 2px rgba(255,255,255,1));

}*/
    
        .small {
 width: 90px !important;
top: 0px !important;
padding: 10px 10px !important;
background-color: #487218;
right: 0;
   height: 30px !important;
    }
    
    .small img {
    


}

.outer {
position: relative !important;
background-color: rgba(255,255,255,0.85);
}

    
    	.flyout .logo-stoerer img {
display: inline-block !important;
margin-top: 0;   	 }
    
    .footer-inner {
		width: 100%; 
		padding: 0 !important;
		text-align: center;
    }
  
	.footer-inner a img {
		width: 50%; 
    }
	
	.footer-inner p img {
		width: 51%; 
		margin-bottom: 10px;
		height: auto;
		float: unset !important;
		margin-right: 0 !important;
		
    }
  
    .footer-outer, .footer-links, .footer-links p, .footer-rechts {
		width: auto !important;
		padding: 10px 5% !important; 
		display: block !important;
		text-align: center !important;
		 
    }
    

  
    .bottom {
		height: auto !important; 
		background-color: rgba(151,191,13,1) !important;
		background-position: center;
		background-image: none;
		color: #ffffff;
	}
    

  
  .flyout .nav {
    margin-top: -0 !important;
    z-index: 5000 !important;  
  }

  .nav-toggle {
    background: #487218 url("/statimages/hamburger.gif") no-repeat scroll center center;
    background-size: auto auto;
width: 40px;
z-index: 10000;
position: relative;
left: 5%;
height: 40px;
background-size: 200%;
  }
  
    .nav.opened {
	-webkit-animation: fadein 1s ease; /* Safari, Chrome and Opera > 12.1 */
    -moz-animation: fadein 1s ease; /* Firefox < 16 */
    -ms-animation: fadein 1s ease; /* Internet Explorer */
    -o-animation: fadein 1s ease; /* Opera < 12.1 */
    animation: fadein 1s ease;
    }
@keyframes fadein {
  	0% 	{ opacity: 0; transform: translateY(-200px); }
    100% { opacity: 1; transform: translateY(0); }
}
/* Firefox < 16 */
@-moz-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
  	0% { -moz-opacity: 0; -moz-transform: translateY(-200px); }
    100% { -moz-opacity: 1; -moz-transform: translateY(0); }
}
/* Safari, Chrome and Opera > 12.1 */
@-webkit-keyframes fadein {
  	0% { -webkit-opacity: 0; -webkit-transform: translateY(-200px); }
    100% { -webkit-opacity: 1; -webkit-transform: translateY(0); }
}
/* Internet Explorer */
@-ms-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
 	0% { -ms-opacity: 0; -ms-transform: translateY(-200px); }
    100% { -ms-opacity: 1; -ms-transform: translateY(0); }
}
/* Opera < 12.1 */
@-o-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
  	0% { -o-opacity: 0; -o-transform: translateY(-200px); }
    100% { -o-opacity: 1; -o-transform: translateY(0); }
    
}

  
   .flyout .nav > ul > li > a {
      color: #487218 !important;
    }
 .flyout .nav ul li ul li a {
      color: #487218 !important;
    }
  
  .flyout .nav > ul > li > a:hover, .flyout .nav > ul > li.act > a, .flyout .nav > ul li ul > li > a:hover, .flyout .nav > ul li ul > li.act > a {
      background-color: #487218 !important;
    }
  
  .flyout .nav > ul {
    padding-left: 15px !important;
    padding-top: 15px !important;
    }
    

    
    
  .center {
    width: 90% !important;
    padding: 0 5% !important;
    }
  
  /*.center p, .center h1, .center h2, .center h3 {
      padding: 0 5% !important;  
    }
  
  .center ul {
      margin-left: 5% !important;  
}*/
  
  
  h1, h2, h3 {
    display: block; 
    
  }
  
  h1 {
  font-size: 23px;
  line-height: 110%;
  }
  
   h2 {
  font-size: 20px;
  }
  
  .contentrahmen {
      margin: 0 !important;  
}
  
  
.contentrahmen div {
    float: none !important;
    width: 100% !important; 
    max-width: 100% !important;
}
  
  
  .pic0 { 
  margin-left: 0;
  }

  
  .layout25boxLeft, .layout25boxMiddle, .layout25boxRight, .layout2leftpic, .layout28boxLeft, .layout28boxMiddle1, .layout28boxMiddle2, .layout28boxRight, .layout2right {
    width: 100% !important; 
  }
  
  .layout25image:empty, .div:empty, .txt4:empty, .layout2right:empty {
    display: none !important;
  }
  
  .pic4 {
    margin-bottom: 0px !important; 
  }
  
  .layout25boxLeft, .layout25boxMiddle, .layout25boxRight {
     
    margin-top: 10px !important;
    padding-bottom: 10px !important;
  }
  
  
         .textblock {
	display: none;

	}
	
	img.allpics {
    
    width: 100%;
}	

.contentrahmen .view {
width: 100% !important;
height: 70vw !important;
margin-right: 0;
}

.view-first.breit img {
	height: 100% !important;
width: auto;
max-width: unset !important;
}

.view-first:hover h2,
.view-first:hover h1,
.view-first:hover p,
.view-first:hover a.info,
.view-first:hover .mask img {


}

.contentrahmen .view-first .mask {
width: 80% !important;}



.kachel-home {
margin-top: 0;
}

  .txt41 h3 a {
width: 90% !important;
padding: 10px !important;
line-height: 120%;

 -moz-hyphens: auto;
   -o-hyphens: auto;
   -webkit-hyphens: auto;
   -ms-hyphens: auto;
   hyphens: auto; 
}

 .txt41 h3 {
 font-size: 0 !important; 
 line-height: 0;

 }


.kachel-home {
	margin-left: 0 ! important;
	
}
    

.txt0 {
margin-top: 0; 
}

fieldset {
width: 100% !important;
padding: 0 !important;
left: 0 !important;
max-width: 100% !important;
min-width: 50%;
text-align: left !important;

}

.fld { 
width: 100% !important;
margin-left: 0 !important;
}

.fldplz { 
	width: 20%;
display: block;
margin-left: 3px !important;
}
.fldort {
width:70%; 
}

input, textarea {
max-width: 100%;
margin-left: 0 !important;
/*float: left;*/
}

.contentrahmen .checkbox {
    text-align: left;
    margin-left: 0;
    width: 100% !important;
    float: left !important;
}



label {
margin-bottom: 5px;
text-align: left !important;
/*float: left;*/
}

iframe {
width: 100%;
height: 58vw;
}

table {
font-size: 1em;
}


/* ------ Suche ------ */
  
  .suche { 
	  display: block !important;
	  right: 0 !important;
	  margin-right: 0 !important;
	  position: absolute !important;
	}
	
	
.suchfeld:focus {
	width: 80vw !important;
   

	}

}
    
    
    
/* ---- Allgemeine CSS ---- */

.center ul {
	list-style: disc;
	margin-left: 20px;
	
}

.subline {
    font-size: 13px;
    font-weight: normal;
}

.pic9 {
	width: 290px; 			
}

.pic9 img {
width: 100% !important; 
}	 	 				

.pic9 + .pic9 {
margin-left: 20px;  
}	 	 	 	

.phone {
	display: none;
}

.txt41 h3 {
    color: #ffffff;
    font-size: 0;
}

.txt41 h3 a {
	display: inline-block !important;
	width: 273px;
	min-height: 20px;
	background-color: #487218;
	text-align: center;
	margin: 5px;
	padding: 15px 10px 15px 10px;
	letter-spacing: 0 !important;
	color: #ffffff;
	font-size: 18px;
	text-decoration: none;
	float: left;
	line-height: 100%;
	-webkit-transition: all 0.2s ease-in-out;
	-moz-transition: all 0.2s ease-in-out;
	-o-transition: all 0.2s ease-in-out;
	-ms-transition: all 0.2s ease-in-out;
	transition: all 0.2s ease-in-out;
	font-weight: 400;
}

.txt41 h3 a:hover {
background-color: #aaaaaa;
}

   
    
    
	


 
 .layout25image:empty {
 	display: none;
 }
	


  
  
  
    .logo-mobil {
    display: none;
    }

  
  
   .logo-responsive {	
	position: fixed;
	z-index: 3000;
	left: 50%;
	font-size: 13px;


	}
	
	.large {
	width: 310px;
	margin-left: -495px;
	top: 3px;
	padding: 0;
	overflow: hidden;
	height: 268px;
background-color: rgba(151,191,13,0);
	}
	
		.small {
	width: 220px;
	margin-left: -480px;
	top: 0;
	padding: 0 10px;
	overflow: hidden;
	height: 80px;
background-color: rgba(151,191,13,1) !important;
}
	
	.small img {
		   -webkit-filter: contrast(0) grayscale(1) brightness(2);
-moz-filter: contrast(0) grayscale(1) brightness(2);
-ms-filter: contrast(0) grayscale(1) brightness(2);
-o-filter: contrast(0) grayscale(1) brightness(2);
filter: contrast(0) grayscale(1) brightness(2);

	}
	
	   .logo-responsive img {	
	height: auto;
	width: 100%;
	transition: all 0.2s;
  -moz-transition: all 0.2s; /* Firefox 4 */
  -webkit-transition: all 0.2s; /* Safari and Chrome */
  -o-transition: all 0.2s; /* Opera */
}
  
  
  
  .large, .small, .logo-responsive {
    transition: all 1s;
  -moz-transition: all 1s; /* Firefox 4 */
  -webkit-transition: all 1s; /* Safari and Chrome */
  -o-transition: all 1s; /* Opera */
    
  }
  
      .pic19a img, .pic19b img, .pic19c img, .pic19d img, .fancy img {
    -webkit-filter: grayscale(0%) brightness(1);
-moz-filter: grayscale(0%) brightness(1);
-ms-filter: grayscale(0%) brightness(1);
-o-filter: grayscale(0%) brightness(1);
filter: grayscale(0%) brightness(1);
transition: all 0.2s;
  -moz-transition: all 0.2s; /* Firefox 4 */
  -webkit-transition: all 0.2s; /* Safari and Chrome */
  -o-transition: all 0.2s; /* Opera */  


}
      .pic19a, .pic19b, .pic19c, .pic19d {

	overflow:hidden;
}

.pic19a:hover img, .pic19b:hover img, .pic19c:hover img, .pic19d:hover img, .fancy:hover img, .center a:hover img {
    -webkit-filter: grayscale(80%) brightness(0.9);
-moz-filter: grayscale(80%) brightness(0.9);
-ms-filter: grayscale(80%) brightness(0.9);
-o-filter: grayscale(80%) brightness(0.9);
filter: grayscale(80%) brightness(0.9);
transition: all 0.2s;
  -moz-transition: all 0.2s; /* Firefox 4 */
  -webkit-transition: all 0.2s; /* Safari and Chrome */
  -o-transition: all 0.2s; /* Opera */  
    }
    
    
 /* CSS für Hover der Teaser */

  .view {
   width: 290px !important;
   height: 270px;
   float: left;
   overflow: hidden;
   position: relative;
   text-align: center;
   cursor: default;
   margin-bottom: 20px;
   margin-right: 20px;
   
}

.view:nth-child(3n) { margin-right: 0px; }
  
  .view .mask,.view .content {
   width: 290px;
   height: auto;
   position: absolute;
   overflow: hidden;
   bottom: 0;
   left: 0;
}
  
  .view img {
   display: block;
   position: relative;
   height: 100%;
}
  
  .view h2, .view h1 {
   text-transform: uppercase;
   color: #fff;
   font-weight: 300;
   text-align: left;
   /*position: relative;*/
   font-size: 21px;
	padding: 10px 0 0 10px;
    /*background: rgba(0, 0, 0, 0.8);*/
   display: inherit;
}
.view p {
    font-size: 15px;
      /*position: relative;*/
   color: #fff;
   padding: 0 5px 0 10px;
   text-align: left;
   font-weight: 200;
   font-style: normal;
   filter: alpha(opacity=0);
   opacity: 0;}
   
   .view p a {
    font-size: 14px;
   font-weight: 700;
   font-style: normal;
   filter: alpha(opacity=0);
   opacity: 0;
   color:#ffffff;
    
   }

.view br {
	/*display: none; */}
  
  .view-first img {
   -webkit-transition: all 0.2s linear;
   -moz-transition: all 0.2s linear;
   -o-transition: all 0.2s linear;
   -ms-transition: all 0.2s linear;
   transition: all 0.2s linear;
}
.view-first .mask {

   background-color: rgba(236,116,4, 0.9);
   -webkit-transition: all 0.4s ease-in-out;
   -moz-transition: all 0.4s ease-in-out;
   -o-transition: all 0.4s ease-in-out;
   -ms-transition: all 0.4s ease-in-out;
   transition: all 0.4s ease-in-out;
   width: 80%;
height: 60px;
margin: 10%;
}

.view-first .mask img {
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
   /*-webkit-transition: all 0.4s ease-in-out;
   -moz-transition: all 0.4s ease-in-out;
   -o-transition: all 0.4s ease-in-out;
   -ms-transition: all 0.4s ease-in-out;
   transition: all 0.4s ease-in-out;*/
   
   position: absolute;
left: 50%;
margin-left: -15px;

}

.view-first h2, .view-first h1 {

   -webkit-transition: all 0.2s ease-in-out;
   -moz-transition: all 0.2s ease-in-out;
   -o-transition: all 0.2s ease-in-out;
   -ms-transition: all 0.2s ease-in-out;
   transition: all 0.2s ease-in-out;
}
.view-first p {

   -webkit-transition: all 0.2s linear;
   -moz-transition: all 0.2s linear;
   -o-transition: all 0.2s linear;
   -ms-transition: all 0.2s linear;
   transition: all 0.2s linear;
}
.view-first:hover img {
   -webkit-transform: scale(1.1,1.1);
   -moz-transform: scale(1.1,1.1);
   -o-transform: scale(1.1,1.1);
   -ms-transform: scale(1.1,1.1);
   transform: scale(1.1,1.1);
}

.view-first:hover .mask {
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
   filter: alpha(opacity=100);
   opacity: 1;
      width: 80%;
height: 60%;
margin: 0;
padding: 30% 10% 10% 10%;
border: none;
    
}

  
.view-first:hover h2,
.view-first:hover h1,
.view-first:hover p,
.view-first:hover a.info,
.view-first:hover a,
.view-first:hover .mask img {
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
   filter: alpha(opacity=100);
   opacity: 1;
   -webkit-transform: translateY(0px);
   -moz-transform: translateY(0px);
   -o-transform: translateY(0px);
   -ms-transform: translateY(0px);
   transform: translateY(0px);

}

.view-first:hover p {
   /*-webkit-transition-delay: 0.1s;
   -moz-transition-delay: 0.1s;
   -o-transition-delay: 0.1s;
   -ms-transition-delay: 0.1s;
   transition-delay: 0.1s;*/
  }
  

  
  
  
    .projekte {
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: flex-start;
    -ms-flex-pack: distribute;
    justify-content: flex-start;
    -webkit-align-content: center;
    -ms-flex-line-pack: center;
    align-content: center;
    -webkit-align-items: flex-start;
    -ms-flex-align: start;
    align-items: flex-start;
    }
  
  .view {
    -webkit-order: 0;
    -ms-flex-order: 0;
    order: 0;
    -webkit-flex: 0 1 auto;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    -webkit-align-self: auto;
    -ms-flex-item-align: auto;
    align-self: auto;
    }

hr {
	border-top: 1px solid #487218;
	border-bottom: none;
}

.footer-outer { 
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	-webkit-flex-direction: row;
	-ms-flex-direction: row;
	flex-direction: row;
	-webkit-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-justify-content: space-between;
	-ms-flex-pack: distribute;
	justify-content: space-between;
	-webkit-align-content: center;
	-ms-flex-line-pack: center;
	align-content: center;
	-webkit-align-items: flex-start;
	-ms-flex-align: start;
	align-items: flex-start;     
	width: 940px;     
	margin-left: auto;     
	margin-right: auto;     
	}
	
.footer-inner { 
	-webkit-order: 0; 
	-ms-flex-order: 0; 
	order: 0; 
	-webkit-flex: 0 1 auto; 
	-ms-flex: 0 1 auto; 
	flex: 0 1 auto; 
	-webkit-align-self: auto;
	-ms-flex-item-align: auto;
	align-self: auto;
	min-height: 80px;
	padding: 0 15px;
	line-height: 120%;
	}
	
	.oben {

    position: absolute;
    margin-top: -23px;
    text-align: center;
    width: 100%;

}
	
/* ------ Suche ------ */
  
  .suche { 
	  width: auto;
	  position: fixed;
	  z-index: 5000;
	  top: 0px;
	  right: 50%;
	  margin-right: -410px;
	}
	
  .suchfeld {
	float: right;
	margin: 0; 
	padding: 5px 10px; 
	border: none; 
	font-weight: bold;  
	width: 30px;
    -webkit-transition: all 0.4s ease-in-out;
    transition: all 0.4s ease-in-out;
    background: url("/upmedia/suche.png") no-repeat scroll center right;
    cursor: pointer;
    height: 26px;
    border-bottom: 1px solid rgba(255,255,255,0);
   	background-color: rgba(255,255,255,0);
   	color: rgba(255,255,255,0);
   	background-size: 26px auto;

	}
	
.suchfeld:focus {
	width: 580px;
   	background-color: rgba(255,255,255,1);
	border-bottom: 1px solid #487218;
    cursor: text;
    color: #000000;
    -webkit-transition: width 0.4s ease-in-out;
    transition: width 0.4s ease-in-out;


	}

.suchbut {
	display: none; 
	/*margin-left: 0px; 
	border: none; 
	margin-top: 5px; 
	background-color: transparent; */ 
	}
	
p {
	margin-bottom: 10px; 
	}
	
	h1:empty {
	display: none;
	}
	
	
/*-------------------------------Kontaktformular-------------------------------*/	
	
fieldset {
	width: 50%;
	text-align: left;
}

label {
	padding-left: 2%; 
	
}

.fld, .fldplz, .fldort {
	border-top: none;
	border-left: none; 
	border-right: none;
	height: 25px;
	padding: 30px 2% 0 2%;
	background-color: transparent;
	border-bottom: 1px solid #b8b8b8;
	display: block;
	width: 96%;
	margin-left: 0;
	margin-bottom: 0 !important;
	margin-top: -26px;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	border-radius: none;
}

.mediumfld {
	border-top: none;
	border-left: none; 
	border-right: none;
	height: 25px;
	padding: 2%;
	background-color: transparent;
	border-bottom: 1px solid #b8b8b8;
	display: block;
	width: 96%;
	margin-left: 0;
	margin-bottom: 0 !important;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	border-radius: none;
}

.fld:hover, textarea:hover, .mediumfld:hover {
	background-color: #f9f9f9;
}

select {
    width: 100% !important;
  background-image:url(/upmedia/select-arrow.png);
  background-position: right;
  background-repeat: no-repeat;
  	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	border-radius: none;
}

select.fld, #Erfahren_TXT {
    padding: 2%;
    margin-top: 0;
    height: auto;
}

input {

}

.checkbox {

    width: 95%;
    text-align: left;
    margin-left: 5%;

}

.fldort {
    width: 100% !important;
}

textarea {
    border: medium none !important;
    padding: 30px 2% 0 2% !important;
	background-color: transparent;
	border: 1px solid #b8b8b8 !important;
	width: 96% !important;
	margin-left: 0 !important;
	min-height: 180px; 
	margin-top: -26px;
    }
    
.submitbutton {
    width: 100%; 
    padding: 20px; 
    }

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


	
@media (min-width: 749px) { 

	.contentrahmen { 
	margin: 0 20px 20px 20px; 
	}
	
	.kachelhome {
	position: absolute;
	top: 200px;	
	z-index: 1;
	text-align: center;
	font-weight: 200;
	text-transform: uppercase;
	line-height: 150%;
	display: block;
	padding: 30px;
	left: 50%;
	margin-left: -455px;
	color: #ffffff;
	font-size: 19px;
	width: 320px;
	background-color: rgba(162,79,39,0.9);
}

	.kachelhome p {
	margin-bottom:0;
	
	}
	
	
	.flyout .nav ul {
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: space-between;
    -ms-flex-pack: distribute;
    justify-content: space-between;
    -webkit-align-content: stretch;
    -ms-flex-line-pack: stretch;
    align-content: stretch;
    -webkit-align-items: flex-start;
    -ms-flex-align: start;
    align-items: flex-start;
	width: 640px;
	position: relative;
	left: 50%;
	margin-left: -170px;
	top: 30px;
	padding: 0;
    transition: all 1s;
  -moz-transition: all 1s; /* Firefox 4 */
  -webkit-transition: all 1s; /* Safari and Chrome */
  -o-transition: all 1s; /* Opera */
background-color: rgba(151,191,13,0);

	

    }

.flyout .nav > ul > li {
    -webkit-order: 0;
    -ms-flex-order: 0;
    order: 0;
    -webkit-flex: 0 1 auto;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    -webkit-align-self: auto;
    -ms-flex-item-align: auto;
    align-self: auto;
    }
    
  .fixed-navi, .flyout .nav {
	    transition: all 1s;
  	-moz-transition: all 1s; /* Firefox 4 */
  	-webkit-transition: all 1s; /* Safari and Chrome */
  	-o-transition: all 1s; /* Opera */ 
  }  
    
    
   .fixed-navi {
	   width: 890px !important;
	   margin-left: -400px !important;
	   top: 50px !important;
	   
  }
  
      .fixed-navi ul {
    transition: all 1s;
  	-moz-transition: all 1s; /* Firefox 4 */
  	-webkit-transition: all 1s; /* Safari and Chrome */
  	-o-transition: all 1s; /* Opera */
width: 690px !important;
margin-left: -285px !important;
background-color: rgba(151,191,13,1) !important;
top: 0px !important;
padding-left: 20px !important;

  }   
    
    .fixed-navi ul li a {

    }
    
    .fixed-navi ul li a:hover, .fixed-navi ul > li.act > a {
    }
    
          .fixed-navi ul ul{
	          width: 200px !important; 
	          left: 0 !important; 
	          margin-left: 0 !important;
    } 
  
  
	
}


	/* iPads (portrait) ----------- */
@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px)
and (orientation : portrait) {
/* Styles */
 html {zoom:0.8;}
}