/* University Template over-ride
   Launched: 2020-10-07
   Author: Nevin McElwrath, Shawn Maust, Notre Dame Web Team
   ----------------------------------------------------*/

@media only screen {
  .align-image-center {margin:2rem auto;}
  .site-title a { text-indent: -999em; min-height: 5rem; background: url(/stylesheets/images/logo-irish_studies_keough.svg) left top / contain no-repeat; }
  
  .site-pre-footer { grid-row:pre-footer; padding:1rem var(--gutter-width); background:var(--sky-blue); }
  .site-pre-footer form { margin:0; padding:0; display:flex; align-items:center; justify-content:flex-end; }
  .site-pre-footer input { margin:0 0.5em 0 0.25em; padding: 0.3rem; margin-bottom:0; }
  .site-pre-footer .btn { padding: 0.25em 1.5em; }
  
  .bg-full-bleed { padding-top: 3rem; padding-bottom: 3rem; }
  
  .section { margin-bottom:4rem; }
  .section-body { padding:2rem 0; }
  .section-image img { width:100%; }
  .section--full-image .section-image, 
  .section--offset-image .section-image { margin:2rem var(--gutter-offset) 1em; }
  
  /* Home */
  .section--home-highlights.bg-full-bleed::before { background: var(--sky-blue) url(/stylesheets/images/bg-pattern-quatrefoil-skyblue.svg) 0 0 / 200px auto repeat; }
  .section--home-report {  }
  .spotlight__image { max-width:15em; margin:2rem auto; }
  .spotlight__name { font-family:var(--font-heading-article); font-size:1.5em; margin-bottom:0; }
  .spotlight__title { font-weight:700; }
  
  .section-light .hover-bg:hover,
  .section-light .hover-bg:focus-within { background: white; }
  
  .section-green.bg-full-bleed::before { background: #549f8d url(/stylesheets/images/bg-pattern-quatrefoil-green.svg) 0 0 / 200px auto repeat; }
  .section--home-spotlight.bg-full-bleed::before { background: var(--brand-blue) url(/stylesheets/images/bg-pattern-quatrefoil-brandblue.svg) 0 0 / 200px auto repeat; }
  
  .keough-intro { margin-bottom:2em; }

  /* Students */
  .section--students-graduate.section--full-image .section-body { background: var(--brand-blue) url(/stylesheets/images/bg-pattern-quatrefoil-brandblue.svg) 0 0 / 200px auto repeat; border-bottom: 4px solid #32a28c; }
  
   .section-dark.section--students-graduate { background: transparent; }
   
  /* Audio Player */
  .audio-player { height:2em; width:2em; margin:0 0.5rem 0 0; vertical-align:middle; display:inline-block; }
  .audio-player circle { transition: stroke-dashoffset 0.2s linear; stroke:#ccc; stroke-width:0.2rem; }
  .audio-player .current { transform:rotate(-90deg); transform-origin:50% 50%; stroke: var(--brand-blue); }
  .audio-player .play-icon,
  .audio-player .pause-icon { transition: all 125ms ease; transform: scale(0.8); transform-origin: 50% 50%; }
  .audio-player .play-icon { fill:#777; }
  .audio-player .pause-icon { fill:#777; }
  .album-track { display: flex; flex-flow: row nowrap; justify-content: flex-start; }
  .audio-track { display: flex; flex-flow: row nowrap; transition: all 125ms ease; line-height: 1.2; margin-bottom: 1rem; border:none; background:none; align-items: center; }
  .audio-player-controls { min-width: 2rem; }
  .audio-track .track-info { text-align: left; padding: 0 0.5rem; width: 100%; }
  .audio-track .duration { font-size: 0.8rem; color: #777; font-style: italic; }
  .album-track .restart { padding: 0.2rem 0.6rem; font-size: 0.7rem; background: #999; color: white; border:none; border-radius: 1rem; margin-left: 1rem; align-self: center; }
    .album-track .restart:hover { cursor: pointer; background: var(--brand-blue); }
  .audio-track.has-player { cursor:pointer; }
  .audio-track:hover { background:#f2f2f2; }
  .audio-track:hover .play-icon,
  .audio-track:hover .pause-icon { fill: var(--brand-gold); }
  
  .link-bar { background: var(--sky-blue); border-radius: 0.5rem; }
    .link-bar p { display: flex; flex-flow: row wrap; justify-content: space-around; margin: 3rem 0; padding: 1rem;  max-width: unset; }
    .link-bar .btn { align-self: center; }
    .link-bar .btn:hover { background: white; }
}


/* 480px
----------------------------------------------------*/
@media only screen and (min-width:30em) {

}

/* 768px
----------------------------------------------------*/
@media only screen and (min-width:48em) {
  .wrapper { grid-template-rows: [header-start] auto [header-end main-start] minmax(auto, 1fr) [main-end pre-footer-start] auto [pre-footer-end footer-start] auto [footer-end];}
  
  .page-image.full img { -o-object-position: 50% 50%; object-position: 50% 50%; }
  
  .section--home-spotlight { display:grid; align-items:center; 
    grid-template-rows:[title-start image-start] auto [title-end body-start] auto [image-end body-end]; 
    grid-template-columns:[image-start] 1fr [image-end body-start title-start] 2fr [title-end body-end]; 
  } 
  .section--home-spotlight .section-title { grid-area:title; }
  .spotlight__image { grid-area:image; max-width:20rem; }
  .spotlight__body { grid-area:body; }
  
  .home .page-main { padding-bottom: 0; }
  .home .page-main .section:last-child { margin-bottom: 0; }
}

/* 960px
----------------------------------------------------*/
@media only screen and (min-width:60em) {
  .site-title a { height: 110px; }
  .page-primary { min-height:var(--sidebar-height); }
  
  .spotlight__name { font-size:2em; }
  
  .section--offset-image { align-items:center; display:grid; grid-gap:1rem; 
    grid-template-rows:[image-start] 1rem [body-start] auto [body-end] 1rem [image-end];
    grid-template-columns:[image-start] 1fr [image-end body-start] 1fr [body-end]; 
  } 
    .section--offset-image .section-image { grid-area:image; margin:0; margin-left:var(--gutter-offset); }
    .section--offset-image .section-body { grid-area:body; padding:2rem; }
    
  .section--offset-image.alt { grid-template-columns:[body-start] 1fr [body-end image-start] 1fr [image-end];  } 
    .section--offset-image.alt .section-image { margin-left:0; margin-right:var(--gutter-offset); }
    
  .section--full-image { display:grid; grid-gap:1rem;
    grid-template-rows: [image-start] 1rem [body-start] auto [body-end] 1rem [image-end];
    grid-template-columns: [image-start body-start] minmax(auto,30rem) [body-end] 1fr [image-end]; 
  } 
    .section--full-image .section-image { grid-area:image; margin:0 var(--gutter-offset); }
      .section--full-image .section-image img { min-width:100%; width:auto; }
    .section--full-image .section-body { grid-area:body; background:#fff; padding:2rem; align-self:center; }
  
  .section--home-primary { margin:-6rem auto 4rem; background: #fff url(/stylesheets/images/rule-h-4c.svg) left top / 100% 5px no-repeat; padding:3rem 3rem 1rem; }
  
}

/* 1280px
----------------------------------------------------*/
@media only screen and (min-width:80em) {

}

/* 1600px
----------------------------------------------------*/
@media only screen and (min-width:100em) {

}

/* 1920px
----------------------------------------------------*/
@media only screen and (min-width:120em) {
    .section--offset-image .section-image { margin-left:-6rem; }
    .section--offset-image.alt .section-image { margin-left:0; margin-right:-6rem; }
}

/* Print
----------------------------------------------------*/
@media print {
  .site-pre-footer {display:none;}
}