@charset "utf-8";
/* CSS Document */

/* unica */
.alin-1 {
  text-align: left
}

.alin-2 {
  text-align: center
}

.alin-3 {
  text-align: right
}

.may {
  text-transform: uppercase
}

.r {
  font-weight: bold
}

.imagen_max100 {
  max-width: 100%;
  max-height: 100%
}

.error {
  color: #FF4242;
}

.ingresado {
  color: #0683FF;
}

.warning {
  color: #F33F42
}

.valor {
  color: #f00
}

.inv {
  filter: invert(100%);
  -webkit-filter: invert(100%);
}

.back_fff {
  background: #fff
}

/* cursores */
.c-text {
  cursor: text
}

.c-move {
  cursor: move
}

.c-crosshair {
  cursor: crosshair
}

/* boton fixed siguiente usado en etiquetas*/
.boton_fixed_bottom {
  position: fixed;
  left: 20%;
  bottom: 0;
  background: #d2d2d2;
  border-top: 1px solid #BDBDBD;
  padding: 10px 0 20px 10px;
  z-index: 3;
}

/* Message actions*/
.message_actions {
  position: fixed;
  width: 40%;
  padding: 15px;
  bottom: 0px;
  right: 5%;
  color: #FFF;
  border-top-right-radius: 5px;
  border-top-left-radius: 5px;
  font-size: 15px;
  z-index: 20;
}

/* modificar productos */
.modificar {
  border: solid 1px #ccc;
  background: #F8F8F8;
  width: 100%;
  height: 40px;
  cursor: pointer;
  color: #000;
  outline: none;
  font-size: 12px;
  text-align: center;
  border-radius: 10px
}

.modificar:hover {
  background: #E2E2E2;
}

.text_modificar {
  border: solid 1px #ccc;
  background: #F8F8F8;
  height: 40px;
  color: #000;
  line-height: 38px;
  text-transform: uppercase;
}

.text_general {
  padding: 8px 0px 8px 0px;
  width: 100%;
  height: 40px;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  border: 1px solid #ccc;
  font-size: 15px;
  background: #FFF
}


/* */

/* div galerias imagenes */
.div_ext_general {
  position: relative;
  float: left;
  width: 33%;
  text-align: center;
  box-sizing: border-box;
  padding: 10px
}

.div_int {
  position: relative;
  float: left;
  min-width: 100%;
  min-height: 100%;
  border: 1px solid #E0E0E0;
  padding: 8px;
  box-sizing: border-box;
  transition: 1s;
  background: #fff;
  border-radius: 7px;
  box-shadow: 0 0 10px #ccc;
}

.div_int:hover {
  border: 1px solid #0080FF
}

/* 2 imagenes */
.div2_ext1 {
  position: relative;
  float: left;
  width: 50%;
  text-align: center;
  box-sizing: border-box;
  padding: 0px 8px 15px 0px;
}

.div2_ext2 {
  position: relative;
  float: left;
  width: 50%;
  text-align: center;
  box-sizing: border-box;
  padding: 0px 0px 15px 8px
}

/* 3 imagenes */
.div3_ext1 {
  position: relative;
  float: left;
  width: 33.33333333%;
  text-align: center;
  box-sizing: border-box;
  padding: 0px 10px 15px 0px;
}

.div3_ext2 {
  position: relative;
  float: left;
  width: 33.33333334%;
  text-align: center;
  box-sizing: border-box;
  padding: 0px 5px 15px 5px
}

.div3_ext3 {
  position: relative;
  float: left;
  width: 33.33333333%;
  text-align: center;
  box-sizing: border-box;
  padding: 0px 0px 15px 10px
}

/* 4 imagenes */
.div4_ext1 {
  position: relative;
  float: left;
  width: 25%;
  text-align: center;
  box-sizing: border-box;
  padding: 0px 12px 15px 0px;
}

.div4_ext2 {
  position: relative;
  float: left;
  width: 25%;
  text-align: center;
  box-sizing: border-box;
  padding: 0px 8px 15px 4px
}

.div4_ext3 {
  position: relative;
  float: left;
  width: 25%;
  text-align: center;
  box-sizing: border-box;
  padding: 0px 4px 15px 8px
}

.div4_ext4 {
  position: relative;
  float: left;
  width: 25%;
  text-align: center;
  box-sizing: border-box;
  padding: 0px 0px 15px 12px
}

/* 5 imagenes */
.div5_ext1 {
  position: relative;
  float: left;
  width: 20%;
  text-align: center;
  box-sizing: border-box;
  padding: 0px 12px 15px 0px;
}

.div5_ext2 {
  position: relative;
  float: left;
  width: 20%;
  text-align: center;
  box-sizing: border-box;
  padding: 0px 9px 15px 3px
}

.div5_ext3 {
  position: relative;
  float: left;
  width: 20%;
  text-align: center;
  box-sizing: border-box;
  padding: 0px 6px 15px 6px
}

.div5_ext4 {
  position: relative;
  float: left;
  width: 20%;
  text-align: center;
  box-sizing: border-box;
  padding: 0px 3px 15px 9px
}

.div5_ext5 {
  position: relative;
  float: left;
  width: 20%;
  text-align: center;
  box-sizing: border-box;
  padding: 0px 0px 15px 12px
}

/* 6 imagenes */
.div6_ext1 {
  position: relative;
  float: left;
  width: 16.6666666667%;
  text-align: center;
  box-sizing: border-box;
  padding: 0px 10px 12px 0px;
}

.div6_ext2 {
  position: relative;
  float: left;
  width: 16.6666666667%;
  text-align: center;
  box-sizing: border-box;
  padding: 0px 8px 12px 2px
}

.div6_ext3 {
  position: relative;
  float: left;
  width: 16.6666666667%;
  text-align: center;
  box-sizing: border-box;
  padding: 0px 6px 12px 4px
}

.div6_ext4 {
  position: relative;
  float: left;
  width: 16.6666666667%;
  text-align: center;
  box-sizing: border-box;
  padding: 0px 4px 12px 6px
}

.div6_ext5 {
  position: relative;
  float: left;
  width: 16.6666666667%;
  text-align: center;
  box-sizing: border-box;
  padding: 0px 2px 12px 8px
}

.div6_ext6 {
  position: relative;
  float: left;
  width: 16.6666666667%;
  text-align: center;
  box-sizing: border-box;
  padding: 0px 0px 12px 10px
}



@media screen and (max-width: 980px) {
  .icono_filtro_fixed {
    width: 100%
  }

  .div2_ext1,
  .div2_ext2 {
    width: 100%;
    padding: 10px
  }

  .div3_ext1,
  .div3_ext2,
  .div3_ext3 {
    width: 50%;
    padding: 10px
  }

  .div4_ext1,
  .div4_ext2,
  .div4_ext3,
  .div4_ext4 {
    width: 50%;
    padding: 10px
  }

  .div5_ext1,
  .div5_ext2,
  .div5_ext3,
  .div5_ext4,
  .div5_ext5 {
    width: 50%;
    padding: 10px
  }

  .div6_ext1,
  .div6_ext2,
  .div6_ext3,
  .div6_ext4,
  .div6_ext5,
  .div6_ext6 {
    width: 50%;
    padding: 10px
  }

  @media screen and (max-width: 800px) {

    .div3_ext1,
    .div3_ext2,
    .div3_ext3 {
      width: 100%;
      padding: 10px
    }

    .div4_ext1,
    .div4_ext2,
    .div4_ext3,
    .div4_ext4 {
      width: 100%;
      padding: 10px
    }

    .div5_ext1,
    .div5_ext2,
    .div5_ext3,
    .div5_ext4,
    .div5_ext5 {
      width: 100%;
      padding: 10px
    }

    .div6_ext1,
    .div6_ext2,
    .div6_ext3,
    .div6_ext4,
    .div6_ext5,
    .div6_ext6 {
      width: 50%;
      padding: 10px
    }
  }