.keeda-side-menu {
   width: 332px !important;
   position: fixed;
   z-index: 99999;
   top: 0;
   background: var(--bg-color);
   height: 100%;
   box-shadow: 2px 0 4px 0 rgba(0, 0, 0, .1);
   overflow-y: auto;
   padding-bottom: 40px;
   transform: translateX(-332px);
   transition: all .2s ease-in-out;
   left: 0
}

.keeda-side-menu:hover {
   overflow-y: auto
}

.keeda-side-menu.open {
   width: 332px !important;
   display: block;
   transform: translateX(0)
}

.global-menu,
.popular {
   padding-right: 8px;
   display: block
}

.favorite-choices {
   padding-bottom: 16px;
   display: none;
   display: block;
   border-top: solid 1px #e5e5e5
}

.global-menu .fav-header,
.links .fav-header,
.popular .fav-header {
   padding: 8px 16px;
   height: auto
}

.favorite-choices .fav-header .title,
.favorites .fav-header .title,
.favorites-search .search-container .title,
.global-menu .fav-header .title,
.links .fav-header .title,
.popular .fav-header .title {
   font-size: 14px;
   font-weight: 500;
   color: var(--text-color--alpha);
   text-align: left;
   height: 19px;
   display: block;
   background-size: 19px;
   line-height: 21px
}

.global-menu .fav-header .title,
.links .fav-header .title {
   font-weight: 600;
   color: var(--primary-color--alpha)
}

.fav-header.links {
   padding-top: 10px;
   height: 41px
}

.fav-header.popular {
   margin-top: 10px
}

.favorite-choices .favorites-choice-name,
.favorites-search .favorites-choice-name,
.links .favorites-choice-name,
.popular .favorites-choice-name {
   padding-left: 0;
   color: var(--text-color--beta);
   font-size: 14px;
   width: auto;
   display: inline-block;
   line-height: 20px;
   text-decoration: none
}

.global-menu .list .nav1 {
   list-style-type: none;
   position: relative;
   display: block;
   line-height: 18px
}

.global-menu .list .nav1 .nav-expand::before {
   content: "";
   position: absolute;
   width: 12px;
   height: 7px;
   background-repeat: no-repeat;
   background-size: cover;
   vertical-align: middle;
   right: 8px;
   top: 16px;
   background-image: url('/assets/img/down_arrow.svg')
}

.global-menu .list .nav1 .nav-expand.arrow-up::before {
   transform: rotate(180deg)
}

:root[data-theme=dark] .global-menu .list .nav1 .nav-expand::before {
   filter: brightness(0) saturate(100%) invert(66%) sepia(0%) saturate(1%) hue-rotate(338deg) brightness(92%) contrast(90%)
}

.global-menu .fav-header .title.nav-expand {
   width: 100%;
   background-position: right;
   background-repeat: no-repeat;
   background-image: url('/assets/img/arrow-down.svg');
   cursor: pointer
}

.global-menu .list .nav1 .nav-expand {
   width: 100%;
   background-position: right;
   background-repeat: no-repeat;
   cursor: pointer;
   padding: 8px 16px;
   color: var(--text-color--alpha);
   font-size: 14px;
   line-height: 21px;
   font-weight: 500
}

.global-menu .list .nav1 a {
   color: var(--text-color--alpha);
   text-decoration: none;
   font-size: 14px;
   line-height: 21px;
   cursor: pointer;
   display: inline-block;
   padding: 12px 0
}

.global-menu .list .nav1 .nav2 a,
.global-wiki-menu .list .nav2 a {
   padding: 8px 20px;
   color: var(--text-color--alpha);
   text-decoration: none;
   font-size: 14px;
   line-height: 21px;
   display: block;
   position: relative
}

.global-wiki-menu .list .nav2 a {
   padding-left: 16px
}

.global-wiki-menu .list .nav2:first-child a {
   font-weight: 600
}

.padder {
   width: 100%;
   height: 50px
}

.fav-header.language:hover,
.global-menu .fav-header:hover,
.global-menu .list .nav1 .nav-expand:hover,
.global-menu .list .nav1 .nav2 .nav-expand:hover,
.global-menu .list .nav1 .nav2 a:hover,
.global-menu .list .nav1 a:hover,
.global-wiki-menu .list .nav2 a:hover {
   background-color: var(--hover-bg--alpha)
}

.global-menu .list .nav1 .submenu,
.global-menu .list .nav1 .submenu .sub-submenu {
   display: none;
   margin-top: 0;
   max-height: none !important
}

.global-menu .list .nav1 .submenu.open {
   display: block
}

.global-menu .list.open {
   display: block;
}

.global-menu .list {
   display: none
}

.global-menu .list .nav1 .submenu .nav2 {
   position: relative
}

.favorites-search {
   background: inherit;
   padding: 12px 0 4px
}

.favorites-search.active {
   display: block
}

.favorites-search .search-container {
   margin: 0 16px;
   position: relative;
   background-color: inherit
}

.favorites-search .title {
   margin-bottom: 8px
}

.favorites-search input {
   font-size: 14px;
   font-style: normal;
   color: #2d2d2d;
   width: 100%;
   border-radius: 40px;
   border: none;
   padding: 10px 12px;
   outline: 0;
   display: block;
   background: #fff;
   border: 1px solid #2d2d2d
}

.favorites-search input::placeholder {
   font-size: 12px;
   font-weight: 400;
   line-height: 18px;
   color: #2d2d2d
}

.favorites-search .search-results {
   background: inherit;
   border-bottom-left-radius: 5px;
   border-bottom-right-radius: 5px;
   margin-top: 10px;
   width: 100%;
   z-index: 1;
   position: relative
}

.favorites-search .search-dismiss {
   position: absolute;
   float: right;
   color: #999;
   cursor: pointer;
   font-weight: 400;
   display: none;
   top: 14px;
   right: 14px;
   width: 18px;
   height: 18px;
   background: url('/assets/img/cross.svg') no-repeat;
   background-size: 18px 18px
}

.favorites-search .search-dismiss.active {
   display: block
}

.favorites-search .favorites-choice-block {
   width: 100%;
   padding: 8px 16px
}

.favorites-select-overlay {
   background: #000;
   opacity: .5;
   height: 100%;
   position: fixed;
   width: 220px;
   display: none
}

#top-brand-bar {
   width: 98%;
   margin-left: 1%
}

.no-result-message {
   color: blue;
   font-size: 12px;
   margin: 0 auto;
   width: 50%;
   text-align: center
}

.language-choice-name,
.language-choice-name a {
   height: 40px;
   padding: 8px 16px;
   color: #555;
   cursor: pointer;
   padding-left: 42px
}

.language-choice-name a {
   padding-left: 0 !important;
   text-decoration: none
}

.links .language .title {
   background-image: url('/assets/img/language.svg');
   background-repeat: no-repeat;
   text-transform: capitalize;
   font-size: 14px;
   font-weight: 500;
   padding-left: 27px
}

.links .language .title a {
   text-decoration: none;
   color: var(--text-color--alpha)
}

.links .language {
   background-image: url("/assets/img/arrow-down.svg");
   background-position-y: center;
   background-position-x: right;
   background-repeat: no-repeat;
   background-size: 16px
}

.links .language.opened {
   background-image: url("/assets/img/arrow-up.svg")
}

.language-choice-name.selected {
   background-image: url("/assets/img/language_tick.svg");
   background-repeat: no-repeat;
   background-position: 16px 12px;
   background-size: 16px
}

.lang-container {
   display: none
}

.lang-container.active {
   display: block
}

.language.links {
   cursor: pointer
}

.lang-section {
   padding-right: 4px
}

.fav-header.language {
   padding-right: 3px
}

.mobile-overlay.active {
   display: block
}

.mobile-overlay {
   width: 100%;
   height: 100%;
   position: fixed;
   background: #000;
   opacity: .5;
   display: none;
   left: 0;
   top: 0;
   z-index: 2000
}

.favorites-choice-block.manage-notifications {
   padding: 8px 16px
}

.manage-notifications .favorites-choice-name {
   cursor: pointer;
   display: flex;
   gap: 6px;
   align-items: center;
   text-decoration: none
}

.manage-notifications .favorites-choice-name .bell-icon {
   display: flex;
   width: 20px
}

.manage-notifications .favorites-choice-name span {
   white-space: nowrap;
   color: var(--text-color--alpha);
   font-size: 14px;
   line-height: 21px;
   font-weight: 500;
   text-decoration: none
}

.important-links-block {
   margin: 4px 12px;
   display: grid;
   grid-template-columns: repeat(2, 1fr);
   padding: 12px;
   border: 1px solid var(--border-color--alpha);
   gap: 16px;
   border-radius: 4px
}

.keeda-side-menu #keeda-profile-container {
   padding: 8px 16px;
   display: block !important;
   background: linear-gradient(91.41deg, #fef8f9 0, #fff8fc 100%) !important;
   width: 100%;
   position: relative;
   float: unset;
   margin: 0 auto
}

.keeda-side-menu #keeda-profile-container .toggle {
   margin-left: 0 !important;
   height: 35px;
   width: 36px
}

.keeda-side-menu #keeda-profile-container .greeting {
   position: relative;
   margin-left: 46px;
   top: 4px;
   font-size: 13px;
   font-weight: 500;
   line-height: 19px
}

.keeda-side-menu #keeda-profile-container .three-dots {
   top: 10px;
   left: 289px
}

.keeda-side-menu #keeda-profile-container .three-dots img {
   width: 12px;
   height: 7px
}

.side-menu-categories {
   display: grid;
   grid-template-columns: repeat(4, 1fr);
   display: grid;
   grid-template-columns: repeat(4, 1fr);
   padding: 8px 4px;
   margin: 4px 12px;
   border: 1px solid var(--border-color--alpha);
   border-radius: 4px;
   gap: 8px
}

.side-menu-categories .side-menu-category-item {
   height: 72px;
   display: flex;
   flex-direction: column;
   gap: 8px;
   text-decoration: none;
   align-items: center;
   justify-content: flex-start;
   background-clip: padding-box;
   border: 1px solid transparent;
   position: relative;
   border-radius: 12px;
   padding: 2px;
   background: inherit;
   cursor: pointer
}

.side-menu-category-item .item-image {
   width: 22px;
   height: 22px
}

.side-menu-category-item .item-image.more-item-image {
   width: 14px
}

:root[data-theme=dark] .side-menu-category-item .more-item-image img {
   filter: brightness(0) saturate(100%) invert(66%) sepia(0%) saturate(1%) hue-rotate(338deg) brightness(92%) contrast(90%)
}

.side-menu-category-item .item-image img {
   width: 100%;
   height: auto;
   object-fit: cover
}

.side-menu-category-item .item-content .title {
   font-size: 12px;
   font-weight: 500;
   line-height: 18px;
   color: var(--text-color--beta);
   text-align: center
}

.side-menu-header {
   display: flex;
   padding: 12px 16px;
   align-items: center;
   justify-content: space-between
}

.side-menu-header .side-menu-header-left {
   display: flex;
   gap: 12px;
   align-items: center
}

.side-menu-header .side-menu-close-btn {
   cursor: pointer
}

@media (max-width: 1024px) {
   .language-choice-name.selected {
      background-position: 16px 8px
   }

   .language-choice-name,
   .language-choice-name a {
      color: #555;
      font-size: 14px
   }

   .write-an-article {
      width: 100px;
      font-size: 14px;
      position: relative;
      text-transform: uppercase;
      padding-right: 10px;
      color: #34495e;
      cursor: pointer;
      text-align: right;
      margin: 8px auto;
      line-height: 1;
      margin-bottom: 16px
   }
}

.logged-out .login-cta {
   display: block;
   padding: 10px 7px;
   color: #fff;
   background-color: #22149c;
   border-radius: 20px;
   text-decoration: none;
   text-align: center;
   font-weight: 700
}

.keeda-side-menu .sidebar-app-download {
   display: block;
   margin: 6px 15px;
   color: var(--text-color--beta);
   text-decoration: none;
   text-align: center;
   border-radius: 3px;
   background: var(--surface-color);
   padding: 10px 0;
   font-size: 14px;
   height: 39px;
   font-weight: 700;
   border: solid 1px var(--border-color--beta);
   clear: both;
   width: 190px;
   margin: 12px auto
}

.keeda-side-menu .sidebar-app-download img {
   height: 22px;
   display: block;
   margin-left: 6px;
   margin-top: -3px;
   float: left;
   width: 22px
}

.sidebar-app-download .span {
   display: block;
   margin-left: 4px;
   margin-left: 5px;
   float: left
}

#keeda-profile-container .toggle,
#keeda-profile-container-secondary .toggle {
   background-size: cover;
   position: relative;
   cursor: pointer;
   height: 24px;
   width: 24px;
   border-radius: 50%
}

.sidebar-separator {
   height: 1px;
   width: 100%;
   background: #e5e5e5
}

.mobile-overlay-profile-menu {
   width: 100%;
   height: 100%;
   position: fixed;
   background: #000;
   opacity: .5;
   display: none;
   left: 0;
   top: 0;
   z-index: 2000
}

.popular .list {
   min-height: 340px
}

.popular-menu-placeholder {
   display: flex;
   flex-direction: column;
   height: 340px;
   width: 100%;
   gap: 16px;
   padding: 16px;
   align-items: center;
   justify-content: center
}

.popular-menu-placeholder--item {
   flex: 1;
   width: 100%;
   overflow: hidden;
   background: #000;
   position: relative;
   animation: placeholderAnimation 1.5s linear infinite;
   background: #f6f7f8;
   background: linear-gradient(to right, #eee 2%, #ddd 18%, #eee 33%);
   background-size: 1300px
}

.global-menu .no-arrow {
   background-image: none !important
}

@keyframes placeholderAnimation {
   0% {
      background-position: -650px 0
   }

   100% {
      background-position: 650px 0
   }
}