:root { 
  --white: #FFF; 
  --cream: #f4f1ed;
  --body-text-colour: #1e1e1e; 
  --primary-colour: #1c434b; /* DARK TEAL */ 
  --secondary-colour: #43acc1; /* LIGHT TEAL */
  --QMOD-primary-color: #1c434b;
}

*, *:before, *:after { -moz-box-sizing: inherit; box-sizing: inherit; outline: none; -webkit-tap-highlight-color: rgba(255, 255, 255, 0);  text-rendering: auto; -webkit-font-smoothing: antialiased; }
html { box-sizing: border-box; margin: auto; overflow-x: hidden; scroll-behavior: smooth; }
body { font-family: "aktiv-grotesk", sans-serif; font-style: normal; /*font-weight: 500;*/ font-size: 16px; font-stretch: normal; font-style: normal; line-height: 1.25; letter-spacing: normal; color: var(--body-text-colour); position: relative; box-sizing: border-box; margin: 0; background: var(--cream); -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; overflow-x: hidden; }
section, header, footer { display: block; width: 100% }
h1, .h1 { font-weight: 400; font-size: 80px; line-height: 1; }
h2, .h2 { font-weight: 400; font-size: 64px; line-height: 1; }
h3, .h3 { font-weight: 400; font-size: 48px; line-height: 1; margin-bottom: 24px; margin-top: 32px; }
h4, .h4, .intro { font-weight: 400; font-size: 40px; line-height: 1.2; margin-bottom: 24px; margin-top: 32px; }
h5, .h5, .x-large { font-weight: 500; font-size: 32px; line-height: 1.25; margin-bottom: 24px; margin-top: 32px; }
h6, .h6, .larger { font-weight: 400; font-size: 24px; line-height: 1.33; margin-bottom: 24px; }
h3.title { margin-bottom: 40px; }
p { font-style: normal; font-weight: 400; font-size: 16px; font-stretch: normal; font-style: normal; line-height: 1.5; letter-spacing: normal }
h1:first-child, h2:first-child, h3:first-child, h4:first-child, h5:first-child, h6:first-child, p:first-child, .h1:first-child, .h2:first-child, .h3:first-child, .h4:first-child, .h5:first-child, .h6:first-child { margin-top: 0; }
a { text-decoration: none; color: var(--primary-colour); transition: all 0.25s ease-in-out; }
a:hover { color: var(--primary-colour) }
strong, b { font-weight: 600; }
h1 strong, h2 strong, h3 strong, h4 strong, h5 strong, h6 strong, .h1 strong, .h2 strong, .h3 strong, .h4 strong, .h5 strong, .h6 strong, .semibold { font-weight: 600; }
img, iframe { max-width: 100%; height: auto; }
input[type=submit], input[type=text], input[type='email'], input[type='search'], textarea, select, button { -webkit-appearance: none; -moz-appearance: none; box-shadow: none !important; font-style: normal; font-size: 16px; font-stretch: normal; font-style: normal; line-height: 1.25; letter-spacing: normal }
input[type=submit] { cursor: pointer; transition: all 0.50s ease-in-out }
input[type=text] { background: transparent; padding: 10px 30px; margin: 0 25px 0 0 }
input[type=text]::-webkit-input-placeholder { color: rgba(0, 0, 0, 0.75) }
select::-ms-expand { display: none }
hr { height: 1px; border: none; color: var(--primary-colour); background-color: var(--primary-colour); margin: 20px 0; opacity: 0.5; }
h3.title + hr { margin:40px 0; }
main { z-index:6 }
main ul, section ul { padding-left: 20px; }
main ul li, section ul li { line-height: 1.66; }
main ul li p:last-of-type { margin-bottom: 0; }
#width-check { z-index: 0; }
@media (max-width:1024px) {
  #width-check { z-index: 1; }
}

/* BUTTONS */
form button, .button-primary, .button { cursor: pointer; padding: 16px 24px; border: 0; display: inline-flex; justify-content: space-between; align-items: center; background-color: var(--primary-colour); color: var(--white); font-weight: 600; font-size: 16px; line-height: 1.5; transition: all 0.25s ease-in-out; }
form button:hover, .button-primary:hover, .button:hover { background-color: var(--secondary-colour); color: var(--white) }
form button::after, .button-primary::after, .button::after { content: "\f061"; font-family: "Font Awesome 7 Pro"; color: var(--secondary-colour); font-weight: 300; line-height: 1; display: inline-block; margin-left: 48px; transition: all 0.25s ease-in-out; }
form button:hover::after, .button-primary:hover::after, .button:hover::after { color: var(--white); }
.button-inverse { cursor: pointer; padding: 16px 24px; border: 0; display: inline-flex; justify-content: space-between; align-items: center; background-color: var(--white); color: var(--primary-colour); font-weight: 600; font-size: 16px; line-height: 1.5; transition: all 0.25s ease-in-out; }
.button-inverse:hover { background-color: var(--secondary-colour); color: var(--white) }
.button-inverse::after { content: "\f061"; font-family: "Font Awesome 7 Pro"; color: var(--secondary-colour); font-weight: 300; line-height: 1; display: inline-block; margin-left: 48px; transition: all 0.25s ease-in-out; }
.button-inverse:hover::after { color: var(--white); }
.top-right { position: absolute; top:0; right:60px; }
.button.taller, .button-inverse.taller { padding-top: 24px;padding-bottom: 24px; }
@media (max-width:1024px) {
  .top-right { position: relative; top:auto; right:auto; }
}


.container { margin: 0 auto; position: relative; max-width: 1800px; padding-left: 60px; padding-right: 60px; }
.flex-container { display: flex; }
@media (max-width:1024px) {
  .container { padding-left: 20px; padding-right: 20px; }
}
.button.pdf::after { content: "\f1c1" }
.button.external::after { content: "\f08e" }
.button.back:after { content: "\e632" }
.white { color: var(--white) }
.clear { clear: both }
.center { text-align: center }
.right { text-align: right }
.table-overflow { width: 100%; overflow-x: auto; }
.overflow-instruction { font-size: 12px; line-height: 16px; color: #8d8d8d; margin: 0; height: 0; opacity: 0; pointer-events: none; }
.overflow-instruction.show { opacity: 1; pointer-events: all; height: auto; padding: 12px 0 4px; margin-bottom: 32px; }
.table-overflow table { margin-bottom: 8px !important; }
.caption, .small, .caption > *, .small > * { font-size: 14px !important; }
.large, body.cat-sustainability .cols-7 p, body.cat-sustainability .mw-800 p, body.cat-sustainability .mw-800, body.str-history .cols-7 p, body.str-history .cols-7 td { font-size: 20px; line-height: 1.4; }
body.cat-sustainability .cols-7 li, body.cat-sustainability .mw-800 li, body.cat-sustainability .cols-7 li, body.str-history .cols-7 li{ font-size: 20px; }
/*
table { border-collapse: collapse }
table tr { border-bottom: 0.5px solid #6a6a6a }
table th { padding: 20px 0 20px 24px; text-align: left; white-space: nowrap; font-style: normal; font-weight: 700; font-size: 16px; font-stretch: normal; font-style: normal; line-height: 1.5; letter-spacing: normal }
table td { padding: 12px 0 12px 24px; text-align: left }
table td:last-child, table th:last-child { padding-right: 24px }
table th { background-color: #e1e0e3 }
*/
body.cat-news table { width: 100%; border-collapse: collapse; }
body.cat-news table tr th, body.cat-news table tr td { padding:5px; }
body.cat-news table tr th >:last-child, body.cat-news table tr td >:last-child { margin-bottom: 0; }
body.cat-news table tr:nth-of-type(even) { background: var(--white); border-top: 1px solid #e5e5e5; border-bottom: 1px solid #e5e5e5; }
/*body.cat-news table tr:nth-of-type(even) { background: #FAFAFA; }*/

table.styled, .str-reserves-resources .tab-content table { width: 100%; border-collapse: collapse; margin-bottom: 32px; }
table.styled tr th, .str-reserves-resources .tab-content table tr th { padding:5px; text-align: left; background-color:var(--primary-colour); color:var(--white); }
table.styled tr td, .str-reserves-resources .tab-content table tr td { padding:5px; }
table.styled tr:nth-of-type(odd), .str-reserves-resources .tab-content table tr:nth-of-type(odd) { background: var(--white); border-top: 1px solid #e5e5e5; border-bottom: 1px solid #e5e5e5; }
@media (max-width:1024px) {
  h1, .h1 { font-size: 48px; }
  h2, .h2 { font-size: 44px; }
  h3, .h3 { font-size: 40px; }
  h4, .h4, .intro { font-size: 32px; }
  h5, .h5, .x-large { font-size: 24px; }
  h6, .h6, .larger { font-size: 20px; }
  .large { font-size: 18px; }
  table th { font-style: normal; font-weight: 700; font-size: 14px; font-stretch: normal; font-style: normal; line-height: 1.43; letter-spacing: normal }
}
p.instruction { font-size: 12px; line-height: 16px; color: rgba(28,67,75,0.75); margin: 4px 0; opacity: 0; pointer-events: none }
p.instruction.show { opacity: 1; pointer-events: all }
.screen-reader-text { display: none; }
.grecaptcha-badge { display: none !important }
.grecaptcha-badge.show { display: block !important; visibility: visible !important }
.transition { animation-duration: 1s; animation-fill-mode: both; opacity: 0; /*position: relative;*/ visibility: hidden }
.fadeIn { animation-name: fadeIn; transition: all 0.8s ease 0s }
.fadeInRight { animation-name: fadeInRight; transition: all 0.8s ease 0s }
.fadeInLeft { animation-name: fadeInLeft; transition: all 0.8s ease 0s }
.fadeInUp { animation-name: fadeInUp; transition: all 0.8s ease 0s }

.pt-12x { padding-top: 96px; }
.pb-12x { padding-bottom: 96px; }
.ptb-12x { padding-top: 96px; padding-bottom: 96px; }
.pt-11x { padding-top: 88px; }
.pb-11x { padding-bottom: 88px; }
.ptb-11x { padding-top: 88px; padding-bottom: 88px; }
.pt-10x { padding-top: 80px; }
.pb-10x { padding-bottom: 80px; }
.ptb-10x { padding-top: 80px;  padding-bottom: 80px; }
.pt-9x { padding-top: 72px }
.pb-9x { padding-bottom: 72px }
.ptb-9x { padding-top: 72px; padding-bottom: 72px }
.pt-8x { padding-top: 64px; }
.pb-8x { padding-bottom: 64px; }
.ptb-8x { padding-top: 64px; padding-bottom: 64px; }
.pt-7x { padding-top: 56px; }
.pb-7x { padding-bottom: 56px; }
.ptb-7x { padding-top: 56px; padding-bottom: 56px; }
.pt-6x { padding-top: 48px; }
.pb-6x { padding-bottom: 48px; }
.ptb-6x { padding-top: 48px; padding-bottom: 48px; }
.ptb-5x { padding-top: 40px; padding-bottom: 40px; }
.pt-5x { padding-top: 40px; }
.pb-5x { padding-bottom: 40px; }
.pt-4x { padding-top: 32px; }
.pb-4x { padding-bottom: 32px; }
.ptb-4x { padding-top: 32px; padding-bottom: 32px; }
.pt-2x { padding-top: 16px; }
.pb-2x { padding-bottom: 16px; }
.ptb-2x { padding-top: 16px; padding-bottom: 16px; }
.mt-12x { margin-top: 96px; }
.mt-10x { margin-top: 80px; }
.mt-9x { margin-top: 72px; }
.mt-8x { margin-top: 64px; }
.mt-6x { margin-top: 48px; }
.mt-5x { margin-top: 40px; }
.mt-4x { margin-top: 32px; }
.mt-3x { margin-top: 24px; }
.mt-0x { margin-top: 0; }
.mb-12x { margin-bottom: 96px; }
.mb-10x { margin-bottom: 80px; }
.mb-9x { margin-bottom: 72px; }
.mb-8x { margin-bottom: 64px; }
.mb-6x { margin-bottom: 48px; }
.mb-5x { margin-bottom: 40px; }
.mb-4x { margin-bottom: 32px; }
.mb-3x { margin-bottom: 24px; }
.mb-2x { margin-bottom: 16px; }
@media (max-width:1024px) {
  .md-pt-12x { padding-top: 96px }
  .md-pb-12x { padding-bottom: 96px }
  .md-ptb-12x { padding-top: 96px; padding-bottom: 96px }
  .md-pt-11x { padding-top: 88px }
  .md-pb-11x { padding-bottom: 88px }
  .md-ptb-11x { padding-top: 88px; padding-bottom: 88px }
  .md-pt-10x { padding-top: 80px; }
  .md-pb-10x { padding-bottom: 80px; }
  .md-ptb-10x { padding-top: 80px;  padding-bottom: 80px; }
  .md-pt-9x { padding-top: 72px }
  .md-pb-9x { padding-bottom: 72px }
  .md-ptb-9x { padding-top: 72px; padding-bottom: 72px }
  .md-pt-8x { padding-top: 64px }
  .md-pb-8x { padding-bottom: 64px }
  .md-ptb-8x { padding-top: 64px; padding-bottom: 64px }
  .md-pt-7x { padding-top: 56px }
  .md-pb-7x { padding-bottom: 56px }
  .md-ptb-7x { padding-top: 56px; padding-bottom: 56px }
  .md-pt-6x { padding-top: 48px }
  .md-pb-6x { padding-bottom: 48px }
  .md-ptb-6x { padding-top: 48px; padding-bottom: 48px }
  .md-pt-5x { padding-top: 40px }
  .md-pb-5x { padding-bottom: 40px }
  .md-ptb-5x { padding-top: 40px; padding-bottom: 40px }
  .md-pt-4x { padding-top: 32px }
  .md-pb-4x { padding-bottom: 32px }
  .md-ptb-4x { padding-top: 32px; padding-bottom: 32px }
  .md-pt-2x { padding-top: 16px }
  .md-mt-12x { margin-top: 96px; }
  .md-mt-10x { margin-top: 80px; }
  .md-mt-9x { margin-top: 72px; }
  .md-mt-8x { margin-top: 64px; }
  .md-mt-4x { margin-top: 32px; }
}
@media (max-width:768px) {
  .sm-pt-12x { padding-top: 96px }
  .sm-pb-12x { padding-bottom: 96px }
  .sm-ptb-12x { padding-top: 96px; padding-bottom: 96px }
  .sm-pt-11x { padding-top: 88px }
  .sm-pb-11x { padding-bottom: 88px }
  .sm-ptb-11x { padding-top: 88px; padding-bottom: 88px }
  .sm-pt-10x { padding-top: 80px; }
  .sm-pb-10x { padding-bottom: 80px; }
  .sm-ptb-10x { padding-top: 80px;  padding-bottom: 80px; }
  .sm-pt-9x { padding-top: 72px }
  .sm-pb-9x { padding-bottom: 72px }
  .sm-ptb-9x { padding-top: 72px; padding-bottom: 72px }
  .sm-pt-8x { padding-top: 64px }
  .sm-pb-8x { padding-bottom: 64px }
  .sm-ptb-8x { padding-top: 64px; padding-bottom: 64px }
  .sm-pt-7x { padding-top: 56px }
  .sm-pb-7x { padding-bottom: 56px }
  .sm-ptb-7x { padding-top: 56px; padding-bottom: 56px }
  .sm-pt-6x { padding-top: 48px }
  .sm-pb-6x { padding-bottom: 48px }
  .sm-ptb-6x { padding-top: 48px; padding-bottom: 48px }
  .sm-pt-5x { padding-top: 40px }
  .sm-pb-5x { padding-bottom: 40px }
  .sm-ptb-5x { padding-top: 40px; padding-bottom: 40px }
  .sm-pt-4x { padding-top: 32px }
  .sm-pb-4x { padding-bottom: 32px }
  .sm-ptb-4x { padding-top: 32px; padding-bottom: 32px }
  .sm-mt-12x { margin-top: 96px; }
  .sm-mt-10x { margin-top: 80px; }
  .sm-mt-9x { margin-top: 72px; }
  .sm-mt-8x { margin-top: 64px; }
  .sm-mt-4x { margin-top: 32px; }
}
.aic { -webkit-align-items: center; align-items: center; }
.aifs { -webkit-align-items: flex-start; align-items: flex-start; }
.aife { -webkit-align-items: flex-end; align-items: flex-end; }
.jcc { -webkit-justify-content: center; justify-content: center; }
.jcsb { -webkit-justify-content: space-between; justify-content: space-between; }
.ttu { text-transform: uppercase; }
.border-top { border-top: 1px solid var(--body-text-colour); }
.dark-teal { color:var(--primary-colour); }
.light-teal { color:var(--secondary-colour); }

.full-width { width: 100vw; position: relative; left: 50%; right: 50%; margin-left: -50vw; margin-right: -50vw; }
.far-right { width: calc(100vw - 120px); }
.white-bg { background-color: var(--white); }
.mw-800 { max-width: 800px; }


ul.cols.three-column { list-style: none; padding-left: 0; margin: 0; display: grid; grid-template-columns: repeat(3, 1fr); column-gap: 20px; -webkit-align-items: flex-start; align-items: flex-start; }
ul.cols.four-column { list-style: none; padding-left: 0; margin: 0; display: grid; grid-template-columns: repeat(4, 1fr); column-gap: 20px; -webkit-align-items: flex-start; align-items: flex-start; }
ul.cols > li { border-left: 1px solid var(--primary-colour); padding: 0px 24px; margin-bottom: 24px; position: relative; height: calc(100% - 24px); }
ul.cols > li strong:first-of-type { display: inline-block; color: var(--primary-colour); font-weight: 400; font-size: 24px; line-height: 1.33; }
ul.cols > li p:last-of-type { margin-bottom: 0; }
ul.cols.stats > li { border-left:1px solid var(--secondary-colour); }
ul.cols.stats > li strong:first-of-type { color: var(--primary-colour); font-size: 32px; font-weight:600; margin-bottom: 6px; }
ul.icons > li:before { color: var(--secondary-colour); display: block; font-family: "Font Awesome Kit"; font-size: 40px; line-height: 0.8; margin-bottom: 36px; }
ul.icons > li.safety:before { content:"\e002"; }
ul.icons > li.respect:before { content:"\e001"; }
ul.icons > li.integrity:before { content:"\e003"; }
ul.icons > li.excellence:before { content:"\e000"; }
ul.icons > li.operations:before { content:"\e004"; }
ul.icons > li.growth-strategy:before { content:"\e005"; }
ul.icons > li.financial-strength:before { content:"\e006"; }

@media (max-width:1024px) {
  ul.cols.three-column, ul.cols.four-column { grid-template-columns: repeat(2, 1fr); }
  ul.cols > li strong { font-size: 20px; }
  ul.cols.stats > li strong:first-of-type { font-size: 24px; font-weight: 500; }
  .md-reverse > *:first-of-type { order:1; margin-top: 32px; }
  .md-reverse.no-margin > *:first-of-type { margin-top: 0; }
}
@media (max-width:768px) {
  ul.cols.three-column, ul.cols.four-column { grid-template-columns: repeat(1, 1fr); }
  ul.cols > li:last-of-type { margin-bottom: 0; height: auto; }
  .mob-reverse > *:first-of-type { order:1; margin-top: 32px; }
  .mob-reverse.no-margin > *:first-of-type { margin-top: 0px; }
}



/* COLS REDO */
table.cols, table.cols tbody { display: block; }
table.cols tr { display:grid; grid-template-columns: repeat(auto-fit, minmax(0, 1fr)); column-gap: 20px; border:none; }
table.cols tr td { padding: 12px 0 12px 24px; }
table.cols.border-left tr td { border-left: 1px solid rgba(28,67,75,0.5); padding-top: 0; padding-bottom: 0; }
table.cols.icons td h6 { font-weight: 600; margin-bottom: 0; }
table.cols.icons td p:last-of-type { margin-bottom: 0; }
table.cols.icons td:before { color: var(--secondary-colour); display: block; font-family: "Font Awesome Kit"; font-size: 40px; line-height: 0.8; margin-bottom: 32px; }
table.cols.icons td.diamond:before { content:"\e000"; }
table.cols.icons td.operations:before { content:"\e004"; }
table.cols.icons td.users-three:before { content:"\e007"; }
table.cols.icons td.globe:before { content:"\e008"; }
table.cols.icons td.leaf:before { content:"\e00a"; }
table.cols.icons td.handshake:before { content:"\e001"; }
table.cols.icons td.gavel:before { content:"\e009"; }
table.cols.icons td.shield:before { content:"\e003"; }
table.cols.icons td.financial:before { content:"\e006"; }
table.cols.icons td.money-hand:before { content:"\e621"; font-family: "Font Awesome 7 Pro"; font-weight: 300; font-size: 32px;   }
table.cols.icons td.lighthouse:before { content:"\e612"; font-family: "Font Awesome 7 Pro"; font-weight: 300; font-size: 32px;  }
table.cols.icons td.safety:before { content:"\e002"; }
table.cols.icons td.respect:before { content:"\e001"; }
table.cols.icons td.integrity:before { content:"\e003"; }
table.cols.icons td.excellence:before { content:"\e000"; }
table.cols.icons td.operations:before { content:"\e004"; }
table.cols.icons td.growth-strategy:before { content:"\e005"; }
table.cols.icons td.up-right-arrow:before { content:"\e006"; }
table.cols.contact td { border-left:none; border-top: 1px solid rgba(28,67,75,0.5); padding: 24px 0; }
table.cols.contact td strong { font-weight:600; color:var(--body-text-colour); }
/*table.cols.contact td a  { word-break:break-all }*/

table.cols.stats tr td { border-left:1px solid var(--secondary-colour); display: flex; height:100%; flex-direction:column; -webkit-justify-content: center; justify-content: center; }
body.cat-our-portfolio table.cols.stats tr td .h5 { margin-bottom: 8px; }
body.cat-our-portfolio table.cols.stats tr td p:first-of-type { margin-top: 0; }
body.cat-our-portfolio table.cols.stats tr td p:last-of-type { margin-bottom: 0; }

table.cols.white-bg { background-color: transparent; }
table.cols.white-bg tr td { background-color: var(--white); padding:24px; }

@media (max-width:1339px) {
  table.cols.contact td .h6 { min-height:64px; }
}

@media (max-width:1200px) {
  table.cols.contact td .h6 { min-height:auto; }
  table.cols tr { grid-template-columns: repeat(2, 1fr); }
  table.cols tr td { margin-bottom: 24px; }
  table.cols.stats tr td { height:calc(100% - 24px); }
}
@media (max-width:768px) {
  table.cols tr { grid-template-columns: repeat(1, 1fr); }
}


/* GRID */
.grid { display: grid; grid-template-columns: repeat(12, 1fr); grid-template-rows: auto; column-gap: 20px; }
.grid-collapse { display: grid; grid-template-columns: repeat(12, 1fr); grid-template-rows: auto; }
.grid.no-gutter { column-gap: 0px !important; }
.grid.large-gutter{ column-gap: 64px !important; }

.cols-1 { grid-column: span 1 }
.cols-2 { grid-column: span 2 }
.cols-3 { grid-column: span 3 }
.cols-4 { grid-column: span 4 }
.cols-5 { grid-column: span 5 }
.cols-6 { grid-column: span 6 }
.cols-7 { grid-column: span 7 }
.cols-8 { grid-column: span 8 }
.cols-9 { grid-column: span 9 }
.cols-10 { grid-column: span 10 }
.cols-11 { grid-column: span 11 }
.cols-12 { grid-column: span 12 }
@media (max-width:1600px) {
  .xxl-cols-2 { grid-column: span 2 }
  .xxl-cols-3 { grid-column: span 3 }
  .xxl-cols-4 { grid-column: span 4 }
  .xxl-cols-5 { grid-column: span 5 }
  .xxl-cols-6 { grid-column: span 6 }
  .xxl-cols-7 { grid-column: span 7 }
  .xxl-cols-8 { grid-column: span 8 }
  .xxl-cols-9 { grid-column: span 9 }
  .xxl-cols-10 { grid-column: span 10 }
  .xxl-cols-11 { grid-column: span 11 }
  .xxl-cols-12 { grid-column: span 12 }
}
@media (max-width:1440px) {
  .xl-cols-2 { grid-column: span 2 }
  .xl-cols-3 { grid-column: span 3 }
  .xl-cols-4 { grid-column: span 4 }
  .xl-cols-5 { grid-column: span 5 }
  .xl-cols-6 { grid-column: span 6 }
  .xl-cols-7 { grid-column: span 7 }
  .xl-cols-8 { grid-column: span 8 }
  .xl-cols-9 { grid-column: span 9 }
  .xl-cols-10 { grid-column: span 10 }
  .xl-cols-11 { grid-column: span 11 }
  .xl-cols-12 { grid-column: span 12 }
}
@media (max-width:1280px) {
  .lg-cols-2 { grid-column: span 2 }
  .lg-cols-3 { grid-column: span 3 }
  .lg-cols-4 { grid-column: span 4 }
  .lg-cols-5 { grid-column: span 5 }
  .lg-cols-6 { grid-column: span 6 }
  .lg-cols-7 { grid-column: span 7 }
  .lg-cols-8 { grid-column: span 8 }
  .lg-cols-9 { grid-column: span 9 }
  .lg-cols-10 { grid-column: span 10 }
  .lg-cols-11 { grid-column: span 11 }
  .lg-cols-12 { grid-column: span 12 }
}
@media (max-width:1024px) {
  .md-cols-0 { display: none; }
  .md-cols-2 { grid-column: span 2 }
  .md-cols-3 { grid-column: span 3 }
  .md-cols-4 { grid-column: span 4 }
  .md-cols-5 { grid-column: span 5 }
  .md-cols-6 { grid-column: span 6 }
  .md-cols-7 { grid-column: span 7 }
  .md-cols-8 { grid-column: span 8 }
  .md-cols-9 { grid-column: span 9 }
  .md-cols-10 { grid-column: span 10 }
  .md-cols-11 { grid-column: span 11 }
  .md-cols-12 { grid-column: span 12 }
}
@media (max-width:768px) {
  .sm-cols-0 { display: none; }
  .sm-cols-2 { grid-column: span 2 }
  .sm-cols-3 { grid-column: span 3 }
  .sm-cols-4 { grid-column: span 4 }
  .sm-cols-5 { grid-column: span 5 }
  .sm-cols-6 { grid-column: span 6 }
  .sm-cols-7 { grid-column: span 7 }
  .sm-cols-8 { grid-column: span 8 }
  .sm-cols-9 { grid-column: span 9 }
  .sm-cols-10 { grid-column: span 10 }
  .sm-cols-11 { grid-column: span 11 }
  .sm-cols-12 { grid-column: span 12 }
  .grid.large-gutter{ column-gap: 20px !important; }
}
@media (max-width:480px) {
  .xs-cols-2 { grid-column: span 2 }
  .xs-cols-3 { grid-column: span 3 }
  .xs-cols-4 { grid-column: span 4 }
  .xs-cols-5 { grid-column: span 5 }
  .xs-cols-6 { grid-column: span 6 }
  .xs-cols-7 { grid-column: span 7 }
  .xs-cols-8 { grid-column: span 8 }
  .xs-cols-9 { grid-column: span 9 }
  .xs-cols-10 { grid-column: span 10 }
  .xs-cols-11 { grid-column: span 11 }
  .xs-cols-12 { grid-column: span 12 }
}

/* HEADER */
header.desktop { position: fixed; left: 0; top: 0; right: 0; width: 100%; z-index: 99; }
header.desktop .top { background-color: var(--primary-colour); height: 28px; transition: all 0.25s ease-in-out; }
header.desktop .top .container { align-items: center; justify-content: space-between; height: 100%; }
header.desktop .top div { color: var(--white); font-style: normal; font-weight: 700; font-size: 12px; font-stretch: normal; font-style: normal; line-height: 1.33; letter-spacing: normal }
header.desktop .top .language {position: relative; }
header.desktop .top .language > div { position: absolute; right: 0; top: -13px; width: 115px !important; font-family: "aktiv-grotesk", sans-serif;  }
header.desktop .top .language a { color: #FFF; text-transform: uppercase; }
header.desktop .top .language img { display: none !important; }
header.desktop .top .stock-quote { color: var(--white); }
header.desktop .top .stock-quote span { margin-left: 16px; margin-right: 24px; position: relative; }
header.desktop .top .stock-quote span:after { display: none; content: "\f2ec"; font-family: "Font Awesome 7 Pro"; color: var(--white); padding-left: 10px; font-size: 9px; position: relative; }
header.desktop .top .stock-quote span.up:after { display: inline-block; top:-1px; }
header.desktop .top .stock-quote span.down:after { display: inline-block; transform: rotate(180deg); top: -2px; left: 8px; }
header.desktop .bottom { transition: all 0.25s ease-in-out; background-color: rgba(244,241,237,0); border-top: 1px solid rgba(244,241,237,0.5); border-bottom: 1px solid rgba(244,241,237,0.5); }
header.desktop .bottom .container { align-items: center; justify-content: flex-end; }
header.desktop .bottom .logo { margin: 28px auto 24px 0; transition: all 0.25s ease-in-out; height: 33px; }
header.desktop .bottom .logo:hover { opacity: 0.65; }
header.desktop .bottom .logo path { transition: all 0.25s ease-in-out; }
header.desktop .bottom nav ul { list-style: none; padding: 0; margin: 0; }
header.desktop .bottom nav > ul > li { display: inline-block; padding: 0; position: relative; }
header.desktop .bottom nav > ul > li a { font-weight: 400; font-size: 16px; line-height: 1.5; color: var(--cream); display: block; padding: 30px 16px; position: relative; z-index: 10; }
header.desktop .bottom nav > ul > li:hover > a { color: var(--secondary-colour); }
header.desktop .bottom nav > ul > li > a[title="Our Portfolio"] + ul { min-width: 260px; }
header.desktop .bottom nav > ul ul li { position: relative; padding: 0;  }
header.desktop .bottom nav > ul ul li a { display: block; padding: 14px 8px; font-style: normal; font-weight: 400; font-size: 16px; font-stretch: normal; font-style: normal; line-height: 1.25; letter-spacing: normal; transition: all 0.25s ease-in-out; color: var(--primary-colour) }
header.desktop .bottom nav > ul ul li a[title="Operations"], header.desktop .bottom nav > ul ul li a[title="Projects"] { pointer-events: none; cursor:text; color: var(--primary-colour); font-weight: 600; padding-left: 8px; padding-bottom: 4px; }
header.desktop .bottom nav > ul ul li a:hover { color: #FFF; background-color: var(--secondary-colour); }
header.desktop .bottom nav > ul > li > ul { top:calc(100% + 1px); left: 8px; z-index: 9; pointer-events: none; opacity: 0; visibility: hidden; background: var(--cream); min-width: 250px; position: absolute; transition: visibility 0s linear 0.1s, opacity 0.3s linear, translate 0.25s linear; border-top:2px solid var(--secondary-colour); box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px; }
header.desktop .bottom nav > ul > li > ul > li { border-bottom: 1px solid rgba(28,67,75,0.25); }
header.desktop .bottom nav > ul > li > ul > li:last-of-type { border-bottom:none; }
header.desktop .bottom nav > ul > li:hover > ul { pointer-events: auto; opacity: 1; visibility: visible; transition-delay: 0s, 0s, 0.3s;  }
header.desktop .bottom nav > ul > li > ul > li > ul > li a { padding:14px 8px 14px 16px; border-bottom: 1px solid rgba(28,67,75,0.25);  }
header.desktop .bottom nav > ul > li > ul > li > ul > li:last-of-type a { border-bottom:none; }
header.desktop.scrolled .top { position: relative; opacity: 0; height: 0; }
header.desktop.scrolled .bottom { border-bottom:none; }
header.desktop.scrolled .bottom .logo { margin: 12px auto 12px 0; }
header.desktop.scrolled .bottom nav > ul > li > a { padding: 20px 16px; }
header.desktop.scrolled .bottom nav > ul > li > ul { top:100%; }
header.desktop .search-icon { margin-left: 16px; }
header.desktop .search-icon a { color: var(--cream); cursor: pointer; transition: all 0.25s ease-in-out; }
header.desktop .search-icon a:hover { opacity: 0.7; }
header.desktop:hover, header.desktop.scrolled {color: var(--primary-colour); }
header.desktop:hover .bottom, header.desktop.scrolled .bottom { background-color: var(--cream); color: var(--primary-colour); box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px; }
header.desktop:hover .bottom .logo path, header.desktop.scrolled .bottom .logo path { fill: var(--primary-colour); }
header.desktop:hover .bottom nav > ul > li a, header.desktop.scrolled .bottom nav > ul > li a { color: var(--primary-colour); }
header.desktop:hover .bottom nav > ul > li:hover > a, header.desktop.scrolled .bottom nav > ul > li:hover > a { color: var(--secondary-colour); }
header.desktop:hover .search-icon a, header.desktop.scrolled .search-icon a { color: var(--primary-colour); }


header.mobile { display: none; position: fixed; left: 0; top: 0; width: 100%; z-index: 1000 }
header.mobile > .top { position: relative; z-index: 9; display: flex; justify-content: space-between; padding: 8px 20px; width: 100%; height: 64px; align-items: center; }
header.mobile > .top .hamburger { width: 33px; cursor: pointer; overflow: hidden }
header.mobile > .top .hamburger span { width: 100%; height: 1px; background-color: var(--cream); margin-bottom: 7px; display: block; transition: all 0.25s ease-in-out; }
header.mobile > .top .hamburger span:last-of-type { margin-bottom: 0 }
header.mobile > .top .logo a { display: block; line-height: 0; }
header.mobile > .top .logo svg { height: 27px; width:207px; transition: all 0.25s ease-in-out; }
header.mobile.scrolled > .top, header.mobile.open > .top { background-color: var(--cream); }
header.mobile.scrolled > .top .hamburger span, header.mobile.open > .top .hamburger span { background-color: var(--primary-colour); }
header.mobile.scrolled > .top .logo svg path, header.mobile.open > .top .logo svg path { fill: var(--primary-colour); }
header.mobile nav { display: none; width: 100%; height: calc(100vh - 64px); height: calc(100dvh - 64px); overflow-y: auto; background-color: var(--cream) }
header.mobile nav ul { list-style: none; padding: 0; margin: 0 }
header.mobile nav > ul { position: relative; z-index: 2; padding-top: 24px; padding-bottom: 40px; background-color: var(--cream) }
header.mobile nav > ul > li { position: relative }
header.mobile nav > ul > li a { font-style: normal; font-weight: 500; font-size: 24px; font-stretch: normal; font-style: normal; line-height: 1.25; letter-spacing: normal; color: var(--primary-colour); display: block; margin: 0 20px; padding: 8px 0; position: relative }
header.mobile nav > ul > li > ul { display: none; background-color: var(--white); padding:8px 0; }
header.mobile nav > ul > li > ul a { display: block; padding: 8px 20px; margin: 0; font-style: normal; font-weight: 600; font-size: 18px; font-stretch: normal; font-style: normal; line-height: 1.18; letter-spacing: normal; transition: all 0.25s ease-in-out }
header.mobile nav > ul > li > ul ul li a { padding: 4px 32px 8px 32px; font-weight: 600 }
header.mobile nav > ul > li > ul a[title="Operations"], header.mobile nav > ul > li > ul a[title="Projects"] { pointer-events: none; cursor:text; color: var(--body-text-colour); font-weight: 600; }
header.mobile nav > ul > li.has-children > a:after { content: "\f067"; right: 0; position: absolute; font-family: "Font Awesome 7 Pro"; font-weight: 400; line-height: 1; display: inline-block; text-rendering: auto; -webkit-font-smoothing: antialiased; font-size: 24px; line-height: 40px }
header.mobile nav > ul > li.has-children.active > a:after { content: "\f068" }
header.mobile nav .footer { width: 100%; padding: 24px 20px; font-size: 13px; font-weight: 500; position: absolute; z-index: 0; bottom: 0; left: 0; right: 0; opacity: 0; transition: all 0.25s ease-in-out; }
header.mobile nav .search a { color: var(--primary-colour) }
header.mobile nav .social { margin-top: 8px }
header.mobile nav .social a { color: var(--primary-colour); margin-right: 24px }
header.mobile nav .stock-quote { color: var(--primary-colour); justify-content: space-between; margin: 16px 0px }
header.mobile.open .top { background-color: var(--cream) }
header.mobile.open .hamburger { height: 28px }
header.mobile.open .hamburger span { background-color: var(--primary-colour); }
header.mobile.open .hamburger span:nth-child(1) { margin-left: 50px }
header.mobile.open .hamburger span:nth-child(2) { transform: translate(0px, 4px) rotate(45deg); border-radius: 2px }
header.mobile.open .hamburger span:nth-child(3) { transform: translate(0px, -4px) rotate(-45deg); border-radius: 2px }
header.mobile.open nav .footer { opacity: 1 }
header.mobile .search { position: relative }
header.mobile .search .search-icon { width: 32px; flex-shrink: 0; color: var(--cream); }
header.mobile .search-form { position: relative; width: 56px; height: 40px }
header.mobile .search-form input { border-radius: 8px; padding: 4px }
header.mobile .search-form input[type="submit"] { padding: 4px 8px; position: absolute; top: 2px; right: 2px; height: 36px }
header.mobile #mobile_search_toggle { position: absolute; left: 0; width: 24px; height: 24px; opacity: 0 }
header.mobile #mobile_search_toggle:checked ~ .search-form { visibility: visible; width: 100% }
nav:has(~ .search #search_toggle:checked) { opacity: 0; transition: opacity 0.25s ease }

@media (max-width:1200px) {
  header.desktop .bottom .logo, header.desktop .bottom .logo svg { height: 27px; width:207px; }
  header.desktop .bottom nav > ul > li a, header.desktop.scrolled .bottom nav > ul > li > a { padding: 20px 10px; }
  header.desktop .search-icon { margin-left: 10px; }
}
@media (max-width:768px) {
  footer .bottom .copyright span:last-of-type { display: block; margin-bottom: 12px; }
  footer .bottom .copyright span:last-of-type a { margin-left: 0; padding-left: 0; border-left:none; }
}

@media screen and (max-width:1024px) {
  header.desktop { display: none !important }
  header.mobile { display: block !important }
}

/* HERO */
#hero { position: relative; width: 100%; z-index: 5; color: var(--cream); overflow: hidden; }
#hero #curve-right { width: 600px; height: 600px; position:absolute; right:0;  top:5%; }
#hero .background { height: 375px; background-repeat: no-repeat; background-position: center; background-size: cover; background-color: var(--primary-colour); padding-top: 144px; }
#hero .background .text { width: 100%; }
body.cat-our-portfolio:not(.str-our-portfolio):not(.str-reserves-resources) #hero .background .text { height: 100%; display: flex; flex-direction:column; -webkit-justify-content: space-between; justify-content: space-between; }
#hero .background .text .breadcrumbs { padding-top: 32px; }
#hero .background .text .stats { margin-bottom: 16px; }
#hero .background .text .stats > * { border-left: 1px solid rgba(67,172,193,0.5); padding-left: 24px; margin-bottom: 16px; }
#hero .background .text .stats h5, #hero .background .text .stats .h5 { margin-bottom: 8px; margin-top: 0; }
#hero .background .text .stats p { margin: 0; }
#hero .flex-container { -webkit-align-items: flex-end; align-items: flex-end; height: 100%; font-size: 14px; }
#hero .flex-container h1 { margin-top: 40px; margin-bottom: 32px; }
body.subcat-projects #hero .flex-container h1, body.subcat-operations #hero .flex-container h1 { max-width:775px; }
#hero .flex-container a:not(.button-inverse) { color: var(--cream); font-weight: 600; text-decoration: underline; }
#hero .flex-container .microsite { position: absolute; bottom: 32px; right: 60px; }
body.str-about #hero .background { background-image: url(../../../../_resources/hero/about.jpg); height:650px; background-position: top center; animation-duration: 1s; animation-fill-mode: both; opacity: 0; animation-name: fadeIn; }
body.str-sustainability #hero .background { background-image: url(../../../../_resources/hero/sustainability.jpg); height:650px; background-position: bottom center; animation-duration: 1s; animation-fill-mode: both; opacity: 0; animation-name: fadeIn; }
body.str-our-portfolio #hero .background { background-image: url(../../../../_resources/hero/our_portfolio.jpg); height:650px; background-position: bottom center; animation-duration: 1s; animation-fill-mode: both; opacity: 0; animation-name: fadeIn; }
body.str-investors #hero .background { background-image: url(../../../../_resources/hero/investors.jpg); height:650px; background-position: top center; animation-duration: 1s; animation-fill-mode: both; opacity: 0; animation-name: fadeIn; }
body.cat-careers #hero .background { background-image: url(../../../../_resources/hero/careers.jpg); height:650px; background-position: top right; animation-duration: 1s; animation-fill-mode: both; opacity: 0; animation-name: fadeIn; }
body.str-candelaria #hero .background { background-image: url(../../../../_resources/hero/candelaria.jpg); height:650px; background-position: top center; animation-duration: 1s; animation-fill-mode: both; opacity: 0; animation-name: fadeIn; }
body.str-caserones #hero .background { background-image: url(../../../../_resources/hero/caserones.jpg); height:650px; background-position: top left; animation-duration: 1s; animation-fill-mode: both; opacity: 0; animation-name: fadeIn; }
body.str-chapada #hero .background { background-image: url(../../../../_resources/hero/chapada.jpg); height:650px; background-position: top center; animation-duration: 1s; animation-fill-mode: both; opacity: 0; animation-name: fadeIn; }
body.str-vicuna-district #hero .background { background-image: url(../../../../_resources/hero/vicuna.jpg); height:650px; background-position: top center; animation-duration: 1s; animation-fill-mode: both; opacity: 0; animation-name: fadeIn; }
body.str-news:not(.news) #hero .background { background-image: url(../../../../_resources/hero/news.jpg); height:650px; background-position: top center; animation-duration: 1s; animation-fill-mode: both; opacity: 0; animation-name: fadeIn; }

body.str-about #hero #curve-right,
body.str-sustainability #hero #curve-right,
body.str-our-portfolio #hero #curve-right,
body.str-investors #hero #curve-right,
body.cat-careers #hero #curve-right,
body.str-candelaria #hero #curve-right,
body.str-caserones #hero #curve-right,
body.str-chapada #hero #curve-right,
body.str-vicuna-district #hero #curve-right { display: none; }

@media (max-width:1024px) {
  #hero #curve-right { left:50%; right:auto; top:-5%; }
}
@media (max-width:1024px) {
  #hero .background { height: 320px; padding-top: 64px; }
  #hero .background .text { height: 100%; display: flex; flex-direction:column; -webkit-justify-content: space-between; justify-content: space-between; }
  #hero .flex-container h1 { margin-top: auto; }
  #hero .flex-container .microsite { position: relative; right: auto; margin-top: 32px; }
}
@media (max-width:768px) {
  body.cat-careers #hero .background { background-position: 90% center; }
  #hero .background .text .stats > * { padding-left: 16px; }
  #hero .background .text .stats h5, #hero .background .text .stats .h5 { margin-bottom: 4px; margin-top: 0; }
}

/* STORIES */
.story-item { border-left: 1px solid var(--primary-colour); color: var(--primary-colour); margin-bottom: 24px; position: relative; transition: all 0.25s ease-in-out; }
.story-item span { display: block; }
.story-item .image { height:300px; background-repeat: no-repeat; background-size:cover; background-position: center; position: relative; }
.story-item .image:before { content:""; position: absolute; top:0; left:0; width: 100%; height: 100%; background:#000; opacity: 0; transition: all 0.25s ease-in-out; }
.story-item .details { padding:16px 24px 64px 24px; }
.story-item .date { margin-bottom: 16px; }
.story-item .title { font-size: 20px; line-height: 1.4; }
.story-item .arrow { position: absolute; left:24px; bottom:16px; font-size: 10px; background-color: var(--primary-colour); color: var(--secondary-colour); width: 28px; height:28px; display: flex; -webkit-align-items: center; align-items: center; -webkit-justify-content: center; justify-content: center; transition: all 0.25s ease-in-out; }
.story-item:hover { background-color: var(--primary-colour); color: var(--white); }
.story-item:hover .arrow { background-color: var(--white); }
.story-item:hover .image:before { opacity: 0.2; }
body.cat-news .story-item { margin-bottom: 48px; }
@media (max-width:768px){
  .story-item { padding-right: 0; }
}

/* NEWS */
section#news { background: var(--white); }
section#news .latest-news-releases { margin-top: 96px; }
.news-item { border-left: 1px solid var(--primary-colour); color: var(--primary-colour); padding:16px 24px 64px 24px; margin-bottom: 24px; position: relative; transition: all 0.25s ease-in-out; visibility: visible !important; opacity: 1 !important; }
.news-item span { display: block; }
.news-item .date { margin-bottom: 16px; }
.news-item .title { font-size: 20px; line-height: 1.4; }
.news-item .arrow { position: absolute; left:24px; bottom:16px; font-size: 10px; background-color: var(--primary-colour); color: var(--secondary-colour); width: 28px; height:28px; display: flex; -webkit-align-items: center; align-items: center; -webkit-justify-content: center; justify-content: center; transition: all 0.25s ease-in-out; }
.news-item:hover { background-color: var(--primary-colour); color: var(--white); }
.news-item:hover .arrow { background-color: var(--white); }
body.cat-news .news-item { margin-bottom: 48px; }
@media (max-width:768px){
  .news-item { padding-right: 0; }
  section#news .latest-news-releases { margin-top: 24px; }
}

/* ABOUT */
section#history-timeline .highlight { border-top: 1px solid rgba(28,67,75,0.5); }
section#history-timeline .highlight > h6 { margin-bottom: 32px; }
section#history-timeline .highlight table tr { border:none; display: grid; grid-template-columns: repeat(7, 1fr); column-gap: 20px; -webkit-align-items: flex-start; align-items: flex-start; }
section#history-timeline .highlight table tr td { border:none; padding:0 0 32px 0; }
section#history-timeline .highlight table tr td:first-of-type { grid-column: span 1; color: var(--primary-colour); font-size: 24px; font-weight: 600; }
section#history-timeline .highlight table tr td:last-of-type { grid-column: span 6; padding-top: 2px; }
section#history-timeline .highlight .image { padding-bottom: 24px; }
section#history-timeline .highlight .image img { max-width:440px; width: 100%; }
section#history-timeline .highlight .image .caption { font-size: 14px; font-weight: 600; }
#tribute .content > .h4 { margin:16px 0; }
#tribute .image img { max-width:440px; width: 100%; }

/* OUR PORTFOLIO */
#producing-accordion #producing-image { background-repeat: no-repeat; background-size:cover; background-position: center; transition: all 0.25s ease-in-out; min-height:630px; }
#producing-accordion #producing-image[data-item="copper"] { background-image:url(../../../../_resources/portfolio/producing_copper.jpg); }
#producing-accordion #producing-image[data-item="gold"] { background-image:url(../../../../_resources/portfolio/producing_gold.jpg?v2); }

#producing-accordion > .grid { padding:40px; background-color: var(--cream); }
#producing-accordion > .grid > div { background-color: var(--white); }
#producing-accordion .accordion { border: none !important; transition: all 0.25s ease-in-out; }
#producing-accordion .accordion .toggle { background-color:var(--primary-colour); color:var(--white); padding: 40px; font-size: 24px; padding-left: 110px; transition: all 0.25s ease-in-out; }
#producing-accordion .accordion .toggle:hover { background-color: var(--secondary-colour); }
#producing-accordion .accordion .toggle:after { font-size: 18px; right:40px; top:39px; }
#producing-accordion .accordion.active .toggle:after { display: none; }
#producing-accordion .accordion.active .toggle { background-color:var(--white); color:#000; cursor:default; }
#producing-accordion .accordion .toggle span { display: flex; background-color:var(--primary-colour); -webkit-align-items: center; align-items: center; -webkit-justify-content: center; justify-content: center; position: absolute; left:40px; top:36px; width:36px; height:36px; border-radius:50%; border:1px solid var(--secondary-colour); color:var(--secondary-colour); font-size: 12px; font-weight: 700; transition: all 0.25s ease-in-out; }
#producing-accordion .accordion.active .toggle span, #producing-accordion .accordion .toggle:hover span { color:var(--white); }
#producing-accordion .accordion .expand { padding: 0px 48px 32px 110px; line-height: 1.5; display: block; height:0; opacity: 0; padding-top: 0; padding-bottom: 0; }
#producing-accordion .accordion .production-stats { border-left: 1px solid rgba(67,172,193,0.5); color:var(--primary-colour); padding-left: 24px; line-height: 1.33; margin-bottom: 24px; }
#producing-accordion .accordion .production-stats strong { font-weight: 400; font-size: 24px; }
#producing-accordion .accordion .expand p { margin-bottom: 24px; }
#producing-accordion .accordion .expand .button { padding-top: 24px; padding-bottom: 24px; }
@media (max-width:768px) {
  #producing-accordion { padding-left:20px; padding-right: 20px; }
  #producing-accordion #producing-image { min-height:300px; }
  #producing-accordion .accordion .toggle { padding:24px; }
  #producing-accordion .accordion .toggle span { display: none; }
  #producing-accordion .accordion .expand { padding: 0px 24px 0 24px }
  #producing-accordion .accordion .toggle:after { top:28px; }
}

section#portfolio-map { background-color: var(--primary-colour); color: var(--white); padding-bottom: 0; padding-top: 0; height:810px; position: relative; }
section#portfolio-map .container { height: 100%; }
section#portfolio-map .map { background-image:url("../../../../_resources/portfolio/portfolio_map.jpg?v1"); background-repeat: no-repeat; background-position: bottom right; height:100%; width: 100%; position: absolute; transition: all 0.25s ease-in-out; }
section#portfolio-map .map .icon { position: absolute; cursor: pointer; width:34px; height:34px; border-radius:50%; background-image:url("../../../../_resources/portfolio/map_icon.svg"); background-repeat: no-repeat; background-size: cover; z-index: 10; box-shadow: 0px 1px 1px 1px rgba(0, 0, 0, 0.25); transition: all 0.25s ease-in-out; }
section#portfolio-map .map .icon:hover, section#portfolio-map .map .icon.active { background-image:url("../../../../_resources/portfolio/map_icon_hover.svg"); }
section#portfolio-map .map .icon#icon-vicuna { background-image:url("../../../../_resources/portfolio/map_icon_v.png"); }
section#portfolio-map .map .icon#icon-vicuna:hover, section#portfolio-map .map .icon#icon-vicuna.active { background-image:url("../../../../_resources/portfolio/map_icon_v_hover.png"); }
section#portfolio-map .map .icon#icon-caserones { bottom: 299px; right: 647px; }
section#portfolio-map .map .icon#icon-candelaria { bottom: 315px; right: 678px; }
section#portfolio-map .map .icon#icon-vicuna { bottom: 265px; right: 649px; }
section#portfolio-map .map .icon#icon-chapada { bottom: 526px; right: 49px; }
section#portfolio-map .map .card { position: absolute; background:white; height:400px; width:316px; box-shadow: 0px 1px 1px 1px rgba(0, 0, 0, 0.25); text-align: right; display: none; z-index:20; }
section#portfolio-map .map .card:after { content:"\f0d7"; font-family: "Font Awesome 7 Sharp"; position: absolute; color: var(--white); bottom:-22px; left:149px; text-shadow: 0px 3px 1px rgba(0, 0, 0, 0.25); font-weight: 700; font-size: 32px; }
section#portfolio-map .map .card#card-caserones { bottom: 349px; right: 510px; }
section#portfolio-map .map .card#card-candelaria { bottom: 365px; right: 541px; }
section#portfolio-map .map .card#card-vicuna { bottom: 315px; right: 512px; }
section#portfolio-map .map .card#card-chapada { bottom: 323px; right: 103px; }
section#portfolio-map .map .card#card-chapada:after { content:"\f0da"; right: -15px; left: auto; bottom: 200px; }
section#portfolio-map .map .card .image { background-repeat: no-repeat; height:220px; background-size:cover; }
section#portfolio-map .map .card#card-caserones .image { background-image: url("/staging/lundinmining.com/_resources/portfolio/project_card_caserones.jpg"); }
section#portfolio-map .map .card#card-candelaria .image { background-image: url("/staging/lundinmining.com/_resources/portfolio/project_card_candelaria.jpg"); }
section#portfolio-map .map .card#card-vicuna .image { background-image: url("/staging/lundinmining.com/_resources/portfolio/project_card_vicuna.jpg"); }
section#portfolio-map .map .card#card-chapada .image { background-image: url("/staging/lundinmining.com/_resources/portfolio/project_card_chapada.jpg"); }
section#portfolio-map .map .card .details { padding:16px;  color:var(--body-text-colour); }
section#portfolio-map .map .card .details .logo { max-width:200px; margin-left: auto; }
section#portfolio-map .map .card .details .logo .vicuna { height:30px; margin-bottom: 16px; }
section#portfolio-map .map .card .details .name { font-weight: 500; margin-bottom: 16px; }
section#portfolio-map .map .card .details .resource-type { display: flex; -webkit-justify-content: flex-end; justify-content: flex-end; -webkit-align-items: center; align-items: center; margin-bottom: 8px; }
section#portfolio-map .map .card .details .resource-type span { background-color: var(--primary-colour); color: var(--white); font-size: 12px; font-weight: 700; display: flex; -webkit-align-items: center; align-items: center; -webkit-justify-content: center; justify-content: center; border-radius:50%; padding:8px; margin-left: 2px; }
section#portfolio-map .map .card .details .resource-type span:first-of-type { margin-left: 8px; }
section#portfolio-map .map .card .details .resource-type * { margin-bottom: 0; }
section#portfolio-map .map .card .details .link a { color: var(--body-text-colour); font-weight: 600; }
section#portfolio-map .map .card .details .link a:hover { color: var(--secondary-colour); }

@media (max-width:1200px) {
  #portfolio-map .content { margin-bottom: 300px; max-width:300px; }
  #portfolio-map .content .h2 { font-size: 40px; }
  /*
  section#portfolio-map .map { background-position:calc(100% + 300px) bottom; }
  section#portfolio-map .map .icon#icon-caserones { right: 347px; }
  section#portfolio-map .map .icon#icon-candelaria { right: 378px; }
  section#portfolio-map .map .icon#icon-vicuna { right: 349px; }
  section#portfolio-map .map .card#card-caserones { right: 209px; }
  section#portfolio-map .map .card#card-candelaria { right: 238px; }
  section#portfolio-map .map .card#card-vicuna { right: 211px; }
  */
}
@media (max-width:1024px) {
  section#portfolio-map { height:400px; background-image: url('../../../../_resources/portfolio/portfolio_map_mobile.jpg'); background-repeat: no-repeat; background-position: 48% 50%; background-size:cover;}
  section#portfolio-map .map, section#portfolio-map .description { display: none; }
}

@media (max-width:600px) {
  section#portfolio-map { height:300px; background-position: 50% 30%; }
}
@media (max-width:400px) {
  section#portfolio-map { height:200px; background-position: 50% 30%; }
}



section#locations { background-color: var(--white); }
section#locations .project-card { background-color: var(--cream); color: var(--body-text-colour); }
section#locations .project-card .image { background-image: url("../../../../_resources/portfolio/project_card_candelaria.jpg"); background-repeat: no-repeat; background-size:cover; background-position: center; height:336px; display: flex;-webkit-align-items: flex-end; align-items: flex-end; padding:16px; position: relative; }
section#locations .project-card .image:before { content:""; background-color: #000; position: absolute; top:0; left:0; width: 100%; height: 100%; opacity: 0; transition: all 0.25s ease-in-out; }
section#locations .project-card .image .location { background-color: rgba(255,255,255,0.25); color: var(--white); font-size: 14px; text-transform: uppercase; padding:4px 8px; }
section#locations .project-card .image .location:before { content:"\f3c5"; font-family: 'Font Awesome 7 Pro'; font-weight: 700;  color: var(--white); padding-right: 8px; }
section#locations .project-card .details { padding:16px; transition: all 0.25s ease-in-out; }
section#locations .project-card .details .title { font-weight: 600; margin-bottom: 8px; }
section#locations .project-card .details .description { margin-top: 8px; margin-bottom: 16px; }
section#locations .project-card .details .read-more { margin-bottom: 0;  font-weight: 600; }
section#locations .project-card:hover .details { background-color: var(--primary-colour); color: #FFF; }
section#locations .project-card:hover .image:before { opacity: 0.2; }
@media (max-width:768px) {
  section#locations .project-card { margin-bottom: 16px; }
}

table.social { display: inline-block; margin-bottom: 32px; }
table.social tr td { width: 40px; padding: 0 16px 0 0; }
table.social tr td a { display: flex; width:40px; height:40px; background-color: var(--primary-colour); color: var(--white); -webkit-align-items: center; align-items: center; -webkit-justify-content: center; justify-content: center; border-radius:50%; }
table.social tr td a:hover { background-color: var(--secondary-colour); }
table.social tr td a.disabled { background-color: #BBB; pointer-events: none; cursor: default; }

body.str-vicuna-district main { display: none; }
body.str-vicuna-district section#project-summary { background-color: var(--cream) !important; }
section#project-summary .cols-8 { padding-left: 28px; }
section#portfolio-info .additional p { margin-top: 8px; margin-bottom: 8px; } 
section#portfolio-info .additional .small { margin-bottom: 32px; }
section#portfolio-info .additional .button { min-width: 325px; padding-top: 24px; padding-bottom: 24px; }
section#portfolio-info .additional .social { margin-top: 16px; }
section#portfolio-info ul { list-style: none; padding: 0; margin: 0; }
section#portfolio-info ul > li { border-left: 1px solid var(--secondary-colour); padding: 0px 24px; margin-bottom: 32px; position: relative; font-size: 14px; }
section#portfolio-info ul > li p { margin:0; }
section#portfolio-info ul > li strong { color: var(--primary-colour); font-size: 24px; font-weight: 400; display: inline-block;margin-bottom: 8px; }
section#portfolio-info .guidance .small { margin: 0; }
@media (max-width:1280px) {
  section#project-summary .cols-8 { padding-left: 0; padding-top: 24px; }
} 
/* INVESTORS */
ul.cols#investors-strategy > li strong:first-of-type { min-height:64px; }
section#quick-links .grid > * { background-color: var(--white); margin-top: 8px; }
section#quick-links .grid > * a { padding: 24px 16px; height:184px; color:var(--primary-colour); border-top: 1px solid rgba(28,67,75,0.5); display: flex; flex-direction:column; -webkit-justify-content: space-between; justify-content: space-between; font-size: 24px; }
section#quick-links .grid > * a:before { content:"\f15b"; font-family: "Font Awesome 7 Pro"; color:var(--primary-colour); display: flex; -webkit-align-items: center; align-items: center;-webkit-justify-content: center; justify-content: center; font-size: 18px; width: 40px; height: 40px; background-color: var(--cream); border-radius:50%; }
section#quick-links .grid > *.business a:before { content:"\f0b1"; }
section#quick-links .grid > *.environment a:before { content:"\f06c"; }
section#quick-links .grid > *.communities a:before { content:"\e001"; font-family: "Font Awesome Kit"; font-size: 22px; }
section#quick-links .grid > *.people a:before { content:"\e533"; }
section#quick-links .grid > * a:hover { color: var(--white); background-color: var(--secondary-colour); }
section#quarterly-dashboard .details { background-color: var(--white); padding:56px 40px; }
section#quarterly-dashboard .details .image { -webkit-flex-basis: calc(100% - 350px); flex-basis: calc(100% - 350px); padding-right: 56px; }
section#quarterly-dashboard .details .image img { object-fit: cover; position: relative; height: 100%; object-position: right; }
section#quarterly-dashboard .details .content { -webkit-flex-basis: 350px; flex-basis: 350px; }
section#quarterly-dashboard .details .content p { margin-top: 8px; margin-bottom: 8px; }
section#quarterly-dashboard .details .content h6, section#quarterly-dashboard .details .content .h6 { font-weight: 400; margin-bottom: 32px; }
section#quarterly-dashboard .details .content .button { width: 100%; padding:24px; }
section#investors-events { background: var(--primary-colour); }
section#investors-events h5 { color: var(--white); }
section#investors-events .mobile { display: none; }
section#investor-downloads .h5:not(.quarterly-heading) { display: none; }
.qm-wrap-info, .qm-wrap-ichart { padding:24px; background-color: var(--white); }
.qmod-ui-tool .qmod-block-wrapper { background-color: var(--white); }
.qmod-simplechart.qmod-ui-tool .qmod-chart-js { margin-left: 0; margin-right: 0; }
.highcharts-credits { display: none; }

@media (max-width:1024px) {
  section#quarterly-dashboard .details > .flex-container { display: block; }
  section#quarterly-dashboard .details .image { padding-right: 0; margin-bottom: 24px; }
}
@media (max-width:768px) {
  section#quick-links .grid > * a { flex-direction:row-reverse; -webkit-align-items: center; align-items: center; height: auto; padding:24px 16px; }
  section#quarterly-dashboard .details { padding:32px 16px; }
  section#events .heading { margin-bottom: 16px; }
  section#events .heading .right { display: none; }
  section#events .mobile { display: block; margin-top: 40px; }
}
section#featured-presentations .featured-presentation .image { min-height: 360px; display: flex; -webkit-justify-content: center; justify-content: center; -webkit-align-items: center; align-items: center; background-repeat: no-repeat; background-size:cover; background-position: center; padding:40px; }
section#featured-presentations .featured-presentation .image img { max-width: 395px; width: 100%; }
section#featured-presentations .featured-presentation .details { background-color: var(--white); padding:64px 56px; }
section#featured-presentations .featured-presentation .details .title { margin-bottom: 16px; margin-bottom: 0; }
section#featured-presentations .featured-presentation .details .date { padding-bottom: 16px; margin-bottom: 32px; position: relative; }
section#featured-presentations .featured-presentation .details .date:after { content:""; height:2px; width: 40px; background-color: var(--primary-colour); position: absolute; bottom:0; left:0; }
@media (max-width:768px) {
  section#featured-presentations .featured-presentation .details { padding:40px 16px; }
  section#featured-presentations .featured-presentation { margin-bottom: 16px; }
}
body.str-events main, body.str-stock-information main { padding-bottom: 0; }

section#investor-featured-downloads .featured-download { background-color: #FFF; display: flex; flex-direction: column; height: 100%; }
section#investor-featured-downloads .featured-download .image { min-height: 360px; display: flex; -webkit-justify-content: center; justify-content: center; -webkit-align-items: center; align-items: center; background-repeat: no-repeat; background-size:cover; background-position: center; padding:40px; }
section#investor-featured-downloads .featured-download .image img { max-width: 395px; width: 100%; }
section#investor-featured-downloads .featured-download .details { background-color: var(--white); padding:64px 56px; display: flex; -webkit-align-items: flex-end; align-items: flex-end; height: 100%; }
section#investor-featured-downloads .featured-download .details .title { margin-bottom: 16px; margin-bottom: 0; }
section#investor-featured-downloads .featured-download .details .date { padding-bottom: 16px; margin-bottom: 32px; position: relative; }
section#investor-featured-downloads .featured-download .details .date:after { content:""; height:2px; width: 40px; background-color: var(--primary-colour); position: absolute; bottom:0; left:0; }
section#investor-featured-downloads .featured-download .details .link { margin-bottom: 0; }
@media (max-width:768px) {
  section#investor-featured-downloads .featured-download .details { padding:40px 16px; }
  section#investor-featured-downloads .featured-download { margin-bottom: 16px; height:auto; }
}


#dividend-stats tr td { border-left:none; background-color: #FFF; padding-top: 24px; padding-bottom: 24px; }
#dividend-stats tr td h2 { margin-bottom: 24px; }
@media (max-width:1024px) {
  #dividend-stats tr td:last-of-type { margin-bottom: 0; }
}


#corporate-filings h6, #corporate-filings .h6 { font-weight: 600; }
#corporate-filings ul { list-style: none; padding: 0; margin: 0;  }
#corporate-filings ul li { padding-top: 16px; padding-bottom: 16px; border-top:1px solid }
#corporate-filings .label-hidden { display: none; }
#corporate-filings .tns-outer { position: relative; }
#corporate-filings .tns-controls { position: absolute; width: 100%; z-index:10; }
#corporate-filings .tns-controls button { position: absolute; background-color: var(--primary-colour); color: var(--secondary-colour); font-size: 12px; transition: all 0.25s ease-in-out; height: 28px; width: 28px; display: flex; -webkit-align-items: center; align-items: center; -webkit-justify-content: center; justify-content: center; border:none; }
#corporate-filings .tns-controls button:hover { color: #FFF; }
#corporate-filings .tns-controls button:disabled { background-color: #BBB; color:#DDD; }
#corporate-filings .tns-controls button[data-controls=prev] { left:-80px; }
#corporate-filings .tns-controls button[data-controls=next] { right:0px; }

@media (max-width:768px) {
  #corporate-filings .label-hidden { display: inline-block; }
  #corporate-filings .pdf { display: none; }
  #corporate-filings .empty { display: none; }
  #corporate-filings .tns-controls button[data-controls=prev] { left:auto; right:33px; }
}

/* SUSTAINABILITY */
ul.anchors { list-style: none; padding: 0; margin: 0 0 0 0; display: flex; flex-wrap:wrap; }
ul.anchors li { flex-basis:calc((100% / 5) - (100px / 5)); margin-right: 20px; border-top: 1px solid rgba(28,67,75,0.5); min-height: 104px; margin-bottom: 8px; }
ul.anchors li a { display: block; background-color: var(--white); color: var(--primary-colour); padding: 24px 16px; font-size: 20px; height:100%; }
ul.anchors li a:hover { background-color: var(--secondary-colour); color: var(--white); }
@media (max-width:768px) {
  ul.anchors { margin-bottom: 24px; }
  ul.anchors li { flex-basis: 100%; min-height:40px; margin-right: 0; }
  /*ul.anchors li a { padding: }*/
}
ul.anchors + * { margin-top: 32px; }



section#our-stories { background-color: var(--primary-colour); color: var(--white); border-bottom: 1px solid rgba(255,255,255,0.5); }
section#our-stories .container {  }
section#our-stories .tns-outer { width: calc(100vw - ((100vw - 1680px) / 2)); }
section#our-stories .tns-inner { margin-left: 0 !important; }
section#our-stories .story { display: block; background-color: var(--white); height: 100%; }
section#our-stories .story .image { height:265px; background-size:cover; background-position: center; background-repeat: no-repeat; position: relative; }
section#our-stories .story .image:before { content:""; background-color: #000; position: absolute; top:0; left:0; width: 100%; height: 100%; opacity: 0; transition: all 0.25s ease-in-out; }
/*section#our-stories .image img { height: 100%; width: 100%; object-fit: cover; }*/
section#our-stories .details { background-color: var(--white); color: var(--primary-colour); padding:24px; transition: all 0.25s ease-in-out; }
 section#our-stories .story:hover, section#our-stories .story:hover .details { background-color: var(--secondary-colour); color: var(--white); }
 section#our-stories .story:hover .image:before { opacity: 0.2; }
section#our-stories .tns-controls { margin-top: 56px; }
section#our-stories .tns-controls button { cursor: pointer; padding: 16px; border: 0; display: inline-flex; justify-content: space-between; align-items: center; background-color: var(--white); color: var(--secondary-colour); font-weight: 600; font-size: 16px; line-height: 1.5; transition: all 0.25s ease-in-out; margin-right: 8px; }
section#our-stories .tns-controls button:hover { background-color: var(--secondary-colour); color: var(--white); }
.banner-image { height:560px; display: flex; -webkit-align-items: flex-end; align-items: flex-end; padding-bottom: 56px; background-repeat: no-repeat; background-size:cover; background-position: center; }
.banner-image .h2 { color: var(--white); width: 100%; }
.checklist .cols-7 { padding-right: 48px; }
.checklist .cols-5 ul { list-style: none; margin: 0; padding: 0; }
.checklist .cols-5 ul li { display: flex; -webkit-align-self: flex-start; align-self: flex-start; margin-bottom: 8px; line-height: 1.5; }
.checklist .cols-5 ul li:before { content:"\f058"; color: var(--secondary-colour); font-family: 'Font Awesome 7 Pro'; font-size: 20px; font-weight: 300; padding-right: 16px; position: relative; top:-4px; }

section#business-ethics-transparency .banner-image { background-image:url(../../../../_resources/sustainability/Business-Ethics-and-Transparency.jpg); background-position: top center; }
section#third-party-standards .banner-image { background-image:url(../../../../_resources/sustainability/third-party-standards.jpg); background-position: top left; }
section#human-rights .banner-image { background-image:url(../../../../_resources/sustainability/human-rights.jpg); background-position: /*top*/ center; }
section#air-quality .banner-image { background-image:url(../../../../_resources/sustainability/AirQuality.jpg); background-position: /*top*/ left; }
section#climate-change-action .banner-image { background-image:url(../../../../_resources/sustainability/climate-change-action.jpg); background-position: top center; }
section#nature-biodiversity .banner-image { background-image:url(../../../../_resources/sustainability/Nature-and-Biodiversity.jpg); background-position: left 35%; }
section#water-tailings-management .banner-image { background-image:url(../../../../_resources/sustainability/Waste-and-Tailings-Management.jpg); background-position: /*top*/ center; }
section#water-stewardship .banner-image { background-image:url(../../../../_resources/sustainability/Water-Stewardship.jpg); background-position: right 35%; }
section#stakeholder-indigenous-engagement .banner-image { background-image:url(../../../../_resources/sustainability/Stakeholder-and-Indigenous-Engagement.jpg); background-position: top center; }
section#managing-social-risks .banner-image { background-image:url(../../../../_resources/sustainability/Managing-Social-Risks-and-Building.jpg); background-position: top left; }
section#investing-in-communities .banner-image { background-image:url(../../../../_resources/sustainability/Investing-in-Communities.jpg); background-position: /*bottom*/ center; }
section#health-safety .banner-image { background-image:url(../../../../_resources/sustainability/Health-and-Safety.jpg); background-position: top left; }
section#empowered-workforce .banner-image { background-image:url(../../../../_resources/sustainability/Empowered-Workforce.jpg); background-position: /*top*/ center; }
body.str-our-approach-to-sustainability .icons .h6 { margin-bottom: 0; }
body.story main img { width: 100%; }
table.images tr { display:grid; grid-template-columns: repeat(auto-fit, minmax(0, 1fr)); column-gap: 20px; border:none; }

@media (max-width:1800px) {
  section#our-stories .tns-outer { width: calc(100vw - 60px); }
}
@media (max-width:1024px) {
  section#our-stories .tns-outer { width: calc(100vw - 20px); }
  .banner-image { height:350px; }
}

@media (max-width:768px) {
  table.images tr { grid-template-columns: repeat(1, 1fr); }
  .checklist .cols-7 { padding-right: 0; }
}



/* CAREERS */
body.str-careers main { display: none; }
#current-opportunities { margin-top: 104px; }
#current-opportunities .image img { object-fit: cover; position: relative; height: 100%; object-position: left; }
/*section#current-opportunities img { max-width: 780px; width: 100%; }*/
section#what-guides-us { border-top: 1px solid rgba(28,67,75,0.5); padding-top: 32px; }
section#what-guides-us .h6 { margin-bottom: 32px; }

/*section#dei .image img { max-width: 670px; width: 100%; }*/
section#powered-by-people .image { min-height: 600px; background-repeat: no-repeat; background-size:cover; background-position: top center; transition: all 0.25s ease-in-out; }
section#powered-by-people .content { background-color: var(--primary-colour); color:var(--white); padding:120px 120px 71px 120px;}
section#powered-by-people .content .h3 { margin-bottom: 32px; }
section#powered-by-people .content h6, section#powered-by-people .content .h6 { margin-top: 32px; }
section#powered-by-people .content p { font-size: 20px; line-height: 1.4; }
section#powered-by-people .content .tns-controls { margin-top: 8px; }
section#powered-by-people .tns-controls button { cursor: pointer; padding: 16px; border: 0; display: inline-flex; justify-content: space-between; align-items: center; background-color: var(--white); color: var(--secondary-colour); font-weight: 600; font-size: 16px; line-height: 1.5; transition: all 0.25s ease-in-out; margin-right: 8px; }
section#powered-by-people .tns-controls button:hover { background-color: var(--secondary-colour); color: var(--white); }
section#stay-connected { margin-bottom: 96px; }
section#stay-connected > .grid { padding: 16px; }
section#stay-connected .fa-brands { font-size: 32px; color:var(--secondary-colour); }

@media (max-width:1280px) {
  section#powered-by-people .content { padding:56px 32px; }

}
@media (max-width:1024px) {
  body.cat-careers main { padding-top: 48px; padding-bottom: 0; }
  section#current-opportunities .image { margin-bottom: 32px; }
  section#current-opportunities img, section#dei .image img { max-width: 100%; }
  section#powered-by-people .content { padding:32px 24px; }
  section#powered-by-people .content p { font-size: 18px; }
  section#stay-connected { margin-bottom: 56px; }
  section#stay-connected .content { margin-top: 32px; }
}

@media (max-width:768px) {
}
@media (max-width:550px) {
  section#powered-by-people .image { min-height: 450px; }
}

/* READ MORE - SUB PAGES */
.read-more-sub-pages { background-color: var(--white); padding-top: 80px; padding-bottom: 104px; }
.read-more-sub-pages a.page { position: relative; }
.read-more-sub-pages a.page span { position: absolute; bottom:20px; left:16px; color: var(--white); }
.read-more-sub-pages a.page:hover { opacity: 0.75; }
.read-more-sub-pages .h5 { margin-bottom: 0; }

/* TABS */
.nav-tabs { margin: 0px; padding: 0; list-style: none; display: flex; border-top: 1px solid var(--primary-colour); }
.nav-tabs li { cursor: pointer; position: relative; display: block; color:var(--primary-colour); font-weight: 600;  padding: 12px 40px; transition: all 0.25s ease-in-out; }
.nav-tabs li.addtab { width:100px; }
.nav-tabs li:hover { background-color:var(--secondary-colour); color:var(--white); }
.nav-tabs li.current { background-color:var(--primary-colour); color:var(--white); }
.nav-tabs li a { color:var(--white); }
.tab-content { display: none; padding: 32px 0; }
.tab-content.active { display: block; -webkit-animation-duration: 0.5s; -moz-animation-duration: 0.5s; animation-duration: 0.5s; -webkit-animation-name: fade-in; -moz-animation-name: fade-in; animation-name: fade-in; }
.tabs .mobile-tabs { display: none; }
.tab-content .element-bar { display: none !important; }
.tab-content .element-bar.showit { display: block !important; } 
ul.sub-tabs {position: absolute; opacity: 0; pointer-events: none; transition: all 0.25s ease-in-out; padding: 15px 0px; margin: 0px; list-style: none; background-color: var(--white)fff; z-index: 11; width: 100%; left: 0px; top: 100%; box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.16);}
ul.sub-tabs > li {text-align: left; padding: 4px 15px; background-color: white; color: black;}
.nav-tabs > li.has-sub::before {content: '\f107'; font-family: 'Font Awesome 7 Pro'; font-weight: 400; position: absolute; right: 15px; top: 12px;}
.nav-tabs > li.has-sub:hover ul.sub-tabs {opacity: 1; pointer-events: all;}
.tabs .mobile-tabs { margin-bottom: 7px; padding-top: 7px; }
.nav-tabs > li.has-sub:hover:after { background-color: var(--primary-colour); }
ul.sub-tabs > li:hover { background-color: var(--secondary-colour); }

.tabs select { display: none; cursor: pointer; margin: 0; outline: none; -webkit-appearance: none; -moz-appearance: none; appearance: none; font-weight:700; font-size: 16px; background-color:var(--primary-colour); border: 1px solid var(--primary-colour); background-image: url("../img/chevron-down.svg"); background-repeat: no-repeat; background-size:20px; background-position: calc(100% - 16px) center; padding: 16px 80px 16px 24px; max-width:100%; color: var(--white); }
.tabs select option, .tabs select:focus { background-color: var(--primary-colour); color: var(--white); }
.tabs select option:checked { color: var(--secondary-colour); }
.tabs.only-select .mobile-tabs, .tabs.only-select select { display: block; }
.tabs.only-select ul.nav-tabs { display: none; }

@media screen and (max-width: 1024px) {
  .tabs:not(.no-mobile) .mobile-tabs, .tabs:not(.no-mobile) select { display: block; }
  .tabs:not(.no-mobile) ul.nav-tabs { display: none; }
}

@media screen and (max-width: 768px) {
  .nav-tabs li { padding:12px 16px; }
}

/* EVENTS */ 
.events .event { background-color:var(--white); margin-bottom: 12px;  }
.events .event .top { display: flex; -webkit-align-items: center; align-items: center; padding: 24px; }
.events .event .top .date {  text-align: center; padding:16px 40px; border:1px solid var(--primary-colour); color: var(--primary-colour); min-width: 140px; transition: all 0.25s ease-in-out; }
.events .event .top .date .month { font-size: 12px; }
.events .event .top .date .day { margin:0; }
.events .event .top .summary { padding-left: 32px; }
.events .event .top .summary .mobile-date { display: none; color:var(--primary-colour); font-size: 12px; transition: all 0.25s ease-in-out;}

@media screen and (max-width: 768px) {
  .events .event .top .date { display: none; }
  .events .event .top .summary { padding-left: 0; }
  .events .event .top .summary .mobile-date { display: block; }
  .events .event .top .summary .title { margin-top: 4px; margin-bottom: 4px; }
}
.events .event.accordion:not(.disabled) .top { cursor: pointer; transition: all 0.25s ease-in-out; }
.events .event.accordion .top .toggle div { transition: all 0.25s ease-in-out; }

body:not(.mobile) .events .event.accordion:not(.disabled) .top:hover { background-color: var(--secondary-colour); color: #FFF; }
body:not(.mobile) .events .event.accordion:not(.disabled) .top:hover .date { border:1px solid var(--white); color: var(--white); }
body:not(.mobile) .events .event.accordion:not(.disabled) .top:hover .toggle div { background-color: var(--white); color: var(--secondary-colour); }
.events .event.accordion .expand { padding:24px; }

/* ACCORDION */
.accordion { border-top: 2px solid rgba(28, 67, 75, 0.25); }
.accordion:last-of-type { border-bottom: 2px solid rgba(28, 67, 75, 0.25); }
.accordion .toggle { font-weight: 600; color:var(--primary-colour); padding-top: 24px; padding-bottom: 24px; position: relative; cursor: pointer; margin-left: auto; margin-top: 0; margin-bottom: 0; }
.accordion:not(.event) .toggle:after { content:"\2b"; font-family: 'Font Awesome 7 Pro'; font-weight: 500; font-size: 24px; position: absolute; right:40px; top:18px;  }
.accordion:not(.event).active .toggle:after, .accordion.open .toggle:after { content:"\f068"; }
.accordion .toggle { cursor: pointer; margin-left: auto; }
.accordion h6.toggle { font-size: 20px; line-height: 1.25; }
.accordion h6.toggle:after { top:22px; }
.accordion .expand { display: none; padding-top: 32px; }
body.cat-sustainability .accordion .expand { padding-top: 24px; padding-bottom: 16px; }
body.str-communities .accordion .h6.toggle { font-size: 20px; padding-right: 80px; }

/*.accordion.open .expand { display: block; }*/

.accordion.icon { background-color: var(--white);  }
.accordion.icon .expand { padding-top: 24px; padding-bottom: 8px; padding-left: 40px; padding-right: 40px; }
.accordion.icon .toggle { padding-left: 104px; padding-right: 40px; transition: all 0.25s ease-in-out; }
.accordion.icon .toggle:before { color:var(--secondary-colour); font-family: "Font Awesome 7 Pro"; font-weight: 300; padding-right: 24px; font-size: 34px; position: absolute; left: 40px; top: 14px; }
.accordion.icon .toggle.health:before { content:"\e002";  font-family: "Font Awesome Kit";}
.accordion.icon .toggle.education:before { content:"\f19d"; }
.accordion.icon .toggle.users-four:before { content:"\e007"; font-family: "Font Awesome Kit"; }
body:not(.mobile) .accordion.icon .toggle:hover { background-color: var(--primary-colour); color: #FFF; }

.accordion.event { border:none !important; }
.accordion.event .toggle div { cursor: pointer; padding:16px 20px; margin-left: auto; background-color: var(--primary-colour); color:var(--secondary-colour); }
.accordion.event .toggle i { transition: all 0.25s ease-in-out; display: inline-block; }
.accordion.event.active .toggle i { transform: rotateX(180deg); }
.accordion.event.disabled .toggle { display: none; }

.accordion.full-width .container, .full-width > .accordion .container { padding-left: 0; padding-right: 0; }
.accordion.full-width .toggle, .full-width > .accordion .toggle { transition: all 0.25s ease-in-out; padding-left: 60px; padding-right: 60px; }
body:not(.mobile) .accordion.full-width .toggle:hover, body:not(.mobile) .full-width > .accordion .toggle:hover { background-color: var(--primary-colour); color: #FFF;}
.accordion.full-width .toggle:after, .full-width > .accordion .toggle:after { right:60px; }
.accordion.full-width .expand, .full-width > .accordion .expand { padding-left: 60px; padding-right: 60px; }
@media screen and (max-width: 1024px) {
  .accordion.full-width .toggle, .full-width > .accordion .toggle {  padding-left: 20px; padding-right: 50px; }
  .accordion.full-width .toggle:after, .full-width > .accordion .toggle:after { right:20px; }
  .accordion.full-width .expand, .full-width > .accordion .expand { padding-left: 20px; padding-right: 20px; }
}

@media screen and (max-width: 768px) {
  body.str-communities .accordion .h6.toggle:after { right:20px; }
  body.str-communities .accordion .h6.toggle:before { left:20px; }
  body.str-communities .accordion .h6.toggle { padding-left: 75px; padding-right: 40px; }
}
/* DOCUMENT LINKS */
.document-links { margin: 0px; padding: 0; list-style: none; }
.document-links a { display: flex; border-top: 1px solid rgba(28,67,75,0.5); background-color: var(--white); color: var(--primary-colour); padding:24px 16px; position: relative; width: 100%; -webkit-justify-content: space-between; justify-content: space-between; font-weight: 600;}
.document-links a span:before { content:"\f1c1"; font-family: 'Font Awesome 7 Pro'; font-size: 18px; font-weight: 300; color: var(--primary-colour); margin-right: 8px; transition: all 0.25s ease-in-out; }
.document-links a:hover { background-color: var(--secondary-colour); color: var(--white); }
.document-links a:hover span:before { color: var(--white); }

/* BIOS */
.bio-item { margin-bottom: 24px; }
.bio-item .bio-image { cursor: pointer; position: relative; width: 100%; height: auto; margin-bottom: 16px; }
.bio-item .bio-image img { width: 100%; height: auto; object-fit: cover; display: block; aspect-ratio: 4 / 5; }
.bio-item .bio-image .expand { color: var(--primary-colour); background-color: var(--white); border-radius:20px; display: flex; font-size: 22px; -webkit-align-items: center; align-items: center; -webkit-justify-content: center; justify-content: center; position: absolute; width:40px; height:40px; padding:10px; right:24px; bottom:24px; transition: all 0.25s ease-in-out; overflow: hidden; }
.bio-item .bio-image .expand span { width: 0; transition: all 0.25s ease-in-out; overflow: hidden; font-size: 16px; }
.bio-item .bio-image:hover .expand { background-color: var(--secondary-colour); color: var(--white); width:100px; }
.bio-item .bio-image:hover .expand span { width: 100%; padding-left: 12px; }
.bio-item .bio-image:before { content:""; background-color: #000; opacity: 0; position: absolute; top:0; left:0; width: 100%; height: 100%; transition: all 0.25s ease-in-out; }
.bio-item .bio-image:hover::before { opacity: 0.25; }
.bio-item .bio-popup { visibility: hidden; opacity: 0; pointer-events: none; position: fixed; inset: 0; z-index: 99; background-color: rgba(0, 0, 0, 0.6); display: flex; justify-content: center; align-items: center; transition: all 0.3s ease; user-select: none; cursor: pointer; }
.bio-item .bio-popup .wrapper { width: calc(100% - 40px); max-width: 1100px; max-height: 90vh; padding: 24px; background-color: var(--white); position: relative; cursor: default; overflow: auto; }
/*.bio-item .bio-popup .wrapper .grid { height: calc(100vh - 188px); }*/
.bio-item .bio-popup .wrapper .content { overflow-y:auto; }
.bio-item .bio-popup .close { position: absolute; top: 0; right: 0; padding: 16px; cursor: pointer; }
.bio-item.active .bio-popup { visibility: visible; opacity: 1; pointer-events: all; }

@media screen and (max-width: 1024px) {
  .bio-item .bio-popup .wrapper { max-height: calc(100vh - 180px); }
  .bio-item .bio-popup .wrapper img { max-width: 300px; width: 100%; margin-bottom: 16px; }
}
@media screen and (max-width: 768px) {
  .bio-item .bio-popup .wrapper .image { display: none; }
  .bio-item .bio-popup .wrapper { overflow: auto; }
  .bio-item .bio-popup .wrapper .grid { height: auto; }
}


/* FOOTER */
footer { padding-top: 96px; background-color: var(--primary-colour); color: var(--white); }
footer .top { justify-content: space-between; }
footer .top .logo { width: 247px; height:32px;  }
footer .top .logo a svg { width: 247px; height:32px; transition: all 0.25s ease-in-out; }
footer .top .logo a:hover svg { opacity: 0.65; }
footer .top .signup { margin-top: 40px; max-width: 440px; padding-right: 24px; }
footer .top .signup h6 { margin-bottom: 24px; }
footer .top .signup input[type="text"] { margin: 0 0 8px; width: 100%;  border: 0;background-color: rgba(255, 255, 255, 0.2); color: var(--white); padding: 16px; }
footer .top .signup input[type="text"]::-webkit-input-placeholder { color: var(--white); }
footer .top .signup .consent { display: flex; -webkit-align-items: center; align-items: center; margin:16px 0 24px 0; }
footer .top .signup .consent label { font-size: 12px; line-height: 1.33; opacity: 0.75; font-weight: 500; margin-left: 16px; }
footer .top .signup .signup-message { padding-top: 16px }
footer .top > * { margin-bottom: 88px; }
footer .top .footer-nav a { color: var(--white) }
footer .top .footer-nav ul { list-style: none; margin: 0; padding: 0; }
footer .top .footer-nav ul.top-level { display: grid; grid-template-columns: repeat(12, 1fr); }
footer .top .footer-nav ul.top-level > li { margin-bottom:24px; grid-column: span 4; }
footer .top .footer-nav ul.top-level > li > a { font-size: 16px; font-weight: 600; }
footer .top .footer-nav ul.top-level > li > a:hover { opacity: 0.5; }
footer .top .footer-nav ul.top-level > li > ul { margin-top: 12px; }
footer .top .footer-nav ul.top-level > li > ul a { font-size: 14px; opacity: 0.75;line-height: 1.14; }
footer .top .footer-nav ul.top-level > li > ul a:hover { opacity: 1; }
footer .top .footer-nav ul.top-level > li > ul li { margin: 2px 0; }
footer .top .footer-nav ul.top-level > li > .contact { margin-top: 24px; }
footer .top .footer-nav ul.top-level > li ul li a[title="Operations"], footer .top .footer-nav ul.top-level > li ul li a[title="Projects"] { pointer-events: none; cursor:text; font-weight: 700; }
footer .top .footer-nav ul.top-level > li ul ul { margin-left: 8px; margin-bottom: 8px; }
footer .top .social a { color: var(--primary-colour); display: inline-flex; -webkit-align-items: center; align-items: center; -webkit-justify-content: center; justify-content: center; background-color: var(--white); border-radius:50%; height:40px; width:40px; margin-right: 12px; }
footer .social a:hover { color: var(--white); background-color: var(--secondary-colour); }
footer hr { height: 1px; border: none; color: var(--white); background-color: var(--white); margin: 20px 0; opacity: 0.5; }
footer .bottom { color: var(--white); font-size: 14px; padding-bottom: 16px; justify-content: space-between;  }
footer .bottom a { color: var(--white) }
footer .bottom a:hover { opacity: 0.75 }
footer .bottom .copyright span a { display: inline-block; margin-left: 12px; padding-left: 12px; border-left:1px solid var(--white); line-height: 1; }
@media (max-width:1024px) {
  footer { padding-top: 40px }
  footer hr { margin-top: 0px; }
  footer .top > * { margin-bottom: 32px; }
  footer .top .logo a svg { height: 27px; width:207px; }
  footer .top .signup { margin-top: 24px; padding-right: 0; }
  footer .top .signup input[type="text"] { font-size: 14px; }
  footer .top .footer-nav { display: none; }
  footer .bottom { flex-wrap: wrap; }
  footer .bottom .copyright * { line-height: 1.75; }
  footer .bottom > div { flex-basis: 100%; }
}

@media (max-width:500px) {
  footer .bottom .copyright span { display: block; }
  footer .bottom .copyright span a:first-of-type { margin-left: 0; padding-left: 0; border-left:none; }
}

/* MODAL - GENERAL */
.popup-container { position: fixed; top: 0; left: 0; background-color: rgba(28,67,75,0.95); width: 100%; height: 100%; z-index: 1000; color: var(--white); display: none; }
.popup-container .content { max-width: 770px; padding: 0px 15px 0px 15px; margin: 300px auto 0px auto; }
.popup-container .close { position: absolute; right: 40px; top: 40px; width: 30px; height: 30px; cursor: pointer; font-size: 30px; line-height: 30px; }
.popup-container form.signup .textbox { float: none !important; width: 100% !important; }
.popup-container form.signup .textbox input { padding: 0px !important; }
.popup-container .error-tooltip { top: -50px !important; }
.popup-container input { width: 100%; }

/* SEARCH MODAL */
#search-popup .searchsubmit { position: absolute; height: 0px; width: 0px; border: none; padding: 0px; visibility: hidden; }
#search-popup .s { background-color: transparent; border: 0px; font-size: 50px; color: var(--white)fff; }
#search-popup .s:focus { outline: 0; }
#search-popup .s::-webkit-input-placeholder { color: rgba(255, 255, 255, 0.5); }
#search-popup .s:-moz-placeholder { color: rgba(255, 255, 255, 0.5); }
#search-popup .s::-moz-placeholder { color: rgba(255, 255, 255, 0.5); }
#search-popup .s:-ms-input-placeholder { color: rgba(255, 255, 255, 0.5); }
#search-popup fieldset { padding: 0px; border: 0px; }


@keyframes fadeIn {
  0% { opacity: 0 }
  to { opacity: 1 }
}
@keyframes fadeInLeft {
  0% { opacity: 0; transform: translate(-20px) }
  to { opacity: 1; transform: translate(0) }
}
@keyframes fadeInRight {
  0% { opacity: 0; transform: translate(20px) }
  to { opacity: 1; transform: translate(0) }
}
@keyframes fadeInUp {
  0% { opacity: 0; transform: translateY(50px) }
  to { opacity: 1; transform: translate(0) }
}

.cc-window{opacity:1;transition:opacity 1s ease}.cc-window.cc-invisible{opacity:0}.cc-animate.cc-revoke{transition:transform 1s ease}.cc-animate.cc-revoke.cc-top{transform:translateY(-2em)}.cc-animate.cc-revoke.cc-bottom{transform:translateY(2em)}.cc-animate.cc-revoke.cc-active.cc-bottom,.cc-animate.cc-revoke.cc-active.cc-top,.cc-revoke:hover{transform:translateY(0)}.cc-grower{max-height:0;overflow:hidden;transition:max-height 1s}
.cc-link,.cc-revoke:hover{text-decoration:underline}.cc-revoke,.cc-window{position:fixed;overflow:hidden;box-sizing:border-box;font-family:Helvetica,Calibri,Arial,sans-serif;font-size:16px;line-height:1.5em;display:-ms-flexbox;display:flex;-ms-flex-wrap:nowrap;flex-wrap:nowrap;z-index:9999}.cc-window.cc-static{position:static}.cc-window.cc-floating{padding:2em;max-width:24em;-ms-flex-direction:column;flex-direction:column}.cc-window.cc-banner{padding:1em 1.8em;width:100%;-ms-flex-direction:row;flex-direction:row}.cc-revoke{padding:.5em}.cc-header{font-size:18px;font-weight:700}.cc-btn,.cc-close,.cc-link,.cc-revoke{cursor:pointer}.cc-link{opacity:.8;display:inline-block;padding:.2em}.cc-link:hover{opacity:1}.cc-link:active,.cc-link:visited{color:initial}.cc-btn{display:block;padding:.4em .8em;font-size:.9em;font-weight:700;border-width:2px;border-style:solid;text-align:center;white-space:nowrap}.cc-highlight .cc-btn:first-child{background-color:transparent;border-color:transparent}.cc-highlight .cc-btn:first-child:focus,.cc-highlight .cc-btn:first-child:hover{background-color:transparent;text-decoration:underline}.cc-close{display:block;position:absolute;top:.5em;right:.5em;font-size:1.6em;opacity:.9;line-height:.75}.cc-close:focus,.cc-close:hover{opacity:1}
.cc-revoke.cc-top{top:0;left:3em;border-bottom-left-radius:.5em;border-bottom-right-radius:.5em}.cc-revoke.cc-bottom{bottom:0;left:3em;border-top-left-radius:.5em;border-top-right-radius:.5em}.cc-revoke.cc-left{left:3em;right:unset}.cc-revoke.cc-right{right:3em;left:unset}.cc-top{top:1em}.cc-left{left:1em}.cc-right{right:1em}.cc-bottom{bottom:1em}.cc-floating>.cc-link{margin-bottom:1em}.cc-floating .cc-message{display:block;margin-bottom:1em}.cc-window.cc-floating .cc-compliance{-ms-flex:1 0 auto;flex:1 0 auto}.cc-window.cc-banner{-ms-flex-align:center;align-items:center}.cc-banner.cc-top{left:0;right:0;top:0}.cc-banner.cc-bottom{left:0;right:0;bottom:0}.cc-banner .cc-message{display:block;-ms-flex:1 1 auto;flex:1 1 auto;max-width:100%;margin-right:1em}.cc-compliance{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-line-pack:justify;align-content:space-between}.cc-floating .cc-compliance>.cc-btn{-ms-flex:1;flex:1}.cc-btn+.cc-btn{margin-left:.5em}
@media print{.cc-revoke,.cc-window{display:none}}@media screen and (max-width:900px){.cc-btn{white-space:normal}}@media screen and (max-width:414px) and (orientation:portrait),screen and (max-width:736px) and (orientation:landscape){.cc-window.cc-top{top:0}.cc-window.cc-bottom{bottom:0}.cc-window.cc-banner,.cc-window.cc-floating,.cc-window.cc-left,.cc-window.cc-right{left:0;right:0}.cc-window.cc-banner{-ms-flex-direction:column;flex-direction:column}.cc-window.cc-banner .cc-compliance{-ms-flex:1 1 auto;flex:1 1 auto}.cc-window.cc-floating{max-width:none}.cc-window .cc-message{margin-bottom:1em}.cc-window.cc-banner{-ms-flex-align:unset;align-items:unset}.cc-window.cc-banner .cc-message{margin-right:0}}
.cc-floating.cc-theme-classic{padding:1.2em;border-radius:5px}.cc-floating.cc-type-info.cc-theme-classic .cc-compliance{text-align:center;display:inline;-ms-flex:none;flex:none}.cc-theme-classic .cc-btn{border-radius:5px}.cc-theme-classic .cc-btn:last-child{min-width:140px}.cc-floating.cc-type-info.cc-theme-classic .cc-btn{display:inline-block}
.cc-theme-edgeless.cc-window{padding:0}.cc-floating.cc-theme-edgeless .cc-message{margin:2em 2em 1.5em}.cc-banner.cc-theme-edgeless .cc-btn{margin:0;padding:.8em 1.8em;height:100%}.cc-banner.cc-theme-edgeless .cc-message{margin-left:1em}.cc-floating.cc-theme-edgeless .cc-btn+.cc-btn{margin-left:0}


@media (max-width:1310px) {
  html[lang="es"] .container, html[lang="pt"] .container { padding-left: 20px; padding-right: 20px; }
  html[lang="es"] header.desktop .bottom nav > ul > li a, html[lang="pt"] header.desktop .bottom nav > ul > li a { font-size: 14px; }
}