/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */
html {
    line-height: 1.15;
    -webkit-text-size-adjust: 100%
}

body {
    margin: 0
}

main {
    display: block
}

h1 {
    font-size: 2em;
    margin: .67em 0
}

hr {
    box-sizing: content-box;
    height: 0;
    overflow: visible
}

pre {
    font-family: monospace, monospace;
    font-size: 1em
}

a {
    background-color: transparent
}

b, strong {
    font-weight: bolder
}

code {
    font-family: monospace, monospace;
    font-size: 1em
}

small {
    font-size: 80%
}

img {
    border-style: none
}

button, input, select, textarea {
    font-family: inherit;
    font-size: 100%;
    line-height: 1.15;
    margin: 0
}

button, input {
    overflow: visible
}

button, select {
    text-transform: none
}

.text-grey.hidden.md\:block.leading-normal {
    display: -webkit-box;
    -webkit-line-clamp: 5;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

header.thumbnail.transition-3.w-1\/3.float-left.mx-3.mb-2.xl\:mx-6 picture img {
    height: 250px;
    object-fit: cover;
}

.story-img {
    border-radius: 12px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
    width: 100%;
    height: 350px;
    object-fit: cover;
}

h3.mb-0.text-lg.text-green-accessible.pb-2.font-body.leading-tight {
    height: 115px !important;
}

[type=button], [type=submit], button {
    -webkit-appearance: button
}

[type=button]::-moz-focus-inner, [type=submit]::-moz-focus-inner, button::-moz-focus-inner {
    border-style: none;
    padding: 0
}

[type=button]:-moz-focusring, [type=submit]:-moz-focusring, button:-moz-focusring {
    outline: 1px dotted ButtonText
}

textarea {
    overflow: auto
}

[type=checkbox] {
    box-sizing: border-box;
    padding: 0
}

[type=number]::-webkit-inner-spin-button, [type=number]::-webkit-outer-spin-button {
    height: auto
}

[type=search] {
    -webkit-appearance: textfield;
    outline-offset: -2px
}

[type=search]::-webkit-search-decoration {
    -webkit-appearance: none
}

details {
    display: block
}

summary {
    display: list-item
}

[hidden], template {
    display: none
}

blockquote, dd, dl, h1, h2, h3, h4, hr, p, pre {
    margin: 0
}

button {
    background-color: transparent;
    background-image: none
}

button:focus {
    outline: 1px dotted;
    outline: 5px auto -webkit-focus-ring-color
}

ol, ul {
    margin: 0;
    padding: 0
}

ol, ul {
    list-style: none
}

html {
    font-family: system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, Noto Sans, sans-serif, BlinkMacSystemFont, Helvetica Neue, Arial, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji;
    line-height: 1.5
}

* {
    box-sizing: border-box;
    border: 0 solid
}

hr {
    border-top-width: 1px
}

img {
    border-style: solid
}

textarea {
    resize: vertical
}

input::-moz-placeholder, textarea::-moz-placeholder {
    color: #a0aec0
}

input:-ms-input-placeholder, textarea:-ms-input-placeholder {
    color: #a0aec0
}

input::placeholder, textarea::placeholder {
    color: #a0aec0
}

[role=button], button {
    cursor: pointer
}

table {
    border-collapse: collapse
}

h1, h2, h3, h4 {
    font-size: inherit;
    font-weight: inherit
}

a {
    color: inherit;
    text-decoration: inherit
}

button, input, select, textarea {
    padding: 0;
    line-height: inherit;
    color: inherit
}

code, pre {
    font-family: Inconsolata, consolas, menlo, courier, monospaced
}

canvas, embed, iframe, img, object, svg, video {
    display: block;
    vertical-align: middle
}

img, video {
    max-width: 100%;
    height: auto
}

.container {
    width: 100%;
    margin-right: auto;
    margin-left: auto;
    padding-right: 2rem;
    padding-left: 2rem
}

@media (min-width: 640px) {
    .container {
        max-width: 640px
    }
}

@media (min-width: 768px) {
    .container {
        max-width: 768px
    }
}

@media (min-width: 1024px) {
    .container {
        max-width: 1024px
    }
}

@media (min-width: 1280px) {
    .container {
        max-width: 1280px
    }
}

.transition-bg {
    transition-property: background
}

.transition-1 {
    transition-duration: .25s
}

.transition-2 {
    transition-duration: .5s
}

.transition-3 {
    transition-duration: .75s
}

.transition-4 {
    transition-duration: 1s
}

.w-breakout {
    width: 100vw;
    left: calc(-50vw - -50%)
}

@font-face {
    font-family: OxfamHeadline;
    font-style: normal;
    font-weight: 400;
    font-display: swap;
}

@font-face {
    font-family: TStar;
    font-style: normal;
    font-weight: 500;
    font-display: swap;
}

@font-face {
    font-family: TStar;
    font-style: normal;
    font-weight: 700;
    font-display: swap;
}

@font-face {
    font-family: Roboto;
    font-style: "normal";
    font-weight: 500;
    font-display: swap;
}

.w-breakout, body, html {
    position: relative
}

body {
    font-family: Roboto, arial, helvetica, sans-serif;
    color: #545454;
    color: rgba(84, 84, 84, var(--text-opacity));
    overflow-x: hidden
}

body, h1 {
    --text-opacity: 1
}

h1 {
    font-size: 2rem;
    margin-top: .5rem;
    margin-bottom: .75rem;
    font-family: TStar, sans-serif;
    font-weight: 700;
    line-height: 1.25;
    color: #44841a;
    color: rgba(68, 132, 26, var(--text-opacity))
}

@media (min-width: 1024px) {
    h1 {
        font-size: 2.5rem
    }
}

.special {
    font-family: OxfamHeadline, sans-serif;
    font-weight: 500;
    color: #44841a;
    color: rgba(68, 132, 26, var(--text-opacity))
}

.special, h2 {
    --text-opacity: 1
}

h2 {
    font-size: 1.5rem;
    margin-top: .5rem;
    margin-bottom: .75rem;
    font-family: TStar, sans-serif;
    font-weight: 700;
    line-height: 1.5;
    color: #f16e22;
    color: rgba(241, 110, 34, var(--text-opacity))
}

@media (min-width: 1024px) {
    h2 {
        font-size: 1.75rem
    }
}

h2.special {
    font-size: 1.75rem
}

@media (min-width: 1024px) {
    h2.special {
        font-size: 2.25rem
    }
}

h3 {
    font-size: 1.25rem;
    margin-bottom: .5rem;
    font-family: Roboto, arial, helvetica, sans-serif;
    font-family: TStar, sans-serif;
    font-weight: 700;
    line-height: 1.5;
    --text-opacity: 1;
    color: #44841a;
    color: rgba(68, 132, 26, var(--text-opacity))
}

@media (min-width: 1024px) {
    h3 {
        font-size: 1.5rem
    }
}

h4 {
    font-size: 1.125rem;
    margin-bottom: .75rem;
    font-family: Roboto, arial, helvetica, sans-serif;
    font-weight: 500;
    line-height: 1.5;
    --text-opacity: 1;
    color: #f16e22;
    color: rgba(241, 110, 34, var(--text-opacity))
}

@media (min-width: 1024px) {
    h4 {
        font-size: 1.25rem
    }
}

.copy-small-print {
    font-size: .75rem;
    line-height: 1.5
}

.copy-small-print p {
    margin-bottom: 1rem
}

.copy-small-print p:last-of-type {
    margin-bottom: 0
}

.copy-small {
    font-family: Roboto, arial, helvetica, sans-serif;
    font-size: .875rem;
    line-height: 1.25
}

.copy-small p {
    margin-bottom: 1rem
}

.copy-small p:last-of-type {
    margin-bottom: 0
}

.copy-normal {
    font-family: Roboto, arial, helvetica, sans-serif;
    font-size: 1rem;
    line-height: 1.25
}

.copy-normal p {
    margin-bottom: 1rem
}

.copy-normal p:last-of-type {
    margin-bottom: 0
}

.copy-large {
    font-family: Roboto, arial, helvetica, sans-serif;
    font-size: 1.25rem;
    line-height: 1.25
}

.copy-large p {
    margin-bottom: 1rem
}

.copy-large p:last-of-type {
    margin-bottom: 0
}

.copy-body {
    font-family: Roboto, arial, helvetica, sans-serif;
    font-size: 1rem;
    line-height: 1.5
}

.copy-body p {
    margin-bottom: 1rem
}

.copy-body p:last-of-type {
    margin-bottom: 0
}

.copy-body ul {
    padding-left: 2rem;
    list-style-type: disc
}

.copy-body ol {
    padding-left: 2rem;
    list-style-type: decimal
}

.copy-body small {
    font-size: .75rem
}

.copy-body a {
    text-decoration: underline
}

@media (min-width: 768px) {
    .copy-body, .copy-normal {
        font-size: 1.125rem
    }
}

code {
    font-family: Inconsolata, consolas, menlo, courier, monospaced;
    font-size: .875rem;
    padding: .25rem .5rem;
    --bg-opacity: 1;
    background-color: #eaeade;
    background-color: rgba(234, 234, 222, var(--bg-opacity))
}

.max-width-text {
    max-width: 900px
}

body {
    margin: 0
}

a {
    color: #44841a;
    color: rgba(68, 132, 26, var(--text-opacity))
}

a, article a {
    --text-opacity: 1
}

article a {
    color: #097daf;
    color: rgba(9, 125, 175, var(--text-opacity));
    font-weight: 600
}

article a:hover {
    --text-opacity: 1;
    color: #44841a;
    color: rgba(68, 132, 26, var(--text-opacity));
    text-decoration: none
}

.paragraph + .paragraph:not(.child-has-boxstyle) {
    margin-top: 2rem
}

.grid-template {
    display: flex;
    flex-wrap: wrap;
    margin: 0 -1.5rem
}

@supports (display:grid) {
    .grid-template {
        display: grid;
        margin: 0
    }
}

@supports (display:grid) {
    .grid-col-three {
        grid-template-columns:1fr;
        grid-column-gap: 1.5rem;
        grid-row-gap: 1.5rem
    }

    @media screen and (min-width: 768px) {
        .grid-col-three {
            grid-template-columns:1fr 1fr
        }
    }@media screen and (min-width: 1024px) {
    .grid-col-three {
        grid-template-columns:1fr 1fr 1fr
    }
}
}

.grid-col-three > * {
    width: 100%;
    margin: 0 1.5rem 1.5rem
}

@media screen and (min-width: 768px) {
    .grid-col-three > * {
        width: calc(50% - 3rem)
    }
}

@media screen and (min-width: 1024px) {
    .grid-col-three > * {
        width: calc(33% - 3rem)
    }
}

@supports (display:grid) {
    .grid-col-three > * {
        max-width: none;
        margin: 0;
        width: 100%
    }
}

.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border-width: 0
}

.bg-green-oxfam {
    --bg-opacity: 1;
    background-color: #44841a;
    background-color: rgba(68, 132, 26, var(--bg-opacity))
}

.bg-green-oxfam-dark {
    --bg-opacity: 1;
    background-color: #3f6b22;
    background-color: rgba(63, 107, 34, var(--bg-opacity))
}

.bg-green-dark {
    --bg-opacity: 1;
    background-color: #336114;
    background-color: rgba(51, 97, 20, var(--bg-opacity))
}

.bg-red {
    --bg-opacity: 1;
    background-color: #e70052;
    background-color: rgba(231, 0, 82, var(--bg-opacity))
}

.bg-red-dark {
    --bg-opacity: 1;
    background-color: #cc1225;
    background-color: rgba(204, 18, 37, var(--bg-opacity))
}

.bg-red-deep {
    --bg-opacity: 1;
    background-color: #ff1d34;
    background-color: rgba(255, 29, 52, var(--bg-opacity))
}

.bg-orange {
    --bg-opacity: 1;
    background-color: #f16e22;
    background-color: rgba(241, 110, 34, var(--bg-opacity))
}

.bg-orange-dark {
    --bg-opacity: 1;
    background-color: #9d4816;
    background-color: rgba(157, 72, 22, var(--bg-opacity))
}

.bg-blue {
    --bg-opacity: 1;
    background-color: #0b9cda;
    background-color: rgba(11, 156, 218, var(--bg-opacity))
}

.bg-white {
    --bg-opacity: 1;
    background-color: #fff;
    background-color: rgba(255, 255, 255, var(--bg-opacity))
}

.bg-black {
    --bg-opacity: 1;
    background-color: #000;
    background-color: rgba(0, 0, 0, var(--bg-opacity))
}

.bg-grey-dark {
    --bg-opacity: 1;
    background-color: #333;
    background-color: rgba(51, 51, 51, var(--bg-opacity))
}

.bg-purple {
    --bg-opacity: 1;
    background-color: #53297d;
    background-color: rgba(83, 41, 125, var(--bg-opacity))
}

.bg-beige-light {
    --bg-opacity: 1;
    background-color: #eaeade;
    background-color: rgba(234, 234, 222, var(--bg-opacity))
}

.bg-burgundy {
    --bg-opacity: 1;
    background-color: #630235;
    background-color: rgba(99, 2, 53, var(--bg-opacity))
}

.hover\:bg-green-oxfam:hover {
    --bg-opacity: 1;
    background-color: #44841a;
    background-color: rgba(68, 132, 26, var(--bg-opacity))
}

.hover\:bg-green-oxfam-dark:hover {
    --bg-opacity: 1;
    background-color: #3f6b22;
    background-color: rgba(63, 107, 34, var(--bg-opacity))
}

.hover\:bg-red-dark:hover {
    --bg-opacity: 1;
    background-color: #cc1225;
    background-color: rgba(204, 18, 37, var(--bg-opacity))
}

.hover\:bg-red-deep-dark:hover {
    --bg-opacity: 1;
    background-color: #a61322;
    background-color: rgba(166, 19, 34, var(--bg-opacity))
}

.hover\:bg-orange-dark:hover {
    --bg-opacity: 1;
    background-color: #9d4816;
    background-color: rgba(157, 72, 22, var(--bg-opacity))
}

.hover\:bg-grey:hover {
    --bg-opacity: 1;
    background-color: #545454;
    background-color: rgba(84, 84, 84, var(--bg-opacity))
}

.border-green-oxfam {
    --border-opacity: 1;
    border-color: #44841a;
    border-color: rgba(68, 132, 26, var(--border-opacity))
}

.border-green-light {
    --border-opacity: 1;
    border-color: #bece45;
    border-color: rgba(190, 206, 69, var(--border-opacity))
}

.border-shadow {
    --border-opacity: 1;
    border-color: #d9d9ce;
    border-color: rgba(217, 217, 206, var(--border-opacity))
}

.border-burgundy {
    --border-opacity: 1;
    border-color: #630235;
    border-color: rgba(99, 2, 53, var(--border-opacity))
}

.rounded {
    border-radius: .25rem
}

.rounded-r-none {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0
}

.border-solid {
    border-style: solid
}

.border-0 {
    border-width: 0
}

.border-4 {
    border-width: 4px
}

.border {
    border-width: 1px
}

.border-l-2 {
    border-left-width: 2px
}

.border-l-4 {
    border-left-width: 4px
}

.border-l-8 {
    border-left-width: 8px
}

.border-t {
    border-top-width: 1px
}

.border-r {
    border-right-width: 1px
}

.border-b {
    border-bottom-width: 1px
}

.border-l {
    border-left-width: 1px
}

.block {
    display: block
}

.inline-block {
    display: inline-block
}

.inline {
    display: inline
}

.flex {
    display: flex
}

.table {
    display: table
}

.grid {
    display: grid
}

.contents {
    display: contents
}

.hidden {
    display: none
}

.flex-col {
    flex-direction: column
}

.flex-wrap {
    flex-wrap: wrap
}

.flex-no-wrap {
    flex-wrap: nowrap
}

.items-start {
    align-items: flex-start
}

.items-end {
    align-items: flex-end
}

.items-center {
    align-items: center
}

.items-baseline {
    align-items: baseline
}

.self-start {
    align-self: flex-start
}

.self-end {
    align-self: flex-end
}

.justify-end {
    justify-content: flex-end
}

.justify-center {
    justify-content: center
}

.justify-between {
    justify-content: space-between
}

.flex-1 {
    flex: 1 1 0%
}

.flex-auto {
    flex: 1 1 auto
}

.flex-initial {
    flex: 0 1 auto
}

.flex-grow-0 {
    flex-grow: 0
}

.flex-grow {
    flex-grow: 1
}

.flex-shrink-0 {
    flex-shrink: 0
}

.order-2 {
    order: 2
}

.order-3 {
    order: 3
}

.float-right {
    float: right
}

.float-left {
    float: left
}

.clearfix:after {
    content: "";
    display: table;
    clear: both
}

.clear-right {
    clear: right
}

.clear-both {
    clear: both
}

.font-headline {
    font-family: OxfamHeadline, sans-serif
}

.font-heading {
    font-family: TStar, sans-serif
}

.font-body {
    font-family: Roboto, arial, helvetica, sans-serif
}

.font-mono {
    font-family: Inconsolata, consolas, menlo, courier, monospaced
}

.font-normal {
    font-weight: 400
}

.font-medium {
    font-weight: 500
}

.font-bold {
    font-weight: 700
}

.h-6 {
    height: 1.5rem
}

.h-8 {
    height: 2rem
}

.h-12 {
    height: 3rem
}

.h-full {
    height: 100%
}

.h-screen {
    height: 100vh
}

.text-xs {
    font-size: .75rem
}

.text-sm {
    font-size: .875rem
}

.text-lg {
    font-size: 1.125rem
}

.text-xl {
    font-size: 1.25rem
}

.text-2xl {
    font-size: 1.5rem
}

.text-3xl {
    font-size: 1.75rem
}

.text-4xl {
    font-size: 2rem
}

.text-5xl {
    font-size: 2.25rem
}

.leading-tight {
    line-height: 1.25
}

.leading-normal {
    line-height: 1.5
}

.list-none {
    list-style-type: none
}

.m-0 {
    margin: 0
}

.m-2 {
    margin: .5rem
}

.m-auto {
    margin: auto
}

.my-0 {
    margin-top: 0;
    margin-bottom: 0
}

.mx-0 {
    margin-left: 0;
    margin-right: 0
}

.my-2 {
    margin-top: .5rem;
    margin-bottom: .5rem
}

.mx-2 {
    margin-left: .5rem;
    margin-right: .5rem
}

.my-3 {
    margin-top: .75rem;
    margin-bottom: .75rem
}

.mx-3 {
    margin-left: .75rem;
    margin-right: .75rem
}

.my-4 {
    margin-top: 1rem;
    margin-bottom: 1rem
}

.my-6 {
    margin-top: 1.5rem;
    margin-bottom: 1.5rem
}

.my-8 {
    margin-top: 2rem;
    margin-bottom: 2rem
}

.mx-auto {
    margin-left: auto;
    margin-right: auto
}

.-mx-4 {
    margin-left: -1rem;
    margin-right: -1rem
}

.mt-0 {
    margin-top: 0
}

.mb-0 {
    margin-bottom: 0
}

.mt-1 {
    margin-top: .25rem
}

.mt-2 {
    margin-top: .5rem
}

.mr-2 {
    margin-right: .5rem
}

.mb-2 {
    margin-bottom: .5rem
}

.ml-2 {
    margin-left: .5rem
}

.mr-3 {
    margin-right: .75rem
}

.mb-3 {
    margin-bottom: .75rem
}

.ml-3 {
    margin-left: .75rem
}

.mt-4 {
    margin-top: 1rem
}

.mr-4 {
    margin-right: 1rem
}

.mb-4 {
    margin-bottom: 1rem
}

.ml-4 {
    margin-left: 1rem
}

.mt-5 {
    margin-top: 1.25rem
}

.mt-6 {
    margin-top: 1.5rem
}

.mr-6 {
    margin-right: 1.5rem
}

.mb-6 {
    margin-bottom: 1.5rem
}

.mt-8 {
    margin-top: 2rem
}

.mb-8 {
    margin-bottom: 2rem
}

.ml-8 {
    margin-left: 2rem
}

.mt-10 {
    margin-top: 2.5rem
}

.mb-10 {
    margin-bottom: 2.5rem
}

.mb-12 {
    margin-bottom: 3rem
}

.mt-16 {
    margin-top: 4rem
}

.mt-20 {
    margin-top: 5rem
}

.mb-05 {
    margin-bottom: .125rem
}

.mr-4e {
    margin-right: 1em
}

.-mb-4 {
    margin-bottom: -1rem
}

.-mt-6 {
    margin-top: -1.5rem
}

.max-w-sm {
    max-width: 480px
}

.opacity-50 {
    opacity: .5
}

.hover\:opacity-75:hover {
    opacity: .75
}

.overflow-hidden {
    overflow: hidden
}

.p-0 {
    padding: 0
}

.p-1 {
    padding: .25rem
}

.p-2 {
    padding: .5rem
}

.p-3 {
    padding: .75rem
}

.p-4 {
    padding: 1rem
}

.p-6 {
    padding: 1.5rem
}

.px-0 {
    padding-left: 0;
    padding-right: 0
}

.py-2 {
    padding-top: .5rem;
    padding-bottom: .5rem
}

.px-2 {
    padding-left: .5rem;
    padding-right: .5rem
}

.py-3 {
    padding-top: .75rem;
    padding-bottom: .75rem
}

.px-3 {
    padding-left: .75rem;
    padding-right: .75rem
}

.py-4 {
    padding-top: 1rem;
    padding-bottom: 1rem
}

.px-4 {
    padding-left: 1rem;
    padding-right: 1rem
}

.py-5 {
    padding-top: 1.25rem;
    padding-bottom: 1.25rem
}

.px-5 {
    padding-left: 1.25rem;
    padding-right: 1.25rem
}

.px-6 {
    padding-left: 1.5rem;
    padding-right: 1.5rem
}

.py-8 {
    padding-top: 2rem;
    padding-bottom: 2rem
}

.px-8 {
    padding-left: 2rem;
    padding-right: 2rem
}

.py-12 {
    padding-top: 3rem;
    padding-bottom: 3rem
}

.py-16 {
    padding-top: 4rem;
    padding-bottom: 4rem
}

.px-20 {
    padding-left: 5rem;
    padding-right: 5rem
}

.px-4e {
    padding-left: 1em;
    padding-right: 1em
}

.pt-0 {
    padding-top: 0
}

.pb-0 {
    padding-bottom: 0
}

.pl-0 {
    padding-left: 0
}

.pr-1 {
    padding-right: .25rem
}

.pb-1 {
    padding-bottom: .25rem
}

.pt-2 {
    padding-top: .5rem
}

.pr-2 {
    padding-right: .5rem
}

.pb-2 {
    padding-bottom: .5rem
}

.pt-3 {
    padding-top: .75rem
}

.pr-3 {
    padding-right: .75rem
}

.pb-3 {
    padding-bottom: .75rem
}

.pl-3 {
    padding-left: .75rem
}

.pt-4 {
    padding-top: 1rem
}

.pr-4 {
    padding-right: 1rem
}

.pb-4 {
    padding-bottom: 1rem
}

.pl-4 {
    padding-left: 1rem
}

.pt-5 {
    padding-top: 1.25rem
}

.pt-6 {
    padding-top: 1.5rem
}

.pr-6 {
    padding-right: 1.5rem
}

.pb-6 {
    padding-bottom: 1.5rem
}

.pl-6 {
    padding-left: 1.5rem
}

.pt-8 {
    padding-top: 2rem
}

.pr-8 {
    padding-right: 2rem
}

.pb-8 {
    padding-bottom: 2rem
}

.pt-10 {
    padding-top: 2.5rem
}

.pb-10 {
    padding-bottom: 2.5rem
}

.pb-12 {
    padding-bottom: 3rem
}

.pl-12 {
    padding-left: 3rem
}

.pr-4e {
    padding-right: 1em
}

.pl-4e {
    padding-left: 1em
}

.static {
    position: static
}

.fixed {
    position: fixed
}

.absolute {
    position: absolute
}

.relative {
    position: relative
}

.sticky {
    position: sticky
}

.top-0 {
    top: 0
}

.bottom-0 {
    bottom: 0
}

.left-0 {
    left: 0
}

.resize {
    resize: both
}

.text-left {
    text-align: left
}

.text-center {
    text-align: center
}

.text-right {
    text-align: right
}

.text-green-oxfam {
    --text-opacity: 1;
    color: #44841a;
    color: rgba(68, 132, 26, var(--text-opacity))
}

.text-green-accessible {
    --text-opacity: 1;
    color: #44841a;
    color: rgba(68, 132, 26, var(--text-opacity))
}

.text-green-dark {
    --text-opacity: 1;
    color: #336114;
    color: rgba(51, 97, 20, var(--text-opacity))
}

.text-red {
    --text-opacity: 1;
    color: #e70052;
    color: rgba(231, 0, 82, var(--text-opacity))
}

.text-red-deep {
    --text-opacity: 1;
    color: #ff1d34;
    color: rgba(255, 29, 52, var(--text-opacity))
}

.text-orange {
    --text-opacity: 1;
    color: #f16e22;
    color: rgba(241, 110, 34, var(--text-opacity))
}

.text-white {
    --text-opacity: 1;
    color: #fff;
    color: rgba(255, 255, 255, var(--text-opacity))
}

.text-grey {
    --text-opacity: 1;
    color: #545454;
    color: rgba(84, 84, 84, var(--text-opacity))
}

.text-grey-dark {
    --text-opacity: 1;
    color: #333;
    color: rgba(51, 51, 51, var(--text-opacity))
}

.text-purple {
    --text-opacity: 1;
    color: #53297d;
    color: rgba(83, 41, 125, var(--text-opacity))
}

.text-burgundy {
    --text-opacity: 1;
    color: #630235;
    color: rgba(99, 2, 53, var(--text-opacity))
}

.hover\:text-green-oxfam:hover {
    --text-opacity: 1;
    color: #44841a;
    color: rgba(68, 132, 26, var(--text-opacity))
}

.hover\:text-green-accessible:hover {
    --text-opacity: 1;
    color: #44841a;
    color: rgba(68, 132, 26, var(--text-opacity))
}

.hover\:text-blue:hover {
    --text-opacity: 1;
    color: #0b9cda;
    color: rgba(11, 156, 218, var(--text-opacity))
}

.hover\:text-grey:hover {
    --text-opacity: 1;
    color: #545454;
    color: rgba(84, 84, 84, var(--text-opacity))
}

.hover\:text-grey-dark:hover {
    --text-opacity: 1;
    color: #333;
    color: rgba(51, 51, 51, var(--text-opacity))
}

.uppercase {
    text-transform: uppercase
}

.underline {
    text-decoration: underline
}

.visible {
    visibility: visible
}

.invisible {
    visibility: hidden
}

.whitespace-no-wrap {
    white-space: nowrap
}

.w-8 {
    width: 2rem
}

.w-48 {
    width: 12rem
}

.w-1\/2 {
    width: 50%
}

.w-1\/3 {
    width: 33.333333%
}

.w-2\/3 {
    width: 66.666667%
}

.w-1\/4 {
    width: 25%
}

.w-2\/4 {
    width: 50%
}

.w-full {
    width: 100%
}

.w-screen {
    width: 100vw
}

.z-10 {
    z-index: 10
}

.z-20 {
    z-index: 20
}

.grid-flow-row {
    grid-auto-flow: row
}

.grid-flow-col {
    grid-auto-flow: column
}

.grid-flow-row-dense {
    grid-auto-flow: row dense
}

.grid-flow-col-dense {
    grid-auto-flow: column dense
}

.grid-cols-1 {
    grid-template-columns:repeat(1, minmax(0, 1fr))
}

.grid-cols-2 {
    grid-template-columns:repeat(2, minmax(0, 1fr))
}

.grid-cols-3 {
    grid-template-columns:repeat(3, minmax(0, 1fr))
}

.grid-cols-4 {
    grid-template-columns:repeat(4, minmax(0, 1fr))
}

.grid-cols-5 {
    grid-template-columns:repeat(5, minmax(0, 1fr))
}

.grid-cols-6 {
    grid-template-columns:repeat(6, minmax(0, 1fr))
}

.grid-cols-7 {
    grid-template-columns:repeat(7, minmax(0, 1fr))
}

.grid-cols-8 {
    grid-template-columns:repeat(8, minmax(0, 1fr))
}

.grid-cols-9 {
    grid-template-columns:repeat(9, minmax(0, 1fr))
}

.grid-cols-10 {
    grid-template-columns:repeat(10, minmax(0, 1fr))
}

.grid-cols-11 {
    grid-template-columns:repeat(11, minmax(0, 1fr))
}

.grid-cols-12 {
    grid-template-columns:repeat(12, minmax(0, 1fr))
}

.grid-cols-none {
    grid-template-columns:none
}

.grid-rows-1 {
    grid-template-rows:repeat(1, minmax(0, 1fr))
}

.grid-rows-2 {
    grid-template-rows:repeat(2, minmax(0, 1fr))
}

.grid-rows-3 {
    grid-template-rows:repeat(3, minmax(0, 1fr))
}

.grid-rows-4 {
    grid-template-rows:repeat(4, minmax(0, 1fr))
}

.grid-rows-5 {
    grid-template-rows:repeat(5, minmax(0, 1fr))
}

.grid-rows-6 {
    grid-template-rows:repeat(6, minmax(0, 1fr))
}

.grid-rows-none {
    grid-template-rows:none
}

.transform {
    --transform-translate-x: 0;
    --transform-translate-y: 0;
    --transform-rotate: 0;
    --transform-skew-x: 0;
    --transform-skew-y: 0;
    --transform-scale-x: 1;
    --transform-scale-y: 1;
    transform: translateX(var(--transform-translate-x)) translateY(var(--transform-translate-y)) rotate(var(--transform-rotate)) skewX(var(--transform-skew-x)) skewY(var(--transform-skew-y)) scaleX(var(--transform-scale-x)) scaleY(var(--transform-scale-y))
}

.transition-opacity {
    transition-property: opacity
}

@-webkit-keyframes spin {
    to {
        transform: rotate(1turn)
    }
}

@keyframes spin {
    to {
        transform: rotate(1turn)
    }
}

@-webkit-keyframes ping {
    to {
        transform: scale(2);
        opacity: 0
    }
}

@keyframes ping {
    75%, to {
        transform: scale(2);
        opacity: 0
    }
}

@keyframes pulse {
    50% {
        opacity: .5
    }
}

@-webkit-keyframes bounce {
    to {
        transform: translateY(-25%);
        -webkit-animation-timing-function: cubic-bezier(.8, 0, 1, 1);
        animation-timing-function: cubic-bezier(.8, 0, 1, 1)
    }
}

@keyframes bounce {
    0%, to {
        transform: translateY(-25%);
        -webkit-animation-timing-function: cubic-bezier(.8, 0, 1, 1);
        animation-timing-function: cubic-bezier(.8, 0, 1, 1)
    }
    50% {
        transform: none;
        -webkit-animation-timing-function: cubic-bezier(0, 0, .2, 1);
        animation-timing-function: cubic-bezier(0, 0, .2, 1)
    }
}

.triangle-after-green-d {
    position: relative
}

.triangle-after-green-d:after {
    content: "";
    height: 0;
    position: absolute;
    pointer-events: none;
    width: 0;
    top: -1rem;
    right: 1rem;
    border-color: #44841a transparent transparent;
    border-style: solid;
    border-width: 6px 5px 0
}

@media (min-width: 640px) {
    .sm\:grid {
        display: grid
    }

    .sm\:ml-2 {
        margin-left: .5rem
    }

    .sm\:pb-8 {
        padding-bottom: 2rem
    }

    .sm\:text-right {
        text-align: right
    }

    .sm\:gap-1 {
        grid-gap: .25rem;
        gap: .25rem
    }

    .sm\:grid-cols-4 {
        grid-template-columns:repeat(4, minmax(0, 1fr))
    }

    .sm\:col-span-1 {
        grid-column: span 1/span 1
    }

    .sm\:col-span-3 {
        grid-column: span 3/span 3
    }
}

@media (min-width: 768px) {
    .md\:bg-white {
        --bg-opacity: 1;
        background-color: #fff;
        background-color: rgba(255, 255, 255, var(--bg-opacity))
    }

    .md\:bg-beige-light {
        --bg-opacity: 1;
        background-color: #eaeade;
        background-color: rgba(234, 234, 222, var(--bg-opacity))
    }

    .md\:block {
        display: block
    }

    .md\:flex {
        display: flex
    }

    .md\:grid {
        display: grid
    }

    .md\:flex-row {
        flex-direction: row
    }

    .md\:flex-wrap {
        flex-wrap: wrap
    }

    .md\:justify-around {
        justify-content: space-around
    }

    .md\:flex-1 {
        flex: 1 1 0%
    }

    .md\:flex-auto {
        flex: 1 1 auto
    }

    .md\:order-1 {
        order: 1
    }

    .md\:order-2 {
        order: 2
    }

    .md\:order-3 {
        order: 3
    }

    .md\:float-right {
        float: right
    }

    .md\:text-xs {
        font-size: .75rem
    }

    .md\:text-sm {
        font-size: .875rem
    }

    .md\:m-0 {
        margin: 0
    }

    .md\:-mx-4 {
        margin-left: -1rem;
        margin-right: -1rem
    }

    .md\:mt-0 {
        margin-top: 0
    }

    .md\:mb-0 {
        margin-bottom: 0
    }

    .md\:mr-2 {
        margin-right: .5rem
    }

    .md\:mb-2 {
        margin-bottom: .5rem
    }

    .md\:ml-2 {
        margin-left: .5rem
    }

    .md\:mr-4 {
        margin-right: 1rem
    }

    .md\:ml-4 {
        margin-left: 1rem
    }

    .md\:mb-6 {
        margin-bottom: 1.5rem
    }

    .md\:mb-16 {
        margin-bottom: 4rem
    }

    .md\:px-3 {
        padding-left: .75rem;
        padding-right: .75rem
    }

    .md\:px-4 {
        padding-left: 1rem;
        padding-right: 1rem
    }

    .md\:pb-0 {
        padding-bottom: 0
    }

    .md\:pt-2 {
        padding-top: .5rem
    }

    .md\:pr-3 {
        padding-right: .75rem
    }

    .md\:pl-3 {
        padding-left: .75rem
    }

    .md\:pl-6 {
        padding-left: 1.5rem
    }

    .md\:pr-10 {
        padding-right: 2.5rem
    }

    .md\:pb-10 {
        padding-bottom: 2.5rem
    }

    .md\:text-center {
        text-align: center
    }

    .md\:w-auto {
        width: auto
    }

    .md\:w-1\/2 {
        width: 50%
    }

    .md\:w-1\/3 {
        width: 33.333333%
    }

    .md\:w-2\/3 {
        width: 66.666667%
    }

    .md\:w-1\/4 {
        width: 25%
    }

    .md\:gap-2 {
        grid-gap: .5rem;
        gap: .5rem
    }

    .md\:grid-flow-row {
        grid-auto-flow: row
    }

    .md\:grid-cols-3 {
        grid-template-columns:repeat(3, minmax(0, 1fr))
    }
}

@media (min-width: 1024px) {
    .lg\:bg-white {
        --bg-opacity: 1;
        background-color: #fff;
        background-color: rgba(255, 255, 255, var(--bg-opacity))
    }

    .lg\:bg-transparent {
        background-color: transparent
    }

    .lg\:border-white {
        --border-opacity: 1;
        border-color: #fff;
        border-color: rgba(255, 255, 255, var(--border-opacity))
    }

    .lg\:border-shadow {
        --border-opacity: 1;
        border-color: #d9d9ce;
        border-color: rgba(217, 217, 206, var(--border-opacity))
    }

    .lg\:border-0 {
        border-width: 0
    }

    .lg\:border-r-4 {
        border-right-width: 4px
    }

    .lg\:border-b {
        border-bottom-width: 1px
    }

    .lg\:block {
        display: block
    }

    .lg\:inline-block {
        display: inline-block
    }

    .lg\:flex {
        display: flex
    }

    .lg\:hidden {
        display: none
    }

    .lg\:flex-row {
        flex-direction: row
    }

    .lg\:flex-no-wrap {
        flex-wrap: nowrap
    }

    .lg\:items-baseline {
        align-items: baseline
    }

    .lg\:justify-end {
        justify-content: flex-end
    }

    .lg\:flex-1 {
        flex: 1 1 0%
    }

    .lg\:flex-auto {
        flex: 1 1 auto
    }

    .lg\:flex-shrink-0 {
        flex-shrink: 0
    }

    .lg\:float-right {
        float: right
    }

    .lg\:float-left {
        float: left
    }

    .lg\:clear-right {
        clear: right
    }

    .lg\:text-sm {
        font-size: .875rem
    }

    .lg\:text-base {
        font-size: 1rem
    }

    .lg\:text-lg {
        font-size: 1.125rem
    }

    .lg\:text-xl {
        font-size: 1.25rem
    }

    .lg\:text-2xl {
        font-size: 1.5rem
    }

    .lg\:text-3xl {
        font-size: 1.75rem
    }

    .lg\:my-8 {
        margin-top: 2rem;
        margin-bottom: 2rem
    }

    .lg\:mx-auto {
        margin-left: auto;
        margin-right: auto
    }

    .lg\:mt-0 {
        margin-top: 0
    }

    .lg\:mb-0 {
        margin-bottom: 0
    }

    .lg\:mt-1 {
        margin-top: .25rem
    }

    .lg\:mt-2 {
        margin-top: .5rem
    }

    .lg\:mr-3 {
        margin-right: .75rem
    }

    .lg\:mb-3 {
        margin-bottom: .75rem
    }

    .lg\:ml-3 {
        margin-left: .75rem
    }

    .lg\:mr-6 {
        margin-right: 1.5rem
    }

    .lg\:mb-6 {
        margin-bottom: 1.5rem
    }

    .lg\:ml-6 {
        margin-left: 1.5rem
    }

    .lg\:mt-8 {
        margin-top: 2rem
    }

    .lg\:mr-8 {
        margin-right: 2rem
    }

    .lg\:mb-8 {
        margin-bottom: 2rem
    }

    .lg\:ml-8 {
        margin-left: 2rem
    }

    .lg\:mb-10 {
        margin-bottom: 2.5rem
    }

    .lg\:mt-16 {
        margin-top: 4rem
    }

    .lg\:mb-16 {
        margin-bottom: 4rem
    }

    .lg\:py-1 {
        padding-top: .25rem;
        padding-bottom: .25rem
    }

    .lg\:px-1 {
        padding-left: .25rem;
        padding-right: .25rem
    }

    .lg\:px-5 {
        padding-left: 1.25rem;
        padding-right: 1.25rem
    }

    .lg\:py-6 {
        padding-top: 1.5rem;
        padding-bottom: 1.5rem
    }

    .lg\:px-6 {
        padding-left: 1.5rem;
        padding-right: 1.5rem
    }

    .lg\:px-8 {
        padding-left: 2rem;
        padding-right: 2rem
    }

    .lg\:px-20 {
        padding-left: 5rem;
        padding-right: 5rem
    }

    .lg\:pr-0 {
        padding-right: 0
    }

    .lg\:pb-0 {
        padding-bottom: 0
    }

    .lg\:pl-0 {
        padding-left: 0
    }

    .lg\:pt-2 {
        padding-top: .5rem
    }

    .lg\:pr-3 {
        padding-right: .75rem
    }

    .lg\:pl-3 {
        padding-left: .75rem
    }

    .lg\:pt-4 {
        padding-top: 1rem
    }

    .lg\:pl-4 {
        padding-left: 1rem
    }

    .lg\:pt-6 {
        padding-top: 1.5rem
    }

    .lg\:pb-6 {
        padding-bottom: 1.5rem
    }

    .lg\:pt-8 {
        padding-top: 2rem
    }

    .lg\:pb-8 {
        padding-bottom: 2rem
    }

    .lg\:pl-12 {
        padding-left: 3rem
    }

    .lg\:static {
        position: static
    }

    .lg\:absolute {
        position: absolute
    }

    .lg\:top-0 {
        top: 0
    }

    .lg\:right-0 {
        right: 0
    }

    .lg\:bottom-0 {
        bottom: 0
    }

    .lg\:left-0 {
        left: 0
    }

    .lg\:text-center {
        text-align: center
    }

    .lg\:text-right {
        text-align: right
    }

    .lg\:w-auto {
        width: auto
    }

    .lg\:w-1\/2 {
        width: 50%
    }

    .lg\:w-1\/3 {
        width: 33.333333%
    }

    .lg\:w-1\/4 {
        width: 25%
    }

    .lg\:w-3\/4 {
        width: 75%
    }

    .lg\:w-2\/6 {
        width: 33.333333%
    }

    .lg\:w-4\/6 {
        width: 66.666667%
    }

    .lg\:w-full {
        width: 100%
    }

    .lg\:triangle-after-donate {
        position: relative
    }

    .lg\:triangle-after-donate:after {
        content: "";
        height: 0;
        position: absolute;
        pointer-events: none;
        width: 0;
        top: 50%;
        transform: translateY(-50%);
        right: -34px;
        border-color: transparent transparent transparent #f16e22;
        border-style: solid;
        border-width: 34px 0 34px 34px
    }
}

@media (min-width: 1280px) {
    .xl\:flex {
        display: flex
    }

    .xl\:flex-wrap {
        flex-wrap: wrap
    }

    .xl\:flex-1 {
        flex: 1 1 0%
    }

    .xl\:text-base {
        font-size: 1rem
    }

    .xl\:mx-6 {
        margin-left: 1.5rem;
        margin-right: 1.5rem
    }

    .xl\:mr-5 {
        margin-right: 1.25rem
    }

    .xl\:ml-5 {
        margin-left: 1.25rem
    }

    .xl\:py-6 {
        padding-top: 1.5rem;
        padding-bottom: 1.5rem
    }

    .xl\:pl-8 {
        padding-left: 2rem
    }

    .xl\:w-auto {
        width: auto
    }

    .xl\:w-1\/4 {
        width: 25%
    }

    .xl\:w-3\/4 {
        width: 75%
    }
}

.accordion {
    max-width: 900px
}

.accordion-pane .accordion-pane__heading:after {
    content: "";
    position: absolute;
    left: 8px;
    top: calc(50% - 10px);
    height: 20px;
    width: 3px;
    background: #630235;
    transition: .25s
}

.accordion-pane .accordion-pane__heading:before {
    content: "";
    position: absolute;
    left: 0;
    top: calc(50% - 2px);
    height: 3px;
    width: 20px;
    background: #630235;
    transition: .25s
}

.accordion-pane .accordion-pane__heading.active:after {
    transition: .25s;
    transform: rotate(90deg)
}

.accordion-pane .accordion-pane__heading.active:before {
    transition: .25s
}

.accordion-pane .accordion-pane__heading:hover h3 {
    color: #0b9cda
}

.accordion-pane .accordion-pane__heading:hover:after, .accordion-pane .accordion-pane__heading:hover:before {
    background: #0b9cda
}

.accordion-pane .accordion-pane__content {
    display: none;
    max-height: 0
}

@supports (--a:0) {
    .accordion-pane .accordion-pane__content {
        overflow: hidden;
        --max-height: 0px;
        display: block
    }
}

.accordion-pane .accordion-pane__content.active {
    display: block;
    max-height: none;
    padding-bottom: 1rem
}

@supports (--a:0) {
    .accordion-pane .accordion-pane__content.active {
        max-height: var(--max-height)
    }
}

.accordion-pane .accordion-pane__content.visible {
    max-height: none;
    display: block
}

.alert {
    background: #fff;
    border: 2px solid #000
}

.alert, .alert a {
    color: #000
}

.alert.alert-success {
    background: #336114
}

.alert.alert-info {
    background: #f16e22
}

.alert.alert-danger, .alert.alert-warning {
    background: #ff1d34
}

.bg-overlay {
    opacity: 0;
    position: fixed;
    height: 0
}


/*!
 * Hamburgers
 * @description Tasty CSS-animated hamburgers
 * @author Jonathan Suh @jonsuh
 * @site https://jonsuh.com/hamburgers
 * @link https://github.com/jonsuh/hamburgers
 */
.hamburger {
    padding: 15px;
    display: inline-block;
    cursor: pointer;
    transition-property: opacity, filter;
    transition-duration: .15s;
    transition-timing-function: linear;
    font: inherit;
    color: inherit;
    text-transform: none;
    background-color: transparent;
    border: 0;
    margin: 0;
    overflow: visible
}

.hamburger.is-active:hover, .hamburger:hover {
    opacity: .7
}

.hamburger.is-active .hamburger-inner, .hamburger.is-active .hamburger-inner:after, .hamburger.is-active .hamburger-inner:before {
    background-color: #3f6b22
}

.hamburger-box {
    width: 40px;
    height: 24px;
    display: inline-block;
    position: relative
}

.hamburger-inner {
    display: block;
    top: 50%;
    margin-top: -2px
}

.hamburger-inner, .hamburger-inner:after, .hamburger-inner:before {
    width: 40px;
    height: 4px;
    background-color: #44841a;
    border-radius: 4px;
    position: absolute;
    transition-property: transform;
    transition-duration: .15s;
    transition-timing-function: ease
}

.hamburger-inner:after, .hamburger-inner:before {
    content: "";
    display: block
}

.hamburger-inner:before {
    top: -10px
}

.hamburger-inner:after {
    bottom: -10px
}

.hamburger--collapse .hamburger-inner {
    top: auto;
    bottom: 0;
    transition-duration: .13s;
    transition-delay: .13s;
    transition-timing-function: cubic-bezier(.55, .055, .675, .19)
}

.hamburger--collapse .hamburger-inner:after {
    top: -20px;
    transition: top .2s cubic-bezier(.33333, .66667, .66667, 1) .2s, opacity .1s linear
}

.hamburger--collapse .hamburger-inner:before {
    transition: top .12s cubic-bezier(.33333, .66667, .66667, 1) .2s, transform .13s cubic-bezier(.55, .055, .675, .19)
}

.hamburger--collapse.is-active .hamburger-inner {
    transform: translate3d(0, -10px, 0) rotate(-45deg);
    transition-delay: .22s;
    transition-timing-function: cubic-bezier(.215, .61, .355, 1)
}

.hamburger--collapse.is-active .hamburger-inner:after {
    top: 0;
    opacity: 0;
    transition: top .2s cubic-bezier(.33333, 0, .66667, .33333), opacity .1s linear .22s
}

.hamburger--collapse.is-active .hamburger-inner:before {
    top: 0;
    transform: rotate(-90deg);
    transition: top .1s cubic-bezier(.33333, 0, .66667, .33333) .16s, transform .13s cubic-bezier(.215, .61, .355, 1) .25s
}

.hamburger:hover {
    opacity: 1
}

.btn--call-to-action {
    position: relative
}

.btn--call-to-action:after {
    content: "";
    position: absolute;
    display: block;
    right: -18px;
    top: -1px;
    bottom: 0;
    width: 26px;
    height: 102%;
    -webkit-clip-path: polygon(28% 0, 93% 43%, 97% 50%, 93% 58%, 28% 100%);
    clip-path: polygon(28% 0, 93% 43%, 97% 50%, 93% 58%, 28% 100%);
    transition: background .5s
}

.bg-green-oxfam.btn--call-to-action:after {
    background: #44841a
}

.bg-green-oxfam.btn--call-to-action:hover:after {
    background: #3f6b22
}

.bg-red-deep.btn--call-to-action:after {
    background: #ff1d34
}

.bg-red-deep.btn--call-to-action:hover:after {
    background: #a61322
}

.bg-orange.btn--call-to-action:after {
    background: #f16e22
}

.bg-orange.btn--call-to-action:hover:after {
    background: #9d4816
}

.bg-purple.btn--call-to-action:after {
    background: #53297d
}

.bg-purple.btn--call-to-action:hover, .bg-purple.btn--call-to-action:hover:after {
    background: #3a1c57
}

.bg-burgundy.btn--call-to-action:after {
    background: #630235
}

.bg-burgundy.btn--call-to-action:hover, .bg-burgundy.btn--call-to-action:hover:after {
    background: #450125
}

.bg-red.btn--call-to-action:after {
    background: #e70052
}

.bg-red.btn--call-to-action:hover, .bg-red.btn--call-to-action:hover:after {
    background: #cc1225
}

.btn--anchor-submit {
    font-size: .875rem;
    padding: .75rem 1rem;
    --text-opacity: 1;
    color: #fff;
    color: rgba(255, 255, 255, var(--text-opacity));
    position: relative;
    --bg-opacity: 1;
    background-color: #f16e22;
    background-color: rgba(241, 110, 34, var(--bg-opacity));
    border-style: solid;
    --border-opacity: 1;
    border-color: #9d4816;
    border-color: rgba(157, 72, 22, var(--border-opacity));
    font-weight: 700;
    display: inline-block
}

.btn--anchor-submit:after {
    content: "►";
    margin-left: .5rem
}

.caption.default {
    background: rgba(0, 0, 0, .8)
}

@media screen and (max-width: 1024px) {
    .caption.default {
        background: #d9d9ce;
        color: #545454
    }
}

.caption.timeline {
    background: rgba(0, 0, 0, .8)
}

.caption.timeline a {
    color: #fff
}

@media screen and (max-width: 1024px) {
    .caption.timeline {
        background: #336114;
        color: #fff
    }
}

.caption.video {
    background: #d9d9ce;
    color: #545454
}

.caption.hero {
    background: #336114
}

.caption.emergency-hero {
    background: #000
}

.caption .caption-text {
    max-width: 900px
}


.paragraph table {
    width: 100%;
    margin: 1.5em 0;
    font-size: .9em
}

.paragraph table th {
    background: #336114;
    padding: .75em;
    color: #fff;
    text-align: left;
    vertical-align: bottom;
    border: 1px solid #096b3a
}

.paragraph table td {
    padding: .75em;
    vertical-align: top;
    border: 1px solid #c4c4ba
}

.paragraph table tr:nth-child(odd) {
    background-color: #fff
}

.paragraph table tr:nth-child(2n) {
    background-color: #eaeade
}


.js-form-type-checkbox {
    margin-top: 1rem;
    width: 100%;
    overflow: hidden
}

.js-form-type-checkbox label {
    margin-top: 0;
    width: 83.333333%
}

label {
    display: block;
    margin-top: 1rem
}

select {
    --border-opacity: 1;
    border: 2px solid #d9d9ce;
    border-color: rgba(217, 217, 206, var(--border-opacity));
    font-size: 1rem;
    padding: .5rem;
    --bg-opacity: 1;
    background-color: #fff;
    background-color: rgba(255, 255, 255, var(--bg-opacity));
    max-width: 100%;
    width: 100%
}

@media screen and (min-width: 768px) {
    select {
        width: auto
    }
}

.form-submit {
    font-size: .875rem;
    padding: .75rem 2rem .5rem 1rem;
    --text-opacity: 1;
    color: #fff;
    color: rgba(255, 255, 255, var(--text-opacity));
    position: relative;
    --bg-opacity: 1;
    background-color: #f16e22;
    background-color: rgba(241, 110, 34, var(--bg-opacity));
    border-style: solid;
    margin-bottom: -2px;
    font-weight: 700;
    display: block
}

.form-submit:hover {
    cursor: pointer
}

textarea {
    --border-opacity: 1;
    border: 2px solid #d9d9ce;
    border-color: rgba(217, 217, 206, var(--border-opacity));
    font-size: 1rem;
    padding: .5rem;
    max-width: 100%
}

textarea::-moz-placeholder {
    color: #96968f
}

textarea:-ms-input-placeholder {
    color: #96968f
}

textarea::placeholder {
    color: #96968f
}

.form-email, .form-number, .form-text {
    --border-opacity: 1;
    border: 2px solid #d9d9ce;
    border-color: rgba(217, 217, 206, var(--border-opacity));
    font-size: 1rem;
    padding: .5rem;
    max-width: 100%;
    width: 100%
}

.form-email::-moz-placeholder, .form-number::-moz-placeholder, .form-text::-moz-placeholder {
    color: #96968f
}

.form-email:-ms-input-placeholder, .form-number:-ms-input-placeholder, .form-text:-ms-input-placeholder {
    color: #96968f
}

.form-email::placeholder, .form-number::placeholder, .form-text::placeholder {
    color: #96968f
}

@media screen and (min-width: 768px) {
    .form-email, .form-number, .form-text {
        width: auto
    }
}

.input-wrapper.checkbox.ltr {
    margin-right: 1rem;
    float: left
}

.input-wrapper.checkbox.rtl {
    margin-left: 1rem;
    float: right
}


.icon-home {
    fill: #545454
}

.breadcrumb-home:hover .icon-home, .icon-home:hover {
    fill: #44841a
}


.ajax-field-entity-ref {
    background-color: #333;
    display: block;
    width: 100%;
    font-weight: 700
}

.ajax-field-entity-ref a {
    color: #fff;
    display: block;
    width: 100%;
    padding: 10px
}

.ajax-field-entity-ref a:hover {
    text-decoration: underline
}


.primary-menu-link.is-active:after, .primary-menu-link:hover:after {
    border-left-color: #9d4816
}


.strapline:before {
    content: "";
    display: inline-block;
    width: 2px;
    height: 3rem;
    margin-bottom: -1.5rem;
    background-color: #eaeade
}

.strapline.rtl:before {
    margin-left: 1rem
}

.strapline.ltr:before {
    margin-right: 1rem
}


.unpublished-banner {
    color: #1e1e1e;
    border-color: #d6d6d6;
    background-color: #999;
    font-weight: 700
}

.oxfam-responsive-video {
    position: relative
}

.oxfam-responsive-video:after {
    content: "";
    display: block;
    padding-bottom: 56.25%
}

.oxfam-responsive-video iframe {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
    margin: 0
}

.content-section-link-block {
    transition: .8s
}

.content-section-link-block:hover .thumbnail {
    transition: 1s;
    filter: grayscale(15%)
}

.content-section-link-block .thumbnail, .content-section-link-block .thumbnail article, .content-section-link-block .thumbnail div, .content-section-link-block .thumbnail picture {
    display: flex
}

.content-section-link-block .thumbnail img {
    -o-object-fit: cover;
    object-fit: cover
}


@media screen and (max-width: 1024px) {
    .content-section-video {
        margin-left: calc(50% - 50vw);
        margin-right: calc(50% - 50vw)
    }
}

.content-section-video:before {
    position: absolute;
    background: #eaeade;
    width: 100vw;
    height: calc(100% - 3rem);
    top: 1.5rem;
    left: 0;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw)
}

@media screen and (min-width: 1024px) {
    .content-section-video:before {
        content: ""
    }
}

.content-section-video .content-section__inner {
    margin-left: -1rem;
    margin-right: -1rem
}

@media screen and (max-width: 1024px) {
    .content-section-video .content-section__inner {
        margin-left: 0;
        margin-right: 0
    }
}

.sliding-popup-left {
    display: block;
    margin: 0;
    padding: 35px;
    left: 0;
    right: auto;
    z-index: 99999;
    background: #fff;
    width: 90%;
    max-width: calc(100% - 75px);
    height: 100%;
    position: fixed
}

.sliding-popup-left .cookie-compliance__content {
    margin-right: 20px;
    margin-left: 20px
}

@media screen and (min-width: 1024px) {
    .sliding-popup-left {
        width: 500px
    }
}

.sliding-popup-left {
    text-align: left
}

.sliding-popup-left, .sliding-popup-left h1, .sliding-popup-left h2, .sliding-popup-left h3, .sliding-popup-left h4, .sliding-popup-left p {
    color: #303030;
    font-family: sans-serif;
    font-weight: 500;
    font-size: 30px
}

.sliding-popup-left p {
    line-height: 1.4;
    font-size: 16px;
    margin-bottom: 16px
}

.eu-cookie-compliance-categories {
    display: none
}

.cookie-compliance__buttons {
    clear: left;
    padding-top: 10px;
    max-width: 280px
}

.cookie-compliance__buttons button {
    float: left;
    margin-right: 20px;
    font-size: 16px;
    border-radius: 70px;
    margin-top: 10px;
    padding: 10px;
    width: 100%;
    max-width: none;
    font-weight: 700;
    color: #fff;
    background: #303030;
    border: 1px solid #303030
}

.cookie-compliance__buttons button:focus, .cookie-compliance__buttons button:hover {
    text-decoration: underline
}

@media screen and (min-width: 768px) {
    .cookie-compliance__buttons button {
        float: none;
        margin-right: 0
    }
}

.cookie-compliance__buttons button.essential-only-button {
    background: #fff;
    color: #303030;
    cursor: pointer
}

.cookie-compliance__buttons .cookie-compliance__button--more {
    background: transparent;
    text-align: left;
    padding: 0;
    margin-top: 20px;
    color: #303030;
    border: none;
    width: 100%;
    max-width: none;
    text-decoration: underline
}

.cookie-compliance__buttons .cookie-compliance__button--more:hover {
    background: transparent;
    color: #303030;
    text-decoration: none
}

@media screen and (min-width: 768px) {
    .cookie-compliance__buttons {
        align-items: end;
        align-self: end;
        justify-content: end;
        justify-self: end
    }
}

.eu-cookie-withdraw-tab {
    background: #fff;
    border-left-width: 0;
    border-radius: 0 10px 0 0;
    padding: 0 0 5px;
    top: auto;
    bottom: -2px;
    left: calc(100% + 35px);
    width: 70px;
    text-align: left
}

.eu-cookie-withdraw-tab span {
    padding: 5px;
    width: 100%;
    display: block;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.1
}

.eu-cookie-withdraw-tab:hover {
    border-color: #000;
    text-decoration: underline
}

.country-picker {
    background: url('/front/images/worldwide-pattern.svg?7309620c8c1d9e6fa298bf089e06d7be') no-repeat;
    background-size: cover
}

.doughnut-chart {
    width: 156px;
    height: 156px
}

.exposed-filter-search .form-item {
    font-weight: 700
}

.exposed-filter-search input.form-text {
    padding: .25rem;
    width: 100%
}

.exposed-filter-search .form-actions {
    margin-top: 2rem;
    display: flex;
    flex-direction: column
}

.exposed-filter-search .form-actions .input-wrapper {
    position: relative
}

.exposed-filter-search .form-actions .input-wrapper:last-of-type {
    align-self: flex-end
}

.exposed-filter-search .form-actions .input-wrapper:after {
    position: absolute;
    top: calc(50% - 4px);
    right: 1rem;
    content: "";
    width: 0;
    height: 0;
    border-color: transparent transparent transparent #fff;
    border-style: solid;
    border-width: 4px 0 4px 6.9px
}

.exposed-filter-search .button:last-of-type {
    padding-left: 1rem;
    padding-top: .5rem;
    padding-bottom: .5rem;
    --text-opacity: 1;
    color: #fff;
    color: rgba(255, 255, 255, var(--text-opacity));
    text-align: left;
    border-radius: .25rem;
    background: none;
    background-color: #44841a;
    padding-right: 1.8rem
}

.exposed-filter-search .button:last-of-type:hover {
    background-color: #3f6b22
}


.header-search input::-moz-placeholder {
    color: #44841a;
    opacity: 1
}

.header-search input:-ms-input-placeholder {
    color: #44841a;
    opacity: 1
}

.header-search input::placeholder {
    color: #44841a;
    opacity: 1
}

@media screen and (max-width: 1024px) {
    .hero-image {
        margin-left: calc(50% - 50vw);
        margin-right: calc(50% - 50vw)
    }
}

.hero-image:after {
    position: absolute;
    background: #eaeade;
    width: 100vw;
    height: calc(100% - 3rem);
    top: 1.5rem;
    left: 0;
    z-index: -1;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw)
}

@media screen and (min-width: 1024px) {
    .hero-image:after {
        content: ""
    }
}

.language-switcher li.is-active {
    position: relative
}

.language-switcher li.is-active:after {
    width: 0;
    height: 0;
    border-color: #44841a transparent transparent;
    border-style: solid;
    border-width: 6px 5px 0;
    content: " ";
    top: -1rem;
    left: calc(50% - 10px);
    position: absolute
}

.language-switcher li.is-active a {
    --text-opacity: 1;
    color: #545454;
    color: rgba(84, 84, 84, var(--text-opacity))
}

.local-tasks.tabs li a {
    display: block;
    padding: .5rem;
    border: 1px solid #eaeade;
    margin-right: .5rem;
    transition: color, border-color .25s ease-in
}

.local-tasks.tabs li a:hover {
    color: #336114;
    border-color: #336114
}

.local-tasks.tabs li a.is-active {
    color: #545454;
    border-color: #d9d9ce
}

.local-tasks.tabs li a.is-active:hover {
    border-color: #d9d9ce
}


.newsletter_form {
    --bg-opacity: 1;
    background-color: #ff1d34;
    background-color: rgba(255, 29, 52, var(--bg-opacity));
    background-repeat: no-repeat;
    background-position: 50%;
    background-size: cover
}

.newsletter_form a {
    --text-opacity: 1;
    color: #fff;
    color: rgba(255, 255, 255, var(--text-opacity))
}

.newsletter_form p {
    min-width: 40%
}

.newsletter_form .newsletter_dynamic_link {
    max-width: -webkit-fit-content;
    max-width: -moz-fit-content;
    max-width: fit-content
}

.newsletter_form .form-email {
    width: 100%;
    margin-bottom: 1rem
}

.newsletter_form .form-submit {
    height: 45px
}

.newsletter_form {
    background-image: url('../images/newsletter-pattern-bg.svg');
}

label.visually-hidden.js-form-required.form-required {
    color: #fff;
}

.w-full.lg\:flex.overflow-hidden {
    display: flex;
    align-items: center;
    justify-content: center;
}

@media screen and (min-width: 768px) {
    .newsletter_form .form-email {
        margin-bottom: 0
    }

    .newsletter_form .subscribe_form {
        max-width: -webkit-fit-content;
        max-width: -moz-fit-content;
        max-width: fit-content
    }

    .newsletter_form .subscribe-mini-form {
        display: flex
    }

    .newsletter_form .subscribe-mini-form .form-actions {
        align-self: flex-end;
        margin-left: 1rem
    }
}


.node-teaser-grid .thumbnail {
    overflow: hidden
}

.node-teaser-grid .thumbnail img {
    transform: scale(1.05);
    transition-duration: .75s;
    height: 250px;
    object-fit: cover;
}

.node-teaser-grid > a > main {
    flex-grow: 2
}

.node-teaser-grid.visible .thumbnail img {
    transform: scale(1);
    transition-duration: .75s
}

.node-teaser-grid h3 {
    font-size: 1.3rem
}

.node-teaser-grid:hover section {
    background: rgba(68, 132, 26, .15)
}

.node-teaser-grid:hover .thumbnail img {
    transform: scale(1);
    transition-duration: .75s
}

.node-teaser-grid:hover h3 {
    text-decoration: underline
}

.node-teaser-grid:last-of-type {
    margin-right: 0
}

.node-teaser-list header > article, .node-teaser-list header > article > div {
    flex-grow: 1;
    display: flex
}

.node-teaser-list header > article > div img, .node-teaser-list header > article > div picture {
    flex-grow: 1;
    -o-object-fit: cover;
    object-fit: cover;
    height: 100%
}

.primary-menu > ul > li {
    position: relative
}

.primary-menu > ul > li .symbol {
    position: absolute;
    top: 0;
    right: 0;
    font-size: 38px;
    font-weight: 400;
    color: #fff;
    pointer-events: none;
    line-height: .85em;
    padding: inherit
}

.primary-menu > ul > li .symbol:after {
    content: "+"
}

.primary-menu > ul > li.dropdown-is-active .symbol:after {
    content: "-"
}

.primary-menu > ul > li:last-child .symbol:after {
    content: ""
}

.primary-menu > ul > li.dropdown-is-active:not(:nth-last-child(-n+2)) > a {
    background-color: #0b9cda
}

@media screen and (min-width: 1024px) {
    .primary-menu > ul > li {
        position: static
    }

    .primary-menu > ul > li.dropdown-is-active .symbol:after, .primary-menu > ul > li .symbol:after {
        content: ""
    }

    .primary-menu > ul > li.item-is-open:not(:nth-last-child(-n+2)) > a {
        background-color: #0b9cda
    }
}

@media screen and (min-width: 1024px) {
    .no-js .primary-menu ul > li > div, .primary-menu ul > li > div {
        height: 0;
        overflow: hidden
    }
}

@media screen and (min-width: 1024px) {
    .no-js .primary-menu ul > li.item-is-open > div, .no-js .primary-menu ul > li:hover > div, .no-js .primary-menu ul > li > div:hover {
        height: auto;
        opacity: 1;
        border-bottom: 6px solid #44841a
    }

    .no-js .primary-menu ul > li.item-is-open > div, .no-js .primary-menu ul > li:focus-within > div, .no-js .primary-menu ul > li:hover > div, .no-js .primary-menu ul > li > div:hover {
        height: auto;
        opacity: 1;
        border-bottom: 6px solid #44841a
    }
}

.related-to .links li:last-of-type a {
    border-bottom: none
}

.related-to .links a {
    position: relative;
    font-weight: 700;
    --text-opacity: 1;
    color: #44841a;
    color: rgba(68, 132, 26, var(--text-opacity));
    padding: 1rem 1.5rem;
    display: block;
    border-bottom: 2px solid #d9d9ce
}

.related-to .links a:before {
    content: "";
    width: 10px;
    height: 10px;
    background: #44841a;
    position: absolute;
    left: 0;
    top: calc(50% - 5px);
    -webkit-clip-path: polygon(0 0, 0 100%, 100% 50%);
    clip-path: polygon(0 0, 0 100%, 100% 50%)
}

.related-to .links > div > div:last-of-type a {
    border-bottom: none
}

.separate-content-block > div h2, .separate-content-block > header h2 {
    top: calc(150px - 4rem)
}

.separate-content-block-top {
    padding-top: 170px
}

.separate-content-block-top:before {
    background: #eaeade;
    width: 100vw;
    height: 150px;
    content: " ";
    position: absolute;
    display: block;
    left: 0;
    top: 0;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw)
}

.separate-content-block-bottom {
    padding-bottom: 150px
}

.separate-content-block-bottom:after {
    background: #eaeade;
    width: 100vw;
    height: 150px;
    content: " ";
    position: absolute;
    display: block;
    left: 0;
    top: 0;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    top: auto;
    bottom: 0
}

.social-icons__facebook a {
    background: #3c5a9a
}

.social-icons__twitter a {
    background: #439cd6
}

.social-icons__youtube a {
    background: #ed2024;
    padding: 6px
}

.social-icons__instagram a {
    background: #b93b96
}

.social-icons-share .social-icons__facebook svg {
    width: 9px
}

.social-icons-share a svg {
    display: inline-block;
    height: 13px;
    width: 13px;
    margin-right: .5rem
}

.social-icons__email a {
    background: #757575
}

.social-icons__linkedin a {
    background: #0077b5
}

.stripe_footer {
    background: #eaeade;
    left: 50%;
    margin-left: -50vw;
    margin-right: -50vw;
    max-width: 100vw;
    right: 50%
}

.stripe_footer p {
    margin-bottom: 50px
}

.stripe_footer p:last-child {
    margin-bottom: 0
}

.stripe_footer .logo-secure-transaction:before, .stripe_footer .logo-stripe {
    text-indent: -99999px;
    background-repeat: no-repeat;
    background-position: 50%
}

.stripe_footer .logo-secure-transaction:before {
    content: " ";
    background-image: url(./padlock-secure.png?5dd1b9faebe7be074ba302669131ad60);
    height: 27px;
    width: 21px;
    display: inline-block
}

.stripe_footer .logo-secure-transaction.ltr:before {
    margin-right: 1rem
}

.stripe_footer .logo-secure-transaction.rtl:before {
    margin-left: 1rem
}

.stripe_footer .logo-stripe {
    background-image: url(./powered_by_stripe.png?35ecdbec656f285a70156249df9f9a93);
    height: 41px;
    width: 149px;
    min-width: 149px
}

@media screen and (min-width: 1024px) {
    .stripe_footer .stripe-text {
        line-height: 2.5rem
    }
}

.sub-navigation li a:hover {
    color: #f16e22
}

.tags a {
    padding: .5rem .75rem;
    background-color: #eaeade;
    background-color: rgba(234, 234, 222, var(--bg-opacity));
    --text-opacity: 1;
    color: #44841a;
    color: rgba(68, 132, 26, var(--text-opacity));
    margin-right: .5rem;
    margin-bottom: .5rem
}

.tags a, .tags a:hover {
    --bg-opacity: 1;
    transition: .25s
}

.tags a:hover {
    background-color: #d9d9ce;
    background-color: rgba(217, 217, 206, var(--bg-opacity))
}

.timeline-date .sticky-header {
    position: sticky;
    background: #fff;
    top: 0;
    padding-top: .75rem;
    z-index: 10;
    margin-left: -2em;
    margin-right: -2em;
    padding-left: 2em;
    padding-right: 2em
}

@media screen and (min-width: 1024px) {
    .timeline-date .sticky-header {
        margin-left: auto;
        margin-right: auto;
        padding-right: 1.25rem;
        z-index: 0;
        top: .75em;
        padding-top: 0
    }
}

.timeline-item {
    padding-bottom: 1.5rem
}

.timeline-item:last-child {
    padding-bottom: 0
}

.timeline-item:before {
    content: "";
    display: block;
    width: 20px;
    height: 20px;
    background-color: #fff;
    border: 4px solid #bece45;
    border-radius: 50%;
    float: left;
    position: relative;
    left: -12px;
    top: 14px
}

.timeline-item .timeline-item-box--with-arrow:before {
    content: "";
    position: absolute;
    width: 15px;
    height: 15px;
    display: block;
    background-color: #eaeade;
    transform: rotate(-45deg) skew(10deg, 10deg);
    margin-left: -8px;
    margin-top: 16px;
    z-index: -1
}

.timeline-item .timeline-item-box--with-padding {
    padding: .75rem 1.5rem
}

.timeline-item .timeline-item-box--with-padding:before {
    margin-left: -30px;
    margin-top: 4px
}

.timeline-item .timeline-item-title:before {
    content: "";
    position: absolute;
    width: 15px;
    height: 15px;
    display: block;
    background-color: #53297d;
    transform: rotate(-45deg) skew(10deg, 10deg);
    margin-left: -30px;
    margin-top: 4px
}


.ct-leaderboard {
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    margin-bottom: -3rem
}

.ct-leaderboard img {
    width: 100%;
    max-height: 400px;
    -o-object-fit: cover;
    object-fit: cover
}

.ct-leaderboard .content {
    max-width: 650px
}

@media screen and (min-width: 1024px) {
    .ct-leaderboard .content {
        background: rgba(0, 0, 0, .6);
        margin-bottom: 1rem
    }

    .ct-leaderboard .content > * {
        margin: 0 1rem
    }
}

@media screen and (min-width: 1024px) {
    .ct-leaderboard .bg-pattern-a1a .content {
        background-image: url(./A1a.svg?f9130693b42dad83020bffbfc6c4e906)
    }

    .ct-leaderboard .bg-pattern-a2b .content {
        background-image: url(./A2b.svg?e17433f531b635770b73bc7e1d2f9549)
    }

    .ct-leaderboard .bg-pattern-b2a .content {
        background-image: url(./B2a.svg?84e7c70174f1d5f0d04f32ad49ddf1a7)
    }

    .ct-leaderboard .bg-pattern-c2b .content {
        background-image: url(./C2b.svg?303f05714dea0072c4c6cb89eca48657)
    }
}

.ct-leaderboard .btn--call-to-action {
    position: relative;
    font-weight: 700;
    font-family: TStar, sans-serif;
    font-size: 1.125rem
}

@media screen and (max-width: 1024px) {
    .ct-leaderboard .btn--call-to-action {
        --bg-opacity: 1;
        background-color: #fff;
        background-color: rgba(255, 255, 255, var(--bg-opacity));
        --text-opacity: 1;
        color: #336114;
        color: rgba(51, 97, 20, var(--text-opacity))
    }

    .ct-leaderboard .btn--call-to-action:hover {
        background: #f9f9f9
    }
}

@media screen and (max-width: 1024px) {
    .ct-leaderboard .btn--call-to-action:after {
        --bg-opacity: 1;
        background-color: #fff;
        background-color: rgba(255, 255, 255, var(--bg-opacity))
    }
}

@media screen and (max-width: 1024px) {
    .ct-leaderboard .btn--call-to-action:hover:after {
        background: #f9f9f9
    }
}


.facets-widget-links li label.is-active:not([for=channel-reset-all]) span {
    font-style: italic
}

.facets-widget-links label.is-active:not([for=channel-reset-all]):before {
    content: "- ";
    margin-right: 2px
}

.footer {
    background-repeat: repeat-x;
    background-position: 0 100%;
    background-size: auto 14px;
    padding-bottom: 14px;
    clear: both
}

.oxfam-donations {
    margin-top: 1.5rem;
    position: relative;
    max-width: 900px;
    margin-left: auto;
    margin-right: auto;
    padding-bottom: 1.5rem
}

.oxfam-donations .intro-strip:before {
    background: #eaeade;
    width: 100vw;
    height: 100px;
    content: " ";
    position: absolute;
    display: block;
    left: 0;
    top: 0;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw)
}

.oxfam-donations .intro-strip {
    position: relative;
    margin-top: 40px;
    padding-top: 120px;
    margin-right: -20px;
    margin-left: -20px
}

@media screen and (min-width: 768px) {
    .oxfam-donations .intro-strip {
        margin-left: 0;
        margin-right: 0
    }
}

.oxfam-donations h2 {
    --bg-opacity: 1;
    background-color: #e70052;
    background-color: rgba(231, 0, 82, var(--bg-opacity));
    --text-opacity: 1;
    color: #fff;
    color: rgba(255, 255, 255, var(--text-opacity));
    display: inline-block;
    margin-top: 0;
    margin-bottom: 0;
    padding: 1rem 1rem .75rem;
    position: absolute;
    width: 100%;
    top: calc(105px - 4rem)
}

@media screen and (min-width: 768px) {
    .oxfam-donations h2 {
        width: auto
    }
}

@media screen and (min-width: 1024px) {
    .oxfam-donations h2 {
        top: calc(100px - 4rem)
    }
}

.oxfam-donations .donate-wrapper {
    overflow: hidden
}

.oxfam-donations .form-item-currency {
    margin-bottom: 2rem
}

.oxfam-donations .amount-wrapper {
    margin-top: .5rem
}

@media screen and (min-width: 768px) {
    .oxfam-donations .amount-wrapper {
        display: flex
    }
}

.oxfam-donations .donate_button_values {
    width: 100%;
    float: left;
    text-align: center
}

.oxfam-donations .donate_button_values li {
    margin-right: 1rem;
    flex: 1 1 auto;
    display: flex;
    width: 100%;
    margin-bottom: 1rem;
    font-size: 1.75rem
}

.oxfam-donations .donate_button_values li a {
    color: #fff;
    background-color: #474848;
    border-bottom: 4px solid #2c2b2c;
    padding: 15px;
    width: 100%
}

.oxfam-donations .donate_button_values li a:hover {
    background-color: #44841a;
    border-bottom: 4px solid #3f6b22
}

@media screen and (min-width: 768px) {
    .oxfam-donations .donate_button_values {
        width: 75%
    }

    .oxfam-donations .donate_button_values ul {
        display: flex
    }

    .oxfam-donations .donate_button_values li {
        width: 25%;
        margin-bottom: 0
    }
}

.oxfam-donations .form-item-amount {
    width: 100%;
    float: left;
    font-weight: 700;
    display: flex;
    margin: 0;
    padding-top: 1rem;
    padding-bottom: .5rem
}

.oxfam-donations .form-item-amount label {
    margin-top: 0;
    justify-content: center;
    display: flex;
    align-items: center
}

.oxfam-donations .form-item-amount input {
    width: 100%;
    height: 45px;
    text-align: center
}

.oxfam-donations .form-item-amount > * {
    width: 50%
}

@media screen and (min-width: 768px) {
    .oxfam-donations .form-item-amount {
        width: 25%;
        background-color: #474848;
        border-bottom: 4px solid #2c2b2c;
        padding-left: 1rem;
        padding-right: 1rem
    }

    .oxfam-donations .form-item-amount label {
        --text-opacity: 1;
        color: #fff;
        color: rgba(255, 255, 255, var(--text-opacity))
    }

    .oxfam-donations .form-item-amount input {
        border-width: 0
    }
}

.oxfam-donations .donation-info {
    padding: 1.5rem;
    margin-top: 1.5rem;
    margin-bottom: 1.5rem;
    background-color: #eaeade
}

.oxfam-donations .your-details-wrapper h3 {
    color: #ff1d34;
    clear: both;
    margin-top: 3rem
}

.oxfam-donations .form-submit {
    background-color: #44841a;
    border-width: 0;
    border-bottom: 4px solid #3f6b22;
    background-image: none;
    font-size: 1.25rem;
    padding: .75rem 4rem;
    margin-top: 2rem
}

.oxfam-donations.rtl .donate_button_values li {
    margin-left: 1rem;
    margin-right: 0
}

.link-to-affiliate-block {
    display: none;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw)
}

.link-to-affiliate-block_inner {
    background: url(./affiliate-geolocate-bg.svg?f9130693b42dad83020bffbfc6c4e906) no-repeat;
    background-size: cover;
    --text-opacity: 1;
    color: #fff;
    color: rgba(255, 255, 255, var(--text-opacity));
    padding-top: 1rem;
    padding-bottom: 1rem
}

@media screen and (min-width: 1024px) {
    .link-to-affiliate-block_inner {
        text-align: center
    }
}

.link-to-affiliate-block_inner h2 {
    --text-opacity: 1;
    color: #fff;
    color: rgba(255, 255, 255, var(--text-opacity))
}

.link-to-affiliate-block_inner .btn--call-to-action {
    --text-opacity: 1;
    color: #f16e22;
    color: rgba(241, 110, 34, var(--text-opacity));
    font-weight: 700;
    font-family: TStar, sans-serif;
    font-size: 1.125rem
}

.link-to-affiliate-block_inner .btn--call-to-action, .link-to-affiliate-block_inner .btn--call-to-action:after, .link-to-affiliate-block_inner .btn--call-to-action:hover:after {
    --bg-opacity: 1;
    background-color: #fff;
    background-color: rgba(255, 255, 255, var(--bg-opacity))
}

.link-to-affiliate-block.geovariation {
    display: block
}

.masthead {
    background: url('/front/images/strip-green-bg.svg?961f09db65fd6744a0ff5e6c5f4daf34') no-repeat;
    background-repeat: repeat-x;
    background-position: 0 0;
    padding-top: 11px
}

.masthead .inner-wrapper {
    background-color: #fff
}

.masthead .full-menu {
    left: calc(-50vw + 50%)
}

.ui-dialog-titlebar {
    display: none
}

.ui-dialog.modal-dialog-large {
    max-width: none;
    padding: 0;
    border: 0
}

.modal-dialog.modal-dialog-bg {
    background-color: #18a74f;
    background-image: url(./bg-modal-default.svg?9bd396b8fd195b716abd47ac6b1f26eb);
    background-size: cover
}

.ui-dialog-content.modal-dialog-large {
    padding: 0;
    background: none
}

.ui-widget-overlay {
    opacity: .75;
    --bg-opacity: 1;
    background-color: #000;
    background-color: rgba(0, 0, 0, var(--bg-opacity))
}

.modal-dialog__oi-logo {
    width: 126px;
    height: 48px;
    text-indent: -999em;
    background: url(./ox_logo.png?7f4bb34037660d35d0111be9beed3f16)
}

.modal-seasonal .reveal svg.ox-horiz {
    height: 60px;
    width: 100%;
    margin-top: 20px;
    fill: #fff
}

.modal-seasonal .row {
    max-width: 1220px;
    margin-right: auto;
    margin-left: auto;
    display: flex;
    flex-flow: row
}

.modal-seasonal .column {
    flex: 1 1 0px;
    padding-right: .390625rem;
    padding-left: .390625rem;
    min-width: 0
}

@media print, screen and (min-width: 40em) {
    .modal-seasonal .column {
        padding-right: .585938rem;
        padding-left: .585938rem
    }
}

.modal-seasonal .small-4 {
    flex: 0 0 33.3333333333%;
    max-width: 33.3333333333%
}

.modal-seasonal .small-7 {
    flex: 0 0 58.3333333333%;
    max-width: 58.3333333333%
}

.modal-seasonal input[type=number] {
    display: block;
    box-sizing: border-box;
    width: 100%;
    height: 1.52344rem;
    border-radius: 0;
    background-color: #fefefe;
    box-shadow: inset 0 1px 2px rgba(10, 10, 10, .1);
    font-family: inherit;
    font-size: .625rem;
    font-weight: 400;
    line-height: 1.5;
    color: #0a0a0a;
    transition: box-shadow .5s, border-color .25s ease-in-out;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    display: -moz-inline-stack;
    display: inline-block;
    *vertical-align: auto;
    zoom: 1;
    *display: inline;
    height: 50px;
    padding: 4px 20px 4px 6px;
    margin: 0 0 10px;
    font-size: 18px;
    line-height: 30px;
    color: #333;
    vertical-align: middle;
    background-color: #fff;
    border: 2px solid #ccc;
    border-radius: 4px;
    transition: border .2s linear;
    transition: all .1s ease-in-out
}

.modal-seasonal input[type=number]:hover {
    border: 3px solid #44841a !important;
    background-color: #fff;
    color: #545454;
    transition: all .1s ease-in-out
}

.modal-seasonal .button__arrow {
    min-width: 100px;
    max-width: 250px;
    display: inline-block;
    border-radius: 4px;
    border-color: transparent;
    background: #fff;
    color: #44841a;
    height: 50px;
    min-width: 200px;
    font-family: TStar, RobotoCondensed-Bold-webfont, Arial, sans-serif;
    font-weight: 400;
    font-size: 1.25rem;
    line-height: 3.125rem;
    justify-content: left;
    text-align: center;
    padding-right: 1.75rem;
    transition: unset;
    -webkit-clip-path: polygon(0 0, 80% 0, 81% .8%, 93% 46%, 93.2% 47%, 93.2% 53%, 93% 54%, 81% 99.2%, 80% 100%, 0 100%);
    clip-path: polygon(0 0, 80% 0, 81% .8%, 93% 46%, 93.2% 47%, 93.2% 53%, 93% 54%, 81% 99.2%, 80% 100%, 0 100%)
}

.modal-seasonal img {
    max-width: 100%
}

.modal-seasonal .reveal, .modal-seasonal .reveal.large, .modal-seasonal .reveal.small {
    right: auto;
    left: auto;
    margin: 0 auto
}

.modal-seasonal .reveal-overlay {
    font: 62.5%/1.6 Arial, sans-serif;
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1005;
    display: none;
    background-color: rgba(10, 10, 10, .45);
    overflow-y: auto
}

.modal-seasonal .reveal {
    z-index: 1006;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    display: none;
    padding: .625rem;
    border: 1px solid #cacaca;
    border-radius: 0;
    background-color: #fefefe;
    position: relative;
    top: 100px;
    margin-right: auto;
    margin-left: auto;
    overflow-y: auto
}

@media print, screen and (min-width: 40em) {
    .modal-seasonal .reveal {
        min-height: 0
    }
}

.modal-seasonal .reveal .column {
    min-width: 0
}

.modal-seasonal .reveal > :last-child {
    margin-bottom: 0
}

@media print, screen and (min-width: 40em) {
    .modal-seasonal .reveal {
        width: 600px;
        max-width: 1220px
    }
}

.modal-seasonal .reveal.collapse {
    padding: 0
}

@media print, screen and (min-width: 40em) {
    .modal-seasonal .reveal.small {
        width: 50%;
        max-width: 1220px
    }
}

@media print, screen and (min-width: 40em) {
    .modal-seasonal .reveal.large {
        width: 90%;
        max-width: 1220px
    }
}

.modal-seasonal .reveal.full {
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    max-width: none;
    height: 100%;
    min-height: 100%;
    margin-left: 0;
    border: 0;
    border-radius: 0
}

.modal-seasonal .reveal svg .fill-white {
    fill: #fff
}

.modal-seasonal .reveal input[type=email] {
    font-size: 1.5rem
}

.modal-seasonal .lightbox {
    color: #fff
}

.modal-seasonal .lightbox--green {
    background-color: #44841a
}

.modal-seasonal .lightbox--green button.oxfam-button__arrow {
    background-color: #e70052;
    color: #fff
}

.modal-seasonal .lightbox.reveal {
    border: 0;
    padding: 0;
    width: 100vw;
    height: 100vh;
    max-width: 840px;
    max-height: 400px;
    overflow: hidden
}

.modal-seasonal .lightbox .oxfam-button__close {
    background-image: url(https://s3.amazonaws.com/oxfam-us/static/lightbox/img/close.svg);
    background-repeat: no-repeat;
    width: 29px;
    height: 29px;
    position: absolute;
    top: 4px;
    right: 4px;
    background-color: transparent;
    border: 0
}

.modal-seasonal .lightbox-donation-form {
    width: 100%;
    max-width: 840px;
    max-height: 400px
}

.modal-seasonal .lightbox-donation-form__wrapper {
    display: flex
}

.modal-seasonal .lightbox-donation-form__content {
    display: flex;
    flex-direction: column;
    align-self: flex-end;
    width: 360px
}

.modal-seasonal .lightbox-donation-form__content h2 {
    font-family: TStar;
    text-transform: uppercase;
    font-size: 2.625rem;
    line-height: 1em;
    text-align: left;
    margin-bottom: 0;
    margin-top: 0;
    padding-left: 10px;
    padding-right: 10px;
    color: #fff
}

.modal-seasonal .lightbox-donation-form__content p {
    font-family: TStar;
    font-size: 2.125rem;
    line-height: 1em;
    text-align: left;
    max-width: 100%;
    margin-bottom: .5em;
    padding-left: 10px;
    padding-right: 10px;
    margin-top: 0
}

.modal-seasonal .lightbox-donation-form__content label {
    text-align: left;
    width: 100%;
    font-size: 1rem;
    color: #fff;
    font-family: TStar
}

.modal-seasonal .lightbox-donation-form__content .column {
    display: flex
}

.modal-seasonal .lightbox-donation-form__content .column span.amount-dollarsign {
    text-align: left;
    font-family: TStar;
    margin-bottom: 0;
    padding-bottom: 0;
    position: absolute;
    padding-top: 4px;
    padding-left: 2px;
    line-height: 2.625rem;
    font-size: 1.5rem;
    font-weight: 700;
    color: #878782
}

.modal-seasonal .lightbox-donation-form__content .column input {
    padding-left: 20px;
    border-radius: 4px;
    border-color: #cacaca;
    background-color: #fff
}

.modal-seasonal .lightbox-donation-form__content .column input:focus {
    border-color: #44841a
}

.modal-seasonal .lightbox-donation-form__content form {
    margin-bottom: 10px
}

.modal-seasonal .lightbox-donation-form__content button.oxfam-button__arrow {
    width: 100%;
    text-align: center;
    padding-left: 0;
    line-height: 2.8125rem;
    font-size: 1.375rem;
    padding-right: 40px
}

.modal-seasonal .lightbox-donation-form__content button.lightbox-donation-form__button--link {
    font-size: .875rem;
    width: auto;
    text-align: left;
    color: #fff;
    background-color: transparent;
    border: 0
}

.modal-seasonal .lightbox-donation-form__content svg.logo {
    margin-top: 0
}

.modal-seasonal .lightbox-donation-form__image {
    width: 480px;
    display: flex
}

.modal-seasonal .lightbox-donation-form__image__credit {
    display: block;
    position: absolute;
    bottom: 0;
    padding-left: 10px;
    font-size: .625rem;
    color: #ccc
}

@media screen and (max-width: 840px) {
    .modal-seasonal .lightbox.reveal {
        max-width: 400px
    }

    .modal-seasonal .lightbox-donation-form__image {
        display: none;
        width: 0
    }
}

.paragraph--type--call-to-action.paragraph--style--palebox {
    margin-top: 0
}

.paragraph--type--call-to-action.content-section-call-to-action--full.sticky-cta {
    padding: 8px;
    text-align: center;
    max-width: none;
    background-color: hsla(0, 0%, 100%, .8);
    width: 100%;
    display: block;
    position: fixed;
    bottom: 0;
    left: 0;
    z-index: 10;
    margin: 0
}

.paragraph--type--call-to-action.content-section-call-to-action--full.sticky-cta a {
    display: inline-block
}

.related-content-block .related-content-block-title {
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    padding-top: 4rem;
    z-index: 1
}

.related-content-block .related-content-block-title:before {
    background-color: #eaeade;
    content: "";
    width: 100vw;
    position: absolute;
    left: 0;
    top: 0;
    height: 4rem
}

.related-content-block .related-content-block-title:after {
    background-color: #f16e22;
    width: 100vw;
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    height: 50%
}

@media screen and (min-width: 1024px) {
    .related-content-block .related-content-block-title:after {
        background: #eaeade
    }
}

.related-content-block .related-content-block-title h2 {
    z-index: 1
}

.related-items-block .related-items-block-title {
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    padding-top: 4rem;
    z-index: 1
}

.related-items-block .related-items-block-title:before {
    background-color: #eaeade;
    content: "";
    width: 100vw;
    position: absolute;
    left: 0;
    top: 0;
    height: 4rem
}

.related-items-block .related-items-block-title:after {
    background-color: #f16e22;
    width: 100vw;
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    height: 50%
}

@media screen and (min-width: 1024px) {
    .related-items-block .related-items-block-title:after {
        background: #eaeade
    }
}

.related-items-block .related-items-block-title h2 {
    z-index: 1
}

.frontpage-content-block-title {
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    padding-top: 3rem
}

.frontpage-content-block-title:after {
    --bg-opacity: 1;
    background-color: #f16e22;
    background-color: rgba(241, 110, 34, var(--bg-opacity));
    width: 100vw;
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    content: "";
    z-index: -1
}

@media screen and (min-width: 1024px) {
    .frontpage-content-block-title:after {
        --bg-opacity: 1;
        background-color: #eaeade;
        background-color: rgba(234, 234, 222, var(--bg-opacity));
        top: 3rem;
        height: calc(100% - 3rem)
    }
}

.frontpage-content-block-title:before {
    --bg-opacity: 1;
    background-color: #eaeade;
    background-color: rgba(234, 234, 222, var(--bg-opacity));
    content: "";
    width: 100vw;
    position: absolute;
    left: 0;
    top: 0;
    height: 3rem
}

@media screen and (min-width: 1024px) {
    .frontpage-content-block-title:before {
        content: ""
    }
}

.frontpage-brand-intro {
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    --bg-opacity: 1;
    background-color: #eaeade;
    background-color: rgba(234, 234, 222, var(--bg-opacity))
}


/*# sourceMappingURL=app.css.map*/