@font-face {
  font-family: TeX Gyre Pagella Bold;
  src: url(../fonts/texgyrepagella-bold.otf); }
@font-face {
  font-family: TeX Gyre Pagella Bold Italic;
  src: url(../fonts/texgyrepagella-bolditalic.otf); }
@font-face {
  font-family: TeX Gyre Pagella Italic;
  src: url(../fonts/texgyrepagella-italic.otf); }
@font-face {
  font-family: TeX Gyre Pagella Regular;
  src: url(../fonts/texgyrepagella-regular.otf); }
@font-face {
  font-family: Olde English;
  src: url(../fonts/OldeEnglish); }
@font-face {
  font-family: Merriweather;
  src: url(../fonts/Merriweather-Regular.ttf); }
@font-face {
  font-family: Sans Forgetica Regular;
  src: url(../fonts/SansForgetica-Regular.otf); }
html, body {
  margin: 0;
  min-height: 100%;
  background: #eeffff;
  font-family: 'Merriweather', serif; }
  html .header, body .header {
    margin: 0;
    height: 10%;
    width: 100%;
    position: absolute;
    background-color: rgba(0, 0, 0, 0.9); }
    html .header .container, body .header .container {
      border: 0 solid blue;
      height: 100%;
      width: 100%;
      position: absolute;
      background-color: transparent; }
      html .header .container .column .recent, body .header .container .column .recent {
        margin: 0;
        padding: 0;
        height: 100%;
        box-sizing: border-box;
        border: 0px solid green;
        text-align: center;
        position: absolute;
        left: 0;
        top: 0;
        width: 18.3016vw;
        background-color: transparent;
        line-height: 0;
        vertical-align: middle; }
        html .header .container .column .recent .log-out-div, body .header .container .column .recent .log-out-div {
          border: 0px solid blue;
          height: 100%;
          box-sizing: border-box;
          position: absolute;
          left: 0.6vw;
          margin: 0;
          padding: 0;
          width: 4vw;
          display: table;
          table-layout: fixed; }
          html .header .container .column .recent .log-out-div .log-out-inner-div, body .header .container .column .recent .log-out-div .log-out-inner-div {
            display: table-cell;
            vertical-align: middle;
            padding: 0;
            margin: 0;
            width: 100%;
            box-sizing: border-box;
            border: 0px solid green; }
            html .header .container .column .recent .log-out-div .log-out-inner-div .log-out, body .header .container .column .recent .log-out-div .log-out-inner-div .log-out {
              margin: 0;
              padding: 0;
              width: 100%;
              box-sizing: border-box;
              height: 1.6vw;
              line-height: 1.6vw;
              border-radius: 5%;
              background-color: transparent;
              font-size: 0.8785vw;
              opacity: 1;
              color: #88e3ff;
              outline: none;
              border: 0px solid red;
              font-family: Garamond, Baskerville, "Baskerville Old Face", "Hoefler Text", "Times New Roman", serif; }
            html .header .container .column .recent .log-out-div .log-out-inner-div .log-out:hover, body .header .container .column .recent .log-out-div .log-out-inner-div .log-out:hover {
              -webkit-box-shadow: 0 0 0.7321vw #0076ff;
              box-shadow: 0 0 0.7321vw #0076ff;
              transition: 0s;
              opacity: 1;
              cursor: default; }
        html .header .container .column .recent a, body .header .container .column .recent a {
          margin: 0;
          padding: 0; }
        html .header .container .column .recent a:hover, body .header .container .column .recent a:hover {
          cursor: default; }
        html .header .container .column .recent .logo, body .header .container .column .recent .logo {
          margin: auto;
          padding: 0;
          border: 0px solid red;
          width: fit-content;
          height: 100%;
          box-sizing: border-box;
          white-space: nowrap;
          overflow: hidden;
          -webkit-tap-highlight-color: transparent;
          -webkit-user-select: none;
          /* Chrome/Safari */
          -moz-user-select: none;
          /* Firefox */
          -ms-user-select: none;
          /* IE10+ */ }
          html .header .container .column .recent .logo .logo-figure, body .header .container .column .recent .logo .logo-figure {
            display: inline-block;
            margin: 0;
            padding: 1vh 0;
            width: 10vh;
            height: 100%;
            box-sizing: border-box;
            border: 0px solid blue;
            cursor: default; }
          html .header .container .column .recent .logo .logo-name, body .header .container .column .recent .logo .logo-name {
            display: inline-block;
            border: 0px solid blue;
            font-family: Garamond, Baskerville, "Baskerville Old Face", "Hoefler Text", "Times New Roman", serif;
            color: #88e3ff;
            padding: 0;
            margin: 0;
            height: 100%;
            box-sizing: border-box;
            vertical-align: top; }
            html .header .container .column .recent .logo .logo-name .logo-name-postition, body .header .container .column .recent .logo .logo-name .logo-name-postition {
              border: 0px solid blue;
              height: 100%;
              box-sizing: border-box;
              right: 0;
              margin: 0;
              padding: 0;
              display: table;
              table-layout: fixed; }
              html .header .container .column .recent .logo .logo-name .logo-name-postition .logo-name-center, body .header .container .column .recent .logo .logo-name .logo-name-postition .logo-name-center {
                height: 100%;
                box-sizing: border-box;
                display: table-cell;
                vertical-align: middle;
                padding: 0;
                margin: 0;
                width: 100%;
                box-sizing: border-box;
                border: 0px solid green;
                /**
                .logo-inner-position:hover {
                	-webkit-box-shadow: 0 0 0.7321vw $blue_mode_color_hex_2;
                    box-shadow: 0 0 0.7321vw $blue_mode_color_hex_2;
                  	transition: 0s;
                	opacity: 1;
                	cursor: default;
                }
                */ }
                html .header .container .column .recent .logo .logo-name .logo-name-postition .logo-name-center .logo-inner-position, body .header .container .column .recent .logo .logo-name .logo-name-postition .logo-name-center .logo-inner-position {
                  margin: 0;
                  padding: 0 0.5vw;
                  width: 100%;
                  box-sizing: border-box;
                  height: 2.2vw;
                  line-height: 2.2vw;
                  border-radius: 5%;
                  background-color: transparent;
                  font-size: 2vw;
                  opacity: 1;
                  color: #88e3ff;
                  outline: none;
                  border: 0px solid yellow;
                  font-family: Garamond, Baskerville, "Baskerville Old Face", "Hoefler Text", "Times New Roman", serif; }
      html .header .container .column .members, body .header .container .column .members {
        border: 0px solid red;
        margin: 0;
        padding: 0;
        height: 100%;
        position: absolute;
        left: 18.3016vw;
        right: 18.3016vw;
        top: 0;
        text-align: center;
        backround-color: transparent;
        box-sizing: border-box;
        -webkit-user-select: none;
        /* Chrome/Safari */
        -moz-user-select: none;
        /* Firefox */
        -ms-user-select: none;
        /* IE10+ */ }
        html .header .container .column .members h1, body .header .container .column .members h1 {
          border: none;
          margin: 0;
          padding: 0 0 0 1.4641vw;
          font-family: Garamond, Baskerville, "Baskerville Old Face", "Hoefler Text", "Times New Roman", serif;
          color: #88e3ff;
          font-size: 30px; }
        html .header .container .column .members .cover-button, body .header .container .column .members .cover-button {
          height: 100%;
          display: inline-block;
          margin: 0 auto;
          padding: 0;
          box-sizing: border-box;
          font-size: 1.4641vw;
          color: #88e3ff;
          -webkit-tap-highlight-color: transparent; }
          html .header .container .column .members .cover-button .wrap-button, body .header .container .column .members .cover-button .wrap-button {
            border: 0px solid red;
            height: 100%;
            box-sizing: border-box;
            margin: 0 auto;
            padding: 0;
            display: table;
            table-layout: fixed; }
            html .header .container .column .members .cover-button .wrap-button .howtopi-button, body .header .container .column .members .cover-button .wrap-button .howtopi-button {
              display: table-cell;
              vertical-align: middle;
              border-radius: 0.3660322vw;
              border: none;
              padding: 0;
              margin: 0;
              font-family: Garamond, Baskerville, "Baskerville Old Face", "Hoefler Text", "Times New Roman", serif; }
              html .header .container .column .members .cover-button .wrap-button .howtopi-button .button-link, body .header .container .column .members .cover-button .wrap-button .howtopi-button .button-link {
                border-radius: 0.2vw;
                border: 0px solid blue;
                padding: 0.7321vw 0vw;
                margin: 0; }
                html .header .container .column .members .cover-button .wrap-button .howtopi-button .button-link a, body .header .container .column .members .cover-button .wrap-button .howtopi-button .button-link a {
                  border: 1px solid transparent;
                  text-decoration: none;
                  cursor: default;
                  color: #88e3ff;
                  padding: 0.7321vw 0.7321vw;
                  border-radius: 0.2vw; }
              html .header .container .column .members .cover-button .wrap-button .howtopi-button .button-link:hover a, body .header .container .column .members .cover-button .wrap-button .howtopi-button .button-link:hover a {
                border: 1px solid #88e3ff; }
              html .header .container .column .members .cover-button .wrap-button .howtopi-button .button-link:active, body .header .container .column .members .cover-button .wrap-button .howtopi-button .button-link:active {
                cursor: default;
                -webkit-box-shadow: 0px 0px 0.7321vw #88e3ff;
                box-shadow: 0px 0px 0.7321vw #88e3ff; }
        html .header .container .column .members #get-password-message, body .header .container .column .members #get-password-message {
          position: absolute;
          right: 0;
          font-size: 1.1713vw;
          color: red; }
        html .header .container .column .members .button-error, body .header .container .column .members .button-error {
          border-radius: 0.3660322vw;
          border: 1px solid rgba(136, 227, 255, 0);
          padding: 0.7321vw 0.7321vw;
          margin: 0; }
      html .header .container .column .long, body .header .container .column .long {
        border: none;
        margin: 0;
        padding: 0;
        height: 100%;
        box-sizing: border-box;
        border: 0px solid red;
        text-align: center;
        position: absolute;
        right: 0;
        top: 0;
        width: 18.3016vw;
        background-color: transparent;
        line-height: 0;
        vertical-align: middle; }
        html .header .container .column .long .member-sign-in, body .header .container .column .long .member-sign-in {
          position: absolute;
          top: 0vh;
          width: 18.3016vw;
          height: 100%;
          border: none;
          text-align: left;
          padding: 0;
          margin: 0;
          line-height: 0.3660322vw;
          border: 0px solid red;
          box-sizing: border-box;
          display: table;
          table-layout: fixed; }
          html .header .container .column .long .member-sign-in .member-sign-form, body .header .container .column .long .member-sign-in .member-sign-form {
            border: 1px solid transparent;
            box-sizing: border-box;
            display: table-cell;
            vertical-align: middle;
            margin: 0;
            padding: 0; }
            html .header .container .column .long .member-sign-in .member-sign-form .div-form-member-control, body .header .container .column .long .member-sign-in .member-sign-form .div-form-member-control {
              font-size: 1.0249vw;
              padding: 0;
              margin: 0;
              outline: none;
              text-decoration: none;
              width: 100%;
              height: 25%;
              line-height: 25%;
              box-sizing: border-box;
              display: inline-block;
              border: 1px solid transparent;
              border-radius: 0;
              /**
              .forgot-password:hover{
              	border: 1px solid #88e3ff;
              }
              */ }
              html .header .container .column .long .member-sign-in .member-sign-form .div-form-member-control .forgot-password, body .header .container .column .long .member-sign-in .member-sign-form .div-form-member-control .forgot-password {
                -webkit-tap-highlight-color: transparent;
                -webkit-user-select: none;
                /* Chrome/Safari */
                -moz-user-select: none;
                /* Firefox */
                -ms-user-select: none;
                /* IE10+ */
                color: #88e3ff;
                font-size: 0.8vw;
                width: 4%;
                float: right;
                height: 100%;
                padding: 0;
                margin: 0;
                position: relative;
                text-align: center;
                border-radius: 10%;
                line-height: 100%;
                border: 0px solid red;
                display: table;
                cursor: default;
                box-sizing: border-box; }
                html .header .container .column .long .member-sign-in .member-sign-form .div-form-member-control .forgot-password .center-forgot-password, body .header .container .column .long .member-sign-in .member-sign-form .div-form-member-control .forgot-password .center-forgot-password {
                  display: table-cell;
                  vertical-align: middle;
                  margin: 2px 0 0 0;
                  padding: 2px 0 0 0;
                  height: 100%;
                  line-height: 100%;
                  border: 0px solid transparent;
                  box-sizing: border-box; }
              html .header .container .column .long .member-sign-in .member-sign-form .div-form-member-control .latex-math-font-size, body .header .container .column .long .member-sign-in .member-sign-form .div-form-member-control .latex-math-font-size {
                font-family: 'TeX Gyre Pagella Italic';
                font-size: 1.1713vw; }
              html .header .container .column .long .member-sign-in .member-sign-form .div-form-member-control .latex-math-font-size-2, body .header .container .column .long .member-sign-in .member-sign-form .div-form-member-control .latex-math-font-size-2 {
                font-family: 'TeX Gyre Pagella Italic';
                font-size: 1.3177vw; }
              html .header .container .column .long .member-sign-in .member-sign-form .div-form-member-control .latex-math-font-size-3, body .header .container .column .long .member-sign-in .member-sign-form .div-form-member-control .latex-math-font-size-3 {
                font-family: 'TeX Gyre Pagella Italic';
                font-size: 1.4641vw; }
              html .header .container .column .long .member-sign-in .member-sign-form .div-form-member-control .latex-math-font-size-4, body .header .container .column .long .member-sign-in .member-sign-form .div-form-member-control .latex-math-font-size-4 {
                font-family: 'TeX Gyre Pagella Italic';
                font-size: 1.0249vw; }
              html .header .container .column .long .member-sign-in .member-sign-form .div-form-member-control .latex-math-font-size-5, body .header .container .column .long .member-sign-in .member-sign-form .div-form-member-control .latex-math-font-size-5 {
                font-family: 'TeX Gyre Pagella Italic';
                font-size: 0.8785vw; }
              html .header .container .column .long .member-sign-in .member-sign-form .div-form-member-control .latex-math-font-size-6, body .header .container .column .long .member-sign-in .member-sign-form .div-form-member-control .latex-math-font-size-6 {
                font-family: 'TeX Gyre Pagella Italic';
                font-size: 0.7321vw; }
              html .header .container .column .long .member-sign-in .member-sign-form .div-form-member-control .forgot-password:focus, body .header .container .column .long .member-sign-in .member-sign-form .div-form-member-control .forgot-password:focus {
                -webkit-box-shadow: 0px 0px 0.7321vw #88e3ff;
                box-shadow: 0px 0px 0.7321vw #88e3ff; }
              html .header .container .column .long .member-sign-in .member-sign-form .div-form-member-control .forgot-password:active, body .header .container .column .long .member-sign-in .member-sign-form .div-form-member-control .forgot-password:active {
                -webkit-box-shadow: 0px 0px 0.7321vw #88e3ff;
                box-shadow: 0px 0px 0.7321vw #88e3ff; }
              html .header .container .column .long .member-sign-in .member-sign-form .div-form-member-control .form-member-control, body .header .container .column .long .member-sign-in .member-sign-form .div-form-member-control .form-member-control {
                font-size: 0.9vw;
                padding: 0 0.3660322vw;
                margin: 0;
                outline: none;
                text-decoration: none;
                width: 90%;
                height: 100%;
                float: left;
                margin-left: 5%;
                box-sizing: border-box;
                border: 0px solid red;
                border-radius: 0;
                text-align: left;
                -webkit-tap-highlight-color: transparent; }
              html .header .container .column .long .member-sign-in .member-sign-form .div-form-member-control .form-member-control:focus, body .header .container .column .long .member-sign-in .member-sign-form .div-form-member-control .form-member-control:focus {
                -webkit-box-shadow: 0px 0px 0.7321vw #ffffff;
                box-shadow: 0px 0px 0.7321vw #ffffff; }
              html .header .container .column .long .member-sign-in .member-sign-form .div-form-member-control .member-enter, body .header .container .column .long .member-sign-in .member-sign-form .div-form-member-control .member-enter {
                font-size: 0.9vw;
                padding: 0 0.3660322vw;
                margin: 0;
                outline: none;
                text-decoration: none;
                width: 90%;
                height: 100%;
                float: right;
                margin-right: 5%;
                box-sizing: border-box;
                border-radius: 0;
                text-align: left;
                background-color: #88e3ff;
                border: 0px solid red;
                -webkit-tap-highlight-color: transparent; }
              html .header .container .column .long .member-sign-in .member-sign-form .div-form-member-control .member-enter:focus, body .header .container .column .long .member-sign-in .member-sign-form .div-form-member-control .member-enter:focus {
                -webkit-box-shadow: 0px 0px 0.7321vw #88e3ff;
                box-shadow: 0px 0px 0.7321vw #88e3ff; }
              html .header .container .column .long .member-sign-in .member-sign-form .div-form-member-control .member-enter:active, body .header .container .column .long .member-sign-in .member-sign-form .div-form-member-control .member-enter:active {
                -webkit-box-shadow: 0px 0px 0.7321vw #88e3ff;
                box-shadow: 0px 0px 0.7321vw #88e3ff; }
  html .main, body .main {
    border: 0 solid red; }
    html .main .container, body .main .container {
      border: none;
      padding: 0;
      margin: 0; }
      html .main .container .column .exercise-area, body .main .container .column .exercise-area {
        border: 0px solid red;
        box-sizing: border-box;
        margin: 0;
        padding: 0;
        height: 90%;
        position: absolute;
        left: 0;
        top: 10%;
        width: 18.3016vw;
        cursor: default;
        overflow-wrap: break-word; }
        html .main .container .column .exercise-area .signup, body .main .container .column .exercise-area .signup {
          position: absolute;
          border: 0px solid black;
          top: 0;
          padding: 0;
          margin: 0;
          left: 0;
          width: 18.3016vw;
          color: #000000;
          background-color: #eeffff; }
          html .main .container .column .exercise-area .signup .create-button, body .main .container .column .exercise-area .signup .create-button {
            -webkit-tap-highlight-color: transparent;
            -webkit-user-select: none;
            /* Chrome/Safari */
            -moz-user-select: none;
            /* Firefox */
            -ms-user-select: none;
            /* IE10+ */
            border: 0px solid red;
            color: #eeffff;
            font-size: 1.0249vw;
            margin: 1vw auto 0 auto;
            padding: 0.2vw 0px 0;
            font-family: 'Merriweather', serif;
            height: 1.4641vw;
            line-height: 1.4641vw;
            vertical-align: middle;
            background-color: rgba(0, 0, 0, 0.9);
            text-align: center;
            border-radius: 0.3660322vw;
            cursor: default;
            width: 8vw;
            z-index: 10; }
          html .main .container .column .exercise-area .signup .create-button:active, body .main .container .column .exercise-area .signup .create-button:active {
            -webkit-user-select: none;
            /* Chrome/Safari */
            -moz-user-select: none;
            /* Firefox */
            -ms-user-select: none;
            /* IE10+ */
            -webkit-box-shadow: 0px 0px 0.7321vw rgba(0, 0, 0, 0.9);
            box-shadow: 0px 0px 0.7321vw rgba(0, 0, 0, 0.9); }
          html .main .container .column .exercise-area .signup .error, body .main .container .column .exercise-area .signup .error {
            height: 0.8vw;
            line-height: 0.8vw;
            margin: 0 5%;
            width: 90%;
            padding: 0 0.3660322vw;
            box-sizing: border-box;
            color: red;
            font-size: 0.8vw;
            font-weight: 100;
            border: 0px solid blue;
            text-align: left;
            white-space: nowrap; }
          html .main .container .column .exercise-area .signup .form-control, body .main .container .column .exercise-area .signup .form-control {
            background-color: white;
            outline: 0px solid red;
            border: 0px solid red;
            padding: 0 0.3660322vw;
            margin: 0 5%;
            width: 90%;
            font-size: 1.0249vw;
            color: #000000;
            box-sizing: border-box;
            margin-bottom: 0;
            line-height: 1.4vw;
            height: 1.4vw;
            display: block;
            font-family: 'Merriweather', serif;
            overflow-wrap: break-word;
            border-radius: 0; }
            html .main .container .column .exercise-area .signup .form-control .form-control-terms, body .main .container .column .exercise-area .signup .form-control .form-control-terms {
              border: 0px solid blue;
              box-sizing: border-box;
              display: inline-block;
              height: 1.4vw;
              top: 0;
              margin: 0 0 0 0.5vw;
              padding: 0;
              top: 0;
              font-size: 1.0249vw;
              color: #000000;
              font-family: 'Merriweather', serif;
              background-color: transparent;
              width: 90%;
              white-space: nowrap;
              box-sizing: border-box;
              float: right; }
            html .main .container .column .exercise-area .signup .form-control .accept-terms, body .main .container .column .exercise-area .signup .form-control .accept-terms {
              box-sizing: border-box;
              float: left;
              height: 1.4vw;
              margin: 0;
              padding: 0;
              top: 0;
              font-size: 1.0249vw;
              color: #000000;
              background-color: white;
              fill: white;
              width: 5.2%;
              border-radius: 0;
              border: none;
              text-decoration: none;
              -webkit-tap-highlight-color: transparent; }
            html .main .container .column .exercise-area .signup .form-control .accept-terms:focus, body .main .container .column .exercise-area .signup .form-control .accept-terms:focus {
              outline: none; }
          html .main .container .column .exercise-area .signup .form-control::-webkit-input-placeholder, body .main .container .column .exercise-area .signup .form-control::-webkit-input-placeholder {
            color: rgba(0, 0, 0, 0.6); }
          html .main .container .column .exercise-area .signup .form-control-info, body .main .container .column .exercise-area .signup .form-control-info {
            white-space: nowrap;
            text-align: center;
            background-color: transparent;
            outline: 0px solid red;
            border: 0px solid red;
            padding: 0 0.3660322vw;
            margin: 0 5%;
            width: 90%;
            font-size: 1.0249vw;
            color: #000000;
            box-sizing: border-box;
            margin-bottom: 0;
            line-height: 1.4vw;
            height: 1.4vw;
            display: block;
            font-family: 'Merriweather', serif;
            overflow-wrap: break-word; }
          html .main .container .column .exercise-area .signup .adress, body .main .container .column .exercise-area .signup .adress {
            color: #000000;
            font-size: 1.0249vw;
            padding: 0 0.3660322vw;
            margin: 0.8vw 5% 0;
            width: 90%;
            box-sizing: border-box;
            border: 0px solid green; }
          html .main .container .column .exercise-area .signup .link-button, body .main .container .column .exercise-area .signup .link-button {
            color: #000000;
            padding: 0 0.3660322vw;
            margin: 0.5vw 5% 0;
            width: 90%;
            box-sizing: border-box;
            border: 0px solid green;
            text-align: center;
            font-family: 'Merriweather', serif;
            font-size: 1.0249vw;
            padding: 0;
            height: 1.4641vw;
            line-height: 1.4641vw;
            -webkit-tap-highlight-color: transparent;
            -webkit-user-select: none;
            /* Chrome/Safari */
            -moz-user-select: none;
            /* Firefox */
            -ms-user-select: none;
            /* IE10+ */ }
            html .main .container .column .exercise-area .signup .link-button a, body .main .container .column .exercise-area .signup .link-button a {
              cursor: default;
              text-decoration: none;
              color: black;
              border: 0px solid #88e3ff;
              background-color: #88e3ff;
              padding: 0 1vw;
              height: 1.4641vw;
              line-height: 1.4641vw;
              vertical-align: middle;
              border-radius: 0.28vw;
              box-sizing: border-box; }
          html .main .container .column .exercise-area .signup .link-button a:hover, body .main .container .column .exercise-area .signup .link-button a:hover {
            background-color: rgba(0, 0, 0, 0.9);
            color: #88e3ff; }
          html .main .container .column .exercise-area .signup .link-button a:active, body .main .container .column .exercise-area .signup .link-button a:active {
            -webkit-user-select: none;
            /* Chrome/Safari */
            -moz-user-select: none;
            /* Firefox */
            -ms-user-select: none;
            /* IE10+ */
            background-color: rgba(0, 0, 0, 0.9);
            color: #88e3ff;
            -webkit-box-shadow: 0px 0px 0.7321vw rgba(0, 0, 0, 0.9);
            box-shadow: 0px 0px 0.7321vw rgba(0, 0, 0, 0.9); }
          html .main .container .column .exercise-area .signup .joinmath, body .main .container .column .exercise-area .signup .joinmath {
            -webkit-tap-highlight-color: transparent;
            border: none;
            color: rgba(0, 0, 0, 0.3);
            font-size: 1.0249vw;
            margin: 0.5vw 0 0 0;
            padding: 2px 0 0 0;
            font-family: 'Merriweather', serif;
            width: 100%;
            height: 2vw;
            background-color: #88e3ff;
            text-align: center;
            border-radius: 0.3660322vw;
            cursor: default;
            outline: none; }
          html .main .container .column .exercise-area .signup .joinmath:active, body .main .container .column .exercise-area .signup .joinmath:active {
            -webkit-user-select: none;
            /* Chrome/Safari */
            -moz-user-select: none;
            /* Firefox */
            -ms-user-select: none;
            /* IE10+ */
            -webkit-box-shadow: 0px 0px 0.7321vw #88e3ff;
            box-shadow: 0px 0px 0.7321vw #88e3ff; }
        html .main .container .column .exercise-area .parent-permission, body .main .container .column .exercise-area .parent-permission {
          position: absolute;
          border: 0px solid black;
          border-top-right-radius: 1vw;
          border-bottom-right-radius: 1vw;
          top: 5.7vw;
          padding: 0;
          left: 18.3016vw;
          width: 25vw;
          white-space: nowrap;
          color: #000000;
          background-color: rgba(136, 227, 255, 0.9);
          font-family: 'Merriweather', serif;
          z-index: 2; }
          html .main .container .column .exercise-area .parent-permission .error, body .main .container .column .exercise-area .parent-permission .error {
            height: 0.8vw;
            line-height: 0.8vw;
            margin: 0 5%;
            width: 90%;
            padding: 0 0.3660322vw;
            box-sizing: border-box;
            color: red;
            font-size: 0.8vw;
            font-weight: 100;
            border: 0px solid blue;
            text-align: left;
            white-space: nowrap; }
          html .main .container .column .exercise-area .parent-permission .form-control, body .main .container .column .exercise-area .parent-permission .form-control {
            background-color: white;
            outline: 0px solid red;
            border: 0px solid red;
            padding: 0 0.3660322vw;
            margin: 0 5%;
            width: 90%;
            font-size: 1.0249vw;
            color: #000000;
            box-sizing: border-box;
            margin-bottom: 0;
            line-height: 1.4vw;
            height: 1.4vw;
            display: block;
            font-family: 'Merriweather', serif;
            overflow-wrap: break-word;
            border-radius: 0; }
            html .main .container .column .exercise-area .parent-permission .form-control .form-control-terms, body .main .container .column .exercise-area .parent-permission .form-control .form-control-terms {
              border: 0px solid blue;
              box-sizing: border-box;
              display: inline-block;
              height: 1.4vw;
              top: 0;
              margin: 0 0 0 0.5vw;
              padding: 0;
              top: 0;
              font-size: 1.0249vw;
              color: #000000;
              font-family: 'Merriweather', serif;
              background-color: transparent;
              width: 90%;
              white-space: nowrap;
              box-sizing: border-box;
              text-align: left;
              float: right; }
            html .main .container .column .exercise-area .parent-permission .form-control .accept-terms, body .main .container .column .exercise-area .parent-permission .form-control .accept-terms {
              box-sizing: border-box;
              float: left;
              height: 1.4vw;
              margin: 0;
              padding: 0;
              top: 0;
              font-size: 1.0249vw;
              color: #000000;
              background-color: white;
              fill: white;
              width: 5.2%;
              border-radius: 0;
              border: none;
              -webkit-tap-highlight-color: transparent; }
            html .main .container .column .exercise-area .parent-permission .form-control .accept-terms:focus, body .main .container .column .exercise-area .parent-permission .form-control .accept-terms:focus {
              outline: none; }
          html .main .container .column .exercise-area .parent-permission .form-control::-webkit-input-placeholder, body .main .container .column .exercise-area .parent-permission .form-control::-webkit-input-placeholder {
            color: rgba(0, 0, 0, 0.6); }
          html .main .container .column .exercise-area .parent-permission .form-control-info, body .main .container .column .exercise-area .parent-permission .form-control-info {
            white-space: nowrap;
            text-align: center;
            background-color: transparent;
            outline: 0px solid red;
            border: 0px solid red;
            padding: 0 0.3660322vw;
            margin: 0 5%;
            width: 90%;
            font-size: 1.0249vw;
            color: #000000;
            box-sizing: border-box;
            margin-bottom: 0;
            line-height: 1.4vw;
            height: 1.4vw;
            display: block;
            font-family: 'Merriweather', serif;
            overflow-wrap: break-word; }
          html .main .container .column .exercise-area .parent-permission .adress, body .main .container .column .exercise-area .parent-permission .adress {
            color: #000000;
            font-family: 'Merriweather', serif;
            font-size: 1.0249vw;
            padding: 0 0.3660322vw;
            margin: 1vw 5% 0;
            width: 90%;
            box-sizing: border-box;
            border: 0px solid green;
            text-align: left;
            font-weight: bold; }
          html .main .container .column .exercise-area .parent-permission .parent-hint, body .main .container .column .exercise-area .parent-permission .parent-hint {
            color: #000000;
            font-family: 'Merriweather', serif;
            font-weight: normal;
            font-size: 1.0249vw;
            padding: 0 0.3660322vw;
            margin: 0.5vw 5% 0;
            width: 90%;
            box-sizing: border-box;
            border: 0px solid green;
            text-align: left; }
      html .main .container .column, body .main .container .column {
        display: inline-block;
        margin: 0;
        padding: 0; }
        html .main .container .column .math-area::-webkit-scrollbar, body .main .container .column .math-area::-webkit-scrollbar {
          width: 0.43924vw;
          border-radius: 0.43924vw; }
        html .main .container .column .math-area::-webkit-scrollbar-track, body .main .container .column .math-area::-webkit-scrollbar-track {
          border-radius: 0.43924vw;
          -webkit-box-shadow: inset 0 0 0px #88e3ff; }
        html .main .container .column .math-area::-webkit-scrollbar-thumb, body .main .container .column .math-area::-webkit-scrollbar-thumb {
          border-radius: 0.43924vw;
          background-color: #88e3ff; }
        html .main .container .column .math-area, body .main .container .column .math-area {
          -webkit-user-select: none;
          /* Chrome/Safari */
          -moz-user-select: none;
          /* Firefox */
          -ms-user-select: none;
          /* IE10+ */
          background-color: #eeffff;
          border: 0px solid blue;
          box-sizing: border-box;
          margin: 0;
          padding: 0;
          text-align: center;
          position: absolute;
          left: 18.3016vw;
          right: 18.3016vw;
          top: 10%;
          height: 90%;
          overflow-y: hidden;
          overflow-x: hidden;
          font-family: 'TeX Gyre Pagella Regular';
          font-size: 1.1713vw; }
          html .main .container .column .math-area .pi_pythagorean_math, body .main .container .column .math-area .pi_pythagorean_math {
            height: calc(26vw + 28vh + 2.5vw);
            padding: 0;
            margin: 0;
            border: 0px solid black;
            text-align: center;
            -webkit-tap-highlight-color: transparent;
            display: block;
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%); }
            html .main .container .column .math-area .pi_pythagorean_math .math-formula-text, body .main .container .column .math-area .pi_pythagorean_math .math-formula-text {
              font-size: 1.6105vw;
              font-weight: normal;
              font-family: 'Merriweather', serif;
              margin: 1vw 0 2vw 0;
              border: 0px solid blue; }
            html .main .container .column .math-area .pi_pythagorean_math .figure-area, body .main .container .column .math-area .pi_pythagorean_math .figure-area {
              width: calc(26vw + 28vh);
              height: calc(26vw + 28vh);
              margin: 0 auto 0;
              padding: 0;
              border: 0px solid green; }
            html .main .container .column .math-area .pi_pythagorean_math .button-area, body .main .container .column .math-area .pi_pythagorean_math .button-area {
              width: 50vw;
              height: 1.5vw;
              margin: 1vw auto 0;
              padding: 0;
              border: 0px solid green; }
      html .main .container .column, body .main .container .column {
        margin: 0;
        padding: 0;
        display: inline-block;
        width: 18.3016vw;
        right: 0;
        top: 10%; }
        html .main .container .column .answer-area, body .main .container .column .answer-area {
          -webkit-user-select: none;
          /* Chrome/Safari */
          -moz-user-select: none;
          /* Firefox */
          -ms-user-select: none;
          /* IE10+ */ }
        html .main .container .column .answer-area.input, html .main .container .column .answer-area.textarea, body .main .container .column .answer-area.input, body .main .container .column .answer-area.textarea {
          -webkit-user-select: text;
          /* Chrome/Safari */
          -moz-user-select: text;
          /* Firefox */
          -ms-user-select: text;
          /* IE10+ */ }
        html .main .container .column .answer-area, body .main .container .column .answer-area {
          position: absolute;
          margin: 0;
          padding: 0 0 0 0;
          right: 0;
          top: 10%;
          width: 18.3016vw;
          cursor: default;
          height: 90%;
          border: 0px solid blue;
          box-sizing: border-box;
          font-family: 'Merriweather', serif;
          -webkit-tap-highlight-color: transparent; }
          html .main .container .column .answer-area .sentence, body .main .container .column .answer-area .sentence {
            position: relative;
            width: 90%;
            margin: 2% 4% 0;
            padding: 0;
            border: 0px solid red;
            font-size: 1.3177vw;
            font-family: 'Merriweather', serif;
            text-align: center; }
            html .main .container .column .answer-area .sentence .ex-ans, body .main .container .column .answer-area .sentence .ex-ans {
              width: 100%;
              border: 0px solid black;
              text-align: left;
              margin: 0; }
              html .main .container .column .answer-area .sentence .ex-ans .solution, body .main .container .column .answer-area .sentence .ex-ans .solution {
                margin: 0 0 0 1px;
                border: none;
                height: 1rem;
                padding-bottom: 3px;
                width: 1.6105vw;
                font-family: 'TeX Gyre Pagella Italic';
                font-size: 1.1713vw;
                border-radius: 0; }
              html .main .container .column .answer-area .sentence .ex-ans #hha_1_1, html .main .container .column .answer-area .sentence .ex-ans #hha_1_2, html .main .container .column .answer-area .sentence .ex-ans #hha_1_3, html .main .container .column .answer-area .sentence .ex-ans #hha_1_4, body .main .container .column .answer-area .sentence .ex-ans #hha_1_1, body .main .container .column .answer-area .sentence .ex-ans #hha_1_2, body .main .container .column .answer-area .sentence .ex-ans #hha_1_3, body .main .container .column .answer-area .sentence .ex-ans #hha_1_4 {
                margin: 0 0 0 1px;
                border: none;
                width: 3vw;
                font-family: 'TeX Gyre Pagella Italic';
                font-size: 1.1713vw; }
              html .main .container .column .answer-area .sentence .ex-ans .solution-unit, body .main .container .column .answer-area .sentence .ex-ans .solution-unit {
                margin: 0 0 0 -0.2928vw;
                padding: 0 0 0 0;
                border: none;
                font-family: 'TeX Gyre Pagella Italic';
                font-size: 1.1713vw; }
              html .main .container .column .answer-area .sentence .ex-ans .check, body .main .container .column .answer-area .sentence .ex-ans .check {
                display: inline-block;
                float: right;
                margin: auto 0;
                padding: 0;
                height: 0.7321vw;
                line-height: 0.7321vw;
                vertical-align: middle;
                margin-top: 0.6vw;
                font-size: 0.7321vw;
                color: black;
                background-color: transparent;
                font-family: 'Merriweather', serif;
                border: 0px solid red; }
            html .main .container .column .answer-area .sentence .question-text, body .main .container .column .answer-area .sentence .question-text {
              display: block;
              border: 0px solid red;
              font-size: 1.3177vw;
              font-family: 'Merriweather', serif; }
              html .main .container .column .answer-area .sentence .question-text .latex-math-font-size, body .main .container .column .answer-area .sentence .question-text .latex-math-font-size {
                font-family: 'TeX Gyre Pagella Italic';
                font-size: 1.1713vw; }
              html .main .container .column .answer-area .sentence .question-text .latex-math-font-size-2, body .main .container .column .answer-area .sentence .question-text .latex-math-font-size-2 {
                font-family: 'TeX Gyre Pagella Italic';
                font-size: 1.3177vw; }
              html .main .container .column .answer-area .sentence .question-text .latex-math-font-size-3, body .main .container .column .answer-area .sentence .question-text .latex-math-font-size-3 {
                font-family: 'TeX Gyre Pagella Italic';
                font-size: 1.4641vw; }
              html .main .container .column .answer-area .sentence .question-text .latex-math-font-size-4, body .main .container .column .answer-area .sentence .question-text .latex-math-font-size-4 {
                font-family: 'TeX Gyre Pagella Italic';
                font-size: 1.0249vw; }
              html .main .container .column .answer-area .sentence .question-text .latex-math-font-size-5, body .main .container .column .answer-area .sentence .question-text .latex-math-font-size-5 {
                font-family: 'TeX Gyre Pagella Italic';
                font-size: 0.8785vw; }
              html .main .container .column .answer-area .sentence .question-text .latex-math-font-size-6, body .main .container .column .answer-area .sentence .question-text .latex-math-font-size-6 {
                font-family: 'TeX Gyre Pagella Italic';
                font-size: 0.7321vw; }
            html .main .container .column .answer-area .sentence .click-answer, body .main .container .column .answer-area .sentence .click-answer {
              border: 0px solid black;
              display: inline-block;
              height: 1.5vw;
              line-height: 1.5vw;
              margin: 0 1vw;
              padding: 0; }
              html .main .container .column .answer-area .sentence .click-answer .question-field, body .main .container .column .answer-area .sentence .click-answer .question-field {
                display: inline-block;
                width: 1.5vw;
                height: 1.5vw;
                border: 0px solid green;
                margin: 0 auto;
                padding: 0;
                line-height: 1.5vw;
                vertical-align: middle;
                font-size: 1.3177vw;
                font-family: 'Merriweather', serif;
                box-sizing: border-box; }
          html .main .container .column .answer-area .latex-math-font-size, body .main .container .column .answer-area .latex-math-font-size {
            font-family: 'TeX Gyre Pagella Italic';
            font-size: 1.1713vw; }
          html .main .container .column .answer-area .latex-math-font-size-2, body .main .container .column .answer-area .latex-math-font-size-2 {
            font-family: 'TeX Gyre Pagella Italic';
            font-size: 1.3177vw; }
          html .main .container .column .answer-area .latex-math-font-size-3, body .main .container .column .answer-area .latex-math-font-size-3 {
            font-family: 'TeX Gyre Pagella Italic';
            font-size: 1.4641vw; }
          html .main .container .column .answer-area .latex-math-font-size-4, body .main .container .column .answer-area .latex-math-font-size-4 {
            font-family: 'TeX Gyre Pagella Italic';
            font-size: 1.0249vw; }
          html .main .container .column .answer-area .latex-math-font-size-5, body .main .container .column .answer-area .latex-math-font-size-5 {
            font-family: 'TeX Gyre Pagella Italic';
            font-size: 0.8785vw; }
          html .main .container .column .answer-area .latex-math-font-size-6, body .main .container .column .answer-area .latex-math-font-size-6 {
            font-family: 'TeX Gyre Pagella Italic';
            font-size: 0.7321vw; }
  html .fadecolor, body .fadecolor {
    background-color: #ff0000; }
@-webkit-keyframes colorfade {
  from {
    background-color: '#eeffff'; }
  to {
    background-color: 'rgba(136, 227, 255, 0.2)'; } }
  html .fadebackground, body .fadebackground {
    animation-name: colorfade;
    animation-duration: 1s;
    animation-iteration-count: 1;
    animation-direction: normal;
    animation-timing-function: ease-in-out; }
  @media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {
    html .header, body .header {
      border: 1px solid transparent;
      border-bottom: 0px;
      border-top: 0px; } }

/*# sourceMappingURL=index.css.map */
