/* DC Tattoos button theme: dark actions, red social buttons. */
/* A separate composited layer prevents mobile browsers from repainting and
   shifting a background-attachment:fixed image during fast scrolling. */
html{background:#0a0a0c}
body{position:relative;isolation:isolate;min-height:100vh;background:#0a0a0c!important}
body::before{
  content:"";
  position:fixed;
  inset:-2px;
  z-index:-1;
  pointer-events:none;
  background:#0a0a0c url('images/dc-tattoos-background.jpg') center center/100vw auto no-repeat;
  transform:translate3d(0,0,0);
  backface-visibility:hidden;
  will-change:transform;
}
@media(min-width:900px){body::before{background-size:100vh auto}}

.nav a,
.navbtn,
a.back,
a.cta,
.cta-row a.cta,
.design a.book,
.cta-bar a.btn,
.cta a,
button[type="submit"]{
  background:linear-gradient(145deg,#1b1b21,#101014)!important;
  border:1px solid rgba(224,34,34,.68)!important;
  color:#fff!important;
  box-shadow:0 0 0 1px rgba(224,34,34,.08)!important;
  transition:transform .25s,border-color .25s,box-shadow .25s!important;
}
.nav a:hover,
.navbtn:hover,
a.back:hover,
a.cta:hover,
.cta-row a.cta:hover,
.design a.book:hover,
.cta-bar a.btn:hover,
.cta a:hover,
button[type="submit"]:hover{
  border-color:var(--accent2)!important;
  box-shadow:0 0 12px rgba(224,34,34,.62),0 8px 24px rgba(224,34,34,.24)!important;
}
.soc{
  background:var(--grad)!important;
  border:1px solid rgba(255,255,255,.14)!important;
  color:#fff!important;
  box-shadow:0 7px 20px rgba(224,34,34,.28)!important;
}
.soc svg{fill:#fff!important}
.soc:hover{
  border-color:rgba(255,255,255,.35)!important;
  box-shadow:0 0 14px rgba(224,34,34,.62),0 10px 28px rgba(224,34,34,.30)!important;
}
@media (hover:none), (max-width:640px){
  .nav a,
  .navbtn,
  a.back,
  a.cta,
  .cta-row a.cta,
  .design a.book,
  .cta-bar a.btn,
  .cta a,
  button[type="submit"]{
    border-color:var(--accent)!important;
    box-shadow:0 0 11px rgba(224,34,34,.52),0 6px 18px rgba(224,34,34,.18)!important;
  }
  .soc{
    box-shadow:0 0 13px rgba(224,34,34,.58),0 8px 22px rgba(224,34,34,.26)!important;
  }
}
