tropsCode/src/assets/styles/index.scss

@import 'animate.css';

@font-face {
  font-family: 'Saira-ExtraBold';
  src: url('../fonts/Saira-ExtraBold.ttf') format('truetype');
}

@font-face {
  font-family: 'Saira-BlackItalic';
  src: url('../fonts/Saira-BlackItalic.ttf') format('truetype');
}

:root {
  font-size: calc(100vw / 106);
}

body {
  margin: 0;
  background: radial-gradient(87% 87% at 9% -34%, #315f7e 0%, #0f1926 100%);
  width: 100%;
  height: 100vh;
  overflow: hidden;
}

ul,
ol {
  margin: 0;
  padding: 0;
}

ul li {
  list-style: none;
}

i,em{
  font-style: normal;
}

.sports {
  .el-loading-spinner {
    &::before {
      content: '';
      width: 120px;
      height: 120px;
      display: block;
      margin: 0 auto;
      background-repeat: no-repeat;
      background-position: center center;
      background-size: contain;
    }
    .circular {
      display: none;
    }
  }
}

.el-message--success,
.el-message--warning,
.el-message--error {
  .el-message__content,.el-message__icon {
    font-size: 1.5rem !important;
  }
}

.messageBoxClass {
  background: radial-gradient(96% 96% at 2% 32%, #ffffff 0%, #fcfdfd 54%, #e1e4e7 100%);
  width: 40% !important;
  --el-messagebox-width: auto !important;
  height: auto !important;
  --el-messagebox-height: 40% !important;
  border-radius: 1.6rem !important;
  border: 0.55rem solid #13ed84;
  .el-message-box__header {
    color: #000000;
    padding-top: 2%;
    padding-bottom: 0%;
    font-size: 1.2rem;
  }
  .el-message-box__content {
    height: 20vh;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    font-size: 2.3rem;
    color: #1a293a;
  }
  .el-message-box__message {
    font-size: 1.5rem;
  }
  .el-message-box__input {
    width: 72%;

    .el-input {
      height: 5.5vh;
      font-size: 1.6rem;
    }
  }
  .btn-custom-cancel {
    color: #1a293a;
    padding: 3.5% 12%;
    font-size: 1.6rem;
    border: 1px solid #c9c4c4;
    box-shadow: inset 0px 1px 0px 2px rgba(255, 255, 255, 0.3);
    &:hover {
      color: #1a293a;
    }
  }
  .btn-custom-confirm {
    color: #1a293a;
    background: radial-gradient(141% 126% at 5% 93%, #8effa9 0%, #07ffe7 100%);
    box-shadow: inset 0px 1px 0px 2px rgba(255, 255, 255, 0.3);
    --el-button-border-color: none;
    padding: 3.5% 12%;
    font-size: 1.6rem;
    border: 1px solid #c9c4c4;
    &:hover {
      color: #1a293a;
    }
  }
}

.close {
  width: 3.2rem;
  height: 3.2rem;
  box-sizing: border-box;
  border: 1px solid #979797;
  background-image: url('@/assets/images/common/close.png');
  background-position: center;
  background-repeat: no-repeat;
  background-size: 45% 45%;
  background-color: rgba(216, 216, 216, 0.8);
  border-radius: 50%;
  transition: all 0.5s;
  cursor: pointer;

  &:hover {
    transform: rotate(180deg);
    background-color: rgba(216, 216, 216, 1);
  }
}

.basketballv1 {
  .el-loading-spinner {
    &::before {
      background-image: url('../static/images/train/basketballv1.png');
    }
  }
}
.footballv1 {
  .el-loading-spinner {
    &::before {
      background-image: url('../static/images/train/footballv1.png');
    }
  }
}
.heartbeat {
  .el-loading-spinner {
    &::before {
      background-image: url('../static/images/train/heartbeat.png');
    }
  }
}
.jump {
  .el-loading-spinner {
    &::before {
      background-image: url('../static/images/train/jump.png');
    }
  }
}
.jumpingjack {
  .el-loading-spinner {
    &::before {
      background-image: url('../static/images/train/jumpingjack.png');
    }
  }
}
.jumprope {
  .el-loading-spinner {
    &::before {
      background-image: url('../static/images/train/jumprope.png');
    }
  }
}

.longjump {
  .el-loading-spinner {
    &::before {
      background-image: url('../static/images/train/longjump.png');
    }
  }
}

.pullup {
  .el-loading-spinner {
    &::before {
      background-image: url('../static/images/train/pullup.png');
    }
  }
}

.run10x4 {
  .el-loading-spinner {
    &::before {
      background-image: url('../static/images/train/run10x4.png');
    }
  }
}

.run15x4 {
  .el-loading-spinner {
    &::before {
      background-image: url('../static/images/train/run15x4.png');
    }
  }
}

.run50 {
  .el-loading-spinner {
    &::before {
      background-image: url('../static/images/train/run50.png');
    }
  }
}

.run60 {
  .el-loading-spinner {
    &::before {
      background-image: url('../static/images/train/run60.png');
    }
  }
}

.run70 {
  .el-loading-spinner {
    &::before {
      background-image: url('../static/images/train/run70.png');
    }
  }
}

.run100 {
  .el-loading-spinner {
    &::before {
      background-image: url('../static/images/train/run100.png');
    }
  }
}

.run200 {
  .el-loading-spinner {
    &::before {
      background-image: url('../static/images/train/run200.png');
    }
  }
}

.run400 {
  .el-loading-spinner {
    &::before {
      background-image: url('../static/images/train/run400.png');
    }
  }
}

.run800 {
  .el-loading-spinner {
    &::before {
      background-image: url('../static/images/train/run800.png');
    }
  }
}

.run1000 {
  .el-loading-spinner {
    &::before {
      background-image: url('../static/images/train/run1000.png');
    }
  }
}

.run50x8 {
  .el-loading-spinner {
    &::before {
      background-image: url('../static/images/train/run50x8.png');
    }
  }
}

.shotput {
  .el-loading-spinner {
    &::before {
      background-image: url('../static/images/train/shotput.png');
    }
  }
}

.sidepullup {
  .el-loading-spinner {
    &::before {
      background-image: url('../static/images/train/sidepullup.png');
    }
  }
}

.situp {
  .el-loading-spinner {
    &::before {
      background-image: url('../static/images/train/situp.png');
    }
  }
}

.skiprope {
  .el-loading-spinner {
    &::before {
      background-image: url('../static/images/train/skiprope.png');
    }
  }
}

.solidball {
  .el-loading-spinner {
    &::before {
      background-image: url('../static/images/train/solidball.png');
    }
  }
}

.trijump {
  .el-loading-spinner {
    &::before {
      background-image: url('../static/images/train/trijump.png');
    }
  }
}

.verticaljump {
  .el-loading-spinner {
    &::before {
      background-image: url('../static/images/train/verticaljump.png');
    }
  }
}

.volleyball {
  .el-loading-spinner {
    &::before {
      background-image: url('../static/images/train/volleyball.png');
    }
  }
}

.volleyballv1 {
  .el-loading-spinner {
    &::before {
      background-image: url('../static/images/train/volleyball.png');
    }
  }
}

.highknees {
  .el-loading-spinner {
    &::before {
      background-image: url('../static/images/train/highknees.png');
    }
  }
}

@media screen and (max-width: 1280px) {
  .el-message--success,
  .el-message--warning,
  .el-message--error {
    .el-message__content,.el-message__icon {
      font-size: 14px !important;
    }
  }
}