body {
    margin: 0;
    padding: 0;
    font-family: 'Poppins';
    box-sizing: border-box;
}


.banner h1 {
    color: #f1f1f1;
}

.container {
    width: 100%;
    height: 60px;
    background: #76f5b5;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 5rem;
    box-sizing: border-box;
    position: sticky;
    top: 0px;
}

.logo {
    width: 40px;
    margin: 0;
}

.logo img {
    width: 100%;
}

.item-options {
    color: black;
    margin: 0 1.5rem;
    text-decoration: none;
}

.main-container {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.article {
    width: 70%;
}

.panel {
  position: relative;
  display: block;
  width: 200px;
  height: 40px;
  line-height: 1.5;
}

.panel select {
  outline: none;
  box-shadow: none;
  border: none;
  background-color: #3c8dc5;
  width: 100%;
  height: 100%;
  margin: 0;
  padding:  0 0 0 14px;
  color: #fff;
  font-size: 16px;
  cursor: pointer;
}

.panel option {
  background-color: #7a8186;
  font-size: 14px;
}

.panel option:checked {
  background-color: #103550;
  color: #fff;
}

.panel:after {
  content: "\25BC";
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  padding: 10px 12px;
  color: #388ac5;
  background-color: #103550;
  pointer-events: none;
  transition: .25s all ease;
}

.panel:hover::after {
  color: #fff;
}
.carrousel{
    width: 100%;
}

.conteCarrousel{
    width: 100%;
    height: 600px;
    overflow: hidden;
}

.itemCarrousel{
    position: relative;
    width: 100%;
    height: 100%;
}

.itemCarrouselTarjeta{
    width: 100%;
    height: 100%;
}

.itemCarrouselArrows{
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    height: 100%;
    width: 100%; 
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 20px; 
}

.itemCarrouselArrows > i:hover {
    cursor: pointer;
}


.conteCarrouselController{
    width: 100%;
    display: flex;
    justify-content: space-evenly;color: white;

    background: linear-gradient(to right,white ,pink );
}

.itemCarrouselArrows > a > i{
    color: white;
}





