:root {

    --color1: hsl(35, 70%, 15%);
    --color2: #ffe000;
    --color3: hsl(30, 70%, 30%);
    --color4: hsl(45, 17%, 90%);
    --color5: hsl(25, 20%, 55%);
    --default: #333;
    --red: hsla(10, 90%, 50%, 1);
    --title: hsl(30, 70%, 30%);

    --index_bg: #FFF;
    --page_bg: #FFF;
    --footer_bg: hsl(35, 70%, 15%);
    --table_th_color: hsl(35, 70%, 15%);
    --table_th_bg: #EEE;
    --table_striped_bg: #f7f7f7;
    --table_border_color: #CCC;
    --swiper-theme-color: #FFF;
    --card_header_color: #666;
    --card_header_bg: #EEE;
    --list_group_bg: #f7f7f7;
    --placeholder_color: #999;
    --authors_login_bg: #EEE;

    --data_padding: 1rem;
}
#header{
    background-color: var(--color4);
}
.navbar_show #header{
    background-color: hsla(45, 17%, 90%, .8);
}
.navbar {
    padding: 5px;
}

.navbar-brand {
    display: block;
    aspect-ratio: 36 / 7;
    padding: 0;
}

.navbar-brand img {
    width: auto;
    height: 6rem;
    min-height: unset;
    object-fit: contain;
}

.title {
    color: var(--color3);
    border-bottom: none;
}

.title_dec {
    margin-bottom: 3rem;
}

.title_dec_line {
    width: 2em;
    height: 2em;
    text-align: center;
    vertical-align: super;
    transform-origin: 50%;
    -webkit-transform: translateX(-.5em) rotate(90deg);
    transform: translateX(-.5em) rotate(90deg);
}

.title_dec_line:first-child {
    -webkit-transform: translateX(-.5em) rotate(90deg);
    transform: translateX(-.5em) rotate(90deg);
}

.title_dec_line:last-child {
    -webkit-transform: translateX(-.5em) rotate(90deg);
    transform: translateX(-.5em) rotate(90deg);
}

.title_dec p {
    font-size: var(--font24);
    letter-spacing: .5em;
    vertical-align: middle;
}

.title {
    letter-spacing: 0;
    margin: 0 auto 1rem;
    padding-bottom: 0;
}

.title:after {
    display: none;
}

.row {
    margin: 0;
    padding: 0;
}

.donate_func {
    margin-bottom: 1rem;
}

.content_block {
    margin-bottom: 1rem;
}

.content_block:empty {
    display: none;
}

.btn_readMore {
    font-size: 1.6rem;
}

.donate_step {
    margin-bottom: 13rem;
}

.donate_step .tab-pane {
    padding: 0;
}

.donate_step .card {
    border: none;
}

.donate_step .card-header {
    background-color: var(--color3);
    color: #FFF;
    font-size: var(--font18);
    line-height: 1.5;
    padding: 0.5rem;
    border-bottom: none;
}

.donate_step .card-body {
    padding: 3rem 0;
}

[data-btn]:hover {
    background-color: #ccc;
}

[data-btn].active {
    background-color: var(--color2);
}

#nav-tab {
    border: none;
    margin-bottom: .3rem;
}

#nav-tab .nav-link {
    background-color: transparent;
    font-size: var(--font24);
    border: none;
    padding: 1.5rem 1rem;
    margin-bottom: 0;
}

#nav-tab .nav-link:not(:last-child) {
    margin-right: 0.5rem;
}

#nav-tab .nav-link:hover {
    background-color: #ccc;
}

#nav-tab .nav-link.active {
    background-color: var(--color1);
    color: #FFF;
}

.section_footer {
    background-image: url(/assets/views_udona/images/bg_foot.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    color: #FFF;
    padding-top: 30px;
    padding-bottom: 30px;
    position: relative;
    z-index: 1;
}

.section_footer::before {
    content: '';
    display: block;
    width: 100%;
    height: 100%;
    background-color: hsla(35, 70%, 15%, .8);
    background-blend-mode: multiply;
    pointer-events: none;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    z-index: -1;    
}

.section_footer p, .section_footer a {
    color: #FFF;
}

.section_footer a:hover {
    color: var(--color2);
}

.section_social {
    font-size: 1.4rem;
}

.section_social a i {
    color: #fff;
}

.section_social a:hover {
    border-color: var(--color2);
}

.section_social a:hover i {
    color: var(--color2);
}

.footer_copyright, .footer_copyright p {
    font-size: 1.4rem;
}

.footer_info {
    justify-content: space-around;
    border-bottom: 1px solid #fff;
    padding-bottom: 1.5rem;
    margin-bottom: 1.5rem;
}

.btn_project_link:hover {
    color: var(--color3);
}

.project_title {
    background-color: var(--color1);
    color: #fff;
    border-radius: 6px;
}

.btn_color1 {
  background-color: var(--color5);
  border-color: var(--color5);
}