.tabBook {
  position: relative;
  display: block;
  padding: 10px;
  background: #FFF;
  border-radius: 5px;
  word-break: break-word;
  box-shadow: rgb(0 0 0 / 10%) 0px 4px 12px;
}

table.taBook {
  display: block;
  border-collapse: collapse;
  border-spacing: 0;
}

.taBook caption {
  display: flex;
  align-items: center;
  text-align: left;
  font-size: 24px;
  font-weight: 700;
  margin-bottom: 10px;
}

.taBook caption::before {
  content: '';
  background-image: url(/wp-content/uploads/Bandiera-italia-siti-sportivi.svg);
  background-repeat: no-repeat;
  background-size: 30px;
  min-width: 30px;
  width: 30px;
  height: 26px;
  margin-right: 10px;
}

.tabBook .autore {
  position: absolute;
  top: 10px;
  right: 15px;
}

.tabBook .autore:before {
  content: '';
  display: block;
  position: absolute;
  top: 3px;
  left: -40px;
  background-image: var(--url-iavatar);
  background-size: 35px;
  width: 35px;
  height: 35px;
  border-radius: 50%;
  filter: grayscale(100%);
}

.tabBook .autore .nome {
  display: block;
  font-size: 14px;
}

.tabBook .autore .data {
  display: block;
  font-style: italic;
  font-size: 14px;
}

.tabBook .nome .aut {
  font-weight: 700;
}

.taBook p {
  margin: 0;
}

.taBook thead {
  display: block;
}

.taBook thead tr {
  display: block;
  padding: 0 10px;
  border-radius: 5px;
  background: #102A43;
}

.taBook th {
  padding: 10px 0;
  font-size: 14px;
  text-align: center;
  line-height: 1;
  font-weight: 700;
  color: #FFF;
  width: 14%;
}

.taBook tbody {
  display: block;
}

.taBook tbody tr {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  padding: 10px;
  border-radius: 5px;
  background: #D9E2EC;
  margin-top: 10px;
  counter-increment: nums;
}

.taBook tbody td {
  display: flex;
  flex-direction: column;
  justify-content: center;
  width: 14%;
  align-self: stretch;
  text-align: center;
}

.taBook tbody td.logo a {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 10px;
  height: 100%;
  border-radius: var(--hsbg-border-radius);
}

.taBook .valutazione b {
  font-size: 22px;
  font-weight: 700;
  color: #102A43;
}

.taBook .valutazione .allStars {
  display: block;
  color: #f9b22b;
}

.taBook .payout p {
  font-size: 22px;
  font-weight: 700;
}

.taBook .ptForza p {
  font-size: 12px;
  margin-top: 5px;
}

.ptForza img {
  max-width: 20px;
  margin: auto;
}

.bsd svg {
  display: block;
  width: 24px;
  height: auto;
  margin: auto;
}

.taBook .bonusBenvenuto .bb {
  display: block;
  font-size: 26px;
  font-weight: 700;
  color: #066545;
}

.taBook .linkAffiliato a.ctaPri {
  display: flex;
  justify-content: center;
  align-items: center;
  text-decoration: none;
  background: #F0B429;
  color: #102A43;
  border-bottom: 2px solid #DE911D;
  text-align: center;
  padding: 10px;
  border-radius: 5px;
  box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 12px;
}

.taBook .linkAffiliato a.ctaSec {
  display: flex;
  justify-content: center;
  align-items: center;
  text-decoration: none;
  font-size: 14px;
  background: #486581;
  color: #FFF;
  text-align: center;
  padding: 5px 10px;
  border-radius: 5px;
  margin-top: 5px;
}

.tabBook button#load_more_posts {
  display: block;
  width: 100%;
  max-width: 400px;
  background: #102A43;
  font-size: inherit;
  font-weight: 700;
  color: #FFF;
  border: 0;
  border-bottom: 2px solid #000;
  text-align: center;
  padding: 15px 30px;
  border-radius: 5px;
  box-shadow: rgb(0 0 0 / 10%) 0px 4px 12px;
  margin: 10px auto 0;
  cursor: pointer;
}

.tabBook button#load_more_posts.end-page {
  display: none;
}

@media(max-width:1023px) {
  .tabBook .autore {
    display: none;
  }

  .taBook caption {
    font-size: 20px;
    justify-content: center;
  }

  .taBook thead {
    display: none;
  }

  .taBook tbody td:not(:last-child) {
    flex: 0 0 33.3%;
    min-height: 85px;
  }

  .taBook tbody td:last-child {
    width: 100%;
    margin-top: 5px;
  }

  .taBook .valutazione::before {
    content: 'Valutazione';
    display: block;
    font-size: 12px;
  }

  .taBook .payout .cella::before {
    content: 'Payout';
    display: block;
    font-size: 12px;
  }

  .taBook .ptForza,
  .taBook .bsd,
  .taBook .bonusBenvenuto {
    display: flex;
    justify-content: center;
    align-items: center;
  }

  .taBook .bsd .cella::after {
    content: 'Bonus senza deposito';
    display: block;
    font-size: 12px;
  }
}

@media(min-width:1024px) {
  .taBook caption {
    width: calc(100% - 250px);
  }
}

@media(min-width:768px) and (max-width:1023px) {
  .taBook tbody {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 15px;
  }

  .taBook tbody tr {
    margin-top: 0;
  }
}

@media(max-width:767px) {
  .tabBook {
    box-shadow: none;
    background: transparent;
    padding: 0;
  }

  .taBook tbody tr {
    background: #FFF;
    box-shadow: rgb(0 0 0 / 10%) 0px 4px 12px;
  }

  .taBook tbody tr:not(:last-child) {
    margin-top: 10px;
  }

  .taBook .logo,
  .taBook .bonusBenvenuto {
    flex: 0 0 49% !important;
  }

  .taBook .logo {
    margin-bottom: 5px;
  }

  .taBook .valutazione {
    display: none;
  }

  .taBook .valutazione::before {
    display: none;
  }

  .taBook .valutazione .stelle {
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .taBook .numStelle {
    display: flex;
    align-items: baseline;
    font-size: 14px;
    line-height: 1;
    margin-right: 5px;
    color: #627D98;
  }

  .taBook .valutazione b {
    font-size: 16px;
  }

  .taBook .valutazione .allStars {
    font-size: 14px;
  }

  .taBook .bonusBenvenuto {
    border: 3px solid #D9E2EC;
    border-radius: 5px;
    margin-bottom: 5px;
  }

  .taBook .payout {
    order: 3;
    display: flex;
    flex: 0 0 30%;
    align-items: center;
    justify-content: center;
  }

  .taBook .ptForza {
    order: 4;
    flex: 0 0 30%;
  }

  .taBook .bsd {
    order: 5;
    flex: 0 0 30%;
  }

  .taBook .linkAffiliato {
    order: 6;
  }
}