/**
  * bootstrap-switch - Turn checkboxes and radio buttons into toggle switches.
  *
  * @version v3.3.4
  * @homepage https://bttstrp.github.io/bootstrap-switch
  * @author Mattia Larentis <mattia@larentis.eu> (http://larentis.eu)
  * @license Apache-2.0
  */
.bootstrap-switch {
  display: inline-block;
  direction: ltr;
  cursor: pointer;
  border-radius: 30px;
  border: 0;
  position: relative;
  text-align: left;
  overflow: hidden;
  margin-bottom: 5px;
  line-height: 8px;
  width: 61px !important;
  height: 26px;
  outline: none;
  z-index: 0;
  margin-right: 1px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  vertical-align: middle;
  -webkit-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
  transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s; }

.bootstrap-switch .bootstrap-switch-container {
  display: inline-flex;
  top: 0;
  height: 26px;
  border-radius: 4px;
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
  width: 100px !important; }

.bootstrap-switch .bootstrap-switch-handle-on,
.bootstrap-switch .bootstrap-switch-handle-off,
.bootstrap-switch .bootstrap-switch-label {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  cursor: pointer;
  display: inline-block !important;
  height: 100%;
  color: #fff;
  padding: 6px 12px;
  font-size: 11px;
  text-indent: -5px;
  line-height: 15px;
  -webkit-transition: 0.25s ease-out;
  transition: 0.25s ease-out; }

.bootstrap-switch .bootstrap-switch-handle-on i,
.bootstrap-switch .bootstrap-switch-handle-off i,
.bootstrap-switch .bootstrap-switch-label i {
  font-size: 12px;
  line-height: 14px; }

.bootstrap-switch .bootstrap-switch-handle-on,
.bootstrap-switch .bootstrap-switch-handle-off {
  text-align: center;
  z-index: 1;
  float: left;
  width: 50% !important;
  background-color: #23CCEF; }

.bootstrap-switch .bootstrap-switch-handle-off {
  background-color: #DDDDDD; }

.bootstrap-switch .bootstrap-switch-label {
  text-align: center;
  z-index: 100;
  color: #333333;
  background: #ffffff;
  width: 22px !important;
  height: 22px;
  margin: 2px -11px;
  border-radius: 12px;
  position: relative;
  float: left;
  padding: 0;
  background-color: #FFFFFF;
  box-shadow: 0 1px 1px #FFFFFF inset, 0 1px 1px rgba(0, 0, 0, 0.25); }

.bootstrap-switch .bootstrap-switch-handle-on {
  border-bottom-left-radius: 3px;
  border-top-left-radius: 3px; }

.bootstrap-switch .bootstrap-switch-handle-off {
  text-indent: 6px; }

.bootstrap-switch input[type='radio'],
.bootstrap-switch input[type='checkbox'] {
  position: absolute !important;
  top: 0;
  left: 0;
  opacity: 0;
  filter: alpha(opacity=0);
  z-index: -1; }

.bootstrap-switch.bootstrap-switch-off .bootstrap-switch-handle-on {
  background-color: #DDDDDD; }

.bootstrap-switch.bootstrap-switch-on .bootstrap-switch-handle-off {
  background-color: #23CCEF; }

.bootstrap-switch.bootstrap-switch-animate .bootstrap-switch-container {
  -webkit-transition: margin-left 0.5s;
  transition: margin-left 0.5s; }

.bootstrap-switch.bootstrap-switch-on .bootstrap-switch-container {
  margin-left: -2px !important; }

.bootstrap-switch.bootstrap-switch-off .bootstrap-switch-container {
  margin-left: -37px !important; }

.bootstrap-switch.bootstrap-switch-on:hover .bootstrap-switch-label {
  width: 26px !important;
  margin: 2px -15px; }

.bootstrap-switch.bootstrap-switch-off:hover .bootstrap-switch-label {
  width: 26px !important;
  margin: 2px -15px -13px -11px; }

/**************************/
/* STYLES FOR THE SPINNER */
/**************************/
/*
 * Constants:
 *      STROKEWIDTH = 3px
 *      ARCSIZE     = 270 degrees (amount of circle the arc takes up)
 *      ARCTIME     = 1333ms (time it takes to expand and contract arc)
 *      ARCSTARTROT = 216 degrees (how much the start location of the arc
 *                                should rotate each time, 216 gives us a
 *                                5 pointed star shape (it's 360/5 * 3).
 *                                For a 7 pointed star, we might do
 *                                360/7 * 3 = 154.286)
 *      CONTAINERWIDTH = 28px
 *      SHRINK_TIME = 400ms
 */
.fit {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0; }

.hidden {
  opacity: 0;
  transition: opacity 1s linear; }

.spinnerContainer {
  width: 100%;
  height: 100%;
  /* duration: 360 * ARCTIME / (ARCSTARTROT + (360-ARCSIZE)) */
  -webkit-animation: container-rotate 1568ms linear infinite;
  animation: container-rotate 1568ms linear infinite; }

@-webkit-keyframes container-rotate {
  to {
    -webkit-transform: rotate(360deg); } }
@keyframes container-rotate {
  to {
    transform: rotate(360deg); } }
.spinner-layer {
  position: absolute;
  width: 100%;
  height: 100%;
  opacity: 1;
  -webkit-animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both;
  animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both; }

/**
 * IMPORTANT NOTE ABOUT CSS ANIMATION PROPERTIES (keanulee):
 *
 * iOS Safari (tested on iOS 8.1) does not handle animation-delay very well - it doesn't
 * guarantee that the animation will start _exactly_ after that value. So we avoid using
 * animation-delay and instead set custom keyframes for each color (as redundant as it
 * seems).
 *
 * We write out each animation in full (instead of separating animation-name,
 * animation-duration, etc.) because under the polyfill, Safari does not recognize those
 * specific properties properly, treats them as -webkit-animation, and overrides the
 * other animation rules. See https://github.com/Polymer/platform/issues/53.
 */
.spinner-layer.first-elem {
  /* durations: 4 * ARCTIME */
  -webkit-animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both, first-elem-fade-in-out 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both;
  animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both, first-elem-fade-in-out 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both; }

.spinner-layer.second-elem {
  /* durations: 4 * ARCTIME */
  -webkit-animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both, second-elem-fade-in-out 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both;
  animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both, second-elem-fade-in-out 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both; }

.spinner-layer.third-elem {
  /* durations: 4 * ARCTIME */
  -webkit-animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both, third-elem-fade-in-out 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both;
  animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both, third-elem-fade-in-out 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both; }

.spinner-layer.fourth-elem {
  /* durations: 4 * ARCTIME */
  -webkit-animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both, fourth-elem-fade-in-out 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both;
  animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both, fourth-elem-fade-in-out 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both; }

@-webkit-keyframes fill-unfill-rotate {
  12.5% {
    -webkit-transform: rotate(135deg); }
  /* 0.5 * ARCSIZE */
  25% {
    -webkit-transform: rotate(270deg); }
  /* 1   * ARCSIZE */
  37.5% {
    -webkit-transform: rotate(405deg); }
  /* 1.5 * ARCSIZE */
  50% {
    -webkit-transform: rotate(540deg); }
  /* 2   * ARCSIZE */
  62.5% {
    -webkit-transform: rotate(675deg); }
  /* 2.5 * ARCSIZE */
  75% {
    -webkit-transform: rotate(810deg); }
  /* 3   * ARCSIZE */
  87.5% {
    -webkit-transform: rotate(945deg); }
  /* 3.5 * ARCSIZE */
  to {
    -webkit-transform: rotate(1080deg); }
  /* 4   * ARCSIZE */ }
@keyframes fill-unfill-rotate {
  12.5% {
    transform: rotate(135deg); }
  /* 0.5 * ARCSIZE */
  25% {
    transform: rotate(270deg); }
  /* 1   * ARCSIZE */
  37.5% {
    transform: rotate(405deg); }
  /* 1.5 * ARCSIZE */
  50% {
    transform: rotate(540deg); }
  /* 2   * ARCSIZE */
  62.5% {
    transform: rotate(675deg); }
  /* 2.5 * ARCSIZE */
  75% {
    transform: rotate(810deg); }
  /* 3   * ARCSIZE */
  87.5% {
    transform: rotate(945deg); }
  /* 3.5 * ARCSIZE */
  to {
    transform: rotate(1080deg); }
  /* 4   * ARCSIZE */ }
@-webkit-keyframes first-elem-fade-in-out {
  from {
    opacity: 1; }
  25% {
    opacity: 1; }
  26% {
    opacity: 0; }
  89% {
    opacity: 0; }
  90% {
    opacity: 1; }
  100% {
    opacity: 1; } }
@keyframes first-elem-fade-in-out {
  from {
    opacity: 1; }
  25% {
    opacity: 1; }
  26% {
    opacity: 0; }
  89% {
    opacity: 0; }
  90% {
    opacity: 1; }
  100% {
    opacity: 1; } }
@-webkit-keyframes second-elem-fade-in-out {
  from {
    opacity: 0; }
  15% {
    opacity: 0; }
  25% {
    opacity: 1; }
  50% {
    opacity: 1; }
  51% {
    opacity: 0; } }
@keyframes second-elem-fade-in-out {
  from {
    opacity: 0; }
  15% {
    opacity: 0; }
  25% {
    opacity: 1; }
  50% {
    opacity: 1; }
  51% {
    opacity: 0; } }
@-webkit-keyframes third-elem-fade-in-out {
  from {
    opacity: 0; }
  40% {
    opacity: 0; }
  50% {
    opacity: 1; }
  75% {
    opacity: 1; }
  76% {
    opacity: 0; } }
@keyframes third-elem-fade-in-out {
  from {
    opacity: 0; }
  40% {
    opacity: 0; }
  50% {
    opacity: 1; }
  75% {
    opacity: 1; }
  76% {
    opacity: 0; } }
@-webkit-keyframes fourth-elem-fade-in-out {
  from {
    opacity: 0; }
  65% {
    opacity: 0; }
  75% {
    opacity: 1; }
  90% {
    opacity: 1; }
  100% {
    opacity: 0; } }
@keyframes fourth-elem-fade-in-out {
  from {
    opacity: 0; }
  65% {
    opacity: 0; }
  75% {
    opacity: 1; }
  90% {
    opacity: 1; }
  100% {
    opacity: 0; } }
/**
 * Patch the gap that appear between the two adjacent div.circle-clipper while the
 * spinner is rotating (appears on Chrome 38, Safari 7.1, and IE 11).
 */
.gap-patch {
  position: absolute;
  box-sizing: border-box;
  top: 0;
  left: 45%;
  width: 10%;
  height: 100%;
  overflow: hidden;
  border-color: inherit; }

.gap-patch .circle {
  width: 1000%;
  left: -450%; }

.circle-clipper {
  display: inline-block;
  position: relative;
  width: 50%;
  height: 100%;
  overflow: hidden;
  border-color: inherit; }

.circle-clipper .circle {
  width: 200%; }

.circle {
  box-sizing: border-box;
  height: 100%;
  border-width: 1px;
  /* STROKEWIDTH */
  border-style: solid;
  border-color: inherit;
  border-bottom-color: transparent !important;
  border-radius: 50%;
  -webkit-animation: none;
  animation: none; }

.circle-clipper.left .circle {
  border-right-color: transparent !important;
  -webkit-transform: rotate(129deg);
  transform: rotate(129deg); }

.circle-clipper.right .circle {
  left: -100%;
  border-left-color: transparent !important;
  -webkit-transform: rotate(-129deg);
  transform: rotate(-129deg); }

.circle-clipper.left .circle {
  /* duration: ARCTIME */
  -webkit-animation: left-spin 1333ms cubic-bezier(0.4, 0, 0.2, 1) infinite both;
  animation: left-spin 1333ms cubic-bezier(0.4, 0, 0.2, 1) infinite both; }

.circle-clipper.right .circle {
  /* duration: ARCTIME */
  -webkit-animation: right-spin 1333ms cubic-bezier(0.4, 0, 0.2, 1) infinite both;
  animation: right-spin 1333ms cubic-bezier(0.4, 0, 0.2, 1) infinite both; }

@-webkit-keyframes left-spin {
  from {
    -webkit-transform: rotate(130deg); }
  50% {
    -webkit-transform: rotate(-5deg); }
  to {
    -webkit-transform: rotate(130deg); } }
@keyframes left-spin {
  from {
    transform: rotate(130deg); }
  50% {
    transform: rotate(-5deg); }
  to {
    transform: rotate(130deg); } }
@-webkit-keyframes right-spin {
  from {
    -webkit-transform: rotate(-130deg); }
  50% {
    -webkit-transform: rotate(5deg); }
  to {
    -webkit-transform: rotate(-130deg); } }
@keyframes right-spin {
  from {
    transform: rotate(-130deg); }
  50% {
    transform: rotate(5deg); }
  to {
    transform: rotate(-130deg); } }
.shimmer {
  background: #f6f7f8;
  background-image: linear-gradient(to right, #f6f7f8 0%, #edeef1 20%, #f6f7f8 40%, #f6f7f8 100%);
  background-repeat: no-repeat;
  -webkit-animation-duration: 1s;
  -webkit-animation-fill-mode: forwards;
  -webkit-animation-iteration-count: infinite;
  -webkit-animation-name: placeholderShimmer;
  -webkit-animation-timing-function: linear; }

@-webkit-keyframes placeholderShimmer {
  0% {
    background-position: -468px 0; }
  100% {
    background-position: 468px 0; } }
/*!
 * https://github.com/YouCanBookMe/react-datetime
 */
.rdt {
  position: relative; }

.rdtPicker {
  display: none;
  position: absolute;
  width: 250px;
  padding: 4px;
  margin-top: 1px;
  z-index: 99999 !important;
  background: #fff;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
  border: 1px solid #f9f9f9; }

.rdtOpen .rdtPicker {
  display: block; }

.rdtStatic .rdtPicker {
  box-shadow: none;
  position: static; }

.rdtPicker .rdtTimeToggle {
  text-align: center; }

.rdtPicker table {
  width: 100%;
  margin: 0; }

.rdtPicker td,
.rdtPicker th {
  text-align: center;
  height: 28px; }

.rdtPicker td {
  cursor: pointer; }

.rdtPicker td.rdtDay:hover,
.rdtPicker td.rdtHour:hover,
.rdtPicker td.rdtMinute:hover,
.rdtPicker td.rdtSecond:hover,
.rdtPicker .rdtTimeToggle:hover {
  background: #eeeeee;
  cursor: pointer; }

.rdtPicker td.rdtOld,
.rdtPicker td.rdtNew {
  color: #999999; }

.rdtPicker td.rdtToday {
  position: relative; }

.rdtPicker td.rdtToday:before {
  content: '';
  display: inline-block;
  border-left: 7px solid transparent;
  border-bottom: 7px solid #428bca;
  border-top-color: rgba(0, 0, 0, 0.2);
  position: absolute;
  bottom: 4px;
  right: 4px; }

.rdtPicker td.rdtActive,
.rdtPicker td.rdtActive:hover {
  background-color: #428bca;
  color: #fff;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25); }

.rdtPicker td.rdtActive.rdtToday:before {
  border-bottom-color: #fff; }

.rdtPicker td.rdtDisabled,
.rdtPicker td.rdtDisabled:hover {
  background: none;
  color: #999999;
  cursor: not-allowed; }

.rdtPicker td span.rdtOld {
  color: #999999; }

.rdtPicker td span.rdtDisabled,
.rdtPicker td span.rdtDisabled:hover {
  background: none;
  color: #999999;
  cursor: not-allowed; }

.rdtPicker th {
  border-bottom: 1px solid #f9f9f9; }

.rdtPicker .dow {
  width: 14.2857%;
  border-bottom: none;
  cursor: default; }

.rdtPicker th.rdtSwitch {
  width: 100px; }

.rdtPicker th.rdtNext,
.rdtPicker th.rdtPrev {
  font-size: 21px;
  vertical-align: top; }

.rdtPrev span,
.rdtNext span {
  display: block;
  -webkit-touch-callout: none;
  /* iOS Safari */
  -webkit-user-select: none;
  /* Chrome/Safari/Opera */
  -khtml-user-select: none;
  /* Konqueror */
  -moz-user-select: none;
  /* Firefox */
  -ms-user-select: none;
  /* Internet Explorer/Edge */
  user-select: none; }

.rdtPicker th.rdtDisabled,
.rdtPicker th.rdtDisabled:hover {
  background: none;
  color: #999999;
  cursor: not-allowed; }

.rdtPicker thead tr:first-child th {
  cursor: pointer; }

.rdtPicker thead tr:first-child th:hover {
  background: #eeeeee; }

.rdtPicker tfoot {
  border-top: 1px solid #f9f9f9; }

.rdtPicker button {
  border: none;
  background: none;
  cursor: pointer; }

.rdtPicker button:hover {
  background-color: #eee; }

.rdtPicker thead button {
  width: 100%;
  height: 100%; }

td.rdtMonth,
td.rdtYear {
  height: 50px;
  width: 25%;
  cursor: pointer; }

td.rdtMonth:hover,
td.rdtYear:hover {
  background: #eee; }

.rdtCounters {
  display: inline-block; }

.rdtCounters > div {
  float: left; }

.rdtCounter {
  height: 100px; }

.rdtCounter {
  width: 40px; }

.rdtCounterSeparator {
  line-height: 100px; }

.rdtCounter .rdtBtn {
  height: 40%;
  line-height: 40px;
  cursor: pointer;
  display: block;
  -webkit-touch-callout: none;
  /* iOS Safari */
  -webkit-user-select: none;
  /* Chrome/Safari/Opera */
  -khtml-user-select: none;
  /* Konqueror */
  -moz-user-select: none;
  /* Firefox */
  -ms-user-select: none;
  /* Internet Explorer/Edge */
  user-select: none; }

.rdtCounter .rdtBtn:hover {
  background: #eee; }

.rdtCounter .rdtCount {
  height: 20%;
  font-size: 1.2em; }

.rdtMilli {
  vertical-align: middle;
  padding-left: 8px;
  width: 48px; }

.rdtMilli input {
  width: 100%;
  font-size: 1.2em;
  margin-top: 37px; }

.rdtTime td {
  cursor: default; }

.full-page-background {
  position: absolute;
  z-index: -1;
  height: 100%;
  width: 100%;
  display: block;
  top: 0;
  left: 0;
  background: linear-gradient(0deg, rgba(0, 0, 0, 0.85), rgba(15, 21, 53, 0.89)), url(/assets/img/nyt-bg.jpg) center/cover no-repeat; }

.login-form {
  margin-top: 22vh; }

form.login {
  color: #5d5d5d;
  background: #FFF;
  padding: 26px;
  box-shadow: 0 0 3px rgba(0, 0, 0, 0.5); }

form.login img {
  display: block;
  margin: 0 auto;
  margin-bottom: 35px; }

form.login input,
form.login button {
  font-size: 18px;
  margin: 16px 0; }

.form-links {
  text-align: center;
  margin-top: 1em;
  margin-bottom: 50px; }

.form-links a {
  color: #fff; }

.login__errors {
  padding: 10px;
  color: white;
  text-align: center;
  background: #E84A4A;
  box-shadow: 0 0 5px black;
  margin-top: 20px;
  display: none; }

.login__errors--open {
  display: block; }

.login-form__field-validation {
  text-align: left;
  position: relative;
  top: -10px;
  left: 10px; }

.login-form__links {
  display: flex;
  text-align: center; }

.login-form__links_link {
  flex: 1; }

/* VARIABLES */
/*Pad the Font Awesome icons a bit*/
i.fas.left,
i.far.left {
  padding-right: 7px; }

i.fas.right,
i.far.right {
  padding-left: 7px; }

.alert {
  color: #555 !important;
  padding: 10% !important; }

.alert-info-text {
  font-size: 80%; }

i.reorder {
  color: #9A9A9A;
  text-align: center;
  vertical-align: middle;
  margin-left: 30px; }

.has-error .form-control, .has-error .form-control:focus {
  border-color: #FF4A55;
  background: rgba(255, 74, 85, 0.1); }
.has-warning .form-control, .has-warning .form-control:focus {
  border-color: #FF9500;
  background: rgba(255, 149, 0, 0.2); }
.has-success .form-control, .has-success .form-control:focus {
  color: #87CB16; }
.has-success .form-control:focus {
  border-color: #87CB16; }
.has-error .form-control {
  color: #FF4A55; }

.has-error .Select-control, .has-error .Select-control:focus {
  border-color: #FF4A55 !important;
  background: rgba(255, 74, 85, 0.1) !important; }
.has-warning .Select-control, .has-warning .Select-control:focus {
  border-color: #FF9500 !important;
  background: rgba(255, 149, 0, 0.2) !important; }
.has-success .Select-control, .has-success .Select-control:focus {
  color: #87CB16 !important; }
.has-success .Select-control:focus {
  border-color: #87CB16 !important; }
.has-error .Select-control {
  color: #FF4A55 !important; }

.has-warning textarea, .has-warning textarea:focus {
  border-color: #FF9500 !important;
  background: rgba(255, 149, 0, 0.2) !important; }

.main-panel {
  background: #404448; }

.card {
  background: #fbfbfb; }

a {
  color: #337ab7; }

.light {
  color: #E3E3E3; }

.thumbnail {
  margin-bottom: 5px; }

.nyt-thumbnail {
  border: 1px solid #E3E3E3;
  border-radius: 1%; }

input[type=checkbox] {
  /* Larger Checkboxes */
  -ms-transform: scale(1.5);
  /* IE */
  -moz-transform: scale(1.5);
  /* FF */
  -webkit-transform: scale(1.5);
  /* Safari and Chrome */
  -o-transform: scale(1.5);
  /* Opera */
  transform: scale(1.5);
  padding: 10px;
  margin-left: 8px; }

/* Override the default bootstrap padding on labels */
.checkbox {
  margin-top: 30px !important; }
  .checkbox input {
    display: block !important; }

.label.label-selector {
  background-color: #e4e4e4;
  color: #676767;
  border: 1px solid #E3E3E3;
  font-weight: 400;
  margin-right: 5px; }

.fullscreen-textarea-container div.controls {
  display: none; }
.fullscreen-textarea-container button {
  display: none; }
.fullscreen-textarea-container:hover button {
  display: inline; }

.fullscreen-textarea-container--active {
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  display: flex;
  padding: 60px;
  background-color: rgba(0, 0, 0, 0.75);
  z-index: 999;
  flex-direction: column; }
  .fullscreen-textarea-container--active div {
    flex: 1; }
    .fullscreen-textarea-container--active div textarea {
      height: 100% !important; }
  .fullscreen-textarea-container--active div.controls {
    margin-top: 10px; }

.search-form {
  /* Default style */
  /* Style when text is present */ }
  .search-form input.notify[type="text"] {
    background-color: #fff; }
  .search-form input.notify[type="text"]:valid {
    background-color: #dfeff3; }

.content-tools-palette {
  height: 70px;
  overflow: hidden;
  transition: height, 0.3s linear;
  color: #9A9A9A;
  padding-right: 20px; }
  .content-tools-palette span {
    font-size: 0.9em; }
  .content-tools-palette .btn {
    background-color: #FFF;
    color: #337ABA;
    border-color: #FFF;
    padding: 8px 16px; }
  .content-tools-palette .btn[disabled] {
    color: #777;
    border-color: #fff; }

.content-tools-palette.open {
  height: 165px;
  transition: height, 0.3s linear; }

.story-action-palette {
  height: 87px;
  overflow: hidden;
  padding: 10px;
  transition: height, 0.3s linear;
  color: #9A9A9A;
  border: 3px solid #999;
  border-radius: 15px;
  width: 451px;
  background: #fff;
  position: fixed;
  z-index: 1000;
  box-shadow: 0.4rem 0.4rem 0.45rem rgba(0, 0, 30, 0.3); }
  .story-action-palette span {
    font-size: 0.9em; }
  .story-action-palette .btn {
    color: #337ABA;
    border-color: #fff;
    padding: 8px 18px; }
  .story-action-palette .btn[disabled] {
    color: #777;
    border-color: #fff; }
  .story-action-palette .collapse-palette {
    margin: -10px 0 0 0;
    padding: 0; }
  .story-action-palette .expand-palette {
    margin: -10px 0 0 0;
    padding: 0; }

.story-action-palette.collapsed {
  overflow: hidden;
  transition: height, 0.3s linear;
  width: 121px; }

.story-action-palette.open {
  height: 165px;
  transition: height, 0.3s linear; }

.palette-position {
  height: 75px; }
  .palette-position .options {
    border: 3px solid #9A9A9A;
    background-color: #ECECEC;
    border-radius: 4px;
    height: 70px; }
    .palette-position .options .btn-lopleft {
      top: 0;
      left: 0;
      position: absolute; }
    .palette-position .options .btn-topright {
      top: 0;
      right: 0%;
      position: absolute; }
    .palette-position .options .btn-bottomleft {
      bottom: 0%;
      left: 0;
      position: absolute; }
    .palette-position .options .btn-bottomright {
      bottom: 0%;
      right: 0%;
      position: absolute; }
  .palette-position .btn {
    border: rgba(255, 74, 85, 0.1);
    margin: -1px 1px -3px 1px;
    padding: 0px; }
  .palette-position span {
    margin-top: 4px;
    text-align: right;
    color: #777; }

.top-left {
  top: 60px;
  left: 20px; }

.top-right {
  top: 60px;
  right: 20px; }

.bottom-left {
  bottom: 60px;
  left: 20px; }

.bottom-right {
  bottom: 60px;
  right: 20px; }

.action-buttons {
  height: 55px;
  overflow: hidden;
  padding: 5px;
  transition: height, 0.3s linear;
  color: #9A9A9A; }

.action-buttons.open {
  height: 130px;
  transition: height, 0.3s linear; }

.delete-confirmation {
  overflow: hidden;
  text-align: right;
  margin-top: 5px;
  margin-right: 5px; }
  .delete-confirmation .btn {
    color: #fff;
    background-color: #FF4A55;
    border-color: #c31620;
    padding: 4px 8px; }

.cut-action-buttons {
  height: 37px;
  width: 40px;
  overflow: hidden;
  padding: 5px;
  margin-top: -5px;
  transition: width, 0.3s linear;
  color: #9A9A9A; }
  .cut-action-buttons span {
    padding-right: 5px; }

.cut-action-buttons.open {
  width: 330px;
  transition: width, 0.3s linear; }

.downloads {
  padding: 0 5px;
  display: inline-block;
  position: relative; }
  .downloads a {
    text-decoration: none;
    color: #333; }

.download-action-panel {
  border: 1px solid #ECECEC;
  top: 200%;
  right: -250%;
  min-width: 85px;
  transform: translate(0, -50%);
  padding: 15px;
  color: #fff;
  background-color: #888;
  font-weight: bold;
  font-size: 16px;
  line-height: 20px;
  border-radius: 8px;
  position: absolute;
  z-index: 99999999;
  box-sizing: border-box;
  box-shadow: 0 1px 8px rgba(0, 0, 0, 0.5);
  visibility: hidden;
  opacity: 0.7;
  transition: opacity 0.8s; }
  .download-action-panel a {
    text-decoration: none;
    color: #fff; }

.downloads:hover .download-action-panel {
  visibility: visible;
  opacity: 1; }

/* Search Options */
.search-bar,
.search-options {
  margin-top: 20px; }

.layout-select {
  border: 1px solid #E3E3E3;
  border-radius: 5%;
  font-weight: 400;
  color: #9A9A9A;
  padding: 5px 10px; }
  .layout-select:hover {
    color: #9A9A9A; }
  .layout-select:focus {
    color: #9A9A9A; }

.layout-select__active {
  background-color: #E3E3E3; }

.search-result-details {
  color: #9A9A9A; }

.pagination .active a {
  z-index: 0; }

.checkbox-padding {
  padding-top: 28px; }

/* Search Results*/
.search-results {
  text-align: center;
  margin-bottom: 40px; }
  .search-results span {
    color: #9A9A9A;
    font-size: 24px;
    font-weight: bold;
    display: inline-block; }

/* Story List */
.content > div.row:nth-child(odd) {
  background: #fbfbfb; }

.expanded-list {
  border-bottom: solid 1px #ececec;
  padding: 0px 15px 10px 15px; }

.story-list-row {
  display: flex;
  min-height: 90px; }

.expanded-related-media-thumbnail {
  width: 60px;
  padding: 2px;
  display: grid; }

/* non-current before embargo so embargo gets priority */
.story-list-row-non-current {
  background-color: rgba(255, 149, 0, 0.1) !important; }

.story-list-row-embargo {
  background-color: rgba(255, 74, 85, 0.1) !important; }

.selector-tags {
  width: 400px;
  padding: 0px 10px;
  word-wrap: break-word; }

.selector-favorite {
  margin: -10px 1px 12px 0; }

.story-info {
  padding-top: 15px;
  margin-left: 10px;
  padding-bottom: 5px; }

.story-compact-list .story-extra-info {
  padding-top: 10px; }
  .story-compact-list .story-extra-info div {
    margin-bottom: 2px; }

.story-list .story-extra-info {
  padding-top: 30px; }
  .story-list .story-extra-info div {
    margin-bottom: 2px; }

.related-media {
  position: relative;
  margin-top: 15px;
  margin-bottom: 15px;
  overflow: hidden; }
  .related-media p {
    font-size: 12px; }

.related-media img.portrait {
  width: 100%;
  height: auto; }

.related-media-add,
.related-media-remove {
  margin-top: 2px; }

.related-media-remove-all {
  float: right; }

.related-media-search-results {
  text-align: center;
  margin-bottom: 40px; }
  .related-media-search-results .grid {
    width: 98%;
    margin: 10px;
    padding: 10px;
    border: 1px solid #E3E3E3;
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    grid-column-gap: 6px;
    grid-auto-rows: 120px;
    grid-row-gap: 6px; }
  .related-media-search-results span {
    color: #9A9A9A;
    font-size: 24px;
    font-weight: bold;
    display: inline-block; }

.embargo-list {
  background-color: #c31620;
  padding: 5px 10px; }

.non-current-list {
  background-color: #FF9500;
  padding: 5px 10px; }

/* Story Edit */
.embargo {
  background-color: #c31620;
  padding: 5px 10px; }

.non-current {
  background-color: #FF9500;
  padding: 5px 10px; }

.non-current-info {
  margin-top: 3px;
  padding: 3px;
  font-weight: 200;
  font-size: 80%; }

.this-story {
  display: none; }

/* Photo Grid */
.photo-grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  grid-column-gap: 2px;
  grid-row-gap: 2px; }

.photo-grid__photo-cell {
  display: flex;
  align-items: center;
  overflow: hidden;
  max-height: 700px;
  background-color: #f5f5f5;
  border-radius: 1%;
  border: 1px solid #E3E3E3;
  position: relative;
  flex-direction: column; }
  .photo-grid__photo-cell img {
    width: 100%; }
  .photo-grid__photo-cell h5 {
    font-size: 14px;
    padding: 0 5px;
    margin-bottom: 5px; }
  .photo-grid__photo-cell p {
    font-size: 14px;
    color: #545454;
    padding: 0 5px; }

.photo-grid__photo-cell:after {
  content: "";
  position: absolute;
  top: 560px;
  height: 140px;
  width: 100%;
  background: -webkit-linear-gradient(#545454, #f5f5f5);
  background: linear-gradient(rgba(0, 0, 0, 0), #f5f5f5); }

/* Photo List */
.photo-cell-expired {
  background-color: rgba(255, 74, 85, 0.1) !important; }

.photo-list__photo-cell {
  align-items: center;
  overflow: hidden;
  background-color: #f7f7f7;
  border-radius: 1%;
  border: 1px solid #E3E3E3;
  position: relative;
  padding: 1em;
  margin-bottom: 0.5em; }
  .photo-list__photo-cell img {
    width: 15%;
    height: 100%;
    float: left;
    margin-right: 1em; }
  .photo-list__photo-cell h5 {
    font-size: 14px;
    padding: 0 5px;
    margin-bottom: 5px; }
  .photo-list__photo-cell p {
    font-size: 14px;
    color: #545454;
    padding: 0 5px; }

.photo-list-info {
  float: right;
  width: 80%; }

.handout {
  float: right;
  margin: 5px;
  padding: 5px 8px; }

/* Photo Edit*/
.expired {
  background-color: #c31620;
  float: right;
  padding: 12px 15px;
  margin-top: 5px; }

.expired-small {
  background-color: #c31620;
  float: left;
  margin: 5px 15px;
  padding: 6px 9px; }

.content-metadata {
  margin-top: "20px";
  margin-bottom: "15px";
  color: #FFF; }
  .content-metadata strong {
    font-size: 20px;
    line-height: 30px; }

.metadata-left {
  text-align: right;
  padding: 5px 0;
  height: 33px; }

.metadata-right {
  text-align: left;
  padding: 0 5px; }
  .metadata-right strong a {
    font-size: 15px; }

/* Cartoon Grid */
.cartoon-grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  grid-column-gap: 6px;
  grid-row-gap: 6px; }

.cartoon-grid__cartoon-cell {
  display: flex;
  align-items: center;
  overflow: hidden;
  background-color: #f7f7f7;
  position: relative;
  flex-direction: column; }
  .cartoon-grid__cartoon-cell img {
    width: 100%; }
  .cartoon-grid__cartoon-cell h5 {
    font-size: 14px;
    padding: 0 5px;
    margin-bottom: 5px; }
  .cartoon-grid__cartoon-cell p {
    font-size: 14px;
    color: #545454;
    padding: 0 5px; }

.graphic-button,
.podcast-button {
  margin-bottom: 8px; }
  .graphic-button i,
  .podcast-button i {
    width: 40px; }
  .graphic-button a,
  .podcast-button a {
    color: #e3e3e3;
    padding: 1em 1.5em; }

/* Cartoon List */
.cartoon-list__cartoon-cell {
  align-items: center;
  overflow: hidden;
  background-color: #f7f7f7;
  border-radius: 1%;
  border: 1px solid #E3E3E3;
  position: relative;
  padding: 1em;
  margin-bottom: 0.5em; }
  .cartoon-list__cartoon-cell img {
    width: 15%;
    height: 100%;
    float: left;
    margin-right: 2em; }
  .cartoon-list__cartoon-cell h5 {
    font-size: 14px;
    padding: 0 5px;
    margin-bottom: 5px; }
  .cartoon-list__cartoon-cell p {
    font-size: 14px;
    color: #545454;
    padding: 0 5px; }

/* Graphic Grid */
.graphic-grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  grid-column-gap: 6px;
  grid-row-gap: 6px; }

.graphic-grid__graphic-cell {
  display: flex;
  align-items: center;
  overflow: hidden;
  background-color: #f7f7f7;
  position: relative;
  flex-direction: column; }
  .graphic-grid__graphic-cell img {
    width: 100%; }
  .graphic-grid__graphic-cell h5 {
    font-size: 14px;
    padding: 0 5px;
    margin-bottom: 5px; }
  .graphic-grid__graphic-cell p {
    font-size: 14px;
    color: #545454;
    padding: 0 5px; }

/* Graphic List */
.graphic-list__graphic-cell {
  align-items: center;
  overflow: hidden;
  background-color: #f7f7f7;
  border-radius: 1%;
  border: 1px solid #E3E3E3;
  position: relative;
  padding: 1em;
  margin-bottom: 0.5em; }
  .graphic-list__graphic-cell img {
    width: 15%;
    height: 100%;
    float: left;
    margin-right: 2em; }
  .graphic-list__graphic-cell h5 {
    font-size: 14px;
    padding: 0 5px;
    margin-bottom: 5px; }
  .graphic-list__graphic-cell p {
    font-size: 14px;
    color: #545454;
    padding: 0 5px; }

/* Podcast Grid */
.podcast-grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  grid-column-gap: 6px;
  grid-row-gap: 6px; }

.podcast-grid__podcast-cell {
  display: flex;
  align-items: center;
  overflow: hidden;
  background-color: #f7f7f7;
  position: relative;
  flex-direction: column; }
  .podcast-grid__podcast-cell img {
    width: 100%; }
  .podcast-grid__podcast-cell h5 {
    font-size: 14px;
    padding: 0 5px;
    margin-bottom: 5px; }
  .podcast-grid__podcast-cell div {
    font-size: 14px;
    color: #545454;
    padding: 0 5px; }
  .podcast-grid__podcast-cell p {
    font-size: 14px;
    color: #545454;
    padding: 0 5px; }

/* Podcast List */
.podcast-list__podcast-cell {
  align-items: center;
  overflow: hidden;
  background-color: #f7f7f7;
  border-radius: 1%;
  border: 1px solid #E3E3E3;
  position: relative;
  padding: 1em;
  margin-bottom: 0.5em; }
  .podcast-list__podcast-cell img {
    width: 15%;
    height: 100%;
    float: left;
    margin-right: 2em; }
  .podcast-list__podcast-cell h5 {
    font-size: 14px;
    padding: 0 5px;
    margin-bottom: 5px; }
  .podcast-list__podcast-cell p {
    font-size: 14px;
    color: #545454;
    padding: 0 5px; }

/* Video Grid */
.video-grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  grid-column-gap: 6px;
  grid-row-gap: 6px; }

.video-grid__video-cell {
  display: flex;
  align-items: center;
  overflow: hidden;
  background-color: #f7f7f7;
  position: relative;
  flex-direction: column; }
  .video-grid__video-cell img {
    width: 100%; }
  .video-grid__video-cell h5 {
    font-size: 14px;
    padding: 0 5px;
    margin-bottom: 5px; }
  .video-grid__video-cell div {
    font-size: 14px;
    color: #545454;
    padding: 0 5px; }
  .video-grid__video-cell p {
    font-size: 14px;
    color: #545454;
    padding: 0 5px; }

.Select--cut-type {
  width: 200px; }

/* Video List */
.video-list__video-cell {
  align-items: center;
  overflow: hidden;
  background-color: #f7f7f7;
  border-radius: 1%;
  border: 1px solid #E3E3E3;
  position: relative;
  padding: 1em;
  margin-bottom: 0.5em; }
  .video-list__video-cell img {
    width: 15%;
    height: 100%;
    float: left;
    margin-right: 2em; }
  .video-list__video-cell h5 {
    font-size: 14px;
    padding: 0 5px;
    margin-bottom: 5px; }
  .video-list__video-cell p {
    font-size: 14px;
    color: #545454;
    padding: 0 5px; }

.video-file {
  padding: 10px; }

.video-warning {
  border-radius: 8px;
  border: 1px solid #FF9500;
  background-color: rgba(255, 149, 0, 0.2); }

.encoder {
  padding-top: 0px; }
  .encoder input[type=checkbox] {
    margin-left: 6px;
    margin-right: 6px; }

.encoder-create {
  margin-top: 14px; }

.transcript {
  padding-top: 10px; }

/* CDR List */
.cdr-totals {
  border: 1px solid green;
  height: 100px; }

.cdr-all {
  border: 1px solid blue; }

.cdr-pending {
  border: 1px solid red; }

/* File Inputs */
.inputfile {
  width: 0.1px;
  height: 0.1px;
  opacity: 0;
  overflow: hidden;
  position: absolute;
  z-index: -1; }

inputfile + label {
  cursor: pointer;
  font-size: 1.25em;
  font-weight: 700;
  color: white;
  background-color: black;
  display: inline-block; }

.inputfile:focus + label,
.inputfile + label:focus {
  opacity: 1;
  background-color: transparent;
  color: #777777;
  border-color: #777777; }

.help {
  color: #77a7cc;
  font-size: 14px;
  padding-left: 4px;
  padding-top: 5px; }

/* Figures - Common style */
figure {
  position: relative;
  float: left;
  overflow: hidden;
  margin: 10px 1%;
  min-width: 320px;
  max-width: 480px;
  max-height: 360px;
  width: 48%;
  background: #3085a3;
  text-align: center;
  cursor: pointer; }

.related-media-test figure img {
  position: relative;
  display: block;
  min-height: 100%;
  max-width: 100%;
  opacity: 0.8; }

.related-media-test figure figcaption {
  padding: 2em;
  color: #fff;
  text-transform: uppercase;
  font-size: 1.25em;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden; }

.related-media-test figure figcaption::before,
.related-media-test figure figcaption::after {
  pointer-events: none; }

.related-media-test figure figcaption,
.related-media-test figure figcaption > a {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%; }

/* Anchor will cover the whole item by default */
/* For some effects it will show as a button */
.related-media-test figure figcaption > a {
  z-index: 1000;
  text-indent: 200%;
  white-space: nowrap;
  font-size: 0;
  opacity: 0; }

.related-media-test figure h2 {
  word-spacing: -0.15em;
  font-weight: 800;
  font-size: 120%; }

.related-media-test figure h2 span {
  font-weight: 800; }

.related-media-test figure h2,
.related-media-test figure p {
  margin: 0; }

.related-media-test figure p {
  letter-spacing: 1px;
  font-size: 68.5%; }

/*---------------*/
/***** Sadie *****/
/*---------------*/
figure.effect-sadie figcaption::before {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: -webkit-linear-gradient(top, rgba(72, 76, 97, 0) 0%, rgba(72, 76, 97, 0.8) 75%);
  background: linear-gradient(to bottom, rgba(72, 76, 97, 0) 0%, rgba(72, 76, 97, 0.8) 75%);
  content: '';
  opacity: 0;
  -webkit-transform: translate3d(0, 50%, 0);
  transform: translate3d(0, 50%, 0); }

figure.effect-sadie h2 {
  position: absolute;
  top: 50%;
  left: 0;
  width: 100%;
  color: #fff;
  -webkit-transition: -webkit-transform 0.35s, color 0.35s;
  transition: transform 0.35s, color 0.35s;
  -webkit-transform: translate3d(0, -50%, 0);
  transform: translate3d(0, -50%, 0); }

figure.effect-sadie figcaption::before,
figure.effect-sadie p {
  -webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
  transition: opacity 0.35s, transform 0.35s; }

figure.effect-sadie p {
  position: absolute;
  bottom: 0;
  left: 0;
  padding: 2em;
  width: 100%;
  height: 60%;
  opacity: 0;
  -webkit-transform: translate3d(0, 10px, 0);
  transform: translate3d(0, 10px, 0); }

figure.effect-sadie:hover h2 {
  color: #fff;
  -webkit-transform: translate3d(0, -50%, 0) translate3d(0, -40px, 0);
  transform: translate3d(0, -50%, 0) translate3d(0, -40px, 0); }

figure.effect-sadie:hover figcaption::before,
figure.effect-sadie:hover p {
  opacity: 1;
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0); }

.toast-container {
  position: fixed;
  right: 2%;
  top: 2%;
  z-index: 999999; }

.toast-message {
  font-size: 24px;
  position: relative;
  margin-bottom: 10px;
  padding: 10px 15px;
  width: 300px;
  cursor: pointer; }

.toast-message.shown {
  animation-duration: 1000ms;
  animation-name: toast-slidein; }

.toast-message.success {
  background-color: rgba(8, 204, 70, 0.6392156863);
  color: white; }

.toast-message.info {
  background-color: rgba(8, 94, 204, 0.6392156863);
  color: white; }

.toast-message.warn {
  background-color: rgba(204, 173, 8, 0.6392156863);
  color: #464646; }

.toast-message.error {
  background-color: rgba(204, 8, 8, 0.6392156863);
  color: white; }

@keyframes toast-slidein {
  from {
    top: 20px; }
  to {
    top: 0; } }

/*# sourceMappingURL=nyt.css.map */