@font-face {
  font-family: 'PPNikkeiJournal-Regular';
  src: url(../fonts/PPNikkeiJournal-Regular.woff2) format('woff2'),
       url(../fonts/PPNikkeiJournal-Regular.svg#PPNikkeiJournal-Regular) format('svg');
}

@font-face {
  font-family: 'PPNikkeiMaru-Light';
  src: url(../fonts/PPNikkeiMaru-Light.eot);
  src: url(../fonts/PPNikkeiMaru-Light.eot?#iefix) format('embedded-opentype'),
       url(../fonts/PPNikkeiMaru-Light.otf) format('otf'),
       url(../fonts/PPNikkeiMaru-Light.svg#PPNikkeiMaru-Light) format('svg'),
       url(../fonts/PPNikkeiMaru-Light.ttf) format('truetype'),
       url(../fonts/PPNikkeiMaru-Light.woff) format('woff'),
       url(../fonts/PPNikkeiMaru-Light.woff2) format('woff2');
}

body {
  font-family: 'PPNikkeiMaru-Light';
  background-color: #F0CCE2;
  color: #CB1429;
  display: flex;
  flex-direction:column;
  min-height: 100vh;
}

h2{
  font-weight: bold;
}

.nav-link{
  color: #CB1429;
  padding-right: 30px;
  padding-top: 20px;
}

.nav-link:hover{
  color: #CB1429;
}


.link_constactado{
  color: #CB1429;

}


.borde-formulario{
  border-radius: 0;
  background-color: #F0CCE2;
  border: #CB1429 solid 1px;
  color: #CB1429;
  
}

input::placeholder, textarea::placeholder{
  color: #CB1429 !important;
}



.bi-envelope::before{
      content: "\f0e0";    
}



.slider{

  overflow: hidden;
 // background-color: #CB1429;
  width: 100%;
}
.slider ul{
    display: flex;
    animation: cambio 15s infinite alternate ease-in-out;
    width: 400%;
    padding: 0;
    margin: 0;
    
}
.slider li{
    width: 100%;
    list-style: none;
    margin: 0px;
}
.slider img{
    width: 100%;
    height: 100%;
}

footer { 
 margin-top: auto;
}

//@keyframes cambio {
  //0% {margin-left: 0;}
  //30% {margin-left: 0;}
  //
  //33% {margin-left: -100%;}
  //60% {margin-left: -100%;}
  
  //66% {margin-left: -200%;}
  //100% {margin-left: -200%;}
//}


@keyframes cambio {
  0% {margin-left: 0;}
  20% {margin-left: 0;}
  
  25% {margin-left: -100%;}
  45% {margin-left: -100%;}
  
  50% {margin-left: -200%;}
  70% {margin-left: -200%;}

  75% {margin-left: -300%;}
  100% {margin-left: -300%;}
}


@media only screen and (min-width:320px) and (max-width:768px){

.slider li{
    margin: 12px 0 0;
}



@media (max-width: 576px) { 

  #logo{
    width: 300px;
    padding: 40px 0;
  }