/*PRE-LOAD*/
#preload-01 { background: url(http://domain.tld/image-01.png) no-repeat -9999px -9999px; }
#preload-02 { background: url(http://domain.tld/image-02.png) no-repeat -9999px -9999px; }
#preload-03 { background: url(http://domain.tld/image-03.png) no-repeat -9999px -9999px; }


@charset "UTF-8";

/* Reset */
* {
  padding: 0 0 0 0;
  margin: 0 0 0 0;
  border:none;
}

/* Base */

html {}

body {
  font-family: 'Open Sans', arial, verdana, sans-serif;
  background: url(../img/background.jpg) repeat-x center 334px #fefefe;
  padding: 0px 0px;
}

p {}
a {}
img {}
a img {border: none;}

input, textarea {}
form {}

h1, h2, h3, h4, h5, h6 {}

ul {padding: 15px 0px 15px 25px;}
li {}



/* Estilos */

.wrapper {margin: 0 auto;
  overflow: hidden;
  max-width: 1200px;}

.col-up, .col-bottom {
  position: relative;
}
.col-up {width: 100%;}
.col-bottom {width: 100%;}

.tittle img {margin-bottom: 20px; height: 63px; }

.row {margin: 25px 0;}
.tittle {
  padding: 40px 400px 0px 0px;
  text-align: center;
  background: url(../img/people.png) no-repeat right bottom;
  background-size: 400px 300px;
  height: 250px;
  margin-top:3px;
}
.products {
  background: url(../img/tuberia.png) no-repeat right bottom;
  margin-bottom: 50px !important;
  padding-bottom: 45px;
}
.description {padding-right: 5px;}
.table {}

.form {
  overflow: hidden;
  margin: 0px 0px 50px;
  padding: 10px;
  background: #EEEEEE;
  color: #26533c;
  text-align: center;
}

.form h3 {font-size: 30px; margin: 13px 0px 0px;}
.form p {line-height: 18px; font-size: 12px;}

.contact-item {padding: 10px 0px 10px 33px; border-bottom: 1px solid #CDCDCD;}
.contact-item span {color: #22a822}
.email {background: url(../img/icon-mail.png) no-repeat 1px;}
.phone {background: url(../img/icon-phone.png) no-repeat 1px;}
 
.form-left {
  float: left;
  width: 40%;
  padding: 25px 0px 2px;
  text-align: left; 
  color:#5a5a5a;
}

.form-right {
  float: right;
  width: 40%;
  padding: 0 2%;
  position: relative; 
}



form {
  margin-top: 17px;
  text-align: left;
  border-bottom: 1px solid #26533C;
  margin-bottom: 50px;
}
input, textarea {
  padding: 3px; 
  width: 97%;
  margin-bottom: 10px;
  resize: none;
  background-color: #CCDAD3;
  color: #767676;
  font-size: 13px;
  letter-spacing: 1px;
}

input[type="submit"] {
  font-size: 23px;
  width: 99%;
  background: #CCDAD3;
  color: #26533C;
  box-shadow: 1px 1px 2px #E0E0E0 inset , -1px -1px 2px #818181 inset;
}
input[type="submit"]:hover {
  box-shadow: 1px 1px 2px #818181 inset, -1px -1px 2px #E0E0E0 inset;
}



.table {overflow: hidden;}
.table-group {
  float: left;
  width: 30%;
  margin: 24px 13px 5px;
  padding: 5px;
  min-height: 265px;
  background-color: rgba(255,255,255,0.9);
  border: 1px solid #eee;
  border-radius: 10px;}
.table-header {
  border-bottom: 1px solid #707070;
  text-align: center;
  font-weight: bold;
  color: #418964;
  padding: 15px;
  min-height: 180px;
}
.table-cell {}


.footer {
  width: 100%;
  height: 100px;
  background: url(../img/background.jpg) repeat-x center;
}

.privacidad {
  font-size: 10px;
}

@media (max-width: 1100px) {
  .products {padding-bottom: 165px;}
  .table-group {font-size: 14px; width: auto; min-height: 0; }
}


@media (max-width: 825px) {
  .top: 210px;, .col-bottom {width: 98%; margin:0 1%; float: none;}
  .description {text-align: center;}
  .products {padding-bottom: 200px;}
  .products img {margin: 5px !important; width: 29%; max-width: 200px;}
  .table-group {float: none; width: auto; min-height: 0; margin-bottom: 30px;}
  .form {padding:10px;}
}

@media (max-width: 720px) {
  .tittle {
    padding: 20px 0px 360px 0px;
    height: 250px;
    background: url(../img/people.png) no-repeat center bottom;
  }
  body {padding:0px;background-position: center 695px; }
  .form-right, .form-left {width: 90%; padding: 5px; margin:0 auto; float: none;} 
}




.tittle-left {width: 100%;}
.tittle-right {
  width: 100%;
  text-align: right;
  padding: 10px 0;
  border-bottom: 1px solid #eeeeee;
}
.table-group {height: 0px;}
.table-group {transition: all .3s ease-in-out;}
.table-header > div {transition:background .3s ease-in-out;}
.table-group {height: auto;}

.img-investigacion {background: url(../img/item-investigacion.png) top no-repeat; width: 123px; height: 123px; margin: 0 auto 12px;}
.img-cobranza {background: url(../img/item-cobranza.png) top no-repeat; width: 123px; height: 123px; margin: 0 auto 12px;}
.img-judicial {background: url(../img/item-judicial.png) top no-repeat; width: 123px; height: 123px; margin: 0 auto 12px;}

.table-group:hover > .table-header > div {background-position: bottom;}
.table-group:hover {background: #eeeeee; border-radius: 5px;}
.table-cell {font-size: 14px; padding: 10px;} 

.contacto {
  background-color: #418964;
  padding: 10px 15px;
  border-radius: 5px;
  text-decoration: none;
  color: #fff;
  border-bottom: 2px solid #707070;
}