.essa-bubble-white {
  position: relative;
  padding: 10px 20px;
  background: #ffffff;
  color: #000000;
  border-color: #dedede;
  border-width: 1px;
  border-style: solid;
  border-radius: 5px;
  /* Throw drop shadow against it*/
}

.essa-bubble-white .modal-content, .essa-bubble-white > .modal-content {
  -webkit-box-shadow: none !important;
  box-shadow: none !important;
  border: none !important;
  background-color: #ffffff !important;
}

.essa-bubble-white:before {
  position: absolute;
  content: "";
  bottom: -20px;
  right: -2px;
  border-width: 12px 15px 19px 0px;
  border-color: transparent #dedede;
  border-style: solid;
}

.essa-bubble-white:after {
  content: ' ';
  position: absolute;
  width: 0;
  height: 0;
  right: 0px;
  bottom: -15px;
  border: 12px 15px 19px 0px solid;
  border-style: solid;
  border-width: 12px 15px 19px 0px;
  border-color: transparent #ffffff transparent transparent;
}

.essa-bubble, .essa-bubble-reverse {
  position: relative;
  padding: 10px 20px;
  background: #fbd4d6;
  color: #f05661;
  border-color: #f05661;
  border-width: 2px;
  border-style: solid;
  border-radius: 5px;
}

.essa-bubble h1, .essa-bubble-reverse h1 {
  color: #f05661;
}

.essa-bubble:after {
  content: ' ';
  position: absolute;
  width: 0;
  height: 0;
  right: 0px;
  bottom: -15px;
  border: 12px 15px 19px 0px solid;
  border-style: solid;
  border-width: 12px 15px 19px 0px;
  border-color: transparent #fbd4d6 transparent transparent;
}

.essa-bubble-reverse:before {
  position: absolute;
  content: "";
  top: -20px;
  left: -2px;
  border-width: 19px 0px 12px 15px;
  border-color: transparent #f05661;
  border-style: solid;
}

.essa-bubble-reverse:after {
  content: ' ';
  position: absolute;
  width: 0;
  height: 0;
  left: 0px;
  top: -15px;
  border: 19px 0px 12px 15px solid;
  border-style: solid;
  border-width: 19px 0px 12px 15px;
  border-color: transparent transparent transparent #fbd4d6;
}

.essa-bubble-success {
  background: lightgreen;
  color: green;
  border-color: green;
}

.essa-bubble-success:after {
  border-color: transparent lightgreen transparent transparent;
}

.essa-bubble-success:before {
  border-color: transparent green;
  border-style: solid;
}

.essa-bubble-action {
  background: lightgoldenrodyellow;
  color: brown;
  border-color: brown;
}

.essa-bubble-action:after {
  border-color: transparent lightgoldenrodyellow transparent transparent;
}

.essa-bubble-action:before {
  border-color: transparent brown;
  border-style: solid;
}

.essa-bubble-info {
  background: lightskyblue;
  color: blue;
  border-color: blue;
}

.essa-bubble-info:after {
  border-color: transparent lightskyblue transparent transparent;
}

.essa-bubble-info:before {
  border-color: transparent blue;
  border-style: solid;
}

.essa-bubble:before {
  position: absolute;
  content: "";
  bottom: -20px;
  right: -2px;
  border-width: 12px 15px 19px 0px;
  border-color: transparent #f05661;
  border-style: solid;
}

@-webkit-keyframes checkbox-spinout {
  0% {
    color: #00c853;
    opacity: 1;
  }
  15% {
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate(135deg);
    transform: rotate(135deg);
    opacity: 0;
  }
}

@-moz-keyframes checkbox-spinout {
  0% {
    color: #00c853;
    opacity: 1;
  }
  15% {
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate(135deg);
    transform: rotate(135deg);
    opacity: 0;
  }
}

@keyframes checkbox-spinout {
  0% {
    color: #00c853;
    opacity: 1;
  }
  15% {
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate(135deg);
    transform: rotate(135deg);
    opacity: 0;
  }
}

@-webkit-keyframes checkbox-spinout-reverse {
  0% {
    color: #000000;
    opacity: 1;
  }
  15% {
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate(-135deg);
    transform: rotate(-135deg);
    opacity: 0;
  }
}

@-moz-keyframes checkbox-spinout-reverse {
  0% {
    color: #000000;
    opacity: 1;
  }
  15% {
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate(-135deg);
    transform: rotate(-135deg);
    opacity: 0;
  }
}

@keyframes checkbox-spinout-reverse {
  0% {
    color: #000000;
    opacity: 1;
  }
  15% {
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate(-135deg);
    transform: rotate(-135deg);
    opacity: 0;
  }
}

@-webkit-keyframes delayed-visibility {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes delayed-visibility {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes delayed-visibility {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

.blinker {
  -webkit-animation: blinker 4s;
  /* Chrome, Safari, Opera  */
  animation: blinker 4s;
  animation-iteration-count: infinite;
  -webkit-animation-iteration-count: infinite;
}

@-webkit-keyframes delayedopacityfadein {
  0% {
    opacity: 0;
  }
  99% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes delayedopacityfadein {
  0% {
    opacity: 0;
  }
  99% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes delayedopacityfadein {
  0% {
    opacity: 0;
  }
  99% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes delayedshow {
  0% {
    opacity: 0;
  }
  99% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes blinker {
  0% {
    opacity: 0;
  }
  25% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  75% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes blinker {
  0% {
    opacity: 0;
  }
  25% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  75% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

.reveal-to-white {
  -webkit-animation: revealtowhite 2.5s;
  /* Chrome, Safari, Opera  */
  -moz-animation: revealtowhite 2.5s;
  animation: revealtowhite 2.5s;
}

@-webkit-keyframes savedanim
{
  from {
    background-color: transparent;
  }
  to {
    background-color: white;
  }
}

@keyframes savedanim {
  from {
    background-color: transparent;
  }
  to {
    background-color: white;
  }
}

@-webkit-keyframes opacityfadeout
{
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}

@keyframes opacityfadeout {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}

/* Chrome, Safari, Opera */
@-webkit-keyframes myfirst {
  from {
    background: yellow;
  }
  to {
    background: white;
  }
}

/* Standard syntax */
@keyframes myfirst {
  from {
    background: yellow;
  }
  to {
    background: white;
  }
}

/* Chrome, Safari, Opera */
@-webkit-keyframes texttrans {
  from {
    color: blue;
  }
  to {
    color: black;
  }
}

/* Standard syntax */
@keyframes texttrans {
  from {
    color: blue;
  }
  to {
    color: black;
  }
}

/* Bootstrap modal override - this changes the modal background from 
    a faded background to whatever color you choose.  
    In this case it's f1f1f1, but can be altered to any primary.  
    Change opacity based on your comfort as well. */
/*
.modal-backdrop {
    background-color: #f1f1f1;
    opacity: .98 !important; 
}
*/
/* Bootstrap override */
.modal-content {
  background-color: #fafafa;
}

.tab-content > .tab-pane,
.pill-content > .pill-pane {
  display: block;
  /* undo display:none */
  height: 0;
  /* height:0 is also invisible */
  overflow-y: hidden;
  /* no-overflow */
}

.tab-content > .active,
.pill-content > .active {
  height: auto;
  /* let the content decide */
}

/* This is a hidden display fix for tabs and charts/maps resizing.*/
.essa-card {
  -webkit-box-shadow: 0px 1px 2px 1px rgba(0, 0, 0, 0.16);
  -moz-box-shadow: 0px 1px 2px 1px rgba(0, 0, 0, 0.16);
  box-shadow: 0px 1px 2px 1px rgba(0, 0, 0, 0.16) !important;
  background-color: #fafafa;
}

.essa-card-warning {
  color: #0093ff;
  -webkit-box-shadow: 0 8px 17px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  -moz-box-shadow: 0 8px 17px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  box-shadow: 0 8px 17px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  background-color: #fafafa;
}

.essa-card-top {
  border-bottom: solid 1px #eeeeee;
}

.essa-card-bottom {
  border-top: solid 1px #eeeeee;
}

/* Add some whitespace around titles in cards. */
.essa-card h4 {
  margin-top: 16px;
  margin-bottom: 8px;
}

/* But not for the main title of drop-down panels, so the collapsed dropdown doesn't expand. */
.essa-card .essa-card-top h4 {
  margin-top: 0;
  margin-bottom: 0;
}

.essa-blue {
  color: #0099cc;
}

.essa-green {
  color: #006666;
}

.essa-tealdark {
  color: #003333;
}

.essa-tealblue {
  color: #067d94;
}

.essa-darkgray {
  color: #333333;
}

.essa-lightgray {
  color: #b0b2b4;
}

.essa-lightestgray {
  color: #cccccc;
}

.essa-background-blue {
  background-color: #0099cc;
}

.essa-background-green {
  background-color: #006666;
}

.essa-background-tealdark {
  background-color: #003333;
}

.essa-background-tealblue {
  background-color: #098097;  /* Tweaked a little to match the new logo file. */
}

.essa-background-darkgray {
  background-color: #333333;
}

.essa-background-lightgray {
  background-color: #b0b2b4;
}

.essa-background-lightestgray {
  background-color: #cccccc;
}

.essa-grayscale {
  -webkit-filter: grayscale(100%);
  -moz-filter: grayscale(100%);
  filter: grayscale(100%);
}

.essa-grayscale-to-color {
  -webkit-filter: grayscale(100%);
  -moz-filter: grayscale(100%);
  filter: grayscale(100%);
}

.essa-grayscale-to-color:hover {
  -webkit-filter: grayscale(0);
  -moz-filter: none;
  filter: none;
}

table.table > tbody > tr:first-child > th {
  background-color: #0099cc;
  color: white;
}

.essa-sortable-header {
  white-space: nowrap;
}

.essa-sortable-header-inner {
  margin-left: 10px;
  display: inline;
  cursor: pointer;
}

/* Styles for textarea counter support. */
.essa-textarea-counter {
  position: absolute;
  bottom: -25px;
  right: 0px;
  font-family: "proxima-nova", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight: normal;
  font-size: 12pt;
  line-height: 1.6;
  color: #0093ff;
  z-index: 100;
}

.essa-textarea-counterwarning {
  color: red;
}

/*.btn-primary:hover {
  background-color: #54b0ff !important;
  color: #ffffff;
}

.btn-primary {
  background-color: #0093ff;
  font-size: 12pt;
  border-radius: 2px !important;
  color: #ffffff;
}

a.btn-primary:visited {
  color: #ffffff;
}*/

/* File upload button styles */
.essa-btn-file {
  position: relative;
  overflow: hidden;
}

.essa-btn-file input[type=file] {
  position: absolute;
  top: 0;
  right: 0;
  min-width: 100%;
  min-height: 100%;
  font-size: 100px;
  text-align: right;
  filter: alpha(opacity=0);
  opacity: 0;
  outline: none;
  background: white;
  cursor: inherit;
  display: block;
}

.essa-angular-checkbox {
  position: relative;
}

.essa-angular-checkbox > .md-check-box-outline-blank {
  position: absolute;
  left: 0;
}

.essa-angular-checkbox > .md-done {
  position: absolute;
  left: 0;
}

.essa-angular-checkbox > .essa-angular-checkbox-label {
  margin-left: 24px;
}

.essa-angular-checkbox > .md-check-box-outline-blank.ng-hide-add {
  -webkit-animation: checkbox-spinout 1s;
  /* Chrome, Safari, Opera  */
  -moz-animation: checkbox-spinout 1s;
  animation: checkbox-spinout 1s;
}

.essa-angular-checkbox-container > .md-check-box-outline-blank.ng-hide-add {
  -webkit-animation: checkbox-spinout 1s;
  /* Chrome, Safari, Opera  */
  -moz-animation: checkbox-spinout 1s;
  animation: checkbox-spinout 1s;
}

.essa-angular-checkbox > .md-check-box-outline-blank.ng-hide-remove {
  -webkit-animation: delayedopacityfadein 0.5s;
}

.essa-angular-checkbox > .md-done.ng-hide-add {
  -webkit-animation: checkbox-spinout-reverse 1s;
  /* Chrome, Safari, Opera  */
  -moz-animation: checkbox-spinout-reverse 1s;
  animation: checkbox-spinout-reverse 1s;
}

.essa-angular-checkbox-container > .md-done.ng-hide-add {
  -webkit-animation: checkbox-spinout-reverse 1s;
  /* Chrome, Safari, Opera  */
  -moz-animation: checkbox-spinout-reverse 1s;
  animation: checkbox-spinout-reverse 1s;
}

.essa-angular-checkbox > .md-done.ng-hide-remove {
  -webkit-animation: delayedopacityfadein 0.5s;
}

.checkbox > label > input {
  margin-right: 10px;
}

form.essa-form-xl input,
form.essa-form-xl select,
form.essa-form-xl input.form-control,
form.essa-form-xl select.form-control {
  font-size: 1.3em;
}

form.essa-form-xl fieldset legend {
  padding-top: 40px;
  font-size: 1.5em;
}

form fieldset legend {
  padding-top: 20px;
  font-size: 1.5em;
  color: #067d94;
}

form legend {
  border: none;
}

form select,
form select.form-control {
  height: 2em;
}

form .btn-group .btn-link {
  border: none;
  box-shadow: none;
  color: #b0b2b4;
}

form .btn-group .btn-link:hover {
  color: #0099cc;
  text-decoration: none;
}

.ng-pristine .help-block.error {
  display: none;
}

.help-block.error {
  color: #b94a48;
}

select.ng-invalid,
input.ng-invalid {
  border-color: #b94a48;
}

.essa-hang-right {
  text-align: right;
  width: 100%;
}

.essa-hang-left {
  text-align: left;
  width: 100%;
}

/* Quick guide: */
/* 0 - 480 : tn (tiny) - no Bootstrap equivalent
    480 - 767: xs (extra small) - equivalent to Bootstrap xs
    767 - 992: sm (small) - equivalent to Bootstrap sm
    992 - 1200: md (medium) - equivalent to Bootstrap medium
    1200 - onward: lg - equivalent to Bootstrap large
    */
.essa-container-medium {
  padding-left: 16px;
  padding-right: 16px;
  padding-bottom: 4px;
  padding-top: 8px;
  margin-bottom: 16px;
}

.essa-container {
  padding-left: 32px;
  padding-right: 32px;
}

.essa-container-large {
  padding-left: 64px;
  padding-right: 64px;
}

.essa-pull-up-small {
  margin-top: -8px;
}

.essa-pull-up-medium {
  margin-top: -16px;
}

.essa-pull-up-large {
  margin-top: -32px;
}

.essa-pull-up-xl {
  margin-top: -64px;
}

.essa-pull-down-super-xl {
  margin-top: 128px;
}

.essa-push-out-right {
  margin-right: 24px;
}

@media only screen and (min-width: 0px) and (max-width: 480px) {
  .essa-container {
    padding-left: 16px;
    padding-right: 16px;
  }
}

.essa-row {
  display: table;
  width: 100%;
}

.essa-top-row {
  padding-top: 32px;
  padding-bottom: 16px;
}

.essa-middle-row {
  padding-top: 16px;
  padding-bottom: 16px;
}

.essa-bottom-row {
  padding-top: 16px;
  padding-bottom: 32px;
}

.essa-mini-row {
  padding-top: 8px;
  padding-bottom: 8px;
}

.essa-big-row {
  padding-top: 32px;
  padding-bottom: 32px;
}

.essa-huge-row {
  padding-top: 64px;
  padding-bottom: 64px;
}

.row.essa-margin-override {
  margin-left: 0px;
  margin-right: 0px;
}

/* Default visibilities */
.essa-vertical-align-baseline {
  display: flexbox;
  display: flex;
  align-items: baseline;
}

.essa-vertical-align-center {
  display: flexbox;
  display: flex;
  align-items: center;
}

/* 0 to 480  - no boot*/
@media only screen and (min-width: 0px) and (max-width: 480px) {
  .essa-visible-tn-block {
    display: block;
  }
  .essa-visible-tn-inline {
    display: inline;
  }
  .essa-visible-tn-inline-block {
    display: inline-block;
  }
  .essa-hidden-tn {
    display: none !important;
  }
  .essa-visible-xs-block {
    display: none;
  }
  .essa-visible-xs-inline {
    display: none;
  }
  .essa-visible-xs-inline-block {
    display: none;
  }
  .essa-visible-all-mobile {
    display: none;
  }
  .essa-hidden-all-mobile {
    display: block;
  }
  .essa-vertical-align-baseline-tn {
    display: flexbox;
    display: flex;
    align-items: baseline;
  }
  .essa-vertical-align-baseline-sm {
    display: inherit;
    align-items: stretch;
  }
  .essa-vertical-align-baseline-md {
    display: inherit;
    align-items: stretch;
  }
  .essa-vertical-align-baseline-lg {
    display: inherit;
    align-items: stretch;
  }
  .essa-img-responsive-at-tn {
    display: block;
    height: auto;
    max-width: 100%;
  }
  .essa-img-responsive-at-xs {
    display: block;
    height: auto;
    max-width: 100%;
  }
  .essa-img-responsive-at-sm {
    display: block;
    height: auto;
    max-width: 100% !important;
  }
  .essa-img-responsive-at-md {
    display: block;
    height: auto;
    max-width: 100%;
  }
  .essa-img-responsive-at-lg {
    display: block;
    height: auto;
    max-width: 100%;
  }
}

/* 480 to 767 */
@media only screen and (min-width: 480px) {
  .essa-visible-tn-block {
    display: none;
  }
  .essa-visible-tn-inline {
    display: none;
  }
  .essa-visible-tn-inline-block {
    display: none;
  }
  .essa-hidden-tn {
    display: inherit;
  }
  .essa-visible-xs-block {
    display: block;
  }
  .essa-visible-xs-inline {
    display: inline;
  }
  .essa-visible-xs-inline-block {
    display: inline-block;
  }
  .essa-visible-all-mobile {
    display: none;
  }
  .essa-hidden-all-mobile {
    display: block;
  }
  .essa-vertical-align-baseline-sm {
    display: flexbox;
    display: flex;
    align-items: baseline;
  }
  .essa-img-responsive-at-xs {
    display: block;
    height: auto;
    max-width: 100%;
  }
  .essa-img-responsive-at-sm {
    display: block;
    height: auto;
    max-width: 100%;
  }
  .essa-img-responsive-at-md {
    display: block;
    height: auto;
    max-width: 100%;
  }
  .essa-img-responsive-at-lg {
    display: block;
    height: auto;
    max-width: 100%;
  }
}

/* 767 to 992 */
@media only screen and (min-width: 767px) and (max-width: 992px) {
  .essa-visible-tn-block {
    display: none;
  }
  .essa-visible-tn-inline {
    display: none;
  }
  .essa-visible-tn-inline-block {
    display: none;
  }
  .essa-hidden-tn {
    display: inherit;
  }
  .essa-visible-xs-block {
    display: none;
  }
  .essa-visible-xs-inline {
    display: none;
  }
  .essa-visible-xs-inline-block {
    display: none;
  }
  .essa-visible-all-mobile {
    display: none;
  }
  .essa-hidden-all-mobile {
    display: block;
  }
  .essa-vertical-align-baseline-tn {
    display: inherit;
    align-items: stretch;
  }
  .essa-vertical-align-baseline-sm {
    display: inherit;
  }
  .essa-vertical-align-baseline-md {
    display: flexbox;
    display: flex;
    align-items: baseline;
  }
  .essa-vertical-align-baseline-lg {
    display: inherit;
  }
  .essa-img-responsive-at-sm {
    display: block;
    height: auto;
    max-width: 100%;
  }
  .essa-img-responsive-at-md {
    display: block;
    height: auto;
    max-width: 100%;
  }
  .essa-img-responsive-at-lg {
    display: block;
    height: auto;
    max-width: 100%;
  }
}

/* 992 to 1200*/
@media only screen and (min-width: 992px) {
  .essa-visible-tn-block {
    display: none !important;
  }
  .essa-visible-tn-inline {
    display: none;
  }
  .essa-visible-tn-inline-block {
    display: none;
  }
  .essa-hidden-tn {
    display: inherit;
  }
  .essa-visible-xs-block {
    display: none;
  }
  .essa-visible-xs-inline {
    display: none;
  }
  .essa-visible-xs-inline-block {
    display: none;
  }
  .essa-visible-all-mobile {
    display: none;
  }
  .essa-hidden-all-mobile {
    display: block;
  }
  .essa-vertical-align-baseline-tn {
    display: inherit;
    align-items: stretch;
  }
  .essa-vertical-align-baseline-sm {
    display: inherit;
  }
  .essa-vertical-align-baseline-md {
    display: flexbox;
    display: flex;
    align-items: baseline;
  }
  .essa-vertical-align-baseline-lg {
    display: inherit;
  }
  .essa-img-responsive-at-md {
    display: block;
    height: auto;
    max-width: 100%;
  }
  .essa-img-responsive-at-lg {
    display: block;
    height: auto;
    max-width: 100%;
  }
  .essa-copy-padding-md-left {
    padding-left: 50px;
  }
}

/* Macbooks all the way up to those screens in Stanley Park they show in the summer */
@media only screen and (min-width: 1200px) {
  .essa-visible-tn-block {
    display: none !important;
  }
  .essa-visible-tn-inline {
    display: none;
  }
  .essa-visible-tn-inline-block {
    display: none;
  }
  .essa-hidden-tn {
    display: inherit;
  }
  .essa-visible-xs-block {
    display: none;
  }
  .essa-visible-xs-inline {
    display: none;
  }
  .essa-visible-xs-inline-block {
    display: none;
  }
  .essa-visible-all-mobile {
    display: none;
  }
  .essa-hidden-all-mobile {
    display: block;
  }
  .essa-vertical-align-baseline-tn {
    display: inherit;
    align-items: stretch;
  }
  .essa-vertical-align-baseline-sm {
    display: inherit;
  }
  .essa-vertical-align-baseline-md {
    display: flexbox;
    display: flex;
    align-items: baseline;
  }
  .essa-vertical-align-baseline-lg {
    display: flexbox;
    display: flex;
    align-items: baseline;
  }
  .essa-img-responsive-at-lg {
    display: block;
    height: auto;
    max-width: 100%;
  }
}

/* IPad */
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {
  .essa-visible-all-mobile {
    display: block;
  }
  .essa-hidden-all-mobile {
    display: none;
  }
}

/* IPhone 6 */
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  .essa-visible-all-mobile {
    display: block;
  }
  .essa-hidden-all-mobile {
    display: none;
  }
}

@media only screen and (min-device-width: 540px) and (max-device-width: 960px) {
  .essa-visible-all-mobile {
    display: block;
  }
  .essa-hidden-all-mobile {
    display: none;
  }
}

@media only screen and (min-device-width: 320px) and (max-device-width: 568px) {
  .essa-visible-all-mobile {
    display: block;
  }
  .essa-hidden-all-mobile {
    display: none;
  }
}

@media only screen and (min-device-width: 320px) and (max-device-width: 480px) {
  .essa-visible-all-mobile {
    display: block;
  }
  .essa-hidden-all-mobile {
    display: none;
  }
}

.essa-interaction-icon {
  cursor: pointer;
}

/* Shared by charts on various tabs. */

.essa-chart-action-link {
  font-size: small;
  padding-left: 13px;
}

.essa-interaction-icon:hover {
  -webkit-transform: scale(1.3);
  -ms-transform: scale(1.3);
  transform: scale(1.3);
}

.imgedit, .imgfinalize {
  position: absolute;
  bottom: 1px;
  right: 0px;
  background-color: #0093ff;
  color: white;
  padding: 10px;
  border-radius: 2px;
  border: 2px solid #cbcbcb;
  border-collapse: collapse;
}

.imgfinalize {
  z-index: 100;
}

.imgeditingcontainer {
  background-color: black;
  color: white;
  opacity: 0.75;
  top: 0px;
  left: 0px;
  height: 100%;
  width: 100%;
  position: absolute;
}

a, a:visited {
  color: #067d94;
}

a:hover {
  color: #067d94;
  cursor: pointer;
}

a.headerlink, a.headerlink:visited, span.headerlink, span.header {
  color: #ffffff;
  text-decoration: none;
}

a.headerlink:hover, span.headerlink:hover {
  color: #ffffff;
  text-decoration: underline;
  cursor: pointer;
}

hr {
  margin-top: 0px;
  margin-bottom: 0px;
}



h3 {
  font-size: 18pt;
  line-height: 1.3;
  /*color: #767676;in*/
  /*color: #656565; */
  color: #067d94;
  margin: 0px;
}

h4 {
  font-size: 14pt;
  line-height: 1.5;
  /*color: #767676;in*/
  /* color: #656565; */
  color:#067d94;
  margin: 0px;
}

p {
  margin-bottom: 0;
}

#help-container p {
  margin-bottom: 0.5em;
}

td {
  padding: 8px;
}

th {
  padding: 8px;
}

.essa-font-size-small {
  font-size: 14pt;
}

.essa-font-size-smaller {
  font-size: 12pt;
}

.essa-font-size-smallest {
  font-size: 11pt;
}

.essa-font-report-card {
  font-size: 10pt;
}

.essa-graph-link {
  text-decoration: underline;
  color: #0099ff;
  cursor: pointer;
}

.essa-font-weight-medium {
  font-weight: 400;
}

.essa-font-weight-strong {
  font-weight: 600;
}

.essa-font-weight-strongest {
  font-weight: 700;
}

.essa-page-heading {
  font-size: 24pt;
}

.essa-page-heading-icon {
  font-size: 48px;
  margin-right: 16px;
  margin-left: -8px;
  line-height: initial;
}

.essa-card-icon {
  font-size: 24px;
}

.essa-card-icon:hover {
  cursor: pointer;
  color: #0093ff;
}

.essa-sub-heading-icon {
  margin-right: 16px;
  margin-left: -2px;
}

.essa-circle-outline {
  border-radius: 50%;
  -moz-border-radius: 50%;
  -webkit-border-radius: 50%;
}

#downarrow {
  position: fixed;
  left: 50px;
  padding: 10px;
  top: 605px;
  z-index: 1000;
  cursor: pointer;
}

#downarrow img {
  width: 50px;
  height: 50px;
}

body {
  font-family: "Roboto","Helvetica Neue",Helvetica,Arial,sans-serif;
  font-size: 12pt;
  line-height: 1.428571429;
  color: #6b6b6b;
  background-color: #ffffff;
}

.essa-formheading {
  text-transform: uppercase;
  margin-bottom: 0px;
}

.essa-subheading {
  font-style: italic;
}

h1 {
  font-weight: 300;
  font-size: 30pt;
  line-height: 1.3;
  /*color: #453136; */
  color: #067d94;
  margin: 0px;
}

h2 {
  font-weight: 300;
  font-size: 20pt;
  line-height: 1.3;
  /* color
  color: #9da0a2; */
  color: #067d94;
}

h3 {
  font-weight: 300;
  font-size: 18pt;
  line-height: 1.3;
  /*color: #767676;in*/
  color: #656565;
}

h4 {
  color: #453136;
  font-weight: 300;
  line-height: 1.3;
  font-size: 13.5pt;
}

p {
  font-weight: normal;
  font-size: 12pt;
  line-height: 1.6;
  color: #85888b;
}

em {
  font-weight: 400;
  font-style: italic;
}

strong {
  font-weight: 700;
  font-style: normal;
}

.navbar-toggle {
  display: block;
}

.icon-bar {
  background-color: #0093ff;
}

.btn-primary.waves-button {
  /*background-color: #0099cc;*/
  background-color: #067d94;
  color: #ffffff;
  text-transform: uppercase;
}

.btn-primary.waves-button.disabled {
  background-color: #b0b2b4;
  color: #ffffff;
  text-transform: uppercase;
}

.btn-primary.waves-button:disabled {
  background-color: #b0b2b4;
  color: #ffffff;
  text-transform: uppercase;
}

.btn-alternate.waves-button {
  background-color: #0099cc;
  color: #ffffff;
  text-transform: uppercase;
}

.btn-alternate.waves-button:disabled {
  background-color: #b0b2b4;
  color: #ffffff;
  text-transform: uppercase;
}

.wateryear-sunny, .wateryear-normal, .wateryear-rainy {
  transition: color 1s;
  border-color: #ffffff;
  border-width: 2px;
  border-radius: 5px;
}

/* Highlight animations. */
.wateryear-sunny:hover {
  color: #cccc00;
  border-color: white;
}

.wateryear-normal:hover {
  color: #0099cc;
}

.wateryear-rainy:hover {
  color: #0099ff;
}

@-webkit-keyframes wateryear-sunny-activity {
  0% {
    color: #cccc00;
    border-color: #ffffff;
  }
  100% {
    color: #ffffff;
    background-color: #cccc00;
    border-color: #003333;
    border-radius: 5px;
  }
}

@-moz-keyframes wateryear-sunny-activity {
  0% {
    color: #cccc00;
    border: solid 2px #ffffff;
  }
  100% {
    color: #ffffff;
    background-color: #cccc00;
    border: solid 2px #003333;
    border-radius: 5px;
  }
}

@keyframes wateryear-sunny-activity {
  0% {
    color: #cccc00;
    border: solid 2px #ffffff;
  }
  100% {
    color: #ffffff;
    background-color: #cccc00;
    border: solid 2px #003333;
    border-radius: 5px;
  }
}

@-webkit-keyframes wateryear-normal-activity {
  0% {
    color: #0099cc;
    border: solid 2px #ffffff;
  }
  100% {
    color: #ffffff;
    background-color: #0099cc;
    border: solid 2px #003333;
    border-radius: 5px;
  }
}

@-moz-keyframes wateryear-normal-activity {
  0% {
    color: #0099cc;
    border: solid 2px #ffffff;
  }
  100% {
    color: #ffffff;
    background-color: #0099cc;
    border: solid 2px #003333;
    border-radius: 5px;
  }
}

@keyframes wateryear-normal-activity {
  0% {
    color: #0099cc;
    border: solid 2px #ffffff;
  }
  100% {
    color: #ffffff;
    background-color: #0099cc;
    border: solid 2px #003333;
    border-radius: 5px;
  }
}

@-webkit-keyframes wateryear-rainy-activity {
  0% {
    color: #0099ff;
    border: solid 2px #ffffff;
  }
  100% {
    color: #ffffff;
    background-color: #0099ff;
    border: solid 2px #003333;
    border-radius: 5px;
  }
}

@-moz-keyframes wateryear-rainy-activity {
  0% {
    color: #0099ff;
    border: solid 2px #ffffff;
  }
  100% {
    color: #ffffff;
    background-color: #0099ff;
    border: solid 2px #003333;
    border-radius: 5px;
  }
}

@keyframes wateryear-rainy-activity {
  0% {
    color: #0099ff;
    border: solid 2px #ffffff;
  }
  100% {
    color: #ffffff;
    background-color: #0099ff;
    border: solid 2px #003333;
    border-radius: 5px;
  }
}

.wateryear-sunny-active {
  -webkit-animation: wateryear-sunny-activity 1s;
  -moz-animation: wateryear-sunny-activity 1s;
  animation: wateryear-sunny-activity 1s;
  -webkit-animation-fill-mode: forwards;
  -moz-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
  /*color: yellow;
    background-color: #b0b2b4;
    border: solid 2px #003333;
    border-radius: 5px;*/
}

.wateryear-normal-active {
  -webkit-animation: wateryear-normal-activity 1s;
  -moz-animation: wateryear-normal-activity 1s;
  animation: wateryear-normal-activity 1s;
  -webkit-animation-fill-mode: forwards;
  -moz-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
}

.wateryear-rainy-active {
  -webkit-animation: wateryear-rainy-activity 1s;
  -moz-animation: wateryear-rainy-activity 1s;
  animation: wateryear-rainy-activity 1s;
  -webkit-animation-fill-mode: forwards;
  -moz-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
  /*background-color: #0099ff;
    color: white;
    border: solid 2px #003333;
    border-radius: 5px;*/
}

[ng\:cloak], [ng-cloak], .ng-cloak {
  display: none !important;
}

/* 
  Allow angular.js to be loaded in body, hiding cloaked elements until 
  templates compile.  The !important is important given that there may be 
  other selectors that are more specific or come later and might alter display.  
 */
.faded {
  color: #bbbbbb;
}

/* Shouldn't have had to make this.....*/
.right-float {
  float:right;
}