/*
Theme Name: Flatsome Child
Description: This is a child theme for Flatsome Theme
Author: UX Themes
Template: flatsome
Version: 3.0
*/

/*************** ADD CUSTOM CSS HERE.   ***************/
@font-face {
    font-family: "SF Pro Display";
    src: url("./resources/fonts/SF-Pro-Display/SF-Pro-Display-Regular.otf") format("opentype");
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "SF Pro Display";
    src: url("./resources/fonts/SF-Pro-Display/SF-Pro-Display-Medium.otf") format("opentype");
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "SF Pro Display";
    src: url("./resources/fonts/SF-Pro-Display/SF-Pro-Display-Semibold.otf") format("opentype");
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "SF Pro Display";
    src: url("./resources/fonts/SF-Pro-Display/SF-Pro-Display-Bold.otf") format("opentype");
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "SF Pro Display";
    src: url("./resources/fonts/SF-Pro-Display/SF-Pro-Display-Heavy.otf") format("opentype");
    font-weight: 800;
    font-style: normal;
    font-display: swap;
}

/* =========================
   Gilroy
========================= */

@font-face {
    font-family: "Gilroy";
    src: url("./resources/fonts/Gilroy/Gilroy-Light.otf") format("opentype");
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Gilroy";
    src: url("./resources/fonts/Gilroy/Gilroy-ExtraBold.otf") format("opentype");
    font-weight: 800;
    font-style: normal;
    font-display: swap;
}

body {
    font-family: 'SF Pro Display';
    font-size: 15px;
    color: #333;
    font-weight: 300;
}


.header-nav {
    justify-content: space-between;
}

#logo img {
    margin: 0 auto;
    position: absolute;
    top: 0!important;
    left: 50%;
    transform: translateX(-50%);
    height: 110px!Important;
    max-height: max-content!important;
}

#logo {
    position: relative;
    height: 100%;
}

#header {
    border-bottom: 1px solid var(--fs-color-secondary);
}