html.html {
  font-family: Helvetica, Arial, sans-serif;
  font-size: 16px;
  color: #444444; }

body {
  margin: 0;
  padding: 0;
  background: #E5E5E5; }

.bg-theme {
  background-color: #FFFFFF; }

.bg-theme-highlight {
  background-color: #F8F8F8; }

.bg-theme-accent {
  background-color: #E5E5E5; }

p {
  font-size: 1rem; }
  p a {
    color: #eb5b0d; }

.content {
  z-index: 2;
  position: relative; }

.marker-bullseye {
  position: relative;
  box-sizing: border-box;
  height: 30px;
  width: 30px;
  border-width: 4px;
  border-style: solid;
  background-color: transparent;
  border-radius: 50%; }
  .marker-bullseye:hover .point {
    width: 14px;
    height: 14px; }
  .marker-bullseye.highlight {
    height: 20px;
    width: 20px;
    border-width: 3px;
    border-color: #222222;
    background-color: rgba(34, 34, 34, 0.2); }
  .marker-bullseye .point {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    height: 10px;
    width: 10px;
    border-radius: 50%; }

.leaflet-marker-icon .marker-pin {
  background-color: white;
  color: white;
  border-color: #3d8a3f;
  border-width: 2px;
  border-style: none solid solid none;
  background-image: linear-gradient(45deg, #222222, #000000);
  background-repeat: no-repeat;
  background-position: right bottom;
  width: 50px;
  height: 50px;
  border-top-left-radius: 50%;
  border-top-right-radius: 50% 100%;
  border-bottom-left-radius: 100% 50%;
  border-bottom-right-radius: 0;
  transform: rotate(45deg); }
.leaflet-marker-icon .bag-marker-pin {
  background-color: white;
  color: white;
  border-color: #3d8a3f;
  border-width: 2px;
  border-style: none solid solid none;
  background-image: linear-gradient(45deg, #222222, #000000);
  background-repeat: no-repeat;
  background-position: right bottom;
  width: 36px;
  height: 36px;
  border-top-left-radius: 50%;
  border-top-right-radius: 50% 100%;
  border-bottom-left-radius: 100% 50%;
  border-bottom-right-radius: 0;
  transform: rotate(45deg); }
.leaflet-marker-icon .state {
  position: absolute;
  top: 26px;
  width: 90%;
  left: 5%;
  text-align: center;
  color: white;
  font-size: 1rem; }
  .leaflet-marker-icon .state.fa-tools {
    font-size: 1rem; }
  .leaflet-marker-icon .state.fa-signal-slash {
    font-size: 0.875rem; }
  .leaflet-marker-icon .state + .inner {
    top: 3px;
    font-size: 1rem; }
  .leaflet-marker-icon .state.fa-bag + .inner {
    top: 18px; }
  .leaflet-marker-icon .state.fa-bag {
    top: 7px;
    font-family: "Font Awesome 5 Pro";
    visibility: visible;
    font-size: 1rem;
    left: -8px; }
  .leaflet-marker-icon .state.fa-bag::before {
    content: "\f0f2"; }
  .leaflet-marker-icon .state.customstate {
    font-size: 1.1rem; }
.leaflet-marker-icon .inner {
  position: absolute;
  width: 90%;
  left: 5%;
  height: 20px;
  font-size: 1.15rem;
  font-weight: bold;
  top: 8px;
  color: white;
  text-align: center; }

.event-logo {
  position: fixed;
  z-index: 2;
  width: 8rem;
  bottom: 2rem;
  left: 0.5rem; }
@media only screen and (min-width: 768px) {
  .event-logo {
    right: 1rem;
    left: auto;
    bottom: auto;
    width: 12rem; } }
@media only screen and (min-width: 768px) and (max-width: 1199px) {
  .event-logo {
    top: 1rem; } }
@media only screen and (min-width: 1200px) {
  .event-logo {
    top: 3.5rem; } }
.event-logo img {
  max-width: 100%;
  height: auto;
  display: block;
  float: right; }

@media only screen and (min-width: 768px) and (max-width: 959px) {
  .event-links + .event-logo {
    display: none; } }

@media only screen and (max-width: 640px) {
  .event-links + .event-logo {
    display: none; } }

@media only screen and (min-width: 768px) {
  body.has-links .event-logo {
    top: 6.5rem; } }

.event-notice {
  position: fixed;
  top: 3.5rem;
  width: calc(100vw - 6.5rem);
  max-width: 24rem;
  right: 0.5rem;
  border-radius: 0.75rem;
  background-color: #FFFFFF;
  color: #444444;
  padding: 0.75rem 1rem;
  z-index: 3;
  box-shadow: 2px 2px 4px 0 rgba(0, 0, 0, 0.4); }
  .event-notice .notice-text {
    padding-right: 2rem;
    font-size: 0.83333rem; }
  .event-notice .notice-close {
    position: absolute;
    top: 0.25rem;
    right: 0.5rem; }
  @media only screen and (min-width: 768px) and (max-width: 959px) {
    .event-notice {
      max-width: 18rem; } }
@media only screen and (min-width: 768px) {
  .event-notice {
    right: 1rem; }
    .event-notice + .event-logo {
      margin-top: 6rem; } }

.event-info {
  right: 0;
  position: fixed;
  top: 0;
  z-index: 2;
  display: none; }
@media only screen and (min-width: 768px) {
  .event-info {
    display: flex; } }
@media only screen and (min-width: 768px) and (max-width: 1199px) {
  .event-info {
    justify-content: space-between;
    width: 28rem;
    left: 1rem;
    top: 1rem; } }
.event-info .event-item {
  height: 2rem;
  line-height: 1.5rem;
  box-sizing: border-box;
  margin: 0;
  z-index: 10;
  box-shadow: -5px 5px 10px rgba(0, 0, 0, 0.1);
  font-size: 0.875rem;
  color: #FFFFFF;
  padding: 0 0.5rem; }
@media only screen and (min-width: 1200px) {
  .event-info .event-item {
    padding-left: 2rem;
    padding-right: 3rem;
    margin-left: -2.5rem;
    border-radius: 0 0 0 50rem;
    font-size: 1.25rem;
    height: 2.5rem;
    line-height: 2.5rem; } }
.event-info .event-item.event-title {
  background-color: #eb5b0d;
  padding-right: 1.5rem; }
@media only screen and (min-width: 768px) and (max-width: 1199px) {
  .event-info .event-item.event-title {
    border-radius: 0.75rem 3rem 0 0;
    margin-right: -1.5rem; } }
@media only screen and (min-width: 1200px) {
  .event-info .event-item.event-title {
    background-color: #FFFFFF;
    color: #eb5b0d;
    padding-left: 2rem;
    padding-right: 3rem; } }
.event-info .event-item.event-timer {
  background-color: #b1450a;
  padding-left: 1.5rem; }
@media only screen and (min-width: 768px) and (max-width: 1199px) {
  .event-info .event-item.event-timer {
    border-radius: 3rem 0.75rem 0 0;
    text-align: right; } }
@media only screen and (min-width: 1200px) {
  .event-info .event-item.event-timer {
    background-color: #eb5b0d;
    padding-right: 2rem; } }

.event-links {
  display: none;
  position: fixed;
  top: 3.5rem;
  right: 0;
  z-index: 2;
  align-items: center; }
@media only screen and (max-width: 640px) {
  .event-links {
    display: inline-grid;
    top: initial;
    bottom: 5rem;
    left: 0;
    right: initial; } }
@media only screen and (min-width: 768px) and (max-width: 959px) {
  .event-links {
    display: inline-grid;
    top: initial;
    bottom: 5rem;
    left: 0;
    right: initial; } }
@media only screen and (min-width: 960px) {
  .event-links {
    display: inline-flex; } }
.event-links a {
  height: 2rem;
  line-height: 2rem;
  padding: 0 0.75rem;
  border-radius: 0.375rem;
  background-color: #FFFFFF;
  color: #eb5b0d;
  border-bottom: 3px solid #eb5b0d;
  font-size: 0.875rem;
  text-decoration: none;
  font-weight: bold;
  margin-right: 1rem; }
  .event-links a:hover {
    color: white;
    background-color: #f36d24; }
  @media only screen and (max-width: 640px) {
    .event-links a {
      height: 1.5rem;
      line-height: 1.5rem;
      font-size: 0.575rem;
      margin-left: 0.5rem;
      margin-right: initial; } }
@media only screen and (min-width: 768px) and (max-width: 959px) {
  .event-links a {
    height: 1.5rem;
    line-height: 1.5rem;
    font-size: 0.575rem;
    margin-left: 1rem;
    margin-right: initial; } }

.loads {
  position: relative; }
  .loads.loaded .loader {
    display: none; }
  .loads .loader {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%); }
    .loads .loader .loader-icon {
      border: 0.25rem solid #eb5b0d;
      height: 1.5rem;
      width: 1.5rem;
      border-radius: 50%;
      position: relative;
      animation: spin 0.8s infinite linear; }
      .loads .loader .loader-icon:before {
        content: '';
        position: absolute;
        top: -0.5rem;
        left: 0.75rem;
        width: 0.5rem;
        height: 0.6rem;
        background-color: white; }

@keyframes spin {
  from {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    transform: rotate(0deg); }
  to {
    -webkit-transform: rotate(359deg);
    -moz-transform: rotate(359deg);
    -ms-transform: rotate(359deg);
    transform: rotate(359deg); } }

.event-company {
  position: fixed;
  height: 3rem;
  width: auto;
  right: 1rem;
  bottom: 4rem;
  z-index: 2; }

h2 {
  font-size: 1.2rem; }

p, li {
  font-size: 0.8333rem; }

.inline {
  padding: 0.125rem 0.25rem;
  margin-right: 0.25rem; }

.pill {
  border-radius: 0.375rem;
  color: white; }

.panel-wrapper {
  width: 100%;
  height: 100%; }

.hidden {
  display: none !important; }

.btn {
  height: 2rem;
  line-height: 1.875rem;
  box-sizing: border-box;
  display: inline-block;
  padding: 0 1rem;
  border-radius: 0.375rem;
  color: white;
  background-color: #eb5b0d;
  border: none;
  border-bottom: 2px solid #b1450a;
  cursor: pointer; }
  .btn:hover {
    background-color: #f36d24; }
  .btn.disabled {
    background-color: #DDDDDD;
    border-bottom: 2px solid #DDDDDD;
    color: rgba(0, 0, 0, 0.3); }

.just-giving {
  padding: 1rem; }
  .just-giving .jg-widget {
    border-radius: 0.375rem; }

.icon-link {
  height: 2rem;
  width: 2rem;
  line-height: 2rem;
  border-radius: 0.375rem;
  text-align: center;
  color: #eb5b0d;
  cursor: pointer;
  font-size: 1.5rem;
  position: relative; }
  .icon-link:hover {
    color: #b1450a; }
  .icon-link.icon-select {
    font-size: 1.25rem;
    background-color: #FFFFFF;
    color: #BBBBBB;
    margin: 0 0.25rem;
    border-radius: 0.25rem;
    box-shadow: 0 2px 3px rgba(0, 0, 0, 0.15); }
    .icon-link.icon-select.active {
      color: #eb5b0d; }

.flex-center {
  display: flex;
  align-items: center; }

.space-between {
  justify-content: space-between; }

.popup-row, .leaflet-popup-content > :only-child {
  width: 12rem;
  min-height: 2rem;
  box-sizing: border-box;
  margin: 0;
  padding: 0.5rem 0;
  color: #444444;
  font-size: 0.75rem; }

.leaflet-popup-content > :only-child {
  padding-right: 2.25rem;
  font-weight: normal; }

.popup-row {
  display: flex; }
  .popup-row.state {
    height: 2rem; }
    .popup-row.state .fad {
      font-size: 1rem; }
  .popup-row:first-child {
    padding-right: 2rem; }
  .popup-row .popup-label {
    font-size: 0.675rem;
    color: #444444;
    display: block; }
  .popup-row:only-child {
    padding-bottom: 0; }

.leaflet-popup-content img {
  width: 13.5rem;
  margin: 0 -0.75rem;
  display: block;
  height: auto; }
  .leaflet-popup-content img + .state {
    position: relative;
    top: -2rem;
    margin-bottom: -2rem;
    color: white;
    background-color: rgba(0, 0, 0, 0.3);
    border-radius: 0 0 0.375rem 0.375rem; }

.bounce {
  z-index: 2147483647 !important;
  /*.marker-pin, .inner, .state {
   animation-iteration-count: 5;
   animation-duration: 1s;
   animation-timing-function: cubic-bezier( .5, 0.05, 1, .5); ;
   }
   .marker-pin {
   animation-name: pin-bounce;
   }
   .inner, .state {
   animation-name: inner-bounce;
   }*/ }

@keyframes pin-bounce {
  0% {
    margin-top: 0;
    transform: rotate(45deg) scale(1); }
  10% {
    margin-top: 0;
    transform: rotate(45deg) scale(1); }
  50% {
    margin-top: -15px;
    transform: rotate(45deg) scale(0.9); }
  100% {
    margin-top: 0;
    transform: rotate(45deg) scale(1); } }
@keyframes inner-bounce {
  0% {
    margin-top: 0; }
  10% {
    margin-top: 0; }
  50% {
    margin-top: -15px; }
  100% {
    margin-top: 0; } }

.overview {
  height: 100%;
  background-color: #FFFFFF;
  border-radius: 0.75rem;
  box-shadow: 2px 2px 4px 0 rgba(0, 0, 0, 0.1); }

.frame {
  height: 100%;
  overflow: hidden;
  margin: 0 auto;
  max-width: 26rem; }

.panel.faded {
  background-color: #DDDDDD !important; }

.row {
  width: 100%;
  min-height: 2.75rem;
  box-sizing: border-box;
  padding: 0.75rem 0.375rem 0;
  display: flex;
  flex-wrap: wrap; }
  .row.flex {
    display: flex; }

.flexg {
  flex: auto; }

.row-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0.5rem 1rem;
  z-index: 1; }
  .row-header h3, .row-header h4 {
    margin: 0; }
  .row-header .count .pill {
    background-color: #eb5b0d; }

.col {
  width: 100%;
  box-sizing: border-box;
  padding: 0 0.5rem; }

.col-8 {
  width: 66.6666%;
  box-sizing: border-box; }

.col-6 {
  width: 50%; }
  .col-6.mobile {
    width: calc(50% - 1.25rem); }

.col-5 {
  width: 41.66666667%; }
  .col-5.mobile {
    width: calc(41.66666667% - 1.25rem); }

.col-4 {
  width: 33.3333%;
  box-sizing: border-box;
  padding: 0 0.5rem 0.75rem; }

.label {
  font-size: 0.625rem;
  margin-bottom: 0.125rem;
  color: #444444;
  font-weight: bold; }

.value {
  font-size: 0.8333rem;
  color: #333333; }

.vertical-slide-leave-active, .vertical-slide-enter-active {
  transition: 0.4s; }

.vertical-slide-enter {
  transform: scaleY(0);
  opacity: 0;
  transition-delay: 0.4s; }

.vertical-slide-leave-to {
  transform: scaleY(0);
  opacity: 0;
  transition-delay: 0.4s; }

.fade-leave-active, .fade-enter-active {
  transition: 0.4s; }

.fade-enter {
  opacity: 1; }

.fade-leave-to {
  opacity: 0; }

.memory {
  height: 3rem;
  bottom: 7rem;
  left: 0;
  right: 0;
  width: 100%;
  max-width: 28rem;
  background-color: #FFFFFF;
  border-radius: 0.75rem;
  position: absolute;
  z-index: 10;
  margin: auto; }

#nav {
  position: fixed;
  top: 0.5rem;
  left: 0.5rem;
  width: calc(100% - 1rem);
  height: 2.5rem;
  background-color: #FFFFFF;
  box-sizing: border-box;
  border-radius: 0.75rem;
  border-bottom: 2px solid #eb5b0d;
  overflow: hidden;
  box-shadow: 2px 2px 4px 0 rgba(0, 0, 0, 0.1); }
@media only screen and (min-width: 768px) {
  #nav {
    overflow: visible;
    transition: 0.2s;
    transition-delay: 0.1s;
    height: 3rem;
    width: 28rem;
    padding: 0.5rem 0.75rem 0;
    top: 1rem;
    left: 1rem; } }
@media only screen and (min-width: 768px) and (max-width: 1199px) {
  #nav {
    top: 2.5rem; } }
@media only screen and (min-width: 1200px) {
  #nav {
    top: 1rem; } }

#app:not(.open) #nav {
  transition-delay: 0s; }

#nav .menu {
  display: inline-flex;
  width: 100%;
  height: 2.5rem;
  justify-content: space-evenly; }

#collapse {
  display: block;
  position: absolute;
  top: 2px;
  bottom: 0;
  margin: auto;
  right: -32px;
  height: 32px;
  width: 32px;
  background-color: #eb5b0d;
  text-align: center;
  color: white;
  cursor: pointer;
  box-shadow: 2px 2px 4px 0 rgba(0, 0, 0, 0.3);
  border-top-right-radius: 0.75rem;
  border-bottom-right-radius: 0.75rem; }
  #collapse:hover {
    background-color: #f36d24; }
  #collapse:before, #collapse:after {
    content: '';
    position: absolute;
    display: block;
    top: 14px;
    width: 12px;
    height: 4px;
    background: white;
    transition: all 0.2s; }
  #collapse:before {
    transform: rotate(45deg);
    left: 7px; }
  #collapse:after {
    transform: rotate(-45deg);
    right: 7px; }

.item {
  box-sizing: border-box;
  position: relative;
  min-width: 2.5rem;
  padding: 0 0.625rem;
  height: 2.5rem;
  line-height: 2.5rem;
  color: #eb5b0d;
  background-color: transparent;
  transition: all 0.2s ease;
  text-align: center; }
@media only screen and (min-width: 768px) {
  .item {
    height: 2rem;
    line-height: 2rem;
    border-radius: 0.375rem 0.375rem 0 0; }
    .item.map {
      display: none; }
    .item:not(.active) {
      cursor: pointer; }
      .item:not(.active):hover {
        color: #b1450a; } }
.item.active {
  color: white;
  background-color: #eb5b0d;
  height: 2.5rem;
  line-height: 2.5rem; }
  .item.active .icon {
    font-size: 1rem; }
  @media only screen and (min-width: 448px) {
    .item.active .text {
      display: inline-block; } }
.item .text {
  display: none;
  margin-left: 0.2rem;
  font-size: 0.875rem; }
.item .icon {
  font-size: 1.25rem; }

.panels {
  position: fixed;
  left: 0.5rem;
  top: 3rem;
  opacity: 0;
  transform: scaleY(0);
  transition: all 0.4s;
  transform-origin: top center;
  overflow-x: visible;
  width: calc(100vw - 1rem);
  z-index: 1000;
  height: calc(100vh - 3.5rem);
  height: calc(calc(var(--vh, 1vh) * 100) - 3.5rem); }
@media only screen and (min-width: 768px) {
  .panels {
    left: 1rem;
    min-width: 28rem;
    width: auto; } }
@media only screen and (min-width: 768px) and (max-width: 1199px) {
  .panels {
    top: 5.5rem;
    height: calc(100vh - 6.5rem);
    height: calc(calc(var(--vh, 1vh) * 100) - 6.5rem); } }
@media only screen and (min-width: 1200px) {
  .panels {
    top: 4rem;
    height: calc(100vh - 5rem);
    height: calc(calc(var(--vh, 1vh) * 100) - 5rem); } }
@media only screen and (min-width: 768px) and (max-width: 1199px) {
  .panels.gmaps {
    top: 5.5rem;
    height: calc(100vh - 8.5rem);
    height: calc(calc(var(--vh, 1vh) * 100) - 8.5rem); } }
@media only screen and (min-width: 1200px) {
  .panels.gmaps {
    top: 4rem;
    height: calc(100vh - 7rem);
    height: calc(calc(var(--vh, 1vh) * 100) - 7rem); } }

.panel {
  height: 100%;
  box-sizing: border-box;
  width: 100%;
  overflow: hidden;
  border-radius: 0 0 0.75rem 0.75rem;
  position: absolute;
  top: 0;
  left: 0;
  transform-origin: top center;
  transition: all 0.4s;
  background-color: #F8F8F8;
  box-shadow: 2px 2px 4px 0 rgba(0, 0, 0, 0.1); }
  .panel .panel-container {
    margin: 0 auto;
    max-width: 26rem;
    width: 100%; }
    .panel .panel-container img {
      border-radius: 0.75rem;
      max-width: none !important;
      width: 100%; }
  .panel.padded {
    padding: 1rem; }
  @media only screen and (min-width: 768px) {
    .panel {
      width: 28rem; } }
.panel:not(.leaderboard-open) table.team-table thead th:first-child {
  display: none; }
.panel:not(.leaderboard-open) table.team-table th:not(:first-child), .panel:not(.leaderboard-open) table.team-table td:not(:first-child) {
  display: none; }

.scrolls {
  scroll-behavior: smooth;
  overflow: auto; }

body.has-flags th.team .cell.racenumber:first-child {
  width: 5rem;
  padding-left: 3rem; }
body.has-flags th.team .cell.name {
  width: 11rem; }
body.has-flags th.team .cell.last-cp {
  width: 4.5rem; }

.not-timed th.team .cell.last-cp, .not-timed th.team .cell.time {
  opacity: 0; }

#app.open #nav {
  border-radius: 0.75rem 0.75rem 0 0; }
#app.open #collapse:before {
  transform: rotate(-45deg); }
#app.open #collapse:after {
  transform: rotate(45deg); }
#app.open .panels {
  opacity: 1;
  transform: scaleY(1); }
#app.open .panel.open {
  transform: scaleY(1); }
@media only screen and (min-width: 768px) {
  #app.open .leaflet-left {
    left: 29rem; }
  #app.open .leaflet-control {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0; } }

.panel.leaderboard-open {
  border-top-right-radius: 0.75rem;
  border-bottom-right-radius: 0.75rem !important;
  width: calc(100vw - 2rem); }
  .panel.leaderboard-open + .sponsors {
    display: none; }
  .panel.leaderboard-open tbody th.sticky-left {
    min-width: 28rem;
    width: 28rem;
    max-width: 28rem; }
  .panel.leaderboard-open tbody th.sticky-top {
    top: 3.5rem; }
  .panel.leaderboard-open .list {
    margin-top: -3.5rem;
    height: calc(100% - 2.75rem); }
  .panel.leaderboard-open .button-slider {
    padding: 0 0 0 30px; }
    .panel.leaderboard-open .button-slider:before, .panel.leaderboard-open .button-slider:after {
      right: auto;
      left: 0.5rem; }
    .panel.leaderboard-open .button-slider:before {
      transform: rotate(-45deg); }
    .panel.leaderboard-open .button-slider:after {
      transform: rotate(45deg); }
    .panel.leaderboard-open .button-slider .button {
      text-align: right; }
      .panel.leaderboard-open .button-slider .button .text:before {
        content: ''; }

.timing {
  position: relative;
  z-index: 6;
  padding-bottom: 0.75rem;
  background-color: #F8F8F8;
  width: 100%; }
@media only screen and (min-width: 768px) {
  .timing {
    width: 28rem; } }

.list {
  width: 100%;
  overflow-y: auto;
  text-align: center;
  height: calc(100% - 7rem); }
  .list.loaded:before {
    position: absolute;
    content: "No participants found.";
    top: 0;
    left: 0;
    z-index: 2;
    padding: 1rem 0;
    font-size: 0.875rem;
    margin: 0 auto;
    width: 100%;
    max-width: 28rem; }
  @media only screen and (min-width: 768px) {
    .list {
      max-width: calc(100vw - (2rem)); } }

.filters {
  display: flex;
  background-color: #F8F8F8;
  position: relative;
  z-index: 7; }

.no-leaderboard .filters {
  padding-bottom: 0.75rem; }

.mobile .filters {
  padding-bottom: 0.75rem; }

.mobile .list {
  height: calc(100% - 3.5rem); }

.mobile .timing {
  display: none; }

.participant-filter {
  width: 100%;
  flex-grow: 0; }
@media only screen and (min-width: 768px) {
  .participant-filter {
    width: 28rem; } }

th.team .table-row {
  display: table-row;
  font-size: 0.8333rem;
  font-weight: normal; }
th.team .bagtag {
  font-size: 0.625rem;
  font-style: italic;
  font-weight: normal;
  text-align: left;
  margin-left: 1rem;
  margin-bottom: 0.2rem;
  margin-top: 0.2rem; }
  th.team .bagtag .bagdate {
    padding-left: 1rem; }
th.team .cell {
  display: table-cell;
  padding: 0 0.25rem;
  vertical-align: middle;
  box-sizing: border-box;
  text-align: left; }
  th.team .cell.invisible {
    opacity: 0;
    display: none; }
  th.team .cell.flag {
    width: 2.5rem;
    padding: 0 0 0 0.5rem; }
    th.team .cell.flag img {
      width: 2rem;
      position: relative;
      top: 2px;
      border-radius: 0.25rem; }
  th.team .cell.racenumber {
    width: 2.5rem;
    font-weight: bold;
    text-align: center; }
  th.team .cell.name {
    padding-right: 0.25rem;
    width: 12rem; }
    th.team .cell.name .group {
      font-size: 0.625rem;
      font-style: italic; }
  th.team .cell.score {
    width: 3rem;
    display: none; }
  th.team .cell.time {
    width: 4.5rem; }
  th.team .cell.last-cp {
    width: 6rem;
    text-align: right; }
  th.team .cell.watch {
    width: 2rem; }

.score-type th.team .cell.score {
  display: table-cell; }
.score-type th.team .cell.time {
  width: 4rem; }
.score-type th.team .cell.name {
  width: 10.5rem; }
.score-type th.team .cell.last-cp {
  width: 5rem; }

.has-country th.first .cell.racenumber:first-child {
  width: 5rem;
  padding-left: 3rem; }
.has-country th.first .cell.name {
  width: 11rem; }
.has-country th.first .cell.last-cp {
  width: 4.5rem; }

.person .person-header {
  display: flex;
  height: 3rem;
  width: 100%;
  padding: 0 1rem;
  box-sizing: border-box;
  align-items: center; }
  .person .person-header .country-flag {
    width: 2rem;
    height: auto;
    border-radius: 0.375rem;
    margin-right: 0.375rem; }
  .person .person-header .scroll-to {
    display: flex;
    flex-direction: row;
    background: #E5E5E5;
    borderradius: 0.375rem 0.375rem 0 0;
    align-self: end;
    margin-left: auto;
    padding: 0 0.25rem; }
    .person .person-header .scroll-to:last-child {
      margin-right: 1rem; }
    .person .person-header .scroll-to .icon-link {
      line-height: 1.8rem;
      border-bottom-width: 1px;
      border-bottom-style: solid;
      border-bottom-color: rgba(0, 0, 0, 0);
      border-radius: 0; }
      .person .person-header .scroll-to .icon-link:hover {
        border-bottom-color: #eb5b0d; }
        .person .person-header .scroll-to .icon-link:hover .fad {
          color: #eb5b0d; }
      .person .person-header .scroll-to .icon-link.fa-star {
        color: #eb5b0d !important; }
    .person .person-header .scroll-to + .close {
      margin-left: 1rem; }
    .person .person-header .scroll-to .fad {
      color: #444444;
      font-size: 0.875rem; }
  .person .person-header .inline {
    padding: 0.1rem 0.5rem;
    font-size: 1rem;
    font-weight: bold; }
    .person .person-header .inline.name {
      max-width: 10rem; }
  .person .person-header .icon-link {
    margin-left: auto; }
.person .message .btn {
  margin: 0 auto; }
.person .message {
  position: relative;
  transition: 0.4s; }
.person .person-image + .row.message {
  top: -3.5rem;
  margin-bottom: -2.75rem; }
.person .person-body {
  height: calc(100% - 3rem); }
  .person .person-body .person-image {
    width: 100%;
    height: auto;
    display: block; }
  .person .person-body .row {
    padding: 0.75rem 0.5rem 0; }
.person .person-details.portrait {
  display: flex; }
  .person .person-details.portrait .person-image {
    margin: 1rem;
    width: 40%;
    border-radius: 0.375rem; }
  .person .person-details.portrait .row {
    flex-direction: column;
    align-items: center; }
    .person .person-details.portrait .row .col-4 {
      flex-grow: 0;
      width: 100%; }
.person .full-row:only-child {
  padding-bottom: 0.75rem; }
  .person .details-row .col:nth-child(3n+2) {
    text-align: center; }
  .person .details-row .col:nth-child(3n) {
    text-align: right; }

.section-header {
  position: sticky;
  top: 0;
  background-color: #E5E5E5;
  border-bottom: 1px solid #DDDDDD;
  z-index: 1;
  height: 1.25rem;
  font-size: 0.875rem;
  cursor: pointer; }
  .section-header:before {
    content: '';
    left: 0;
    position: absolute;
    bottom: 0;
    height: 1px;
    width: 100%;
    transition: width 0.2s ease;
    background-color: #eb5b0d; }
  .section-header:hover {
    color: #eb5b0d; }
  .section-header .fad {
    width: 1rem; }

.info-text {
  padding: 0 1rem; }

.section-body {
  transition: all 0.2s;
  transform-origin: center top;
  overflow: hidden;
  -webkit-transform: scaleY(1);
  -moz-transform: scaleY(1);
  -ms-transform: scaleY(1);
  transform: scaleY(1); }

section {
  overflow: hidden; }

section.collapsed .section-body {
  max-height: 0;
  -webkit-transform: scale(1, 0);
  -moz-transform: scale(1, 0);
  -ms-transform: scale(1, 0);
  transform: scale(1, 0); }
section.collapsed .section-header:not(:hover):before {
  width: 0; }

.additional-time {
  font-weight: bold;
  color: #00BA00; }
  .additional-time:before {
    content: '-'; }
  .additional-time.penalty {
    color: #BB0000; }
    .additional-time.penalty:before {
      content: '+'; }

.split-row td:last-child {
  text-align: right; }
.split-row.bonus td, .split-row.penalty.td {
  color: #333333; }
.split-row.bonus td {
  background-color: rgba(0, 186, 0, 0.2); }
.split-row.penalty td {
  background-color: rgba(187, 0, 0, 0.2); }

.penalty-row td {
  background-color: #00BA00 !important;
  color: white;
  height: 1.25rem;
  line-height: 1.25rem;
  font-size: 0.75rem;
  padding-top: 0 !important;
  padding-bottom: 0 !important; }
  .penalty-row td .note:before {
    content: 'Bonus: ';
    font-weight: bold; }
.penalty-row.penalty td {
  background-color: #BB0000 !important; }
  .penalty-row.penalty td .note:before {
    content: 'Penalty: '; }
.penalty-row .additional-time {
  color: white; }
.penalty-row .penalty-box {
  display: flex;
  justify-content: space-between; }

.m-1 {
  margin: 1em; }

.mt-1 {
  margin-top: 1em; }

table.expanded .header, table.expanded .times {
  min-width: 10rem; }
  table.expanded .times span:first-child {
    display: inline;
    float: left; }
  table.expanded .times span:nth-child(2) {
    color: #BBBBBB;
    float: right; }

.header.sticky-top {
  top: 0;
  background-color: #F8F8F8;
  height: 3.5rem;
  z-index: 5; }
  .header.sticky-top .checkpoint-header {
    height: 100%;
    width: 100%;
    text-align: center;
    position: relative;
    vertical-align: middle;
    display: block; }
  .header.sticky-top span {
    position: absolute;
    left: 50%; }
  .header.sticky-top span.fi {
    bottom: -2rem;
    transform: translateX(-50%);
    font-size: 1.5rem; }
  .header.sticky-top span.fas, .header.sticky-top span.fa {
    bottom: -2rem;
    transform: translateX(-50%);
    font-size: 1.5rem; }
  .header.sticky-top span.name {
    top: 50%;
    max-width: 90%;
    transform: translate(-50%, -50%); }

.leaderboard-filter {
  padding: 0.5rem 0.5rem 0;
  display: flex;
  box-sizing: border-box;
  justify-content: space-between; }
  .leaderboard-filter .icon-link {
    margin-left: auto; }
  @media only screen and (min-width: 768px) {
    .leaderboard-filter {
      width: calc(100% - 28rem); } }

table {
  font-size: 0.83333rem;
  width: 100%;
  border-collapse: separate;
  border-spacing: 0; }

.team-table tbody tr:only-child {
  display: none; }

tbody tr.selectable {
  cursor: pointer; }
  tbody tr.selectable:hover td, tbody tr.selectable:hover th:not(.course) {
    background-color: #eb5b0d;
    color: white;
    border-right: 1px solid #b1450a;
    border-bottom: 1px solid #b1450a; }
    tbody tr.selectable:hover td .fa-heart.fas, tbody tr.selectable:hover th:not(.course) .fa-heart.fas {
      color: black; }
    tbody tr.selectable:hover td .fa-heart.far, tbody tr.selectable:hover th:not(.course) .fa-heart.far {
      color: white; }
  tbody tr.selectable:hover td .fa-star.fas, tbody tr.selectable:hover th:not(.course) .fa-star.fas, tbody tr.selectable:hover td .fa-link.fas, tbody tr.selectable:hover th:not(.course) .fa-link.fas, tbody tr.selectable:hover td .fa-map-pin.fas, tbody tr.selectable:hover th:not(.course) .fa-map-pin.fas {
    color: white; }
  tbody tr.selectable:hover td .fa-star.far, tbody tr.selectable:hover th:not(.course) .fa-star.far, tbody tr.selectable:hover td .fa-link.far, tbody tr.selectable:hover th:not(.course) .fa-link.far, tbody tr.selectable:hover td .fa-map-pin.far, tbody tr.selectable:hover th:not(.course) .fa-map-pin.far {
    color: white; }
tbody tr.selectable:hover .watch-icon .fad, tbody tr.selectable:hover .watch-icon:hover .fad {
  color: #FFFFFF; }

.course {
  text-align: left; }

td, th {
  box-sizing: border-box;
  padding: 0;
  height: 2rem;
  vertical-align: middle;
  transition: all 0.2s; }

table.splits-table td, table.splits-table th {
  padding: 0.25rem 0.5rem;
  text-align: left; }
  table.splits-table td:first-child, table.splits-table th:first-child {
    padding-left: 1rem; }
  table.splits-table td:last-child, table.splits-table th:last-child {
    padding-right: 1rem; }
table.splits-table th {
  background-color: #E5E5E5;
  height: 2rem; }
table.splits-table .eta-time {
  color: rgba(0, 0, 0, 0.4);
  font-style: italic; }

.course {
  text-align: left;
  padding-left: 0.375rem;
  background-color: #E5E5E5;
  border-left-width: 0.25rem;
  border-left-style: solid;
  height: 2rem;
  line-height: 2rem; }

.header, .times {
  min-width: 5rem;
  padding: 0 0.375rem; }

.times {
  text-align: center; }
  .times .additional-time {
    display: block;
    padding: 2px 4px 0 0; }

.sticky-left {
  position: sticky;
  left: 0;
  z-index: 3;
  border-left-width: 0.25rem;
  border-left-style: solid; }

.sticky-top {
  z-index: 4;
  top: 0;
  position: sticky; }
  .sticky-top.behind {
    z-index: 0; }
  .sticky-top.first {
    z-index: 5;
    left: 0; }

.browser-ios .sticky-top {
  position: static; }

_::-webkit-full-page-media, _:future, :root .sticky-top {
  position: static; }

tbody th, td {
  border-bottom: 1px solid #EEEEEE;
  border-right: 1px solid #EEEEEE; }

table.team-table tbody tr.course-row th {
  background-color: #E5E5E5; }

tbody tr:nth-child(odd) th:not(.course), tbody tr:nth-child(odd) td {
  background-color: #FFFFFF; }

tbody tr:nth-child(even) th:not(.course), tbody tr:nth-child(even) td {
  background-color: #F8F8F8; }

img {
  animation: fadeIn ease 1s;
  -webkit-animation: fadeIn ease 1s;
  -moz-animation: fadeIn ease 1s;
  -o-animation: fadeIn ease 1s;
  -ms-animation: fadeIn ease 1s; }

@keyframes fadeIn {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }
@-moz-keyframes fadeIn {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }
@-webkit-keyframes fadeIn {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }
@-o-keyframes fadeIn {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }
@-ms-keyframes fadeIn {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }

.button-slider {
  background-color: #FFFFFF;
  font-size: 0.8333rem;
  color: #444444;
  border-radius: 0.25rem;
  box-sizing: border-box;
  border: none;
  box-shadow: 0 2px 3px rgba(0, 0, 0, 0.15);
  font-family: Arial, sans-serif;
  height: 2.19rem;
  width: 100%;
  padding: 0 30px 0 0;
  position: relative;
  border-top: 1px #BBBBBB solid;
  border-left: 1px #BBBBBB solid;
  border-right: 1px #BBBBBB solid;
  border-bottom: 2px solid #b1450a;
  transition: all 0.2s linear;
  cursor: pointer; }
  .button-slider:before, .button-slider:after {
    content: '';
    position: absolute;
    display: block;
    right: 0.5rem;
    width: 12px;
    height: 4px;
    background-color: #444444;
    transition: all 0.2s linear; }
  .button-slider:before {
    transform: rotate(45deg);
    top: 11px; }
  .button-slider:after {
    transform: rotate(-45deg);
    bottom: 11px; }
  .button-slider .fa-stopwatch {
    color: #eb5b0d;
    padding-left: 2px;
    padding-right: 2px; }
  .button-slider .button {
    transition: all 0.2s linear;
    height: 2rem;
    line-height: 2rem;
    border-radius: 3px;
    padding: 0 0.75rem;
    background-color: #FFFFFF;
    color: #444444;
    border-bottom: 2px solid #b1450a; }
    .button-slider .button .fa {
      font-size: 1.125rem;
      position: relative;
      top: 2px;
      margin-right: 3px; }
    .button-slider .button .text:before {
      content: ''; }

.no-click {
  pointer-events: none; }

.input-group {
  position: relative; }
  .input-group .input-text {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    color: #BBBBBB;
    font-size: 0.8333rem; }
    .input-group .input-text-right {
      right: 0.75rem; }
    .input-group .input-text-left {
      left: 0.75rem; }

::placeholder {
  font-size: 0.8333rem;
  color: #444444; }

.checkbox-label {
  font-size: 0.8333rem;
  color: #BBBBBB;
  width: 100%;
  height: 2rem;
  line-height: 2rem; }

.input-style {
  background-color: #FFFFFF;
  font-size: 0.8333rem;
  color: #444444;
  border-radius: 0.25rem;
  box-sizing: border-box;
  border: none;
  box-shadow: 0 2px 3px rgba(0, 0, 0, 0.15);
  font-family: Arial, sans-serif;
  height: 2rem;
  line-height: 2rem;
  padding: 0 0.75rem;
  width: 100%; }

.select-style {
  padding: 0; }

.select-style + .input-text {
  display: none; }

.checkbox {
  height: 2rem;
  line-height: 2rem;
  width: 100%; }

label {
  font-size: 0.8333rem;
  color: #444444;
  cursor: pointer; }

@supports (-webkit-appearance: none) or (-moz-appearance: none) {
  .checkbox-style {
    -webkit-appearance: none;
    -moz-appearance: none;
    -o-appearance: none;
    appearance: none;
    background-color: #FFFFFF;
    font-size: 0.8333rem;
    color: #444444;
    border-radius: 0.25rem;
    box-sizing: border-box;
    border: none;
    box-shadow: 0 2px 3px rgba(0, 0, 0, 0.15);
    font-family: Arial, sans-serif;
    margin: 0;
    width: 16px;
    height: 16px;
    transition: background-color 0.1s linear;
    position: relative;
    top: 2px;
    cursor: pointer; }
    .checkbox-style + label {
      padding-left: 6px;
      position: relative; }
      .checkbox-style + label:before, .checkbox-style + label:after {
        position: absolute;
        z-index: 1;
        content: '';
        height: 3px;
        display: block;
        background-color: #F8F8F8;
        transform-origin: top left; }
      .checkbox-style + label:before {
        width: 6px;
        left: -16.5px;
        top: 4.5px;
        transform: rotate(45deg); }
      .checkbox-style + label:after {
        left: -15.5px;
        top: 9.5px;
        width: 11px;
        transform: rotate(-45deg); }
    .checkbox-style:checked {
      background-color: #eb5b0d !important; }
  .select-style {
    -webkit-appearance: none;
    -moz-appearance: none;
    -o-appearance: none;
    appearance: none;
    position: relative;
    padding: 0 0.75rem; }
    .select-style + .input-text {
      display: block;
      right: 0.5rem; } }

#search-box {
  padding-right: 2rem; }

#search-icon {
  display: block;
  width: 15px;
  height: 15px;
  border-radius: 50%;
  box-sizing: border-box;
  border: 3px solid #E5E5E5;
  transform: translateY(-50%) rotate(-45deg);
  top: 48% !important; }
  #search-icon:before, #search-icon:after {
    position: absolute;
    content: '';
    width: 3px;
    height: 8px;
    border-radius: 2px;
    display: block;
    background-color: #E5E5E5;
    top: 10px;
    left: 3.5px; }

#search-box.typed + #search-icon {
  border-color: #FFFFFF;
  cursor: pointer; }
  #search-box.typed + #search-icon:hover:before, #search-box.typed + #search-icon:hover:after {
    background-color: #eb5b0d; }
  #search-box.typed + #search-icon:before {
    animation: searchClearOne 0.2s linear forwards; }
  #search-box.typed + #search-icon:after {
    animation: searchClearTwo 0.2s linear forwards; }

#filter {
  padding-left: 3.2rem;
  padding-right: 2rem; }

@keyframes searchClearOne {
  from {
    top: 10px;
    height: 8px; }
  to {
    top: 0;
    height: 14px; } }
@keyframes searchClearTwo {
  0% {
    top: 10px;
    height: 8px;
    transform: rotate(0); }
  50% {
    top: 0;
    height: 14px;
    transform: rotate(0); }
  100% {
    top: 0;
    height: 14px;
    transform: rotate(90deg); } }

#map {
  height: 100vh;
  height: calc(var(--vh, 1vh) * 100);
  width: 100vw;
  z-index: 1; }
  #map p:empty {
    display: none; }
  #map .leaflet-container {
    background: none; }
  #map .leaflet-top {
    top: 3rem;
    z-index: 1000; }
  @media only screen and (min-width: 768px) and (max-width: 1199px) {
    #map .leaflet-top {
      top: 5.5rem; } }
@media only screen and (min-width: 1200px) {
  #map .leaflet-top {
    top: 4rem; } }
#map .leaflet-google-mutant.leaflet-top {
  top: 0 !important;
  left: 0 !important; }
#map .leaflet-bottom.leaflet-right {
  left: auto;
  right: 0.5rem;
  bottom: 0;
  margin: 0 !important; }
@media only screen and (min-width: 768px) {
  #map .leaflet-bottom.leaflet-right {
    right: 1rem; } }
#map .leaflet-bottom.leaflet-right .leaflet-control {
  float: right; }
#map .leaflet-bottom.leaflet-right .leaflet-control-scale {
  margin-right: 0;
  margin-bottom: 1rem; }
#map .leaflet-bottom.leaflet-right .leaflet-control-attribution {
  height: 1rem;
  line-height: 1rem;
  border-radius: 0.75rem; }
#map .leaflet-popup-content-wrapper {
  padding: 0;
  color: #333333;
  border-radius: 0.75rem;
  overflow: hidden; }
#map .leaflet-popup-tip, #map .leaflet-popup-content-wrapper {
  background-color: #FFFFFF;
  color: #444444; }
#map .leaflet-popup-close-button {
  height: 1.75rem;
  width: 1.75rem;
  background-color: #eb5b0d;
  border-radius: 0 0.75rem 0 0.75rem;
  line-height: 1.5rem;
  padding: 0;
  color: white; }
  #map .leaflet-popup-close-button:hover {
    background-color: #b1450a; }
#map .leaflet-popup-content {
  width: auto !important;
  margin: 0 -1px 0 0 !important;
  padding: 0 0.75rem; }
#map .leaflet-control {
  float: left; }
#map .leaflet-left {
  left: 0.5rem;
  right: auto;
  transition: left 0.4s linear; }
@media only screen and (min-width: 768px) {
  #map .leaflet-left {
    left: 1rem; } }
#map .leaflet-touch .leaflet-control-layers-toggle {
  width: 3rem;
  height: 3rem; }
#map .leaflet-control-layers, #map .leaflet-control-zoom, #map .leaflet-bar {
  border-radius: 0.75rem;
  border: none;
  background-color: #FFFFFF;
  margin-left: 0;
  overflow: hidden;
  margin-top: 0.5rem;
  box-shadow: 2px 2px 4px 0 rgba(0, 0, 0, 0.3); }
@media only screen and (min-width: 768px) {
  #map .leaflet-control-layers, #map .leaflet-control-zoom, #map .leaflet-bar {
    margin-top: 1rem; } }
#map .leaflet-bar a {
  background-color: #FFFFFF;
  color: #eb5b0d;
  border-radius: 0;
  width: 2rem;
  height: 2rem;
  line-height: 2rem;
  font-size: 1.125rem;
  border-bottom: 1px solid #DDDDDD;
  cursor: pointer; }
  #map .leaflet-bar a:hover {
    background-color: #DDDDDD; }
  #map .leaflet-bar a.polyline-measure-controlOnBgColor {
    background-color: #eb5b0d;
    color: white; }
#map .leaflet-bar.leaflet-html-legend {
  min-width: 2rem; }
  #map .leaflet-bar.leaflet-html-legend h4 {
    margin: 0;
    padding: 0 0.5rem;
    height: 2rem;
    line-height: 2rem;
    background-color: #F8F8F8;
    cursor: pointer; }
    #map .leaflet-bar.leaflet-html-legend h4:hover, #map .leaflet-bar.leaflet-html-legend h4.closed:hover {
      background-color: #E5E5E5; }
    #map .leaflet-bar.leaflet-html-legend h4.closed {
      background-color: #FFFFFF; }
      #map .leaflet-bar.leaflet-html-legend h4.closed span:before {
        content: '▼ '; }
      #map .leaflet-bar.leaflet-html-legend h4.closed + .legend-elements {
        display: none; }
    #map .leaflet-bar.leaflet-html-legend h4 span:before {
      content: '▲ '; }
  #map .leaflet-bar.leaflet-html-legend .legend-row {
    position: relative; }
    #map .leaflet-bar.leaflet-html-legend .legend-row:not(:first-child) {
      border-top: 1px solid #F8F8F8; }
    #map .leaflet-bar.leaflet-html-legend .legend-row .symbol {
      position: absolute;
      width: 2rem;
      top: 0.2rem;
      left: 0;
      text-align: center; }
      #map .leaflet-bar.leaflet-html-legend .legend-row .symbol span {
        color: #444444; }
        #map .leaflet-bar.leaflet-html-legend .legend-row .symbol span.circle {
          margin-top: 1px;
          height: 0.75rem;
          width: 0.75rem;
          border-radius: 50%;
          display: inline-block; }
    #map .leaflet-bar.leaflet-html-legend .legend-row label {
      padding: 0.125rem 0.5rem 0.125rem 2rem;
      font-size: 11px;
      display: block; }
#map .leaflet-div-icon {
  background: none !important;
  border: none !important; }

#windy .leaflet-marker-icon:not(.bounce), #map .leaflet-marker-icon:not(.bounce) {
  -webkit-transition: transform 0.5s linear;
  -ms-transition: transform 0.5s linear;
  -moz-transition: transform 0.5s linear;
  transition: transform 0.5s linear; }

.esri-satellite .polyline-measure-tooltip, .bing-aerial .polyline-measure-tooltip {
  color: white;
  text-shadow: 2px 2px 2px rgba(0, 0, 0, 0.3); }

/*
 Flaticon icon font: Flaticon
 Creation date: 13/03/2023 19:29
 */
@font-face {
  font-family: "Flaticon";
  src: url("/assets/fonts/flaticon_disciplines.ttf?725f8476d8ade62a96b7eeccf9c178c6") format("truetype"), url("/assets/fonts/flaticon_disciplines.woff?725f8476d8ade62a96b7eeccf9c178c6") format("woff"), url("/assets/fonts/flaticon_disciplines.woff2?725f8476d8ade62a96b7eeccf9c178c6") format("woff2"), url("/assets/fonts/flaticon_disciplines.eot?725f8476d8ade62a96b7eeccf9c178c6#iefix") format("embedded-opentype"), url("/assets/fonts/flaticon_disciplines.svg?725f8476d8ade62a96b7eeccf9c178c6#flaticon_disciplines") format("svg"); }

i[class^="flaticon-"]:before, i[class*=" flaticon-"]:before {
  font-family: flaticon_disciplines !important;
  font-style: normal;
  font-weight: normal !important;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale; }

.fi:before {
  display: inline-block;
  font-family: "Flaticon";
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  line-height: 1;
  text-decoration: inherit;
  text-rendering: optimizeLegibility;
  text-transform: none;
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased;
  font-smoothing: antialiased; }

.flaticon-boiting:before {
  content: "\f101"; }

.flaticon-canoe:before {
  content: "\f102"; }

.flaticon-trekking:before {
  content: "\f103"; }

.flaticon-swimming:before {
  content: "\f104"; }

.flaticon-paddleboarding:before {
  content: "\f105"; }

.flaticon-wheel:before {
  content: "\f106"; }

.flaticon-kayaking:before {
  content: "\f107"; }

.flaticon-sailing-boat-sailing:before {
  content: "\f108"; }

.flaticon-sprint:before {
  content: "\f109"; }

.flaticon-bicycle:before {
  content: "\f10a"; }

.flaticon-climbing:before {
  content: "\f10b"; }

.flaticon-bicycle-rider:before {
  content: "\f10c"; }

.flaticon-kayak:before {
  content: "\f10d"; }

.flaticon-chronometer:before {
  content: "\f10e"; }

.flaticon-adventure:before {
  content: "\f10f"; }

.flaticon-man-in-canoe:before {
  content: "\f110"; }

.flaticon-sword:before {
  content: "\f111"; }

.flaticon-climbing-sport:before {
  content: "\f112"; }

.flaticon-snow-bike:before {
  content: "\f113"; }

.flaticon-dog-sled:before {
  content: "\f114"; }

.panels.sponsored:not(.gmaps) .no-leaderboard .list {
  height: calc(100% - 7rem); }
@media only screen and (min-width: 768px) {
  .panels.sponsored:not(.gmaps) .panel:not(.leaderboard-open) {
    height: calc(100vh - 12.5rem);
    height: calc(calc(var(--vh, 1vh) * 100) - 12.5rem);
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0; } }

.panels.sponsored.gmaps .no-leaderboard .list {
  height: calc(100% - 7rem); }
@media only screen and (min-width: 768px) {
  .panels.sponsored.gmaps .panel:not(.leaderboard-open) {
    height: calc(100vh - 14.5rem);
    height: calc(calc(var(--vh, 1vh) * 100) - 14.5rem);
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0; } }

.sponsors {
  width: 100%;
  max-width: 28rem;
  position: absolute;
  overflow: hidden;
  border-radius: 0 0 0.75rem 0.75rem;
  box-sizing: border-box;
  z-index: 1;
  display: none;
  bottom: 0;
  left: 0;
  box-shadow: 2px 2px 4px 0 rgba(0, 0, 0, 0.2); }
@media only screen and (min-width: 768px) {
  .sponsors {
    display: block;
    border-top: 2px solid #eb5b0d;
    height: 7.5rem; } }
.sponsors a {
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
  position: absolute;
  bottom: auto;
  left: 0;
  top: 50%; }
.sponsors img {
  display: block;
  height: auto;
  width: 100%; }

.mobilesponsors {
  overflow: hidden;
  display: block;
  position: fixed;
  box-sizing: border-box;
  bottom: 0px;
  left: 0px;
  right: 0px;
  padding: 0.2rem;
  width: 100%;
  height: 60px;
  margin: 0px auto;
  background-color: white;
  z-index: 3000;
  text-align: center; }
  .mobilesponsors a {
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    position: absolute;
    bottom: auto;
    top: 50%; }
  .mobilesponsors img {
    display: block;
    max-height: 60px;
    width: 100%; }

#app #windy {
  height: 100vh;
  width: 100vw;
  z-index: 1; }
  #app #windy #map-container .leaflet-control-container {
    display: block !important; }
    #app #windy #bottom #progress-bar .play-pause {
      background-color: #FFFFFF;
      color: #eb5b0d; }
    #app #windy #bottom #progress-bar .played {
      background-color: white; }
    #app #windy #bottom #progress-bar .timecode .box {
      background-color: #eb5b0d; }
      #app #windy #bottom #progress-bar .timecode .box:before {
        border-top-color: #eb5b0d; }
  #app #windy .popup-row {
    padding: 0.5rem; }
  #app #windy #mobile-ovr-select, #app #windy #plugin-menu, #app #windy #embed-zoom {
    left: 1rem;
    right: auto;
    transition: left 0.2s ease; }
  #app #windy #mobile-ovr-select {
    top: 9rem;
    margin-top: 0;
    height: 2rem;
    border-radius: 0.75rem;
    background-color: #FFFFFF;
    padding: 0 0.75rem;
    transform: none;
    overflow: hidden;
    padding-right: 2.5rem; }
    #app #windy #mobile-ovr-select:before {
      background-color: #eb5b0d;
      color: white;
      height: 2rem;
      width: 2rem;
      font-size: 1.5rem;
      line-height: 2rem;
      box-shadow: none;
      border-radius: 0;
      left: auto;
      right: 0; }
    #app #windy #mobile-ovr-select span {
      font-size: 0.8333rem;
      color: #444444;
      text-shadow: none;
      line-height: 2rem;
      letter-spacing: 0; }
  #app #windy #embed-zoom {
    top: 12rem;
    transform: none; }
    #app #windy #embed-zoom .zoom-ctrl {
      height: 2rem;
      width: 2rem;
      background-color: #FFFFFF;
      line-height: 2rem;
      font-size: 1rem;
      color: #eb5b0d;
      margin-bottom: 0; }
      #app #windy #embed-zoom .zoom-ctrl:hover {
        background-color: #E5E5E5; }
      #app #windy #embed-zoom .zoom-ctrl.zoom-plus {
        border-bottom: 1px solid #E5E5E5;
        border-radius: 0.75rem 0.75rem 0 0; }
      #app #windy #embed-zoom .zoom-ctrl.zoom-minus {
        border-radius: 0 0 0.75rem 0.75rem; }
  #app #windy #plugin-menu {
    top: 9rem;
    width: 16rem; }
    #app #windy #plugin-menu.plugin-rhpane {
      transform: translateX(-120%); }
      #app #windy #plugin-menu.plugin-rhpane.open {
        transform: none; }
    #app #windy #plugin-menu .closing-x {
      right: -2rem;
      left: auto;
      border-top-right-radius: 0.75rem;
      border-bottom-right-radius: 0.75rem;
      border-top-left-radius: 0;
      border-bottom-left-radius: 0;
      height: 2rem;
      width: 2rem;
      background-color: #eb5b0d;
      color: white;
      font-size: 1.25rem;
      margin: 0;
      top: 1rem;
      line-height: 2rem;
      text-align: center;
      font-weight: 700; }
    #app #windy #plugin-menu .plugin-content {
      margin-right: 0;
      width: 100%;
      background-color: #FFFFFF;
      bottom: auto;
      right: auto;
      border-radius: 0.75rem;
      overflow: hidden; }
      #app #windy #plugin-menu .plugin-content #layers-menu a {
        color: #444444; }
        #app #windy #plugin-menu .plugin-content #layers-menu a:hover .menu-text {
          text-decoration: underline; }
        #app #windy #plugin-menu .plugin-content #layers-menu a.selected .iconfont {
          background-color: #eb5b0d;
          color: white; }
      #app #windy #plugin-menu .plugin-content .menu-subtitle {
        font-size: 0.8333rem;
        letter-spacing: 0;
        margin-left: 0; }
      #app #windy #plugin-menu .plugin-content #layers-levels {
        margin: 0;
        background-color: #F8F8F8;
        color: #eb5b0d;
        border-radius: 0;
        padding: 1rem;
        width: 100%; }
        #app #windy #plugin-menu .plugin-content #layers-levels .menu-subtitle {
          color: #444444; }
        #app #windy #plugin-menu .plugin-content #layers-levels:before {
          color: #E5E5E5; }
        #app #windy #plugin-menu .plugin-content #layers-levels .notap {
          height: 0.5rem;
          margin: 0.5rem 0 !important;
          background-color: #E5E5E5;
          width: 100%; }
        #app #windy #plugin-menu .plugin-content #layers-levels input[type=range]::-ms-thumb, #app #windy #plugin-menu .plugin-content #layers-levels input[type=range]::-moz-range-thumb, #app #windy #plugin-menu .plugin-content #layers-levels input[type=range]::-webkit-slider-thumb {
          height: 1rem;
          width: 1rem;
          background-color: #eb5b0d;
          border-right: 1rem;
          box-shadow: none; }
        #app #windy #plugin-menu .plugin-content #layers-levels a.sub-menu .menu-text {
          font-size: 0.7rem; }
      #app #windy #plugin-menu .plugin-content .build-info {
        background-color: #E5E5E5;
        color: #444444;
        opacity: 1; }
        #app #windy #plugin-menu .plugin-content .build-info a {
          color: #eb5b0d; }
      #app #windy #plugin-menu .plugin-content #product-switch-mobile {
        background-color: #b1450a !important; }
        #app #windy #plugin-menu .plugin-content #product-switch-mobile .menu-subtitle {
          color: white;
          padding-left: 13px; }
        #app #windy #plugin-menu .plugin-content #product-switch-mobile .selected {
          background-color: #f36d24 !important; }
  #app #windy .leaflet-popup-content-wrapper {
    padding: 0;
    color: #333333;
    border-radius: 0.75rem;
    overflow: hidden; }
  #app #windy .leaflet-popup-content {
    width: auto !important;
    margin: 0 -1px 0 0 !important; }
  #app #windy .leaflet-container a.leaflet-popup-close-button {
    height: 1.75rem;
    width: 1.75rem;
    background-color: #eb5b0d;
    border-radius: 0 0.75rem 0 0.75rem;
    line-height: 1.5rem;
    padding: 0;
    color: white; }
    #app #windy .leaflet-container a.leaflet-popup-close-button:hover {
      background-color: #b1450a; }

.windyOpen {
  position: fixed;
  top: 3.5rem;
  left: 0.5rem;
  height: 3rem;
  line-height: 3rem;
  background-color: #FFFFFF;
  border-radius: 0.75rem;
  overflow: hidden;
  cursor: pointer;
  text-align: center;
  z-index: 2;
  color: white;
  display: none;
  transition: all 0.4s;
  box-shadow: 2px 2px 4px 0 rgba(0, 0, 0, 0.3); }
@media only screen and (min-width: 768px) {
  .windyOpen {
    display: flex;
    left: 1rem; } }
@media only screen and (min-width: 768px) and (max-width: 1199px) {
  .windyOpen {
    top: 6rem; } }
@media only screen and (min-width: 1200px) {
  .windyOpen {
    top: 5rem; } }
.windyOpen .second {
  display: none; }
.windyOpen .icon {
  font-size: 1.5rem;
  height: 3rem;
  width: 3rem;
  line-height: 3rem;
  background-color: #eb5b0d;
  color: white; }
.windyOpen .text {
  display: none;
  font-size: 0.8333rem;
  color: #444444;
  margin: 0 1rem; }
.windyOpen:hover .icon {
  background-color: #b1450a; }
.windyOpen.open {
  background-color: #FFFFFF; }
  .windyOpen.open .text {
    display: flex; }
  .windyOpen.open .first {
    display: none; }
  .windyOpen.open .second {
    display: block; }

@media only screen and (min-width: 768px) {
  #app.open #windy #mobile-ovr-select, #app.open #windy #plugin-menu, #app.open #windy #embed-zoom {
    left: 29rem; }
  #app.open #windy #mobile-ovr-select, #app.open #windy #plugin-menu .plugin-content, #app.open #windy #embed-zoom .zoom-ctrl {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0; }
  #app.open .windyOpen {
    left: 29rem;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0; }
  body.has-windy #app #map .leaflet-top {
    top: 8rem; }
    body.has-windy #app.windy .panels.sponsored .sponsors {
      display: none; }
    body.has-windy #app.windy .panels.sponsored .panel {
      border-bottom-left-radius: 0.75rem;
      border-bottom-right-radius: 0.75rem; } }
  @media only screen and (min-width: 768px) and (min-width: 768px) and (max-width: 1199px) {
    body.has-windy #app #map .leaflet-top {
      top: 9rem; } }
  @media only screen and (min-width: 768px) and (min-width: 768px) {
    body.has-windy #app.windy .panels.sponsored .panel {
      height: calc(100vh - 10rem);
      height: calc(calc(var(--vh, 1vh) * 100) - 10rem); } }

.news-item {
  background-color: #FFFFFF;
  overflow: hidden;
  margin: 0 auto;
  max-width: 28rem;
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
  position: relative; }
  .news-item .news-image {
    width: 100%;
    display: block;
    height: auto; }
  .news-item .news-title {
    display: flex;
    padding: 0 1rem;
    justify-content: space-between;
    align-items: center; }
    .news-item .news-title h2 {
      margin: 0 auto 0 0;
      width: 90%;
      font-size: 1.2rem;
      line-height: 1.625rem;
      box-sizing: border-box;
      padding: 0.625rem 0;
      position: relative;
      z-index: 1; }
  .news-item .news-body {
    padding: 0 1rem; }
  .news-item .read-more {
    color: #eb5b0d;
    cursor: pointer;
    display: inline !important; }
    .news-item .read-more:hover {
      color: #f36d24; }
  .news-item.overview {
    width: calc(100% - 2rem);
    font-size: 0.8333rem;
    margin: 1rem auto;
    height: auto;
    max-width: 25rem;
    border-radius: 0.75rem;
    box-shadow: 2px 2px 4px 0 rgba(0, 0, 0, 0.1); }
    .news-item.overview h2 {
      cursor: pointer;
      width: 100%; }
      .news-item.overview h2:hover {
        color: #eb5b0d; }
    .news-item.overview .news-body {
      padding: 1rem; }
    .news-item.overview .news-html {
      display: inline; }
    .news-item.overview .news-html > :first-child {
      display: inline; }
    .news-item.overview .news-html > :not(:first-child) {
      display: none; }

#trailmail, .form-trailmail {
  box-sizing: border-box;
  width: 100%;
  margin: 0 auto;
  background-color: #E5E5E5; }
  #trailmail .trail-body, .form-trailmail .trail-body {
    padding: 0.5rem 1rem;
    background-color: #E5E5E5; }
    #trailmail .trail-body .trail-empty, .form-trailmail .trail-body .trail-empty {
      text-align: center;
      padding: 1rem;
      box-sizing: border-box;
      width: 100%;
      font-size: 0.875rem; }
  #trailmail .trail-mail, .form-trailmail .trail-mail {
    margin: 0 auto;
    padding: 0.5rem 0;
    width: 100%;
    max-width: 28rem;
    font-size: 0.8333rem; }
    #trailmail .trail-mail .message, .form-trailmail .trail-mail .message {
      background-color: #FFFFFF;
      display: inline-block;
      position: relative;
      padding: 0.75rem;
      border-radius: 0.75rem 0.75rem 0.75rem 0; }
      #trailmail .trail-mail .message:before, .form-trailmail .trail-mail .message:before {
        content: '';
        position: absolute;
        bottom: -1.5rem;
        left: 0;
        border-top: 1.5rem solid #FFFFFF;
        border-right: 1rem solid transparent; }
    #trailmail .trail-mail .from, .form-trailmail .trail-mail .from {
      padding: 0.25rem 0.25rem 0.25rem 1rem;
      font-size: 0.75rem;
      color: #333333;
      display: flex; }
      #trailmail .trail-mail .from .author, .form-trailmail .trail-mail .from .author {
        font-weight: bold; }

.trailmail-form .mail-response {
  width: 100%;
  box-sizing: border-box;
  padding: 0.25rem 0.5rem 0.25rem 1rem;
  color: white;
  background-color: #d9534f;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-radius: 0.375rem; }
  .trailmail-form .mail-response.success {
    background-color: #5cb85c; }
  .trailmail-form .mail-response .text {
    font-size: 0.8333rem; }
  .trailmail-form .mail-response .icon-link {
    color: white; }
.trailmail-form .btn {
  width: 100%; }

.download {
  position: fixed;
  box-sizing: border-box;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 1rem;
  width: 100%;
  max-width: 28rem;
  margin: 0 auto;
  background-color: #FFFFFF;
  z-index: 3000;
  transition: 0.4s; }
  .download.off {
    -webkit-transform: translateY(100%);
    -moz-transform: translateY(100%);
    transform: translateY(100%); }
  .download .download-close {
    position: absolute;
    top: 0.5rem;
    right: 0.75rem;
    z-index: 2; }
  .download .download-image {
    position: absolute;
    top: 50%;
    left: 1rem;
    width: 40%;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%); }
    .download .download-image img {
      width: 100%;
      height: auto;
      display: block; }
  .download .download-text {
    width: 50%;
    margin-left: auto; }
    .download .download-text h5 {
      color: #eb5b0d;
      margin: 0 0 0.5rem; }
    .download .download-text p {
      margin: 0; }

.replay {
  right: 1rem;
  width: 100%;
  max-width: calc(100vw - 28rem - 3rem);
  background-color: #FFFFFF;
  border-radius: 0.75rem;
  bottom: 1rem;
  position: fixed;
  z-index: 3;
  min-height: 93px;
  box-shadow: 2px 2px 4px 0 rgba(0, 0, 0, 0.3); }
  .replay .close {
    background-color: #eb5b0d;
    color: white;
    position: absolute;
    top: -2rem;
    right: 1rem;
    border-radius: 0.375rem 0.375rem 0 0; }
  .replay .replay-error {
    text-align: center;
    box-sizing: border-box;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 2;
    width: 100%;
    padding: 2.5rem;
    font-size: 0.875rem;
    border-radius: 0.75rem;
    background-color: rgba(255, 255, 255, 0.7); }
  .replay .replay-range {
    width: 100%;
    position: relative;
    padding: 0.5rem 0.5rem 0.375rem;
    box-sizing: border-box; }
  .replay .replay-details {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    padding: 0.5rem 1rem;
    box-sizing: border-box;
    background-color: #F8F8F8;
    border-radius: 0.75rem; }
    .replay .replay-details .date, .replay .replay-details .elapsed {
      width: 11rem;
      font-size: 0.875rem; }
    .replay .replay-details .date {
      text-align: right; }
  .replay .replay-options {
    width: 12rem;
    display: flex;
    justify-content: space-between;
    align-items: center; }
    .replay .replay-options .option-group {
      border-radius: 0.375rem;
      display: flex;
      border: 1px solid #E5E5E5;
      background-color: #FFFFFF; }
      .replay .replay-options .option-group.large .icon-link {
        height: 2.5rem;
        width: 2.5rem;
        line-height: 2.5rem;
        font-size: 1.125rem; }
    .replay .replay-options .icon-link {
      font-size: 1rem;
      box-sizing: border-box;
      padding: 0 0.25rem;
      border-radius: 0; }
      .replay .replay-options .icon-link.inactive {
        background-color: #E5E5E5;
        color: rgba(0, 0, 0, 0.2); }
      .replay .replay-options .icon-link.underline {
        border-bottom: 0.25rem solid #eb5b0d; }
      .replay .replay-options .icon-link:not(:last-child) {
        border-right: 1px solid #DDDDDD; }
      .replay .replay-options .icon-link.icon-text {
        cursor: default;
        font-size: 0.875rem;
        color: #444444;
        font-weight: bold; }
  .replay .icon-link {
    margin: 0; }

input[type=range] {
  width: 100%;
  background-color: transparent;
  -webkit-appearance: none;
  margin: 0; }

input[type=range]:focus {
  outline: none; }

input[type=range]::-webkit-slider-runnable-track {
  background: #DDDDDD;
  border: 0;
  width: 100%;
  height: 0.375rem;
  cursor: pointer; }

input[type=range]::-webkit-slider-thumb {
  width: 1rem;
  height: 1rem;
  background: #eb5b0d;
  border: 0;
  border-radius: 1rem;
  cursor: pointer;
  -webkit-appearance: none; }

input[type=range]:focus::-webkit-slider-runnable-track {
  background: #DDDDDD; }

input[type=range]::-moz-range-thumb {
  width: 1rem;
  height: 1rem;
  border-radius: 1rem;
  background: #eb5b0d;
  border: 0;
  cursor: pointer; }

input[type=range]::-moz-range-track {
  background: #DDDDDD;
  border: 0;
  width: 100%;
  height: 0.375rem;
  cursor: pointer; }

input[type="range"]::-moz-range-progress {
  background-color: #eb5b0d; }

input[type=range]::-ms-track {
  background: transparent;
  border-color: transparent;
  border-width: 5px 0;
  color: transparent;
  width: 100%;
  height: 10px;
  cursor: pointer; }

/* IE*/
input[type=range]::-ms-fill-lower {
  background: #DDDDDD;
  border: 0;
  border-radius: 10px; }

input[type=range]::-ms-fill-upper {
  background: #eb5b0d;
  border: 0;
  border-radius: 10px; }

input[type=range]::-ms-thumb {
  width: 16px;
  height: 16px;
  background: #eb5b0d;
  border: 0;
  border-radius: 1px;
  cursor: pointer;
  margin-top: 0px;
  /*Needed to keep the Edge thumb centred*/ }

input[type=range]:focus::-ms-fill-lower {
  background: #DDDDDD; }

input[type=range]:focus::-ms-fill-upper {
  background: #eb5b0d; }

/*TODO: Use one of the selectors from https://stackoverflow.com/a/20541859/7077589 and figure out
 how to remove the virtical space around the range input in IE*/
@supports (-ms-ime-align:auto) {
  /* Pre-Chromium Edge only styles, selector taken from hhttps://stackoverflow.com/a/32202953/7077589 */
  input[type=range] {
    margin: 0;
    /*Edge starts the margin from the thumb, not the track as other browsers do*/ } }
/*Chrome*/
@media screen and (-webkit-min-device-pixel-ratio: 0) {
  input[type='range'] {
    overflow: hidden; }
  input[type='range']::-webkit-slider-runnable-track {
    height: 10px;
    -webkit-appearance: none;
    color: #13bba4;
    margin-top: -1px; }
  input[type='range']::-webkit-slider-thumb {
    width: 10px;
    -webkit-appearance: none;
    height: 10px;
    cursor: ew-resize;
    box-shadow: -100% 0 0 100% #43e5f7; } }

.trans-0 #windy .leaflet-marker-icon, .trans-0 #map .leaflet-marker-icon {
  -webkit-transition: transform 0 linear;
  -ms-transition: transform 0 linear;
  -moz-transition: transform 0 linear;
  transition: transform 0 linear; }

.trans-1 #windy .leaflet-marker-icon, .trans-1 #map .leaflet-marker-icon {
  -webkit-transition: transform 1.1s linear;
  -ms-transition: transform 1.1s linear;
  -moz-transition: transform 1.1s linear;
  transition: transform 1.1s linear; }

.trans-2 #windy .leaflet-marker-icon, .trans-2 #map .leaflet-marker-icon {
  -webkit-transition: transform 0.6s linear;
  -ms-transition: transform 0.6s linear;
  -moz-transition: transform 0.6s linear;
  transition: transform 0.6s linear; }

.trans-4 #windy .leaflet-marker-icon, .trans-4 #map .leaflet-marker-icon {
  -webkit-transition: transform 0.3s linear;
  -ms-transition: transform 0.3s linear;
  -moz-transition: transform 0.3s linear;
  transition: transform 0.3s linear; }

@media only screen and (max-width: 640px) {
  .mobilevideocontainer {
    position: fixed;
    bottom: 0.5rem;
    left: 0;
    right: 0;
    height: 180px; } }

.video, .video-container {
  width: 320px;
  height: 180px; }

.video {
  left: 0.5rem;
  bottom: 0.5rem;
  position: fixed;
  z-index: 3;
  background-color: #FFFFFF;
  border-radius: 0.75rem;
  transition: 0.4s;
  box-shadow: 2px 2px 4px 0 rgba(0, 0, 0, 0.3); }
@media only screen and (min-width: 768px) {
  .video {
    left: 1rem;
    bottom: 1rem; } }
.video .close {
  background-color: #eb5b0d;
  color: white;
  position: absolute;
  top: -2rem;
  right: 1rem;
  border-radius: 0.375rem 0.375rem 0 0; }
.video .video-container {
  border-radius: 0.75rem;
  overflow: hidden; }

@media only screen and (min-width: 768px) {
  #app.open .video {
    left: 30rem; } }

@media only screen and (max-width: 640px) {
  .mobilevideocontainer .video {
    position: relative;
    margin: auto;
    left: initial;
    bottom: initial;
    left: initial; } }

#video-feed {
  box-sizing: border-box;
  border-radius: 0.75rem;
  width: calc(100vw - 1rem);
  display: flex; }
@media only screen and (min-width: 768px) {
  #video-feed {
    position: fixed;
    height: calc(135px + 1.5rem);
    top: auto;
    overflow: hidden;
    left: 30rem;
    bottom: 1rem;
    box-shadow: none;
    background-color: transparent;
    max-width: calc(100vw - 28rem - 3rem); } }
#video-feed .video-title {
  cursor: pointer;
  height: 1.5rem;
  line-height: 1.5rem;
  display: inline-block;
  font-size: 0.875rem;
  margin-left: 0.5rem;
  padding: 0 1rem 0 0.5rem;
  border-radius: 0.75rem 3rem 0 0;
  background-color: #eb5b0d;
  color: white; }
  #video-feed .video-title:after {
    font-size: 0.75rem;
    font-weight: bold; }
  #video-feed .video-title:hover {
    background: #b1450a; }
    #video-feed .video-title:hover:after {
      content: " - View on Map"; }
#video-feed .feed-player {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center; }
  #video-feed .feed-player .feed-control {
    display: none;
    height: 3rem;
    width: 2rem;
    line-height: 3rem;
    color: #FFFFFF;
    border-radius: 0.375rem;
    background-color: #eb5b0d;
    text-align: center;
    font-size: 1.5rem; }
  @media only screen and (min-width: 768px) {
    #video-feed .feed-player .feed-control {
      display: block; } }
  #video-feed .feed-player .feed-control.disabled {
    background-color: #fcdac8; }
  #video-feed .feed-player .feed-control:not(.disabled) {
    cursor: pointer; }
    #video-feed .feed-player .feed-control:not(.disabled):hover {
      background-color: #b1450a; }
  #video-feed .feed-player .feed {
    overflow: scroll;
    height: 100%;
    margin: 0 -0.25rem;
    width: 100%; }
  @media only screen and (min-width: 768px) {
    #video-feed .feed-player .feed {
      overflow: hidden;
      margin: 0;
      width: auto; } }
  #video-feed .feed-player .feed .feed-inner {
    display: flex;
    flex-direction: column;
    transition: margin-left 0.2s ease;
    margin: 0 auto;
    padding: 1rem 0; }
  @media only screen and (min-width: 768px) {
    #video-feed .feed-player .feed .feed-inner {
      flex-direction: row;
      padding: 0;
      margin: 0; } }

.checkpoint-video {
  width: 240px;
  height: calc(135px + 1.5rem);
  position: relative;
  padding: 0 0.25rem 0.5rem; }
@media only screen and (min-width: 768px) {
  .checkpoint-video {
    margin: 0;
    padding: 0 0.5rem; } }

.video-html {
  max-height: 135px;
  border-radius: 0.75rem;
  overflow: hidden; }

.checkpoint-feed {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-around;
  padding-bottom: 1rem; }

.checkpoint-panel h2 {
  text-align: center; }
.checkpoint-panel .checkpoint-video {
  padding-top: 0.5rem; }
.checkpoint-panel .video-title {
  font-size: 1rem;
  text-align: center;
  padding-bottom: 0.25rem; }

.elevation-graph {
  position: fixed;
  bottom: 1rem;
  right: 1rem;
  width: calc(100vw - 31rem);
  box-sizing: border-box;
  padding: 1rem 0.25rem 0 0.75rem;
  background-color: #FFFFFF;
  border-radius: 0.75rem;
  box-shadow: 2px 2px 4px 0 rgba(0, 0, 0, 0.3); }
  .elevation-graph canvas {
    margin-left: -0.6rem; }
  .elevation-graph:before, .elevation-graph:after {
    content: '';
    position: absolute;
    background-color: rgba(0, 0, 0, 0.1);
    z-index: -1; }
  .elevation-graph:before {
    top: calc(50% - 1rem);
    height: 4rem;
    border-radius: 0 0.375rem 0.375rem 0;
    /*top: 50%;
     height: 100%;
     border-radius: .375rem 0 0 .375rem;
     border-right: 1px solid #CCCCCC;*/
    left: 0;
    width: 1.5rem;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%); }
  .elevation-graph:after {
    left: calc(50% + 1.1rem);
    width: 6.5rem;
    border-radius: 0.375rem 0.375rem 0 0;
    /*left: 50%;
     width: 100%;
     border-radius: 0 0 .375rem .375rem;
     border-top: 1px solid #CCCCCC;*/
    height: 1.5rem;
    bottom: 0;
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%); }
  .elevation-graph .close {
    background-color: #eb5b0d;
    color: white;
    position: absolute;
    top: -2rem;
    right: 1rem;
    border-radius: 0.375rem 0.375rem 0 0; }

.splashbg {
  background-color: black;
  opacity: 0.6;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 4999999; }

.splashcontainer {
  opacity: 1;
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 5000000;
  padding: 3em; }

.splashimg {
  width: 100%;
  height: 100%;
  max-width: 1000px; }

@media only screen and (max-width: 640px) {
  .splashcontainer {
    left: 10%;
    transform: translate(-5%, -50%); }
  .splashimg {
    max-width: 700px; } }

@media only screen and (min-width: 768px) and (max-width: 959px) {
  .splashcontainer {
    left: 5%;
    transform: translate(10%, -50%); } }

@media only screen and (max-width: 640px) and (orientation: landscape) {
  .splashcontainer {
    left: 50%;
    transform: translate(-50%, -50%); } }

@media only screen and (min-width: 768px) and (max-width: 959px) and (orientation: landscape) {
  .splashcontainer {
    left: 50%;
    transform: translate(-50%, -50%); } }

@media only screen and (min-device-width: 375px) and (max-device-width: 667px) and (orientation: landscape) {
  .splashcontainer {
    left: 50%;
    transform: translate(-50%, -50%); } }

.btn-close {
  margin: 0;
  border: 0;
  padding: 0;
  background: black;
  border-radius: 50%;
  width: 2em;
  height: 2em;
  display: flex;
  flex-flow: column nowrap;
  justify-content: center;
  align-items: center;
  cursor: pointer;
  transition: all 150ms;
  z-index: 5000001;
  position: absolute;
  right: 2.5em;
  top: 2.5em; }
@media only screen and (min-width: 768px) {
  .btn-close {
    width: 2.5em;
    height: 2.5em; } }
.btn-close .icon-cross {
  margin: 0;
  padding: 0;
  border: 0;
  background: none;
  position: relative;
  width: 28px;
  height: 28px; }
  .btn-close .icon-cross:before, .btn-close .icon-cross:after {
    content: '';
    position: absolute;
    top: 12px;
    left: 0;
    right: 0;
    height: 4px;
    background: #fff;
    border-radius: 4px; }
  .btn-close .icon-cross:before {
    transform: rotate(45deg); }
  .btn-close .icon-cross:after {
    transform: rotate(-45deg); }
  .btn-close .icon-cross span {
    display: block; }
@media only screen and (max-width: 640px) {
  .btn-close .icon-cross {
    margin: 0;
    padding: 0;
    border: 0;
    background: none;
    position: relative;
    width: 18px;
    height: 18px; }
    .btn-close .icon-cross:before, .btn-close .icon-cross:after {
      content: '';
      position: absolute;
      top: 7.5px;
      left: 0;
      right: 0;
      height: 3px;
      background: #fff;
      border-radius: 3px; }
    .btn-close .icon-cross:before {
      transform: rotate(45deg); }
    .btn-close .icon-cross:after {
      transform: rotate(-45deg); }
    .btn-close .icon-cross span {
      display: block; } }
@media only screen and (max-width: 640px) and (orientation: landscape) {
  .btn-close .icon-cross {
    margin: 0;
    padding: 0;
    border: 0;
    background: none;
    position: relative;
    width: 18px;
    height: 18px; }
    .btn-close .icon-cross:before, .btn-close .icon-cross:after {
      content: '';
      position: absolute;
      top: 7.5px;
      left: 0;
      right: 0;
      height: 3px;
      background: #fff;
      border-radius: 3px; }
    .btn-close .icon-cross:before {
      transform: rotate(45deg); }
    .btn-close .icon-cross:after {
      transform: rotate(-45deg); }
    .btn-close .icon-cross span {
      display: block; } }
@media only screen and (min-width: 768px) and (max-width: 959px) and (orientation: landscape) {
  .btn-close .icon-cross {
    margin: 0;
    padding: 0;
    border: 0;
    background: none;
    position: relative;
    width: 18px;
    height: 18px; }
    .btn-close .icon-cross:before, .btn-close .icon-cross:after {
      content: '';
      position: absolute;
      top: 7.5px;
      left: 0;
      right: 0;
      height: 3px;
      background: #fff;
      border-radius: 3px; }
    .btn-close .icon-cross:before {
      transform: rotate(45deg); }
    .btn-close .icon-cross:after {
      transform: rotate(-45deg); }
    .btn-close .icon-cross span {
      display: block; } }
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) and (orientation: landscape) {
  .btn-close .icon-cross {
    margin: 0;
    padding: 0;
    border: 0;
    background: none;
    position: relative;
    width: 18px;
    height: 18px; }
    .btn-close .icon-cross:before, .btn-close .icon-cross:after {
      content: '';
      position: absolute;
      top: 7.5px;
      left: 0;
      right: 0;
      height: 3px;
      background: #fff;
      border-radius: 3px; }
    .btn-close .icon-cross:before {
      transform: rotate(45deg); }
    .btn-close .icon-cross:after {
      transform: rotate(-45deg); }
    .btn-close .icon-cross span {
      display: block; } }
.btn-close:hover, .btn-close:focus {
  transform: rotateZ(90deg);
  background: black; }

.hidden {
  display: none; }

#zoom {
  height: 4rem;
  width: 2rem;
  position: fixed;
  bottom: 1rem;
  right: 1rem;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
  border: 1px solid #DDDDDD;
  border-radius: 2px;
  background: white; }
  #zoom div {
    text-align: center;
    height: 2rem;
    width: 2rem;
    line-height: 2rem; }
    #zoom div:first-child {
      border-bottom: 1px solid #DDDDDD; }

#windy {
  display: none; }
  #windy #map-container {
    z-index: -1; }

@media only screen and (min-width: 768px) {
  #app.windy .panels {
    height: calc(100vh - 3rem - 7rem); } }
#app.windy #map {
  display: none; }
#app.windy #windy {
  display: block; }

.watch-icon {
  height: 2rem;
  line-height: 2rem;
  padding-left: 2rem;
  position: relative;
  cursor: pointer;
  display: table-cell; }
  .watch-icon:hover .fa-eye, .watch-icon.watched .fa-eye {
    color: #eb5b0d; }
  .watch-icon:hover .fa-suitcase, .watch-icon.watched .fa-suitcase {
    color: #eb5b0d; }
.watch-icon.watched:hover .fa-map-pin {
  color: white; }
.watch-icon.btn {
  color: black;
  background-color: white;
  border-top: 1px #BBBBBB solid;
  border-left: 1px #BBBBBB solid;
  border-right: 1px #BBBBBB solid;
  width: 50%; }
.watch-icon .text {
  font-size: 0.8333rem; }
.watch-icon .fas, .watch-icon .fad {
  position: absolute;
  top: 0;
  left: 0;
  opacity: 1;
  line-height: 2rem;
  text-align: center;
  font-size: 1.25rem;
  width: 2rem;
  height: 2rem;
  color: #BBBBBB;
  transition: opacity 0.4s ease; }
.watch-icon .fa-star, .watch-icon .fa-heart, .watch-icon .fa-award {
  position: absolute;
  top: 0;
  left: 0;
  opacity: 1;
  line-height: 2rem;
  text-align: center;
  font-size: 1.25rem;
  width: 2rem;
  height: 2rem; }
  .watch-icon .fa-star.fas, .watch-icon .fa-heart.fas, .watch-icon .fa-award.fas {
    color: #eb5b0d; }
  .watch-icon .fa-star.far, .watch-icon .fa-heart.far, .watch-icon .fa-award.far {
    color: black; }
.watch-icon .fa-map-pin {
  position: absolute;
  top: 0;
  left: 0;
  opacity: 1;
  line-height: 2rem;
  text-align: center;
  font-size: 1.25rem;
  width: 2rem;
  height: 2rem;
  color: black; }