@charset "UTF-8";
/* CSS Document */
/*************************************************************************** [[ Reset defaul navegator styles ]] ******************/
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent; }

body {
  color: #00617F;
  line-height: 1.4;
  font-size: 20px;
  font-family: Open Sans; }

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
  display: block; }

nav ul {
  list-style: none; }

blockquote, q {
  quotes: none; }

blockquote:before, blockquote:after, q:before, q:after {
  content: '';
  content: none; }

table {
  border-collapse: collapse;
  border-spacing: 0; }

a {
  color: #00617F;
  text-decoration: none; }
  a > img {
    border: none; }

/*************************************************************************** [[ Header ]] ******************/
#Header {
  background-image: url("../../images/bgHeader.png");
  background-position: right top;
  background-size: cover;
  float: left;
  width: 100%; }
  #Header > .hLogo {
    float: left;
    margin-left: 2%; }
    #Header > .hLogo .rel-home {
      float: left; }
      #Header > .hLogo .rel-home > img {
        float: left;
        height: 10em;
        padding: 1em 0; }
  #Header > .hDates {
    color: #fff;
    float: right;
    margin-right: 2%;
    text-align: right; }
    #Header > .hDates > div {
      background-position: left center;
      background-repeat: no-repeat;
      background-size: auto 100%;
      clear: right;
      float: right;
      margin: .2em 0; }
      #Header > .hDates > div > a {
        color: #fff; }
    #Header > .hDates > .hTelefono {
      background-image: url("../../images/icoTelefono.png");
      padding: .5em 0 .5em 2em; }
    #Header > .hDates > .hWwhatsApp {
      background-image: url("../../images/icoWhatsApp.png");
      padding: .5em 0 .5em 3em; }
    #Header > .hDates > .hFacebook {
      background-image: url("../../images/icoFacebook.png");
      padding: .5em 0 .5em 3em; }
  #Header > .hMenu {
    background-color: #FF8AED;
    color: #fff;
    float: left;
    text-align: center;
    width: 100%; }
    #Header > .hMenu > li {
      float: left;
      list-style-type: none;
      width: 20%; }
      #Header > .hMenu > li > a {
        color: #fff;
        float: left;
        padding: 1em 0;
        width: 100%; }

/*************************************************************************** [[ Footer ]] ******************/
#Footer {
  float: left; }

/*************************************************************************** [[ Main ]] ******************/
#Main {
  float: left;
  /*Slide  *********************************************************/
  /*Galeria  *********************************************************/
  /****************************** [[ Estuilos Generales ]] ******************/
  /****************************** [[ 404 ]] ******************/ }
  #Main #HSlide {
    float: left;
    height: 25em;
    margin-top: 0;
    position: relative;
    width: 100%;
    z-index: 0; }
    #Main #HSlide > #ContHSlide {
      height: 100%;
      left: 0;
      position: absolute;
      top: 0;
      width: 100%;
      z-index: 80; }
      #Main #HSlide > #ContHSlide > .slide {
        background-color: #fff;
        height: 100%;
        left: 0;
        overflow: hidden;
        position: absolute;
        right: .8em;
        width: 100%; }
        #Main #HSlide > #ContHSlide > .slide > section {
          background-size: cover;
          background-repeat: no-repeat;
          display: none;
          height: 100%;
          position: relative; }
          #Main #HSlide > #ContHSlide > .slide > section > p {
            font-size: 2em;
            font-weight: 100;
            position: absolute;
            left: 2em;
            top: 2em;
            width: 50%; }
        #Main #HSlide > #ContHSlide > .slide > #a-banner {
          background-image: url(/images/renta-tanques-helio.jpg);
          background-position: center; }
        #Main #HSlide > #ContHSlide > .slide > #b-banner {
          background-image: url(/images/venta-blobos.jpg);
          background-position: center; }
        #Main #HSlide > #ContHSlide > .slide > #c-banner {
          background-image: url(/images/inflado-de-globos.jpg);
          background-position: center; }
        #Main #HSlide > #ContHSlide > .slide > #d-banner {
          background-image: url(/images/impresion-globos.jpg);
          background-position: center; }
      #Main #HSlide > #ContHSlide > .paging {
        font-size: 1em;
        position: absolute;
        right: 2em;
        top: 1em;
        width: 25%;
        z-index: 111; }
        #Main #HSlide > #ContHSlide > .paging > a {
          background-color: #FF8AED;
          border-bottom-left-radius: 2em;
          border-top-left-radius: 2em;
          color: #fff;
          float: left;
          margin: .5em 0;
          padding: 1em 1em;
          text-decoration: none;
          opacity: .6;
          position: relative;
          width: 100%; }
        #Main #HSlide > #ContHSlide > .paging > a.activeP {
          background-color: #00617F;
          color: #fff;
          opacity: 1; }
        #Main #HSlide > #ContHSlide > .paging > a:hover {
          cursor: pointer;
          opacity: .8; }
        #Main #HSlide > #ContHSlide > .paging > .show {
          visibility: visible; }
  #Main #Galeria {
    float: left;
    margin-top: 0;
    position: relative;
    width: 100%;
    z-index: 0; }
    #Main #Galeria > #ContGaleria {
      height: 100%;
      float: left;
      position: relative;
      width: 100%;
      z-index: 80; }
      #Main #Galeria > #ContGaleria > .slideGaleria {
        display: none;
        float: left;
        height: 100%;
        position: absolute;
        width: 100%;
        z-index: 100; }
        #Main #Galeria > #ContGaleria > .slideGaleria > .backGround {
          background-color: #00617F;
          height: 100%;
          opacity: .5;
          position: absolute;
          width: 100%;
          z-index: 100; }
        #Main #Galeria > #ContGaleria > .slideGaleria > section {
          display: none;
          height: 100%;
          position: absolute;
          text-align: center;
          width: 100%;
          z-index: 200; }
          #Main #Galeria > #ContGaleria > .slideGaleria > section > img {
            box-shadow: 5px 5px 10px #bbb;
            margin: 2% 0;
            position: relative;
            height: 90%; }
      #Main #Galeria > #ContGaleria > .pagingGaleria {
        float: left;
        margin: 1em 5% 3em 5%;
        position: relative;
        width: 90%; }
        #Main #Galeria > #ContGaleria > .pagingGaleria > a {
          background-position: center center;
          background-size: cover;
          float: left;
          height: 8em;
          margin: 0 0 .5em 1%;
          padding: 0;
          position: relative;
          width: 13.2%; }
        #Main #Galeria > #ContGaleria > .pagingGaleria > .a-banner {
          background-image: url("/images/galeria/arreglos-de-globos-a-domicilio_01.jpg"); }
        #Main #Galeria > #ContGaleria > .pagingGaleria > .b-banner {
          background-image: url("/images/galeria/arreglos-de-globos-a-domicilio_02.jpg"); }
        #Main #Galeria > #ContGaleria > .pagingGaleria > .c-banner {
          background-image: url("/images/galeria/arreglos-de-globos-a-domicilio_03.jpg"); }
        #Main #Galeria > #ContGaleria > .pagingGaleria > .d-banner {
          background-image: url("/images/galeria/arreglos-de-globos-a-domicilio_04.jpg"); }
        #Main #Galeria > #ContGaleria > .pagingGaleria > .e-banner {
          background-image: url("/images/galeria/arreglos-de-globos-a-domicilio_05.jpg"); }
        #Main #Galeria > #ContGaleria > .pagingGaleria > .f-banner {
          background-image: url("/images/galeria/arreglos-de-globos-a-domicilio_06.jpg"); }
        #Main #Galeria > #ContGaleria > .pagingGaleria > .g-banner {
          background-image: url("/images/galeria/arreglos-de-globos-a-domicilio_07.jpg"); }
        #Main #Galeria > #ContGaleria > .pagingGaleria > .h-banner {
          background-image: url("/images/galeria/arreglos-de-globos-a-domicilio_08.jpg"); }
        #Main #Galeria > #ContGaleria > .pagingGaleria > .i-banner {
          background-image: url("/images/galeria/arreglos-de-globos-a-domicilio_09.jpg"); }
        #Main #Galeria > #ContGaleria > .pagingGaleria > .j-banner {
          background-image: url("/images/galeria/arreglos-de-globos-a-domicilio_10.jpg"); }
        #Main #Galeria > #ContGaleria > .pagingGaleria > .k-banner {
          background-image: url("/images/galeria/arreglos-de-globos-a-domicilio_11.jpg"); }
        #Main #Galeria > #ContGaleria > .pagingGaleria > .l-banner {
          background-image: url("/images/galeria/impresion-globos_01.jpg"); }
        #Main #Galeria > #ContGaleria > .pagingGaleria > .m-banner {
          background-image: url("/images/galeria/impresion-globos_02.jpg"); }
        #Main #Galeria > #ContGaleria > .pagingGaleria > .n-banner {
          background-image: url("/images/galeria/impresion-globos_03.jpg"); }
        #Main #Galeria > #ContGaleria > .pagingGaleria > .o-banner {
          background-image: url("/images/galeria/impresion-globos_04.jpg"); }
        #Main #Galeria > #ContGaleria > .pagingGaleria > .p-banner {
          background-image: url("/images/galeria/tanque-de-helio-desechable.jpg"); }
        #Main #Galeria > #ContGaleria > .pagingGaleria > .q-banner {
          background-image: url("/images/galeria/tanques-de-helio_01.jpg"); }
        #Main #Galeria > #ContGaleria > .pagingGaleria > .r-banner {
          background-image: url("/images/galeria/tanques-de-helio_02.jpg"); }
        #Main #Galeria > #ContGaleria > .pagingGaleria > .s-banner {
          background-image: url("/images/galeria/tanques-helio_01.jpg"); }
        #Main #Galeria > #ContGaleria > .pagingGaleria > .t-banner {
          background-image: url("/images/galeria/venta-de-globos_01.jpg"); }
        #Main #Galeria > #ContGaleria > .pagingGaleria > .u-banner {
          background-image: url("/images/galeria/venta-de-globos_02.jpg"); }
        #Main #Galeria > #ContGaleria > .pagingGaleria > .v-banner {
          background-image: url("/images/galeria/venta-de-globos_03.jpg"); }
        #Main #Galeria > #ContGaleria > .pagingGaleria > .w-banner {
          background-image: url("/images/galeria/venta-de-globos_04.jpg"); }
        #Main #Galeria > #ContGaleria > .pagingGaleria > a.activePaging {
          color: #fff; }
        #Main #Galeria > #ContGaleria > .pagingGaleria > a:hover {
          cursor: pointer; }
        #Main #Galeria > #ContGaleria > .pagingGaleria > .show {
          visibility: visible; }
      #Main #Galeria > #ContGaleria .arrowsGaleria {
        display: none;
        top: 50%;
        height: 50px;
        right: 0;
        position: absolute;
        width: 93%;
        z-index: 100; }
        #Main #Galeria > #ContGaleria .arrowsGaleria > .arrowPrev {
          background: url("../../images/web/ArrowHSlide.png") no-repeat right;
          color: white;
          display: block;
          float: left;
          height: 50px;
          margin: 0 7% 0 0;
          padding: 0;
          width: 25px;
          z-index: 100; }
          #Main #Galeria > #ContGaleria .arrowsGaleria > .arrowPrev:hover {
            cursor: pointer;
            width: 35px; }
        #Main #Galeria > #ContGaleria .arrowsGaleria > .arrowNext {
          background: url("../../images/web/ArrowHSlide.png") no-repeat left;
          color: white;
          display: block;
          float: right;
          height: 50px;
          margin: 0;
          padding: 0;
          width: 25px;
          z-index: 100; }
          #Main #Galeria > #ContGaleria .arrowsGaleria > .arrowNext:hover {
            cursor: pointer;
            width: 35px; }
  #Main > .imgHeader {
    float: left;
    width: 100%; }
  #Main > section {
    float: left;
    width: 100%; }
    #Main > section > h1 {
      color: #2B0092;
      float: left;
      font-size: 2.5em;
      margin: 1em 0;
      text-align: center;
      font-weight: 200;
      width: 100%; }
      #Main > section > h1 > hr {
        color: #2B0092;
        float: left;
        height: 1px;
        margin: .5em 35%;
        width: 30%; }
    #Main > section > h2 {
      color: #2B0092;
      float: left;
      font-size: 2.5em;
      margin: 1em 0;
      text-align: center;
      font-weight: 200;
      width: 100%; }
      #Main > section > h2 > hr {
        color: #2B0092;
        float: left;
        height: 1px;
        margin: .5em 35%;
        width: 30%; }
    #Main > section > .listServicios {
      color: #fff;
      font-weight: 200;
      text-align: center;
      width: 100%; }
      #Main > section > .listServicios > li {
        background-size: cover;
        background-position: center center;
        float: left;
        height: 15em;
        list-style-type: none;
        width: 33.3%; }
        #Main > section > .listServicios > li > h3 {
          float: left;
          font-weight: 400;
          font-size: 1.5em;
          margin: 1em 0;
          width: 100%; }
          #Main > section > .listServicios > li > h3 > strong {
            font-weight: 900; }
      #Main > section > .listServicios > .rentaTanques {
        background-image: url("../../images/renta-de-tanques-de-helio.jpg"); }
      #Main > section > .listServicios > .ventaGlogos {
        background-image: url("../../images/venta-de-globos.jpg"); }
      #Main > section > .listServicios > .servicioDomicilio {
        background-image: url("../../images/servicio-de-globos-a-domicilio.jpg"); }
      #Main > section > .listServicios > .impresionGlobos {
        background-image: url("../../images/impresion-de-globos.jpg"); }
      #Main > section > .listServicios > .globosGigantes {
        background-image: url("../../images/globos-gigantes.jpg"); }
      #Main > section > .listServicios > .tanqueDesechable {
        background-image: url("../../images/tanques-de-helio-desechables.jpg"); }
      #Main > section > .listServicios > .palomas {
        background-image: url("../../images/palomas-biodegradables.jpg");
        background-position: top center; }
      #Main > section > .listServicios > .globosLuz {
        background-image: url("../../images/globos-con-luz-led.jpg"); }
      #Main > section > .listServicios > .arreglosDomicilio {
        background-image: url("../../images/globos-a-domicilio.jpg"); }
  #Main > .secHeliup {
    text-align: center; }
    #Main > .secHeliup > div {
      background-color: #00617F;
      color: #fff;
      float: left;
      margin: 0 10%;
      padding-top: 1em;
      width: 80%; }
      #Main > .secHeliup > div > p {
        float: left;
        margin: 0 0 1em 5%;
        width: 90%; }
  #Main > .secVideo {
    background-image: url("../../images/bgVideos.jpg"); }
    #Main > .secVideo > h2 {
      color: #fff; }
      #Main > .secVideo > h2 > hr {
        color: #fff; }
    #Main > .secVideo > iframe {
      float: left;
      height: 30em;
      margin: 0 25% 2.5em 25%;
      width: 50%; }
  #Main > .secContacto > p {
    margin: 0 0 1em 5%;
    text-align: center;
    width: 90%; }
    #Main > .secContacto > p > span {
      background-position: left center;
      background-repeat: no-repeat;
      background-size: auto 100%; }
    #Main > .secContacto > p > .fTelefono {
      background-image: url("../../images/icoTelefono.png");
      padding: .3em 0 .3em 1.5em; }
    #Main > .secContacto > p > .fWhatsApp {
      background-image: url("../../images/icoWhatsApp.png");
      margin-left: 2em;
      padding: .3em 0 .3em 2.5em; }
  #Main > .secFormContact {
    border-bottom: 1px solid #fff;
    background-color: #FF8AED;
    float: left;
    width: 100%; }
    #Main > .secFormContact > .googleMaps {
      float: left;
      height: 30em;
      margin: 2em 3%;
      width: 60%; }
    #Main > .secFormContact > #ContFormContact {
      float: left;
      margin: 2em 0;
      width: 31%; }
      #Main > .secFormContact > #ContFormContact > form {
        color: #fff;
        float: left;
        margin: 0 5%;
        text-transform: uppercase;
        width: 90%; }
        #Main > .secFormContact > #ContFormContact > form > .divBox {
          float: left;
          margin: .5em 0;
          width: 100%; }
          #Main > .secFormContact > #ContFormContact > form > .divBox > label > a {
            color: #fff; }
          #Main > .secFormContact > #ContFormContact > form > .divBox > input {
            border: none;
            border-radius: 1em;
            width: 100%;
            padding: 1em 0; }
          #Main > .secFormContact > #ContFormContact > form > .divBox > textarea {
            border: none;
            border-radius: 1em;
            width: 100%; }
          #Main > .secFormContact > #ContFormContact > form > .divBox > #BtnFormContact {
            border: none;
            border-radius: 1em;
            width: 50%; }

/*************************************************************************** [[ Index ]] ******************/
/*************************************************************************** [[ Contacto ]] ******************/
/*************************************************************************** [[ Resposive styles ]] ******************/
@media (min-width: 769px) and (max-width: 1280px) {
  body {
    font-size: 18px; } }
/*@media (min-width: 768px) and (max-width:990px) {}*/
@media (max-width: 768px) {
  body {
    font-size: 16px; }

  #Header {
    font-size: .8em; }
    #Header > .hLogo {
      margin-left: 1%; }
      #Header > .hLogo .rel-home > img {
        height: 9em;
        padding: 1em 0; }
    #Header > .hDates {
      margin-right: 1%; }
      #Header > .hDates > .hTelefono {
        background-size: auto 70%; }
        #Header > .hDates > .hTelefono > a {
          clear: right;
          float: right; }
    #Header > .hMenu > li {
      width: 25%; }

  #Main > #HSlide {
    height: 20em; }
    #Main > #HSlide > #ContHSlide > .paging {
      width: 75%; }
    #Main > #HSlide > #ContHSlide .arrows {
      display: none;
      top: 50%;
      height: 50px;
      right: 0;
      position: absolute;
      width: 93%;
      z-index: 1000; }
  #Main > section > h1 {
    font-size: 2em; }
    #Main > section > h1 > hr {
      margin: .5em 25%;
      width: 50%; }
  #Main > section > h2 {
    font-size: 2em; }
    #Main > section > h2 > hr {
      margin: .5em 25%;
      width: 50%; }
  #Main > section > .listServicios > li {
    width: 100%; }
  #Main > .secHeliup > div {
    margin: 0 3%;
    width: 94%; }
  #Main #Galeria {
    float: left;
    margin-top: 0;
    position: relative;
    width: 100%;
    z-index: 0; }
    #Main #Galeria > #ContGaleria {
      height: 100%;
      float: left;
      position: relative;
      width: 100%;
      z-index: 80; }
      #Main #Galeria > #ContGaleria > .slideGaleria {
        display: none;
        z-index: 0; }
      #Main #Galeria > #ContGaleria > .pagingGaleria > a {
        width: 48%; }
  #Main > .secVideo > iframe {
    height: 20em;
    margin: 0 3% 2.5em 3%;
    width: 94%; }
  #Main > .secContacto > p > .fTelefono {
    float: left; }
  #Main > .secContacto > p > .fWhatsApp {
    float: left;
    margin: 1em 0; }
  #Main > .secFormContact > .googleMaps {
    height: 20em;
    width: 94%; }
  #Main > .secFormContact > #ContFormContact {
    margin: 2em 0;
    width: 100%; }
    #Main > .secFormContact > #ContFormContact > form {
      width: 90%; } }
/*************************************************************************** [[Microformatos Clases ]]  ******************/
/*Para describir eventos*/
/*Para describir datos de personas, organizaciones, o empresas*/
/*Para indicar que un enlace dirige hacia la licencia de uso*/
/*para indicar que los bots de los buscadores no deben considerar un enlace a la hora de evaluar si aporta un page ranking*/
/*Para indicar un enlase hacia una entrada que agrupa una palabra clave que describe los contenidos de la pagina*/
/*para valorar si el enlace al que apunta debe considerarse un (voto) positivo, negativo, neutro*/
/*Representa relaciones entre personas mediante enlaces*/
/*Inserta XHTML*/
/*Inserta extensible open XHTML*/
/*Para direcciones*/
/*Para cordenadas geogràficas*/
/*Para contenidos sindicados (post de un blog)*/
/*Para audios*/
/*Para avisos clasificados abiertos y distribuidos */
/*para imàgenes video y audio*/
/*Para noticias*/
/*Para productos*/
/*Para recetas de cocina*/
/*Para resùmenes y currìculums*/
/*Para opiniones de usiarios con puntuaciòn*/
/*Para indicar que el destino del enlace es un listado de contenidos de un directorio, que a su vez contiene un enlace hacia la pàgina actual*/
/*Para archivos adjuntos a descargar*/
/*Para indicar que el enlace apunta hacia la pàgina de inicio del sitio*/
/*Para indicar un mecanismo de pago*/

/*# sourceMappingURL=helliup.css.map */