/* Media Queries*/

/*----------------------- mobile menu ie 10/11 hack start*/
@media all and (-ms-high-contrast:none) {
#my-menu { 
	display: none
} /* IE10 */
	
*::-ms-backdrop, #my-menu { 
	display: none
} /* IE11 */
}
/*----------------------- mobile menu ie 10/11 hack end*/

/*----------------------- header start*/
@media only screen and (min-width: 1016px) {
#btn-menu {
	display: none;	
}   
}	

@media only screen and (max-width: 1015px) {      
#menu-header   {
	display: none;	
} 
}   

@media only screen and (max-width: 760px) {      
#logo-header {	
	margin-top: 23px;
}

#logo-header img {	
   height: 30px;
}
   
#btn-menu i {
	height: 28px;	
   font-size: 2.8rem;
	font-size: 28px;
	line-height: 2.8rem;
	line-height: 28px;  
}    
} 

@media only screen and (max-width: 515px) {      
.no-mobile {
 	display: none;	  
} 
   
#btn-menu {
	margin-left: 20px; 		
}   
}   

@media only screen and (max-width: 1150px) {  
.margin-header {
   padding-top: 120px;   
}
}   

@media only screen and (max-width: 550px) {  
.margin-header {
   padding-top: 100px;   
}
}  
/*----------------------- header end*/

/*----------------------- hero start*/
@media only screen and (max-width: 900px) {  
#hero {
   height: 40%;
}   
   
#hero h2 {
   font-size: 4.0em;
   font-size: 40px; 
   line-height: 4.0rem;
   line-height: 40px;    
}

#hero h3 {
   margin-top: 20px;   
   font-size: 6.0em;
   font-size: 60px; 
   line-height: 6.0rem;
   line-height: 60px; 
}
} 

@media only screen and (max-width: 630px) {  
#hero h2 {
   font-size: 3.0em;
   font-size: 30px; 
   line-height: 3.0rem;
   line-height: 30px;    
}

#hero h3 {
   margin-top: 10px;   
   font-size: 4.0em;
   font-size: 40px; 
   line-height: 4.0rem;
   line-height: 40px; 
}
} 

@media only screen and (max-width: 420px) {  
#hero h2 {
   font-size: 2.3em;
   font-size: 23px; 
   line-height: 2.3rem;
   line-height: 23px;    
}

#hero h3 {
   margin-top: 10px;   
   font-size: 3.0em;
   font-size: 30px; 
   line-height: 3.0rem;
   line-height: 30px; 
}
} 
/*----------------------- hero end*/

/*----------------------- referenzen start*/
@media only screen and (max-width: 1250px) {  
.referenzen {
   padding-top: 80px;
   padding-bottom: 80px;
}   
   
.referenzen-title {
	margin-top: 0;
   margin-bottom: 0;
	font-size: 4.0rem;   
	font-size: 40px;
	line-height: 4.0rem;
	line-height: 40px;	
}   
}  

@media only screen and (max-width: 1170px) {   
.referenzen li {   
   width: 150px;
   height: 80px;
   margin-left: 20px;  
}    
   
.referenzen li img {
   width: 120px;
}   
} 

@media only screen and (max-width: 960px) {   
.referenzen {
   padding-top: 50px;
   padding-bottom: 50px;
   padding-left: 20px;
   padding-right: 20px;   
}     
   
.referenzen .lamp {
   display: none;
}   
   
.referenzen-title {
   text-align: center;
   margin-bottom: 0;
	font-size: 3.5rem;   
	font-size: 35px;
	line-height: 3.5rem;
	line-height: 35px;	
}     
   
.referenzen ul {
   width: 100%;   
   margin-top: 20px;
   text-align: center;   
}    
   
.referenzen ul li {   
   float: none;  
   display: inline-block;
   width: 120px;
   height: 64px;
   margin: 12px;      
}    
   
.referenzen li img {
   width: 86px;
}   
   
.referenzen .wrapper-referenzen {
   text-align: center;     
}   
}    
/*----------------------- referenzen end*/

/*----------------------- featured start*/
@media only screen and (max-width: 550px) {  
#featured h2  {
	margin-bottom: 0px;
	font-size: 3.4rem;
	font-size: 34px;
	line-height: 5.2rem;
	line-height: 52px; 
}
}
/*----------------------- featured end*/

/*----------------------- cta kontakt start*/
@media only screen and (max-width: 550px) {   
 .cta-kontakt .col-left {
   float: left;
   width: 100%; 
}

.cta-kontakt .col-right {
   float: left;
   width: 100%;
}
 
.cta-kontakt .btn-round {
   margin-top: 40px;
   margin-left: 0px;      
}   
   
.cta-kontakt p {
	margin-top: 15px; 
	font-size: 3.0rem;
	font-size: 30px;
	line-height: 3.4rem;
	line-height: 34px;
}   
}   
/*----------------------- cta kontakt end*/

/*----------------------- features-icons start*/
@media only screen and (max-width: 720px) {   
.features-icons p {
   margin-top: 16px;
	font-size: 1.4rem;
	font-size: 14px;
	line-height: 1.4rem;
	line-height: 14px; 
}   
}   

@media only screen and (max-width: 550px) {   
.features-icons p {
   margin-top: 12px;
}     
.features-icons .columns {  
   margin-top: 18px;
}     
}    
/*----------------------- features-icons end*/

/*----------------------- fonts start*/
@media only screen and (max-width: 550px) {   
h1, 
h2 {
	margin-bottom: 20px;
	font-size: 3.5rem;
	font-size: 35px;
	line-height: 4.0rem;
	line-height: 40px;
}
} 
/*----------------------- fonts end*/

/*----------------------- misc start*/
@media only screen and (max-width: 550px) {   
.row-margin-mobile .row > .columns {
   margin-bottom: 26px;
}
   
.row-margin-mobile .row > .columns:last-of-type {
   margin-bottom: 0px;
}  
   
.mb-100 {
	margin-bottom: 50px;
}  
   
.inner-100 {
	padding-top: 20px;
	padding-bottom: 20px;
}   
   
.only-mobile {
   display: block;
} 
   
.shadow-visual {   
   -webkit-box-shadow: none;
	-moz-box-shadow: none;
	box-shadow: none;
}  
   
.box-frame {
	display: block;
}   
} 
/*----------------------- misc end*/
   
/*----------------------- footer start*/
@media only screen and (max-width: 765px) {
#footer {
	padding-top: 25px;
	padding-bottom: 25px;
}
   
.footer-logo {
   margin-top: 0px;
   padding-top: 25px;
   border-top: solid 1px #9F9F9F;  
} 
   
.footer-logo img {
   height: 30px;
   display: block;
   margin-left: auto;
   margin-right: auto; 
}   

.footer-left {
   float: none;
}
   
.footer-menu {
   float: none;
   padding-bottom: 25px;
   border-bottom: solid 1px #9F9F9F;  
}
   
.footer-menu ul {
   margin-bottom: 0px;   
}   
   
.footer-menu li {
	float: left;   
	margin-right: 15px; 
   padding-left: 15px;     
	
}   
   
.footer-menu li:last-of-type {
	margin-right: 0px;  
}    
   
#footer p {
	text-align: center;     
}  
   
#footer p.align-right {
   float: none;
	text-align: center;    
}    
   
.footer-right {
   float: none;
   margin: 0;
   padding-top: 25px; 
   text-align: center;  
}  
}

@media only screen and (min-width: 461px) and (max-width: 765px) {   
.footer-menu {
    text-align: center;     
}   
   
.footer-menu ul {
    display: inline-block;  
}    
}   

@media only screen and (max-width: 460px) {
.footer-menu ul {
	margin: 0;
	padding: 0;	 
}

.footer-menu li {
   float: none;  
	margin-right: 0px; 
   margin-bottom: 20px;
   padding-left: 0px;
	text-align: center;   
   border: none; 
}  
   
.footer-menu li:last-of-type {
   margin-bottom: 0px;
}    
}     
/*----------------------- footer end*/
