/* index styles for teaching.vcu.edu */ 

figcaption.plugin-hero__caption {
 width: 100%; 
}

div.tagline {
  --bg: #222;
  margin: 0 auto;
 width: 100%; 
  background: var(--bg);
    border-image: conic-gradient(var(--bg) 0 0) fill 0 / 0 / 0 100vw;
      padding: 1em;
      margin-block-start: -1rem;
      text-align: center;
}

.tagline h2 {color: var(--vcu-white);}


/* index resource nav buttons */ 

div.index-buttons {
  --bg: #D6D6D6;
  margin: 0 auto !important; 
  padding: 1.5rem;
  text-align: center;
  width: 100%; 
  max-width: 1400;
  background-color: var(--bg);
  background-image: url(/media/provost/assets/cta-strip--background2x.avif);
  background-size: cover;
  border-image: conic-gradient(var(--bg) 0 0) fill 0 / 0 / 0 100vw;
}

.index-buttons ul { 
  display: flex; 
  align-items: center;
 flex-direction: row; 
 column-gap: 1.5rem; 
  justify-content: center;
  list-style-type: none; 
  margin: 0; 
  padding: 0; 
}

@media (min-width: 768px) {
.index-buttons ul{
  min-width: 10rem; }
}

@media (max-width: 768px){
  .index-buttons ul {
    flex-direction: column;
  }
  .index-buttons li {width: 100%;}
  .index-buttons li a {margin: .25rem 0; width: 100%;}
}

.index-buttons li a {
  background-color: var(--vcu-blue);
  border-radius: .5rem;
  color: var(--vcu-white);
  display: inline-block;
  text-align: center;
  text-decoration: none;
    font-size: 1.25rem;
    padding: 1rem 2rem;
}

.index-buttons a:hover { 
  background-color: var(--vcu-white); 
    color: var(--vcu-blue); 
    cursor: pointer; 
      box-shadow: 0 0 15px 0 #999; 
      padding: .75rem 1.75rem;
      border: .25rem solid var(--vcu-gold);
      }