/* ------------------------------------------------------------------------------

  Template Name: Denzel. 
  Description: Denzel. - Onepage Personal Template
  Author: Paul
  Author URI: http://themeforest.net/user/paul_tf
  
  1.  Global

      1.1 General
      1.2 Typography
      1.3 Fields
      1.4 Buttons
      1.5 Icons
      1.6 Loader
      1.7 Backgrounds
      1.8 Colors

  2.  Navbar

      2.1 Navbar Desctop
      2.2 Navbar Mobile
      2.3 Navbar Fixed

  3.  Main

      3.1 Masthead
      3.2 Sections
      3.3 About
      3.4 Experience
      3.5 SKills
      3.6 Projects
      3.7 Partners
      3.8 Testimonials
      3.9 Contact



/*-------------------------------------------------------------------------------
  1. Global
-------------------------------------------------------------------------------*/



/* 1.1 General */



@import url('bootstrap.min.css');
@import url('magnific-popup.css');
@import url('owl.carousel.min.css');

@font-face {
  font-family: 'David Bold';
  src: url('../fonts/david.ttf');
  font-weight: bold;
  font-style: normal;
}
@font-face {
  font-family: 'Gotham Book Italic';
  src: url('../fonts/GOTHAM MEDIUM ITALIC.TTF');
  font-weight: bolder;
  font-style: normal;
}
@font-face {
  font-family: 'Gotham Ultra Italic';
  src: url('../fonts/GOTHAM-ULTRAITALIC.OTF');
  font-weight: bolder;
  font-style: normal;
}
html{
  -webkit-font-smoothing: antialiased;
}
body{
  font-family: 'Lato', sans-serif;
  font-size: 1rem;
  line-height: 1.625em;
  color:#767676;
  overflow-y: hidden;
}

::-webkit-scrollbar{
  width: 3px;
  height: 8px;
}
::-webkit-scrollbar-thumb {
  cursor: pointer;
  background: rgb(255, 51, 102);
}
::selection{
  background-color:rgb(255, 51, 102);
  color:#000;
}

-webkit-::selection{
    background-color:rgb(255, 51, 102);
    color:#000;
}

::-moz-selection{
    background-color:rgb(255, 51, 102);
    color:#000;
}



.offset2-lg-1 {
  margin-left: 5.333333%;
}


/* PROGRESO */
.padre2 {
	padding: 0px;
	width: calc(100% - 10px);
  bottom: 30px;
	position: relative;
}
.padre2 .blueflag{
  max-width: 105px;
	position: absolute;
	top: 452px;
	left: calc(100% - 2px);
  opacity: 1;
  
}


/* MASTERPLAN */
.padre {
	padding: 0px;
	width: calc(85% - 20px);
  left: calc(25% - 50px);
  bottom: 0px;
	position: relative;
}
.padre .acceso{
  width: calc(40% - 10px);
	position: absolute;
	top: 0px;
	left: calc(61.8% - 50px);
  opacity: 1;
}
.padre .familiar{
  width: calc(23% - 10px);
	position: absolute;
	top: 53px;
	left: calc(56% - 50px);
  opacity: 1;
}
.padre .woods{
  width: calc(23% - 10px);
	position: absolute;
	top: 80px;
	left: calc(59% - 50px);
  opacity: 1;
}
.padre .urbano{
  width: calc(23% - 10px);
	position: absolute;
	top: 120px;
	left: calc(39.8% - 50px);
  opacity: 1;
}
.padre .mascotas{
  width: calc(23% - 10px);
	position: absolute;
	top: 143px;
	left: calc(42.6% - 50px);
  opacity: 1;
}

.padre .casa{
  width: calc(29% - 10px);
	position: absolute;
	top: 168px;
	left: calc(27.5% - 50px);
  opacity: 1;
}






.owl-carousel .owl-item img {
  display: block;
  width: 100%;
  margin: 0;

}

.carruselserv2{
  margin: 10px;
}


.imgcarrusel3{
  width:100%!important;
  margin-top: 45px;

}

.carousel-testimonials .owl-nav {
  position: static;
  margin-top: 2rem;
  margin-left: 40%;
}

.offset-xl-1 {
  margin-left: 8.333333%;
  margin-top: 5%;
}

h1,
.h1{ 
  position: relative;
  font-family: 'Karla', sans-serif;
  font-size: 5.725rem;
  font-weight: 700;
  line-height: 1;
  color: #000;
}
.logo {
  max-height: 58px;
  margin-top: -20px;
  display: inline-block; }
.logodark {
    display: none;
    margin-top: -27px; }

h2,
.h2{ 
  position: relative;
  font-family: 'Karla', sans-serif;
  font-weight: 700;
  font-size: 2.7rem;
  line-height: 1.2;
  color: #000;
  margin:2rem 0;
  font-size: 50px;
}

.preventaletra{
  text-align: center;

  line-height: 1;
}
.preventaletra2{
  text-align: center;
  margin: 0;
  line-height: 1;
}
.preventaletra2-1{
  margin: 0;

}
.preventaletra3{

  margin: 0;
  line-height: 0.7;
}
.preventaletra4{

  margin: 0;
  line-height: 0.5;
}
.preventaletra6{
  margin: 0;
  line-height: 0.5;
text-align: center;
}
.imagenesbicla{
  text-align: center;
}
.biclae{
width: 30%;
margin: 30px;
}
.lain{
  width: 30%;
}
.columnaciclo{
  bottom: 30px;
  left: 20%;
}
@media (max-width: 1808px){
  .columnaciclo{
    bottom: 30px;
    left: 15%;
  }
}
@media (max-width: 1708px){
  .columnaciclo{
    bottom: 30px;
    left: 10%;
  }
}

h3,
.h3{ 
  font-family: 'Karla', sans-serif;
  font-weight: 700;
  font-size: 1.925rem;
  line-height: 1.25;
  color: #000;
  margin:1.5rem 0;
}

h4,
.h4{ 
  font-family: 'Karla', sans-serif;
  font-weight: 600;
  font-size: 1.525rem;
  line-height: 1.2;
  color: #000;
  margin:1.5rem 0;
}

h5,
.h5{ 
  font-family: 'Karla', sans-serif;
  font-weight: 600;
  font-size: 1.125rem;
  line-height: 1.2;
  color: #000;
  margin:1.2rem 0;
}

h6,
.h6{ 
  font-family: 'Karla', sans-serif;
  font-weight: 700;
  font-size: 0.9rem;
  letter-spacing: 1px;
  line-height: 1.2;
  color: #000;
  margin:1rem 0;
  text-transform: uppercase;
}


h1 a,
.h1 a,
h2 a,
.h2 a,
h3 a,
.h3 a,
h4 a,
.h4 a,
h5 a,
.h5 a,
h6 a,
.h6 a{
  color:inherit;
}

h1 a:hover,
.h1 a:hover,
h2 a:hover,
.h2 a:hover,
h3 a:hover,
.h3 a:hover,
h4 a:hover,
.h4 a:hover,
h5 a:hover,
.h5 a:hover,
h6 a:hover,
.h6 a:hover{
  text-decoration: none;
}

p{
  margin-bottom: 1rem;
}

ul{
  list-style: none;
  padding-left: 0;
}

a {
  color:#D4F21B;
  -webkit-transition: color .3s ease-out;
       -o-transition: color .3s ease-out;
          transition: color .3s ease-out;
}

a:hover,
a:focus {
  color:#D4F21B;
  outline: none;
}

a:focus{
  text-decoration: none;
}

.lead{
  line-height: 1.9;
  font-size: 1.125rem;
}

.size-sm{
  font-size: 0.875rem;
}



/* 1.3 Fields */

.w-2{
  
  width: 50%;
}
.w-3{
  width: 58%;
  left: 50%;
  position: absolute;
}

.form-group{
  margin-bottom: 2rem;
}

.form-control,
textarea.form-control{
  font-size: 1em;
  height: 3.625em;
  border-radius: 0;
  padding-left: 22px;
  color: #bbbbbb;
  background-color: transparent;
  border:0;
  border-bottom:1px solid rgba(255,255,255,0.6);
  -webkit-box-shadow:none;
          box-shadow:none;
      -webkit-appearance: none;
  -webkit-transition: all .15s;
       -o-transition: all .15s;
          transition: all .15s;
}

textarea.form-control{
  height: 7.9em;
  padding-top:1.1em;
  resize:none;
}

.form-control:focus{
  border-color:#D4F21B;
  outline: 0;
  -webkit-box-shadow:none;
          box-shadow:none;
          background-color: none;
}

.form-control::-moz-placeholder {
  color: #bbbbbb;
  opacity: 1;
}

.form-control:-ms-input-placeholder {
  color: #bbbbbb;
}

.form-control::-webkit-input-placeholder {
  color: #bbbbbb;
}

label.error{
  border-color:#D4F21B;
  padding:9px 0 0 22px;
  font-size:0.9rem;
}

.mc-label{
  padding:9px 0 0 22px;
  font-size:0.9rem;
  color: #fff;
}



/* 1.4 Buttons */



.btn{
  font-family: 'Karla', sans-serif;
  position: relative;
  display: inline-block;
  border:0.2em solid rgb(255, 51, 102);
  border-radius: 20px;
  padding:1em 2.4em 1em;
  font-size: 0.875em;
  color:#fff;
  white-space: nowrap;
  text-align: center;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  text-decoration: none;
  background-color:rgb(255, 51, 102);
  font-weight: 700;
  border-width: 1px;
  
  -webkit-transition: all .3s ease-out!important;
          transition: all .3s ease-out!important;
}

.btn:hover,
.btn:focus,
.btn:active{
  color: #000;
  background-color: #ffb1b1;
  border-color:#ffb1b1;
  -webkit-box-shadow:none;
  box-shadow: 5px 5px #ffdfe5;
  outline: none!important;
}

.btn-white{
  background-color: #fff;
  border-color: #fff;
  color: #343434;
}

.btn-white:hover{
  background: transparent;
  border-color: #fff;
  color: #fff;
}

.btn-b-white{
  background-color: transparent;
  border-color: #fff;
}

.btn-b-white:hover{
  background-color: #fff;
  color: #000;
}

.btn-bg-dark:hover,
.btn-bg-dark:focus{
  color: #fff;
  border-color:#fff;
}


/* 1.5 Icons */


ion-icon{
  color:#23a592;
  font-size: 3.8rem;
  --ionicon-stroke-width: 17px;

}

.icon-play{
  position: absolute;
  width:5.15rem;
  height: 5.15rem; 
  left: 50%;
  top:50%;
  transform:translate(-50%,-50%);
  border:1px solid #fff;
  border-radius: 50%;
  transition:all 0.3s ease;
} 

.icon-play:before{
  position: absolute;
  top: 50%;
  left: 50%;
  margin:-6px 0 0 -5px;
  content: '';
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 6px 0 6px 12px;
  border-color: transparent transparent transparent #fff;
}

.icon-play:hover{
  border:1px solid #D4F21B;
  background-color:#D4F21B; 
  color: #343434;
}

.icon-play:hover:before{
  border-color: transparent transparent transparent #000;
}


/* 1.6 Loader */



.loader{
  position:absolute;
  z-index: 10;
  z-index: 100;
  left: 0;
  width: 100%;
  top:0;
  height: 100%;
  background: #fff;
}


@keyframes rotate {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
@-webkit-keyframes sk-bounce {
  0%, 100% { -webkit-transform: scale(0.0) }
  50% { -webkit-transform: scale(1.0) }
}

@keyframes sk-bounce {
  0%, 100% { 
    transform: scale(0.0);
    -webkit-transform: scale(0.0);
  } 50% { 
    transform: scale(1.0);
    -webkit-transform: scale(1.0);
  }
}



/* 1.7 Backgrounds */


.bg-light{
  background: #f5f5f5!important;
}

.bg-dark{
  background:#1d1d1d!important;
  color:#86878a;
}

.bg-dark .row-experience:nth-child(even){
  background-color:#272727;
}

.bg-dark .btn:hover,
.bg-dark .btn:focus{
  color: #fff
}

.bg-primary{
  background:#23a592!important;
  color:#fff;
}

.bg-dark .progress{
  background: #383838;
}



/* 1.8 Colors */



.text-dark{
  color:#000!important;
}

.text-white{
  color:#fff!important;
}

.text-gray{
  color:#767676!important;
}

.text-muted{
  color: #bbbbbb!important;
}

.text-primary{
  color:#D4F21B!important;
}



/*-------------------------------------------------------------------------------
  2. Navbar
-------------------------------------------------------------------------------*/



.navbar{
  position: absolute;
  z-index: 99;
  width: 100%;
  padding: 0 1.5rem;
  border-bottom: 1px solid rgba(52,52,52,0.1);
  height:4.7rem;
}



@media(min-width: 992px){
  .navbar{
    padding: 0 3rem;
  }
}

.navbar,
.navbar a,
.navbar a:hover,
.navbar a:focus{
  color:#343434;
}
.todoelresponsiv11{
  /* Puedes ajustar el valor de 'scale' según prefieras para reducir el tamaño */
  transform: scale(1); 
  margin-top: -10px;
  margin-left: -110px;
}
.todoelresponsiv12 {
  /* Puedes ajustar el valor de 'scale' según prefieras para reducir el tamaño */
  transform: scale(0.9); 
  margin-top:10px;
  margin-left: 20px;
}
.botoncito3{
  margin-top: -190px!important;
  margin-left: 620px!important;
}
/* Whatsapp botón */
.floatt{
  position:fixed;
  width:50px;
  height:50px;
  bottom:90px;
  right:25px;
  background-color:#25d366;
  color:#FFF;
  border-radius:24px;
  text-align:center;
  font-size:28px;
  box-shadow: 1px 1px 1px #25d366;
  z-index:99999;
}
.floatt:hover {
  text-decoration: none;
  color: #dff;
  background-color:#25d366;
  
}
.my-floatt{
  margin-top:10px;
  
}

/* Whatsapp animación hover */
.pushme4{
  -webkit-transform: scale(1,1);
  -webkit-transition-timing-function: ease-out;
  -webkit-transition-duration: 250ms;
  -moz-transform: scale(1,1);
  -moz-transition-timing-function: ease-out;
  -moz-transition-duration: 250ms;
  }
  .pushme4:hover{
  -webkit-transform: scale(1.13,1.13);
  -webkit-transition-timing-function: ease-out;
  -webkit-transition-duration: 150ms;
  -moz-transform: scale(1.13,1.13);
  -moz-transition-timing-function: ease-out;
  -moz-transition-duration: 150ms;
  }



/* COOKIES */
.aviso-cookies {
	display: none;
	background: rgba(201, 201, 169, 0.473);
	padding: 20px;
	width: calc(100% - 40px);
	max-width: 300px;
	line-height: 150%;
	border-radius: 10px;
	position: fixed;
	bottom: 20px;
	left: 20px;
	z-index: 999999;
	padding-top: 40px;
	box-shadow: 0px 2px 20px 10px rgba(222, 222, 222, 0.277);
	text-align: center;
  opacity:0.9;
}

.aviso-cookies.activo {
	display: block;
  background-image: url(../img/main/sliderGrupoLibera.jpg);
}

.aviso-cookies .galleta {
	max-width: 40px;
	position: absolute;
	top: -20px;
	left: calc(60% - 50px);
}

.aviso-cookies .titulo{
  margin-bottom: 15px;
  color: #fff;
}
.aviso-cookies .parrafo {
	margin-bottom: 15px;
  color: #fff;
  text-align: center;
  

}

.aviso-cookies .boton {
	width: 100%;
	background: #595959;
	border: none;
	color: #fff;
	font-family: sans-serif;
	text-align: center;
	padding: 15px 20px;
	font-weight: 700;
	cursor: pointer;
	transition: .3s ease all;
	border-radius: 5px;
	margin-bottom: 15px;
	font-size: 14px;
}

.aviso-cookies .boton:hover {
	background: rgb(43, 43, 43);
}

.aviso-cookies .enlace {
	color: #fff;
	text-decoration: none;
	font-size: 14px;
}

.aviso-cookies .enlace:hover {
	text-decoration: underline;
}

.fondo-aviso-cookies {
	display: none;
	background: rgba(0,0,0,.20);
	position: fixed;
	z-index: 99;
	width: 100vw;
	height: 100vh;
	top: 0;
	left: 0;
}

.fondo-aviso-cookies.activo {
	display: block;
}










.toggler{
 position: absolute;
 right: 0;
 width:2rem;
 height: 2rem;
 padding:0;
 background: none;
 border:0;
}

.toggler:focus{
  outline: none;
}

.toggler-icon{
  display: block;
  border-top:2px solid #000;
  margin-top: 0.5rem;
}

.toggler-icon:first-child{
  margin-top: 0;
}
@media(max-width: 1800px){
  .navbar-brand{
    position: absolute;
    font-family: 'Karla', sans-serif;
    font-size:1.875rem;
    font-weight: 700;
    color:#fff;
    margin-right: -6rem!important;
    padding:0;
    line-height: 1;
  }
  .logo-arenales{
    width: 60%!important;
  }
  .todoelresponsiv12 {
    /* Puedes ajustar el valor de 'scale' según prefieras para reducir el tamaño */
    transform: scale(0.8); 
    margin-top: -10px;
    margin-left: 20px;
  }
  
}
@media(max-width: 1700px){
  .navbar-brand{
    position: absolute;
    font-family: 'Karla', sans-serif;
    font-size:1.875rem;
    font-weight: 700;
    color:#fff;
    margin-right: -6rem!important;
    padding:0;
    line-height: 1;
  }
  .logo-arenales{
    width: 50%!important;
  }
  .todoelresponsiv12 {
    /* Puedes ajustar el valor de 'scale' según prefieras para reducir el tamaño */
    transform: scale(0.8); 
    margin-top: -10px;
    margin-left: 20px;
  }
}
@media(max-width: 1600px){
  .navbar-brand{
    position: absolute;
    font-family: 'Karla', sans-serif;
    font-size:1.875rem;
    font-weight: 700;
    color:#fff;
    margin-right: -6rem!important;
    padding:0;
    line-height: 1;
  }
  .navbar{
    height: 8%;
  }
  .logo-arenales{
    width: 45%!important;
  }
  .todoelresponsiv {
    /* Puedes ajustar el valor de 'scale' según prefieras para reducir el tamaño */
    transform: scale(0.9); 
    margin-top: -50px;
  }
  .todoelresponsiv2 {
    /* Puedes ajustar el valor de 'scale' según prefieras para reducir el tamaño */
    transform: scale(0.9); 
    margin-top: -10px;
    margin-left: -20px;
  }
  .todoelresponsiv3 {
    /* Puedes ajustar el valor de 'scale' según prefieras para reducir el tamaño */
    transform: scale(0.9); 
    margin-top: -60px;
    margin-left: -20px;
  }
  .todoelresponsiv4 {
    /* Puedes ajustar el valor de 'scale' según prefieras para reducir el tamaño */
    transform: scale(0.7); 
    margin-top: 30px;
    margin-left: -120px;
  }
  .todoelresponsiv5 {
    /* Puedes ajustar el valor de 'scale' según prefieras para reducir el tamaño */
    transform: scale(0.9); 
    margin-top: -10px;
    margin-left: -40px;
  }
  .todoelresponsiv6 {
    /* Puedes ajustar el valor de 'scale' según prefieras para reducir el tamaño */
    transform: scale(0.9); 
    margin-top: -20px;
    margin-left: -20px;
  }
  .todoelresponsiv7 {
    /* Puedes ajustar el valor de 'scale' según prefieras para reducir el tamaño */
    transform: scale(0.9); 
    margin-top: -30px;
    margin-left: 20px;
  }
  .todoelresponsiv8 {
    /* Puedes ajustar el valor de 'scale' según prefieras para reducir el tamaño */
    transform: scale(0.9); 
    margin-top: -30px;
    margin-left: 20px;
  }
.todoelresponsiv9 {
  /* Puedes ajustar el valor de 'scale' según prefieras para reducir el tamaño */
  transform: scale(0.9); 
  margin-top: -30px;
  margin-left: 20px;
}
.todoelresponsiv10 {
  /* Puedes ajustar el valor de 'scale' según prefieras para reducir el tamaño */
  transform: scale(0.9); 
  margin-top: -20px;
  margin-left: 20px;
}
.todoelresponsiv11 {
  /* Puedes ajustar el valor de 'scale' según prefieras para reducir el tamaño */
  transform: scale(0.8); 
  margin-top: -10px;
  margin-left: -40px;
}
.todoelresponsiv12 {
  /* Puedes ajustar el valor de 'scale' según prefieras para reducir el tamaño */
  transform: scale(0.8); 
  margin-top: -10px;
  margin-left: 20px;
}
.nav-item{
  font-size:14px!important;
}
  
}

@media(max-width: 1500px){
  .navbar-brand{
    position: absolute;
    font-family: 'Karla', sans-serif;
    font-size:1.875rem;
    font-weight: 700;
    color:#fff;
    margin-right: -6rem!important;
    padding:0;
    line-height: 1;
  }
  .logo-arenales{
    width: 70%!important;
  }

  .todoelresponsiv {
    /* Puedes ajustar el valor de 'scale' según prefieras para reducir el tamaño */
    transform: scale(0.8); 
    margin-top: -50px;
  }
  .todoelresponsiv2 {
    /* Puedes ajustar el valor de 'scale' según prefieras para reducir el tamaño */
    transform: scale(0.8); 
    margin-top: -80px;
    margin-left: -20px;
  }
  .todoelresponsiv3 {
    /* Puedes ajustar el valor de 'scale' según prefieras para reducir el tamaño */
    transform: scale(0.8); 
    margin-top: -120px;
    margin-left: -20px;
  }
  .todoelresponsiv4 {
    /* Puedes ajustar el valor de 'scale' según prefieras para reducir el tamaño */
    transform: scale(0.8); 
    margin-top: 10px;
    margin-left: -20px;
  }
  .todoelresponsiv5 {
    /* Puedes ajustar el valor de 'scale' según prefieras para reducir el tamaño */
    transform: scale(0.8); 
    margin-top: -10px;
    margin-left: -40px;
  }
  .todoelresponsiv6 {
    /* Puedes ajustar el valor de 'scale' según prefieras para reducir el tamaño */
    transform: scale(0.8); 
    margin-top: -100px;
    margin-left: -20px;
  }
  .todoelresponsiv7 {
    /* Puedes ajustar el valor de 'scale' según prefieras para reducir el tamaño */
    transform: scale(0.8); 
    margin-top: -30px;
    margin-left: 20px;
  }
  .todoelresponsiv8 {
    /* Puedes ajustar el valor de 'scale' según prefieras para reducir el tamaño */
    transform: scale(0.8); 
    margin-top: -30px;
    margin-left: 20px;
  }
.todoelresponsiv9 {
  /* Puedes ajustar el valor de 'scale' según prefieras para reducir el tamaño */
  transform: scale(0.8); 
  margin-top: -30px;
  margin-left: 20px;
}
.todoelresponsiv10 {
  /* Puedes ajustar el valor de 'scale' según prefieras para reducir el tamaño */
  transform: scale(0.8); 
  margin-top: -120px;
  margin-left: 20px;
}
.todoelresponsiv11 {
  /* Puedes ajustar el valor de 'scale' según prefieras para reducir el tamaño */
  transform: scale(0.8); 
  margin-top: -80px;
  margin-left: 20px;
}
.todoelresponsiv12 {
  /* Puedes ajustar el valor de 'scale' según prefieras para reducir el tamaño */
  transform: scale(0.8); 
  margin-top: -10px;
  margin-left: 20px;
}
  
}

@media(max-width: 1400px){
  .navbar-brand{
    position: absolute;
    font-family: 'Karla', sans-serif;
    font-size:1rem!important;
    font-weight: 700;
    color:#fff;
    margin-right: -10rem!important;
    padding:0;
    line-height: 1;
  }
  .logo-arenales{
    width: 45%!important;
  }
  .todoelresponsiv {
    /* Puedes ajustar el valor de 'scale' según prefieras para reducir el tamaño */
    transform: scale(0.8); 
    margin-top: -50px;
  }
  .todoelresponsiv2 {
    /* Puedes ajustar el valor de 'scale' según prefieras para reducir el tamaño */
    transform: scale(0.8); 
    margin-top: -80px;
    margin-left: -20px;
  }
  .todoelresponsiv3 {
    /* Puedes ajustar el valor de 'scale' según prefieras para reducir el tamaño */
    transform: scale(0.8); 
    margin-top: -120px;
    margin-left: -20px;
  }
  .todoelresponsiv4 {
    /* Puedes ajustar el valor de 'scale' según prefieras para reducir el tamaño */
    transform: scale(0.8); 
    margin-top: 10px;
    margin-left: -20px;
  }
  .todoelresponsiv5 {
    /* Puedes ajustar el valor de 'scale' según prefieras para reducir el tamaño */
    transform: scale(0.8); 
    margin-top: -10px;
    margin-left: -40px;
  }
  .todoelresponsiv6 {
    /* Puedes ajustar el valor de 'scale' según prefieras para reducir el tamaño */
    transform: scale(0.8); 
    margin-top: -100px;
    margin-left: -20px;
  }
  .todoelresponsiv7 {
    /* Puedes ajustar el valor de 'scale' según prefieras para reducir el tamaño */
    transform: scale(0.8); 
    margin-top: -30px;
    margin-left: 20px;
  }
  .todoelresponsiv8 {
    /* Puedes ajustar el valor de 'scale' según prefieras para reducir el tamaño */
    transform: scale(0.8); 
    margin-top: -30px;
    margin-left: 20px;
  }
.todoelresponsiv9 {
  /* Puedes ajustar el valor de 'scale' según prefieras para reducir el tamaño */
  transform: scale(0.8); 
  margin-top: -30px;
  margin-left: 20px;
}
.todoelresponsiv10 {
  /* Puedes ajustar el valor de 'scale' según prefieras para reducir el tamaño */
  transform: scale(0.8); 
  margin-top: -120px;
  margin-left: 20px;
}
.todoelresponsiv11 {
  /* Puedes ajustar el valor de 'scale' según prefieras para reducir el tamaño */
  transform: scale(0.8); 
  margin-top: -80px;
  margin-left: -100px;
}
  
}
@media(max-width: 1350px){
  .navbar-brand{
    position: absolute;
    font-family: 'Karla', sans-serif;
    font-size:1rem!important;
    font-weight: 700;
    color:#fff;
    margin-right: -13rem!important;
    padding:0;
    line-height: 1;
  }
  .logo-arenales{
    width: 65%!important;
  }
  
}
@media(max-width: 1300px){
  .navbar-brand{
    position: absolute;
    font-family: 'Karla', sans-serif;
    font-size:1rem!important;
    font-weight: 700;
    color:#fff;
    margin-right: -13rem!important;
    padding:0;
    line-height: 1;
  }
  .navbar{
    height: 7%;
  }
  .logo-arenales{
    width: 35%!important;
  }
  .nav-item{
    font-size:12px!important;
  }
  .todoelresponsiv {
    /* Puedes ajustar el valor de 'scale' según prefieras para reducir el tamaño */
    transform: scale(0.7); 
    margin-top: -50px;
  }
  .todoelresponsiv2 {
    /* Puedes ajustar el valor de 'scale' según prefieras para reducir el tamaño */
    transform: scale(0.7); 
    margin-top: -80px;
    margin-left: -20px;
  }
  .todoelresponsiv3 {
    /* Puedes ajustar el valor de 'scale' según prefieras para reducir el tamaño */
    transform: scale(0.7); 
    margin-top: -120px;
    margin-left: -20px;
  }
  .todoelresponsiv4 {
    /* Puedes ajustar el valor de 'scale' según prefieras para reducir el tamaño */
    transform: scale(0.7); 
    margin-top: 10px;
    margin-left: -20px;
  }
  .todoelresponsiv5 {
    /* Puedes ajustar el valor de 'scale' según prefieras para reducir el tamaño */
    transform: scale(0.7); 
    margin-top: -10px;
    margin-left: -40px;
  }
  .todoelresponsiv6 {
    /* Puedes ajustar el valor de 'scale' según prefieras para reducir el tamaño */
    transform: scale(0.7); 
    margin-top: -100px;
    margin-left: -20px;
  }
  .todoelresponsiv7 {
    /* Puedes ajustar el valor de 'scale' según prefieras para reducir el tamaño */
    transform: scale(0.7); 
    margin-top: -30px;
    margin-left: 20px;
  }
  .todoelresponsiv8 {
    /* Puedes ajustar el valor de 'scale' según prefieras para reducir el tamaño */
    transform: scale(0.7); 
    margin-top: -30px;
    margin-left: 20px;
  }
.todoelresponsiv9 {
  /* Puedes ajustar el valor de 'scale' según prefieras para reducir el tamaño */
  transform: scale(0.8); 
  margin-top: -60px;
  margin-left: 20px;
}
.todoelresponsiv10 {
  /* Puedes ajustar el valor de 'scale' según prefieras para reducir el tamaño */
  transform: scale(0.7); 
  margin-top: -120px;
  margin-left: 20px;
}
.todoelresponsiv11 {
  /* Puedes ajustar el valor de 'scale' según prefieras para reducir el tamaño */
  transform: scale(0.7); 
  margin-top: -80px;
  margin-left: 20px;
}


  
}

@media(max-width: 1230px){
  .navbar-brand{
    position: absolute;
    font-family: 'Karla', sans-serif;
    font-size:1rem!important;
    font-weight: 700;
    color:#fff;
    margin-right: -13rem!important;
    padding:0;
    line-height: 1;
  }
  .navbar{
    height: 7%;
  }
  .logo-arenales{
    width: 35%!important;
  }
  .nav-item{
    font-size:12px!important;
  }
  .todoelresponsiv {
    /* Puedes ajustar el valor de 'scale' según prefieras para reducir el tamaño */
    transform: scale(0.7); 
    margin-top: -50px;
  }
  .todoelresponsiv2 {
    /* Puedes ajustar el valor de 'scale' según prefieras para reducir el tamaño */
    transform: scale(0.7); 
    margin-top: -80px;
    margin-left: -20px;
  }
  .todoelresponsiv3 {
    /* Puedes ajustar el valor de 'scale' según prefieras para reducir el tamaño */
    transform: scale(0.7); 
    margin-top: -120px;
    margin-left: -20px;
  }
  .todoelresponsiv4 {
    /* Puedes ajustar el valor de 'scale' según prefieras para reducir el tamaño */
    transform: scale(0.7); 
    margin-top: 10px;
    margin-left: -20px;
  }
  .todoelresponsiv5 {
    /* Puedes ajustar el valor de 'scale' según prefieras para reducir el tamaño */
    transform: scale(0.7); 
    margin-top: -10px;
    margin-left: -40px;
  }
  .todoelresponsiv6 {
    /* Puedes ajustar el valor de 'scale' según prefieras para reducir el tamaño */
    transform: scale(0.7); 
    margin-top: -100px;
    margin-left: -20px;
  }
  .todoelresponsiv7 {
    /* Puedes ajustar el valor de 'scale' según prefieras para reducir el tamaño */
    transform: scale(0.7); 
    margin-top: -30px;
    margin-left: 20px;
  }
  .todoelresponsiv8 {
    /* Puedes ajustar el valor de 'scale' según prefieras para reducir el tamaño */
    transform: scale(0.7); 
    margin-top: -30px;
    margin-left: 20px;
  }
.todoelresponsiv9 {
  /* Puedes ajustar el valor de 'scale' según prefieras para reducir el tamaño */
  transform: scale(0.8); 
  margin-top: -60px;
  margin-left: 20px;
}
.todoelresponsiv10 {
  /* Puedes ajustar el valor de 'scale' según prefieras para reducir el tamaño */
  transform: scale(0.7); 
  margin-top: -120px;
  margin-left: 20px;
}
.todoelresponsiv11 {
  /* Puedes ajustar el valor de 'scale' según prefieras para reducir el tamaño */
  transform: scale(0.7); 
  margin-top: -80px;
  margin-left: 20px;
}


  
}

@media(max-width: 1200px){
  .navbar-brand{
    position: absolute;
    font-family: 'Karla', sans-serif;
    font-size:1rem!important;
    font-weight: 700;
    color:#fff;
    margin-right: -17rem!important;
    padding:0;
    line-height: 1;
  }
  .navbar{
    height: 7%;
  }
  .logo-arenales{
    width: 35%!important;
  }
  .nav-item{
    font-size:10px!important;
  }
  .todoelresponsiv {
    /* Puedes ajustar el valor de 'scale' según prefieras para reducir el tamaño */
    transform: scale(0.6); 
    margin-top: -50px;
  }
  .todoelresponsiv2 {
    /* Puedes ajustar el valor de 'scale' según prefieras para reducir el tamaño */
    transform: scale(0.7); 
    margin-top: -80px;
    margin-left: -20px;
  }
  .todoelresponsiv3 {
    /* Puedes ajustar el valor de 'scale' según prefieras para reducir el tamaño */
    transform: scale(0.7); 
    margin-top: -190px;
    margin-left: -20px;
  }
  .todoelresponsiv4 {
    /* Puedes ajustar el valor de 'scale' según prefieras para reducir el tamaño */
    transform: scale(0.6); 
    margin-top: 20px;
    margin-left: -100px;
  }
  .todoelresponsiv5 {
    /* Puedes ajustar el valor de 'scale' según prefieras para reducir el tamaño */
    transform: scale(0.6); 
    margin-top: -10px;
    margin-left: -40px;
  }
  .todoelresponsiv6 {
    /* Puedes ajustar el valor de 'scale' según prefieras para reducir el tamaño */
    transform: scale(0.6); 
    margin-top: -180px;
    margin-left: -20px;
  }
  .todoelresponsiv7 {
    /* Puedes ajustar el valor de 'scale' según prefieras para reducir el tamaño */
    transform: scale(0.6); 
    margin-top: -30px;
    margin-left: 20px;
  }
  .todoelresponsiv8 {
    /* Puedes ajustar el valor de 'scale' según prefieras para reducir el tamaño */
    transform: scale(0.6); 
    margin-top: -30px;
    margin-left: 20px;
  }
.todoelresponsiv9 {
  /* Puedes ajustar el valor de 'scale' según prefieras para reducir el tamaño */
  transform: scale(0.7); 
  margin-top: -90px;
  margin-left: -10px;
}
.todoelresponsiv10 {
  /* Puedes ajustar el valor de 'scale' según prefieras para reducir el tamaño */
  transform: scale(0.7); 
  margin-top: -190px;
  margin-left: 5px;
}
.todoelresponsiv11 {
  /* Puedes ajustar el valor de 'scale' según prefieras para reducir el tamaño */
  transform: scale(0.7); 
  margin-top: -80px;
  margin-left: 20px;
}
.parrafomerida1{
  font-family:'David Bold'!important;
}
.tercerparte{
  margin-left: -50px;
}
h1{
  font-size: 120px!important;
  margin-left: 25px!important;
}
.segundoparrafo{
  font-size: 30px!important;
  margin-left: -95px!important;
  padding-left: 105px!important;
}
.tercerparrafo{
  font-size: 36px!important;
  text-align: center!important;
}

  
  
}
.navbar-brand{
  position: absolute;
  font-family: 'Karla', sans-serif;
  font-size:1.875rem;
  font-weight: 700;
  color:#fff;
  margin-right: 4rem;
  padding:0;
  line-height: 1;
}

.navbar-brand:hover,
.navbar-brand:focus{
  color:#fff;
}

.logo-arenales{
  width: 70%;
}

.mt-13{
  padding-left: 200px;
}

.nav-item{
  color: #fff;
  font-size: 15px;
}

.navbar-expand-lg .navbar-nav .nav-link {
  padding-right: 2.5rem;
  padding-left: 2.5rem;
  color: #fff!important;
  font-family: 'Monserrat';
}

@media (max-width: 992px){
  .mt-13{
    padding-left: 0px;
    margin-top: 20px;
  }
}




@media (max-width: 1500px){
  .navbar-brand{
    position: static;
    float: left;
  }
  .navbar .container{
    width: auto;
  } 
}

.navbar ul{
  margin-bottom:0;
}

.navbar-desctop .phone,
.navbar-desctop .email{
  float: left;
  font-family: 'Karla', sans-serif;
  position: relative;
  top:0.3rem;
  margin-right: 4rem;
}

.navbar-bottom{
  position: absolute;
  left: 0;
  width: 100%;
  bottom:0;
  padding:0 1.5rem 3rem 1.5rem;
}

@media (min-width: 992px){
  .navbar-bottom{
    padding-left: 3rem;
    padding-right:3rem;
  }
}

.navbar-bottom{
  font-family: 'Karla', sans-serif;
  color: #000;
}

.navbar-bottom .social{
  position: relative;
  z-index: 10;
  float: left;
}

.navbar-bottom .copy{
  float: right;
  position: relative;
  z-index: 10;
}

.social-icons li{
  float: left;
  margin-right: 1.5rem;
}

.social-icons ion-icon{
  display: block;
  font-size:1.2rem;
  color:#000;
  transition: all 0.3s ease;
}

.social-icons ion-icon:hover{
  color: #D4F21B;
}

.navbar-bottom-white,
.navbar-bottom-white .social-icons ion-icon{
  color: #fff;
}



/* 2.1 Navbar Desctop */



.navbar-desctop:before{
  content:'';
  position: absolute;
  top:0;
  left:0;
  width: 100%;
  height: 0;
  background:#fff;
  transition: all 0.3s ease;
}

.navbar-nav-desctop{
  font-family: 'Montserrat', sans-serif;
  font-size:0.8rem;
  text-transform: uppercase;
  font-weight: 400;
  letter-spacing: 0.05em;
  margin-top:0.3rem;
}

.nav-link{
  padding: 0;
}

.navbar-nav-desctop li a{
  color: #343434;
  transition:all 0.3s;
}

.navbar-nav-desctop li a:hover{
  text-decoration: none;
}

.navbar-nav-desctop > li{
  position: relative;
  float: left;
  margin-right: 2.1rem;
} 

.navbar-nav-desctop > li > a{
  display: flex;
  align-items: center;
}

.navbar-nav-desctop > li > .active,
.navbar-nav-desctop >  li:hover > a{
  color:#767676;
}

.navbar-nav-desctop li ul{
  opacity: 0;
  visibility: hidden;
  padding:0.7rem 1.8rem;
  position: absolute;
  top:85%;
  background:#1a1c26;
  color:#000;
  min-width: 12rem;
  margin-left: -1.5rem;
  transition:all 0.3s linear;
}

.navbar-nav-desctop li:hover ul{
  top:100%;
  opacity: 1;
  visibility: visible;
}

.navbar-nav-desctop li ul li{
  margin:1rem 0;
}

.navbar-nav-desctop li ul li a{
  opacity: 0.5;
  display: block;
}

.navbar-nav-desctop li ul .active a,
.navbar-nav-desctop li ul li:hover a{
  opacity: 1;
}



/* 2.2 Navbar Mobile */


.click-capture{
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  visibility: hidden;
  opacity: 0;
  z-index: 99;
  background: rgb(203, 9, 9);
  transition: opacity 0.5s;
}

.navbar-mobile{
  display: block;
  align-items: baseline;
  flex-wrap: unset;
  padding:3.9rem 2.6rem 1.3rem 4.4rem;
  position: fixed;
  top:0;
  bottom:0;
  right: 0;
  width: 100%;
  height: 100%;
  z-index: 110;
  background-color: #1b001d;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  display: -ms-flexbox;
  box-shadow:0 0 50px rgba(0,0,0,0.1);
  -webkit-transform: translateX(100%);
  -ms-transform: translateX(100%);
  -o-transform: translateX(100%);
  transform: translateX(100%);
  display: flex;
  flex-direction: column;
  -webkit-transition: all 0.6s ease;
  -o-transition: all 0.6s ease;
  transition: all 0.6s ease;
}

.navbar-mobile .language{
  margin-top:0;
  font-size: 0.85rem;
}

.navbar-mobile .language li{
  float: left;
  color: #fff;
  margin-right: 1rem;
}

.navbar-mobile .language li a{
  color: #fff;
}

.navbar-mobile .language .active a,
.navbar-mobile .language li a:hover{
  color: #D4F21B;
  text-decoration: none;
}

.navbar-mobile .close{
  position: absolute;
  right: 1rem;
  top:0.5rem;
  font-size: 3rem;
  color: #fff;
  transition:all 0.3s ease;
  cursor: pointer;
  opacity: 1;
}

.navbar-mobile .close:hover{
  opacity: 1;
  color:#D4F21B;
}

@media (min-width: 576px){
  .navbar-mobile{
    width: 50%;
    max-width: 32rem;
  }
}

.navbar-mobile-footer{
  margin-top: auto;
  color: #fff;
}

.navbar-nav-mobile{
  display: block;
  font-size:2.5vh;
  margin-top: 8vh;
  font-weight: 600;
}

.navbar-nav-mobile  li{
  margin-bottom: 4.4vmin;
}

.navbar-nav-mobile li a{
  color:#fff;
}

.navbar-nav-mobile li .active,
.navbar-nav-mobile  li a:hover,
.navbar-nav-mobile  li a:focus{
  color:#D4F21B;
}

.menu-is-open{
  overflow:hidden;
}

.menu-is-open .navbar-mobile{
  -webkit-transform: translateX(0);
  -ms-transform: translateX(0);
  -o-transform: translateX(0);
  transform: translateX(0);
}

.menu-is-open .click-capture{
  visibility: visible;
  opacity: 1;
}


/* 2.3 Navbar Fixed */



.navbar.fixed{
  position: fixed;
  z-index: 10;
  top:0;
  box-shadow:0 0 30px rgba(0,0,0,0.1);
}

.navbar.fixed:before{
  height: 100%;
}


/* 2.4 Navbar White */


.navbar-white{
  border-bottom: 1px solid rgba(255,255,255,0.1);
}

.navbar-white:not(.fixed) .phone,
.navbar-white:not(.fixed) .email,
.navbar-white:not(.fixed) a,
.navbar-white:not(.fixed) a:hover{
    color: #fff;
}

.navbar-white:not(.fixed) .navbar-nav-desctop li a{
  color: #fff;
}

.navbar-white:not(.fixed) .navbar-nav-desctop > .active > a,
.navbar-white:not(.fixed)  .navbar-nav-desctop > li > .active, 
.navbar-white:not(.fixed)  .navbar-nav-desctop > li:hover > a {
    color: #23a592;
}

.navbar-white:not(.fixed) .social-icons ion-icon{
  color: #fff;
}

.navbar-white:not(.fixed) .social-icons ion-icon:hover{
  color: #23a592;
}

.navbar-white:not(.fixed) .toggler-icon{
  border-color: #fff;
}


/*-------------------------------------------------------------------------------
  3. Main
-------------------------------------------------------------------------------*/



/* 3.1 Masthead */



.masthead{
  position: relative;
  min-height: 100vh;
  background-size: cover;
  display: flex;
  align-items: center;
  padding:9rem 0 5rem 0;
  background-position: left top;
  background-size: cover;
}

.opener{
  position: relative;
  z-index: 1;
  width: 100%;
}

.opener .modal-content{
  background-color: rgba(255,255,255,0.9);
}

h1 + .line{
  margin-top:15vh;
  width: 25%;
  border-top:3px  solid #D4F21B;
  transition:all .3s ease;
}



/* 3.2 Sections */



.section{
  position: relative;
  padding:9rem 0;
}

.section-sm{
  padding: 6rem 0;
}

.section h2{
  margin-top: 0;
}

.pp-section{
  background: #fff;
  background-position: 50%;
  background-size: cover;
  padding:8rem 0 6rem;
}

.section:not(#home) .intro2{
  opacity: 0;
  transform:translateY(-140px);
  transition:all 0.7s;
}

.section:not(#home) .intro2.animate{
  opacity: 1;
  transform:translateY(0);
}

.hazalgo .h2{
    font-size: 42px;
  }



.pp2-scrollable2{
  padding:0;
  overflow-x: hidden;
}

.pp2-scrollable2 .intro2{
  width: 100%;
  height: 100%;

}
.pp2-scrollable2 .intro2:before{
  content: '';
  display: inline-block;
  height: 100vh;

}

.pp2-scrollable2 .scroll-wrap2{
  width: 100%;
  position: relative;
  display: inline-block;
  vertical-align: middle;
  padding: 8rem 0 6rem;
  white-space: normal;
}
.navbar-expand-lg .navbar-nav .nav-link:hover {

  color: black!important;

  
}

@media(max-width: 1000px) {
.navbar-expand-lg .navbar-nav .nav-link {
  padding-right: 0.5rem;
  padding-left: 0.5rem;
  color: #fff!important;
  background-color: rgba(255, 51, 102, 0.628);
  
}
.navbar-expand-lg .navbar-nav .nav-link:hover {
  padding-right: 0.5rem;
  padding-left: 0.5rem;
  color: black!important;
  background-color: rgba(255, 51, 102, 0.628);
  
}

.navbar ul {
  margin-bottom: 40px;
  width: 35%;
 
}

.navbar-light .navbar-toggler {
  color: rgba(0,0,0,.5);
  border-color: rgba(0,0,0,.1);
  margin-top: 20px;
  
}

}
/* PORTADA DE PAGINA */

.parallax {
  height: 850px; /* altura del contenedor principal */
  position: relative;
  overflow: hidden;
}

.background {
  background: url('../img/arenales/inicio1.png') no-repeat center center fixed;
  background-size: cover;
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  z-index: -1; /* coloca la imagen de fondo detrás del contenido */
}

.foreground {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  z-index: 1; /* coloca la imagen encima del contenido */
}

.parallax3 {
  height: 850px; /* altura del contenedor principal */
  position: relative;
  overflow: hidden;
}

.background3 {
  background: url('../img/arenales/sliders2.png') no-repeat center center fixed;
  background-size: cover;
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  z-index: -1; /* coloca la imagen de fondo detrás del contenido */
}

.foreground3 {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  z-index: 1; /* coloca la imagen encima del contenido */
}

/* Segunda imagen */
.parallax2 {
  height: 850px; /* altura del contenedor principal */
  position: relative;
  overflow: hidden;
}

.background2 {
  background: url('../img/arenales/pagina5.png') no-repeat center center fixed;
  background-size: cover;
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  z-index: -1; /* coloca la imagen de fondo detrás del contenido */
}

.foreground2 {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  z-index: 1; /* coloca la imagen encima del contenido */
}

/* imagen movil */
.background-movil {
  background: url('../img/arenales/movil/1.png') no-repeat center center fixed;
  background-size: cover;
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  z-index: -1; /* coloca la imagen de fondo detrás del contenido */
}

.foreground-movil {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  z-index: 1; /* coloca la imagen encima del contenido */
}


nav {
  background-color: rgba(183, 183, 183, 0.135);
  color: white;
}

/* Tercera imagen movil */
.background2-movil {
  background: url('../img/arenales/movil/2-1.png') no-repeat center center fixed;
  background-size: cover;
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  z-index: -1; /* coloca la imagen de fondo detrás del contenido */
}
.foreground2-movil {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  z-index: 1; /* coloca la imagen encima del contenido */
}

/* Esta dimensión hace que cuando llegue a los 769px se quite la imagen Desktop */
@media(max-width: 769px) {
  .background{
    display:none;
    padding: 0px;
  }
  .foreground{
    display:none;
    padding: 0px;
  }
  .background2{
    display:none;
    padding: 0px;
  }
  .foreground2{
    display:none;
    padding: 0px;
  }              
}


/* Esta dimensión hace que cuando llegue a los 769px se quite la imagen movil */
@media(min-width: 769px) {
  .background-movil{
    display:none;
    padding: 0px;
  }
  .foreground-movil{
    display:none;
    padding: 0px;
  }   
  .background2-movil{
    display:none;
    padding: 0px;
  }
  .foreground2-movil{
    display:none;
    padding: 0px;
  }
}

/* Esta dimensión hace que cuando llegue a los 769px se quite la imagen movil */
@media(min-width: 415px) {
  .background3-movil{
    display:none;
    padding: 0px;
  }
  .foreground3-movil{
    display:none;
    padding: 0px;
  }  
}


@media(max-width: 541px) {
  .primeraparte{
    margin: 40px;
    max-width: 100%!important;
  }
}




/* TERMINA PORTADA DE PÁGINA */

/* --HAZ ALGO POR EL..-- EMPIEZA LA SEGUNDA PÁGINA MOVIL */

@media(max-width: 769px) {
.position-relative {
  width: 80%!important;
}
.experience-info{
  position: absolute;
  left: 55%!important;
  top: 100%;
  transform: translateX(-42%);
  margin-top: -21rem;
  z-index: -1;
  }
}

@media(max-width: 541px) {
  .position-relative {
    width: 90%!important;
  }
  .experience-info{
    position: absolute;
    left: 60%!important;
    top: 100%;
    transform: translateX(-42%);
    margin-top: -21rem;
    z-index: -1;
    }
  }

@media(max-width: 415px) {
  .hazalgo{
    font-size: 42px;
  }
  .position-relative {
    width: 84%!important;
  }
  .experience-info{
    position: absolute;
    left: -33%!important;
    width: 10%!important;
    top: 103%!important;
    transform: translateX(-5%)!important;
    margin-top: -21rem;
    z-index: -1;
    }
  .fotikon2{
    width: 350px;
    position: absolute;
    left: -36%!important;
    top: 440px;
    transform: translateX(25%)!important;
    margin-top: -21rem;
    z-index: -1;
  }
  }
@media(max-width: 376px) {
  .hazalgo{
    font-size: 38px;
  }
  .primeraparte{
    width: 80%;
  }
  .botoncitouno{
    font-size: 12.5px!important;
  }
  .position-relative {
    width: 89%!important;
  }
  .experience-info{
    position: absolute;
    left: -33%!important;
    width: 10%!important;
    top: 103%!important;
    transform: translateX(-5%)!important;
    margin-top: -21rem;
    z-index: -1;
    }
  .fotikon2{
    width: 350px;
    position: absolute;
    left: -36%!important;
    top: 440px;
    transform: translateX(25%)!important;
    margin-top: -21rem;
    z-index: -1;
  }
  }
/* --MÉRIDA-- EMPIEZA LA TERCERA PÁGINA MOVIL */

@media(max-width: 769px) {
  .tercerparte{
    margin-left: -50px;
  }
}

@media(max-width: 541px) {
  .parrafomerida1{
    font-family:'David Bold'!important;
  }
  .tercerparte{
    margin-left: -150px;
  }
  h1{
    font-size: 110px!important;
    margin-left: 175px!important;
  }
  .segundoparrafo{
    padding-left: 150px!important;
  }
  .tercerparrafo{
    text-align: center!important;
  }
}

@media(max-width: 415px) {
  .parrafomerida1{
    font-family:'David Bold'!important;
  }
  .tercerparte{
    margin-left: -70px;
  }
  h1{
    font-size: 80px!important;
    margin-left: 95px!important;
  }
  .segundoparrafo{
    padding-right: 150px!important;
    font-size: 18px!important;
    margin-left: -15%!important;
    
  }
  .tercerparrafo{
    text-align: center!important;
    font-size: 25px!important;
  }
}

@media(max-width: 394px) {
  .parrafomerida1{
    font-family:'David Bold'!important;
  }
  .tercerparte{
    margin-left: -70px;
  }
  h1{
    font-size: 74px!important;
    margin-left: 95px!important;
  }
  .segundoparrafo{
    padding-right: 150px!important;
    font-size: 18px!important;
    margin-left: -15%!important;
    
  }
  .tercerparrafo{
    text-align: center!important;
    font-size: 23px!important;
  }
}

@media(max-width: 391px) {
  .parrafomerida1{
    font-family:'David Bold'!important;
  }
  .tercerparte{
    margin-left: -70px;
  }
  h1{
    font-family:'David Bold'!important;
    font-size: 74px!important;
    margin-left: 95px!important;
  }
  .segundoparrafo{
    padding-right: 150px!important;
    font-size: 18px!important;
    margin-left: -15%!important;
    
  }
  .tercerparrafo{
    text-align: center!important;
    font-size: 22px!important;
  }
}

@media(max-width: 376px) {
  .parrafomerida1{
    font-family:'David Bold'!important;
  }
  .tercerparte{
    margin-left: -90px;
  }
  h1{
    font-family:'David Bold'!important;
    font-size: 74px!important;
    margin-left: 110px!important;
  }
  .segundoparrafo{
    padding-right: 150px!important;
    font-size: 18px!important;
    margin-left: -15%!important;
    
  }
  .tercerparrafo{
    text-align: center!important;
    font-size: 21px!important;
  }
}


/* --PROGRESO-- EMPIEZA LA CUARTA PÁGINA MOVIL  */

@media(max-width: 769px) {
  .cuartaparte{
    top: 100px;
  }
  .texto{
    font-family:'David Bold'!important;
    font-size: 102px!important;
  }
  .photo-icon-3{
    right:-105px;
    top:400px!important;
  }
  .padre2{
    width: 85%!important;
  }
}

@media(max-width: 541px) {
  .cuartaparte{
    top: 80px;
    margin: 60px;
  }
  .texto{
    font-family:'David'!important;
    font-size: 84px!important;
    margin-right: -35px!important;
    top: -110px!important;
  }

  .photo-icon-3{
    left: -10px !important;;
    top:390px!important;
  }
  .padre2{
    width: 83%!important;
  }
}

@media(max-width: 415px) {
  .cuartaparte{
    top: 90px;
    margin: 20px;
  }
  .texto{
    font-family:'David Bold'!important;
    font-size: 57px!important;
    margin-right: 20px!important;
    top: -110px!important;
  }
  .parrafoprogreso{
    text-align: center!important;
  }
  .photo-icon-3{
    left: 270px!important;
    top:280px!important;
  }
  .fotikon{
    width: 340px;
    position: absolute;
    left: -50%!important;
    top: 450px;
    transform: translateX(25%)!important;
    margin-top: -21rem;
    z-index: -1;
  }
  .padre2{
    width: 85%!important;
  }
}

@media(max-width: 394px) {
  .cuartaparte{
    top: 90px;
    margin: 20px;
  }
  .texto{
    font-family:'David'!important;
    font-size: 57px!important;
    margin-right: 5px!important;
    top: -110px!important;
  }
  .parrafoprogreso{
    text-align: center!important;
  }
  .photo-icon-3{
    left: 260px!important;
    top:260px!important;
  }
  .fotikon{
    width: 340px;
    position: absolute;
    left: -50%!important;
    top: 450px;
    transform: translateX(25%)!important;
    margin-top: -21rem;
    z-index: -1;
  }
  .padre2{
    width: 86%!important;
  }
}

@media(max-width: 391px) {
  .cuartaparte{
    top: 90px;
    margin: 20px;
  }
  .texto{
    font-family:'David'!important;
    font-size: 55px!important;
    margin-right: 10px!important;
    top: -110px!important;
  }
  .parrafoprogreso{
    text-align: center!important;
  }
  .photo-icon-3{
    left: 255px!important;
    top:260px!important;
  }
  .fotikon{
    width: 340px;
    position: absolute;
    left: -50%!important;
    top: 450px;
    transform: translateX(25%)!important;
    margin-top: -21rem;
    z-index: -1;
  }
  .padre2{
    width: 86%!important;
  }
}

@media(max-width: 376px) {
  .cuartaparte{
    top: 90px;
    margin: 20px;
  }
  .texto{
    font-family:'David'!important;
    font-size: 55px!important;
    margin-right: 10px!important;
    top: -110px!important;
  }
  .parrafoprogreso{
    text-align: center!important;
  }
  .photo-icon-3{
    left: 240px!important;
    top:260px!important;
  }
  .fotikon{
    width: 340px;
    position: absolute;
    left: -90%!important;
    top: 450px;
    transform: translateX(25%)!important;
    margin-top: -21rem;
    z-index: -1;
  }
  .padre2{
    width: 86%!important;
  }
}
/* --MAPA-- EMPIEZA LA QUINTA PÁGINA MOVIL */
@media(min-width: 769px) {
  .mapa{
    display:none!important;
    padding: 0px!important;
  }
  .index{
    display:none!important;
    padding: 0px!important;
  }
}
@media(max-width: 769px) {
  .mapa2{
    display:none!important;
    padding: 0px!important;
  }
}
@media(max-width: 541px) {
  .botoncito{
    margin-top: -485px!important;
    font-size: 13px!important;
    
  }
}
@media(max-width: 415px) {
  .botoncito{
    margin-top: -625px!important;
    font-size: 13px!important;
    
  }
}
@media(max-width: 376px) {
  .botoncito{
    margin-top: -425px!important;
    font-size: 11px!important;
    
  }
}

/* --CASA CLUB-- EMPIEZA LA SEXTA PÁGINA MOVIL  */

@media(max-width: 769px) {
.sextaparte{
  margin: 50px;
  margin-right: 60px;
}
}

@media(max-width: 541px) {
.sextaparte{
  margin-left: -20px!important;
}
.parrafoclub{
  font-family:'David Bold'!important;
  font-size: 70px!important;
  margin-left: 70px!important;
}
.parrafosegundo{
  font-size: 20px!important;
  width: 450px!important;
  margin-left: 30px!important;
}
.listita{
  width: 80%;
  left: 13%;
}
}

@media(max-width: 415px) {
  .sextaparte{
    margin-left: -70px!important;
  }
  .parrafoclub{
    font-family:'David Bold'!important;
    font-size: 60px!important;
    margin-left: 78px!important;
  }
  .parrafosegundo{
    font-size: 18px!important;
    width: 350px!important;
    margin-left: 60px!important;
  }
  .listita{
    width: 86%;
    left: 11%;
  }
  }

  @media(max-width: 391px) {
    .sextaparte{
      margin-left: -70px!important;
    }
    .parrafoclub{
      font-family:'David Bold'!important;
      font-size: 60px!important;
      margin-left: 78px!important;
    }
    .parrafosegundo{
      font-size: 18px!important;
      width: 350px!important;
      margin-left: 60px!important;
    }
    .listita{
      width: 86%;
      left: 11%;
    }
    }

  @media(max-width: 376px) {
    .sextaparte{
      margin-left: -70px!important;
    }
    .parrafoclub{
      font-family:'David Bold'!important;
      font-size: 56px!important;
      margin-left: 78px!important;
    }
    .parrafosegundo{
      font-size: 16px!important;
      width: 310px!important;
      margin-left: 75px!important;
    }
    .listita{
      width: 83%;
      left: 11%;
      margin-top: -40px;
    }
    }

/* --EXTRAORDINARIA-- EMPIEZA LA SEPTIMA PÁGINA MOVIL */
@media(min-width: 769px) {
  .mapa3{
    display:none!important;
    padding: 0px!important;
  }
}
@media(max-width: 769px) {
  .mapa4{
    display:none!important;
    padding: 0px!important;
  }
}

/* --AMENIDADES 1-- EMPIEZA LA OCTAVA PÁGINA MOVIL */
@media(min-width: 769px) {

}
@media(max-width: 541px) {
.aminidades1{
  margin: 22px;
}
.preventaletra2 {
  font-size: 75px!important;
}
.preventaletra4{
  font-size: 28px!important;
  margin: 1px;
}
.listita2{
  font-size: 20px;
}
.experience-info2{
  position: absolute;
  left: 47%;
  top: 70%!important;
  transform: translateX(-51%)!important;
  margin-top: -21rem;
  z-index: -1;
}
}

@media(max-width: 415px) {
  .aminidades1{
    margin: 12px;
  }
  .preventaletra2 {
    font-size: 60px!important;
  }
  .preventaletra4{
    font-size: 19px!important;
    line-height: 1.1;
    margin: 1px;
  }
  .listita2{
    font-size: 21px;
  }
  .fotiko3{
    width: 350px;
  }
  .experience-info2{
    position: absolute;
    left: 37%;
    top: 97%!important;
    transform: translateX(-52%)!important;
    margin-top: -21rem;
    z-index: -1;
  }
  }


@media(max-width: 394px) {
  .aminidades1{
    margin: 12px;
  }
  .preventaletra2 {
    font-size: 55px!important;
  }
  .preventaletra4{
    font-size: 12px!important;
    line-height: 1.1;
    margin: 1px;
  }
  .listita2{
    font-size: 21px;
  }
  .fotiko3{
    width: 350px;
  }
  .experience-info2{
    position: absolute;
    left: 38%;
    top: 98%!important;
    transform: translateX(-51%)!important;
    margin-top: -21rem;
    z-index: -1;
  }
  }
  .acceso:not(:first-child) img {
    display: none;
}

@media(max-width: 376px) {
  .aminidades1{
    margin: 12px;
  }
  .preventaletra2 {
    font-size: 50px!important;
  }
  .preventaletra4{
    font-size: 12px!important;
    line-height: 1.1;
    margin: 1px;
  }
  .listita2{
    font-size: 20px;
  }
  .fotiko3{
    width: 350px;
  }
  .experience-info2{
    position: absolute;
    left: 38%;
    top: 98%!important;
    transform: translateX(-51%)!important;
    margin-top: -21rem;
    z-index: -1;
  }
  }
/* --COLLAGE-- EMPIEZA LA NOVENA PÁGINA MOVIL */
@media(min-width: 769px) {

}
@media(max-width: 415px) {
  .botoncito2{
    margin-top: 440px;
    left: 17%!important;
    font-size: 14px;
  }
}

@media(max-width: 391px) {
  .botoncito2{
    margin-top: 440px;
    left: 14%!important;
    font-size: 14px;
  }
}

@media(max-width: 376px) {
  .botoncito2{
    margin-top: 380px!important;
    left: 16%!important;
    font-size: 12px!important;
  }
}

/* --SERVICIOS-- EMPIEZA LA DECIMA PÁGINA MOVIL */
@media(min-width: 769px) {

}
@media(max-width: 541px) {
.parrafoservicios{
  font-family:'David Bold'!important;
    font-size: 80px!important;
    margin-left: 35px!important;
}
.parrafoservicios2{
  font-size: 33px!important;
}
}

@media(max-width: 415px) {
  .parrafoservicios{
    font-family:'David Bold'!important;
      font-size: 60px!important;
      margin-left: 30px!important;
  }
  .parrafoservicios2{
    font-size: 26px!important;
  }
  .carousel-testimonials .owl-nav {
    position: static;
    margin-top: 6rem;
    margin-left: 40%;
  }
  .owl-carousel .owl-item img {
    display: block;
    width: 60%;
    margin-left: 20%;
  }

  }

@media(max-width: 394px) {
  .parrafoservicios{
    font-family:'David Bold';
      font-size: 60px!important;
      margin-left: 20px!important;
  }
  .parrafoservicios2{
    font-size: 24px!important;
  }
  .carousel-testimonials .owl-nav {
    position: static;
    margin-top: 6rem;
    margin-left: 38%;
  }
  .owl-carousel .owl-item img {
    display: block;
    width: 60%;
    margin-left: 20%;
    
  }
  }

@media(max-width: 391px) {
  .parrafoservicios{
    font-family:'David Bold';
      font-size: 57px!important;
      margin-left: 20px!important;
  }
  .parrafoservicios2{
    font-size: 24px!important;
  }
  .carousel-testimonials .owl-nav {
    position: static;
    margin-top: 6rem;
    margin-left: 38%;
  }
  .owl-carousel .owl-item img {
    display: block;
    width: 60%;
    margin-left: 20%;
    
  }
  }

  @media(max-width: 376px) {
  .parrafoservicios{
    font-family:'David Bold';
      font-size: 57px!important;
      margin-left: 20px!important;
  }
  .parrafoservicios2{
    font-size: 22px!important;
  }
  .carousel-testimonials .owl-nav {
    position: static;
    margin-top: 6rem;
    margin-left: 38%;
  }
  .owl-carousel .owl-item img {
    display: block;
    width: 60%;
    margin-left: 20%;
    
  }
  }
/* --PREVENTA-- EMPIEZA LA ONCEAVA PÁGINA MOVIL */
@media(min-width: 769px) {

}
@media(max-width: 541px) {

.preventaentrega{
font-size: 22px!important;
}
.primero1{
  font-size: 58px!important;
}
.w-2{
  right: 22%;
  position: absolute;
  width: 55%;
  top: 60%;
}
.w-3{
  width: 60%;
  left: 21%;
  top: 76%;
  position: absolute;
}
.gastosadmi1{
  margin-top: 160px;

}
.gastosadmi{
  font-size: 16px;
}
.fotiko4{
  width: 350px;
}
}

@media(max-width: 415px) {

  .preventaentrega{
  font-size: 22px!important;
  }
  .primero1{
    font-size: 58px!important;
  }
  .w-2{
    right: 22%;
    position: absolute;
    width: 55%;
    top: 60%;
  }
  .w-3{
    width: 60%;
    left: 21%;
    top: 76%;
    position: absolute;
  }
  .gastosadmi1{
    margin-top: 160px;
  
  }
  .gastosadmi{
    font-size: 16px;
  }
  .fotiko4{
    width: 350px;
  }
  }

@media(max-width: 391px) {

  .preventaentrega{
  font-size: 22px!important;
  }
  .primero1{
    font-size: 53px!important;
  }
  .w-2{
    right: 17%;
    position: absolute;
    width: 65%;
    top: 57%;
  }
  .w-3{
    width: 70%;
    left: 16%;
    top: 75%;
    position: absolute;
  }
  .gastosadmi1{
    margin-top: 200px;
    margin-bottom: 00px;
  
  }
  .gastosadmi{
    font-size: 15px;
  }
  .fotiko4{
    width: 350px;
    
  }

  }

@media(max-width: 391px) {
  .preventaentrega{
  font-size: 19px!important;
  }
  .primero1{
    font-size: 50px!important;
  }
  .w-2{
    right: 17%;
    position: absolute;
    width: 65%;
    top: 57%;
  }
  .w-3{
    width: 70%;
    left: 16%;
    top: 75%;
    position: absolute;
  }
  .gastosadmi1{
    margin-top: 200px;
    margin-bottom: 00px;
  
  }
  .gastosadmi{
    font-size: 15px;
  }
  .fotiko4{
    width: 350px;
    
  }

  }
/* --MASTERPLAN-- EMPIEZA LA DOCEAVA PÁGINA MOVIL */
@media(min-width: 769px) {
.master{
  display:none!important;
  padding: 0px!important;
}
}
@media(max-width: 769px) {
  .master2{
    display:none!important;
    padding: 0px!important;
  }
  }


@media(max-width: 541px) {

/* MASTERPLAN */
.padre-movil {
	padding: 0px;
	width: calc(110% - 20px);
  left: calc(10% - 50px);
  bottom: 0px;
	position: relative;
}
.padre-movil .acceso2{
  width: calc(50% - 10px);
	position: absolute;
	top: 110px;
	left: calc(56.3% - 50px);
  opacity: 1;
}
.padre-movil .familiar2{
  width: calc(33% - 10px);
	position: absolute;
	top: 191px;
	left: calc(53% - 50px);
  opacity: 1;
}
.padre-movil .woods2{
  width: calc(33% - 10px);
	position: absolute;
	top: 205px;
	left: calc(61.5% - 50px);
  opacity: 1;
}
.padre-movil .urbano2{
  width: calc(33% - 10px);
	position: absolute;
	top: 120px;
	left: calc(39.8% - 50px);
  opacity: 1;
}
.padre-movil .mascotas2{
  width: calc(23% - 10px);
	position: absolute;
	top: 143px;
	left: calc(42.6% - 50px);
  opacity: 1;
}
.padre-movil .casa2{
  width: calc(29% - 10px);
	position: absolute;
	top: 168px;
	left: calc(27.5% - 50px);
  opacity: 1;
}  
}

@media(max-width: 415px) {

/* MASTERPLAN */
.padre-movil {
	padding: 0px;
	width: calc(108% - 20px);
  left: calc(11% - 50px);
  bottom: 0px;
	position: relative;
}
.padre-movil .acceso2{
  width: calc(50% - 10px);
	position: absolute;
	top: 78px;
	left: calc(58.3% - 50px);
  opacity: 1;
}
.padre-movil .familiar2{
  width: calc(33% - 10px);
	position: absolute;
	top: 135px;
	left: calc(53% - 50px);
  opacity: 1;
}
.padre-movil .woods2{
  width: calc(33% - 10px);
	position: absolute;
	top: 144px;
	left: calc(60.5% - 50px);
  opacity: 1;
}
.padre-movil .urbano2{
  width: calc(33% - 10px);
	position: absolute;
	top: 201px;
	left: calc(40.5% - 50px);
  opacity: 1;
}
.padre-movil .mascotas2{
  width: calc(33% - 10px);
	position: absolute;
	top: 209px;
	left: calc(47.6% - 50px);
  opacity: 1;
}
.padre-movil .casa2{
  width: calc(37% - 10px);
	position: absolute;
	top: 248px;
	left: calc(31.5% - 50px);
  opacity: 1;
}  
}


@media(max-width: 394px) {

  /* MASTERPLAN */
  .padre-movil {
    padding: 0px;
    width: calc(108% - 20px);
    left: calc(11.5% - 50px);
    bottom: 0px;
    position: relative;
  }
  .padre-movil .acceso2{
    width: calc(50% - 10px);
    position: absolute;
    top: 73px;
    left: calc(59.1% - 50px);
    opacity: 1;
  }
  .padre-movil .familiar2{
    width: calc(33% - 10px);
    position: absolute;
    top: 126px;
    left: calc(54% - 50px);
    opacity: 1;
  }
  .padre-movil .woods2{
    width: calc(33% - 10px);
    position: absolute;
    top: 136px;
    left: calc(62.4% - 50px);
    opacity: 1;
  }
  .padre-movil .urbano2{
    width: calc(33% - 10px);
    position: absolute;
    top: 188px;
    left: calc(41.5% - 50px);
    opacity: 1;
  }
  .padre-movil .mascotas2{
    width: calc(33% - 10px);
    position: absolute;
    top: 197px;
    left: calc(48.7% - 50px);
    opacity: 1;
  }
  .padre-movil .casa2{
    width: calc(37% - 10px);
    position: absolute;
    top: 232px;
    left: calc(32.5% - 50px);
    opacity: 1;
  }  
  }



@media(max-width: 376px) {

  /* MASTERPLAN */
  .padre-movil {
    padding: 0px;
    width: calc(108% - 20px);
    left: calc(11.5% - 50px);
    bottom: 0px;
    position: relative;
  }
  .padre-movil .acceso2{
    width: calc(50% - 10px);
    position: absolute;
    top: 70px;
    left: calc(59.5% - 50px);
    opacity: 1;
  }
  .padre-movil .familiar2{
    width: calc(33% - 10px);
    position: absolute;
    top: 120px;
    left: calc(54% - 50px);
    opacity: 1;
  }
  .padre-movil .woods2{
    width: calc(33% - 10px);
    position: absolute;
    top: 129px;
    left: calc(62.4% - 50px);
    opacity: 1;
  }
  .padre-movil .urbano2{
    width: calc(33% - 10px);
    position: absolute;
    top: 178px;
    left: calc(42.1% - 50px);
    opacity: 1;
  }
  .padre-movil .mascotas2{
    width: calc(33% - 10px);
    position: absolute;
    top: 186px;
    left: calc(49.5% - 50px);
    opacity: 1;
  }
  .padre-movil .casa2{
    width: calc(37% - 10px);
    position: absolute;
    top: 220px;
    left: calc(33.2% - 50px);
    opacity: 1;
  }  
  }


@media(max-width: 361px) {

  /* MASTERPLAN */
  .padre-movil {
    padding: 0px;
    width: calc(108% - 20px);
    left: calc(13% - 50px);
    bottom: 0px;
    position: relative;
  }
  .padre-movil .acceso2{
    width: calc(50% - 10px);
    position: absolute;
    top: 66px;
    left: calc(61% - 50px);
    opacity: 1;
  }
  .padre-movil .familiar2{
    width: calc(33% - 10px);
    position: absolute;
    top: 113px;
    left: calc(56% - 50px);
    opacity: 1;
  }
  .padre-movil .woods2{
    width: calc(33% - 10px);
    position: absolute;
    top: 122px;
    left: calc(64% - 50px);
    opacity: 1;
  }
  .padre-movil .urbano2{
    width: calc(33% - 10px);
    position: absolute;
    top: 168px;
    left: calc(43.7% - 50px);
    opacity: 1;
  }
  .padre-movil .mascotas2{
    width: calc(33% - 10px);
    position: absolute;
    top: 176px;
    left: calc(51.5% - 50px);
    opacity: 1;
  }
  .padre-movil .casa2{
    width: calc(37% - 10px);
    position: absolute;
    top: 210px;
    left: calc(34.6% - 50px);
    opacity: 1;
  }  
  }  
.texto {
  top: -140px!important;
  color: rgb(255, 51, 102); /* color predeterminado del texto */
}

.parrafoprogreso{
  top: -60px;
}
.cuartaparte{
  top: 60px;
}

.mb-20{
  position: relative;
  left: 850px;
  top: 640px;
}


.pp-scrollable{
  padding:0;
  overflow-x: hidden;
}

.pp-scrollable .intro{
  width: 100%;
  height: 100%;
  white-space: nowrap;
}

.pp-scrollable .intro:before{
  content: '';
  display: inline-block;
  height: 100vh;
  vertical-align: middle;
}

.pp-scrollable .scroll-wrap{
  width: 100%;
  position: relative;
  display: inline-block;
  vertical-align: middle;
  padding: 8rem 0 6rem;
  white-space: normal;
}

.progress-nav{
  position: fixed;
  z-index: 9999;
  top: 50%;
  right:1.5rem;
  transform: translate(0,-50%);
}

@media(min-width: 992px){
  .progress-nav{
    right: 3rem;
  }
}

.progress-nav li{
  position: relative;
  width: 3px;
  height:30px;
  -webkit-transition: background-color .3s cubic-bezier(.46,.03,.52,.96);
  transition: background-color .3s cubic-bezier(.46,.03,.52,.96);
  background-color: #000;
}

.progress-nav li:before{
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 3px;
  height: 0;
  content: '';
  transition:all .3s ease;
   background-color: #ff1c74;
}

.progress-nav li:before{
  height: 30px;
}

.progress-nav li.active ~ li:before {
    background-color: #dddddd;
}

.progress-nav-white li.active ~ li:before{
  background-color: #fff;
}




body #magicMouseCursor {
  z-index:10000000!important;
  position: fixed;
  width: 35px;
  height: 35px;
  border: 1px solid #ff1c74!important;
  background: #ff1c74!important;
  border-radius: 50%;
  box-shadow: 0 2px 14px 14px #ff1c74!important;
  left: 0;
  top: 0;
  transition: transform 0.05s, width 0.3s, height 0.3s;
  pointer-events: none; }
  body #magicMouseCursor.cursor-square {
  border-radius: 0; }
body #magicPointer {
  z-index:10000000!important;
  height: 5px;
  width: 5px;
  top: 0;
  left: 0;
  position: fixed;
  background-color: #ff1c74!important;
  border-radius: 50%;
  pointer-events: none;
  transition: "background" 0.1s, width 0.1s, height 0.1s, box-shadow 0.1s; }
  body #magicPointer.is-hover {
  background-color: #ff1c74!important; }
  body #magicPointer.pointer-blur {
  height: 50px;
  width: 50px;
  background: none;
  border: 1px solid #ff1c74!important;
  box-shadow: 0px 0px 15px -5px #ff1c74!important; }
  body #magicPointer.pointer-overlay {
  height: 50px;
  width: 50px;
  mix-blend-mode: difference;
  box-shadow: 0px 0px 15px -5px #ff1c74!important; }
body .magic-hover {
  transition: all 0.1s; }
  body .magic-hover:hover {
  cursor: auto!important; }






  /* Animación hover de botones */
  .pushme{
    -webkit-transform: scale(1,1);
    -webkit-transition-timing-function: ease-out;
    -webkit-transition-duration: 500ms;
    -moz-transform: scale(1,1);
    -moz-transition-timing-function: ease-out;
    -moz-transition-duration: 300ms;
  }
  .pushme:hover{
    -webkit-transform: scale(.9,.9);
    -webkit-transition-timing-function: ease-out;
    -webkit-transition-duration: 500ms;
    -moz-transform: scale(.9,.9);
    -moz-transition-timing-function: ease-out;
    -moz-transition-duration: 300ms;
  } 

  /* Animación hover de botones */
  .pushme2{
    -webkit-transform: scale(1,1);
    -webkit-transition-timing-function: ease-out;
    -webkit-transition-duration: 500ms;
    -moz-transform: scale(1,1);
    -moz-transition-timing-function: ease-out;
    -moz-transition-duration: 300ms;
  }
  .pushme2:hover{
    -webkit-transform: scale(1.1,1.1);
    -webkit-transition-timing-function: ease-out;
    -webkit-transition-duration: 500ms;
    -moz-transform: scale(1.1,1.1);
    -moz-transition-timing-function: ease-out;
    -moz-transition-duration: 300ms;
  } 

  /* Animación hover de botones */
  .pushme3{
    -webkit-transform: scale(1,1);
    -webkit-transition-timing-function: ease-out;
    -webkit-transition-duration: 500ms;
    -moz-transform: scale(1,1);
    -moz-transition-timing-function: ease-out;
    -moz-transition-duration: 300ms;
  }
  .pushme3:hover{
    -webkit-transform: scale(1.2,1.2);
    -webkit-transition-timing-function: ease-out;
    -webkit-transition-duration: 500ms;
    -moz-transform: scale(1.2,1.2);
    -moz-transition-timing-function: ease-out;
    -moz-transition-duration: 300ms;
  } 


.botoncito{
  margin-top: 700px;
  font-size: 16px;
  right: 16%;
  margin: 4px;
}
.botoncito5{
  margin-top: 700px;
  font-size: 16px;
  left: 95%;
  margin: 4px;
}
.carruselserv{
width: 500px;
}


.botoncito2{
  margin-top: 620px;
  left: 40%;
  font-size: 16px;
}
.botoncito3{
  margin-top: -280px;
  left: -22%;
  font-size: 16px;
}

@media(max-width: 1808px) {
  .botoncito3{
    margin-top: -318px;
    left: -20%;
    font-size: 16px;
  }
  .botoncito{
    margin-top: 200px;
    font-size: 16px;
    right: 12%;
    margin: 4px;
  }
}
@media(max-width: 1708px) {
  .botoncito3{
    margin-top: -318px;
    left: -15%;
    font-size: 16px;
  }
  .botoncito{
    margin-top: 200px;
    font-size: 16px;
    right: 7%;
    margin: 4px;
  }
}
@media(max-width: 1608px) {
.botoncito2{
  margin-top: 440px;
  left: 37%;
  font-size: 14px;
}
.botoncito3{
  margin-top: -388px;
  left: -20%;
  font-size: 16px;
}}
@media(max-width: 1508px) {
  .primeraparte{
    max-width: 50%;
  }
  .hazalgo{
    font-size: 40px;
  }
  .botoncito3{
    margin-top: -150px;
    left: -20%;
    font-size: 14px;
  }

}
@media(max-width: 1408px) {
  .botoncito3{
    margin-top: -150px;
    left: -20%;
    font-size: 14px;
  }

}

/* 3.3 About */
.w-100 {
  width: 110%!important;
}
.mb-5 {
  margin-bottom: 1rem!important;
}
.carousel-testimonials .owl-nav {
  position: static;
  margin-top: 32px!important;
}

.experience-info{
  position: absolute;
  left: 51%;
  top: 100%;
  transform: translateX(-50%);
  margin-top: -21rem;
  z-index: -1;
}


.experience-info2{
  position: absolute;
  left: 50%;
  top: 69.5%;
  transform: translateX(-50%);
  margin-top: -21rem;
  z-index: -1;
}

.experience-number{
  display: inline-block;
  font-size: 10rem;
  line-height: 1;
  font-family: 'Karla', sans-serif;
  color:#D4F21B;
}

.experience-text{
  display: inline-block;
  color: #000;
  line-height: 1.4;
  font-weight: 700;
}



/* 3.4 Experience */



.row-experience{
  padding:1rem 0;
  border-top: 1px solid rgba(255,255,255,0.3);
}

.row-experience:first-child{
  padding-top:0;
  border-top:0;
}

.row-experience:last-child{
  padding-bottom:0;
}

.row-experience img{
  width: auto!important;
}

.download-cv{
  display: inline-block;
  margin-top: 3.7rem;
  position: relative;
  z-index: 1;
}

.owl-dots{
  position: absolute;
  width: 100%;
  margin-top:3.5rem;
  text-align: center;
}

.owl-dot{
  display: inline-block;
  margin:0 0.35rem;
}

.owl-dot:focus{
  outline: none;
}

.owl-dots span{
  display: block;
  width: 20px;
  height:3px;
  background-color: #d6d6d6;
}

.owl-dot.active span{
  background-color: #ff1c74;
}

.owl-nav{
  font-family: 'Tahoma';
  position: absolute;
  right: 0;
  top: 0;
  margin-top: -8.6rem;
  font-size: 6rem;
}

.owl-prev{
  margin-right: 0.6rem;
}

.owl-next,
.owl-prev{
  opacity: 0.45;
  transition: all 0.3s;
}

.owl-prev:focus,
.owl-next:focus{
  outline: none;
}

.owl-prev:hover,
.owl-next:hover{
  opacity: 1!important;
  color:#ff1c74!important;
}



/* 3.5 Skills */


.photo-icon{
  position: absolute;
  overflow: hidden;
  transition:all .6s .4s ease;
  opacity: 0;
}

.photo-icon-1{
  top:-50px;
  left:30%
}

.photo-icon-2{
  left:-40px;
  bottom:100px;
}

.photo-icon-3{
  right:-62px;
  top:370px;
}

.active .photo-icon-1{
  opacity: 1;
  left:50%
}

.active .photo-icon-2{
  opacity: 1;
  bottom:150px;
  transition-delay: .7s
}

.photo-icon-3{
  max-width: 31%;
  opacity: 1;
  bottom:-50px;
}



.progress{
  height: 20px;
  border-radius: 20px;
  background-color: rgb(223, 223, 223);
}

.progress-bar{
  position: relative;
  border-color: black;
  background-color: transparent;
}

.progress-bar:before{
  position: absolute;
  background:rgb(255, 51, 102);
  content:'';
  width:0;
  height: 100%;
}

.active .progress-bar:before{
  width: 100%;
  transition:all 1s  ease;
}

.progress-item:nth-child(1) .progress-bar:before{
  transition-delay: 400ms;
}

.progress-item:nth-child(2) .progress-bar:before{
  transition-delay: 600ms;
}

.progress-item:nth-child(3) .progress-bar:before{
  transition-delay: 800ms;
}



/* 3.6 Projects */



.project-wrap{
  width: 100%;
  position: relative;
  min-height: 100%;
}

.bg-changer{
  position: absolute;
  top:0;
  left: 0;
  width: 100%;
  height: 100%;
  overflow:hidden;
}

.section-bg{
  position: absolute;
  left: 0;
  top:0;
  width: 100%;
  height: 100%;
  background-size: cover;
  background-position: center;
}

.bg-changer .section-bg{
  opacity: 0;
  will-change: opacity, transform;
  -webkit-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
  transform: scale(1);
  -webkit-transition: opacity 0.5s 0.2s ease,  transform 5s 0.2s ease;
  -o-transition: opacity 0.5s 0.2s ease,  transform 5s 0.2s ease;
  transition: opacity 0.5s 0.2s ease, transform 5s 0.2s ease;
}

.bg-changer .active{
  opacity: 1;
  -webkit-transform: scale(1.05);
  -ms-transform:scale(1.05);
  -o-transform: scale(1.05);
  transform: scale(1.05);
}

.bg-changer .section-bg:first-child{
  opacity: 1;
}

.row-project-box{
  margin-top: -30px;
}

.col-project-box{
  margin-top: 30px;
}

.project-box{
  display: block;
  padding-bottom: 30%;
  position: relative;
  border:1px solid rgba(255,255,255,0.5);
  -webkit-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  transition: all 0.3s  ease;
}

.project-box-inner{
  position: absolute;
  left: 0;
  top:0;
  width: 100%;
  height: 100%;
  padding:2.14rem 1.928rem;
}

.project-box h4{
  margin:0;
  color: #fff;
}

.project-category{
  color: #cccccc;
  margin-top: 0.5rem;
}

.project-box:hover{
  background: #D4F21B;
  text-decoration: none;
  border-color: transparent;
}

.project-box:hover h4{
  color: #000;
}

.project-box:hover .project-category{
  color:#666666;
}

@media (min-width: 768px){
  .project-box {
    padding-bottom: 75%;
  }
  .project-category{
    position: absolute;
    bottom:1.2rem;
  }
}



/* 3.7 Partners */



.row-partners{
  margin:0 -4rem;
}

.col-partner{
  padding:0 4rem;
  margin:2.5rem 0;
  text-align: center;
}

.col-partner img{
  max-width: 100%;
  transition: all 0.3s ease;
}


/* 3.8 Testimonials */



.icon-quote{
  display: inline-block;
  margin-left: -2rem;
  line-height: 1;
  font-size: 12rem;
  margin-top: -2rem;

}

.carousel-testimonials .owl-nav{
  position: static;
  margin-top: 5rem;
}



/* 3.9 Contact */



.message{
  margin-bottom: 2rem;
  display: none;
}