:root {
    --primary-color: #dc4865; /*  */
    --hover-color: #c23e58; /*  */
    /*--muted-color: #fffafb;*/ /* #fff9f0 */ /* #f6f2ef */
    --muted-color: #f3edee;
    --secondary-color: #008c8d;
    --text-color: #2c2c2c; /*  */
    --makino-color: #0e6eb8;
    --mgef-color: #547a9f; /* #8dacc9 82a8cd 8E9BAE */
}

@font-face {
    font-family: "Inter";
    src: url("../font/Inter-Regular.woff2") format("woff2");
}
@font-face {
    font-family: "Montserrat";
    src: url("../font/Montserrat-Regular.woff2") format("woff2");
}
@font-face {
    font-family: "Barlow";
    src: url("../font/Barlow-Regular.woff2") format("woff2");
}

@font-face {
    font-family: "Roboto";
    src: url("../font/Roboto-Regular.ttf") format("truetype");
}
@font-face {
    font-family: "OpenSans";
    src: url("../font/OpenSans-Regular.ttf") format("truetype");
}
@font-face {
    font-family: "Poppins";
    src: url("../font/Poppins-Regular.ttf") format("truetype");
}

* {
    font-family: "Inter"!important;
}

html {
    color: var(--text-color); line-height: 1.6; font-size: 16px;
}
[v-cloak] {
    display: none;
}
.uk-text-primary {
    color: var(--primary-color)!important
}

.uk-link, a {
    color: var(--primary-color);
}
.uk-link-toggle:hover .uk-link,.uk-link:hover,a:hover {
    color: var(--hover-color); text-decoration: none;
}

.uk-button {
    line-height: 48px; padding: 0 26px 0 30px; text-transform: none; border-radius: 5px; font-weight: bold;
}
.uk-button:not(.uk-slidenav) svg {
    margin-left: 6px; margin-top: -1px;
}
.uk-button:not(.uk-slidenav):hover svg {
    animation: .5s ease-out both; animation-name: uk-slide-left-small;
}

.uk-button-default {
    color: var(--primary-color); border-color: var(--primary-color);
}
.uk-button-default:hover {
    color: var(--hover-color); border-color: var(--hover-color);
}
.uk-button-primary {
    background-color: var(--primary-color);
}
.uk-button-primary:hover {
    background-color: var(--hover-color);
}
/*
.uk-button-large {
    font-size: 1rem; line-height: 1rem; padding: 16px 24px 20px 24px; ;
}
*/
.uk-card-primary.uk-card-body .uk-button-primary,.uk-card-primary>:not([class*=uk-card-media]) .uk-button-primary,.uk-card-secondary.uk-card-body .uk-button-primary,.uk-card-secondary>:not([class*=uk-card-media]) .uk-button-primary,.uk-light .uk-button-primary,.uk-offcanvas-bar .uk-button-primary,.uk-overlay-primary .uk-button-primary,.uk-section-primary:not(.uk-preserve-color) .uk-button-primary,.uk-section-secondary:not(.uk-preserve-color) .uk-button-primary,.uk-tile-primary:not(.uk-preserve-color) .uk-button-primary,.uk-tile-secondary:not(.uk-preserve-color) .uk-button-primary {
    color: var(--text-color);
}
.uk-card-primary.uk-card-body,.uk-card-primary>:not([class*=uk-card-media]),.uk-card-secondary.uk-card-body,.uk-card-secondary>:not([class*=uk-card-media]),.uk-light,.uk-offcanvas-bar,.uk-overlay-primary,.uk-section-primary:not(.uk-preserve-color),.uk-section-secondary:not(.uk-preserve-color),.uk-tile-primary:not(.uk-preserve-color),.uk-tile-secondary:not(.uk-preserve-color) {
    color: #fff;
}
.uk-h1,.uk-h2,.uk-h3,.uk-h4,.uk-h5,.uk-h6,.uk-heading-2xlarge,.uk-heading-3xlarge,.uk-heading-large,.uk-heading-medium,.uk-heading-small,.uk-heading-xlarge,h1,h2,h3,h4,h5,h6 {
    color: var(--text-color);
}
.uk-link-text a,.uk-link-toggle .uk-link-text,a.uk-link-text {
    color: var(--text-color);
}

.uk-form-label {
    color: var(--text-color); font-size: 1rem;
}

.uk-background-primary {
    background-color: var(--primary-color);
}
.uk-background-secondary {
    background-color: var(--secondary-color);
}
.uk-background-muted {
    background-color: var(--muted-color);
}

.uk-section-primary {
    background-color: var(--primary-color);
}
.uk-section-secondary {
    background-color: var(--secondary-color);
}
.uk-section-muted {
    background-color: var(--muted-color);
}

.uk-card-default {
    color: var(--text-color);
}
.uk-card-primary {
    background-color: var(--primary-color);
}

.uk-nav>li>a {
    padding: 8px 15px;
}

.uk-navbar-container:not(.uk-navbar-transparent) {
    background: none;
}

.uk-navbar-nav>li>a {
    text-transform: none; font-size: 1.2rem; color: var(--text-color);
}

.uk-navbar-dropdown {
    padding: 25px 15px; width: auto;
}
.uk-navbar-dropdown-nav {
    font-size: 1rem;
}
.uk-navbar-dropdown-nav>li>a {
    color: var(--text-color);
}
.uk-navbar-dropdown-nav>li>a:hover {
    background-color: #f8f8f8;
}

.uk-navbar-toggle {
    color: var(--text-color);
}
.uk-navbar-toggle:hover,.uk-navbar-toggle[aria-expanded=true] {
    color: var(--text-color);
}

.uk-dropdown {
    padding: 25px 10px;
}
.uk-dropdown-nav {
    font-size: 1rem;
}
.uk-dropdown-nav>li>a {
    color: var(--text-color)!important;
}
.uk-dropdown-nav>li>a:hover {
    background-color: #f8f8f8;
}

.uk-light .uk-breadcrumb * {
    color: #fff!important;
}

.product-pictures a[aria-selected=true] img {
    border-bottom: 5px solid #aaa;
}

.color-default {
    color: #fff;
}
.color-default h1 {
    color: #fff;
}

.background-makino {
    background-color: var(--makino-color);
}
.background-mgef {
    background-color: var(--mgef-color);
}
.background-overlay-black {
    background-color: rgba(0,0,0,.2);
}
.background-overlay-white {
    background-color: rgba(255,255,255,.2);
}

.container-2xsmall {
    max-width: 600px;
}

.fillet {
    border-radius: 10px;
}
.diagonal-fillet {
    border-top-left-radius: 20%; border-bottom-right-radius: 20%;
}
.grid-xlarge {
    margin-left: -80px;
}
.grid-xlarge>* {
    padding-left: 80px;
}
@media (min-width: 1200px) {
    .grid-xlarge {
        margin-left: -120px;
    }

    .grid-xlarge>* {
        padding-left: 120px;
    }
}

.card-body {
    padding: 24px 30px; color: var(--text-color);
}

/*
a.uk-icon {
    color: #dc4865; font-weight: bold;
}
*/

.text-shadow {
    color: white;
    text-shadow:
            -1px -1px 0 var(--primary-color),
            1px -1px 0 var(--primary-color),
            -1px 1px 0 var(--primary-color),
            1px 1px 0 var(--primary-color);
}

/*
a.uk-icon:not(.uk-button-primary) {
    color: var(--primary-color);
}
a.uk-icon:not(.uk-button-primary):hover, span.uk-icon:hover {
    color: var(--hover-color);
}

a.uk-icon svg, span.uk-icon svg {
    margin-left: 6px;
}
*/

/*
a.more, span.more {
    color: var(--primary-color); font-weight: bold;
}
a.more svg, span.more svg {
    background-color: var(--primary-color); border-radius: 50%; color: #fff; transform: rotate(-45deg);
}
a.more:hover svg, span.more:hover svg {
    background-color: var(--hover-color);
}

.uk-light a.more {
    color: #fff;
}
.uk-light a.more svg {
    background-color: #fff; color: var(--primary-color);
}
*/

.link {
    color: var(--primary-color); font-weight: bold;
}
.link svg {
    margin-left: 6px; background-color: var(--primary-color); border-radius: 50%; color: #fff; margin-top: -1px;
}
.link:hover svg {
    background-color: var(--hover-color); animation: .5s ease-out both; animation-name: uk-slide-left-small;
}
.uk-light .link {
    color: #fff;
}
.uk-light .link svg {
    background-color: #fff; color: var(--text-color);
}
/*
.box {
    width: 100px;
    height: 100px;
    background-color: #ccc;
}

.box:hover svg {
    animation: .5s ease-out both ; animation-name: uk-fade,uk-slide-left-small;
}
*/
/*
.uk-nav-default {
    font-size: 1rem;
}
*/

/*
.ivu-badge {
    position: relative;
    display: inline-block;
    line-height: inherit;
    vertical-align: baseline;
}
*/
/*
.uk-slideshow h1 {
    font-size: 3rem; font-weight: bold;
}
h1.banner {
    font-size: 3rem; font-weight: bold;
}
*/

.number-input {
    border: 1px solid #e5e5e5; display: inline-block; padding: 5px 10px; border-radius: 5px;
}
.number-input input {
    border: none; height: 20px;
}

.header {
    background-color: var(--muted-color);
}
.header hr {
    border-color: rgba(0,0,0,.08);
}
.header .logo {
    width: 40px;
}
@media (min-width: 960px) {
    .header .logo {
        width: 60px
    }
}

.top-nav .uk-navbar-nav>li>a, .top-nav .uk-navbar-item {
    min-height: 60px;
}

.main-nav {
    background-color: var(--muted-color);
}
.main-nav.shadow {
    box-shadow: 0 5px 10px -5px rgba(0, 0, 0, .2);
}
@media (min-width: 960px) {
    .main-nav .uk-navbar-nav {
        gap: 40px;
    }
}
.main-nav .uk-navbar-nav>li>a {
    min-height: 120px;
}

.heart::before {
    content: "\2764";
}


/*
.expert-meta h4 {
    height: 30px;
}
.expert-meta h6.meta2 {
    height: 30px;
}
*/

.ivu-badge-status-dot {
    width: 8px;
    height: 8px;
    display: inline-block;
    border-radius: 50%;
    vertical-align: middle;
    position: relative;
    /*top: -1px;*/

    background-color: #008c8d;
    line-height: inherit;
    /*vertical-align: baseline;*/
}

.ivu-badge-status-dot:after {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    border: 2px solid #008c8d;
    content: "";
    -webkit-animation: aniStatusProcessing 1.2s ease-in-out infinite;
    animation: aniStatusProcessing 1.2s ease-in-out infinite;

    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

@-webkit-keyframes aniStatusProcessing {
    0% {
        -webkit-transform: scale(.8);
        transform: scale(.8);
        opacity: .5
    }

    to {
        -webkit-transform: scale(3.4);
        transform: scale(3.4);
        opacity: 0
    }
}

@keyframes aniStatusProcessing {
    0% {
        -webkit-transform: scale(.8);
        transform: scale(.8);
        opacity: .5
    }

    to {
        -webkit-transform: scale(3.4);
        transform: scale(3.4);
        opacity: 0
    }
}

.pad-app-width {
    width: 280px;
}
@media (min-width: 960px) {
    .pad-app-width {
        width: 350px
    }
}

.expert-portrait {
    background-color: var(--muted-color); padding-top: 20px;
}

.expert-meta {
    padding: 20px 20px;
}

.globe-title {
    top: 60px;
}
.globe-text {
    bottom: 60px;
}
.globe-text h1 {
    /*color: #3CC865;*/
}
.globe-text h5 {
    color: rgba(255, 255, 255, .5);
}



