html, body {
  height: 100%;
  
  background: #fff;
}

body {
  color: #2a11b6;
}


/* ### BASICS ### */

a {
  color: #2a11b6;
}

.workslist li.hover {
  background: #2a11b6;
}

.workslist li[data-view-mode='text'] h2 {
  border: 1px solid #2a11b6;
}

.workslist li[data-view-mode='text'].hover {
  background: rgba(42,17,182,0.1);
}


header nav > ul > li > ul > li a {
  // font-style: italic;

  color: rgba(42,17,182,0.6);
}

header nav > ul > li > ul > li a:hover,
header nav > ul > li > ul > li a:active,
header nav > ul > li > ul > li a:focus {
  color: #2a11b6;
}


.viewer.pan .imagelist li .placeholder {
  border: 1px solid #2a11b6;
}

.viewer.stack .imagelist li img,
.viewer.stack .imagelist li .placeholder {
  border: 1px solid #2a11b6;
}

.viewer.stack .imagelist .description > div {
  border: 1px solid #2a11b6;
}

.loader {
  border-color: #2a11b6 transparent #2a11b6 transparent;
}

.cssanimations .loader {
  border-color: #2a11b6 transparent transparent transparent;
}


/* messages */

.message {
  border: 1px solid #2a11b6;
}

@media screen and ( max-width: 45em ) { 

  header nav {
    background: #2a11b6;
  }


  /* viewer */

  .viewer.pan .imagelist > li.description > div,
  .viewer.stack .imagelist > li.description > div,
  .viewer.text .imagelist > li.description > div {
    border: 1px solid #2a11b6;
  }

}


/* ### text selection ### */

::selection {
  background: #2a11b6;
}

::-moz-selection {
  background: #2a11b6;
}

::-webkit-scrollbar-thumb:vertical {
  border-color: transparent transparent transparent rgba(42,17,182,0.3);
  border-width: 0 0.3em;
  border-style: solid;
}

::-webkit-scrollbar-thumb:vertical:hover {
  border-color: transparent transparent transparent rgba(42,17,182,0.8);
}

::-webkit-scrollbar-thumb:horizontal {
  border-color: rgba(42,17,182,0.3) transparent transparent transparent;
  border-width: 0.3em 0;
  border-style: solid;
}

::-webkit-scrollbar-thumb:horizontal:hover {
  border-color: rgba(42,17,182,0.8) transparent transparent transparent;
}