/* Fundamental colours
   ======================== */
/* Themeable colours 
   ======================== */
.button-shadow {
  -webkit-box-shadow: 0px 2px 3px 0px rgba(0, 0, 0, 0.2);
  -moz-box-shadow: 0px 2px 3px 0px rgba(0, 0, 0, 0.2);
  box-shadow: 0px 2px 3px 0px rgba(0, 0, 0, 0.2);
}
/* Mixins
   ======================== */
/* Sizes
   ======================== */
/* Buttons
======================== */
.markdown-container a,
.btn,
.radio-button-strip label span {
  font-weight: normal;
  text-decoration: none;
  border: none;
  background-color: white;
  color: green;
  cursor: pointer;
  display: inline-block;
  vertical-align: middle;
  font-family: 'Lato', sans-serif;
  font-size: 0.875rem;
  padding: 0.5em 1em;
  position: relative;
  overflow: hidden;
  line-height: 1em;
  white-space: nowrap;
  border: solid 1px #348b41;
  border-radius: 8px;
  transition: all 0.3s ease-in-out;
  min-width: 3.5em;
  text-align: center;
}
.markdown-container a.narrow,
.btn.narrow,
.radio-button-strip label span.narrow {
  padding: 11px 9px 9px;
  text-wrap: wrap;
}
.markdown-container a:not(.narrow),
.btn:not(.narrow),
.radio-button-strip label span:not(.narrow) {
  margin: 2px 0;
}
.markdown-container a i,
.btn i,
.radio-button-strip label span i {
  font-size: 1.6em;
  vertical-align: middle;
  margin-top: -10px;
  margin-bottom: -8px;
}
.markdown-container a i:not(.nospacing),
.btn i:not(.nospacing),
.radio-button-strip label span i:not(.nospacing) {
  margin-right: 0.25em;
}
.markdown-container a i.right,
.btn i.right,
.radio-button-strip label span i.right {
  margin-left: 0.25em;
  margin-right: 0;
}
.markdown-container a.nospacing,
.btn.nospacing,
.radio-button-strip label span.nospacing {
  margin-right: 0;
}
.markdown-container a:hover,
.btn:hover,
.radio-button-strip label span:hover {
  background-color: #348b41;
  color: white;
  text-decoration: none;
}
.markdown-container a.btn-primary,
.btn.btn-primary,
.radio-button-strip label span.btn-primary {
  background-color: #348b41;
  color: white;
}
.markdown-container a.btn-primary:hover,
.btn.btn-primary:hover,
.radio-button-strip label span.btn-primary:hover {
  background-color: #42b052;
  color: white;
  text-decoration: none;
}
.markdown-container a.destructive,
.btn.destructive,
.radio-button-strip label span.destructive,
.markdown-container a.destructive.btn-primary,
.btn.destructive.btn-primary,
.radio-button-strip label span.destructive.btn-primary {
  background-color: #ac2000;
  color: white;
}
.markdown-container a.destructive:hover,
.btn.destructive:hover,
.radio-button-strip label span.destructive:hover,
.markdown-container a.destructive.btn-primary:hover,
.btn.destructive.btn-primary:hover,
.radio-button-strip label span.destructive.btn-primary:hover {
  background-color: #df2900;
  text-decoration: none;
  color: white;
}
.markdown-container a:disabled,
.btn:disabled,
.radio-button-strip label span:disabled,
.markdown-container a.btn-primary:disabled,
.btn.btn-primary:disabled,
.radio-button-strip label span.btn-primary:disabled,
.markdown-container a.destructive:disabled,
.btn.destructive:disabled,
.radio-button-strip label span.destructive:disabled {
  background-color: #e0e0e0;
  color: #c7c7c7;
  border-color: #c7c7c7;
  cursor: default;
}
.markdown-container a.dialog-option,
.btn.dialog-option,
.radio-button-strip label span.dialog-option {
  display: block;
  width: 100%;
  padding: 0.5em 0;
  margin: 0 0 0.25em 0;
}
.markdown-container a.dialog-option i,
.btn.dialog-option i,
.radio-button-strip label span.dialog-option i {
  position: absolute;
  left: 0.75em;
}
.markdown-container a.dialog-option [class*='icon-']:before,
.btn.dialog-option [class*='icon-']:before,
.radio-button-strip label span.dialog-option [class*='icon-']:before {
  top: 0;
}
.markdown-container a .button-title,
.btn .button-title,
.radio-button-strip label span .button-title {
  display: block;
  font-size: 1.2em;
  margin: 10px 0 0.4em 0;
  font-weight: bold;
}
.markdown-container a .button-message,
.btn .button-message,
.radio-button-strip label span .button-message {
  display: block;
  margin: 0.8em 10px 10px 10px;
  margin-bottom: 10px;
  font-size: 0.8em;
  max-width: 28em;
  word-wrap: break-word;
  white-space: normal;
  text-wrap: normal;
}
.markdown-container a.btn-lg,
.btn.btn-lg,
.radio-button-strip label span.btn-lg {
  font-size: 1.4em;
}
.markdown-container a.btn-lg i,
.btn.btn-lg i,
.radio-button-strip label span.btn-lg i {
  font-size: 1.2em;
}
.radio-button-strip label input[type=radio]:disabled + span,
.radio-button-strip label input[type=radio]:disabled + span:hover {
  background-color: #e0e0e0;
  color: #c7c7c7;
  border-color: #c7c7c7;
  cursor: default;
}
.date-wrapper {
  width: 12rem;
  display: inline-block;
  position: relative;
}
.date-wrapper input {
  padding-right: 2.5em;
}
.date-wrapper .btn {
  position: absolute;
  top: 3px;
  bottom: 3px;
  right: 1px;
  border: none;
  padding: 8px;
  background-color: #f0f0f0;
}
.date-wrapper .btn:hover {
  background-color: #199FFF;
  color: white;
  border-color: transparent;
}
.date-wrapper .btn i {
  margin: 0;
  position: relative;
  top: -2px;
}
.highlight-animation:not([disabled])::before {
  content: "";
  position: absolute;
  opacity: 0;
  left: 0;
  top: 50%;
  width: 100%;
  padding-top: 100%;
  margin-top: -50%;
  background-image: radial-gradient(circle, rgba(255, 255, 255, 0) 30%, #ffffff 55%, #ffffff 65%, rgba(255, 255, 255, 0) 72%);
  border-radius: 100%;
  -webkit-animation: highlight 2.5s ease-out infinite normal;
  -moz-animation: highlight 2.5s ease-out infinite normal;
  -o-animation: highlight 2.5s ease-out infinite normal;
  animation: highlight 2.5s ease-out infinite;
}
@-webkit-keyframes highlight {
  0% {
    opacity: 0;
    left: 50%;
    width: 0%;
    padding-top: 0%;
    margin-top: 0%;
  }
  40% {
    opacity: 0.3;
  }
  80% {
    opacity: 0;
    left: -25%;
    width: 150%;
    padding-top: 150%;
    margin-top: -75%;
  }
}
@-moz-keyframes highlight {
  0% {
    opacity: 0;
    left: 50%;
    width: 0%;
    padding-top: 0%;
    margin-top: 0%;
  }
  40% {
    opacity: 0.3;
  }
  80% {
    opacity: 0;
    left: -25%;
    width: 150%;
    padding-top: 150%;
    margin-top: -75%;
  }
}
@-o-keyframes highlight {
  0% {
    opacity: 0;
    left: 50%;
    width: 0%;
    padding-top: 0%;
    margin-top: 0%;
  }
  40% {
    opacity: 0.3;
  }
  80% {
    opacity: 0;
    left: -25%;
    width: 150%;
    padding-top: 150%;
    margin-top: -75%;
  }
}
@keyframes highlight {
  0% {
    opacity: 0;
    left: 50%;
    width: 0%;
    padding-top: 0%;
    margin-top: 0%;
  }
  40% {
    opacity: 0.3;
  }
  80% {
    opacity: 0;
    left: -25%;
    width: 150%;
    padding-top: 150%;
    margin-top: -75%;
  }
}