@font-face {
    font-family: "Ghekko Helvetica Neue Light";
    src: url("../fonts/Helvetica-Font-Family2/helvetica-light-587ebe5a59211.ttf") format("truetype");
    font-style: normal;
    font-weight: 300;
    font-display: swap;
}

@font-face {
    font-family: "Ghekko Century Gothic";
    src: url("../fonts/Century-Gothic-Font-Family/CenturyGothic.ttf") format("truetype");
    font-style: normal;
    font-weight: 400;
    font-display: swap;
}

@font-face {
    font-family: "Ghekko Century Gothic";
    src: url("../fonts/Century-Gothic-Font-Family/GOTHICB.TTF") format("truetype");
    font-style: normal;
    font-weight: 700;
    font-display: swap;
}

@font-face {
    font-family: "Ghekko Century Gothic";
    src: url("../fonts/Century-Gothic-Font-Family/GOTHICI.TTF") format("truetype");
    font-style: italic;
    font-weight: 400;
    font-display: swap;
}

@font-face {
    font-family: "Ghekko Century Gothic";
    src: url("../fonts/Century-Gothic-Font-Family/GOTHICBI.TTF") format("truetype");
    font-style: italic;
    font-weight: 700;
    font-display: swap;
}

:root {
    --gk-font-body: "Ghekko Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, sans-serif;
    --gk-font-accent: "Ghekko Century Gothic", "Century Gothic", Arial, sans-serif;
    --gk-accent-gold: #ffcc00;
}

html,
body {
    font-family: var(--gk-font-body);
    font-weight: 300;
}

body,
p,
li,
dt,
dd,
.uk-panel,
.uk-text-lead,
.uk-text-meta,
.uk-text-small,
.el-content {
    font-family: var(--gk-font-body);
    font-weight: 300;
}

#tm-main p,
#tm-main li,
#tm-main dt,
#tm-main dd,
#tm-main .uk-text-lead,
#tm-main .uk-text-meta,
#tm-main .uk-text-small,
#tm-main .el-content,
#tm-main .el-content span {
    letter-spacing: 0.035em !important;
}

#tm-main .el-title + .el-content:not(.uk-button) {
    margin-top: 10px !important;
}

.home-brooch-gallery {
    --home-brooch-gallery-gap: clamp(32px, 5vw, 80px);
    --home-brooch-gallery-size: 255px;
    display: grid !important;
    gap: var(--home-brooch-gallery-gap) !important;
    grid-template-columns: minmax(0, 1fr);
    justify-content: center;
    margin-left: auto !important;
    margin-right: auto !important;
    width: min(100%, var(--home-brooch-gallery-size));
}

.home-brooch-gallery > * {
    margin-top: 0 !important;
    min-width: 0;
    padding-left: 0 !important;
    width: 100% !important;
}

.home-brooch-gallery .el-item,
.home-brooch-gallery img {
    height: auto;
    width: 100%;
}

@media (min-width: 640px) {
    .home-brooch-gallery {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        width: min(100%, calc((var(--home-brooch-gallery-size) * 2) + var(--home-brooch-gallery-gap)));
    }
}

@media (min-width: 960px) {
    .home-brooch-gallery {
        margin-left: auto !important;
        margin-right: 0 !important;
    }
}

@media (max-width: 959px) {
    #tm-main,
    #tm-main .uk-text-center,
    #tm-main .uk-text-left,
    #tm-main .uk-text-right {
        text-align: left !important;
    }

    #tm-main img,
    #tm-main picture {
        display: block;
        margin-left: auto !important;
        margin-right: auto !important;
    }

    #tm-main .uk-inline-clip {
        display: block;
        width: fit-content;
        margin-left: auto !important;
        margin-right: auto !important;
    }

    #tm-main .home-brooch-gallery .uk-inline-clip {
        width: 100%;
    }

    #tm-main .uk-button:not(.uk-button-text) {
        display: table;
        margin-left: auto !important;
        margin-right: auto !important;
        text-align: center !important;
    }

    #tm-main .uk-button.uk-button-text {
        display: inline-block;
        margin-left: 0 !important;
        margin-right: 0 !important;
        text-align: left !important;
    }
}

input,
textarea,
select,
button {
    font-family: var(--gk-font-body);
    font-weight: 300;
}

.h1,
.h2,
.h3,
.h4,
.h5,
.h6,
.uk-h1,
.uk-h2,
.uk-h3,
.uk-h4,
.uk-h5,
.uk-h6,
.uk-heading-small,
.uk-heading-medium,
.uk-heading-large,
.uk-heading-xlarge,
.uk-heading-2xlarge,
.uk-navbar-nav > li > a,
.uk-logo,
.el-title,
.tm-section-title,
blockquote,
.blockquote,
h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: var(--gk-font-accent) !important;
    font-weight: 400 !important;
}

#tm-main .el-content.uk-h5,
#tm-main .el-content.uk-h5 p,
#tm-main .el-content.uk-h5 span,
#tm-main .el-content.uk-h5 strong {
    font-family: var(--gk-font-body) !important;
    font-weight: 300 !important;
}

.uk-text-primary,
.uk-text-secondary,
.uk-link,
a.uk-link,
blockquote,
.blockquote {
    color: var(--gk-accent-gold) !important;
    font-family: var(--gk-font-accent) !important;
}

.uk-light .uk-text-primary,
.uk-light .uk-text-secondary,
.uk-light blockquote,
.uk-light .blockquote,
.uk-section-secondary:not(.uk-preserve-color) .uk-text-primary,
.uk-section-secondary:not(.uk-preserve-color) .uk-text-secondary,
.uk-overlay-primary .uk-text-primary,
.uk-overlay-primary .uk-text-secondary {
    color: var(--gk-accent-gold) !important;
}

.mod-languages .uk-subnav > .uk-active > a,
.mod-languages .uk-subnav > .uk-active > a:hover,
.mod-languages .uk-subnav > .uk-active > a:focus {
    color: var(--gk-accent-gold) !important;
}

.uk-light,
.uk-overlay-primary {
    color: rgba(255, 255, 255, 0.82);
}

.uk-section-secondary:not(.uk-preserve-color) {
    background-color: #EBE9DB;
    color: rgba(18, 17, 17, 0.82);
}

.uk-section-secondary:not(.uk-preserve-color) h1,
.uk-section-secondary:not(.uk-preserve-color) h2,
.uk-section-secondary:not(.uk-preserve-color) h3,
.uk-section-secondary:not(.uk-preserve-color) h4,
.uk-section-secondary:not(.uk-preserve-color) h5,
.uk-section-secondary:not(.uk-preserve-color) h6,
.uk-section-secondary:not(.uk-preserve-color) .el-title {
    color: #FFCC00 !important;
    text-shadow: 1px 1px 1px rgba(18, 17, 17, 0.45);
}

.uk-section-secondary:not(.uk-preserve-color) p,
.uk-section-secondary:not(.uk-preserve-color) li,
.uk-section-secondary:not(.uk-preserve-color) dt,
.uk-section-secondary:not(.uk-preserve-color) dd,
.uk-section-secondary:not(.uk-preserve-color) .uk-panel,
.uk-section-secondary:not(.uk-preserve-color) .uk-text-lead,
.uk-section-secondary:not(.uk-preserve-color) .uk-h5,
.uk-section-secondary:not(.uk-preserve-color) .el-content {
    color: rgba(18, 17, 17, 0.82) !important;
}

.uk-section-secondary:not(.uk-preserve-color) .el-content a:not(.uk-button),
.uk-section-secondary:not(.uk-preserve-color) .gk-email-cloak a {
    border-bottom: 1px solid rgba(18, 17, 17, 0.5);
    color: rgba(18, 17, 17, 0.9) !important;
    text-decoration: none;
}

.uk-section-secondary:not(.uk-preserve-color) .el-content a:not(.uk-button):hover,
.uk-section-secondary:not(.uk-preserve-color) .gk-email-cloak a:hover {
    border-bottom-color: rgba(18, 17, 17, 0.9);
    color: rgba(18, 17, 17, 1) !important;
}

.uk-section-secondary:not(.uk-preserve-color) .uk-button-text {
    color: rgba(18, 17, 17, 0.86) !important;
}

.uk-section-secondary:not(.uk-preserve-color) .uk-button-text::before {
    border-bottom-color: rgba(18, 17, 17, 0.46) !important;
}

.uk-section-secondary:not(.uk-preserve-color) .uk-button-text:hover,
.uk-section-secondary:not(.uk-preserve-color) .uk-button-text:focus {
    color: rgba(18, 17, 17, 1) !important;
}

.uk-section-secondary:not(.uk-preserve-color) .uk-button-text:hover::before,
.uk-section-secondary:not(.uk-preserve-color) .uk-button-text:focus::before {
    border-bottom-color: var(--gk-accent-gold) !important;
}

.uk-section-secondary:not(.uk-preserve-color) .uk-form-label {
    color: rgba(18, 17, 17, 0.82) !important;
}

.uk-section-secondary:not(.uk-preserve-color) .uk-input,
.uk-section-secondary:not(.uk-preserve-color) .uk-textarea,
.uk-section-secondary:not(.uk-preserve-color) .uk-select {
    background: rgba(255, 255, 255, 0.28) !important;
    border: 1px solid rgba(18, 17, 17, 0.34) !important;
    color: rgba(18, 17, 17, 0.9) !important;
}

.uk-section-secondary:not(.uk-preserve-color) .uk-input:focus,
.uk-section-secondary:not(.uk-preserve-color) .uk-textarea:focus,
.uk-section-secondary:not(.uk-preserve-color) .uk-select:focus {
    background: rgba(255, 255, 255, 0.42) !important;
    border-color: rgba(18, 17, 17, 0.7) !important;
    box-shadow: 0 0 0 1px rgba(18, 17, 17, 0.24);
    color: rgba(18, 17, 17, 0.95) !important;
}

.uk-section-secondary:not(.uk-preserve-color) .uk-input::placeholder,
.uk-section-secondary:not(.uk-preserve-color) .uk-textarea::placeholder {
    color: rgba(18, 17, 17, 0.45) !important;
}

.uk-dark,
.uk-section-default:not(.uk-preserve-color),
.uk-section-muted:not(.uk-preserve-color) {
    color: rgba(0, 0, 0, 0.78);
}

.brooch-overview-slider .uk-slider-container {
    position: relative;
}

.brooch-overview-slider .brooch-slider-arrow {
    align-items: center;
    background: rgba(255, 204, 0, 0.92);
    border: 1px solid rgba(255, 204, 0, 0.95);
    border-radius: 999px;
    color: #121111 !important;
    display: flex;
    height: 64px;
    justify-content: center;
    width: 64px;
    z-index: 2;
}

.brooch-overview-slider .brooch-slider-arrow-left {
    left: -32px;
}

.brooch-overview-slider .brooch-slider-arrow-right {
    right: -32px;
}

.brooch-overview-slider .brooch-slider-arrow:hover,
.brooch-overview-slider .brooch-slider-arrow:focus {
    background: #ffcc00;
    color: #121111 !important;
}

.brooch-overview-slider .brooch-slider-arrow svg {
    width: 26px;
}

.brooch-overview-slider .uk-dotnav > * > * {
    border-color: rgba(255, 204, 0, 0.75);
    border-radius: 50%;
    height: 14px;
    width: 14px;
}

.brooch-overview-slider .uk-dotnav > .uk-active > *,
.brooch-overview-slider .uk-dotnav > * > :hover {
    background-color: #ffcc00;
    border-color: #ffcc00;
}