/* From big tablets to 1200px(width smaller then the 1140px row)*/

@media only screen and (max-width: 1200px) {
    .hero-text-box {
        width: 80%;
        padding: 0 2%;
    }
    

    .row {
        padding: 0 2%;
    }


}




/* Small tablet to big tablet: from 768px to 1023px */

@media only screen and (max-width: 1023px) {

     
 
    body {
        font-size: 18px;
    }

 

    .logo {
        margin-left: 4%;
    }
    
     

    .hero-text-box {
        margin-left: 5%;
    }

    .long-copy {
        width: 80%;
        margin-left: 10%;
    }
    
    
}



/* Small phones to small tablets: from 481px to 767px*/

@media only screen and (max-width: 767px) {

    .heading3{
        margin-top: 30%;
    }
    
    .heading2{
        font-size: 140%;
    }
 
    .section-form{

        margin-left: 2%;
        margin-bottom: 5%;
    }
    .row2{
        padding-top:  5%;
    }
    .smalliconsText,
    .box p{
       
        margin-left: 7%;
    }
    .smallPhoto{
        margin-left: 7%;
    }
    
    .kontakt{
        font-size: 60%;
        padding-left: 15%;
    }
    h2{
        font-size: 120%;
    }
  
  
    
    body {
        font-size: 20px;
        
    }
    
       html, body,header {
    max-width: 100%;
    overflow-x: hidden;
    
}
    

    section {
        padding: 30px 0;
    }

    .row
     {
        margin-left: 5%;
        font-size: 70%;
    }
    .row2{
        margin-left: 7.8%;
    }
    .hero-text-box{
        font-size: 50%;
        margin-left: 0;
    }

    .col {
        width: 100%;
    }

    .main-nav {
        display: none;
       
       
    }

    .mobile-nav-icon {
        /*margin: 0px 10px;*/
   margin-right: 10px;
        margin-top: 25px;
        display:inline-block;
    }

    .main-nav {
        float: left;
        margin-top: 35px;
        margin-left: 5px;
    }

    .main-nav li {
    
        display: block;
        
    margin-left: 10px;
    }

    .main-nav li a:link,
    .main-nav li a:visited {
        display: block;
        border: 0;
        padding-left: 4px;
        padding-top: 5px;
      
        padding-bottom: 7px;
        font-size: 100%;
    }

    .sticky .main-nav {
        margin-top: 10px;
    }

    .sticky .main-nav li a:link,
    .sticky .main-nav li a:visited {
        padding-left: 4px;
        padding-top: 5px;
      
        padding-bottom: 7px;
        
    }

    .sticky .mobile-nav-icon {
       margin-top: 15px;
        margin-right: 10px;
        
    
    }

    .sticky .mobile-nav-icon i {
        color: #555;
    }


    .logo {
        height: 50px;
        width: auto;
        margin-left: 0px;


    }
    .logo-black {
        height: 40px;
        width: auto;
        margin-left: 0px;
       


    }

    .long-copy {
        font-size: 120%;
            width:100%;
        margin-left: 1px;
        padding-left: 0px;
            padding-bottom:20px;
            
    }
    
    

}


@media only screen and (max-width: 590px) {
    .mobile-nav-icon {
        display: inline-block;
    }

    

    .main-nav {
        float: left;
        margin-top: 30px;
        padding-left: 0px;
        margin-left: 0px;


    }

    .logo {
        height: 40px;
        width: auto;
        margin-left: 0px;


    }

}


/*iphone resolution*/

/* iphone 6+, 6s+, 7+, 8+ */
/*
@media only screen and (min-device-width: 414px) and (max-device-height: 736px) and (-webkit-device-pixel-ratio: 1) {
    .col{
        width: 100%;
    }
    
  

/* iphone X , XS, 11 Pro */
@media only screen and (min-device-width: 375px) and (max-device-height: 812px) and (-webkit-device-pixel-ratio: 3) {



}

/* iphone XR, 11 */
@media only screen and (min-device-width : 414px) and (max-device-height : 896px) and (-webkit-device-pixel-ratio : 2) {}

/* iphone XS Max, 11 Pro Max */
@media only screen and (min-device-width : 414px) and (max-device-height : 896px) and (-webkit-device-pixel-ratio : 3) {}




/*Small phones: from 0 to 480px*/
@media only screen and(max-width: 480px) {}