@import url('https://fonts.googleapis.com/css2?family=Saira+Semi+Condensed:wght@400&display=swap');
html {
  font-family: 'Saira Semi Condensed', 'Open Sans Narrow', Arial;
  -webkit-text-size-adjust: 100%;
  background: #f2f2f2;
  color:#000;
}

body {
  width: 100%;
  background: transparent;
  margin: 0;
  font-size: 17px;
  line-height: 1.5;
}

::-webkit-scrollbar {
  display: none;
}

html,
body,
.page-container {
  padding: 0;
  width: 800px;
  margin: auto;
  margin-bottom: 20px;
  max-width: 100%;
}

.today-cal-row, .news, .trades {
  margin: 10px;
  width: auto;
  max-width: 800px;
  border-radius: 10px;
  overflow: hidden;
  box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.2),
              -2px -2px 3px rgba(255, 255, 255, 1);
}

.specs {
  display:table-row;
}

.specs a {
  text-decoration: none;
  color:#000;
}

.specs td {
  white-space: normal;
  padding: 2px 10px;
  vertical-align: top;
}

.specs td, .specs a {
  color: #6b6b6b;
}

.specs .preview {
  background: #fff;
  padding: 20px 0px;
}

.specs .preview tr {
  background: #fff !important;
}

.upnext {
  color: #1e90ff;
}

.calendarhistory {
  margin-top: 20px;
}

.calendarspecs__spec {
  min-width:100px;
}

.preview {
  background: #fbfafa;
}

.prev {
  padding: 10px;
  font-size: 35px;
  line-height: 30px;
  cursor: pointer;
}

.next {
  padding: 20px;
  font-size: 35px;
  line-height: 30px;
  cursor: pointer;
}

.news {
  background: #f2f2f2;
  display: none;
}

.timeago {
  min-width: 130px;
}

.trades {
  background: #f2f2f2;
  max-width: 100%;
  display: none;
}

.body.flexposts {
  list-style: none;
  padding: 10px;
}

.blockhead {
  font-size: 30px;
  font-weight: 100;
  padding: 10px;
  cursor: pointer;
  overflow: hidden;
}

.fadein {
  -webkit-animation: fadein 1s ease-out;
  -moz-animation:    fadein 1s ease-out;
  -o-animation:      fadein 1s ease-out;
  animation:         fadein 1s ease-out;
}

.news a {
  display: flex;
  text-decoration: none;
  color: #000;
  padding: 2px 0;
  white-space: normal;
}

.newstable tr:nth-child(odd) {
  background: #fefefe;
}

.newsrow {
  vertical-align: top;
  cursor: pointer;
}

.headline {
  max-width: 100%;
  white-space: normal;
}

.preview {
  padding: 10px;
  max-width: 100%;
}

.previewrow {
  display: none;
}

.flexposts__time {
  padding: 2px 10px;
  padding-right: 5px;
}

.tradesinner {
  background: #fefefe;
  padding: 10px;
}

.tradesinner .currency {
  padding: 0;
  color: inherit !important;
  text-decoration: none !important;
}

.tradepair{
  width: 80px;
  padding: 0;
  padding-left: 10px;
}

.tradelots {
  list-style: none;
  display: flex;
  padding: 12px 0;
  margin: 0;
  padding-right: 10px;
  opacity: .7;
}

.trades_position__bar--long span {
  background-color: #1e90ff;
  margin-right: 1px;
  border-radius: 5px 0 0 5px;
}

.trades_position__bar--short span {
  background-color: #ff0000;
  border-radius: 0 5px 5px 0;
  margin-left: 1px;
}

.trades_position__bar span {
  height: 4px;
  box-sizing: border-box;
  display: block;
}

.calendar-table, .news, .trades {
  border: solid 1px #f2f2f2;
}

.calendar-table {
  display:none;
}

table {
  background: #f2f2f2;
  width: 100%;
  border-collapse: collapse;
  border-spacing: 0;
  margin: auto;
  overflow: hidden;
}

table tbody tr:nth-child(odd) {
  background: #fefefe;
}

.odd {
  background: #f2f2f2 !important;
}

.even {
  background: #fefefe !important;
}

.date {
  text-align: center;
  padding: 11px 0;
}

.month {
  line-height: 1;
}

.day {
  font-size: 34px;
  line-height: 30px;
  font-weight: 100;
}

.weekday {
  font-size: 30px;
  font-weight: 100;
  padding-left: 3px;
}

.time {
  width:6%;
  padding-left: 10px;
}

.currency {
  width:5%;
  padding: 0 5px;
}

.calendar__event {
  width:40%;
}

.impact {
  width: 3%;
}

.actual {
  width:5%;
  padding: 0 2px;
}

.better {
  color: #1e90ff;
}

.worse {
  color: #ee0000;
}

.forecast {
  width:5%;
  padding: 0 2px;
}

.previous {
  width:5%;
  padding-right: 5px;
  padding: 0 2px;
}

.details {
  display: none;
}

.calendar-table-day {
  margin-bottom: 10px;
  border-radius: 10px;
  overflow: hidden;
}

.calendar__impact img {
  width: 14px;
}

.calendar__impact--medium img, .flexposts__storyimpact--medium {
  content: url(img/yellow.svg?v=1.01);
}

.calendar__impact--low img, .calendar__impact--holiday img {
  content: url(img/grey.svg);
  opacity:.5;
}

.calendar__impact--high img, .flexposts__storyimpact--high {
  content: url(img/red.svg);
}

.flexposts__storyimpact {
  width: 10px !important;
  height: 10px !important;
  margin-top: auto;
  margin-bottom: auto;
	margin-right:0;
}

td::-webkit-scrollbar {
  display: none; 
}

@media (max-width: 700px) {
  body {
    font-size: 14px;
  }
  
  td {
    white-space: nowrap;
    overflow: scroll;
  }

  .calendar__event {
    max-width: 140px;
  }

  .impact {
    width: 7%;
    padding: 0 5px;
  }

  .calendar__impact img {
    width: 9px;
    margin-bottom: -2px;
  }
}

@media (max-width: 480px) {
  body {
    font-size: 11px;
  }

  .day {
    font-size: 25px;
    line-height: 25px;
  }

  .prev {
    padding: 5px;
    font-size: 28px;
    line-height: 21px;
  }

  .next {
    padding: 10px;
    font-size: 28px;
    line-height: 21px;
  }

  .specs .preview {
    padding: 20px 1px;
  }

  .specs td {
    padding: 2px 5px;
  }

  .calendarspecs__spec {
    min-width:55px;
  }

  .timeago {
    min-width: 80px;
  }

  .time {
    padding-left: 5px;
  }

  .date {
    padding-left: 2px;
  }

  .weekday {
    font-size: 21px;
  }

  .tradelots {
    padding: 9px 0;
		padding-right: 10px;
  }

  .tradepair {
    width: 50px;
  }

  .blockhead {
    font-size: 21px;
  }
}

@media (max-width: 375px){
  body {
  font-size: 10px;
  }

  .timeago {
    min-width: 70px;
  }
}

@media (max-width: 320px) {

  .calendar__event {
    max-width: 90px;
  }

  .day {
    font-size: 25px;
    line-height: 21px;
  }
}


@media (prefers-color-scheme: dark) {
  html {
    background: #1b1d26;
    color:#fff;
  }

  table {
    background-color: #1b1d26;
  }

  .calendar-table, .news, .trades {
    border: none;
  }

  .today-cal-row, .news, .trades {
    box-shadow: -1px -1px 5px rgba(255,255,255,.2),
                0px 0px 1px rgba(255,255,255,.07),
                1px 1px 10px rgba(0,0,0,.9),
                inset 0 0 0 rgba(0, 0, 0, 0);
    }

  .specs a {
    color:#fff;
  }

  .specs td, .specs a {
    color: #dedede;
  }

  .specs .preview {
    background: #1b1d26;
  }

  .specs .preview tr {
    background: #1b1d26 !important;
  }

  .preview {
    background: #1b1d26;
  }

	table tbody tr:nth-child(odd) {
		background: #1b1d26;
  }

  .better {
    color: #91c191;
  }
  
  .worse {
    color: #bd0000;
  }

  .upnext {
    color: orange;
  }

  .tradelots {
    opacity: 1;
  }
  
  .news, .trades {
    background: #1b1d26;
  }
  
  .newstable a {
    color: #fff;
  }

  .tradesinner {
    background: #1b1d26;
  }

  .trades_position__bar--long span {
    background-color: #17506e ;
  }
  
  .trades_position__bar--short span {
    background-color: #813033;
  }
  
  .newstable a {
    color:#fff;
  }
  
  .newstable tr:nth-child(odd) {
    background: #22242e;
  }

  .odd {
    background: #1b1d26 !important; /*#1c3340*/
  }

  .even {
    background: #22242e !important; /*#081f2c*/
  }

  .actual-better {
    color: #91c191;
  }

  .actual-worse {
    color: #e25757;
  }
}

/* KEYFRAMES */

@-webkit-keyframes fadein {
  0%   { opacity: 0; }
  50%  { opacity: 0; }
  100% { opacity: 1; }
}
@-moz-keyframes fadein {
  0%   { opacity: 0; }
  50%  { opacity: 0; }
  100% { opacity: 1; }
}
@-o-keyframes fadein {
  0%   { opacity: 0; }
  50%  { opacity: 0; }
  100% { opacity: 1; }
}
@keyframes fadein {
  0%   { opacity: 0; }
  50%  { opacity: 0; }
  100% { opacity: 1; }
}