/* ------------------------------------------------
 Author: ArtStyles (Art)
 
 Template Name: ARTEM.
 version: 1.0.4
------------------------------------------------ */
/* -----------------------------------------------------------------
    - General Styles
----------------------------------------------------------------- */
body {
  background-color: #202020;
  color: #fff;
}

pre {
  background-color: rgba(255, 255, 255, 0.08);
  color: inherit;
}

hr {
  border-color: #4d4d4d;
}

select,
.inputText,
.textarea,
input[type=password] {
  background-color: #202020;
  border-bottom: 1px solid rgba(255, 255, 255, 0.2);
  color: #fff;
}

select:focus,
.inputText:focus,
.textarea:focus,
input[type=password]:focus {
  border-bottom: 1px solid #fff;
}

.inputText--fill {
  border: 0;
}

.wp-block-search__input {
  background-color: rgba(255, 255, 255, 0.08);
  color: #fff;
}

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
  transition: background-color 5000s ease-in-out 0s;
  -webkit-text-fill-color: #fff !important;
}

.label {
  color: #fff;
}

.wp-block-code {
  border: 1px solid hsl(0deg 0% 10%);
}

.wp-block-table tbody td {
  border-color: #4d4d4d;
}
.wp-block-table.is-style-stripes tbody tr:nth-child(odd) {
  background-color: rgba(255, 255, 255, 0.08);
}
.wp-block-table.is-style-stripes {
  border-bottom: 1px solid #4d4d4d;
}

.btn-link,
.page-numbers,
.post-page-numbers {
  color: #fff;
}

.page-nav .page-numbers.current,
.single .entry-content .page-nav .post-page-numbers.current {
  color: #110f10;
  background-color: #fff;
  box-shadow: 0 0 0 0px #fff;
}
.page-numbers:hover .circle,
.post-page-numbers:hover .circle {
  box-shadow: 0 0 0 2px #fff;
}

.btn,
input[type=submit] {
  background-color: #fff;
  color: #110f10;
}
.wp-block-buttons > .wp-block-button {
  margin: 0 !important;
}
.btn::before,
.wp-block-button__link::before {
  background-color: rgba(17, 15, 16, 0.2);
}
.btn:hover,
.wp-block-button__link::before {
  color: #110f10;
}
.btn--white {
  background-color: #fff;
  color: #110f10;
}

.btn-link {
  color: #fff;
}
.btn-link:hover .circle {
  box-shadow: 0 0 0 2px #fff;
}
.btn-link:hover .circle--white {
  box-shadow: 0 0 0 2px #fff;
}

.wp-block-button__link {
  background-color: #fff;
  color: #110f10 !important;
}
.wp-block-button.is-style-outline > .wp-block-button__link {
	border: 2px solid #fff;
}
.wp-block-button.is-style-outline > .wp-block-button__link:hover {
  color: #110f10 !important;
	background-color: #fff;
}

.circle {
  color: #110f10;
  background-color: #fff;
  box-shadow: 0 0 0 0px #fff;
}
.circle--white {
  color: #110f10;
  background-color: #fff;
  box-shadow: 0 0 0 0px #fff;
}

.dark-mask::before {
  background-color: #fff;
}

table thead th,
.table thead th {
  color: rgba(255, 255, 255, 0.5);
}
table td,
table th,
.table td {
  border-top: 1px solid rgba(255, 255, 255, 0.2);
}
.table span {
  color: rgba(255, 255, 255, 0.5);
}
@media only screen and (max-width: 768px) {
  .table td:before {
    color: rgba(255, 255, 255, 0.5);
  }
}

@media only screen and (max-width: 768px) {
  .flex-table {
    border-top: 1px solid rgba(255, 255, 255, 0.2);
  }
}
.flex-table__thead {
  border-bottom: 1px solid rgba(255, 255, 255, 0.2);
}
.flex-table__tr {
  border-bottom: 1px solid rgba(255, 255, 255, 0.2);
}
.flex-table__th {
  color: rgba(255, 255, 255, 0.5);
}
@media only screen and (max-width: 768px) {
  .flex-table__td:before {
    color: rgba(255, 255, 255, 0.5);
  }
}

.separation {
  border-top: 1px solid rgba(255, 255, 255, 0.1);
}

/* -----------------------------------------------------------------
    - Typography
----------------------------------------------------------------- */
.title--overhead {
  color: rgba(255, 255, 255, 0.5);
}
.title--tail::before, .title--tail-black::before {
  background-color: rgba(255, 255, 255, 0.5);
}
.title--tail-black::before {
  background-color: #fff;
}

.wp-block-quote::before,
blockquote::before,
.wp-block-coblocks-click-to-tweet::before,
.wp-block-pullquote blockquote::before,
.wp-block-quote.is-style-large::before,
.wp-block-quote.is-large::before,
blockquote.has-text-align-right::before,
.wp-block-quote.has-text-align-right::before {
  background-image: url(../images/icon-quote-white.svg);
}
blockquote cite a,
blockquote cite a:hover,
.wp-block-quote cite,
.wp-block-quote footer,
.wp-block-pullquote__citation,
.wp-block-pullquote cite,
.wp-block-pullquote footer {
  color: rgba(255, 255, 255, 0.5);
}
blockquote cite::before,
.wp-block-quote cite::before,
.wp-block-quote footer::before {
  background-color: #fff;
}
.wp-block-pullquote.has-background blockquote::before {
  background-image: url(../images/icon-quote.svg);
}
.wp-block-pullquote.has-background cite,
.wp-block-pullquote.has-background footer {
  color: rgba(17, 15, 16, 0.5);
}

a {
  color: #fff;
}

.paragraph {
  color: rgba(255, 255, 255, 0.75);
}

.text-overlay {
  color: #202020;
}

.list-unstyled {
  color: #fff;
}

/* -----------------------------------------------------------------
    - Preloader
----------------------------------------------------------------- */
.loading {
  background-color: #110f10;
}
.loading::before {
  background-image: url(../images/logo_white.svg);
}
.loading .progress-bar {
  background-color: #110f10;
}

/* -----------------------------------------------------------------
    - Header
----------------------------------------------------------------- */
@media only screen and (max-width: 580px) {
  .navbar {
    background-color: #110f10;
    box-shadow: 0 4px 20px rgba(17, 15, 16, 0.2);
  }
}
@media only screen and (max-width: 580px) {
  .navbar-v2 .hamburger__inner::before,
  .navbar-v2 .hamburger__inner::after {
    background-color: #110f10;
  }
}
@media only screen and (min-width: 580px) {
  .navbar--white {
    color: #110f10;
  }
  .navbar--white .circle {
    color: #110f10;
    background-color: #fff;
    box-shadow: 0 0 0 0px #fff;
  }
  .navbar--white .circle:hover {
    box-shadow: 0 0 0 2px #fff;
  }
  .navbar--white .btn-link:hover .circle {
    box-shadow: 0 0 0 2px #fff;
  }
  .navbar--white .hamburger__inner::before,
  .navbar--white .hamburger__inner::after {
    background-color: #fff;
  }
}
@media only screen and (max-width: 580px) {
  .open .navbar {
    box-shadow: none;
  }
}
.navbar.sticky {
  background-color: #202020;
  height: 88px;
}

.hamburger__inner:before, .hamburger__inner:after {
  background-color: #fff;
}
.is-active .hamburger__inner {
  color: #fff;
}
.open .hamburger__inner:before, .open .hamburger__inner:after {
  background-color: #110f10!important;
}
.is-active .open .hamburger__inner {
  color: #110f10;
}

/* Horizontal menu */
.navbar-nav .nav-link {
  color: #fff;
}
.navbar-nav .active .nav-link,
.navbar-nav .nav-link:hover {
  color: var(--color-accent);
}



/* -----------------------------------------------------------------
    - Slider
----------------------------------------------------------------- */
.slider__case-details .item-details {
  background-color: #202020;
}

.slider-fullscreen::before {
  background-color: rgba(255, 255, 255, 0.1);
}

.swiper-control .swiper-button-prev--square,
.swiper-control .swiper-button-next--square {
  background-color: #202020;
}
.swiper-control .swiper-button-prev--square::after, .swiper-control .swiper-button-prev--square::before,
.swiper-control .swiper-button-next--square::after,
.swiper-control .swiper-button-next--square::before {
  background: #fff;
}
.swiper-control .swiper-button-prev--square:hover,
.swiper-control .swiper-button-next--square:hover {
  color: #110f10;
}

.slider-nav__arrow {
  fill: #fff;
}
.slider-nav__arrow--white {
  fill: #fff;
}
.slider-nav__path-progress--gray {
  stroke: #fff;
}
.slider-nav__path-progress--white {
  stroke: #fff;
}
.slider-nav__path--gray {
  stroke: rgba(255, 255, 255, 0.4);
}
.slider-nav__path--white {
  stroke: rgba(255, 255, 255, 0.2);
}
.slider-nav:hover .slider-nav__path--gray {
  opacity: 1;
  stroke: #fff;
  fill: #fff;
}
.slider-nav:hover .slider-nav__path--white {
  stroke: #fff;
  fill: #fff;
}
.slider-nav:hover .slider-nav__arrow {
  fill: #110f10;
}
.slider-nav:hover .slider-nav__arrow--white {
  fill: #110f10;
}

.swiper-pagination-bullet {
  background: rgba(255, 255, 255, 0.2);
}
.swiper-pagination-bullet-active {
  background: #fff;
}

.swiper-pagination--white .swiper-pagination-bullet {
  background: rgba(255, 255, 255, 0.2);
  box-shadow: 0 0 0 4px rgba(17, 15, 16, 0.3);
}
.swiper-pagination--white .swiper-pagination-bullet-active {
  background: white;
}

/* -----------------------------------------------------------------
    - Sections
----------------------------------------------------------------- */
.tail::before {
  background-color: #fff;
}

.overlay::before {
  background-color: rgba(17, 15, 16, 0.35);
}
.overlay--45::before {
  background-color: rgba(17, 15, 16, 0.45);
}
.overlay--80::before {
  background-color: rgba(17, 15, 16, 0.8);
}

.social--white .social__link {
  color: #110f10;
}
.social--white .social__link:hover {
  color: #110f10;
}
.social__link:hover {
  color: #fff;
}

.case-details .item-details__title {
  color: rgba(255, 255, 255, 0.5);
}

/* -----------------------------------------------------------------
    - Project
----------------------------------------------------------------- */
.onHover {
  background: linear-gradient(to top, rgba(0, 0, 0, 0.3) 0%, rgba(0, 0, 0, 0) 60%);
}
.onHover__details {
  color: #fff;
}

.projects-carousel .swiper-pagination-progressbar {
  background-color: rgba(255, 255, 255, 0.15);
}
.projects-carousel .swiper-pagination-progressbar-fill {
  background-color: #fff;
}

/* -----------------------------------------------------------------
    - Project Single
----------------------------------------------------------------- */
.header-fullscreen {
  background-color: #fff;
  color: #fff;
}
.header-fullscreen .title--overhead,
.header-fullscreen .item-details__title,
.header-fullscreen .btn-link {
  color: #fff;
}
.header-fullscreen .title--tail::before {
  background-color: #fff;
}

.num-article {
  color: rgba(255, 255, 255, 0.5);
}

.gallery-two .note {
  background-color: #110f10;
  color: #fff;
}

.page-nav {
  border-top: 1px solid rgba(255, 255, 255, 0.1);
}

/* -----------------------------------------------------------------
    - Menu
----------------------------------------------------------------- */
.menu {
  background: #fff;
}

.menu-list__item {
  color: #110f10;
}
.menu-list__item:hover, .menu-list__item:focus {
  color: #110f10;
}

.ef-background {
  background-color: #000;
}

.default-menu .logo__color  {
  color: #110f10;
}

/* Horizontal menu */
.navbar-expand-lg {
    background: #202020;
}

/* -----------------------------------------------------------------
    - WMML
----------------------------------------------------------------- */
.wpml-ls {
	background: #202020;
	border: 1px solid rgba(255,255,255,.3);
}
.navbar.sticky .wpml-ls {
    border: 1px solid rgba(255,255,255,.3);
}
.open .wpml-ls {
	background: #202020;
}
.wpml-ls-legacy-dropdown-click a.wpml-ls-item-toggle:after {
	color: #fff;	
}

/* -----------------------------------------------------------------
    - News
----------------------------------------------------------------- */
@media only screen and (min-width: 769px) {
  .filters__item.active .filters__link::before {
    background-color: #fff;
  }
  .filters__link::after {
    background-color: #fff;
  }
  .filters__link.active::before {
    background-color: #fff;
  }
}
@media only screen and (max-width: 768px) {
  .select {
    color: #110f10;
  }
  .select .placeholder {
    background-color: #fff;
  }
  .select .placeholder:hover {
    background: rgba(255, 255, 255, 0.05);
  }
  .select ul {
    background: #110f10;
    box-shadow: 0 10px 60px rgba(255, 255, 255, 0.1);
  }
  .select ul li {
    color: #fff;
  }
  .select ul li:hover {
    background: rgba(255, 255, 255, 0.05);
  }
}
.item-news .date::before {
  background-color: rgba(255, 255, 255, 0.5);
}

.item-news .date {
  color: rgba(255, 255, 255, 0.5);
}
.post-meta li a {
  color: rgba(255, 255, 255, 0.5);
}
.post-meta li a:hover {
  color: rgba(255, 255, 255, 1);
}
.post-tags a {
  color: rgba(255, 255, 255, 0.5);
  border: 1px solid rgba(255, 255, 255, 0.1);
}
.post-tags a:hover {
  color: #110f10;
  background-color: rgba(255, 255, 255, 1);
}

.hover-line {
  background-image: linear-gradient(to right, #fff 0%, #fff 100%);
}

.wp-caption-text,
.wp-block-image figcaption,
.wp-block-video figcaption,
.wp-block-gallery figcaption {
  color: rgba(255, 255, 255, 0.5);
}

.share-post::before {
  background-color: #fff;
}

/* Calendar
--------------------------------------------- */
table th#today,
table td#today,
.wp-calendar-table th#today,
.wp-calendar-table td#today {
  background: #fff;
  color: #110f10;
}
.wp-block-calendar .wp-calendar-table caption {
  color: #fff;
  text-align: center;
  caption-side: top;
}
.wp-block-calendar nav.wp-calendar-nav {
  padding-top: 0.75rem;
}
.wp-block-calendar th,
.wp-block-calendar tbody td {
  border: 1px solid #4d4d4d;
  border-left: 0;
  border-right: 0;
}

/* Comments
--------------------------------------------- */
.comment-metadata time {
  font-weight: 400;
  color: rgba(255, 255, 255, 0.5);
}
.comment-metadata time:hover {
  color: rgba(255, 255, 255, 1);
}
.comment-reply-link,
.comment-edit-link {
  font-weight: 400;
  color: rgba(255, 255, 255, 0.5);
}

/* -----------------------------------------------------------------
    - Sidebar
----------------------------------------------------------------- */
.blog-sidebar {
  background-color: #110f10;
}
.blog-sidebar .wp-block-search__button.wp-element-button {
  color: #110f10;
  background-color: #fff;
  overflow: inherit;
}
.blog-sidebar .wp-block-search__input {
  color: #fff;
  background-color: #202020;
}
.wp-block-latest-comments__comment {
  line-height: 2;
  color: rgba(255, 255, 255, 0.5);
}
.wp-block-latest-comments__comment a {
  color: #fff;
}

/* -----------------------------------------------------------------
    - Footer
----------------------------------------------------------------- */
.footer::before {
  background-color: #110f10;
}
.footer__left {
  color: #fff;
}
@media only screen and (max-width: 768px) {
  .footer__left {
    background-color: #110f10;
  }
}

/* -----------------------------------------------------------------
    - Effects
----------------------------------------------------------------- */
.mapboxgl-popup-content {
  color: #110f10;
}

.cursor {
  mix-blend-mode: lighten;
}
.cursor-close {
  mix-blend-mode: difference;
}

.reveal::after {
  background: #202020;
}
.reveal.animated::before {
  background: #110f10;
}

.nicescroll-cursors {
  background-color: rgba(255, 255, 255, 0.66) !important;
}

.search-form .inputText--fill {
  background-color: rgba(255, 255, 255, 0.04);
}