*::selection {
  background-color: rgba(var(--pale-accent), 0.5);
  color: rgb(var(--swatch-text-light));
}
@media screen and (prefers-reduced-motion: no-preference) {
    #page-title, #breadcrumbs, #page-content > * {
      animation-name: fadeIn;
      animation-duration: 0.7s;
      animation-iteration-count: 1;
      animation-timing-function: ease-out;
      animation-fill-mode: backwards;
    }
}
 #page-title { 
animation-delay: 1s; 
}
 
#breadcrumbs, #page-content > * {
animation-delay: 1s;
}
 
  @keyframes fadeIn {
    from {
      opacity: 0;
      transform: translate(0,30px);
    }
    to {
      opacity: 1;
      transform: translate(0,0);
    }
  }
 
#page-content > :nth-child(1) { animation-delay: calc(1 * var(--fade-in-delay)); }
#page-content > :nth-child(2) { animation-delay: calc(2 * var(--fade-in-delay)); }
#page-content > :nth-child(3) { animation-delay: calc(3 * var(--fade-in-delay)); }
#page-content > :nth-child(4) { animation-delay: calc(4 * var(--fade-in-delay)); }
#page-content > :nth-child(5) { animation-delay: calc(5 * var(--fade-in-delay)); }
#page-content > :nth-child(6) { animation-delay: calc(6 * var(--fade-in-delay)); }
#page-content > :nth-child(7) { animation-delay: calc(7 * var(--fade-in-delay)); }
#page-content > :nth-child(8) { animation-delay: calc(8 * var(--fade-in-delay)); }
#page-content > :nth-child(9) { animation-delay: calc(9 * var(--fade-in-delay)); }
#page-content > :nth-child(10) { animation-delay: calc(10 * var(--fade-in-delay)); }
#page-content > :nth-child(11) { animation-delay: calc(11 * var(--fade-in-delay)); }
#page-content > :nth-child(12) { animation-delay: calc(12 * var(--fade-in-delay)); }
#page-content > :nth-child(13) { animation-delay: calc(13 * var(--fade-in-delay)); }
#page-content > :nth-child(14) { animation-delay: calc(14 * var(--fade-in-delay)); }
#page-content > :nth-child(15) { animation-delay: calc(15 * var(--fade-in-delay)); }
#page-content > :nth-child(n+15) { animation-delay: calc(16 * var(--fade-in-delay)); }
 
:root {
   --fade-in-delay: 0.1s;
 
   --theme-base: "black-highlighter";
   --theme-id: "a-cluster-services";
   --theme-name: "A-Cluster Services";
   --header-height-on-desktop: 12rem;
 
  --header-title:"Услуги А-Кластера";
  --header-subtitle:"Ваше времяпровождение - наша забота!";
  --logo-image: url("https://sandbox-2.backrooms.dentrado.art/local--files/mr-isk-code/Logo");
 
   --white-monochrome: 235, 209, 196;
   --pale-gray-monochrome: 228, 179, 138;
   --light-gray-monochrome: 168, 134, 106;
   --gray-monochrome: 204, 140, 130;
   --black-monochrome: 168, 134, 106;
   --bright-accent: 228, 179, 138;
   --medium-accent: 192, 135, 105;
   --dark-accent: 228, 179, 138;
   --pale-accent: 178, 97, 80;
 
  --link-color: 115, 82, 36;
   --hover-link-color: 115, 82, 36;
   --visited-link-color: 152, 103, 0;
   --newpage-color: 155, 0, 0;
 
    --swatch-text-dark: 105, 67, 24;
    --swatch-text-light: 244, 219, 192;
 
     --gradient-header: linear-gradient(to top,
      rgba(var(--gray-monochrome)) 0%,
      rgba(var(--pale-accent)) 100%
   );
 
   --swatch-border-color: none;
   --swatch-menubg-black-color: var(--pale-accent);
   --swatch-topmenu-border-color: var(--gray-monochrome);
}
 
#header::before {
 
   content: " ";
   position: absolute;
   height: 100%;
   width: 100%;
   left: 0;
   top: 0rem;
   background-image: var(--logo-image);
   background-size: auto 10rem;
   background-position: left;
   background-repeat: no-repeat;
   opacity: 1;
}
 
#top-bar {
  margin: var(--header-height-on-desktop) 0 0 0 !impotant;
}
 
#top-bar>ul>li>strong>a {
  color: rgb(var(--swatch-text-light));
}
#header h1, #header h1 a {
   color: rgb(var(--white-monochrome)) !important;
   position: absolute;
   left: 4.8rem;
   top: 1.8rem;
   margin: 0;
   width: 100%;
   display: flex;
   justify-content: left;
   z-index: 0;
}
 
#header h2, #header h2 span::before {
   position: absolute;
   color: rgb(var(--white-monochrome)) !important;
   left: 4.8rem;
   top: 2.8rem;
   margin: 0;
   width: 100%;
   display: flex;
   justify-content: left;
   opacity: 1;
   font-size: 1.4rem;
}
 
#skrollr-body {
   background-image: none;
   background-repeat: repeat;
   background-size: 0.25em 0.25em;
   width: 100%;
   height: 7.5rem;
}
 
hr {
  height: 0.1rem;
  background-color: rgb(var(--swatch-text-dark));
}
 
#page-options-container #page-options-bottom .btn.btn-default, #page-options-container #page-options-bottom-2 .btn.btn-default {
  background-color: rgb(var(--black-monochrome)) !important;
} 
 
#page-options-container #page-options-bottom .btn.btn-default::hover, #page-options-container #page-options-bottom-2 .btn.btn-default::hover {
   background-color: rgb(var(--gray-monochrome)) !important;
}
 
.lightblock {
    background-color: rgb(var(--pale-gray-monochrome));
    padding: 0.01rem 1rem;
    margin: 0.5rem 0 0.5rem 0.25rem;
    box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
}
 
.logoblock{
    padding: 0.01rem 1rem;
    box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
    margin: 0.5rem 0 0.5rem 0.25rem;
    display: block;
    position: relative;
    background-color: rgb(var(--pale-gray-monochrome));
}
 
.logoblock::after{
    content: "";
    float: center;
    background: url(https://sandbox-2.backrooms.dentrado.art/local--files/mr-isk-code/MapLogo) center/35% no-repeat;
    opacity: 0.35;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    position: absolute;
    z-index: 1;
}
 
.border-logoblock{
    padding: 0.01rem 1rem;
    box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
    margin: 0.5rem 0 0.5rem 0.25rem;
    border: 0.3rem solid rgb(var(--swatch-text-dark));
    display: block;
    position: relative;
    background-color: rgb(var(--pale-gray-monochrome));
}
 
.border-logoblock::after{
    content: "";
    float: center;
    background: url(https://sandbox-2.backrooms.dentrado.art/local--files/mr-isk-code/MapLogo) center/35% no-repeat;
    opacity: 0.35;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    position: absolute;
    z-index: 1;
}
 
/* */
.logoblock2{
    padding: 0.01rem 1rem;
    box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
    margin: 0.5rem 0 0.5rem 0.25rem;
    display: block;
    position: relative;
    background-color: rgb(var(--pale-gray-monochrome));
}
 
.logoblock2::after{
    content: "";
    float: center;
    background: url(https://sandbox-2.backrooms.dentrado.art/local--files/mr-isk-code/BonnetLogo) center/35% no-repeat;
    opacity: 0.35;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    position: absolute;
    z-index: 1;
}
 
.border-logoblock2{
    padding: 0.01rem 1rem;
    box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
    margin: 0.5rem 0 0.5rem 0.25rem;
    border: 0.3rem solid rgb(var(--swatch-text-dark));
    display: block;
    position: relative;
    background-color: rgb(var(--pale-gray-monochrome));
}
 
.border-logoblock2::after{
    content: "";
    float: center;
    background: url(https://sandbox-2.backrooms.dentrado.art/local--files/mr-isk-code/BonnetLogo) center/35% no-repeat;
    opacity: 0.35;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    position: absolute;
    z-index: 1;
}
/* */
.logoblock3{
    padding: 0.01rem 1rem;
    box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
    margin: 0.5rem 0 0.5rem 0.25rem;
    display: block;
    position: relative;
    background-color: rgb(var(--pale-gray-monochrome));
}
 
.logoblock3::after{
    content: "";
    float: center;
    background: url(https://sandbox-2.backrooms.dentrado.art/local--files/mr-isk-code/PaintBrushLogo) center/35% no-repeat;
    opacity: 0.35;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    position: absolute;
    z-index: 1;
}
 
.border-logoblock3{
    padding: 0.01rem 1rem;
    box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
    margin: 0.5rem 0 0.5rem 0.25rem;
    border: 0.3rem solid rgb(var(--swatch-text-dark));
    display: block;
    position: relative;
    background-color: rgb(var(--pale-gray-monochrome));
}
 
.border-logoblock3::after{
    content: "";
    float: center;
    background: url(    https://sandbox-2.backrooms.dentrado.art/local--files/mr-isk-code/PaintBrushLogo) center/35% no-repeat;
    opacity: 0.35;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    position: absolute;
    z-index: 1;
}
 
@media only screen and (max-width: 768px) {
 
#header::before {
background-image: none;
}
 
 #header {
     background-image: var(--logo-image);
     --y-offset: 1.5rem;
     background-position:
     calc((var(--header-height-on-mobile) - 0.75rem) - var(--size)) calc(((var(--size) * -1) + var(--header-height-on-mobile) + var(--y-offset)) / 2);
     background-size: var(--size), 100% var(--header-height-on-mobile);
     background-repeat: no-repeat, repeat;
     width: 100vw;
     margin: 0;
     position: sticky;
     top: calc(var(--header-height-on-mobile) * -1);
 }
 
#header h1, #header h1 a {
   left: 1rem;
   top: 0.8rem;
}
 
#header h2, #header h2 span, #header h2 span::before {
   left: 0.8rem;
   top: 1.8rem;
}
}