.matariki-focus {
    color: #FFF
}

.matariki-focus:hover {
    color: #FFF;
    text-decoration-line: underline
}

.matariki-focus:focus,
.matariki-focus:active {
    color: #FFF;
    text-decoration-line: underline;
    outline-color: #ED615A
}

.matariki-focus:focus img,
.matariki-focus:active img {
    opacity: 0.5
}

.matariki-panel_grid {
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: minmax(0, 1fr);
    grid-template-columns: repeat(1, minmax(0, 1fr));
    gap: 38px
}

@media (min-width: 768px) {
    .matariki-panel_grid {
        -ms-grid-columns: minmax(0, 1fr)[2];
        grid-template-columns: repeat(2, minmax(0, 1fr))
    }
}

@media (min-width: 1312px) {
    .matariki-panel_grid {
        -ms-grid-columns: minmax(0, 1fr) [4];
        grid-template-columns: repeat(4, minmax(0, 1fr))
    }
}

_:-ms-fullscreen .matariki-panel_col {
    padding-top: 1.25rem;
    padding-bottom: 1.25rem
}

@media (min-width: 1312px) {

    _:-ms-fullscreen .matariki-panel_col {
        padding-top: 0px;
        padding-bottom: 0px;
        padding-left: 1.25rem;
        padding-right: 1.25rem
    }
}

_:-ms-fullscreen .matariki-panel_grid {
    display: block
}

@media (min-width: 1312px) {

    _:-ms-fullscreen .matariki-panel_grid {
        display: -ms-grid;
        display: grid
    }
}

.container {
    width: 100%
}

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

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

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

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

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

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

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

.block {
    display: block
}

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

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


@media (min-width: 640px) {
    .xs\:hidden {
        display: none
    }

    .xs\:grid-cols-2 {
        -ms-grid-columns: minmax(0, 1fr) [2];
        grid-template-columns: repeat(2, minmax(0, 1fr))
    }
}

@media (min-width: 768px) {
    .sm\:order-2 {
        order: 2
    }

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

    .sm\:col-span-5 {
        -ms-grid-column-span: 5;
        grid-column: span 5 / span 5
    }

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

    .sm\:col-span-2 {
        -ms-grid-column-span: 2;
        grid-column: span 2 / span 2
    }

    .sm\:my-0 {
        margin-top: 0px;
        margin-bottom: 0px
    }

    .sm\:ml-0 {
        margin-left: 0px
    }

    .sm\:mr-0 {
        margin-right: 0px
    }

    .sm\:mt-0 {
        margin-top: 0px
    }

    .sm\:block {
        display: block
    }

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

    .sm\:flex {
        display: flex
    }

    .sm\:hidden {
        display: none
    }

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

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

    .sm\:max-w-\[120px\] {
        max-width: 120px
    }

    .sm\:grid-cols-8 {
        -ms-grid-columns: minmax(0, 1fr) [8];
        grid-template-columns: repeat(8, minmax(0, 1fr))
    }

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

    .sm\:grid-cols-2 {
        -ms-grid-columns: minmax(0, 1fr) [2];
        grid-template-columns: repeat(2, minmax(0, 1fr))
    }

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

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

    .sm\:gap-3 {
        gap: 0.75rem
    }

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

    .sm\:text-base {
        font-size: 1rem;
        line-height: 1.5rem
    }

    .sm\:text-\[5vw\] {
        font-size: 5vw
    }
}

@media (min-width: 1000px) {
    .md\:absolute {
        position: absolute
    }

    .md\:top-\[-10vw\] {
        top: -10vw
    }

    .md\:left-0 {
        left: 0px
    }

    .md\:right-0 {
        right: 0px
    }

    .md\:col-span-8 {
        -ms-grid-column-span: 8;
        grid-column: span 8 / span 8
    }

    .md\:col-span-4 {
        -ms-grid-column-span: 4;
        grid-column: span 4 / span 4
    }

    .md\:col-span-1 {
        -ms-grid-column-span: 1;
        grid-column: span 1 / span 1
    }

    .md\:col-span-3 {
        -ms-grid-column-span: 3;
        grid-column: span 3 / span 3
    }

    .md\:mr-\[38px\] {
        margin-right: 38px
    }

    .md\:ml-0 {
        margin-left: 0px
    }

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

    .md\:mr-3 {
        margin-right: 0.75rem
    }

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

    .md\:block {
        display: block
    }

    .md\:hidden {
        display: none
    }

    .md\:h-full {
        height: 100%
    }

    .md\:w-\[100vw\] {
        width: 100vw
    }

    .md\:w-\[40\%\] {
        width: 40%
    }

    .md\:w-\[35\%\] {
        width: 35%
    }

    .md\:max-w-\[140px\] {
        max-width: 140px
    }

    .md\:grid-cols-12 {
        -ms-grid-columns: minmax(0, 1fr) [12];
        grid-template-columns: repeat(12, minmax(0, 1fr))
    }

    .md\:grid-cols-6 {
        -ms-grid-columns: minmax(0, 1fr) [6];
        grid-template-columns: repeat(6, minmax(0, 1fr))
    }

    .md\:grid-cols-4 {
        -ms-grid-columns: minmax(0, 1fr) [4];
        grid-template-columns: repeat(4, minmax(0, 1fr))
    }

    .md\:grid-cols-1 {
        -ms-grid-columns: minmax(0, 1fr) [1];
        grid-template-columns: repeat(1, minmax(0, 1fr))
    }

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

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

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

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

    .md\:justify-center {
        justify-content: center
    }

    .md\:gap-3 {
        gap: 0.75rem
    }

    .md\:gap-x-\[38px\] {
        column-gap: 38px
    }

    .md\:self-center {
        -ms-grid-row-align: center;
        align-self: center
    }

    .md\:object-cover {
        object-fit: cover
    }

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

    .md\:pl-\[38px\] {
        padding-left: 38px
    }

    .md\:text-\[3vw\] {
        font-size: 3vw
    }
}

@media (min-width: 1312px) {
    .lg\:mr-4 {
        margin-right: 1rem
    }

    .lg\:block {
        display: block
    }

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

    .lg\:inline {
        display: inline
    }

    .lg\:hidden {
        display: none
    }
}

@media (min-width: 1400px) {
    .xl\:-mx-\[6vw\] {
        margin-left: -6vw;
        margin-right: -6vw
    }

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

    .xl\:block {
        display: block
    }

    .xl\:w-\[30\%\] {
        width: 30%
    }

    .xl\:w-\[40\%\] {
        width: 40%
    }

    .xl\:px-\[6vw\] {
        padding-left: 6vw;
        padding-right: 6vw
    }
}

@media (min-width: 1600px) {
    .xxl\:-mx-\[10vw\] {
        margin-left: -10vw;
        margin-right: -10vw
    }

    .xxl\:px-\[10vw\] {
        padding-left: 10vw;
        padding-right: 10vw
    }
}