

/* CONTACTO */

#mapaContainer{
    background:#f5f5f5;
    height:250px;
    margin-bottom:50px;
}
#mapaContainer #mapa{
    width:100%;
    height:100%;
}

#contacto .columnas .titulo{
    margin-top:40px;
}

#contacto form{
    position:relative;
}
#contacto form input,
#contacto form textarea{
    display:inline-block;
    width:100%;
    line-height:1.2;
    background:#cacaca;
    color:#fff;
    margin-top:20px;
    font-size:2em;
    padding:10px 20px 8px;
    
    box-sizing:border-box;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    
    transition:background 300ms ease-out;
    -webkit-transition:background 300ms ease-out;
    -moz-transition:background 300ms ease-out;
    -o-transition:background 300ms ease-out;
}

#contacto input::-webkit-input-placeholder,
#contacto textarea::-webkit-input-placeholder {
    color: inherit;
}
#contacto input:-moz-placeholder,
#contacto textarea:-moz-placeholder {
    color: inherit;
}
#contacto input::-moz-placeholder,
#contacto textarea::-moz-placeholder {
    color: inherit;
}
#contacto :-ms-input-placeholder,
#contacto :-ms-textarea-placeholder {
    color: inherit;
}
#contacto form input:focus,
#contacto form textarea:focus{
    background:#9f9f9f;
}

#contacto form button{
    width:100%;
}

#contacto form .msj_contacto_iefix{
    display:none;
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    padding:40px 20px 20px;
    background:rgba(255,255,255,.8);
    
    box-sizing:border-box;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
}
#contacto form .msj_contacto_iefix .msj_contacto{
    height:100%;
    font-size:0;
}
#contacto form .msj_contacto_iefix .msj_contacto:before{
    content:"";
    height:100%;
    display:inline-block;
    vertical-align: middle;
}
#contacto form .msj_contacto_iefix .msj_contacto span{
    font-size:20px;
    color:#606060;
    text-align: center;
    margin-top:20px;
    display:inline-block;
    vertical-align: middle;
}


/* ********************** de Mobile a TABLET ********************** */

@media only screen and (min-width: 768px) {
    
    #mapaContainer{
        height:400px;
    }
    
    #contacto .columna.doble,
    #contacto .columna.simple{
        width:100%;
    }
    #contacto form{
        max-width: 600px;
        margin:0 auto;
    }
    #contacto .columnas .titulo{
        text-align: center;
    }
    
    #contacto form .columnas{
        margin:0 -10px;
    }
    #contacto form .columnas .columna{
        padding:0 10px;
    }
    
    #contacto form input,
    #contacto form textarea{
        padding:12px 20px 11px;
    }
    
    #contacto form button{
        width:50%;
        border-left:5px solid #fff;
        border-right:5px solid #fff;
        margin:18px auto 0;
        display:block;
    }
    
    #contacto .datos{
        max-width:500px;
        margin:0 auto;
    }
    
}




/* ********************** de Tablet a DESKTOP ********************** */

@media only screen and (min-width: 980px) {
    
    #mapaContainer{
        height:450px;
        margin-bottom:85px;
    }
    
    #contacto .columna.doble{
        width:66.66666%;
    }
    #contacto .columna.simple{
        width:33.33333%;
    }
    #contacto form{
        max-width:none;
        margin:0;
    }
    #contacto .columnas .titulo{
        text-align: left;
        padding:15px 0 10px;
    }
    
    #contacto form button{
        margin:18px 0 0;
        margin-left:50%;
        border-left:10px solid #fff;
        border-right:none;
    }
    
    #contacto .datos{
        max-width:none;
        margin:0;
    }
    
}