:root{
    /* Colors */
    --white: #FFFFFF;
    --whiteF8: #F8F8F8;
    --orange: #ee3f0a;
    --blue1: #5BA8EB;
    --blue1_07: rgba(92, 168, 235, 0.07);
    --blue1_2: rgba(92, 168, 235, 0.2);
    --blue2: #04335C;
    --black: #000000;

    /* Sizes */
    --generalSpace: 24px;
}

/* Colors classes */
.bg-white{background-color: var(--white)}
.bg-whiteF8{background-color: var(--whitef8)}
.bg-blue1{background-color: var(--blue1)}
.bg-blue2{background-color: var(--blue2)}
.bg-blue1_07{background-color: var(--blue1_07)}
.txt-white{color: var(--white)}
.txt-whitef8{color: var(--whiteF8)}
.txt-blue1{color: var(--blue1)}
.txt-blue2{color: var(--blue2)}

/* Scrollbars */
html{
	scrollbar-width: thin;
	scrollbar-color: var(--blue1) var(--blue2);
}
html::-webkit-scrollbar{width: 0.6vw}
html::-webkit-scrollbar-thumb{background-color: var(--blue1)}
html::-webkit-scrollbar-track{background-color: var(--blue2)}

/* General */
/* html{
    scroll-behavior: smooth;
} */

/* Custom UiKit */
/* Off canvas */
.uk-offcanvas-bar{
    /* background-color: var(--blue1); */
    width: 290px;

    box-shadow: 0 0 1rem 0 rgba(0, 0, 0, .2);	
    background: inherit;
	overflow: hidden;

    /* box-shadow: 0 0 1rem 0 rgba(0, 0, 0, .15);	
	border-radius: 5px;
	background-color: rgba(255, 255, 255, .1);
	
	backdrop-filter: blur(5px); */
}

.uk-offcanvas-bar:before{
    content: "";
	position: absolute;
	background: inherit;
	z-index: -1;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	box-shadow: inset 0 0 2000px rgba(255, 255, 255, .8);
	filter: blur(10px);
	margin: -20px;
}

.uk-offcanvas-bar .uk-nav {
    margin-top: 70px;
}

.uk-card-primary.uk-card-body .uk-nav-default>li.uk-active>a, .uk-card-primary>:not([class*=uk-card-media]) .uk-nav-default>li.uk-active>a, .uk-card-secondary.uk-card-body .uk-nav-default>li.uk-active>a, .uk-card-secondary>:not([class*=uk-card-media]) .uk-nav-default>li.uk-active>a, .uk-light .uk-nav-default>li.uk-active>a, .uk-offcanvas-bar .uk-nav-default>li.uk-active>a, .uk-overlay-primary .uk-nav-default>li.uk-active>a, .uk-section-primary:not(.uk-preserve-color) .uk-nav-default>li.uk-active>a, .uk-section-secondary:not(.uk-preserve-color) .uk-nav-default>li.uk-active>a, .uk-tile-primary:not(.uk-preserve-color) .uk-nav-default>li.uk-active>a, .uk-tile-secondary:not(.uk-preserve-color) .uk-nav-default>li.uk-active>a{
    color: var(--orange);
    font-weight: bold;
}

.uk-card-primary.uk-card-body .uk-nav-default .uk-nav-sub a, .uk-card-primary>:not([class*=uk-card-media]) .uk-nav-default .uk-nav-sub a, .uk-card-secondary.uk-card-body .uk-nav-default .uk-nav-sub a, .uk-card-secondary>:not([class*=uk-card-media]) .uk-nav-default .uk-nav-sub a, .uk-light .uk-nav-default .uk-nav-sub a, .uk-offcanvas-bar .uk-nav-default .uk-nav-sub a, .uk-overlay-primary .uk-nav-default .uk-nav-sub a, .uk-section-primary:not(.uk-preserve-color) .uk-nav-default .uk-nav-sub a, .uk-section-secondary:not(.uk-preserve-color) .uk-nav-default .uk-nav-sub a, .uk-tile-primary:not(.uk-preserve-color) .uk-nav-default .uk-nav-sub a, .uk-tile-secondary:not(.uk-preserve-color) .uk-nav-default .uk-nav-sub a{
    color: var(--blue1);
}

.uk-card-primary.uk-card-body .uk-nav-default>li>a, .uk-card-primary>:not([class*=uk-card-media]) .uk-nav-default>li>a, .uk-card-secondary.uk-card-body .uk-nav-default>li>a, .uk-card-secondary>:not([class*=uk-card-media]) .uk-nav-default>li>a, .uk-light .uk-nav-default>li>a, .uk-offcanvas-bar .uk-nav-default>li>a, .uk-overlay-primary .uk-nav-default>li>a, .uk-section-primary:not(.uk-preserve-color) .uk-nav-default>li>a, .uk-section-secondary:not(.uk-preserve-color) .uk-nav-default>li>a, .uk-tile-primary:not(.uk-preserve-color) .uk-nav-default>li>a, .uk-tile-secondary:not(.uk-preserve-color) .uk-nav-default>li>a{
    color: var(--blue1);
}

.uk-card-primary.uk-card-body .uk-nav-default .uk-nav-header, .uk-card-primary>:not([class*=uk-card-media]) .uk-nav-default .uk-nav-header, .uk-card-secondary.uk-card-body .uk-nav-default .uk-nav-header, .uk-card-secondary>:not([class*=uk-card-media]) .uk-nav-default .uk-nav-header, .uk-light .uk-nav-default .uk-nav-header, .uk-offcanvas-bar .uk-nav-default .uk-nav-header, .uk-overlay-primary .uk-nav-default .uk-nav-header, .uk-section-primary:not(.uk-preserve-color) .uk-nav-default .uk-nav-header, .uk-section-secondary:not(.uk-preserve-color) .uk-nav-default .uk-nav-header, .uk-tile-primary:not(.uk-preserve-color) .uk-nav-default .uk-nav-header, .uk-tile-secondary:not(.uk-preserve-color) .uk-nav-default .uk-nav-header{
    color: var(--blue1);
}

/* Navbar links */
.uk-navbar-nav>li>a{
    color: var(--white);
}

.uk-navbar-nav>li.uk-active>a{
    color: var(--orange);
    font-weight: bold;
}

.uk-navbar-nav{
    gap: 0 !important;
}

.uk-navbar-nav li{
    padding: 0 calc(var(--generalSpace));
    border-bottom: solid medium transparent;
    box-sizing: border-box;
    transition: all 0.3s;
}

.uk-navbar-nav li.uk-active{
    background-color: var(--blue1_2);
    border-bottom: solid medium var(--orange);
}