/**
* Custom Post Type Display Layout
*
* @since 1.0.0
**/

/** Post Title **/
header.entry-header {
  display: none;
}

/** Yelp Content **/
.business-matchups-content {
  width: 100%;
  max-width: 1440px;
}

#business-matchups-title,
#business-matchups-content,
#strawpolls-content {
  margin-bottom: 40px;
}

.card {
  background-color: dodgerblue;
  border-radius: 15px;
  color: white;
  display: flex;
  flex-direction: column;
  margin-bottom: 1.5rem;
  padding: 1.5rem;
}

.card img.yelp-image {
  height: auto;
  padding-bottom: 1.5rem;
  width: 100%;
}

.card a {
  text-decoration: none;
}

/*span {
  padding-left: 20px;
}*/

.yelp-ratings span {
  color: black;
  display: block;
  font-size: 0.8em;
  padding-left: 0;
  padding-right: 0;
}

.yelp-biz-info {
  margin: 20px 0;
}

img.yelp-logo {
  align-self: end;
  width: 72px;
}

p.yelp-phone a,
p.yelp-location a {
  color: #fff;
}

/** Strawpoll Content **/
iframe.strawpolls-content {
  width: 100%;
  height: 100%;
  padding-top: 20px;
  min-height: 640px;
}

/** Basic responsive layout for all browsers **/
#business-matchups {
  max-width: 600px;
  margin: 0 auto;
  padding-left: 30px;
  padding-right: 30px;
}

/** CSS Grid layout for modern browsers **/
@supports (grid-area: auto) {
  @media screen and (min-width: 600px) {
    #business-matchups {
      max-width: 1200px;
      display: grid;
      grid-template-columns: 1fr;
      justify-content: center;
    }

    #business-matchups-title {
      grid-row: 1;
      grid-column: 1 / 3;
    }

    #business-matchups-content {
      grid-row: 2;
      grid-column: 1 / 3;
    }

    #strawpolls-content {
      grid-row: 3;
      grid-column: 1 / 3;
    }

    .cards {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      column-gap: 20px;
      row-gap: 20px;
    }

    .card {
      margin-bottom: 0;
    }

    iframe.strawpolls-content {
      width: 100%;
      height: 100%;
      padding-top: 20px;
      min-height: 840px;
    }
  }

  @media screen and (min-width: 900px) {
    #business-matchups {
      grid-template-columns: 1fr;
    }

    #business-matchups-title {
      grid-column: 1 / 4;
    }

    #business-matchups-content {
      grid-column: 1 / 4;
    }

    #strawpolls-content {
      grid-column: 1 / 4;
    }

    .cards {
      grid-template-columns: repeat(3, 1fr);
    }

    iframe.strawpolls-content {
      width: 100%;
      height: 100%;
      padding-top: 20px;
      min-height: 810px;
    }
  }
}
