@import url('https://fonts.googleapis.com/css2?family=Poppins&family=Work+Sans:wght@400;600;700&display=swap');

body {
    font-family: 'Work Sans', sans-serif; 
    color: #131313;
}
.btn {
    border-radius: 0px;
}

.content-list,
.one-tag {
    font-family: 'Poppins', sans-serif;
}
h3, .h3 {
    font-weight: 600;
}
a:not(.btn, .navbar-dark *, footer *) {
    color: #131313;
    text-decoration: none;
}
a:not(.btn, .navbar-dark *, footer *):hover, 
a:not(.btn, .navbar-dark *, footer *):focus {
    color: #F50B0B;
    text-decoration: underline;
}
.logo {
    font-family: 'Work Sans', sans-serif;
    font-size: 21px;
    font-weight: 700;
    color: #FFF;
}

/** header **/
.navbar-dark .navbar-nav .nav-link {
    color: #FFFFFF;
}

.navbar-dark .navbar-nav .nav-link:focus, .navbar-dark .navbar-nav .nav-link:hover {
    color: #F50B0B;
}

.navbar-toggler, .navbar-toggler:focus {
    border: none;
    box-shadow: none;
    color: #FFF;
}

@media (max-width: 450px) {
    .navbar .navbar-toggler {
        padding-left: 0 !important;
    }
    .navbar a.btn-danger {
        padding-top: .25rem !important;
        padding-bottom: .25rem !important;
        padding-right: .5rem !important;
        padding-left: .5rem !important;   
    }
}

/** footer **/
footer a:hover,
footer a:focus{
    color: #F50B0B;
    text-decoration: none;
}

/** colors **/
.text-danger {
    color: #FF0000 !important;
}

.bg-dark {
    background-color: #131313 !important;
}

.btn-danger {
    background-color: #F50B0B;
    border-color: #F50B0B;
}
.btn-secondary {
    color: #FFFFFF !important;
    background-color: #bb2d3b;
    border-color: #bb2d3b;
}
.btn-outline-secondary:hover,
.btn-danger:hover {
    color: #FFFFFF !important;
    background-color: #bb2d3b;
    border-color: #bb2d3b;
}
    

/* countdown */
#countdown-container {
    height: 460px;
    overflow-x: hidden;
}
#countdown-video {
    position: absolute;
    top: 50%;
    left: 50%;
    height: 100%; /* Відео завжди займає всю висоту контейнера */
    width: auto; /* Ширина адаптується автоматично */
    transform: translate(-50%, -50%); /* Відцентровуємо відео по обидвом осям */
    z-index: 1;
}
.countdown-content {
    position: absolute;
    left: 0px;
    right: 0px;
    top: 145px;
    z-index: 2;
}
.countdown-content .h4,
.countdown-content .countdown-field {
    text-transform: uppercase;
}
.countdown-field .fs-1 {
    font-size: 3rem !important;
    line-height: 3rem;
    font-weight: bold;
}
.countdown-start {
    background: rgb(255,255,255);
    background: linear-gradient(90deg, rgba(255,255,255,0) 0%, rgba(255,255,255,1) 100%);
    margin-right: 0.5rem;
}
.countdown-end {
    background: rgb(255,255,255);
    background: linear-gradient(90deg, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 100%);
    margin-left: 0.5rem;
}
.countdown-start,
.countdown-end {
    height: 8px;
    width: 200px;
    margin-top: 1rem;
}