/* ---------- Color Module Styles ----------- */
/*
 * Colors are based on these settings for nl_barrio
 *  
 *  Header Background top:      #8b2d2d
 *  Header Background bottom:   #aca5f0
 *  Main background:            #ffffff
 *  Sidebar background:         #faebeb
 *  Sidebar borders:            #f9f9f9
 *  Footer Background:          #413951
 *  Primary Button Background:  #7f418d
 *  Primary Button Hover:       #a05252
 *  Title and slogan:           #fffeff
 *  Text Color                  #3b3b3b
 *  Link Color                  #0071b3
 *  Block Headers:              #cfccf3
 */
body {
  color: #3b3b3b;  /* Text Color */
  background: #413951; /* Footer Background */
}

#page,
#main-wrapper,
.region-primary-menu .menu-item a.is-active,
.region-primary-menu .menu-item--active-trail a {
  background: #ffffff;
}

.tabs ul.primary li a.is-active {
  background-color: #ffffff;
}

.tabs ul.primary li.is-active a {
  background-color: #ffffff;
  border-bottom-color: #ffffff;
}

#navbar-top {
  background-color: #8b2d7e;
}

#navbar-main {
  background-color: #ada5f0;
}

/* --- Custom code nl_barrio */
.blockhdr {
  background-color: #d0ccf4;
  width: 100%;
  height: auto;
  padding: 5px;
  margin-bottom: 4px;
  color: white;
}

.site-name-slogan-border {
  background-color: #d0ccf4;
}

li.nav-item > a.nav-link {
  font-size: larger ;
}

nav.menu--footer > ul > li > a.nav-link {
  color: #92c54a !important ;
  font-size: medium ;
}

nav.menu--tools > ul > li > a.nav-link {
  color: #92c54a !important ;
  font-size: medium ;
}

thead > tr {
  background-color: #d0ccf4;
}

tbody > tr {
  background-color: #ffffff;
}

thead>tr>th, tbody>tr>td, tr, td, th {
  border: 1px solid;
  border-color: #d0ccf4;
}

/* mjp_wsaudio ******************************************/
.mjp-wsaudio-hdr { 
  border: 2px #8b2d2d; /* orig #3379b7 ; */
}

.mjp-wsaudio-hdrsong {
  background: #7f418d ; /* Primary Button Background */ /* orig #285f8f ; */
  filter: brightness(90%) ;
  color: white;
}

.mjp-wsaudio-labelplaying.loading {
  color: #a05252 ;  /* Primary Botton Hover */ /* Was #58f5cc */
}

.mjp-wsaudio-hdrtopleft {
  background: #aca5f0 ; /* Header Background Bottom */
 }

.mjp-wsaudio-hdrtopmid {
  background: #faebeb ; /* Sidebar Background */
 }

.mjp-wsaudio-hdrtopright {
  background: #aca5f0 ; /* Header Background Bottom */
  color: white;
 }

.mjp-wsaudio-setlist-ref  .mjp-wsaudio-hdr  .mjp-wsaudio-waveform {
  background-color: #285f8f ;
}

.mjp-wsaudio-btn {
  color: #ffffff;
  background-color: #7f418d ; /* Primary Button Background */
 }

.mjp-wsaudio-btn.rate-button.active {
  color: #aca5f0  ;  /* Header Background Bottom */  /* green ; */
}

.mjp-wsaudio-btn:hover {
  background-color: #a05252 ; /* Primary Button Hover */
 }

input.mjp-wsaudio-cb {
  background: #73a8d9 ;
 }

.mjp-wsaudio-playlist-track.playing {
  color: #aca5f0 ; /* Header Background Bottom */
 }
.mjp-wsaudio-playlist-track:hover {
  background-color: gray ;
  color: white ;
}  

.mjp-wsaudio-equalizer {
  background: #73a8d9 ;
 }

.mjp-wsaudio-hdr input[type='range']::-webkit-slider-runnable-track {
  background: rgba(158, 186, 212, 0.825 ) ;
}

.mjp-wsaudio-hdr input[type='range']::-ms-track {
  background: rgba(158, 186, 212, 0.825 ) ;
}

/* a number of gradients were missed */

.mjp-wsaudio-hdr input[type='range'] {
  background: 
      repeating-linear-gradient(90deg, #7f418d, #7f418d 0.0625em, transparent 0.0625em, transparent 1.5em) no-repeat 50% 0.4375em border-box, repeating-linear-gradient(90deg, #7f418d, #7f418d  0.0625em, transparent 0.0625em, transparent 1.5em) no-repeat 50% 4.9375em border-box, linear-gradient(90deg, #faebeb , #7f418d , #faebeb  )  no-repeat 50% 50% border-box;
}

.mjp-wsaudio-hdr input[type='range']:focus::-webkit-slider-runnable-track {
  background: #285f8f ;
}

.mjp-wsaudio-hdr input[type='range']:focus::-moz-range-track {
  background: #285f8f ;
}

.mjp-wsaudio-hdr input[type='range']:focus::-ms-track {
  background: #285f8f ;
}

/* End of MJP applied CSS */
a,
.link {
  color: #0071b3;
}

a:hover,
a:focus,
.link:hover,
.link:focus {
  color: #008ee2;
}

a:active,
.link:active {
  color: #22adff;
}

.page-item.active .page-link {
  background-color: #0071b3;
  border-color: #0071b3;
}

.page-link,
.page-link:hover {
  color: #0071b3;
}

.sidebar .block {
  background-color: #faecfa;
  border-color: #f9f9f9;
}

.btn-primary {
  background-color: #80428d;
  border-color: #80428d;
}

.btn-primary:hover,
.btn-primary:focus {
  background-color: #a05389;
}

.site-footer {
  background: #413951;  /* Footer Background */
}

.region-header,
.region-header a,
.region-header li a.is-active,
.region-header .site-branding__text,
.region-header .site-branding,
.region-header .site-branding__text a,
.region-header .site-branding a,
.region-secondary-menu .menu-item a,
.region-secondary-menu .menu-item a.is-active {
  color: #fffeff;
}


/* ---------- Color Form ----------- */

[dir="rtl"] .color-form .color-palette {
  margin-left: 0;
  margin-right: 20px;
}

[dir="rtl"] .color-form .form-item label {
  float: right;
}

[dir="rtl"] .color-form .color-palette .lock {
  right: -20px;
  left: 0;
}