
/* PARA MOVILES Y TABLETAS */
@media only screen and (max-width: 599px){
   
    #container{
    }
    
    #top_area{
        width:95%;        
        height:70px;
        
    }
   
    img#logo{ /* 362px × 158px*/
        width:128px;
        height:55px;     
        float:right;
        margin-top:7px;
    }
    
    
    
    /* MENU RESPONSIVE PARA MOVILES Y TABLETAS PEQUEÑAS */
    #menuPeq{
        width:60%;
        right:left;
        z-index:4;
        position:absolute;
        
        
    }
    
    
    #menu{
        height:100%;
        float:left;;      
        background-color:#ff8820;
        /*background-color:#FF7518;*/
        width:75%;
        display:none;
        box-shadow: 0px 2px 5px #000;
        
        
    }
    
    #imgMenPeq{
        height:25px;
        width:25px;
        background: url(../images/menuIcon1.png) no-repeat #ff8820;
        /*background-image: url(../images/menuIcon1.png) no-repeat;*/
        background-size: 25px 25px;
        float:left;
        margin-left:5%;
        margin-right:3%;
        margin-top: 3%;
    }
    
    nav#menu ul li{
        margin: 4px;
        padding:4px;
        border-bottom: 2px solid #FFF1E4;
        text-align:center;
    }
    
    nav#menu ul li:last-child{
        border-bottom:none;
        
    }
    
    nav#menu ul li a{
        text-decoration: none;
        color:#FFF1E4;
        font-weight:bold;
        font-size:1.4em;
        
    }
    
    /* fin MENU RESPONSIVE PARA MOVILES Y TABLETAS PEQUEÑAS} */
    
    
    .bx-wrapper .bx-caption span{    
      font-size: 1.2em;
    }
    
    .mid_area{
        margin:0 auto;
        width:90%;
        padding:3%;
        height:140px;
    }
    .cuadro_index{
        width:45%;
        float:left;
        margin-left: 2%;        
        background-color:#f1f1f1;
        height:250px;
        margin-bottom:2%;
    }
    
    .wktm1{
        margin-bottom:400px !important;
    }
    
    footer{        
        width:90%;
        margin: 0 auto;
        text-align:center;
        padding:10%;
    }
    footer p{
        max-width:90%;
    }
    
    
    .contentArea1{
        max-width:900px;
        height:320px;
        margin-bottom:500px;
    }
    
    .empresaCuadro{
        width:100%;        
        margin-bottom:5%;
        float:left;
        box-shadow: 2px 2px 5px #000;
    }
    
    .empresaCuadro h2{
        background-color:#ff8820;
        color:#FFF1E4;
        padding:5px;
    }
    
    .empresaCuadro span p{
        padding:5px;
        font-size:14px;
        line-height:1.3em;
    }
    
    
    
    /* SERVICIOS */
    .service_container{
        width:100%;
        margin-bottom:10px;
        border:2px solid #ff8820;
    }
    
    .service_container p.serviceTitle{
        background-color:#ff8820;
        padding:5px;
        font-weight:bold;
        font-size:13px;
        cursor:pointer;
    }
    
    .service_container .serviceContent{
        padding:3px;
    }
    
    .service_container .serviceContent span{
        font-size:12px;
    }
    
    .serviceContent img{
        width:96%;
        margin:2%;
    }
    
    #display_service5 span ul li, #display_service2 span ul li{
        list-style:disc;
        margin-left:20px;
        margin-top:6px;
    }
    
    .contentArea2{
        min-height:330px;
    }
    
    .contentArea2 span{
        font-size:13px;
    }
    
    
    
    /* EXPERIENCIA */
    .experiencia_container{
        width:94%;
        margin-bottom:10px;        
        margin-top: 10px;
        padding: 3%;
        box-shadow: 0px 2px 5px #000;
        border-radius: 4px;
    }
    
    b.tipoExp{
        font-size:13px;
    }
    
    
    
    /* PORTAFOLIO */
    .portfolio_cliente{
        width:100%;
    }
    
    .portfolio_cliente table{
        width:100%;
    }
    
    .portfolio_cliente table tr td.nombreEmp{
        font-size:13px;
        vertical-align:middle;
        font-weight:bold;
    }
    
    .portfolio_cliente table tr td{
        padding-bottom:20px;
    }
    
    .portfolio_cliente table tr td.logoEmp img{
        height:40px;
    }
    
    
    /* CONTACTOS */
    .contactoContainer{
        width:100%;
        padding-bottom:100px;
    }
    
    .contactoIndeed{
        width:96%;
        box-shadow: 0px 2px 5px #000;
        border-radius: 4px;
        padding:2%;
    }
    
    .contactoIndeed table tr td{
        padding:4px;
        font-size:13px;
    }
    
    .contactoIndeed table tr td{
        vertical-align: top !important;
    }
    
    .contactoIndeed table tr td a img{
        height:100px;
        width:100px;
    }
    
    /* index agregando los servicios con efectos*/
    .work_areaServ{
        display:none;
    }
}
