/*
 * Skin: Rebrand
 * ----------
 */

@font-face {
    font-family: 'Reckless'; /* Replace with your desired font name */
    src: url('../fonts/Reckless-Regular.otf') format('opentype'); /* Add other font formats as needed separated with , */
}

@font-face {
    font-family: 'RecklessBold'; 
    font-weight: bold;
    src: url('../fonts/Reckless-SemiBold.otf') format('opentype'); 
}

@font-face {
    font-family: 'AptosLight'; 
    src: url('../fonts/Aptos-Light.ttf'); 
}

@font-face {
    font-family: 'Aptos'; /* Replace with your desired font name */
    src: url('../fonts/Aptos.ttf'); /* Add other font formats as needed separated with , */
}


@font-face {
    font-family: 'StudioFeixenMonoMedium'; /* Replace with your desired font name */
    src: url('../fonts/StudioFeixenMono-Medium.ttf'); /* Add other font formats as needed separated with , */
}

@font-face {
    font-family: 'Andalemo'; /* Replace with your desired font name */
    src: url('../fonts/Andalemo.ttf'); /* Add other font formats as needed separated with , */
}

h1, h2, h3, h4, h5, h6, .panel-heading {
    font-family: Reckless !important;
    
}

body {
    font-family: 'Aptos';
}

.main-header .logo {
    font-size: 18px;
}

.skin-grey .main-header .navbar {
    color: #fff;
    background-color: #000;
    border-bottom: 2px solid #fff;
}

    .skin-grey .main-header .navbar .nav > li > a {
        color: #fff;
    }

        .skin-grey .main-header .navbar .nav > li > a:hover,
        .skin-grey .main-header .navbar .nav > li > a:active,
        .skin-grey .main-header .navbar .nav > li > a:focus,
        .skin-grey .main-header .navbar .nav .open > a,
        .skin-grey .main-header .navbar .nav .open > a:hover,
        .skin-grey .main-header .navbar .nav .open > a:focus,
        .skin-grey .main-header .navbar .nav > .active > a {
            color: #fff;
            background: #1E3D65;
        }

    .skin-grey .main-header .navbar .sidebar-toggle {
        color: #fff;
    }

        .skin-grey .main-header .navbar .sidebar-toggle:hover {
            color: #fff;
            background: #1E3D65;
        }

@media (max-width: 767px) {
    .skin-grey .main-header .logo {
        border-bottom: 2px solid #1E3D65 !important;
        margin-bottom: 24px !important;
    }
}

@media (max-width: 767px) {
    .skin-grey .main-header .navbar .dropdown-menu li.divider {
        background-color: rgba(255, 255, 255, 0.1);
    }

    .skin-grey .main-header .navbar .dropdown-menu li a {
        color: #fff;
    }

        .skin-grey .main-header .navbar .dropdown-menu li a:hover {
            background: #367fa9;
        }
}

.skin-grey .main-header .logo {
    color: #fff;
    background-color: #000;
    border-bottom: 0 solid transparent;
}

    .skin-grey .main-header .logo:hover {
        background-color: #000;
    }

.skin-grey .main-header li.user-header {
    background-color: #337ab7;
}

.skin-grey .content-header {
    background: transparent;
}

.skin-grey .wrapper,
.skin-grey .main-sidebar,
.skin-grey .left-side {
    background-color: #000000;
}

.skin-grey .user-panel > .info,
.skin-grey .user-panel > .info > a {
    color: #fff;
}

.skin-grey .sidebar-menu > li.header {
    color: #fff;
    background: #1a2226;
}

.skin-grey .sidebar-menu > li > a {
    color: #fff;
    border-left: 3px solid transparent;
}

.skin-grey .sidebar-menu > li:hover > a,
.skin-grey .sidebar-menu > li.active > a {
    color: #fff;
    background: #a150ff;
    border-left-color: #42BA46;
}

.skin-grey .sidebar-menu > li > .treeview-menu {
    margin: 0 1px;
    background: #a150ff;
}

.skin-grey .sidebar a {
    color: #1E3D65;
}

    .skin-grey .sidebar a:hover {
        text-decoration: none;
    }

.skin-grey .treeview-menu > li > a {
    color: #b6b6b9;
}

    .skin-grey .treeview-menu > li.active > a,
    .skin-grey .treeview-menu > li > a:hover {
        color: #fff;
    }

.skin-grey .sidebar-form {
    border-radius: 3px;
    border: 1px solid #1e1e1f;
    margin: 10px 10px;
}

    .skin-grey .sidebar-form input[type="text"],
    .skin-grey .sidebar-form .btn {
        box-shadow: none;
        background-color: #fff;
        border: 1px solid transparent;
        height: 35px;
        -webkit-transition: all 0.3s ease-in-out;
        -o-transition: all 0.3s ease-in-out;
        transition: all 0.3s ease-in-out;
    }

    .skin-grey .sidebar-form input[type="text"] {
        color: #56565a;
        border-top-left-radius: 2px;
        border-top-right-radius: 0;
        border-bottom-right-radius: 0;
        border-bottom-left-radius: 2px;
    }

        .skin-grey .sidebar-form input[type="text"]:focus,
        .skin-grey .sidebar-form input[type="text"]:focus + .input-group-btn .btn {
            background-color: #fff;
            color: #56565a;
        }

            .skin-grey .sidebar-form input[type="text"]:focus + .input-group-btn .btn {
                border-left-color: #fff;
            }

    .skin-grey .sidebar-form .btn {
        color: #97979b;
        border-top-left-radius: 0;
        border-top-right-radius: 2px;
        border-bottom-right-radius: 2px;
        border-bottom-left-radius: 0;
    }

.skin-grey.layout-top-nav .main-header > .logo {
    background-color: #337ab7;
    color: #fff;
    border-bottom: 0 solid transparent;
}

    .skin-grey.layout-top-nav .main-header > .logo:hover {
        background-color: #0a2f47;
    }
