@import "https://cdn.jsdelivr.net/npm/bulma@1.0.2/css/bulma.min.css";
body{
    font-family: 'Patrick Hand', cursive;
    background: url("./img/fondo.jpg") repeat;
    background-size: cover;
}
.navbar{
    background-color: rgba(129, 129, 129, 0.493);
}
.card{
    border: 3px dotted green;
  box-shadow: 4px 4px 0px rgba(0, 0, 0, 0.37);
  background-color: #d1d1c791;
  transform: rotate(-2deg);
}
.title{
    color: rgb(10, 10, 151);
}
.subtitle{
    color: rgb(112, 57, 163);
}
strong{
    color: green;
}
.zine-style {
    border: 3px dotted green;
    box-shadow: 5px 5px 0px rgba(0, 0, 0, 0.6);
    transform: rotate(-1deg);
    background-color: #d1d1c791;
    font-family: 'Patrick Hand', cursive;
    transition: transform 0.2s;
  }
  
  .zine-style:hover {
    transform: rotate(0deg) scale(1.02);
  }
  .content {
    transition: all 0.3s ease;
  }

  .washi{
    position: relative;
  }
  .washi::before{
    content: "";
    position: absolute;
    top: -10px;
    left: 50%;
    width: 70px;
    height: 20px;
    background: repeating-linear-gradient(
      45deg,
      #ebf9d5,
      #e6f9d5 5px,
      #e1eafc 5px,
      #e1e8fc 10px
    );
    transform: rotate(-12deg);
    box-shadow: 1px 1px 2px rgba(0,0,0,0.2);
    z-index: 2;
    pointer-events: none;
  }
.washi2{
    position: relative;
}
.washi2::before {
    content: "";
    position: absolute;
    top: -10px;
    right: 0px;
    width: 70px;
    height: 20px;
    background: repeating-linear-gradient(
      45deg,
      #f9d5ec,
      #f9d5ec 5px,
      #fce1f3 5px,
      #fce1f3 10px
    );
    transform: rotate(15deg);
    box-shadow: 1px 1px 2px rgba(0,0,0,0.2);
    z-index: 2;
    pointer-events: none;
  }

  #byline{
    color: purple;
  }