﻿/* Module Styles for 2021 Redesign: r21 */

/*
This CSS resource incorporates links to font software which is the valuable copyrighted property of Monotype and/or its suppliers. You may not attempt to copy, install, redistribute, convert, modify or reverse engineer this font software. Please contact Monotype with any questions regarding Web Fonts: http://www.fonts.com
*/

/* SITE COLORS
    #0c3664 Cobalt - Background Color
    #1e81ea SkyBlue - Navigation Hover
    #f7f7f8 Aluminum Shine - Used sparingly
    #008747 Leaf Green - Accent for some headers
    #165788 Alcoa Blue - Used for backgrounds
    #07213c Midnight - Used for header backgrounds
    #231F20 Graphite - Used for text elements
    #E6ECF2 Pale Blue - Used for white hovers
    #CCC1AD Taupe - Used for quotes or other areas where warmth is preferred
    */


@font-face {
    font-family: "Avenir Light"; /* "Avenir LT W01_35 Light1475496"; */
    src: url("/common/fonts/1475496/0078f486-8e52-42c0-ad81-3c8d3d43f48e.woff2") format("woff2"),url("/common/fonts/1475496/908c4810-64db-4b46-bb8e-823eb41f68c0.woff") format("woff");
}

@font-face {
    font-family: "Avenir Light-O"; /* "Avenir LT W01_35 Light 1475502"; */
    src: url("/common/fonts/1475502/a59168c1-917d-4de9-a244-0316c057c357.woff2") format("woff2"),url("/common/fonts/1475502/6dc0e7d8-9284-44e1-8f05-984a41daa3a4.woff") format("woff");
}

@font-face {
    font-family: "Avenir Book"; /* "Avenir LT W01_45 Book1475508"; */
    src: url("/common/fonts/1475508/065a6b14-b2cc-446e-9428-271c570df0d9.woff2") format("woff2"),url("/common/fonts/1475508/65d75eb0-2601-4da5-a9a4-9ee67a470a59.woff") format("woff");
}

@font-face {
    font-family: "Avenir Book-O"; /* "Avenir LT W01_45 Book O1475514"; */
    src: url("/common/fonts/1475514/476612d9-282d-4f76-95cd-b4dd31e7ed21.woff2") format("woff2"),url("/common/fonts/1475514/f1ebae2b-5296-4244-8771-5f40e60a564a.woff") format("woff");
}

@font-face {
    font-family: "Avenir Roman"; /* "Avenir LT W01_55 Roman1475520"; */
    src: url("/common/fonts/1475520/b290e775-e0f9-4980-914b-a4c32a5e3e36.woff2") format("woff2"),url("/common/fonts/1475520/4b978f72-bb48-46c3-909a-2a8cd2f8819c.woff") format("woff");
}

@font-face {
    font-family: "Avenir Oblique"; /* "Avenir LT W01_55 Obliqu1475526"; */
    src: url("/common/fonts/1475526/1a7173fa-062b-49ad-9915-bc57d3bfc1f5.woff2") format("woff2"),url("/common/fonts/1475526/cdda031e-26e9-4269-83d1-5a218caa10db.woff") format("woff");
}

@font-face {
    font-family: "Avenir Medium"; /* "Avenir LT W01_65 Medium1475532"; */
    src: url("/common/fonts/1475532/17b90ef5-b63f-457b-a981-503bb7afe3c0.woff2") format("woff2"),url("/common/fonts/1475532/c9aeeabd-dd65-491d-b4be-3e0db9ae47a0.woff") format("woff");
}

@font-face {
    font-family: "Avenir Medium-O"; /* "Avenir LT W01_65 Medium1475538"; */
    src: url("/common/fonts/1475538/deb5e718-7abb-4df3-9365-edfa95317090.woff2") format("woff2"),url("/common/fonts/1475538/04801919-17ee-4c6b-8b17-eb1965cb3ed6.woff") format("woff");
}

@font-face {
    font-family: "Avenir Heavy-O"; /* "Avenir LT W01_85 Heavy 1475550"; */
    src: url("/common/fonts/1475550/3c210c80-960f-4684-850b-25390b4d08af.woff2") format("woff2"),url("/common/fonts/1475550/cb5c71ad-e582-4d00-929c-67fbfaeb1c27.woff") format("woff");
}

@font-face {
    font-family: "Avenir Black"; /* "Avenir LT W01_95 Black1475556"; */
    src: url("/common/fonts/1475556/c78eb7af-a1c8-4892-974b-52379646fef4.woff2") format("woff2"),url("/common/fonts/1475556/75b36c58-2a02-4057-a537-09af0832ae46.woff") format("woff");
}

@font-face {
    font-family: "Avenir Black-O"; /* "Avenir LT W01_95 Black 1475562"; */
    src: url("/common/fonts/1475562/a2477e08-09d9-4d4b-97a9-23a1e22cb44c.woff2") format("woff2"),url("/common/fonts/1475562/19d12bba-92b1-43ad-9bab-cd36a4195c2a.woff") format("woff");
}


/* -------------------------------------------------------------------|   GLOBAL OVERRIDES: redesign2021   | */

    html {
    font-size: clamp(16px, 1.25vw, 20px);
}

body {
    color: #231F20;
}

main {
    min-height: 60vh;
}

.redesign2021 .interior-body > .row, .redesign2021 .row, .redesign2021 .container-fixed, .redesign2021 .container > .row, .redesign2021 .container-fluid > .row:not(.full-width) {
    display: flex;
    align-items: center;
    background-size: 100%;
}

.interior-body > .row, .row, .container-fixed, .container > .row, .container-fluid > .row:not(.full-width) {
    margin: 0px auto;
    padding: 0px 5vw;
    max-width: 100%;
}

    .row .row {
        padding: 0px;
    }

.column-master-style {
    margin: 0px;
    padding: 0px;
    position: relative;
}

.bodycopy, .panel-group {
    margin: 4vh 2vw;
}

.news-items .media:first-child { /* Overriding Bootstrap */
    margin-top: 2vw;
}

.hero-overlay .container-fluid {
    max-width: 100%;
    padding: 0px 5vw;
}


.form--development-information {
    margin-left: 2vw;
    margin-bottom: 0px;
    font-family: monospace;
    font-size: 16px;
    border: solid 1px #231F20;
    padding: 10px;
    background-color: #ccc;
    color: #000;
    font-weight: bold;
    border-radius: 5px;
    display: inline-block;
}

.form-control {
    color: #231F20;
}

.title { /* For Req-to-Pay form, maybe other places? */
    font-family: "Avenir Black", Arial, sans-serif;
    font-size: clamp(24px, 1.5vw, 30px);
    font-weight: normal;
}

.right-column-news .media.bodycopy, .right-column-content .media.bodycopy {
    margin: 4vh 0px;
}

.news-items p.news-release--error {
    margin: 0px 3vw;
}



/* -------------------------------------------------------------------|   FOOTER SECTION   | */
footer .row, footer .container-fixed, footer .container > .row, footer .container-fluid > .row:not(.full-width) {
    display: block;
    padding: inherit;
    margin: auto;
    max-width: none;
}

footer {
    padding: 3vh 5vw;
    background-color: #0c3664;
}

.footer--container {
    margin-left: 2vw;
}

.footer--links {
    float: left;
    width: 50vw;
}

.footer--links .footer--content{
    display: flex;
    flex-flow: column;
    float: left;
}

.footer--links a {
    padding: 1vh 0px;
    font-size: 18px;
}

.footer--content a {
    color: #fff;
}


.footer--content__utility {
    margin-right: 20%;
}


.footer--content__social {
    float: right;
}

.footer--content__social a {
    float: left;
    padding: 1vh 0px;
}

.footer--copyright {
    clear: both;
    padding: 3vh 0px;
    padding-bottom: 0px;
}


/* -------------------------------------------------------------------|   HEADER SECTION   | */
header {
    position: -webkit-sticky;
    position: sticky;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1000;
}

.navbar-wrapper {
    position: static;
}

.navbar-custom-meta, .navbar-custom-main {
    background-color: #0c3664;
    padding: 0px 5vw;
}

.navbar-custom-site {
    background-color: #000;
}

.container-nav {
    max-width: inherit;
    background-color: inherit;
}

.navbar-nav > li > a { /* Controls both main nav and site nav */
    padding: clamp(8px, 1vw, 30px);
    padding-bottom: 2vw;
    font-size: clamp(11px, 1vw, 20px);
}

#site-nav .navbar-nav > li > a { /* Site nav only */
    padding-top: 1vh;
    font-size: clamp(11px, .9vw, 20px);
}

#top-meta-sep, #top-main-sep {
    display: none;
}

.redesign2021 main .container-fluid:first-child {
    display: none;
}


.redesign2021 .navbar-custom-site {
    display: none;
}


#main-nav .dropdown.active-item {
    background-color: transparent;
}

    #main-nav .dropdown.active-item a span { /* Indicator in menu for current page */
        border-bottom: .25vw #1e81ea solid;
        padding-bottom: .75vw;
    }

#main-nav .top-main-search .dropdown-menu {
    background-color: #165788;
}

    #main-nav .dropdown-menu .close-icon {
        top: 18px;
        right: 28px;
        color: #231F20;
    }

ul.dropdown-menu {
    background-color: #165788;
}

.dropdown-menu > li > a {
    color: #fff;
    font-weight: bold;
    text-transform: uppercase;
}

#searchTextBox {
    font-family: "Avenir Medium", Arial, sans-serif;
    color: #231F20;
    letter-spacing: .75px;
}

.btn-primary {
    background-color: #0c3664;
    border-color: #0c3664;
    
}

#hero-text .hero-overlay a.btn-primary {
    margin-right: 2vw;
}

.hero-overlay p {
    font-size: clamp(16px, 1.75vw, 24px);
}

.hero-overlay .text-overlay-heading h1 {
    margin-top: 0px;
}


.breadcrumb-nav-menu {
    background-color: #0c3664 !important;
}

#brdcrmhtml { /* old site */
    margin: 0px 2vw;
    margin-top: 3vh;
}

#brdcrmhtml .breadcrumb { /* old site */
    padding: 0px;
}


/* -------------------------------------------------------------------|   UNIVERSAL STYLES   | */
.code--block {
    margin: 1vw;
    display: block;
}

.code-copy {
    display: none;
}

h3.panel-heading {
    padding: 0px;
}

button.panel-button {
    display: block;
    width: 100%;
    margin: 0px;
    text-align: left;
    background-color: transparent;
    border-width: 0px;
}

.panel-default > .panel-heading {
    color: #fff;
}

.navbar-wrapper a {
    letter-spacing: 1px;
}

#tnav #top-site-nav-title a {
    text-transform: uppercase;
    letter-spacing: 2px;
}

main .breadcrumb li {
    padding: 0px;
}

main .breadcrumb .breadcrumb-nav-menu li {
    padding-bottom: 3vh;
}

.breadcrumb > li + li:before {
    content: "|";
    color: #008747;
    padding: 0px;
    padding-right: 4px;
    margin: 0px 3px;
}

.table-opener:hover {
    cursor: pointer;
}

.table--wrapper {
    overflow-x: auto;
    overflow-y: hidden;
}

/* -------------------------------------------------------------------|   GLOBAL MODULE ELEMENTS   | */
.r21, p, a, .container, .container-fluid, body {
    font-family: "Avenir Book", Arial, sans-serif;
}

.r21 em, p em, a em, .container em, .container-fluid em, body em
.r21 i, p i, a i, .container i, .container-fluid i, body i, i a, em a {
    font-family: "Avenir Book-O", Arial, sans-serif;
    font-style: normal;
}

h1, h2, h3:not(.panel-heading), h4, h5, h6, h6 a, .hero-overlay h1 {
    font-family: "Avenir Black", Arial, sans-serif;
    font-weight: normal;
    line-height: 1.25;
    margin-top: 1.75rem;
    margin-bottom: .5rem;
}

#brdcrmhtml .breadcrumb li, #brdcrmhtml .breadcrumb li a {
    font-family: "Avenir Black", Arial, sans-serif;
    font-weight: normal;
    line-height: 1.25;
}


    h1 em, h2 em, h3 em, h4 em, h5 em, h6 em, h6 a em, .hero-overlay h1 em,
    h1 i, h2 i, h3 i, h4 i, h5 i, h6 i, h6 a i, .hero-overlay h1 i {
        font-family: "Avenir Black-O", Arial, sans-serif !important;
        font-style: normal;
        font-weight: normal;
    }

h1 {
    font-size: clamp(30px, 8vh, 80px);
}

h2 {
    font-size: clamp(26px, 3.5vh, 35px);
}

h3 {
    font-size: clamp(20px, 2.75vh, 30px);
}

h4 {
    font-size: clamp(19px, 2.5vh, 26px);
}

code {
    padding: .5vh 1vw;
    border-radius: .5vw;
}

a {
    font-size: clamp(15px, 1vw, 18px);
}

p, li, cite, .news-items p.summary {
    line-height: 1.5;
    font-size: clamp(16px, 1.1vw, 20px);
}

.navbar-brand .registered-symbol {
    line-height: unset;
    font-size: 8px;
    padding-left: 3px;
    line-height: 7;
}

main li {
    padding-top: .25vw;
    padding-bottom: .25vw;
}

#main-nav, #meta-nav, #site-nav {
    font-family: "Avenir Medium", Arial, sans-serif;
}

#main-nav em, #meta-nav em, #site-nav em, #main-nav i, #meta-nav i, #site-nav i {
    font-family: "Avenir Medium-O", Arial, sans-serif;
    font-style: normal;
}

.news-release-page span {
    font-family: inherit !important;
    font-size: inherit !important;
}

.glyphicon {
    font-family: 'Glyphicons Halflings' !important;
}


/* -------------------------------------------------------------------|   ANCHOR TAGS AND LINK-LIKE ELEMENTS   | */

main a, .news-module--cta span, .a {
    color: #0c3664;
    text-decoration: underline;
    display: inline;
    font-weight: bold;
    overflow-wrap: break-word;
}

h6, h6 a, .breadcrumb li a, .breadcrumb .active {
    font-size: clamp(16px, 1vw, 18px);
    color: #008747;
    font-weight: bold;
    background-color: transparent;
}

    h6 a, .breadcrumb li a {
        color: #0c3664;
        background-color: transparent;
    }

.with_arrow a, a.with_arrow, .news-module--cta span, a.link--cta, .link--cta, main a.link--cta {
    font-family: "Avenir Black", Arial, sans-serif;
    text-transform: uppercase;
    font-weight: normal;
    text-decoration: none;
    border-bottom: 1px solid #0c3664;
    background-color: transparent;
    margin-bottom: 3vh;
    display: inline;
}

.with_arrow a em, a.with_arrow em, .news-module--cta span em, a.link--cta em, .link--cta em, main a.link--cta em,
.with_arrow a i, a.with_arrow i, .news-module--cta span i, a.link--cta i, .link--cta i, main a.link--cta i {
    font-family: "Avenir Black-O", Arial, sans-serif;
    font-style: normal;
    font-weight: normal;
}

main a:hover, main a:hover, .alcoa-story:hover .news-module--cta span, h6 a:hover, .breadcrumb li a:hover {
    text-decoration: none;
    background-color: #0c3664;
    color: #fff;
}

.news-module--cta, .r21--quote-module .link--cta, p.link--cta {
    font-size: clamp(16px, 1vw, 18px);
    font-family: "Avenir Black", Arial, sans-serif;
    padding-top: .5rem;
}

    .with_arrow::before {
        content: none;
    }

main a.link--button {
    font-family: "Avenir Black", Arial, sans-serif;
    text-transform: uppercase;
    padding: 1vmin 1.5vmin;
    background-color: #ffffff;
    color: #093462;
    border-radius: .35vw;
    border: solid 1px #666666;
    display: inline-block;
    font-size: clamp(16px, 1vmin, 18px);
    text-decoration: none;
    cursor: pointer;
    text-align: center;
    margin-bottom: 3vh;
}

main a.link--button em {
    font-family: "Avenir Black-O", Arial, sans-serif;
    font-style: normal;
    font-weight: normal;
}

    main a.link--button:hover, ol.breadcrumb .non-click-link:hover {
        background-color: #0c3664;
        color: #ffffff;
    }

.sustainability-story:hover .link--cta {
    color: #fff;
    border-color: #fff;
}

.dropdown-menu a { /* Site nav dropdown */
    font-size: clamp(11px, .9vw, 18px);
    font-family: 'Avenir Light', Arial, sans-serif;
}

.breadcrumb-nav-menu a {
    color: #fff !important;
}

.breadcrumb .breadcrumb-nav-menu li a {
    font-weight: normal;
}


/* -------------------------------------------------------------------|   COPY-MODULE   | */
.r21--copy-module li {
    padding-bottom: .25vw;
}

.r21--copy-module dd {
    margin-left: 2vw;
    padding-bottom: .25vw;
}

.r21--copy-module dt {
    border-top: 2px #aaa solid;
    margin-top: .25vw;
    padding: .25vw;
    background-color: #eee;
}

.r21--copy-module h4 {
    padding-top: .5vw;
}

.header--list-style {
    padding-bottom: .75vw;
    padding-top: 0px;
    border-bottom: solid #000 .25vh;
}



/* -------------------------------------------------------------------|   HEADER-MODULE   | */
.r21--header-module {
    padding: 4vw 0px 0vw 0px;
}

    .r21--header-module h3, .r21--header-module h2 {
        padding-bottom: 1vw;
    }

    .r21--header-module h6 {
        padding-bottom: 1vw;
    }

    .r21--header-module a, .r21--header-module p {
        margin-top: 1vw;
    }

    .r21--header-module li a {
        padding-top: 0px;
    }



/* -------------------------------------------------------------------|   HEADER-MODULE__BANNER   | */

.r21--header-module__banner {
    padding-bottom: 4vw;
}

    .r21--header-module__banner h1 {
        color: #ffffff;
        line-height: 1.25;
    }

    .r21--header-module__banner h3, .r21--header-module__banner h6, .r21--header-module__banner p {
        color: #cccccc;
    }



/* -------------------------------------------------------------------|   HEADER-MODULE__PILLAR  | */

.r21--header-module__pillar h3 {
    border-top: 1vh solid #008747;
}



/* -------------------------------------------------------------------|   HEADER-MODULE__DATAPOINT   | */

.r21--header-module__datapoint {
    text-align: center;
    background-color: #008747;
    color: #fff;
    padding: 2vw;
}

.r21--header-module__datapoint p, .r21--header-module__datapoint h2 {
    margin: 0px;
    padding: 0px;
}

    /* -------------------------------------------------------------------|   IMAGE-MODULE   | */

    .r21--image-module {
    display: block;
    overflow: hidden;
    max-height: 90vh;
}

    .r21--image-module img {
        object-fit: cover;
    }



/* -------------------------------------------------------------------|   IMAGE-MODULE__LARGE   | */

.r21--image-module__large {
    margin: 2vw -5vw;
    overflow: inherit;
    max-height: inherit;
}

.r21--image-module__large img {
    width: 100%;
}

/* -------------------------------------------------------------------|   IMAGE-MODULE__LARGE-LEFT   | */

.r21--large-image__left {
    margin-right: 5vw;
}


/* -------------------------------------------------------------------|   IMAGE-MODULE__LARGE-RIGHT   | */

.r21--large-image__right {
    margin-left: 5vw;
}


/* -------------------------------------------------------------------|   IMAGE-MODULE__BANNER   | */

.r21--image-module__banner {
    z-index: 10;
    position: absolute;
    overflow: hidden;
}

.column--hero-image {
    align-self: start;
}


/* -------------------------------------------------------------------|   BREADCRUMB-MODULE   | */
.bodycopy.r21--breadcrumb-module {
    margin: 0px 2vw;
    display: inline-block;
    margin-top: 3vh;
}

.r21--breadcrumb-module h6 {
    float: left;
    margin: 0px 4px 0px 4px;
}

.r21--breadcrumb-module h6:first-child {
    margin-left: 0px;
}

    /* -------------------------------------------------------------------|   CALLOUT-MODULE   | */
    .r21--callout-module {
        background-color: #008747;
        color: #fff;
        padding: 2vw;
    }

    .r21--callout-module p, .r21--callout-module li, .r21--callout-module h6 {
        color: #eeeeee;
    }

        .r21--callout-module p strong, .r21--callout-module li strong {
            color: #fff;
        }

    .r21--callout-module button {
        margin: .5vw auto;
        color: #000;
    }

        .r21--callout-module button:hover {
            background-color: #544;
            color: #fff;
            border-color: #999;
            border-style: solid;
        }

    main .r21--callout-module a {
        color: #fff;
        border-color: #fff;
        background-color: transparent;
    }

        main .r21--callout-module a:hover {
            text-decoration: none;
            background-color: #000;
        }

.r21--callout-module h2, .r21--callout-module h3, .r21--callout-module h4 {
    margin-top: 0px;
}
 


/* -------------------------------------------------------------------|   NEWS-MODULE   | */
.newsWrapper > *:not(.media-list) {
    clear: both;
    margin-left: 2vw;
}

.newsWrapper .r21--image-module {
    margin-bottom: 0px;
    margin-top: 0px;
    height: 17vw;
    background-color: #fff;
    display: flex;
}

.newsWrapper .story--container {
    box-shadow: 5px 5px 5px #ddd;
}

.newsWrapper .r21--image-module img {
    object-fit: cover;
}

.newsWrapper .news-module--summary {
    display: none;
}


.newsWrapper .r21--copy-module {
    padding: 0px;
    margin-top: 0px;
    padding: 1vw;
    background-color: #f0f0f1;
    height: 13rem;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}



    .newsWrapper .r21--copy-module .news-module--cta span {
        margin-top: 1rem;
    }

.news-items {
   /* display: inline-block; */
}

.alcoa-story:hover {
    cursor: pointer;
}


.alcoa-story:hover .column-master-style .r21--image-module {
    opacity: .9;
}

.alcoa-story:hover .column-master-style .r21--copy-module {
    background-color: #0c3664;
    color: #fff;
}
    
.alcoa-story .column-master-style {
    display: inline-block;
}

.newsWrapper .link--button {
    margin: 0px auto;
    margin-bottom: 30px;
}



/* -------------------------------------------------------------------|   NEWS-MODULE -- SINGLE ITEM   | */
.single-item-news {
    margin-bottom: -1vw;
    overflow: hidden;
}

    .single-item-news .story--1 > .column-master-style {
        margin-bottom: 2vw;
    }

    .single-item-news .r21--copy-module {
        border-width: 0px;
        height: 24vw;
        display: block;
        margin: 0px;
        padding-left: 2vw;
    }

    .single-item-news .news-module--summary {
        display: flex;
        flex-direction: column;
        height: 15vw;
        justify-content: space-around;
        padding-right: 2vw;
    }

    .single-item-news p:not(.news-module--cta):not(.row--title) {
        margin-left: 0px;
    }

    .single-item-news .alcoa-story:not(.story--1), .single-item-news .alcoa-story:not(.story--1) div {
        display: none;
        position: absolute;
    }

    .single-item-news .story--1 {
        width: 300%;
    }

    .single-item-news .news-1-image {
        width: 30vw;
        height: 24vw;
        float: right;
        border-width: 0px;
        margin: 0px;
        margin-left: 1vw;
    }

    .single-item-news .news-module--title {
        margin-bottom: 0px;
        font-size: clamp(18px, 1.2vw, 24px);
        text-align: center;
    }

    .single-item-news .news-module--summary .feature--col {
        width: 50%;
    }

    .single-item-news .news-module--summary .feature--name {
        color: #008747;
        font-family: "Avenir Black", Arial, sans-serif;
    }

    .single-item-news .news-module--cta {
        text-align: center;
    }

    .single-item-news .news-module--summary .row--participants, .single-item-news .news-module--summary .row--participants .row--title {
        border-bottom: 1px solid #000;
    }



/* -------------------------------------------------------------------|   LIST-LIST-MODULE   | */
.listWrapper {
    background-color: #0c3664;
    color: #ffffff;
    /* padding: 1.5vw; */
    /* margin-right: 5vw; */
}

    .listWrapper h3 {
        padding-bottom: 1vh;
        padding-top: 0px;
        margin-top: 6vh;
        border-bottom: solid #fff .25vh;
        margin-bottom: 0px;
    }

    .listWrapper ul {
        margin: 0px;
        padding: 0px;
        list-style-type: none;
    }


    .listWrapper a {
        color: #aaa;
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding-left: 40px;
        border: none;
        text-decoration: none;
        background-color: transparent;
        padding-top: clamp(16px, .25rem, .25rem);
        padding-bottom: clamp(16px, .25rem, .25rem);
    }

        .listWrapper a:hover {
            text-decoration: none;
            color: #ffffff;
            padding-left: 0px;
            background-color: inherit;
        }

            .listWrapper a:hover::before {
                font-family: 'Glyphicons Halflings';
                content: "\2212";
                font-size: 22px;
                display: block;
                margin-right: 18px; /* .39rem for medium sized, .1 for large */
            }

        .listWrapper a p {
            flex-grow: 1;
            margin: 0px;
            font-weight: bold;
            line-height: 1.25;
            margin-top: 1rem;
            margin-bottom: 1rem;
            font-size: clamp(19px, 2.5vh, 26px);
        }


    .listWrapper li {
        padding-top: 0px;
        padding-bottom: 0px;
        width: 100%;
    }

        .listWrapper li:not(:last-child) {
            border-bottom: solid white 1px;
        }

    .listWrapper a::after {
        font-family: 'Glyphicons Halflings';
        content: "\e022";
        font-size: clamp(22px, 2vw, 2rem);
        display: block;
        margin-left: 1vw;
        margin-right: 2vw;
    }

    .listWrapper a.list-item__link::after {
        content: "\e131";
    }

    .listWrapper a.list-item__external::after {
        content: "\e164";
    }

.list--padding {
    padding: 2vw;
}

.list--padding h3 {
    margin-top: 2vh;
}

/* -------------------------------------------------------------------|   LIST-MODULE__WHITE   | */
.list--light {
    background-color: #ffffff;
    color: #222;
}

    .list--light h3, .list--light li {
        border-color: #0c3664;
    }


    .list--light a {
        color: #0c3664;
    }

    .list--light a:hover {
        color: #1e81ea;
        background-color: #E6ECF2;
    }

    .list--light li:not(:last-child) {
        border-bottom: solid #0c3664 1px;
    }

main .list--light a.link--cta, main .list--light a {
    color: #0c3664 !important;
    border-color: #0c3664 !important;
}



/* -------------------------------------------------------------------|   LEGACY--DOCUMENT-MODULE   | */

.media-list.downloads {
    background-color: #0c3664;
    color: #ffffff;
    padding: 1vh;
    padding-left: clamp(20px, 1.5vw, 2vw);
    padding-right: clamp(20px, 1.5vw, 2vw);
}

.media-list.downloads {
    border-top: solid #fff .25vh;
}

.media-list.downloads .media-body p {
    display: none;
}

    .downloads .media-left {
        display: none;
    }


    .downloads .media-heading a {
        color: #aaa;
        display: flex;
        align-items: center;
        justify-content: space-between;
        border: none;
        text-decoration: none;
        background-color: transparent;
        padding-top: clamp(16px, .25rem, .25rem);
        padding-bottom: clamp(16px, .25rem, .25rem);
    }

        .downloads .media-heading a:hover {
            text-decoration: none;
            color: #ffffff;
            padding-left: 0px;
            background-color: inherit;
        }


    .downloads li {
        padding-top: 0px;
        padding-bottom: 0px;
        width: 100%;
        margin-top: 0px;
    }

        .downloads li:not(:last-child) {
            border-bottom: solid white 1px;
        }

.downloads a::after {
    font-family: 'Glyphicons Halflings';
    content: "\e022";
    font-size: clamp(22px, 2vw, 2rem);
    display: block;
    margin-left: 1vw;
}
    


/* -------------------------------------------------------------------|   LIGHTBOX-MODULE   | */

.redesign2021 .modal {
    max-height: 98vh;
}

.redesign2021 .modal-sm {
    width: 40vw;
}

.redesign2021 .modal-header {
    background-color: #ffffff;
    position: sticky;
    top: 0;
    left: 0;
    right: 0;
    z-index: 2000;
}

.redesign2021 .modal-title {
    display: inline-block;
}

.redesign2021 .modal button.close {
    font-size: clamp(18px, 4vh, 20px);
    color: #666;
    opacity: 1;
    float: right;
}

.redesign2021 .modal-body img {
    margin: auto;
    padding-bottom: 2vh;
    width: 100%;
}

a.link--modal:hover {
    cursor: pointer;
}


/* -------------------------------------------------------------------|   LIGHTBOX-MODULE__LARGE   | */

.redesign2021 .modal-lg {
    width: 70vw;
}

/* -------------------------------------------------------------------|   QUOTE-MODULE   | */
.r21--quote-module {
    overflow: hidden;
}


    .r21--quote-module a {
        text-decoration: none;
        background-color: #f7f7f8;
        color: #fff;
        position: relative;
        padding-bottom: 1vh;
        height: 75vh;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
    }

        .r21--quote-module a img {
            width: 100%;
            padding-bottom: 1.5vh;
            z-index: 10;
        }


    .r21--quote-module q, .r21--quote-module p {
        padding: 0 1.25vw;
        display: block;
        color:#165788 
    }

    .r21--quote-module p {
        text-align: right;
        padding-top: 1vh;
        font-size: .9rem;
        color: #07213c;
    }

    .r21--quote-module .link--cta {
        margin:2vh auto;
        color: #07213c;
        display: table;
    }

    .r21--quote-module a:hover {
        cursor: pointer;
        background-color: #CCC1AD !important;
    }

    .r21--quote-module a:hover .link--cta{
        background-color: #0c3664 !important;
        color: #fff;
    }

    .r21--quote-module a:hover img {
        opacity: .9;
    }



/* -------------------------------------------------------------------|   ACCORDIONS   | */

.panel-group .panel {
    border-radius: 0px;
    border: 2px #888 solid;
    margin-bottom: clamp(1.75vh, .75vw, 20px);
}

.panel-default > .panel-heading {
    background-color: #0c3664;
    color: #ffffff;
    margin: 0px;
    font-size: clamp(16px, 1.1vw, 20px);
    border-radius: 0px;
}

.panel-default > .panel-heading:hover {
    background-color: #000;
}

button.panel-button {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: clamp(16px, 1vw, 20px);
}

.panel-button:after {
    font-family: 'Glyphicons Halflings';
    content: "\e079";
    font-size: clamp(12px, .75vw, 1rem);
    display: block;
    margin-left: 10px;
}

.panel-button.collapsed:after {
    content: "\e114";
}

.panel-collapse {
    padding: 1vw;
    overflow: auto;
}

.panel .bodycopy {
    margin: 1.5vw;
}

/* -------------------------------------------------------------------|   ACCORDIONS--LIGHT   | */

.r21--accordion__light {
    color: #222;
}

    .r21--accordion__light .panel-default > .panel-heading {
        background-color: #fff;
        color: #0c3664;
        font-weight: bold;
    }

        .r21--accordion__light .panel-default > .panel-heading:hover {
            background-color: #E6ECF2;
            border-bottom: solid 1px #ccc;
            margin-bottom: -1px;
        }

main .r21--accordion__light a.link--cta, main .r21--accordion__light a.link--cta {
    color: #0c3664 !important;
    border-color: #0c3664 !important;
}

    main .r21--accordion__light a.link--cta:hover, main .r21--accordion__light a.link--cta:hover {
        color: #fff !important;
        background-color: #0c3664;
    }

    /* -------------------------------------------------------------------|   ACCORDIONS--LIST STYLE   | */
    .r21--accordion-list.panel-group {
        border-top: 2px #888 solid;
    }

.r21--accordion-list.panel-group .panel {
    border: 0px;
    border-bottom: 2px #888 solid;
    margin-bottom: 0px;
}

.r21--accordion-list .panel-default > .panel-heading {
    background-color: #fff;
    color: #0c3664;
    font-weight: bold;
}

    .r21--accordion-list .panel-default > .panel-heading:hover {
        background-color: #E6ECF2;
        border-bottom: solid 1px #ccc;
        margin-bottom: -1px;
    }

.r21--accordion-list.panel-group .panel-group {
    margin-top: 0px;
    border-top: 2px #888 solid;
}



/* -------------------------------------------------------------------|   DROPDOWN   | */

.r21--dropdown-module select {
    text-transform: uppercase;
    padding: 1vmin 2vmin;
    background-color: #ffffff;
    font-weight: bold;
    color: #093462;
    border-radius: .4vw;
    border: solid 1px #666666;
    display: block;
    min-width: 50%;
    max-width: 100%;
    font-size: clamp(15px, 1vw, 18px);
    -webkit-appearance: none;
    background: url(/common/css/images/chevron-down.svg) no-repeat right #eee;
    background-position-x: 95%;
}

.r21--dropdown-module select:hover, .r21--dropdown-module select option:hover {
    cursor: pointer;
}

.r21--dropdown-module select option:first-child {
    font-weight: bold;
}

.r21--dropdown-module select option {
    font-size: clamp(16px, 1vw, 20px);
}



/* -------------------------------------------------------------------|   STORY ARTICLES   | */
p.date {
    color: #231F20;
}

.news-release-page h1 {
    font-size: clamp(18px, 6vw, 20px);
}

.news-release .article--content {
    max-width: 45vw;
}

.news-release .module_container--content img {
    max-width: 100%;
}

.news-release h5 { /* Captions */
    font-size: clamp(16px, 1.1vw, 20px);
    font-weight: normal;
    font-family: 'Avenir Light-O', Arial, sans-serif;
    text-align: center;
    margin-top: .5rem;
    margin-bottom: 1.75rem;

}

.news-release iframe {
    margin: 0 auto;
    display: block;
    width: 35vw;
    height: 20vw;
}

/* -------------------------------------------------------------------|   VIDEO   | */
.videoWrapper {
    padding-bottom: 0px;
    max-width: 142vh;
    margin: 0 auto 20px;
    height: inherit;
}

.videoWrapper::before {
    content: '';
    display: block;
    position: relative;
    padding-bottom: 56.25%;
}


.videoWrapper iframe {
    max-height: 80vh;
    max-width: 90vw;
}


/* -------------------------------------------------------------------|   DESKTOP STYLE OVERRIDES   | */
@media only screen and (min-width: 992px) {
    .navbar-wrapper .navbar {
    padding: 0px 5vw;
}
}


/* -------------------------------------------------------------------|   MOBILE STYLES   | */
@media only screen and (max-width: 992px) {

    /* NOTE: Transition is weird due to scrollbar which is not visibile in mobile */

    /*  --------------------------------------------------|  GLOBAL OVERRIDES: redesign2021   | MOBILE */
    .redesign2021 .interior-body > .row, .redesign2021 .row, .redesign2021 .container-fixed, .redesign2021 .container > .row, .redesign2021 .container-fluid > .row:not(.full-width) {
        display: block;
    }

    .interior-body > .row, .row, .container-fixed, .container > .row, .container-fluid > .row:not(.full-width) {
        padding: 0px;
    }

    .bodycopy, .panel-group  {
        margin: 4vh 4vw;
    }

    .footer--links {
        width: fit-content;
        display: block;
        margin: 2vh auto;
        float: none;
        padding-bottom: 5vh;
    }

    .footer--links .footer--content {
       float: none;
        clear: both;
        margin-right: 0px;
    }

    .footer--content__social {
        float: none;
        clear: both;
        margin: 2vw auto;
        width: fit-content;
        height: 5vh;
    }

    .footer--content__social img {
        margin: 2vw;
    }

    .footer--copyright {
        text-align: center;
    }

    h1 {
        font-size: clamp(2rem, 6vh, 8vh);
    }

    .breadcrumb {
        padding: 8px 0px;
    }

    .navbar-nav > li > a { /* Controls both main nav and site nav */
        padding-left: 4vw;
    }

    #brdcrmhtml { /* old site */
        margin: 0px 4vw;
        margin-top: 3vh;
    }

    .media.bodycopy .summary {
        margin-bottom: 0px;
    }

    .navbar-nav > li > a {
        font-size: clamp(16px, 1vw, 18px);
    }

    #site-nav .navbar-nav > li > a, .dropdown-menu a { /* Site nav dropdown */
        font-size: clamp(15px, .75vw, 18px);
    }

    .news-items p.date {
        margin: 0px;
        padding-top: 10px;
    }

    #top-main-search-mobile .form-group {
        margin: 0 auto;
    }

    .navbar-collapse {
        -webkit-box-shadow: none;
        box-shadow: none;
    }

    .photo.bodycopy {
        max-width: inherit;
    }

    .photo.bodycopy img {
        margin: 0 auto;
        margin-top: 6vh;
    }

    #searchMessage, .results-page.search-form, .search-results--header {
        margin: 2vh auto;
        display: table;
    }

    .bodycopy.r21--breadcrumb-module {
        margin: 3vh 4vw 0px 4vw;
    }



    /*  --------------------------------------------------|  IMAGE-MODULE__LARGE   | MOBILE */
    .bodycopy.r21--image-module__large {
        width: 100%;
        margin: 0px;
    }

        .bodycopy.r21--image-module__large img {
            width: 100%;
            border-radius: 0px;
        }



    /* ---------------------------------------------------|   IMAGE-MODULE__BANNER   | MOBILE */

    .r21--image-module__banner {
        z-index: 10;
        position: relative;
        top: 0vw;
        max-height: inherit;
        overflow: inherit;
    }



    /* ---------------------------------------------------|   COPY-MODULE__BANNER   | MOBILE */

    .r21--copy-module__banner {
        padding-bottom: inherit;
    }

    /* ---------------------------------------------------|   COPY-MODULE__BANNER   | MOBILE */
    .r21--callout-module {
        padding: 2vh 4vw;
    }


    /* ---------------------------------------------------|   LIGHTBOX-MODULE   | MOBILE */
    .redesign2021 .modal-sm {
        width: 80vw;
        margin: auto;
    }

    .modal-dialog.modal-lg {
        margin: 2vh auto;
        width: 80vw;
    }

    /* ---------------------------------------------------|   QUOTE-MODULE   | MOBILE */
    .r21--quote-module a {
        height: inherit;
        padding-bottom: .5vh;
    }

    .r21--quote-module q, .r21--quote-module p {
        padding: 0 4vw;
    }

    .r21--quote-module a img {
        padding-bottom: 2vh;
    }



    /* ---------------------------------------------------|   LIST-MODULE   | MOBILE */
    .r21--list-module {
        padding: 4vw;
    }

    .r21--list--white {
        padding: 1.5vw;
    }

    /* ---------------------------------------------------|   NEWS-MODULE   | MOBILE */

    .newsWrapper h6, .r21-press-release-header h6, .news-module--cta {
        float: none;
        text-align: center;
        padding: 0px;
        margin: 2vh 0px;
        display: block;
    }

    .alcoa-story .column-master-style .r21--copy-module {
        padding: 1vh 2vw 0px 2vw;
    }

    .r21-press-release-header h6, .r21-press-release-header {
        margin-bottom: 0px;
    }

    .newsWrapper .link--button, .r21--press-release--view-all .link--button {
        float: none;
        text-align: center;
        display: block;
        margin: 0px auto 15vw auto;
        width: fit-content;
    }

    .alcoa-story {
        display: grid;
    }

    .newsWrapper .r21--image-module {
        height: auto;
    }

    .news-items p {
        margin-bottom: 2vh;
    }


    /* ---------------------------------------------------|   NEWS-MODULE___SINGLE ITEM  | MOBILE */

    .single-item-news {
        margin-bottom: -1vw;
        overflow: auto;
    }

        .single-item-news .story--1 > .column-master-style {
            margin-bottom: 2vh;
        }

        .single-item-news .alcoa-story {
            display: block;
        }

        .single-item-news .r21--copy-module {
            border-width: 0px;
            height: auto;
            display: block;
            flex-direction: initial;
            justify-content: initial;
        }

        .single-item-news .news-module--summary {
            display: block;
            height: auto;
        }

        .single-item-news .news-items p {
            margin-bottom: 0px;
        }

        .single-item-news p:not(.news-module--cta) {
            margin-left: 0px;
            padding: 2vh 4vw;
        }

        .single-item-news .news-module--cta {
            padding: 0px 4vw;
            padding-bottom: 3vh;
        }

        .single-item-news .alcoa-story:not(.story--1), .single-item-news .alcoa-story:not(.story--1) div {
            display: none;
            position: absolute;
        }

        .single-item-news .story--1 {
            width: 100%;
        }

        .single-item-news .news-1-image {
            width: 100%;
            height: 100%;
            float: none;
            border-width: 0px;
            margin: 0 auto;
        }

        .single-item-news .news-module--title {
            margin-bottom: inherit;
            font-size: inherit;
            padding-bottom: 2vh;
        }


    /* -------------------------------------------------------------------|   STORY ARTICLES   | */

    .news-release .article--content {
        max-width: 100%;
    }

    .news-release iframe {
        margin: 0 auto;
        display: block;
        width: 90vw;
        height: 51vw;
    }

}



/* --------------------------------------------------------------|   CSS OVERRIDES   | */

.float--right {
    float: right !important;
}

.top--negative-10 {
    position: relative;
    top: -10px;
}

.margin--0 {
    margin: 0px;
}

.align-items--stretch {
    align-items: stretch !important;
}

.align-self--start {
    align-self: start;
}

.align-self--end {
    align-self: end;
}

.text-color--green {
    color: #008747 !important;
}

.display--flex {
    display: flex;
    align-items: center;
}

.display--grid {
    display: grid;
}

.margin-top--0 {
    margin-top: 0px !important;
}

.margin-top--3vw {
    margin-top: 3vw !important;
}


.row--hero-background {
    background-color: #0c3664;
}

.row--hero-feature {
    background-color: #165788;
}

.row--section-background {
    background-color: #eee;
}

.row--dark-background {
    background-color: #07213c;
}

.row--darkest-background {
    background-color: #000;
}

    .row--dark-background, .row--hero-background, .row--hero-feature, .row--darkest-background,
    .row--dark-background a, .row--hero-background a, .row--hero-feature a, .row--darkest-background a,
    .row--dark-background h6, .row--hero-background h6, .row--hero-feature h6, .row--darkest-background h6,
    main .row--dark-background a.link--cta, main .row--hero-background a.link--cta, main .row--hero-feature a.link--cta, .row--darkest-background a.link--cta {
        color: #fff;
        border-color: #fff;
    }

        .row--dark-background a:hover, .row--hero-background a:hover, .row--hero-feature a:hover, .row--darkest-background a:hover,
        .row--dark-background a.link--cta:hover, .row--hero-background a.link--cta:hover, .row--hero-feature a.link--cta:hover, .row--darkest-background a.link--cta:hover {
            color: #0c3664;
            background-color: #fff;
        }

        .row--dark-background .list--light a:hover {
            color: #1e81ea;
            background-color: #E6ECF2;
        }