/*Astro*/
:root {
    --first-color: #f19220;
    --second-color: #fec124;
    --third-color: #515151;
    --fourth-color: #47ad01;
    --fifth-color: #fdf0e6;
    --container-background: #f9f9f9;
    /*--container-background: #ffffff;*/
    /*--header-background: linear-gradient(90deg, rgb(0, 92, 147), rgb(107, 58, 167));*/
    --header-background: #ffffff;
    --header-logo-max-height: 100%;
    --header-logo-max-width: 150px;
    --btn-color : linear-gradient(90deg, var(--first-color), var(--first-color));
}


.btn-custom-1 {
    background: var(--btn-color);
    border-color: #e6c100;
    color: #ffffff;
}

.bg-custom-gradation, .btn-custom-gradation {
    background: -webkit-linear-gradient(90deg, var(--c1, #ffe229), var(--c2, #baf32e) 51%, var(--c1, #a7ea67)) var(--x, 0) / 200%;
    background: -moz-linear-gradient(90deg, var(--c1, #ffe229), var(--c2, #baf32e) 51%, var(--c1, #a7ea67)) var(--x, 0) / 200%;
    background: -o-linear-gradient(90deg, var(--c1, #ffe229), var(--c2, #baf32e) 51%, var(--c1, #a7ea67)) var(--x, 0) / 200%;
    background: linear-gradient(90deg, var(--c1, #ffe229), var(--c2, #baf32e) 51%, var(--c1, #a7ea67)) var(--x, 0) / 200%;
    border-color: var(--c3, #a7ea67) !important;
    -webkit-transition: .5s;
    -moz-transition: .5s;
    -ms-transition: .5s;
    -o-transition: .5s;
    transition: .5s;
}

.btn-7 {
    --c1: #ffe229;
    --c2: #baf32e;
    --c3: #a7ea67;
}


.navbar .navbar-brand {
    /*width: 20px;*/
    /* height: 53px; */
    /*position: absolute;*/
}

/*Text Color*/
.navbar,
.navbar a,
.navbar .nav-link,
.navbar .nav-link.active,
.navbar .nav-link.show {
    color: #333333;
}

.navbar a:hover,
.navbar .nav-link:hover,
.navbar .nav-link.active:hover,
.navbar .nav-link.show:hover {
    color: #333333;
}


/*Background*/
.navbar-bg-custom {
    background: var(--header-background);
}
.body-bg-custom {
    background-color: #d2d0d0 !important;
}
.container-bg-custom {
    background-color: var(--container-background) !important;
}
.border-custom {
    border-color: #333333;
}

/*Button Custom*/
.btn-custom-1 {
    background-color: var(--first-color) !important;
    border-color: var(--first-color) !important;
    color: #FFFFFF !important;
}
.btn-custom-2 {
    background-color: var(--second-color) !important;
    border-color: var(--second-color) !important;
    color: #FFFFFF !important;
}
.btn-1 {
    --c1: var(--first-color);
    --c2: var(--third-color);
    --c3: var(--third-color);
}


.form-check-input:checked {
    background-color: var(--first-color);
    border-color: var(--first-color);
}




/*Badge*/
.badge-custom {
    background-color: var(--fourth-color);
}

/*Menu*/
.navbar-nav .nav-link.active::after,
.menuBottom a.active::after {
    border-top: 4px solid var(--second-color);
}

.navbar-nav .nav-link.active {
    background-color: var(--first-color) !important;
    color: #FFFFFF !important;
}

.navbar .nav-link:not(.active,.conversion):hover {
    background-color: #eeeeee;
}


/*Footer*/
footer {
    color: #ffffff;
}

/*Pagination*/
.pagination .active>.page-link, .page-link.active {
    z-index: 3;
    color: #FFFFFF !important;
    background-color: var(--first-color);
    border-color: var(--first-color);
}
.pagination .page-link {
    color: #000000;
}



/*Wallet*/
.wallet .nav-pills .nav-link.active,
.wallet .nav-pills .show>.nav-link {
    background-color: var(--first-color) !important;
    color: var(--bs-nav-pills-link-active-color) !important;
}