@media screen and (max-width: 960px) {
    
    .mobile-only{
        display:inherit;
    }

    #header {
        transition: all 0.2s;     
    }
     
    .scroll-down #header  {
        transform: translate3d(0, -100%, 0);
    }
     
    .scroll-up #header  {
        transform: none;
        position:-webkit-sticky; 
        position: sticky;
        top: 0px;
        z-index:10000;  
    }    

    .home-bg.scroll-up > #header{
        background-color: #3A3F42;
    }

    .sticky{
        position: relative;
     }


    br.break {display:none}
    
    a.btn-contact {display:none}

    .home-col{
        width:100%;
    }

    .flex-panels{
        flex-direction: column;
        flex-wrap: wrap;
    }
    
    .flex-panels > div {
        min-height:400px;
        width: 100%;
    }
    
    .container:nth-child(1) .image{
        order:1;    
    }
    
    .container:nth-child(1) .text{
        order:2;    
    }
    
    .content{
      padding:3em 5em;
      width:100%;
      --margin-top:-430px;
      margin: 20px 0;
    }

    .flex-testimonials {
        display: flex;
        margin: 0 -4em;
        flex-wrap:wrap;
    }
    
    .flex-testimonials > div{
        width:100%;
    }

    .mobile-nav{
        cursor: pointer;
        display: block;
    }

    nav ul{
        text-align:left;
        display: none;
        position: absolute;
        width: 100%;
        left:0;
        margin-top:1px;
        background-color: #7c878e;
        z-index: 10000;
        padding:  0;
        top:126px;
        box-shadow: 0 0 20px rgba(0, 0, 0, 0.33);
    }
    
    nav ul li:hover ul.dropdown {
        display: none;
    }
    
    nav ul.dropdown li{  
        white-space: normal;    
    }

    nav ul > li a{
        font-size:1em;
        color:white;
        display:inline-block;
    }
    
    nav ul > li > small{
       position:absolute;;
       right:0;
       top:0;
       background:rgba(255,255,255,0.15);
       padding:10px 13px;
       z-index:100000;       
    }

    nav ul li small:hover + ul.dropdown {
        display: block;       
    }
 
    nav ul li small + ul.dropdown:hover {
        display: block;       
    }
    
    nav ul > li{
        display: block;
        padding: 0.5em 0.5em;
        padding-bottom:6px;
        position: relative;
        border-bottom:1px solid rgba(255,255,255,0.66);
        width:100%;   
    }

    nav ul.dropdown{  
        display: none;
        position: relative; 
        border:0  ;
        padding:0 ;
        top:-2em;
        margin: 0.5em 0;      
        box-shadow: none;    
        padding-top:2em;
        margin-bottom:-2em;

        background: transparent;
      
    }

    nav ul.dropdown li{
        padding: 0.25em 1em;
        border:0;
        --border-top:1px solid rgba(255,255,255,0.66);
    }
    
    .styled-table {        
        width:100%;
    }

    
}


@media screen and (max-width: 640px) {
    
    body{
        font-size:85%;
    }
    
    nav > *{
        font-size:1.2em;
    }
    
    .hero a.btn {
        position:relative;
        right: auto;
        bottom: auto;
    }

    .content{
      padding:2.8em 1.5em ;
      padding-bottom:3.5em;
    }
    
    h1.hero, .hero{
       padding:0;
    }
    
    h1.small{
        font-size:2.85em;
    }
    
    .hero{
       padding:2em 0;
        padding-bottom:1.2em;
    }
    
    .content h1{
       margin-bottom:0.5em;
       font-size:2.7em;
    }
    
    .flex-panels > div {
        min-height: 200px;
    }
    
    div.text{
      padding:2em;
    }
    
    .content  ul.horizontal li{  
        width:100%;
    }
    
    .content ul.horizontal{
        height:auto; 
    }
    
    .team-header{
       align-items:center;
       flex-wrap:wrap;  
    }

    .head-shot{
        margin:auto;
        margin-bottom:1em;
    }
    
    .team-header-right{
        text-align:center;
        margin:auto
     }
     
     .icon-list{
        justify-content:space-around;
     }
     



}

@media screen and (max-width: 540px) {
    .home-panels > div{
        width:100%;
    }
    
    .home-panels > div > div {
        font-size:120%;
    }
    
    footer a{
        display:block;   
    }
    
    footer a:nth-child(2){
        padding: 1em 0;
    }

    footer {    
      padding:28px 0;
    }
    
}