@charset "utf-8";
/* CSS Document */


/* ===========================================================
   SLIDE PAGE CSS
   Page-specific styles for artwork detail/slide pages

   Loads AFTER rg-master.css
   Based on Bootstrap 4.0.0 because of dependency by Magnifier

   Contains:
   - slide navigation
   - artwork display
   - painting descriptions
   - slide-only spacing/layout helpers
   =========================================================== */


/* ===========================================================
   GENERAL PAGE SETTINGS
   =========================================================== */

.container-fluid {
    max-width: 1200px;
}


/* ===========================================================
   SHARED TITLE STYLES
   Used on retired artists, artists, index pages
   Not currently used on slide pages
   =========================================================== */

.title {
    font-style: italic;
    font-weight: bold;
}

.title-2 {
    font-style: italic;
    font-weight: normal;
}


/* ===========================================================
   SLIDE PAGE NAVIGATION
   =========================================================== */

.slide-nav ul,
.bottom-slide-nav ul {
    text-align: center;
    white-space: nowrap;
}

.slide-nav li,
.bottom-slide-nav li {
    display: inline-block;
    padding: .1rem 1rem .2rem;
    font-size: 1.2rem;
}

.slide-nav a,
.bottom-slide-nav a {
    background-color: transparent;
    padding: 1px 2rem;
    color: #303030;
    font-size: .85rem;
}

.slide-nav a:hover,
.bottom-slide-nav a:hover {
    background-color: #021F3D;
    color: #fff;
}

.bottom-slide-nav {
    background-color: #FAFAFA;
}

.disabled a {
    color: lightgrey;
    background-color: #efefef;
}

.disabled a:hover {
    color: lightgrey;
    background-color: #efefef;
    cursor: default;
}

li.counter {
    font-size: .9rem;
}
.btn-primary {
    background-color: lightslategray;
    padding: .25rem;
    float: right;
    margin-bottom: 1rem;
}

/* ===========================================================
   ARTWORK TITLE AND DESCRIPTION AREA
   =========================================================== */
/* Artwork specifications block including title artist price */
.art-specs {
    text-align: center;
    margin-top: .02rem;
    font-size: .875rem;
    line-height: 1.4;
    color: #666;
}

.art-specs p {
    margin: 0;
    padding: 0;
    font-size: .9rem;
    line-height: 1.5em;
}

.art-specs h1 {
    font-size: 1rem;
    font-weight: bold;
    font-style: italic;
    letter-spacing: 2px;
    color: #303030;
}

.art-specs h2 {
    font-weight: bold;
    font-style: italic;
    margin-top: 10px;
    font-size: .9rem;
}

/*.img-description {
    text-align: center;
}

.img-description p {
    margin: 0;
    padding: 0;
    font-size: .9rem;
    line-height: 1.5em;
}

.img-description h1 {
    font-size: 1rem;
    font-weight: bold;
    font-style: italic;
    letter-spacing: 2px;
    color: #303030;
}

.img-description h2 {
    font-weight: bold;
    font-style: italic;
    margin-top: 10px;
    font-size: .9rem;
}*/



/* ===========================================================
   SLIDE PAGE IMAGE HANDLING
   =========================================================== */

.top-figure {
    margin-top: 1.25rem;
    margin-bottom: 1rem;
}

.space-5-3 {
    margin-top: 5rem;
    margin-bottom: 3rem;
}

.spacer {
    height: 20px;
}

.secondary-figure {
    margin-top: 2em;
}

.long-horizontal-img {
    margin: 4em auto;
}

.plain-holder img {
    display: inline-block;
    max-height: 87vh;
}

.holder-fluid {
    padding-right: 0;
    padding-left: 0;
    text-align: center;
}

.holder img {
    display: inline-block;
    padding-right: 0;
    padding-left: 0;
    max-height: 85vh;
    box-shadow: 7px 7px 20px rgba(0,0,0,.5);
}

.detail-img-medium {
    max-width: 75%;
    margin: 1rem auto;
    display: block;
}


/* ===========================================================
   SECONDARY IMAGE DESCRIPTION
   =========================================================== */

.img-description-2 {
    text-align: center;
}

.img-description-2 p {
    margin: 0;
    padding: 0;
    font-size: .9rem;
    line-height: 1.5em;
}

.img-description-2 h1 {
    font-weight: bold;
    font-style: italic;
    margin-top: 50px;
}

.img-description-2 h2 {
    font-weight: bold;
    font-style: italic;
    margin-top: 10px;
    font-size: .9rem;
}

p.artist-name {
    color: #000;
    font-weight: 500;
    margin: .5rem 0 .25rem;
}


/* ===========================================================
   PAINTING DESCRIPTION TEXT
   =========================================================== */

.pntg-description {
    margin: 2em auto 0;
    text-align: left;
    max-width: 100%;
    font-style: italic;
    color: #303030;
    line-height: 1.5em;
}

.pntg-description a {
    color: #303030;
    text-decoration: underline;
}

.pntg-description-2 {
    margin-top: 1em;
    text-align: left;
    max-width: 100%;
    font-style: italic;
    color: #021F3D;
    line-height: 1.5em;
}

.pntg-description-2 a {
    color: #000;
    text-decoration: underline;
}

.quote-attribution {
   margin-right: 1.5rem;

   }

.quote {
      margin: 1rem 0rem 0rem 1rem;
      line-height: 1.4;
      color: #666666;
      font-style: italic;
  }


/* ===========================================================
   IMAGE TOOLS AND LINKS
   =========================================================== */

.detail-img {
    text-align: center;
    display: block;
}

.zoom-info {
    font-size: .85em;
    font-weight: 400;
    padding: 10px 0;
    text-align: center;
    margin: 20px 0;
}

.plain-link:link,
.plain-link:visited {
    color: #000;
}

.plain-link:hover,
.plain-link:active,
.plain-link:focus {
    color: #fff;
    background-color: #021F3D;
}

.font-80 {
    font-size: 80%;
}


/* ===========================================================
   LISTS USED IN SLIDE PAGES
   =========================================================== */

ul.bullets {
    list-style-type: disc;
    list-style-position: outside;
    padding-left: 1.5rem;
    margin-left: 0;
}

ul.bullets li {
    margin-bottom: .75em;
    text-align: left;
}


/* ===========================================================
   RESPONSIVE SLIDE NAVIGATION
   =========================================================== */

@media only screen and (max-width: 769px) {

    .slide-nav ul,
    .bottom-slide-nav ul {
        text-align: center;
        padding: 0;
        font-size: .75rem;
    }

    .slide-nav li,
    .bottom-slide-nav li {
        padding: .25rem;
    }

    .slide-nav a,
    .bottom-slide-nav a {
        padding-left: 0;
        padding-right: 0;
    }
}
