@charset "UTF-8";
/* CSS Document */

/* PRINT – cleaner printout by stripping unnecessary elements */
@media print {
    /* Shrink overall page */
    html {
        zoom: 85%;
        -moz-transform: scale(0.8);
        transform: scale(0.8);
    }
    /* Hide UI and non-essential elements */
    .region.region-preheader,
    .block.block-menu.navigation.menu--utility-navigation,
    .menu.menu--top-level,
    .links,
    .notice-buttons,
    div#block-alerttopallpages,
    div#block-topofpage,
    .site-footer,
    .page-top,
    .sidebar__header,
    .event-type,
    .header,
    hr,
    .node--event--full .sidebar__section:nth-child(n + 2),
    .sidebar
    .button--outline-dark {
        display: none !important;
    }
    /* Accessible colors on print */
    body p,
    ol,
    ul,
    h1,
    h2,
    h3,
    h4,
    h5 {
        color: black !important;
    }
    summary {
        color: black !important;
        margin-bottom: 5px;
        width: 100%;
    }
    .text-formatted a {
        color: #733200 !important;
    }
    .text-formatted li {
        margin-top: 8px !important;
    }
    /* Layout containers */
    .container,
    .layout-container,
    div.container {
        background: none;
        display: flex;
        overflow: visible !important;
        margin: 0;
        /* width: 100%; */
        flex-direction: column;
        flex-wrap: wrap;
        align-content: center;
    }
    /* .layout-container {
        margin-left: -80px;
    } */
    .node--event--full {
        padding-left: 40px !important;
        padding-right: 40px !important;
        max-width: 1400px !important;
    }
    .node--event--full .left {
        /* width: 65%; */
        /* padding-bottom: 40px; */
        /* padding-right: 20px; */
        padding: 0 80px !important;
    }
    /* Print Logo/Header */
    #logo-header {
        content: url(https://files.sfplanning.org/images/assets-drupal/sfplanning-logo-city-seal-60percentK-transparent.gif);
        display: block;
        position: fixed;
        left: 250px;
        top: -131px;
        width: 40%;
        margin: auto;
        z-index: -2;
    }
    /* Event Cover */
    .node--event--full h1 {
        font-size: 48px;
        line-height: 1em;
        padding: 0 200px;
        text-align: center !important;
        /* margin-left: -38px !important; */
        /* width: 80% !important; */
    }
    .node--event--full h3,
    .time {
        font-size: 40px;
        line-height: 1.15em !important;
        margin-top: 50px !important;
        text-align: center !important;
        width: 100%;
    }
    .node--event--full .details .time {
        font-size: 40px !important;
        line-height: 3em;
        margin: -74px 0 30px 0 !important;
        text-align: center !important;
        width: 100%;
    }
    .node--event--full .date-rsvp,
    .node--event--full .details {
        display: block;
        line-height: 1em;
        margin-bottom: 20px !important;
        text-align: center;
    }
    .node--event--full .details .location {
        display: inline-block;
        line-height: 1em;
        margin-bottom: 0 !important;
        text-align: center;
        width: 60% !important;
    }
    .node--event--full .cover {
        display: block;
        margin-top: 20px !important;
        text-align: center;
    }
    .node--event--full .staff {
        font-family: 'Source Sans Pro', Arial, sans-serif;
        font-size: 27px !important;
        letter-spacing: -0.7px;
        line-height: 36px;
        margin: 10px 0 20px 0px;
        text-align: center !important;
        word-break: keep-all;
        word-spacing: 1.5px;
    }
    details {
        border: none !important;
        margin: 10px 0 1px 0 !important;
    }
    details p:first-of-type {
    margin-top: 0px !important;
    }
    /* flex columns */
    .flex {
    display: flex;
    flex-direction: row;
    margin-top: 17px;
    }
    .flex div {
    -ms-flex: 1; /* IE 10 */
    flex: 1;
    margin-right: 34px;
    }
    .flex div:last-of-type {
    -ms-flex: 1; /* IE 10 */
    flex: 1;
    margin-right: 0px;
    }
    .flex li {
    margin-top: 0px;
    }
    .node--event--full h4 {
        page-break-before: always;
    }
    .node--event--full .details > div {
        border-bottom: 0 dotted #e8e8e8;
        color: black !important;
        display: inline-block;
        font-size: 27px !important;
        margin-bottom: 10px !important;
        padding-bottom: 0 !important;
        width: 44%;
    }
    .node--event--full .body {
        margin-bottom: 0;
    }
    .node--event--full .body p {
        line-height: 1.5em !important;
        margin-top: 20px;
    }
    .node--event--full .body h5 {
        font-size: 22px !important;
        margin-bottom: 9px !important;
    }

    /* Block layout styling */
    .block--contact-info {
        background: none !important;
        margin-top: -10px !important;
    }
    .block--contact-info h3 {
        font-size: 25px !important;
        margin: -16px 0 -14px 0 !important;
        text-align: left !important;
    }
    .block--contact-info .left p {
        background: none !important;
        line-height: 1.5em;
        margin-bottom: 20px !important;
        width: 120%;
    }
    .items.col-sm-3,
    .block--contact-info .items {
        background: none !important;
    }
    .block--contact-info .items {
        margin-top: 0 !important;
        width: 118%;
    }
    .block--contact-info .items h3 {
        font-size: 25px !important;
        margin-bottom: -14px !important;
        margin-top: -16px !important;
        text-align: left !important;
    }
}
