/** styles for /users pages **/
/** color vars **/
:root {
  --roboto: 'Roboto', Arial, Helvetica, sans-serif;

  --primary: rgba(26, 40, 67, 1);
  --primary-hover: rgba(60, 83, 127, 1);
  --primary-20: rgba(26, 40, 67, .2);

  --blue: rgba(91, 192, 222, 1);
  --blue-hover: rgba(81,172,199,1);
  --blue-dk: rgba(121, 222, 252, 1);
  --blue-lt: rgba(61, 162, 192, 1);

  --dark-blue: #1A237E;


  --dark: rgba(0, 16, 46, 1);
  --dark-hover: rgba(26, 40, 67, 1);

  --white: rgba(255, 255, 255, 1);
  --half-white: rgba(255, 255, 255, .5);
  --white-overlay: rgba(255,255,255, .2);
  --eggshell: rgba(250, 250, 250, 1);
  --near-white: rgba(240, 240, 240, 1);
  --off-white:  rgba(235,235,235, 1);
  --deez: #ddd;
  --sees: #ccc;
  --aye: #aaa;
  --med-dark: #888;
  --dark-gray: #4d4d4d;
  --charcoal: #333;
  --charcoal-hover: rgba(50, 50, 50, .8);
  --charcoal-overlay: rgba(20, 20, 20, .75);
  --input-bkgd: rgba(33, 33, 33, .8);

  --thin:    100;
  --light:   300;
  --regular: 400;
  --semi:    500;
  --bold:    700;
  --black:   900;

  --radius: .25rem;


/* legend colors */
  --red: #E93838;
  --red-hover: #A92323;

  --red-dk: #B12645;
  --red-lt: #FCE7EC;

  --green: #46c37b;
  --green-hover: #60A97A;

  --green-dk: #46c37b;
  --green-lt: #E3F9EA;

  --blue-dk: #114CA5;
  --blue-lt: #E3EEFF;

  --gray-dk: #2D2F32;
  --gray-lt: #F4F5F6;

  --yellow: #f3b760;
  --yellow-hover: #efa231;
  --yellow-dk: #935E10;
  --yellow-lt: #FEF5E8;
}

.clearfix::after {
  content: "";
  clear: both;
  display: table;
}

.helpbutton {
    color: white;
    background-color: #70b9eb;
    padding:7px;
}

p {
  padding-left: 20px;
  max-width: 700px;
}


/* app layout */
#main-container {
  padding-top: 0 !important;
  padding-left: 2rem;
  padding-right: 2rem;
  margin-top: 7rem !important;
}


/* app header */
#header-navbar {
  box-shadow: none;
  order-bottom: 1px solid var(--primary-20);
}

/* sections */
.dark-background {
    background-color: var(--primary);
    color: var(--white);
}

.dark-background * {
    background-color: var(--primary);
    color: var(--white);
}


/*** legend, actions, buttons, signal status pills, labels ***/
.pill {
    border-radius: 4rem;
    font-size: 1.5rem;
    padding: .25rem 1rem;
}

.signal,
.signal-0,
.signal-default {
    color: var(--gray-dk);
/*    background-color: var(--gray-lt);*/
}

.signal-3 {
    color: var(--blue-dk);
/*    background-color: var(--blue-lt);*/
}

.signal-1 {
    color: var(--green-dk);
/*    background-color: var(--green-lt);*/
}

.signal-2 {
    color: var(--red-dk);
/*    background-color: var(--red-lt);*/
}

.signal-5  {
    color: var(--yellow-dk);
/*    background-color: var(--yellow-lt);*/
}



/* from one ui - updated colors */

.label:empty {
  display: inline !important;
}

.label {
    display: inline;
    padding: .25rem .75rem;
    font-size: 1.25rem;
    font-weight: 600;
}

.label-primary {
  color: var(--primary);
}
.label-primary[href]:hover,
.label-primary[href]:focus {
  background-color: var(--primary-hover);
}
.label-success {
  background-color: var(--green);
}
.label-success[href]:hover,
.label-success[href]:focus {
  background-color: var(--green-hover);
}
.label-info {
  background-color: var(--blue);
}
.label-info[href]:hover,
.label-info[href]:focus {
  background-color: var(--blue-hover);
}
.label-warning {
  background-color: var(--yellow);
}
.label-warning[href]:hover,
.label-warning[href]:focus {
  background-color: var(--yellow-hover);
}
.label-danger {
  background-color: var(--red);
}
.label-danger[href]:hover,
.label-danger[href]:focus {
  background-color: var(--red-hover);
}
.badge-primary {
  background-color: var(--primary);
}
.badge-success {
  background-color: var(--green);
}
.badge-info {
  background-color: var(--blue);
}
.badge-warning {
  background-color: var(--yellow);
}
.badge-danger {
  background-color: var(--red);
}


/* FA */
.fa-styled {
  font-size: 2rem;
  vertical-align: middle;
  margin: 0 1rem;
}

.fa-primary {
  color: var(--primary);
}

.fa-white {
  color: var(--white);
}

.fa-red {
  color: var(--red-dk);
}

.fa-green {
  color: var(--green-dk);
}

#newsletter_content {
    min-height: 15em;
    border: 1px solid black;
}

.classy-link {
  font-size: 1.4rem;
  color: var(--dark-blue);
  text-decoration: underline;
}


/* random fixes - spaghetti  */
nav.pagy.nav a {
  padding: .3em;
}

a[aria-disabled="true"] {
  color: var(--aye);
}

table.compact {
  max-width: 60rem;
}

img.ror {
    max-width: 100%;
}

#search-form form {
  display: inline-flex;
}

#search-form form * {
  margin: .5em .5em .5em 0;
}


#search-form input[name="search"] {
  height: 34px;
}

.ticker-wrapper {
  display: block;
  width: 100%;
  padding: .5em;
  margin: 0;
  background-color: var(--dark);
  color: var(--white);
  margin: 0 -5rem;
  width: calc(100% + 10rem);
  text-align: center;
}

.ticker {
  display: inline;
  line-height: 2;
  margin-right: 1em;
}

@media screen and (max-width: 767px) {
  .ticker-wrapper {
    margin: 0 -3rem;
    width: calc(100% + 6rem);
  }
  .ticker {
    display: block;
    margin: .5em auto;
  }
}

.ticker strong {
  margin: 0 .5em;
  color: var(--white);
}

.ticker .sells {
  padding: .25em .5em;
  color: var(--red-dk);
  background-color: var(--red-lt);
}

.ticker .buys {
  padding: .25em .5em;
  color: var(--green-dk);
  background-color: var(--green-lt);
}


/* responsive tables - hiding columns */
@media screen and (max-width: 640px) {
  .hide-for-small {
    display: none;
  }
}