


/* big tablets to 1200px (widhts smaller than the 1140px row) */
@media only screen and (max-width:1200px){
    .main-text {width: 100%; padding:0 2%;}
    
    .row{padding:0 2%;}
    
    .logo{margin-left: 0;
        
        
    
    }
    
    
}






/* Small tablets to big tablets: from 768px to 1023px */
@media only screen and (max-width:1023px){
    body{font-size: 18px;}
    
    section{padding:60px,0;}
    
    company-background {width:80%; margin-left: 10%;}
    
    .news{height: 80vh;}
    
    .dots {top:20px;width:9px;height:9px;}
    
    .step-box {margin-top:10px;}
 
    .works-step div {margin-top:10px;}

    .works-step p {padding-top:15px; margin-bottom: 30px;}
  
    .apps {width: 60%;}
   
    }





/* Small Phones to small tablets: from 481px to 767px */
@media only screen and (max-width:767px){
    .main-text,.row {width: 100%; padding:0 4%;}
    
    .col {width:100%;}
    .main-nav{display:none;}
    .mobile-nav-icon{display:inline-block;}
    
    .main-nav{float: left; margin-top:0; margin-left:25px;}
    
    .main-nav li{display:block;}
    
    .main-nav li a:link,
    .main-nav li a:visited{display:block; border:0; padding:5px 0;}
    
    .sticky .main-nav li a:link,
    .sticky .main-nav li a:visited{ padding:  0;}
    .sticky .mobile-nav-icon i {color:#555;}
    .sticky .mobile-nav-icon i {margin-top:10px;}
    
    .sticky .logo{display: none;}
    
    .sticky .logo-black{display:block;
    
    }

    .logo-black{margin-left: 2px; padding-left: 0;}
    
    
    body{font-size: 16px;}
    
    section{padding:30px,0;}
    
    .step-box {margin-top:5px;}
 
    .works-step div {margin-top:5px;height:35px;width: 35px;}

    .works-step p {padding-top:10px; margin-bottom: 25px;font-size: 80%;}
    
    .apps {width: 40%; margin-bottom: 20px;display: inline;float:none;margin-right:0;}
    
    .step-box:first-child {text-align:center;padding-left:0;}
    
    .news{height: 60vh;}
    
    .dots {top:20px;width:9px;height:9px;}
    
}






/* Small Phones: from 0 to 480px */
@media only screen and (max-width:480px){
    
    .news{height: 50vh;}
}