@charset "utf-8";

/* ================================
   REINIKE GALLERY MASTER CSS
   (Unified Base System)
   ================================ */

/* Google Font */
@import url('https://fonts.googleapis.com/css?family=Raleway');

/* ================================
   RESET (KEEP - stable foundation)
   ================================ */

html, body, div, span, h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code, del, dfn, em, img, small,
tt, var, b, u, center, dl, dt, dd, ol, ul, li, fieldset, form, label,
table, caption, tbody, tr, th, td, article, aside, details, figure,
figcaption, footer, header, menu, nav, output, section, summary {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
}

article, aside, details, figcaption, figure, footer,
header, hgroup, menu, nav, section {
    display: block;
}

body {
    line-height: 1;
}

/* ================================
   BOX MODEL
   ================================ */

html {
    box-sizing: border-box;
}

*, *:before, *:after {
    box-sizing: inherit;
}

/* ================================
   BASE TYPOGRAPHY (GLOBAL SITE)
   ================================ */

body {
    font-family: 'Raleway', Arial, Helvetica, sans-serif;
    font-size: 16px;
    color: #555;
    height: 100%;
    position: relative;
}

/* Headings */

h1 {
    color: #000;
    font-size: 1.25rem;
    font-weight: 600;
    letter-spacing: 4px;
    line-height: 1.5rem;
}

h2 {
    font-size: 1.5rem;
    font-weight: 600;
    letter-spacing: 2px;
}

h4 {
    font-size: 1.05rem;
    font-style: italic;
    text-align: center;
    font-weight: 600;
    letter-spacing: 2px;
    margin: .5rem 0 1.75rem 0;
}

p {
    font-size: .95rem;
}

/* ================================
   LAYOUT CONTAINER
   ================================ */

#page {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 2rem;
    text-align: center;
    display: flex;
    flex-wrap: wrap;
   }

/* ================================
   BRANDING
   ================================ */

.branding {
    margin-top: 1.5rem;
    margin-left: 2%;
    text-align: left;
}

.branding p {
    display: none;
}

/* ================================
   NAVBAR (BOOTSTRAP OVERRIDES)
   ================================ */

.navbar {
    background-color: transparent !important;
}

.navbar-brand {
    font-weight: 800 !important;
    letter-spacing: .25rem;
    margin-right: 10rem;
    margin-left: 2%;
    margin-bottom: 4px;
}

.nav-link {
    color: #000 !important;
}

.nav-link:hover {
    text-decoration: underline;
}

/* ================================
   FOOTER
   ================================ */

footer {
    text-align: center;
    margin-bottom: 1rem;
    clear: both;
}

footer p {
    padding-top: .25rem;
    margin-bottom: .25rem;
}

footer a {
    color: #000;
    font-weight: bold;
    font-size: 1.05rem;
}

/* ================================
   GALLERY SYSTEM (KEEP FULL)
   ================================ */

#gallery {
    text-align: center;
}

#gallery p {
    margin: 0;
    padding: 0;
    font-size: .75rem;
}

#gallery h4 {
    margin-bottom: 0;
    font-size: .95rem;
}

/* ================================
   IMAGE DISPLAY SYSTEM
   ================================ */

.img-display-full { max-width: 100%; display: block; margin: 2em auto 0; }
.img-display-95   { max-width: 95%; display: block; margin: 1em auto 0; }
.img-display-90   { max-width: 90%; display: block; margin: 1em auto 0; }
.img-display-85   { max-width: 85%; display: block; margin: 1em auto 0; }
.img-display-thirds { max-width: 75%; display: block; margin: 1em auto 0; }
.img-display-half { max-width: 50%; display: block; margin: 1em auto 0; }

/* ================================
   STORY SYSTEM (from rg.css - KEEP)
   ================================ */

.story,
.story-2,
.story-90 {
    text-align: left;
    color: #303030;
    line-height: 1.5em;
    font-style: normal;
}

.story { max-width: 95%; margin: 2em auto 0; }
.story-2 { max-width: 95%; margin-top: 1em; }
.story-90 { max-width: 90%; margin: 2em auto 0; }

/* ================================
   BUTTONS (KEEP)
   ================================ */

.btn-outline-primary {
    float: left;
    font-size: .75rem;
    margin-top: 15px;
    padding: .5rem;
    color: #000;
    border-color: #B4B4B4;
}

.btn-outline-primary:hover {
    color: #fff;
    background-color: #666;
}

/* ================================
   PDF BUTTON
   ================================ */

.pdf-btn {
    padding: 6px 8px;
    font-size: .8rem;
    background: #E9E9E9;
}

/* ================================
   SOCIAL BAR (KEEP)
   ================================ */

#socialbar {
    list-style: none;
    text-align: center;
    padding: 10px;
}

#socialbar li {
    display: inline;
    padding-right: 2px;
}


/* ========================================
   ARTicles STYLING
======================================== */
/*.articles-band {
    font-family: 'Raleway', sans-serif;
    text-align: center;
    letter-spacing: 0.15em;
    padding: 0.25rem 0;
    border-top:3px solid #ccc;
    border-bottom: 3px solid #ccc;
    color: #000;
    background: #9E9E9E;
    font-size: 3rem;
}*/
.articles-band {
    font-family: 'Raleway', sans-serif;
    border-top: 3px solid #ccc;
    border-bottom: 3px solid #ccc;
    color: #000;
    padding: .25rem 0 .35rem 0;
}

.articles-title {
    text-align: center;
    font-size: 3rem;
    letter-spacing: 0.15em;
    line-height: 1;
}

.articles-meta {
    font-family: Georgia, "Times New Roman", Times, serif;
    font-size: .75rem;
    letter-spacing: normal;
    margin-top: .15rem;
    overflow: hidden;
       /* contains the floats */
}
.pub {
font-family: Georgia, "Times New Roman", Times, serif;
}


.pub h1 {
font-size: 2.75rem; /* 44px */
line-height: 1.1;
}
.pub h1.tight {
    font-size: 2rem;
}

.pub h1.large {
    font-size: 3rem;
}

.pub h2 {
font-size: 2rem; /* 32px */
}

.pub h3 {
font-size: 1.5rem;  /* 24px */
}

.pub h4 {
font-size: 1.125rem;
       margin-bottom: 0.3rem;/* 18px */
}

.pub .kicker {
font-size: 
    1.8125rem; 
}
.pub .subhead {
    font-size: 1.25rem;    /* 20px */
    font-weight: bold;
    font-style: italic;
}
.pub .headline {
    font-size: 2.25rem;
   
}

.pub figcaption {
    font-size: 0.85rem;
    color: #777;
    text-align: right;
    margin-top: 0.5rem;
    letter-spacing: 0.02em;
}

.pub p {
font-size: 1rem; /* 16px */
line-height: 1.65;
}
.pub p.dropcap::first-letter {
    float: left;
    font-size: 3.5rem;
    line-height: 0.5;
    padding-right: 0.01em;
    padding-top: 0.05em;
    font-weight: normal;
    color: #0A0067
}
.pub .lead {
    font-size: 1.11rem;
}

.pub .small {
    font-size: 0.95rem;
}

.pub .caption {
    font-size: 0.85rem;
    color: #777;
}
.pub aside {margin-left: 1.75rem;
}
figure {
    margin-bottom: .25rem;
}

figcaption {
    margin-top: .02rem;
    font-size: .875rem;
    line-height: 1.4;
    color: #666;
}

figcaption em {
    font-style: italic;
    font-weight: bold;
}
/* ================================
   HERO SYSTEM (FROM artist-intro.css)
   ================================ */

.hero {
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    position: relative;
    height: 400px;
    margin-bottom: 2em;
    padding: 1em;
    font-weight: bold;
}

/* ================================
   PULL QUOTE (FROM artist-intro.css)
   ================================ */

.pull-quote {
    padding: 150px 20px 0 20px;
}

/* ================================
   UTILITIES
   ================================ */

.current {
    color: red;
}

/* ================================
   MEDIA QUERIES (MERGED)
   ================================ */

@media (max-width: 768px) {
    .pull-quote {
        padding: 10px 20px;
    }
}

@media (max-width: 625px) {
    #page {
        padding: 0 .5rem;
    }

    .branding img {
        width: 50%;
    }

    .hero {
        height: 200px;
    }
}

@media (max-width: 425px) {
    .navbar-brand {
        display: none;
    }
}
@media (max-width: 576px) {
  .articles-title {
    font-size: 2rem;
    margin-bottom: auto;
  }
  .subhead {
    font-size: 1.2rem;
  }
}