hr {
    max-width: 30px; border: none; height: 3px; background: #ff7800; margin: 7px 0 7px;
}
.contacto-cont {
    display: block; width: 100%; height: 100vh;
}
.contacto-left-wrap, .contacto-right {
    float: left; width: 50%; height: 100%; position: relative;
}
.contacto-left-cont {
    position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100%; padding: 50px;
}
.contacto-mapa {
    background: #ccc; height: 100%;
}
.contacto-top-title {
    display: table; width: 100%; position: relative;
}
.contacto-top-title h2{
    font-size: 60px; color: #ff7800; text-transform: uppercase; max-width: 400px; float: left;
}
.contacto-redes-sociales {
    float: right;
}
.contacto-redes-sociales .fa {
    font-size: 25px; padding-right: 10px;
}
.contacto-info {
    display: table; width: 100%; margin: 15px 0;
}
.contacto-info p {
    font-size: 16px;
}
.contacto-info .tel {
    float: left;
}
.contacto-info .dir {
    float: right; text-align: right;
}
/*FORMULARO*/
.contacto-cont input[type=text],
.contacto-cont input[type=number],
.contacto-cont input[type=password],
.contacto-cont input[type=email],
.contacto-cont textarea,
.contacto-cont select,
.contacto-cont input[type=submit] {
    appearance:none; -webkit-appearance:none; background: #fff;
    -moz-appearance:none; -ms-appearance:none; -o-appearance:none;
    margin: 0; padding: 0;
}
.contacto-cont input[type=text],
.contacto-cont input[type=number],
.contacto-cont input[type=email],
.contacto-cont textarea {
    border: 1px solid #ccc; width: 100%; height: 50px; padding: 0 10px; font-size: 14px;
}
.contacto-cont textarea {
    height: auto; padding: 10px;
}
.field {
    display: table; width: 100%; height: auto; padding-bottom: 10px;
}
.fLeft {
    float: left; width: 50%; padding-right: 5px;
}
.fRight {
    float: left; width: 50%; padding-left: 5px;
}
.contacto-cont input[type=submit] {
    border: none; color: #ff7800; font-size: 30px; text-transform: uppercase; font-family: 'Fjalla One', sans-serif;
    margin: 5px 0 0;
}
@media screen and (max-width: 1600px){
    .contacto-left-wrap {width: 55%}
    .contacto-right {width: 45%;}
}
@media screen and (max-width: 1400px){
    .contacto-left-wrap {width: 60%}
    .contacto-right {width: 40%;}
}
@media screen and (max-width: 1300px){
    .contacto-redes-sociales {position: absolute; right: 0; bottom: 13px;}
}
@media screen and (max-width: 1200px){
    .contacto-left-wrap {width: 65%}
    .contacto-right {width: 35%;}
    .contacto-top-title h2 {font-size: 50px;}
    .contacto-redes-sociales {bottom: 13px;}
}
@media screen and (max-width: 1000px){
    .contacto-top-title h2 {font-size: 45px;}
    .contacto-info p {font-size: 14px;}
    .contacto-redes-sociales {bottom: 10px;}
    .contacto-cont input[type=text],
    .contacto-cont input[type=number],
    .contacto-cont input[type=email], .contacto-cont textarea {height: 40px; font-size: 12px;}
    .contacto-cont textarea {height: 100px; padding: 10px;}
}
@media screen and (max-width: 850px){
    .contacto-top-title h2 {font-size: 40px;max-width: 300px;}
    .contacto-left-wrap {width: 70%}
    .contacto-right {width: 30%;}
    .contacto-left-cont {padding: 30px;}

}
@media screen and (max-width: 750px){
    .contacto-cont {height: auto;}
    .contacto-left-wrap {width: 100%; }
    .contacto-left-cont {position: relative; top: inherit; left: inherit; transform: none; padding: 50px 30px;}
    .contacto-right {width: 100%; height: 250px;}
}
@media screen and (max-width: 500px){
    .fLeft, .fRight {width: 100%; padding: 0;}
    .field {padding: 0;}
    .contacto-cont input[type=text],
    .contacto-cont input[type=number],
    .contacto-cont input[type=email],
    .contacto-cont textarea { margin-bottom: 10px;}
    .contacto-info .dir, .contacto-info .tel{float: none;}
    .contacto-info p {text-align: left;}
    .dir br {display: none;}
}
@media screen and (max-width: 400px){
    .contacto-redes-sociales {bottom: inherit; position: relative; float: none; margin: 5px 0 0; display: none;; }

}