/* SECTION STYLES */
/* Custom section styles */
body {
    margin: 0;
    padding: 0;
}
.book-blurb {
    grid-area: blurb;
    text-align: left;
    font-size: 11pt;
    color: #323232;
}
.book-cover {
    grid-area: art;
}
.book-seller {
    grid-area: seller;
}
.book-container {
    display: grid;
    max-width: 850px;
    grid-template-columns: 187px auto;
    grid-template-rows: auto 50px;
    grid-template-areas:
        'art blurb'
        'art seller';
    grid-row-gap: 15px;
    grid-column-gap: 15px;
    text-align: left;
    margin: 18px 0px 75px 0px;
    font-size: 11pt;
}
.nf-container {
    display: grid;
    max-width: 850px;
    grid-template-columns: auto auto;
    grid-template-rows: auto auto;
    grid-row-gap: 15px;
    grid-column-gap: 25px;
    margin: 18px 0px 50px 0px;
}
.seller-container {
    display: grid;
    width: 100%;
    grid-template-columns: 50px 50px 50px 50px;
    grid-template-rows: auto;
    grid-column-gap: 10px;
}
.seller-item {
    grid-row-start: auto;
    grid-row-end: auto;
    grid-column-start: auto;
    grid-column-end: auto;
}
@media screen and (max-width : 930px){
    /*Make dropdown links appear inline*/
    .book-container {
        max-width: 900px;
        grid-template-columns: 100%;
        grid-template-rows: 300px 50px auto;
        grid-template-areas:
            'art'
            'seller'
            'blurb';
        font-size: 12pt;
    }
}
@media screen and (max-width : 730px){
    /*Make dropdown links appear inline*/
    .nf-container {
        max-width: 700px;
        grid-template-columns: 100%;
        grid-template-rows: auto auto auto auto;
    }
}
.credit-line {
    margin-top: 0;
    font-size: 10pt;
    color: #646464;
}
.footer {
    display: block;
    height: 150px;
    background-color: #323232;
    color: #f8f8f8;
    padding: 1rem 0px;
    font-size: 12pt;
    text-align: center;
}
.footer-icon {
    fill: #f8f8f8;
}
.footer-icon:hover {
    fill: #DDA0DD;
}
.footer-list {
    list-style-type: none;
    margin: 0;
    padding: 0;
    border: 0;
}
.footer-social {
    font-size: 1.375rem;
    display: inline-block;
}
.footer-text-sm {
    font-size: 10pt;
}
.footer-url-text {
    text-decoration: none;
    color: #f8f8f8;
}
.footer-url-text:hover {
    color: #DDA0DD;
}
#Publications {
    margin: 40px 0px;
}
#Home {
    background-color: #f8f8f8;
}
.heading {
    padding-top: 100px;
    width: 100%;
    height: 565px;
    color: #323232;
    text-shadow: 2px 2px 8px #f8f8f8;
    background-color: #f8f8f8;
}
.heading h1 {
    font-size: 60px;
    line-height: 3.5rem;
    margin-bottom: 1rem;
}
.icon-space {
    margin: 0px 10px;
    padding: 0;
    text-decoration: none;
}
.josefin {
    font-family: 'Josefin Slab';
}
.landscape-background {
    background-image: url("../img/icm_landscape_1000x667.png");
    background-position: bottom center;
    background-repeat: no-repeat;
    background-size: 667px auto;
}
@media screen and (max-width : 575px){
    /*Make dropdown links appear inline*/
    .landscape-background {
        background-image: url("../img/icm_landscape_617x365.png");
        background-size: 365px auto;
    }
    .heading {
        height: 420px;
    }
}
.nf-ref {
    margin: 5px 0px 0px 0px;
    padding: 0;
    color: #646464;
    font-size: 14pt;
    font-weight: 300;
}
.nf-title {
    line-height: 0.89;
    margin: 0;
    padding: 0;
    font-family: 'Martel', serif;
    font-size: 22px;
}
.nf-date {
    font-size: 12pt;
    color: #646464;
    margin: 0px 0px 15px 0px;
}
.pubs {
    width: 100%;
    height: auto;
    text-align: center;
    font-size: 14pt;
}
.pubs-text {
    display: inline-block;
    text-align: left;
    width: 80%;
    max-width: 850px;
    color: #323232;
    text-shadow: 2px 2px 8px #f8f8f8;
    padding-top: 40px;
}
.pubs-text h2 {
    margin-bottom: 15px;
}

.read-more-state {
    display: none;
}
.read-more-target {
    opacity: 0;
    max-height: 0;
    font-size: 0;
    transition: .25s ease;
}
.read-more-state:checked ~ .read-more-wrap .read-more-target {
    opacity: 1;
    font-size: inherit;
    max-height: 999em;
}
.read-more-state ~ .read-more-trigger:before {
    content: 'Show more';
}
.read-more-state:checked ~ .read-more-trigger:before {
    content: 'Show less';
}
.read-more-trigger {
    cursor: pointer;
    display: inline-block;
    padding: 0 .5em;
    color: #666;
    font-size: .9em;
    line-height: 2;
    border: 1px solid #ddd;
    border-radius: .25em;
}

.script {
    font-family: 'Josefin Slab';
    font-size: 80px;
    font-style: normal;
    font-variant: normal;
    font-weight: 500;
    line-height: 26.4px;
}
.social {
    padding-top: 18px;
    padding-bottom: 36px;
}
.title-script {
    font-family: 'Alex Brush', cursive;
    font-size: 120px;
    font-style: normal;
    font-variant: normal;
    font-weight: 500;
    line-height: 26.4px;
}

/* SOCIAL MEDIA ICONS */
/* Add style to social media icons */
.fas {
    text-decoration: none;
    font-size: 12pt;
}
.far, .fab {
    padding: 10px;
    font-size: 30px;
    width: 33px;
    text-align: center;
    text-decoration: none;
}

/* Add a hover effect */
.fas:hover, .far:hover, .fab:hover {
    color: #BA55D3;
}

/* Add color to social media icons */
.fa-envelope {
    background: #000000;
    color: white;
}
.fa-instagram {
    color: white;
    background: linear-gradient(to bottom right, #fccc63, #e95950, #bc2a8d, #8a3ab9);
}
.fa-facebook {
    background: #3b5998;
    color: white;
}
.fa-twitter {
    background: #55ACEE;
    color: white;
}
.fa-external-link-alt {
    color: #323232;
}
