/* Tablets landscape smaller screens */
@media only screen and (max-width:1200px) {
    .hero-text-box {
       
        width: 100%;
        padding:0 2%;
        
    }
    .row {
        padding: 0 2%;
    }
    .logo {
        width:300px;
        height:auto;
    }
}
/* tablets portrait */
@media only screen and (max-width:1023px) {
    body {
        font-size:16px;
    }
    section { padding: 60px 0px; }
    .long-copy {
        width:80%;
        margin-left:10%;
    }
    .contact-form {
        width:80%;
    }
    .logo {
        width:260px;
        height:auto;
        transform: translate(-35px,0px);
    }
    .main-nav {
        font-size:110%;
    }
    .main-nav li {
        margin-left:10px;
    }
 
}
/* Larger phones or small tablets */
@media only screen and (max-width:767px) {
    body { font-size:16px; }
    section { padding: 30px 0; }
    .row,
    .hero-text-box { padding:0 4%;font-size:14px; }
    .col {
        width:100%;
    }
    .logo {
    
      	width:180px !important;
        position:absolute;
        top:5% !important;
        left:50%;
        transform: translate(-50%,5%);
    }
    .mobile-nav-icon {
        display:inline-block;
    }
    .main-nav {
        float:left;
        z-index:9999;
    }
    /*.main-nav li {
        display: block;
    }
    .main-nav li a:link,
    .main-nav li a:visited {
        display: block;
        border: 0;
    }*/
    .main-nav {
    	display:none;

    }
    .hero-text-box h1 {
    	padding-top:220px;
    	font-size:140%;
    }
    
    h1 { font-size:180%; }
    h2 { font-size:150%; }
    .section-services {
        height:auto;
    }
    .section-contactus {
        height:auto;
    }
    label {
        padding-bottom:15px;
    }
    .long-copy {
        width:80%;
        
    }
    .logo {
        width:300px;
        height:auto;
    }
}

/* Small phone 0 to 480px */
@media only screen and (max-width: 480px) {
    .logo {
        width:300px;
        height:auto;
    }
    body { font-size:16px; }
    section { padding: 30px 0; }
    .row,
    .hero-text-box { padding:0 4%; }
    .hero-text-box h1 {
    	padding-top:200px;
    }
    h1 { font-size:180%; }
    h2 { font-size:150%; }
    .col {
        width:100%;
    }
    .main-nav {
    	display:none;

    }
    .header-bar {
    	height:30px;
    	font-size:80%;
    }
    .logo {
        position:absolute;
        top:0%;
        left:50%;
        transform: translate(-50%,5%);
    }
    .hero-text-box h1 {
    	font-size:130%;
    }
    .section-services {
        height:auto;
    }
    .section-contactus {
        height:auto;
    }
    .long-copy {
        width:80%;
        
    }
   
   
}