/*Normalizar el documento*/
* {
  margin: 0; 
  padding: 0; 
  box-sizing: border-box;
  }

::-webkit-scrollbar{
  width: 10px;
  background-color: #FFFFFF;
}

::-webkit-scrollbar-track{
  -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
  border-radius: 12px;
  background-color: #F1F1F1;
}
::-webkit-scrollbar-thumb{
  border-radius: 12px; 
  -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);
  background-color: #167268;
}
/*==========================================*/

body {
  background: #ddd;
}

.logo{
  width: 20%;
  height: 30%;
  margin: 0%;
  padding: 0%;
  opacity: .5;
}
.container{
  margin-top: 0%;
  float: left;
  width: 100vw;
  margin-left:10%;
}
.menu{
  margin-left:0%; 
  margin-right:0%;
  padding-right:0% 
}
.info{
  width: 100%;
  height: 475px;
  border-bottom-left-radius: 2.5%;
  border-top-right-radius: 2.5%;
  border-bottom-right-radius: 2.5%;
  background-color: white;  
}
.info h2{
  font-family: 'Open Sans',serif
}

[data-component='sidebar'] {
  margin-right:0%;
  padding:0%; 
  width: 100%;
  cursor: pointer;
  .sidebar {
    font-family: 'Open Sans', sans-serif;
  }

.first-menu {
    background-color: #fff;
    top: 0px;
    overflow: hidden;
    width: 100%;
    }

}

.activo{
  background:rgb(224, 255, 255) ;
  color:black;
  list-style: none;
}

.lista-menu{
    width: 100%
  }

.siguiente{
  width: 45%; 
  border-radius: 80%;
  margin-top: 60%;
  background-image: linear-gradient(to right, rgba(242,236,215,1) 0%, rgba(148,187,233,1) 100%);
}

.siguiente:hover{
  background-image: linear-gradient(to right, rgba(148,187,233,1) 100% ,rgba(242,236,215,1) 0%);
  transform: scale(1.1);
}

.anterior{
  width: 45%; 
  background-image: linear-gradient(to right, rgba(242,236,215,1) 0%, rgba(148,187,233,1) 100%); 
  border-radius: 80%;
  margin-top: 60%;
  margin-left: 15%;
}
 .anterior:hover{
  background-image: linear-gradient(to right, rgba(148,187,233,1) 100% ,rgba(242,236,215,1) 0%);
  transform: scale(1.1);
 }

 @media screen and (max-width: 1000px){
  body{
    overflow-y: visible;
  }

  .menu{
  font-size: 80%;
  }
  
  .siguiente{
    width: 70%
  }

  .anterior{
    width: 70%;
  }
}

.pie{
  width: 80%; 
  height: 20%; 
  opacity: .5;
  margin-left: 15%;
}