* {
  padding: 0;
  margin: 0; }

@font-face {
  font-family: 'Share Tech Mono';
  font-style: normal;
  font-weight: 400;
  src: url(https://fonts.gstatic.com/s/sharetechmono/v10/J7aHnp1uDWRBEqV98dVQztYldFcLowEF.woff2) format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
body {
  background-repeat: repeat;
  background-attachment: fixed;
  -webkit-font-smoothing: antialiased;
  text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.04);
  background: #0f3854;
  background-size: 100%; }

hr {
  width: 700px;
  border-top: 3px dashed #000; }

.container {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  margin: 30px auto;
  background-color: #2C3E50;
  border-radius: 5px;
  opacity: 0.8;
  box-shadow: 0 0 40px rgba(0, 0, 0, 0.6); }
  @media screen and (min-width: 700px) {
    .container {
      width: 700px;
      height: 320px; } }
  @media screen and (max-width: 699px) {
    .container {
      width: 350px;
      height: 650px; } }
  .container .menu {
    display: flex;
    align-items: center;
    width: 400px;
    height: 85px; }
    .container .menu div {
      font-family: 'Share Tech Mono',monospace;
      width: 100%;
      text-align: center;
      color: white;
      font-weight: 500; }
      .container .menu div span {
        cursor: pointer; }
    .container .menu .set {
      font-size: 30px;
      font-weight: 400; }
  .container .clock {
    border-radius: 5px;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #292929;
    opacity: 0.6;
    box-shadow: 0 0 40px rgba(0, 0, 0, 0.6); }
    @media screen and (min-width: 700px) {
      .container .clock {
        width: 600px;
        height: 150px; } }
    @media screen and (max-width: 699px) {
      .container .clock {
        width: 200px;
        height: 600px; } }
    .container .clock .clock-item {
      font-family: 'Share Tech Mono', monospace;
      position: relative;
      display: flex;
      justify-content: center;
      align-items: center;
      width: 600px;
      margin: 0 20px; }
      @media screen and (max-width: 699px) {
        .container .clock .clock-item {
          flex-direction: column; } }
      .container .clock .clock-item div {
        font-size: 20px;
        color: #f8bfbf;
        letter-spacing: 5px;
        margin-top: 15px; }
      .container .clock .clock-item span {
        font-size: 60px;
        font-weight: 900;
        color: white;
        letter-spacing: 5px; }
  .container .pass {
    color: #fff;
    margin: 10px auto;
    font-family: monospace,'Share Tech Mono';
    width: 100%;
    text-align: center;
    font-size: 20px;
    font-weight: 500; }
  .container .prog {
    background-color: #2C3E50; }
    .container .prog progress {
      height: 30px;
      border: none;
      background-color: #2C3E50;
      border-radius: 5px; }
      @media screen and (min-width: 700px) {
        .container .prog progress {
          width: 500px; } }
      @media screen and (max-width: 699px) {
        .container .prog progress {
          width: 300px; } }
    .container .prog progress::-webkit-progress-bar {
      border-radius: 5px;
      background-color: #133347; }
    .container .prog progress::-webkit-progress-value {
      border-radius: 5px;
      background-color: #d7d7d7;
      opacity: 0.6; }

.switch {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 10px;
  margin: 10px auto;
  opacity: 0.8; }
  @media screen and (min-width: 700px) {
    .switch {
      width: 700px; } }
  @media screen and (max-width: 699px) {
    .switch {
      width: 350px; } }
  .switch .btn {
    background-color: #2C3E50;
    color: #fff;
    outline: none;
    border: 1px solid #ccc;
    padding: 10px 20px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 18px;
    margin: 4px 15px;
    -webkit-transition-duration: 0.4s;
    /* Safari */
    transition-duration: 0.4s;
    cursor: pointer;
    border-radius: 5px; }
  .switch .Light:hover {
    background-color: #eee;
    color: #000;
    opacity: 0.3;
    box-shadow: 0 12px 16px 0 rgba(255, 255, 255, 0.24), 0 17px 50px 0 rgba(255, 255, 255, 0.19);
    border-radius: 10px; }
  .switch .Night {
    opacity: 0.3;
    cursor: not-allowed; }

.github {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 700px;
  height: 10px;
  margin: 70px auto;
  opacity: 0.8; }
  .github .btn {
    background-color: #2C3E50;
    color: #fff;
    border-radius: 30px;
    outline: none;
    border: 1px solid #ccc;
    padding: 10px 20px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 18px;
    margin: 4px 20px;
    -webkit-transition-duration: 0.4s;
    /* Safari */
    transition-duration: 0.4s;
    cursor: pointer; }
  .github .btn:hover {
    background-color: #eee;
    color: #000;
    opacity: 0.3;
    box-shadow: 0 12px 16px 0 rgba(255, 255, 255, 0.24), 0 17px 50px 0 rgba(255, 255, 255, 0.19); }
  .github .fa {
    height: 20px;
    color: #eee; }

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