/* --------------------------------------
=========================================
Melange Events - ICONE Soluciones
Version: 1.0
Designed By: Diana Rita
Developed By: Angel Romero
=========================================

1. GLOBAL STYLES
    1.1 GLOBAL

    1.2 Menú

2. SECTION STYLES
    2.1 SECTION: INDEX - caroussel

    2.2 SECTION: INDEX - melange

        2.2.1 SUBSECTION: events

    2.3 SECTION: INDEX - party planner

        2.3.1 SUBSECTION: pplaner

    2.4 SECTION: INDEX - servicios

        2.4.1 SUBSECTION: infantiles

        2.4.2 SUBSECTION: babyshower

        2.4.3 SUBSECTION: despedida

        2.4.5 SUBSECTION: casino

        2.4.6 SUBSECTION: feria

        2.4.7 SUBSECTION: partyp - kidsland

    2.5 SECTION: INDEX - contacto

3. RESPONSIVE

-----------------------------------------*/
/* ========================================================================
  1.1 Component: GLOBAL
 ========================================================================== */
@font-face {
  font-family: 'backtoblack';
  src: url('Fonts/Back-to-Black-Demo.ttf');
}
@font-face {
  font-family: 'nerislight';
  src: url('Fonts/Neris-Light.otf');
}
@font-face {
  font-family: 'nerisblacki';
  src: url('Fonts/Neris-BlackItalic.otf');
}
body{
  margin: 0%;
}
/*@media only screen and (orientation:landscape){
    body {
      -webkit-transform: rotate(90deg);
      -moz-transform: rotate(90deg);
      -o-transform: rotate(90deg);
      -ms-transform: rotate(90deg);
      transform: rotate(90deg);
    }
}

@media only screen and (orientation:portrait){
    body {
        -webkit-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        transform: rotate(0deg);
     }
}*/
/* ========================================================================
  1.2 Component: Menú
 ========================================================================== */
/* The side navigation menu */
.sidenav {
    height: 100%; /* 100% Full-height */
    width: 0; /* 0 width - change this with JavaScript */
    position: fixed; /* Stay in place */
    z-index: 2; /* Stay on top */
    top: 0;
    left: 0;
    background-color: #d20071; /* Black*/
    overflow-x: hidden; /* Disable horizontal scroll */
    padding-top: 60px; /* Place content 60px from the top */
    transition: 0.5s; /* 0.5 second transition effect to slide in the sidenav */
}

/* The navigation menu links */
.sidenav .log{
  width: 100%;
  margin-top: -7%;
}
.sidenav a {
    padding: 8px 8px 8px 32px;
    text-decoration: none;
    font-size: 25px;
    color: white;
    display: block;
    transition: 0.3s;
    font-family: 'backtoblack';
}
.sidenav p{
  color: white;
  font-size: 20px;
  margin-left: 10%;
  font-family: 'nerislight';
  width: 82%;
}
.sidenav hr{
  border: 2px solid white;
  width: 80%;
  border-radius: 10px;
}
.sidenav #ctc{
  margin-left: 10%;
}
.sidenav label{
  color: white;
  margin-left: 2%;
}
/* When you mouse over the navigation links, change their color */
.sidenav a:hover, .offcanvas a:focus{
    color: #f1f1f1;
}

/* Position and style the close button (top right corner) */
.sidenav .closebtn {
    position: absolute;
    top: 0;
    right: 25px;
    font-size: 36px;
    margin-left: 50px;
}

/* Style page content - use this if you want to push the page content to the right when you open the side navigation */
#main {
    transition: margin-left .5s;
    padding: 20px;
    overflow:hidden;
    width:100%;
}
body {
  overflow-x: hidden;
}

/* Add a black background color to the top navigation */
.topnav {
    overflow: hidden;
}

/* Style the links inside the navigation bar */
.topnav a {
    float: left;
    display: block;
    color: #f2f2f2;
    text-align: center;
    text-decoration: none;
    font-size: 17px;
}

/* Change the color of links on hover */
.topnav a:hover {
    background-color: #ddd;
    color: black;
}

/* Add a color to the active/current link */
.topnav a.active {
    background-color: #4CAF50;
    color: white;
}

/* On smaller screens, where height is less than 450px, change the style of the sidenav (less padding and a smaller font size) */
@media screen and (max-height: 450px) {
    .sidenav {padding-top: 15px;}
    .sidenav a {font-size: 18px;}
}

a svg{
  transition:all .5s ease;

  &:hover{
    #transform: rotate(180deg);
  }
}

#ico{
  display: none;
}

.menu{
  background: #000;
  display: none;
  padding: 5px;
  width: 320px;
  @include border-radius(5px);

  #transition: all 0.5s ease;

  a{
    display: block;
    color: #fff;
    text-align: center;
    padding: 10px 2px;
    margin: 3px 0;
    text-decoration: none;
    background: #444;

    &:nth-child(1){
      margin-top: 0;
      @include border-radius(3px 3px 0 0 );
    }
    &:nth-child(5){
      margin-bottom: 0;
      @include border-radius(0 0 3px 3px);
    }

    &:hover{
      background: #555;
    }
  }
}
.men{
  position: fixed;
  z-index: 2;
  margin-left: -1%;
  margin-top: -1%;
  left: 0;
  top: 0;
}
/* ========================================================================
  2.1 SECTION: Index - caroussel
 ========================================================================== */
/* index */
#myCarousel{
  margin-top: -3%;
}
#myCarousel img{
  height: 95vh;
  width: 100%;
  margin-top: 0%;
}
.carousel-indicators{
  bottom: 40px;
}
.enca{
  width: 100%;
  margin-top: -3%;
  height: 84px;
}
.exper{
  position: absolute;
  color: white;
  text-align: center;
  margin-left: 35%;
  margin-top: -4.5%;
  font-family: 'backtoblack';
  font-size: 50px;
}
.abfl{
  left: 96%;
  top: 90%;
  position: fixed;
  z-index: 10;
  width: 4%;
}
/* ========================================================================
  2.2 SECTION: Index - melange events
 ========================================================================== */
.melange{
  background-image: url('../images/fondom.png');
  background-repeat: no-repeat;
  background-size: 100%;
  height: 100vh;
  transition-delay: 0.3s;
}
.melange h1{
  color: white;
  font-family: 'backtoblack';
  margin-left: 8%;
  font-size: 75px;
}
.melange hr{
  width: 23%;
  border: 2px solid white;
  margin-left: 10%;
  border-radius: 25px;
}
.melange p{
  color: white;
  font-family: 'nerisblacki';
  margin-left: 20%;
  font-size: 22px;
}
.melange img{
  margin-left: 29.5%;
  margin-top: -5%;
}
.melange .abfl{
  margin-top: 49%;
  margin-left: 0%;
}
/* ========================================================================
  2.2.1 SECTION: events
 ========================================================================== */
#events{
  background-color: black;
  position: absolute;
  top: 0;
  left: 35%;
  width: 80%;
  height: 100%;
  background: #e1e3e4;
  z-index: 2;
  overflow: scroll;
  overflow-x: hidden;
  display: none;
  -webkit-overflow-scrolling: touch;
}
#melaneve{
  background-color: black;
  height: 150px;
}
#melaneve .row{
  width: 100%;
}
#melaneve img{
  margin-left: 7%;
  position: absolute;
  margin-top: 4%;
}
#melaneve h1{
  color: white;
  margin-left: 18%;
  margin-top: 3%;
  font-family: 'backtoblack';
  font-size: 70px;
}
#melaneve h2{
  margin-top: 10%;
  text-align: left;
  margin-left: 10%;
  font-size: 22px;
}
#melaneve p{
  margin-top: 0%;
  margin-left: 10%;
  text-align: justify;
  width: 77%;
  font-size: 18px;
}
#melaneve .flecha{
  cursor: pointer;
  margin-left: 1.5%;
  margin-top: 0%;
}
#cotiza{
  height: 84px;
  background-color: #EBBC25;
  color: #393939;
  margin-top: 20.3%;
  margin-left: 0%;
  cursor: pointer;
}
#cotiza h3{
  text-align: center;
  margin-top: 5%;
  font-size: 22px;
}
.arriba{
  margin-left: -12.6% !important;
  margin-top: 8% !important;
  width: 53% !important;
}
.enmedio{
  margin-left: -12.6% !important;
  margin-top: 55.1% !important;
  width: 53% !important;
}
.abajo{
  margin-top: 102% !important;
  margin-left: -12.6% !important;
  width: 53% !important;
}
.banditamel{
  margin-left: -6% !important;
  width: 47%;
  margin-top: 8% !important;
}
/* ========================================================================
  2.3 SECTION: Index - party planner
 ========================================================================== */
.pplaner{
    background-image: url('../images/Group328.png');
    background-repeat: no-repeat;
    background-size: 100%;
    height: 100vh;
    transition-delay: 0.3s;
}
.pplaner h1{
  color: white;
  font-family: 'backtoblack';
  margin-left: 8%;
  font-size: 75px;
}
.pplaner hr{
  width: 23%;
  border: 2px solid white;
  margin-left: 10%;
  border-radius: 25px;
}
.pplaner p{
  color: white;
  font-family: 'nerisblacki';
  margin-left: 20%;
  font-size: 22px;
}
.pplaner img{
  margin-left: 29.5%;
  margin-top: -5%;
}
/* ========================================================================
  2.3.1 SECTION: party planner
 ========================================================================== */
#parplan{
    background-color: black;
    position: absolute;
    top: 0;
    left: 35%;
    width: 80%;
    height: 100%;
    background: #e1e3e4;
    z-index: 2;
    overflow: scroll;
    overflow-x: hidden;
    display: none;
    -webkit-overflow-scrolling: touch;
}
#cotiza7{
  height: 84px;
  background-color: #EBBC25;
  color: #393939;
  margin-top: 20.3%;
  margin-left: 0%;
  cursor: pointer;
  width: 101% !important;
}
#cotiza7 h3{
  text-align: center;
  margin-top: 5%;
  font-size: 22px;
}
.banditapp{
  margin-left: -6% !important;
  width: 47%;
  margin-top: 8% !important;
}
/* ========================================================================
  2.4 SECTION: INDEX - servicios
 ========================================================================== */
.servicios .abfl{
  margin-top: 98%;
  margin-left: 0%;
}
.servicios{
  margin-top: 0%;
  background-image: url('../images/Group319.png');
  height: 100vh;
}
.servicios .row{
  width: 45%;
}
.servicios h1{
  text-align: center;
  text-decoration: underline;
  color: white;
  font-family: 'backtoblack';
  font-size: 75px;
}
.servicios img{
  cursor: pointer;
}
/* ========================================================================
  2.4.1 SUBSECTION: infantiles
 ========================================================================== */
#infantiles{
  background-color: black;
  position: absolute;
  top: 0;
  width: 102%;
  height: 100%;
  background: #e1e3e4;
  z-index: 2;
  overflow: scroll;
  overflow-x: hidden;
  display: none;
  -webkit-overflow-scrolling: touch;
}
#izq img{
  width: 100%;
  height: 671px;
}
#secci{
  margin-left: -1.1%;
  background-color: black;
  height: 150px;
}
#secci h1{
  color: white;
  margin-left: 18%;
  margin-top: -5%;
  font-family: 'backtoblack';
  font-size: 70px;
}
#secci .flecha{
  cursor: pointer;
  margin-left: -2.2%;
}
#secci .balon{
  margin-top: -18%;
  width: 20%;
  margin-left: 8%;
}
#secci h2{
  margin-top: 8%;
  text-align: left;
  margin-left: 10%;
  font-size: 22px;
}
#secci p{
  margin-top: 0%;
  margin-left: 10%;
  text-align: justify;
  width: 85%;
  font-size: 18px;
}
#infantiles .col-sm-8{
  margin-top: 9%;
}
#secci #cotiza1{
  height: 84px;
  background-color: #EBBC25;
  color: #393939;
  margin-top: 26.3%;
  margin-left: -7%;
  width: 124%;
  cursor: pointer;
}
#cotiza1 h3{
  text-align: center;
  margin-top: 7%;
  font-size: 22px;
}
#secci .arriba{
  margin-left: 9.4% !important;
  margin-top: 6% !important;
  width: 100% !important;
}
#secci .enmedio{
  margin-left: 9.4% !important;
  margin-top: 0% !important;
  width: 100% !important;
}
#secci .abajo{
  margin-top: 0% !important;
  margin-left: 9.4% !important;
  width: 100% !important;
}
.banditainf{
  width: 89%;
  margin-left: 21%;
  margin-top: 6%;
}
/* ========================================================================
  2.4.2 SUBSECTION: Babyshower
 ========================================================================== */
#babyshower{
  background-color: black;
  position: absolute;
  top: 0;
  width: 102%;
  height: 100%;
  background: #e1e3e4;
  z-index: 2;
  overflow: scroll;
  overflow-x: hidden;
  display: none;
  -webkit-overflow-scrolling: touch;
}
#babyshower #secci .flecha{
  margin-left: -2%;
  cursor: pointer;
}
#babyshower #secci h1{
  color: white;
  margin-left: 11%;
  margin-top: -5%;
  font-family: 'backtoblack';
  font-size: 70px;
}
#babyshower #secci .balon{
  margin-top: -18%;
  width: 20%;
  margin-left:11%;
}
#babyshower #secci .arriba{
  margin-top: 6.2% !important;
  margin-left: 11.4% !important;
  width: 98% !important;
}
#babyshower #secci .enmedio{
  margin-top: 1% !important;
  margin-left: 11.4% !important;
  width: 98% !important;
}
#babyshower #secci .abajo{
  margin-top: 1% !important;
  margin-left: 11.4% !important;
  width: 98% !important;
}
#babyshower .col-sm-8{
  margin-top: 19%;
}
#cotiza2{
  margin-top: 34.3%;
  width: 124% !important;
  cursor: pointer;
  background-color: #EBBC25;
  height: 84px;
  color: #393939;
  margin-left: -7%;
}
#cotiza2 h3{
  text-align: center;
  margin-top: 7%;
  font-size: 22px;
}
/* ========================================================================
  2.4.3 SUBSECTION: Despedida de soltera
 ========================================================================== */
#despedida{
  background-color: black;
  position: absolute;
  top: 0;
  width: 102%;
  height: 100%;
  background: #e1e3e4;
  z-index: 2;
  overflow: scroll;
  overflow-x: hidden;
  display: none;
  -webkit-overflow-scrolling: touch;
}
#despedida #secci{
  height: 178px;
}
#despedida #secci .flecha{
  margin-left: -2%;
  cursor: pointer;
}
#despedida #secci h1{
  margin-left: 11%;
  margin-top: -8%;
}
#despedida #secci .balon{
  margin-top: -29%;
  margin-left: 11%;
}
#despedida #secci h2{
  margin-top: 8%;
}
#despedida .col-sm-8{
  margin-top: 20%;
}
#despedida #secci #cotiza3{
  margin-top: 25.3%;
  width: 126% !important;
  cursor: pointer;
  background-color: #EBBC25;
  height: 84px;
  color: #393939;
  margin-left: -7%;
}
#cotiza3 h3{
  text-align: center;
  margin-top: 7%;
  font-size: 22px;
}
#despedida #secci .arriba{
  margin-top: -9% !important;
  width: 93.5% !important;
  margin-left: 16% !important;
}
#despedida #secci .enmedio{
  width: 93.5% !important;
  margin-left: 16% !important;
}
#despedida #secci .abajo{
  width: 93.5% !important;
  margin-left: 16% !important;
}
.banditades{
  width: 84%;
  margin-top: -9%;
  margin-left: 25%;
}
/* ========================================================================
  2.4.4 SUBSECTION: Casino
 ========================================================================== */
#casino{
  background-color: black;
  position: absolute;
  top: 0;
  width: 102%;
  height: 100%;
  background: #e1e3e4;
  z-index: 2;
  overflow: scroll;
  overflow-x: hidden;
  display: none;
  -webkit-overflow-scrolling: touch;
}
#casino .col-sm-8{
  margin-top: 11%;
}
#casino #secci #cotiza4{
  margin-top: 29%;
  width: 124% !important;
  cursor: pointer;
  background-color: #EBBC25;
  height: 84px;
  color: #393939;
  margin-left: -7%;
}
#cotiza4 h3{
  text-align: center;
  margin-top: 7%;
  font-size: 22px;
}
#casino #secci .arriba{
  width: 99% !important;
}
#casino #secci .enmedio{
  width: 99% !important;
}
#casino #secci .abajo{
  width: 99% !important;
}
/* ========================================================================
  2.4.5 SUBSECTION: Feria
 ========================================================================== */
#feria{
  background-color: black;
  position: absolute;
  top: 0;
  width: 102%;
  height: 100%;
  background: #e1e3e4;
  z-index: 2;
  overflow: scroll;
  overflow-x: hidden;
  display: none;
  -webkit-overflow-scrolling: touch;
}
#feria .col-sm-8{
  margin-top: 18%;
}
#feria #secci #cotiza5{
  margin-top: 36%;
  width: 124% !important;
  cursor: pointer;
  background-color: #EBBC25;
  height: 84px;
  color: #393939;
  margin-left: -7%;
}
#cotiza5 h3{
  text-align: center;
  margin-top: 7%;
  font-size: 22px;
}
#feria #secci .arriba{
  width: 99% !important;
}
#feria #secci .enmedio{
  width: 99% !important;
}
#feria #secci .abajo{
  width: 99% !important;
}
/* ========================================================================
  2.4.6 SUBSECTION: kidsland
 ========================================================================== */
#partyp{
  background-color: black;
  position: absolute;
  top: 0;
  width: 102%;
  height: 100%;
  background: #e1e3e4;
  z-index: 2;
  overflow: scroll;
  overflow-x: hidden;
  display: none;
  -webkit-overflow-scrolling: touch;
}
#partyp #secci h1{
  margin-left: 9%;
}
#partyp .col-sm-8{
  margin-top: 13%;
}
#partyp #secci #cotiza6{
  margin-top: 20%;
  width: 124% !important;
  cursor: pointer;
  background-color: #EBBC25;
  height: 84px;
  color: #393939;
  margin-left: -7%;
}
#cotiza6 h3{
  text-align: center;
  margin-top: 7%;
  font-size: 22px;
}
#partyp #secci .balon{
  margin-left: 11%;
}
#partyp #secci .arriba{
  width: 99% !important;
}
#partyp #secci .enmedio{
  width: 99% !important;
}
#partyp #secci .abajo{
  width: 99% !important;
}
/* ========================================================================
  2.5 SECTION: INDEX - contacto
 ========================================================================== */
.contacto .row{
  width: 100%;
}
.contacto h1{
    position: absolute;
    color: white;
    margin-top: -104%;
    margin-left: 23%;
    font-size: 75px;
    font-family: 'backtoblack';
}
.gcont{
    height: 101vh;
    margin-left: -16.5%;
    margin-top: 0%;
    width: 121%;
}
.ctitulo{
  width: 107%;
  height: 118px;
  margin-top: 0%;
}
.cform{
  width: 107%;
  height: 552px;
}
#contacto{
    position: absolute;
    margin-top: -84%;
    margin-left: 14%;
}
#contacto input{
  background-color: transparent;
  border: 1px solid #606060;
  width: 100%;
  height: 50px;
  text-indent: 1em;
  color: #606060;
}
#contacto textarea{
  background-color: transparent;
  border: 1px solid #606060;
  width: 100%;
  text-indent: 1em;
  height: 100px;
  color: #606060;
  line-height: 30px;
}
#contacto button{
    margin-top: -4%;
    background-color: #E2A315;
    color: white;
    width: 390px;
    height: 50px;
    border: none;
    -webkit-box-shadow: 0px 3px 10px 0px rgba(0,0,0,0.75);
    -moz-box-shadow: 0px 3px 10px 0px rgba(0,0,0,0.75);
    box-shadow: 0px 3px 10px 0px rgba(0,0,0,0.75);
}

#eventc{
  display: none;
}
#eventos h1{
  color: white;
}
/* ========================================================================
  3. RESPONSIVE
 ========================================================================== */
/* ========================================================================
  3.1 RESPONSIVE: min width: 240px and max-width 320px
 ========================================================================== */
 ========================================================================== */
@media (min-width: 240px) and (max-width: 320px){

}
/* ========================================================================
  3.2 RESPONSIVE: min width: 320px and max-width 480px
 ========================================================================== */
@media (min-width: 320px) and (max-width: 480px){
    .men{
        margin-left: -3%;
        margin-top: -2%;
    }
    #myCarousel{
        width: 205% !important;
        margin-left: -52%;
        margin-top: -7%;
    }
  #myCarousel img{
    /*height: 526px;*/
    height: 85vh;
  }
  .abfl{
    width: 12%;
    left: 89%;
  }
  .melange .abfl{
    margin-top: 144%;
  }
  .enca{
    margin-top: -7%;
  }
  .exper{
    margin-left: 27%;
    margin-top: -16.5%;
    font-size: 25px
  }
  .melange{
    background-size: auto;
  }
  .melange h1{
    font-size: 45px;
  }
  .melange p{
    margin-left: 12%;
    font-size: 18px;
  }
  .melange img{
    margin-left: 38.5%;
    margin-top: -16%;
  }
  .melange hr{
    width: 42%;
  }
  #events{
    left: 0%;
    width: 100%;
  }
  #events .col-sm-4{
    display: none;
  }
  #melaneve{
    height: 90px;
  }
  #melaneve .flecha{
    margin-left: 3.5%;
  }
  #melaneve h2{
    margin-left: 3.5%;
  }
  #melaneve h1{
    margin-left: 22%;
    font-size: 40px;
  }
  #melaneve h2{
    margin-top: 15%;
    text-align: center;
    margin-left: 0%;
    font-size: 18px;
  }
  #melaneve p{
    width: 80%;
    font-size: 16px;
    margin-top: -3%;
  }
  #cotiza{
    margin-top: 6%;
  }
  #cotiza h3{
    margin-top: 8%;
  }
  /* partyplanner */
  .pplaner{
    background-size: auto;
  }
  .pplaner h1{
    font-size: 45px;
  }
  .pplaner p{
    margin-left: 12%;
    font-size: 18px;
  }
  .pplaner img{
    margin-left: 38.5%;
    margin-top: -16%;
  }
  .pplaner hr{
    width: 42%;
  }
  #parplan{
    left: 0%;
    width: 100%;
  }
  #parplan .col-sm-4{
    display: none;
  }
  #cotiza7{
    margin-top: 10% !important;
  }
  /* servicios */
  .servicios{
    background-size: auto;
  }
  .servicios h1{
    font-size: 45px;
  }
  .servicios img{
    width: 150%;
  }
  #rabaj{
    margin-top: -12%;
  }
  /* contacto */
  .contacto{
    margin-top: 0%;
  }
  .contacto h1{
    margin-top: -195%;
    text-align: center;
    font-size: 70px;
    margin-left: 24%;
  }
  .gcont{
    display: none;
  }
  #contacto{
    margin-top: -155%;
    margin-left: 4%;
  }
  #contacto br{
      display: none;
  }
  #contacto input{
    height: 35px;
    margin-bottom: 4%;
  }
  #contacto button{
    width: 100%;
    margin-top: 1%;
    height: 40px;
  }
  #izq{
    display: none;
  }
  #secci .col-sm-4{
    display: none;
  }
  .cform{
    width: 109%;
  }
  .ctitulo{
    width: 109%;
    margin-top: 2%;
  }
  /* infantiles */
  #secci{
    height: 100px;
  }
  #secci .flecha{
    margin-left: 1%;
    width: 12%;
  }
  #secci h1{
    margin-top: -6%;
    font-size: 50px;
  }
  #secci h2{
    margin-top: 11%;
  }
  #secci .balon{
    margin-top: -20%;
    margin-right: 4%;
    float: right;
  }
  #secci #cotiza1{
    margin-top: -0.7%;
  }
  /* baby shower */
  #babyshower #secci .flecha{
    margin-left: 1%;
  }
  #babyshower #secci h1{
    font-size: 36px;
    margin-left: 16%;
  }
  #babyshower #secci h2{
    margin-top: 15%;
  }
  #babyshower #secci p{
    margin-left: 7%;
  }
  /* despedida de soltera */
  #cotiza2{
    margin-top: 32%;
  }
  #despedida #secci{
    height: 115px;
  }
  #despedida #secci .flecha{
    margin-left: 1%;
  }
  #despedida #secci h1{
    margin-left: 16%;
    margin-top: -8%;
    font-size: 40px;
  }
  #despedida #secci .balon{
    margin-top: -24%;
  }
  #despedida #secci #cotiza3{
    margin-top: 29.3%;
  }
  /* casino */
  #casino #secci h2{
    margin-top: 16%;
  }
  #casino #secci #cotiza4{
    margin-top: 7%;
  }
  /* feria */
  #feria #secci h2{
    margin-top: 25%;
  }
  #feria #secci #cotiza5{
    margin-top: 18%;
  }
  /* kidsland */
  #partyp #secci h1 {
    margin-left: 19%;
  }
  #partyp #secci h2{
    margin-top: 15%;
  }
  #partyp #secci #cotiza6 {
    margin-top: 2%;
  }

}
/* ========================================================================
  3.3 RESPONSIVE: min width: 480px and max-width 600px
 ========================================================================== */

/* ========================================================================
  3.4 RESPONSIVE: min width: 600px and max-width 768px
 ========================================================================== */

/* ========================================================================
  3.5 RESPONSIVE: min width: 768px and max-width 900px
 ========================================================================== */

/* ========================================================================
  3.6 RESPONSIVE: min width: 900px and max-width 1200px
 ========================================================================== */
@media (min-width: 900px) and (max-width: 1200px){

}
/* ========================================================================
  3.7 RESPONSIVE: min width: 1400px
 ========================================================================== */
@media (min-width: 1400px){
    .enca{
        margin-top: -1.4%;
        height: 86px;
    }
    .exper{
        margin-top: -3.5%;
    }
    #events{
        height: 100vh !important;
    }
    #infantiles{
        height: 100vh;
    }
    #melaneve h2{
        margin-top: 29%;
    }
    #melaneve .flecha{
        margin-left: 1%;
    }
    #cotiza{
        margin-top: 33.3%;
    }
    .arriba{
        /*width: 65% !important;
        margin-left: -23.6% !important;*/
        margin-top: 5% !important;
    }
    #secci .enmedio{
      margin-top: 8% !important;
      width: 90% !important;
    }
    #secci .abajo{
      margin-top: 8% !important;
      margin-left: 9.4% !important;
      width: 90% !important;
    }
    .banditamel{
      margin-left: -31% !important;
      margin-top: 2.8% !important;
      height: 86.3vh;
      width: 80%;
    }
    /*.abfl{
        margin-top: 91%;
    }*/
    .melange .abfl{
        margin-top: 57%;
    }
    #parplan{
      height: 100% !important;
    }
    #cotiza7{
      margin-top: 34.4%;
    }
    #parplan .arriba{
        width: 60% !important;
        margin-left: -18.6% !important;
        margin-top: 3% !important;
    }
    #parplan .enmedio{
        width: 60% !important;
        margin-left: -18.6% !important;
        margin-top: 58.2% !important;
    }
    #parplan .abajo{
        width: 60% !important;
        margin-top: 113.6% !important;
        margin-left: -18.6% !important;
    }
    .banditapp{
      margin-left: -31% !important;
      margin-top: 2.8% !important;
      height: 86.3vh;
      width: 80%;
    }
    #melaneve p{
      width: 70%;
    }
    .servicios .abfl{
        margin-top: 113%;
    }
    .servicios{
        background-size: 100%;
        background-repeat: no-repeat;
    }
    .fondc{
        height: 100vh;
        width: 100%;
    }
    .contacto h1{
      margin-top: -94%;
    }
    #contacto{
      margin-top: -69%;
    }
    #contacto input{
        margin-bottom: 5%;
    }
    #contacto button{
        margin-top: 5%;
    }
    #infantiles{
        height: 100vh !important;
    }
    #infantiles .col-sm-8{
      background-color: white;
      width: 70% !important;
      margin-left: -1.7%;
      margin-top: 7%;
    }
    #infantiles .col-sm-4{
      margin-left: -3%;
    }
    #secci{
      margin-left: -0.8%;
      height: 169px;
    }
    #secci .arriba{
        margin-top: 20% !important;
        width: 90% !important;
    }
    #secci #cotiza1{
      margin-top: 91.3% !important;
      margin-left: -2.3% !important;
      width: 105% !important;
    }
    #secci #cotiza1 h3{
      margin-top: 4%;
    }
    #secci .flecha{
        margin-left: -1.7%;
    }
    #secci .balon{
        margin-top: -9%;
        width: 15%;
    }
    #izq img{
      height: 100vh;
    }
    .banditainf{
      margin-left: 2.5%;
      margin-top: 2.8%;
      height: 84.3vh;
      width: 100%;
    }
    #babyshower{
      height: 100vh !important;
    }
    #babyshower .col-sm-8{
      background-color: white;
      width: 70% !important;
      margin-top: 7%;
      height: 84vh;
      margin-left: -1.4%;
    }
    #babyshower .col-sm-4{
      margin-left: -4%;
    }
    #babyshower .banditainf{
      height: 84.3vh;
    }
    #babyshower #secci .arriba{
      margin-top: 20% !important;
      width: 90% !important;
    }
    #babyshower #secci .enmedio{
      margin-top: 8% !important;
      width: 90% !important;
    }
    #babyshower #secci .abajo{
      margin-top: 8% !important;
      margin-left: 9.4% !important;
      width: 90% !important;
    }
    #babyshower #secci .balon{
        margin-top: -10%;
        width: 15%;
    }
    #babyshower #izq img{
        /*height: 87.5vh;*/
    }
    #cotiza2{
      margin-left: -2.4%;
      margin-top: 103%;
      width: 105.5%!important;
    }
    #cotiza2 h3{
      margin-top: 6%;
    }
    #despedida{
        height:100vh !important;
    }
    #despedida .col-sm-8{
      background-color: white;
      width: 70% !important;
      margin-top: 0.8%;
      height: 83.5vh;
      margin-left: -1.4%;
    }
    #despedida .col-sm-4{
      margin-left: -4%;
    }
    #despedida #secci h1{
        width:50%;
        margin-top: -6%;
    }
    #despedida #secci #cotiza3{
      margin-left: -2.4%;
      margin-top: 102%;
      width: 105.2% !important;
    }
    #despedida #secci .balon{
        margin-top: -20% !important;
    }
    #despedida #secci .flecha{
        margin-left: -1.8%;
    }
    #cotiza3 h3{
        margin-top: 6%;
    }
    #despedida #secci .arriba{
      margin-top: 3% !important;
      width: 90% !important;
    }
    #despedida #secci .enmedio{
      margin-top: 2% !important;
      width: 90% !important;
    }
    #despedida #secci .abajo{
      margin-top: 3% !important;
      margin-left: 15.4% !important;
      width: 90% !important;
    }
    .banditades{
      margin-top: -4.5%;
      margin-left: 4.2%;
      height: 83.5vh;
      width: 100%;
    }
    #casino{
        height: 100vh !important;
    }
    #casino .col-sm-8{
      background-color: white;
      width: 70% !important;
      margin-top: 8%;
      height: 83.2vh;
      margin-left: -1.5%;
    }
    #casino .col-sm-4{
      margin-left: -4%;
    }
    #casino #secci{
      height: 180px;
    }
    #casino #secci #cotiza4 {
      margin-top: 89.7%;
      margin-left: -2.3%;
      width: 105.5% !important;
    }
    #casino #secci .arriba{
      margin-top: 20% !important;
      width: 90% !important;;
    }
    #casino #secci .enmedio{
      margin-top: 8% !important;
      width: 90% !important;
    }
    #casino #secci .abajo{
      margin-top: 8% !important;
      margin-left: 9.4% !important;
      width: 90% !important;
    }
    #casino .banditainf{
      height: 83.4vh;
      margin-left: 4.5%;
    }
    #cotiza4 h3{
        margin-top: 5.5%;
    }
    #feria{
        height: 100vh !important;
        background-color: black;
    }
    #feria .col-sm-8{
      background-color: white;
      width: 70% !important;
      margin-top: 8%;
      height: 83vh;
      margin-left: -1.5%;
    }
    #feria .col-sm-4{
      margin-left: -4%;
    }
    #feria #secci #cotiza5 {
      margin-top: 97.6%;
      margin-left: -2.3%;
      width: 105.5% !important;
    }
    #feria #secci .arriba{
      margin-top: 20% !important;
      width: 90% !important;;
    }
    #feria #secci .enmedio{
      margin-top: 8% !important;
      width: 90% !important;
    }
    #feria #secci .abajo{
      margin-top: 8% !important;
      margin-left: 9.4% !important;
      width: 90% !important;
    }
    #feria #izq img{
        height: 100vh;
    }
    #feria .banditainf{
      height: 83.4vh;
    }
    #cotiza5 h3{
        margin-top: 6%;
    }
    #partyp{
        height: 100vh !important;
    }
    #partyp .col-sm-8{
      background-color: white;
      margin-top: 8%;
      height: 83.3vh;
      margin-left: -1.5%;
    }
    #partyp #secci{
      height: 180px;
    }
    #partyp #secci #cotiza6 {
      margin-top: 95%;
      margin-left: -2.5%;
      width: 105.5% !important;
    }
    #partyp #izq img{
        height: 100vh;
    }
    #partyp #secci .arriba{
      width: 90% !important;
      margin-top: 9%;
    }
    #partyp #secci .enmedio{
      margin-top: 8% !important;
      width: 90% !important;
    }
    #partyp #secci .abajo{
      margin-top: 8% !important;
      margin-left: 9.4% !important;
      width: 90% !important;
    }
    #partyp .banditainf{
      height: 83.4vh;
      margin-left: 2%;
    }
}
.grecaptcha-badge {
opacity:0 !important;
}