@font-face {
    font-family: 'Outfit';
    src: url('../2025_webfonts/Outfit-Variable.woff2') format('woff2-variations');
    font-weight: 100 900;
    font-style: normal;
    font-display: swap;
}
@font-face {
    src: local("Arial");
    size-adjust: 1;
    ascent-override: 0.26;
    descent-override: 57.51754455%;
    line-gap-override: 0;
}

/* BASE
================================================== */


body {
    color: #6f6f6f;
    background: #f0f0f0;
}

body,
input,
button,
textarea {
    font-family: Outfit, Arial, sans-serif;
}

h1,
h2,
h3,
h4,
h5,
h6,
.h1,
.h2,
.h3,
.h4,
.h5,
.h6 {
    line-height: 1.2;
    margin-top: 0;
    margin-bottom: 1rem;
    font-weight: 600;
}

p,
ul,
ol,
table,
figure {
    margin-bottom: 1rem;
}

a,
input,
textarea,
button {
    transition: color 0.3s, background-color 0.3s, border-color 0.3s, opacity 0.3s;
}

a {
    text-decoration: none;
    color: #6561f1;
}

a:hover {
    color: #14092b;
}


/*
 *
WCAG bazmeg
*,
*:focus {
    outline: none !important;
}
*/

img {
    max-width: 100%;
    height: auto;
}

figure img {
    width: 100%;
}

strong {
    font-weight: 600;
}

/* LAYOUT
================================================== */

/*
	Header
*/

.header {
    position: sticky;
    display: flex;
    align-items: center;
    z-index: 1010;
    top: 0;
    right: 0;
    left: 0;
    padding: 0 0.75rem;
    height: 4rem;
    background: #fff;
    transition: all 0.3s;
    box-shadow: 0 0 .3rem rgba(0, 0, 0, 0.12);
}

.header__logo {
    display: block;
    height: 1.375rem;
    margin-left: 2.75rem;
}

.header__logo img {
    display: block;
    width: auto;
    height: 100%;
}

.header__logo img + img {
    display: none;
}

.color-mode-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    border: 0;
    width: 1.75rem;
    height: 1.75rem;
    background: #14092b;
    border-radius: 100%;
}

.color-mode-btn svg {
    width: 1rem;
    height: 1rem;
    fill: #fff;
}

/*
    Top Nav
*/

.top-nav {
    display: flex;
    align-items: center;
    /* background: linear-gradient(to bottom, #6968eb 0%, #8da5f9 100%); */
    /* background: linear-gradient(to bottom, #6968eb 0%, #8da5f9 100%); */
    background:
        linear-gradient(135deg, #f5f7fa 0%, #c3cfe2 100%),
        radial-gradient(circle,rgba(88, 176, 176, .15) 0%, rgba(255, 255, 255, .15) 42%, rgba(232, 232, 232, 0) 100%),
        linear-gradient(to bottom, #eee 0%, #dce4ff 100%);

    padding: .5em 0;
    margin-top: .5em;
}
.dark .top-nav {
    /* #14092b */
    background: 
        linear-gradient(135deg, #f5f7fa22 0%, #c3cfe202 100%),
        radial-gradient(circle, #204a4a20 0%, #33aaaa20 42%, #00000020 100%),
        linear-gradient(to bottom, #2a223d44 0%, #dce4ff04 100%);
}

.top-nav__menu a strong {
    font-weight: 400;
}
.top-nav__menu {
    align-content: center;
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    font-weight: 300;
    justify-content: center;
    list-style-type: none;
    margin: 0;
    padding: 0;
    text-transform: uppercase;
    white-space: nowrap;
    gap: .5rem 1rem;
}

.top-nav__menu a {
    padding: .2rem 1.5rem;
    border-radius: 0.75rem;
    text-align: center;
    font-weight: bold;
    color: #3d3a9e;
    flex-shrink: 1; 
    font-size: 1rem;
}
.dark .top-nav__menu a {
    color: #ccc;
}
.dark .top-nav__menu a {
    color: white;
    background: #14092b66;

}
.top-nav__menu a {
    background: white;
    color: #14092b;
}
.dark .top-nav__menu a:hover {
    color: #9d9bf2;
}
.top-nav__menu a:hover {
    color: #2c28b2;
    box-shadow: 1px 1px 1rem #2c28b220;
}

/*
    Navigation
*/

.mobile-menu-btn {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    width: 1.625rem;
    height: 1.1875rem;
    transition: all 0.3s;
}

.mobile-menu-btn span {
    display: block;
    width: 100%;
    height: 0.1875rem;
    background: #14092b;
    border-radius: 0.5rem;
}

.main-menu {
    display: flex;
    align-items: center;
    font-size: 1.25rem;
    text-transform: uppercase;
    font-weight: 600;
}

.main-menu ul {
    margin-bottom: 0;
    padding: 0;
    list-style-type: none;
}

.main-menu li {
    position: relative;
}

.main-menu li a {
    position: relative;
    display: block;
    padding: 0.5rem 0;
    color: #14092b;
}

.main-menu > ul {
    display: flex;
    align-items: center;
    gap: 3rem;
}

.main-menu > ul > li:hover > a,
.main-menu > ul > li.active > a {
    color: #5450d3;
}

.main-menu li > ul {
    position: absolute;
    z-index: 1;
    visibility: hidden;
    top: 100%;
    left: -1.5rem;
    padding: 1rem 0;
    min-width: 15rem;
    text-align: left;
    background: #5450d3;
    opacity: 0;
    transition: all 0.3s;
}

.main-menu ul ul a {
    padding: 0.5rem 1.5rem;
    text-transform: none;
    color: #fff;
}

.main-menu ul ul li:hover > a,
.main-menu ul ul li.active > a {
    color: #14092b;
}

.main-menu li:hover > ul,
.main-menu li:hover > .megamenu {
    visibility: visible;
    opacity: 1;
}

.main-menu .has-megamenu {
    position: static;
}

.main-menu .has-megamenu a:after {
    position: absolute;
    content: '';
    bottom: 0;
    left: 50%;
    margin-left: -1rem;
    border-right: 1rem solid transparent;
    border-left: 1rem solid transparent;
    border-bottom: 1rem solid #5450d3;
    opacity: 0;
    transition: opacity 0.3s;
}

.main-menu .has-megamenu:hover > a:after {
    opacity: 1;
}

.main-menu .megamenu {
    position: absolute;
    visibility: hidden;
    top: 100%;
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    padding: 2rem;
    background: #5450d3;
    opacity: 0;
    transition: all 0.3s;
}

/*
	Footer
*/

.footer {
    padding-top: 3rem;
    font-size: 1rem;
    color: #fff;
    background-color: #14092b;
}

.footer a {
    color: #707bcc;
}

.footer a:hover {
    color: #fff;
}

.footer__links {
    padding: 0;
    list-style-type: none;
}

.footer .section-title {
    color: #8190f5;
}

.footer__logo {
    display: flex;
}

.footer__logo a {
    display: block;
    height: 2.5rem;
}

.footer__logo a img {
    display: block;
    height: 100%;
    width: auto;
    aspect-ratio: 403/64;
}

.footer__title {
    font-size: 1.25rem;
    text-transform: uppercase;
}

.footer__menu {
    padding: 0;
    list-style-type: none;
    text-transform: uppercase;
    font-weight: 600;
}

.footer__menu a {
    color: #fff;
}

.footer__menu a:hover {
    color: #5450d3;
}

.footer .media-box__title {
    color: #fff;
}

.copyright {
    margin-top: 2rem;
    padding: 1.5rem 0;
    line-height: 1.25;
    color: #928aa3;
    background: #070017;
}

.copyright p {
    margin: 0;
}

/*
    Offcanvas
*/

.offcanvas {
    max-width: 80%;
    font-size: 1.25rem;
}

.offcanvas ul {
    padding: 0;
    list-style-type: none;
}

.offcanvas ul a {
    display: flex;
    align-items: center;
    min-height: 3rem;
    padding: 0.25rem 0;
    font-weight: 600;
}

.offcanvas ul a i {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: 2.5rem;
    height: 2.5rem;
    font-size: 0.75rem;
    margin-left: auto;
    border-radius: 100%;
    cursor: pointer;
    transform: rotate(-90deg);
}

.offcanvas ul a i:after {
    position: absolute;
    content: '';
    top: 50%;
    left: 50%;
    width: 8px;
    height: 8px;
    border-left: 2px solid transparent;
    border-bottom: 2px solid transparent;
    transform: rotate(-45deg) translate(1px, -6px);
    transform-origin: center center 0;
}

.offcanvas ul ul {
    margin-left: .75rem;
    padding-left: .75rem;
    border-left: .3rem solid var(--bs-gray-dark);
    font-size: 1.125rem;
}

.offcanvas-body > ul li.dropdown ul{
    display: none;
}

.offcanvas-body > ul li.dropdown.active > ul {
    display: block;
}

.offcanvas ul li.active > a > i {
    transform: rotate(0);
}

.offcanvas-body > ul > li > a {
    text-transform: uppercase;
}

.offcanvas--white {
    background: #fff;
}

.offcanvas--white ul a {
    color: var(--bs-nav-link-hover-color)

}

.offcanvas--white ul a i {
    background: rgba(0, 0, 0, 0.1);
}

.offcanvas--white ul a i:after {
    border-left-color: #14092b;
    border-bottom-color: #14092b;
}

.offcanvas--white .offcanvas-body > ul li.active > a {
    color: #5450d3;
}

.offcanvas--primary {
    background: #5450d3;
}

.offcanvas--primary ul a {
    color: #fff;
}

.offcanvas--primary ul a i {
    background: rgba(0, 0, 0, 0.1);
}

.offcanvas--primary ul a i:after {
    border-left-color: #fff;
    border-bottom-color: #fff;
}

.offcanvas--primary .offcanvas-body > ul li.active > a {
    color: #14092b;
}

.offcanvas--primary .dropdown-menu {
    padding: .5rem 0;
}

.offcanvas--primary .dropdown-item {
    width: 100%;
    min-height: auto;
    padding: .25rem 1rem;
    color: #14092b;
}

/* SECTIONS
================================================== */

/* MODULES
================================================== */

/*
    Picture Box
*/

.media-box,
.media-box:hover {
    color: #2e2e2e;
}

.media-box {
    position: relative;
    display: flex;
    flex-direction: column;
    height: 100%;
}

.media-box figure {
    position: relative;
    margin-bottom: 0.3125rem;
}

.media-box figure:after {
    display: block;
    content: '';
    padding-bottom: 150%;
}

.media-box figure img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    aspect-ratio: 209/314;
}

.media-box .video {
    margin-bottom: 0.3125rem;
}

.media-box__title {
    margin-bottom: 0.25rem;
    text-transform: uppercase;
    font-size: 0.8125rem;
    color: #14092b;
}

.media-box .badges {
    position: absolute;
    display: flex;
    z-index: 2;
    top: 0.5rem;
    right: 0.5rem;
}

.media-box .icon-more {
    position: absolute;
    right: 0.5rem;
    bottom: 0.5rem;
    transition: all 0.3s;
}

.media-box--card {
    font-size: 0.75rem;
    color: #959595;
    background: #fff;
}

.media-box--card figure {
    margin: 0;
}

.media-box--card .media-box__content__inner {
    padding: 0.5rem;
}

.media-box__content__inner > *:last-child {
    margin-bottom: 0;
}

/*
    Post Box
*/

.post-box,
.post-box:hover {
    color: #959595;
}

.post-box {
    display: flex;
    flex-direction: column;
    font-size: 0.75rem;
    line-height: 1.25;
    background: #fff;
    box-shadow: 0 0.25rem 0.5rem rgba(0, 0, 0, 0.1);
    transition: all 0.3s;
}

.post-box figure {
    position: relative;
    margin-bottom: 0;
}

.post-box figure:after {
    display: block;
    content: '';
    padding-bottom: 45%;
}

.post-box figure img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.post-box figure .btn {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.post-box__content {
    padding: 0.5rem;
}

.post-box__content > p {
    margin-bottom: 0.5rem;
}

.post-box__title {
    margin-bottom: 0.5rem;
    text-transform: uppercase;
    font-size: 0.8125rem;
    color: #14092b;
}

.post-box time {
    display: flex;
    align-items: center;
    font-weight: 600;
    margin-right: 2rem;
    color: #14092b;
}

.post-box time svg {
    display: block;
    width: 1.375rem;
    height: 1.375rem;
    margin-right: 0.5rem;
    fill: #5450d3;
}

.post-box__tags {
    display: flex;
    align-items: center;
    font-weight: 600;
    line-height: 1.25;
    color: #14092b;
}

.post-box__tags > span {
    display: inline-block;
    margin-right: 0.25rem;
    color: #6561f1;
}

.post-box__tags ul {
    display: flex;
    flex-wrap: wrap;
    margin: 0;
    padding: 0;
    list-style-type: none;
}

.post-box__tags li:not(:last-child):after {
    content: '/';
    padding: 0.25rem;
}

.post-box:hover figure .btn-dark {
    border-color: #5450d3;
    color: #fff;
    background-color: #5450d3;
}

/*
    Member Box
*/

.member-box {
    display: flex;
    flex-direction: column;
    text-align: center;
    color: #959595;
}

.member-box figure {
    position: relative;
    margin-bottom: 0.5rem;
    transition: all 0.3s;
}

.member-box figure:after {
    display: block;
    content: '';
    padding-bottom: 100%;
}

.member-box figure img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    aspect-ratio: 1;
}

.member-box__title {
    font-size: 1rem;
    font-weight: 400;
    margin: 0;
}

.member-box__footer {
    text-align: left;
}

.member-box__like {
    display: flex;
    align-items: center;
    white-space: nowrap;
    font-size: 0.875rem;
    color: #14092b;
}

.member-box__like svg {
    width: 1rem;
    height: 1rem;
    margin-right: 0.25rem;
    fill: #5450d3;
    transition: opacity 0.3s;
    opacity: 0.7;
}
.member-box__like svg:hover {
    opacity: 1;;
}
.member-box__like svg.dislike-btn {
    transform: scaleY(-1);
}

.member-box:hover {
    color: #1b1d3c;
}

/*
    Panel
*/

.panel {
    padding: 1rem;
    background: #fff;
}

.panel--gray {
    background: #f5f5f5;
    border-radius: 1rem;
}

/*
    Info Panel
*/

.info-panel {
    overflow: hidden;
    background: #dfdfdf;
    border-radius: 1rem;
}

.info-panel__header {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 2rem 1rem;
    text-align: center;
    color: #fff;
    background: #14092b;
}

.info-panel__title {
    font-size: 1.5rem;
    text-transform: uppercase;
}

.info-panel__body {
    padding: 1rem;
}

.info-panel__body figure {
    position: relative;
    overflow: hidden;
}

.info-panel__body figure:after {
    display: block;
    content: '';
    padding-bottom: 100%;
}

.info-panel__body figure img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/*
    Comment
*/

.comment {
    font-size: 1rem;
    color: #959595;
}

.comment:not(:last-child) {
    margin-bottom: 1.5rem;
}

.comment p {
    margin-bottom: 0.5rem;
}

.comment__header {
    display: flex;
    color: #14092b;
}

.comment__header time {
    margin-left: auto;
}

/*
    Fancybox
*/

.fancybox__backdrop {
    background: rgba(20, 9, 43, 0.9);
}

.is-compact .fancybox__footer,
.f-button {
    background: rgba(20, 9, 43, 0.5);
}

/* COMPONENTS
================================================== */

/*
	Buttons
*/

.btn {
    display: inline-flex;
    align-items: center;
    padding: 0.875rem 2rem;
    border-width: 2px;
    font-size: 1.125rem;
    text-transform: uppercase;
    font-weight: 600;
    box-shadow: none;
    border-radius: 0.75rem;
}

.btn-xs {
    padding: 0.25rem 1rem;
    font-size: 0.8125rem;
    border-radius: 0.5rem;
}

.btn-sm {
    padding: 0.6875rem 1.5rem;
    font-size: 0.8125rem;
    border-radius: 0.5rem;
}

.btn.nav-link {
    border-width: 2px;
    border-style: solid;
}

.btn:focus,
.btn:active:focus {
    box-shadow: 0 0 0 0.25rem rgba(0 0 0 / 10%);
}

.btn-primary,
.btn-primary:focus {
    border-color: #5450d3;
    color: #fff;
    background-color: #5450d3;
}

.btn-primary:hover,
.btn-primary:first-child:active,
.btn-primary:hover:active,
.btn-primary:focus:active {
    border-color: #3d3a9e;
    color: #fff;
    background-color: #3d3a9e;
}

.btn--gray,
.btn--gray:focus {
    border-color: #eaeaea;
    color: #14092b;
    background-color: #eaeaea;
}

.btn--gray:hover,
.btn--gray:first-child:active,
.btn--gray:hover:active,
.btn--gray:focus:active,
.btn--gray.active {
    border-color: #14092b;
    color: #fff;
    background-color: #14092b;
}

.btn-dark,
.btn-dark:focus {
    border-color: #14092b;
    color: #fff;
    background-color: #14092b;
}

.btn-dark:hover,
.btn-dark:first-child:active,
.btn-dark:hover:active,
.btn-dark:focus:active {
    border-color: #5450d3;
    color: #fff;
    background-color: #5450d3;
}

.btn-gradient-primary,
.btn-gradient-primary:focus {
    border: 0;
    color: #fff;
    background: linear-gradient(to bottom, #6867eb 0%, #8ca3f8 100%);
    transition: none;
}

.btn-gradient-primary:hover,
.btn-gradient-primary:first-child:active,
.btn-gradient-primary:hover:active,
.btn-gradient-primary:focus:active {
    color: #fff;
    background: #5450d3;
}

.btn svg {
    display: block;
    width: 1.125rem;
    height: 1.125rem;
    fill: #fff;
}

.btn-like {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    margin: 0 auto;
    border: 0;
    color: #fff;
    background: transparent;
}

.btn-like svg {
    display: block;
    width: 2.5rem;
    height: 2.5rem;
    margin-bottom: 0.25rem;
    fill: #5450d3;
}
a.external-link {
  display: block;
}

a.external-link > span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: calc( 100% - 1.1rem);
  display: inline-block;
  vertical-align: bottom;
  height: var(--bs-body-line-height);
  line-height: var(--bs-body-line-height);
}
a.external-link > svg {
  width: 1rem;
  height: 1rem;
  fill: currentColor;
  display: inline-block;
  vertical-align: baseline;
}

.btn-like:hover {
    opacity: 0.8;
}

.btn-like--active,
.btn-like--active:hover {
    opacity: 1;
}

.btn-like--active svg {
    fill: #fff;
}

/*
	Form components
*/

.form-label {
    color: #2e2e2e;
}

.form-control,
.form-select {
    padding: 0.875rem 1rem;
    font-size: 1rem;
    border: 0;
    border-radius: 0;
}

.form-control--gray::placeholder {
    color: rgba(0, 0, 0, 0.5);
}

.form-control,
.form-control:focus,
.form-select,
.form-select:focus {
    border-color: #f6f6f6;
}

.form-control--gray,
.form-control--gray:focus,
.form-select--gray,
.form-select--gray:focus {
    background-color: #f6f6f6;
}

.form-control:focus,
.form-select:focus {
    box-shadow: 0 0 0 0.25rem rgba(0 0 0 / 10%);
}

.form-check {
    padding-left: 2.5em;
    font-size: 0.875em;
}

.form-check a {
    text-decoration: underline;
    color: inherit;
}

.form-check a:hover {
    text-decoration: none;
}

.form-check .form-check-input {
    width: 1.5em;
    height: 1.5em;
    margin-left: -2.5em;
    margin-top: 0;
    border-width: 2px;
    border-color: #ededed;
    background-color: #fff;
}

.form-check .form-check-input[type='checkbox'] {
    border-radius: 0.25rem;
}

.form-check .form-check-input:focus {
    box-shadow: 0 0 0 0.25rem rgba(0 0 0 / 10%);
}

.form-check .form-check-input:checked {
    border-color: #ca9b61;
    background-color: #ca9b61;
}

/*
    Titles
*/

.icon-title {
    display: flex;
    margin-bottom: 1rem;
    text-transform: uppercase;
    font-size: 0.8125rem;
}

.icon-title__inner {
    display: flex;
    overflow: hidden;
    align-items: center;
    padding-left: 1rem;
    background: linear-gradient(to bottom, #8da5f9 0%, #6968eb 100%);
    box-shadow: 0 0 1rem #8aa0f8;
    border-radius: 0 0.75rem 0.75rem 0;
}

.icon-title__inner,
a.icon-title__inner:hover {
    color: #fff;
}

.icon-title__icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 2.75rem;
    height: 2.25rem;
    margin-left: 1rem;
    background: #14092b;
}

.icon-title__icon svg {
    width: 1.5rem;
    height: 1.5rem;
    fill: #fff;
}

.icon-title--end {
    justify-content: flex-end;
}

.icon-title--end .icon-title__inner {
    padding-left: 0;
    padding-right: 1rem;
    border-radius: 0.75rem 0 0 0.75rem;
}

.icon-title--end .icon-title__icon {
    margin-left: 0;
    margin-right: 1rem;
    order: -1;
}

.section-title {
    font-size: 1.625rem;
    text-transform: uppercase;
    font-weight: 700;
    color: #14092b;
}

.article-title {
    font-size: 1.25rem;
    text-transform: uppercase;
    font-weight: 700;
    color: #14092b;
}

.block-title {
    font-size: 1rem;
    text-transform: uppercase;
    font-weight: 700;
    color: #14092b;
}

/*
    Lists
*/

.list-social {
    display: flex;
    flex-wrap: nowrap;
    gap: 0.25rem;
    padding: 0;
    list-style-type: none;
}

.list-social li a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 2.25rem;
    height: 2.25rem;
    min-height: auto;
    background: #14092b;
    border-radius: 0.75rem;
}

.list-social li a svg {
    width: 1.25rem;
    height: 1.25rem;
    fill: #fff;
}

aside.d-md-block article.d-xl-flex:nth-child(1) {
  margin-bottom: 2rem !important;
  height: 3.25rem;
}

aside.d-md-block article.d-xl-flex > ul.list-social {
  gap: .5rem;
}
aside.d-md-block article.d-xl-flex > ul.list-social li a {
    width: 3rem;
    height: 3rem;
}
aside.d-md-block article.d-xl-flex > ul.list-social li a svg {
    width: 2rem;
    height: 2rem;
}

.list-social li a:hover {
    background: #ddd;
}

.list-social--light li a {
    background-color: rgba(255, 255, 255, 0.5);
}

.list-social--light li a:hover {
    background-color: rgba(255, 255, 255, 0.7);
}

.list-links {
    display: flex;
    flex-direction: column;
    padding: 0;
    gap: 0.25rem;
    list-style-type: none;
}

.list-links a {
    display: block;
    color: #959595;
}

.list-links a:hover,
.list-links li.active > a {
    text-decoration: underline;
    color: #2e2e2e;
}

.list-links li.active > a {
    font-weight: 600;
}

/*
    Tags
*/

.tags {
    display: flex;
    align-items: center;
    color: #14092b;
}

.tags > strong {
    display: block;
    margin-right: 1rem;
    font-size: 0.875rem;
}

.tags ul {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin: 0;
    padding: 0;
    list-style-type: none;
}

.tags ul a {
    display: block;
    padding: 0.125rem 0.5rem;
    font-size: 0.75rem;
    text-transform: uppercase;
    font-weight: 600;
    color: #fff;
    background: #5450d3;
}

.tags ul a:hover {
    background: #14092b;
}

.tags--secondary ul a {
    color: #9e9e9e;
    background: #f0f0f0;
}

.tags--secondary ul a:hover {
    color: #fff;
}

/*
    Rating
*/

.rating {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    gap: 0.25rem;
}

.rating span {
    display: block;
    text-transform: uppercase;
    margin-right: 0.5rem;
    font-weight: 600;
    font-size: 1rem;
    color: #14092b;
}

.rating svg {
    display: block;
    width: 1.125rem;
    height: 1.125rem;
    fill: #fff;
    stroke-width: 0.125rem;
    stroke: #6561f1;
}

.rating svg.active {
    fill: #6561f1;
    stroke-width: 0;
}
.rating svg:hover {
    fill: #8884f3;
}

.rating__input,
.rating__icons {
    position: relative;
    display: flex;
    align-items: center;
}

.rating__icons {
    position: absolute;
    justify-content: space-between;
    z-index: -1;
    top: 0;
    left: 0;
    width: 100%;
}

.rating input {
    width: 1.375rem;
    height: 1.125rem;
    opacity: 0;
    cursor: pointer;
}

.rating input:nth-of-type(1):hover ~ .rating__icons svg:nth-of-type(1),
.rating input:nth-of-type(2):hover ~ .rating__icons svg:nth-of-type(-n + 2),
.rating input:nth-of-type(3):hover ~ .rating__icons svg:nth-of-type(-n + 3),
.rating input:nth-of-type(4):hover ~ .rating__icons svg:nth-of-type(-n + 4),
.rating input:nth-of-type(5):hover ~ .rating__icons svg:nth-of-type(-n + 5),
.rating input:nth-of-type(1):checked ~ .rating__icons svg:nth-of-type(1),
.rating input:nth-of-type(2):checked ~ .rating__icons svg:nth-of-type(-n + 2),
.rating input:nth-of-type(3):checked ~ .rating__icons svg:nth-of-type(-n + 3),
.rating input:nth-of-type(4):checked ~ .rating__icons svg:nth-of-type(-n + 4),
.rating input:nth-of-type(5):checked ~ .rating__icons svg:nth-of-type(-n + 5) {
    fill: #6561f1;
    stroke-width: 0;
}

.rating__input:hover svg {
    opacity: 0.5;
}

.rating input:nth-of-type(1):hover ~ .rating__icons svg:nth-of-type(1),
.rating input:nth-of-type(2):hover ~ .rating__icons svg:nth-of-type(-n + 2),
.rating input:nth-of-type(3):hover ~ .rating__icons svg:nth-of-type(-n + 3),
.rating input:nth-of-type(4):hover ~ .rating__icons svg:nth-of-type(-n + 4),
.rating input:nth-of-type(5):hover ~ .rating__icons svg:nth-of-type(-n + 5) {
    opacity: 1;
}

/*
    Badges
*/

.badge {
    padding: 0.25rem 0.5rem;
    text-transform: uppercase;
    font-size: 0.625rem;
    color: #14092b;
    background: #fff;
    border-radius: 0;
}

/*
    Video
*/

.video {
    position: relative;
}

.video:after {
    display: block;
    content: '';
    padding-bottom: 56.25%;
}

.video img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    aspect-ratio: 168/95;
}

.video span {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 6rem;
    height: 3.75rem;
    background: rgba(0, 0, 0, 0.5);
    border-radius: 0.75rem;
    transform: translate(-50%, -50%);
    transition: all 0.3s;
}

.video span:after {
    position: absolute;
    content: '';
    top: 50%;
    left: 50%;
    border-top: 0.75rem solid transparent;
    border-bottom: 0.75rem solid transparent;
    border-left: 1.5rem solid #fff;
    transform: translate(-50%, -50%);
}

/*
    Icons
*/

.icon-more {
    position: relative;
    display: flex;
    width: 1.5rem;
    height: 1.5rem;
    background: #b3b0bb;
    border-radius: 100%;
}

.icon-more:after {
    position: absolute;
    content: '';
    top: 50%;
    left: 50%;
    margin-left: 0.125rem;
    border-top: 0.375rem solid transparent;
    border-bottom: 0.375rem solid transparent;
    border-left: 0.5rem solid #fff;
    transform: translate(-50%, -50%);
}

/*
    Pagination
*/

.pagination {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 0.5rem;
    font-weight: 600;
}

.pagination a,
.pagination span {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 2.5rem;
    height: 2.5rem;
    color: #6d6d6d;
    background: #d3d3d3;
    border-radius: 0.5rem;
}

.pagination a:hover {
    color: #fff;
    background-color: #14092b;
}

.pagination a.active, 
.pagination .active a, 
.pagination span {
    color: #fff !important;
    background: #6561f1 !important;
}

/*
    Date
*/

.date {
    display: flex;
    align-items: center;
    font-weight: 600;
    margin-right: 2rem;
    color: #14092b;
}

.date svg {
    display: block;
    width: 1.375rem;
    height: 1.375rem;
    margin-right: 0.5rem;
    fill: #5450d3;
}

/* GLOBALS
================================================== */

.bg--gradient-primary {
    position: relative;
    background: linear-gradient(to bottom, #6968eb 0%, #8da5f9 100%);
    box-shadow: 0 0 1rem rgba(0, 0, 0, 0.3);
}

.primary-wave {
    position: relative;
    z-index: 2;
    display: block;
    width: 100%;
    margin-bottom: -1px;
}

.fill--twitter {
    fill: #7bc4f6 !important;
}

.fill--primary {
    fill: #6561f1 !important;
}

.c--dark {
    color: #14092b;
}

.maw--40 {
    max-width: 40rem;
}

.maw--53 {
    max-width: 53rem;
}

.maw--75 {
    max-width: 75rem;
}

.maw--88 {
    max-width: 88rem;
}

/* RESPONSIVE
================================================== */

/*
	XS
*/

@media screen and (max-width: 575px) {
    .icon-title {
        margin-left: -0.75rem;
    }

    .icon-title--end {
        margin-right: -0.75rem;
    }
}

/*
	SM and down
*/

@media screen and (max-width: 767px) {
}

/*
	MD and down
*/

@media screen and (max-width: 991px) {
}

/*
	LG and down
*/

@media screen and (max-width: 1199px) {
}

/*
	LG and up
*/

@media screen and (min-width: 992px) {
}

/*
    XL and up
*/

@media screen and (min-width: 1200px) {
    body {
        font-size: 1.125rem;
    }

    .footer {
        font-size: 1.125rem;
    }

    .footer__links {
        font-size: 1.375rem;
    }

    .media-box .video {
        margin-bottom: 0.75rem;
    }

    .media-box:not(.media-box--card) figure {
        margin-bottom: 0.75rem;
        transition: all 0.3s;
    }

    .media-box__title {
        font-size: 1.125rem;
    }

    .media-box--card {
        font-size: 1rem;
        transition: all 0.3s;
    }

    .media-box--card .media-box__content__inner {
        padding: 1rem;
    }

    .media-box--card:hover {
        box-shadow: 0 0 1rem rgba(0, 0, 0, 0.3);
    }

    .media-box:not(.media-box--card):hover figure {
        box-shadow: 0 0 1rem rgba(0, 0, 0, 0.3);
    }

    .media-box--card:hover .icon-more {
        background: #14092b;
    }

    .member-box__title {
        font-size: 1.5rem;
    }

    .member-box__like {
        font-size: 1rem;
    }

    .member-box__like svg {
        width: 1.5rem;
        height: 1.5rem;
        margin-right: 0.25rem;
    }

    .member-box:hover figure {
        box-shadow: 0 0 1rem rgba(0, 0, 0, 0.3);
    }

    .post-box {
        font-size: 1rem;
    }

    .post-box__content {
        padding: 1rem;
    }

    .post-box__content > p {
        margin-bottom: 1rem;
    }

    .post-box__title {
        font-size: 1.125rem;
    }

    .post-box time,
    .post-box__tags {
        font-size: 0.875rem;
    }

    .post-box:hover {
        box-shadow: 0 0.25rem 0.5rem rgba(0, 0, 0, 0.2);
    }

    .video:hover span {
        background: rgba(0, 0, 0, 0.8);
        transform: translate(-50%, -50%) scale(1.1);
    }

    .tags ul {
        gap: 1rem;
    }

    .tags ul a {
        padding: 0.25rem 1rem;
        font-size: 0.9375rem;
    }

    .section-title {
        font-size: 2.25rem;
    }

    .icon-title {
        margin-bottom: 2rem;
        font-size: 1.25rem;
    }

    .icon-title__icon {
        width: 4rem;
        height: 3.25rem;
    }

    .icon-title__icon svg {
        width: 2.25rem;
        height: 2.25rem;
    }

    .badge {
        padding: 0.5rem 1rem;
        font-size: 0.9375rem;
    }

    .btn {
        font-size: 1.5rem;
    }

    .btn-xs {
        font-size: 1.125rem;
    }

    .btn-sm {
        font-size: 1rem;
    }

    .btn svg {
        width: 1.25rem;
        height: 1.25rem;
    }

    .rating--lg svg,
    .rating--lg input {
        width: 1.5rem;
        height: 1.5rem;
    }

    .rating--lg input {
        width: 1.75rem;
    }
}

/*
    XXL and up
*/

@media screen and (min-width: 1400px) {
    .header {
        height: 6rem;
        padding: 0 3.5rem;
    }

    .header__logo {
        height: 2.5rem;
    }

    .main-menu > ul > li > a {
        display: flex;
        align-items: center;
        height: 7.5rem;
    }

    .color-mode-btn {
        width: 3rem;
        height: 3rem;
    }

    .color-mode-btn svg {
        width: 2rem;
        height: 2rem;
    }

    .panel {
        padding: 3rem 4rem;
    }

    .info-panel {
        display: flex;
    }

    .info-panel__header {
        width: 15rem;
    }

    .info-panel__body {
        flex-grow: 1;
    }
}

/*
	XXXL and up
*/

@media screen and (min-width: 1860px) {
    .container {
        max-width: 1820px;
    }

    .member-box__footer {
        display: flex;
    }

    .info-panel__body {
        padding: 1.5rem 3rem;
        flex-grow: 1;
    }
}

/*
    Dark Mode
*/

.dark .top-nav {
    opacity: .8;
}

.dark .header__logo img {
    display: none;
}

.dark .header__logo img + img {
    display: block;
}

.dark body,
.dark .pagination a:hover {
    background: #14092b;
}

.dark .mobile-menu-btn span,
.dark .color-mode-btn {
    background-color: #fff;
}

.dark .rating svg,
.dark .color-mode-btn svg {
    fill: #14092b;
}

.dark .header,
.dark .offcanvas--white,
.dark .panel,
.dark .media-box--card,
.dark .post-box,
.dark .footer .form-control {
    background: #2a223d;
}

.dark .bg-white {
    background-color: #2a223d !important;
}

.dark .panel--gray {
    background: #332c44;
}

.dark .offcanvas--white ul a,
.dark a:hover,
.dark .c--dark,
.dark .article-title,
.dark .list-links a:hover,
.dark .list-links li.active > a,
.dark .media-box__title,
.dark .section-title,
.dark .post-box__title,
.dark .post-box time,
.dark .post-box__tags,
.dark .main-menu li a,
.dark .rating span,
.dark .date,
.dark .tags,
.dark .form-label,
.dark .member-box__like,
.dark .tags ul a,
.dark .block-title,
.dark .btn--gray,
.dark .btn--gray:focus,
.dark .btn-primary,
.dark .btn-primary:focus,
.dark .comment__header,
.dark .top-nav__menu a,
.dark .member-box:hover,
.dark .pagination a,
.dark .pagination a:hover,
.dark .icon-title__inner,
.dark a.icon-title__inner:hover {
    color: #fff;
}

.dark .icon-title__icon {
    background: #fff;
}

.dark .icon-title__icon svg {
    fill: #14092b;
}

.dark body,
.dark .list-links a,
.dark .media-box--card,
.dark .post-box,
.dark .member-box {
    color: #ccc;
}

.dark .media-box--card:hover .icon-more {
    background-color: #827a98;
}

.dark .form-control--gray,
.dark .form-control--gray:focus,
.dark .form-select--gray,
.dark .form-select--gray:focus,
.dark .form-control,
.dark .form-control:focus,
.dark .form-select,
.dark .form-select:focus {
    color: #fff;
    background-color: #14092b;
}

.dark .form-control::placeholder {
    color: rgba(255, 255, 255, 0.5);
}

.dark .icon-title__inner {
    box-shadow: 0 0 1rem #3d497a;
}

.dark .info-panel,
.dark .pagination a {
    background-color: #413b50;
}

.dark .btn-dark,
.dark .btn-dark:focus,
.dark .btn--gray,
.dark .btn--gray:focus {
    border-color: #463e58;
    background-color: #463e58;
}

.dark .btn-dark:hover,
.dark .btn--gray:hover,
.dark .btn--gray:first-child:active,
.dark .btn--gray:hover:active,
.dark .btn--gray:focus:active,
.dark .btn--gray.active {
    border-color: #6c6089;
    background-color: #6c6089;
}

.dark .media-box:not(.media-box--card):hover figure {
    box-shadow: 0 0 1rem rgba(255, 255, 255, 0.6);
}

.dark a,
.dark .post-box__tags > span,
.dark .main-menu > ul > li:hover > a,
.dark .main-menu > ul > li.active > a,
.dark .offcanvas--white .offcanvas-body > ul li.active > a {
    color: #9d9bf2;
}

.dark .post-box time svg,
.dark .rating svg.active,
.dark .date svg,
.dark .btn-like svg,
.dark .member-box__like svg {
    fill: #9d9bf2;
}

.dark .rating svg {
    stroke: #9d9bf2;
}

.dark .btn-primary,
.dark .btn-primary:focus,
.dark .tags ul a,
.dark .main-menu ul ul,
.dark .offcanvas--primary,
.dark .main-menu .megamenu {
    background-color: #37388d;

}

.dark .main-menu .has-megamenu a:after {
    border-bottom-color: #9d9bf2;
}

.dark .btn-primary,
.dark .btn-primary:focus {
    border-color: #9d9bf2;
}

.dark .btn-primary:hover,
.dark .tags ul a:hover {
    background-color: #615ec9;
}

.dark .btn-primary:hover {
    border-color: #615ec9;
}
.gallery-main-image img {
  width: 100%;
}
.aspect_300_420 {
  aspect-ratio: 15/21;
}
.col-12-force {
    width: 100% !important;
    flex: 0 0 auto;
}
.hover-lead .lead {
    display: none;
    padding: 1.2em;
    background: rgba(0,0,0,.23);
    text-shadow: 2px 2px rgba(0,0,0,.8);

}
.hover-lead:hover .lead {
    display: block;
}

.dark p a {
  text-decoration: underline;
}