@import url('https://fonts.googleapis.com/css?family=Montserrat:100,200,300,400,500,600,700,800,900&display=swap');

  html, body { width: 100%; height: auto; margin: 0; padding: 0; font-family: 'Montserrat', sans-serif; font-weight:300 ; }
  body { overflow-x:  }
  header { width: 100%; height: 100px; position: fixed; z-index: 25; transition:all 400ms ease; }
  header .rs { position: absolute; top: 32px; right: 52px; }
  .burger { position: absolute; top: 80px; right: 52px; cursor: pointer;  }
  
  section { width: 100%; height: 100vh; position: relative; -webkit-box-shadow: inset 0px 15px 29px 0px rgba(0,0,0,0.4); overflow-x: hidden; 
   -moz-box-shadow: inset 0px 15px 29px 0px rgba(0,0,0,0.4); box-shadow: inset 0px 15px 29px 0px rgba(0,0,0,0.4); }
  footer { width: 100%; height: auto; background: #272727; color: #fff; padding: 100px 0 50px 0; -webkit-box-shadow: inset 0px 15px 29px 0px rgba(0,0,0,0.4);
   -moz-box-shadow: inset 0px 15px 29px 0px rgba(0,0,0,0.4); box-shadow: inset 0px 15px 29px 0px rgba(0,0,0,0.4);  }
  .logo-foo { margin-bottom: 25px; }
  .logo { position: absolute; top: 40px; left: 50px; } 
  footer ul { margin: 15px 0; padding: 0; }
  footer ul li { list-style: none; padding: 0; margin: 3px 0; }
  footer ul li a { color:#fff; font-weight: 200; font-style: normal; font-size: 16px; }
  footer a { color:#fff; font-weight: 600; font-style: italic; font-size: 14px; }
  footer a:hover { color:#dddc56; font-weight: 600; font-style: italic; font-size: 14px; }
  footer b { font-weight: 600; }
  footer .rs { width: 100%; margin-bottom:70px ; }
  .derechos { font-size: 14px; margin: 15px 0; }
  .container { position: relative; z-index: 10; }
  .numero { position: absolute; z-index: 5; }
  li { list-style: none; position: relative; }
  p { transition:all 400ms ease; }

  

  #cuatronoventaiseis { color: #8b8f90; background: url(img/index.jpg) no-repeat center right; background-size: cover; padding-top: 275px; font-weight: 800; font-size: 24px; line-height: 28px; }
  #cuatronoventaiseis .col-sm-4 { padding-left: 60px; }

  .header-alt { height: 120px;   background-color: rgba(0,0,0, 0.5);  position: fixed;  top: 200;  width: 100%;  transition: all 0.5s; }

  #garantias { background: #dbde42; color: #272727; }
  #garantias h3 { font-weight: 300; color: #272727; padding-top: 50%; font-size: 60px; }
  #garantias p { font-weight: 600; color: #fff; font-size: 22px; margin-bottom: 0; }
  #garantias p.uno { font-weight: 600; color: #fff; font-size: 22px; padding-left: 20px; }
  #garantias p.dos { font-weight: 600; color: #fff; font-size: 22px; padding-left: 35px; }
  #garantias p.tres { font-weight: 600; color: #fff; font-size: 22px; padding-left: 50px; }
  #garantias ul {  margin-top: 150px; font-size: 16px; color: #272727;  }
  #garantias ul li { margin-bottom: 5px; }
  #garantias span {  padding-top: 60%; font-size: 16px; color: #fff; /*margin-left: -19px;*/ position: relative;  }
  #garantias .col-sm-7 { padding-left: 150px; }
  .venti { color: #272727; border: #272727 solid 2px; padding: 8px; font-weight: 400; margin:30px 0 0 40px;  font-size: 16px; max-width: 320px; position: relative; }
  .venti img { position: absolute; top: 10px; left: -175px; }

  #servicios { background: url(img/servicios.jpg) no-repeat; background-size: cover;  }
  #servicios h3 { font-weight: 800; color: #979797; padding-top: 60%; font-size: 38px; margin-bottom: 75px; }
  #servicios h3 > span { padding-left: 40px; font-weight: 800; color: #979797; padding-top: 60%; font-size: 38px; }
  #servicios ul {  padding-top: 60%; font-size: 16px; color: #fff;  }
  #servicios ul li { margin-bottom: 5px; font-size: 16px; }
  #servicios span {  padding-top: 60%; font-size: 16px; color: #dddc56; /*margin-left: -19px;*/ position: relative;  }

  .cv { color: #dddc56; border: #fff solid 2px; padding: 8px; font-weight: 400;   }

  #value { background: url(img/value.jpg) no-repeat; background-size: cover; color: #272727; }
  #value h3 { font-weight: 300; color: #dddc56; padding-top: 60%; font-size: 60px; }
  #value h4 { font-weight: 600; color: #7f7e7e; padding-top: 150px; padding-left: 45px; font-size: 28px; line-height: 40px; margin-bottom: 40px; }
  #value ul {  padding-top: 0px; font-size: 16px; color: #fff;  }
  #value ul li { margin-bottom: 5px; font-size: 16px; }
  #value span {  padding-top: 60%; font-size: 16px; color: #dddc56; /*margin-left: -19px;*/ position: relative;  }

  #value h5 { font-weight: 700; color: #dddc56; padding-top: 20%; font-size: 42px; }
  #value p { font-weight: 200; color: #fff; padding-top: 50px; font-size: 18px; }
  #value a { color: #fff; }
  #value a:hover { color: #dddc56; text-decoration: none; }

  #contacto { background: url(img/contacto.jpg) no-repeat; background-size: cover; padding: 12% 0 3% 0;  }
  #contacto h3 { color: #dddc56; font-weight: 600; font-size: 24px; line-height: 27px; margin-bottom: 25px; }
  input { width: 100%; height: 35px; line-height: 35px; color: #fff; border: #dddc56 solid 2px; margin-bottom: 15px; background: none; padding: 5px;  }
  textarea { width: 100%; height: 135px; line-height: 36px; color: #fff; border: #dddc56 solid 2px; margin-bottom: 15px; background: none; padding: 5px;  }
  ::-webkit-input-placeholder { color: #fff; } /* Chrome/Opera/Safari */ 
  ::-moz-placeholder          { color: #fff; } /* Firefox 19+ */ 
  :-ms-input-placeholder      { color: #fff; } /* IE 10+ */
  :-moz-placeholder           { color: #fff; } /* Firefox 18- */
   input[type="submit"] { width: 50%; padding: 0; }
   .desk { display: inline; }
   .resp { display: none; }

   /* NUMEROS */
   .cuatro { position: absolute; z-index: 2; top: 0; left: 0%; height: 100%; }
   .nueve { position: absolute; z-index: 2; top: 0; left: 0%; height: 100%; }
   .seis { position: absolute; z-index: 2; top: 0; left: 6%; height: 100%; display: inline; }
    .seis_ { position: absolute; z-index: 2; top: 0; left: 6%; height: 100%; display: none; }

	.carousel { }
	.carousel-cell {  width: 100%;  height: 100vh;  margin-right: 10px; padding-top: 190px; }
	.carousel-cell h4 { font-size: 28px; font-weight: 800 !important; color:#dddc56; }
	.carousel-cell li { font-size: 20px; font-weight: 300px; color: #dddc56; }
	.carousel-cell li > span { font-size: 20px; font-weight: 300; color: #979797 !important; }

	.carousel-cell li.sub { margin-left: 25px; }
	.carousel-cell li.sub > span { font-size: 20px; font-weight: 600; color: #979797 !important; }

	.flickity-page-dots { top: 100px; height: 10px;  }
	.flickity-page-dots .dot {
	    display: inline-block;
	    width: 10px;
	    height: 10px;
	    margin: 0 8px;
	    background: #fff;
	    border-radius: 50%;
	    opacity: 0.25;
	    cursor: pointer;
	}

	ul.menu { width: 300px; height: 100%; position: fixed; top:-50px; right: -300px; padding-top: 150px; background: #dddc56;  font-weight: 600;  margin-top: 50px;  transition:all 400ms ease; }
	ul.menu li { display: inline-block; margin: 0 10px; width: 200px; height: 85px; line-height: 85px; border-bottom: #000 solid 2px; }
	ul.menu li a { color: #000; transition:all 400ms ease; font-size: 24px; font-weight: 600;  }
	ul.menu li a:hover { color: #fff; text-decoration: none; }

  ul.menu > .burger { color: #000; position: absolute; }

  .main {
  margin-right: 300px !important;
  color: red;
  transition:all 400ms ease;
}

  #clientes { background: #d9df50; text-align:center; height:auto !important; color:#272727; padding:75px 0;  }
  #clientes img  { display:inline-block; vertical-align:top; margin:10px; width:25% !important;  position:relative; }
  #clientes h2  { font-weight: 300; color: #272727; padding-top: 50%; font-size: 60px; }


.shadow {
  position: relative;
  border-radius: 5px;
  background: #fff;
  text-align: center;
  box-shadow: 0 0 25px 0 rgba(50,50,50,.3) inset;
}

.shadow:after {
  content: "";
  position: relative;
}

.curved:after {
  position: relative;
  z-index: -2;
}

.curved:after {
  position: absolute;
  top: 50%;
  left: 12px;
  right: 12px;
  bottom: 0;
  box-shadow: 0 0px 10px 7px rgba(100,100,100,0.5);
  border-radius: 450px / 15px
}


/* MEDIA QUERIES */

@media only screen and (max-width: 1024px) {
	/* NUMEROS */
   .cuatro { position: absolute; z-index: 2; top: 0; left: -200px; height: 100%; }
   .nueve { position: absolute; z-index: 2; top: 0; left: -100px; height: 100%; }
   .seis { position: absolute; z-index: 2; top: 0; left: -30px; height: 100%; }
   .seis_ { position: absolute; z-index: 2; top: 0; left: -30px; height: 100%; display: none }
   #cuatronoventaiseis p  { font-size: 22px;  }
 
	}


@media only screen and (max-width: 960px) {

	

    section { width: 100%; height: auto !important; padding: 10% 0; overflow-x: hidden;  position: relative; -webkit-box-shadow: inset 0px 15px 29px 0px rgba(0,0,0,0.4);  -moz-box-shadow: inset 0px 15px 29px 0px rgba(0,0,0,0.4); box-shadow: inset 0px 15px 29px 0px rgba(0,0,0,0.4); }
    #cuatronoventaiseis { color: #8b8f90; background: url(img/index.jpg) no-repeat center; background-size: cover; padding-top: 175px; font-weight: 800; font-size: 24px; line-height: 28px; }
    #cuatronoventaiseis .col-sm-4 { padding-left: 0%; }
    #cuatronoventaiseis p  { font-size: 20px;  }
     
      #garantias { background: #dbde42; color: #272727; }
	  #garantias h3 { font-weight: 300; color: #272727; padding-top: 50%; font-size: 60px; }
	  #garantias p { font-weight: 600; color: #fff; font-size: 18px; margin-bottom: 0; }
      #garantias p.uno { font-weight: 600; color: #fff; font-size: 18px; padding-left: 0px; }
      #garantias p.dos { font-weight: 600; color: #fff; font-size: 18px; padding-left: 0px; }
      #garantias p.tres { font-weight: 600; color: #fff; font-size: 18px; padding-left: 0px; }
      
      #garantias ul {  margin-top: 150px; font-size: 15px; color: #272727; margin-left: -150px;  }
	  #garantias ul li { margin-bottom: 5px; }
	  #garantias span {  padding-top: 60%; font-size: 16px; color: #fff; /*margin-left: -19px;*/ position: relative;  }
	 


		/* NUMEROS */
	   .cuatro { position: absolute; z-index: 2; top: 0; left: -200px; height: 100%; }
	   .nueve { position: absolute; z-index: 2; top: 0; left: -100px; height: 100%; }
	   .seis { position: absolute; z-index: 2; top: 0; left: -30px; height: 100%; display: none; }
     .seis_ { position: absolute; z-index: 2; top: 0; left: -30px; height: 100%; display: inline; }

}

@media only screen and (max-width: 580px) {
    
   img.logo { width: 150px ; left: 5%; } 

    #cuatronoventaiseis { color: #8b8f90; background: url(img/index.jpg) no-repeat center; background-size: cover; padding-top: 175px; font-weight: 800; font-size: 24px; line-height: 28px; }
    #cuatronoventaiseis .col-sm-4 { padding-left: 5%; }

    #garantias h3 {  }
    #garantias .col-sm-7 { margin-top: 70px !important; }

        #garantias h3 { font-weight: 300; color: #272727; padding-top: 50%; font-size: 60px; margin-top: -110px !important; margin-bottom: -7px; margin-left: 25px; }
    #garantias p { font-weight: 600; color: #fff; font-size: 18px; margin-bottom: 0; padding-left: 25px;  }
     #garantias p.uno { font-weight: 600; color: #fff; font-size: 18px; padding-left: 25px; }
      #garantias p.dos { font-weight: 600; color: #fff; font-size: 18px; padding-left: 25px; }
      #garantias p.tres { font-weight: 600; color: #fff; font-size: 18px; padding-left: 25px; }

    #value h3 { margin-top: -90px !important; }

	  /* NUMEROS */
   .cuatro { position: absolute; z-index: 2; top: -50px; left: 0%; height: auto; width: 100%; }
   .nueve { position: absolute; z-index: 2; top: 0px; left: 0%; height: auto; width: 100%; }
   .seis { position: absolute; z-index: 2; top: 0px; left: 0%; height: auto; width: 100%; display: none;  }
   .seis_ { position: absolute; z-index: 2; top: 0px; left: 0%; height: auto; width: 100%; display: inline; }
    input[type="submit"] { width: 90%; padding: 0; }
}