@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); }
html, body {
  margin: 0;
  min-height: 100%;
  background: #eeffff;
  font-family: 'Merriweather', serif;
  /*
  .smiley-animation {
  	stroke-dasharray:25;
  	stroke-dashoffset:25;
  	animation: smile 0.5s ease-out forwards;
  }
  @keyframes smile {
  	from {
  		stroke-dashoffset:25;
  	}
  	to {
  		stroke-dashoffset:0;
  	}
  }
  */ }
  html .header, body .header {
    margin: 0;
    height: 7%;
    width: 100%;
    position: absolute;
    background-color: rgba(0, 0, 0, 0.9); }
    html .header .container, body .header .container {
      border: 0 solid blue;
      height: 7%;
      width: 100%;
      height: 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 red;
        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 .logo-figure, body .header .container .column .recent .logo-figure {
          -webkit-user-select: none;
          /* Chrome/Safari */
          -moz-user-select: none;
          /* Firefox */
          -ms-user-select: none;
          /* IE10+ */
          display: inline-block;
          margin: auto;
          padding: 0.5vh 0;
          width: 7vh;
          height: 100%;
          box-sizing: border-box;
          border: 0px solid blue;
          cursor: default;
          -webkit-tap-highlight-color: transparent;
          /**.logo-edge {
          	display:none;
          	cursor:default;
          	color:#ffffff;
          	opacity:1;
          	font-family:serif;
          	position:absolute;
          	border:0px solid red;
          	height:6vh;
          	width:6vh;
          }*/ }
      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 .chapter-name, body .header .container .column .members .chapter-name {
          border: 0px solid blue;
          height: 100%;
          box-sizing: border-box;
          right: 0;
          margin: 0 auto;
          padding: 0.1vw 5px 0;
          width: 60vw;
          line-height: 1.6vw;
          display: table;
          table-layout: fixed; }
          html .header .container .column .members .chapter-name .howtopi-name, body .header .container .column .members .chapter-name .howtopi-name {
            border: 0px solid red;
            font-family: Garamond, Baskerville, "Baskerville Old Face", "Hoefler Text", "Times New Roman", serif;
            color: #88e3ff;
            font-size: 2.0vw;
            cursor: default;
            padding: 0;
            display: table-cell;
            vertical-align: middle; }
        html .header .container .column .members .navigation, body .header .container .column .members .navigation {
          border: 0px solid blue;
          position: absolute;
          color: #88e3ff;
          top: 0;
          right: 0;
          height: 100%;
          box-sizing: border-box;
          display: table; }
          html .header .container .column .members .navigation .navigation-hint, body .header .container .column .members .navigation .navigation-hint {
            font-size: 1vw;
            display: table-cell;
            vertical-align: middle; }
      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 .smiley-figure, body .header .container .column .long .smiley-figure {
          display: inline-block;
          margin: auto;
          padding: 0.5vh 0;
          width: 7vh;
          height: 100%;
          box-sizing: border-box;
          border: 0px solid blue;
          cursor: default;
          -webkit-tap-highlight-color: transparent; }
        html .header .container .column .long .cards, body .header .container .column .long .cards {
          border: 0px solid blue;
          height: 100%;
          box-sizing: border-box;
          position: absolute;
          left: 0;
          margin: 0;
          padding: 0;
          width: 5.1245vw;
          display: table;
          table-layout: fixed; }
          html .header .container .column .long .cards .flashcards, body .header .container .column .long .cards .flashcards {
            border: 0px solid red;
            margin: 0;
            padding: 0;
            font-size: 0.8785vw;
            outline: none;
            display: table-cell;
            vertical-align: middle; }
            html .header .container .column .long .cards .flashcards .flash, body .header .container .column .long .cards .flashcards .flash {
              height: 1.6vw;
              line-height: 1.6vw;
              border-radius: 5%;
              outline: none;
              border: 0px solid green;
              margin: 0;
              padding: 0;
              color: #88e3ff;
              font-family: Garamond, Baskerville, "Baskerville Old Face", "Hoefler Text", "Times New Roman", serif;
              font-size: 1.0249vw; }
              html .header .container .column .long .cards .flashcards .flash a, body .header .container .column .long .cards .flashcards .flash a {
                text-decoration: none;
                color: #88e3ff; }
            html .header .container .column .long .cards .flashcards .flash:hover, body .header .container .column .long .cards .flashcards .flash: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 .long .member-name, body .header .container .column .long .member-name {
          border: 0px solid red;
          height: 100%;
          box-sizing: border-box;
          position: absolute;
          top: 0;
          right: 0;
          margin: 0;
          padding: 0 5px;
          width: 7.6867vw;
          line-height: 1.2vw;
          display: table;
          table-layout: fixed;
          cursor: default; }
          html .header .container .column .long .member-name .name, body .header .container .column .long .member-name .name {
            margin: 0;
            padding: 0;
            border: none;
            color: #88e3ff;
            font-family: Garamond, Baskerville, "Baskerville Old Face", "Hoefler Text", "Times New Roman", serif;
            font-size: 0.8785vw;
            display: table-cell;
            vertical-align: middle;
            word-wrap: break-word; }
            html .header .container .column .long .member-name .name .name-border, body .header .container .column .long .member-name .name .name-border {
              margin: 0 auto;
              padding: 0 0.5vw;
              border: 0px solid red;
              -webkit-tap-highlight-color: transparent;
              width: fit-content;
              border-radius: 5%; }
            html .header .container .column .long .member-name .name .name-border:hover, body .header .container .column .long .member-name .name .name-border:hover {
              -webkit-box-shadow: 0 0 0.7321vw #0076ff;
              box-shadow: 0 0 0.7321vw #0076ff; }
        html .header .container .column .long .done-exercise, body .header .container .column .long .done-exercise {
          top: 0;
          right: 0;
          position: absolute;
          border: none;
          margin: 0;
          padding: 0;
          font-size: 12px;
          color: #88e3ff;
          color: transparent; }
  html .main, body .main {
    -webkit-user-select: none;
    /* Chrome/Safari */
    -moz-user-select: none;
    /* Firefox */
    -ms-user-select: none;
    /* IE10+ */
    border: 0 solid red; }
    html .main .container, body .main .container {
      border: none;
      padding: 0;
      margin: 0; }
      html .main .container .column, body .main .container .column {
        display: inline-block;
        border: none;
        margin: 0;
        padding: 0;
        width: 18.3016vw;
        font-size: 1.1713vw; }
        html .main .container .column .exercise-area, body .main .container .column .exercise-area {
          border: 0px solid red;
          position: absolute;
          top: 7%;
          width: 18.3016vw;
          cursor: default;
          height: 93%;
          margin: 0;
          padding: 0;
          overflow-wrap: break-word;
          -webkit-tap-highlight-color: transparent; }
          html .main .container .column .exercise-area .button-reset, body .main .container .column .exercise-area .button-reset {
            margin: 0 0 0 0;
            color: #eeffff;
            background-color: rgba(0, 0, 0, 0.9);
            outline: none;
            border: none;
            float: left;
            text-align: center;
            font-size: 1.0249vw;
            height: 1.4641vw;
            line-height: 1.4641vw;
            vertical-align: middle;
            width: 5.1245vw;
            touch-action: manipulation; }
          html .main .container .column .exercise-area .button-reset:hover, body .main .container .column .exercise-area .button-reset:hover {
            color: #55ffff;
            cursor: default; }
          html .main .container .column .exercise-area .button-reset:active, body .main .container .column .exercise-area .button-reset:active {
            -webkit-box-shadow: 0 0 0.7321vw #000000;
            box-shadow: 0 0 0.7321vw #000000; }
          html .main .container .column .exercise-area .button-back, body .main .container .column .exercise-area .button-back {
            margin: 0 0 0 0;
            color: #eeffff;
            background-color: rgba(0, 0, 0, 0.9);
            outline: none;
            border: none;
            float: right;
            text-align: center;
            font-size: 1.0249vw;
            height: 1.4641vw;
            line-height: 1.4641vw;
            vertical-align: middle;
            width: 5.1245vw;
            border: 0px solid red;
            top: 0;
            touch-action: manipulation; }
          html .main .container .column .exercise-area .button-back:hover, body .main .container .column .exercise-area .button-back:hover {
            color: #55ffff;
            cursor: default; }
          html .main .container .column .exercise-area .button-back:active, body .main .container .column .exercise-area .button-back:active {
            -webkit-box-shadow: 0 0 0.7321vw #000000;
            box-shadow: 0 0 0.7321vw #000000; }
          html .main .container .column .exercise-area .exercise, body .main .container .column .exercise-area .exercise {
            padding: 0 0 0 0;
            margin: 0;
            height: 100%;
            box-sizing: border-box; }
            html .main .container .column .exercise-area .exercise .heading, body .main .container .column .exercise-area .exercise .heading {
              margin: 0;
              padding: 0 0 0 0;
              text-align: center;
              border: 0px solid black;
              height: 1.4641vw;
              line-height: 1.4641vw;
              vertical-align: middle;
              font-size: 1.0249vw; }
            html .main .container .column .exercise-area .exercise .text::-webkit-scrollbar, body .main .container .column .exercise-area .exercise .text::-webkit-scrollbar {
              width: 0.43924vw;
              border-radius: 0.43924vw; }
            html .main .container .column .exercise-area .exercise .text::-webkit-scrollbar-track, body .main .container .column .exercise-area .exercise .text::-webkit-scrollbar-track {
              border-radius: 0.43924vw;
              -webkit-box-shadow: inset 0 0 0 #88e3ff; }
            html .main .container .column .exercise-area .exercise .text::-webkit-scrollbar-thumb, body .main .container .column .exercise-area .exercise .text::-webkit-scrollbar-thumb {
              border-radius: 0.43924vw;
              background-color: #88e3ff; }
            html .main .container .column .exercise-area .exercise .text, body .main .container .column .exercise-area .exercise .text {
              text-align: left;
              border: none;
              margin: 0;
              padding: 1.4641vw 0.7321vw 0vw;
              width: 100%;
              box-sizing: border-box;
              -webkit-user-select: none;
              /* Chrome/Safari */
              -moz-user-select: none;
              /* Firefox */
              -ms-user-select: none;
              /* IE10+ */
              cursor: default;
              font-size: 1.1713vw;
              overflow-wrap: break-word;
              height: calc(100% - 1.4641vw);
              overflow-y: scroll; }
              html .main .container .column .exercise-area .exercise .text .figure-button, body .main .container .column .exercise-area .exercise .text .figure-button {
                background-color: #88e3ff;
                padding: 0 0.3660vw; }
              html .main .container .column .exercise-area .exercise .text .figure-button:hover, body .main .container .column .exercise-area .exercise .text .figure-button:hover {
                color: #55ffff;
                background-color: rgba(0, 0, 0, 0.9); }
              html .main .container .column .exercise-area .exercise .text .figure-button:active, body .main .container .column .exercise-area .exercise .text .figure-button:active {
                -webkit-box-shadow: 0 0 0.7321vw #000000;
                box-shadow: 0 0 0.7321vw #000000; }
              html .main .container .column .exercise-area .exercise .text .equation, body .main .container .column .exercise-area .exercise .text .equation {
                border: none;
                font-family: 'TeX Gyre Pagella Italic';
                font-size: 1.1713vw;
                padding: 0.29283vw 0 0 0;
                text-align: left;
                text-decoration: none;
                pointer-events: none;
                outline: none; }
              html .main .container .column .exercise-area .exercise .text .MathJax:focus, html .main .container .column .exercise-area .exercise .text .mjx-chtml:focus, html .main .container .column .exercise-area .exercise .text .MathJax_SVG:focus, body .main .container .column .exercise-area .exercise .text .MathJax:focus, body .main .container .column .exercise-area .exercise .text .mjx-chtml:focus, body .main .container .column .exercise-area .exercise .text .MathJax_SVG:focus {
                outline: 1px solid gray;
                text-decoration: none;
                pointer-events: none;
                outline: none; }
              html .main .container .column .exercise-area .exercise .text .equation:focus, body .main .container .column .exercise-area .exercise .text .equation:focus {
                text-decoration: none;
                pointer-events: none;
                outline: none; }
              html .main .container .column .exercise-area .exercise .text .latex-button, body .main .container .column .exercise-area .exercise .text .latex-button {
                border: none;
                display: inline-block;
                padding: 0;
                margin: 0;
                border-radius: 50%;
                height: 0.7321vw;
                width: 0.7321vw;
                background-color: #88e3ff; }
              html .main .container .column .exercise-area .exercise .text .latex-formula, body .main .container .column .exercise-area .exercise .text .latex-formula {
                text-align: left;
                margin: 0;
                padding: 0.2196vw 0 0.3660vw 0;
                border: none;
                font-family: 'TeX Gyre Pagella Italic';
                font-size: 0.8785vw;
                color: black;
                background-color: #ffffff;
                cursor: text; }
              html .main .container .column .exercise-area .exercise .text .latex-math-note, body .main .container .column .exercise-area .exercise .text .latex-math-note {
                font-family: 'TeX Gyre Pagella Italic';
                font-size: 0.8785vw;
                line-height: 90%;
                border: 0 solid red;
                margin: 0; }
              html .main .container .column .exercise-area .exercise .text .latex-math-font-size, body .main .container .column .exercise-area .exercise .text .latex-math-font-size {
                font-family: 'TeX Gyre Pagella Italic';
                font-size: 1.1713vw; }
              html .main .container .column .exercise-area .exercise .text .latex-math-font-size-2, body .main .container .column .exercise-area .exercise .text .latex-math-font-size-2 {
                font-family: 'TeX Gyre Pagella Italic';
                font-size: 1.3177vw; }
              html .main .container .column .exercise-area .exercise .text .latex-math-font-size-3, body .main .container .column .exercise-area .exercise .text .latex-math-font-size-3 {
                font-family: 'TeX Gyre Pagella Italic';
                font-size: 1.4641vw; }
              html .main .container .column .exercise-area .exercise .text .latex-math-font-size-4, body .main .container .column .exercise-area .exercise .text .latex-math-font-size-4 {
                font-family: 'TeX Gyre Pagella Italic';
                font-size: 1.0249vw; }
              html .main .container .column .exercise-area .exercise .text .latex-math-font-size-5, body .main .container .column .exercise-area .exercise .text .latex-math-font-size-5 {
                font-family: 'TeX Gyre Pagella Italic';
                font-size: 0.8785vw; }
              html .main .container .column .exercise-area .exercise .text .latex-math-font-size-6, body .main .container .column .exercise-area .exercise .text .latex-math-font-size-6 {
                font-family: 'TeX Gyre Pagella Italic';
                font-size: 0.7321vw; }
      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: rgba(136, 227, 255, 0.1);
          border: none;
          margin: 0 auto;
          padding: 0;
          text-align: center;
          position: absolute;
          left: 18.3016vw;
          right: 18.3016vw;
          top: 7%;
          height: 93%;
          overflow-y: scroll;
          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 {
            padding: 0;
            margin: 0.3660vw 0 0 0.4392vw;
            border: none;
            text-align: center; }
            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: bold;
              font-family: 'TeX Gyre Pagella Regular'; }
            html .main .container .column .math-area .pi_pythagorean_math .figure-area, body .main .container .column .math-area .pi_pythagorean_math .figure-area {
              width: 40vw;
              height: 40vw;
              margin: 0 auto 0;
              padding: 0;
              border: 0px solid green;
              -webkit-tap-highlight-color: transparent; }
            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 .math-area .zoom-bar, body .main .container .column .math-area .zoom-bar {
            -webkit-appearance: none;
            background-color: transparent;
            width: 7.3206vw;
            height: 1.4641vw;
            padding: 0;
            margin: 0;
            right: 0;
            top: 37.8571vh;
            position: absolute;
            -webkit-transform: rotate(270deg); }
          html .main .container .column .math-area .zoom-bar::-ms-track, body .main .container .column .math-area .zoom-bar::-ms-track {
            width: 7.3206vw;
            cursor: default;
            background: transparent;
            border-color: transparent;
            color: transparent; }
          html .main .container .column .math-area .zoom-bar:focus, body .main .container .column .math-area .zoom-bar:focus {
            outline: none; }
          html .main .container .column .math-area .zoom-bar::-webkit-slider-runnable-track, body .main .container .column .math-area .zoom-bar::-webkit-slider-runnable-track {
            height: 0.292826vw;
            background-color: white;
            border-radius: 0.1464129vw; }
          html .main .container .column .math-area .zoom-bar:focus::-webkit-slider-runnable-track, body .main .container .column .math-area .zoom-bar:focus::-webkit-slider-runnable-track {
            box-shadow: 0 0 0.29283vw #88e3ff; }
          html .main .container .column .math-area .zoom-bar::-moz-range-track, body .main .container .column .math-area .zoom-bar::-moz-range-track {
            height: 0.292826vw;
            background-color: white;
            border-radius: 0.1464129vw; }
          html .main .container .column .math-area .zoom-bar:focus::-moz-range-track, body .main .container .column .math-area .zoom-bar:focus::-moz-range-track {
            box-shadow: 0 0 0.29283vw #88e3ff; }
          html .main .container .column .math-area .zoom-bar::-ms-track, body .main .container .column .math-area .zoom-bar::-ms-track {
            height: 0.1464129vw;
            background-color: white;
            border-radius: 0.1464129vw; }
          html .main .container .column .math-area .zoom-bar:focus::-ms-track, body .main .container .column .math-area .zoom-bar:focus::-ms-track {
            box-shadow: 0 0 0.29283vw #88e3ff; }
          html .main .container .column .math-area .zoom-bar::-ms-fill-lower, body .main .container .column .math-area .zoom-bar::-ms-fill-lower {
            background-color: white;
            border-radius: 0.1464129vw; }
          html .main .container .column .math-area .zoom-bar:focus::-ms-fill-lower, body .main .container .column .math-area .zoom-bar:focus::-ms-fill-lower {
            box-shadow: 0 0 0.29283vw #88e3ff; }
          html .main .container .column .math-area .zoom-bar::-ms-fill-upper, body .main .container .column .math-area .zoom-bar::-ms-fill-upper {
            background-color: white;
            border-radius: 0.1464129vw; }
          html .main .container .column .math-area .zoom-bar:focus::-ms-fill-upper, body .main .container .column .math-area .zoom-bar:focus::-ms-fill-upper {
            box-shadow: 0 0 0.29283vw #88e3ff; }
          html .main .container .column .math-area .zoom-bar::-webkit-slider-thumb, body .main .container .column .math-area .zoom-bar::-webkit-slider-thumb {
            -webkit-appearance: none;
            background: #88e3ff;
            height: 1.4641vw;
            width: 1.4641vw;
            border-radius: 50%;
            margin-top: -0.58565vw;
            box-shadow: 0 0 0 #88e3ff;
            border: none; }
          html .main .container .column .math-area .zoom-bar::-moz-range-thumb, body .main .container .column .math-area .zoom-bar::-moz-range-thumb {
            -webkit-appearance: none;
            background: #88e3ff;
            height: 1.4641vw;
            width: 1.4641vw;
            border-radius: 50%;
            margin-top: -0.58565vw;
            box-shadow: 0 0 0 #88e3ff;
            border: none; }
          html .main .container .column .math-area .zoom-bar::-ms-thumb, body .main .container .column .math-area .zoom-bar::-ms-thumb {
            -webkit-appearance: none;
            background: #88e3ff;
            height: 1.4641vw;
            width: 1.4641vw;
            border-radius: 50%;
            margin-top: 0;
            box-shadow: 0 0 0 #88e3ff;
            border: none; }
          html .main .container .column .math-area .math-figure, body .main .container .column .math-area .math-figure {
            font-family: 'TeX Gyre Pagella Italic';
            border: none;
            margin: 0;
            padding: 0;
            top: 7%;
            cursor: default; }
            html .main .container .column .math-area .math-figure .math-figure-group:focus, body .main .container .column .math-area .math-figure .math-figure-group:focus {
              cursor: default; }
          html .main .container .column .math-area .math-figure:focus, body .main .container .column .math-area .math-figure:focus {
            cursor: default; }
          html .main .container .column .math-area .math-figure-button, body .main .container .column .math-area .math-figure-button {
            border: 0px solid red;
            margin: 0 auto;
            padding: 0;
            width: 60vw;
            height: 1.5vw;
            box-sizing: border-box; }
          html .main .container .column .math-area .math-figure-table-div, body .main .container .column .math-area .math-figure-table-div {
            width: 100%;
            box-sizing: border-box;
            border: none;
            text-align: center; }
            html .main .container .column .math-area .math-figure-table-div .math-formula-text, body .main .container .column .math-area .math-figure-table-div .math-formula-text {
              font-size: 18px;
              font-weight: bold; }
            html .main .container .column .math-area .math-figure-table-div .math-figure-table, body .main .container .column .math-area .math-figure-table-div .math-figure-table {
              margin: 0 auto;
              text-align: center;
              border: none; }
            html .main .container .column .math-area .math-figure-table-div .math-formula-derivation, body .main .container .column .math-area .math-figure-table-div .math-formula-derivation {
              margin: 0 auto;
              text-align: center;
              border: none; }
            html .main .container .column .math-area .math-figure-table-div .math-formula-derivation td, body .main .container .column .math-area .math-figure-table-div .math-formula-derivation td {
              text-align: center; }
              html .main .container .column .math-area .math-figure-table-div .math-formula-derivation td img, body .main .container .column .math-area .math-figure-table-div .math-formula-derivation td img {
                padding: 0 0 20px 0; }
          html .main .container .column .math-area table, html .main .container .column .math-area tr, html .main .container .column .math-area td, html .main .container .column .math-area th, body .main .container .column .math-area table, body .main .container .column .math-area tr, body .main .container .column .math-area td, body .main .container .column .math-area th {
            border: none;
            border-collapse: collapse;
            text-align: left; }
          html .main .container .column .math-area th, body .main .container .column .math-area th {
            text-align: center;
            padding: 0 0 0.7321vw 0; }
          html .main .container .column .math-area td, body .main .container .column .math-area td {
            text-align: left;
            padding: 0 15px 0 15px; }
            html .main .container .column .math-area td img, body .main .container .column .math-area td img {
              padding: 0 0 0 5px;
              border: none; }
          html .main .container .column .math-area .math-figure-text, body .main .container .column .math-area .math-figure-text {
            padding: 0 0.7321vw 0;
            margin: 0;
            border: none;
            width: 100%;
            box-sizing: border-box;
            text-align: left; }
            html .main .container .column .math-area .math-figure-text .math-text-equation, body .main .container .column .math-area .math-figure-text .math-text-equation {
              border: none;
              padding: 0;
              margin: 0; }
          html .main .container .column .math-area .math-text-center, body .main .container .column .math-area .math-text-center {
            padding: 0 0.7321vw 0;
            margin: 0;
            text-align: center;
            font-size: 1.3177vw; }
      html .main .container .column, body .main .container .column {
        margin: 0;
        padding: 0;
        display: inline-block;
        width: 18.3016vw;
        right: 0;
        top: 7%; }
        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: 7%;
          width: 18.3016vw;
          cursor: default;
          height: 93%;
          border: none;
          -webkit-tap-highlight-color: transparent; }
          html .main .container .column .answer-area .button-next, body .main .container .column .answer-area .button-next {
            margin: 0 0 0 0;
            color: #eeffff;
            background-color: rgba(0, 0, 0, 0.9);
            outline: none;
            border: none;
            top: 0;
            float: left;
            text-align: center;
            font-size: 1.0249vw;
            height: 1.4641vw;
            line-height: 1.4641vw;
            vertical-align: middle;
            width: 5.1245vw;
            touch-action: manipulation; }
          html .main .container .column .answer-area .button-next:hover, body .main .container .column .answer-area .button-next:hover {
            color: #55ffff; }
          html .main .container .column .answer-area .button-next:active, body .main .container .column .answer-area .button-next:active {
            -webkit-box-shadow: 0 0 0.7321vw #000000;
            box-shadow: 0 0 0.7321vw #000000; }
          html .main .container .column .answer-area .button-show, body .main .container .column .answer-area .button-show {
            margin: 0 0 0 0;
            color: #eeffff;
            background-color: rgba(0, 0, 0, 0.9);
            outline: none;
            border: none;
            float: right;
            text-align: center;
            font-size: 1.0249vw;
            height: 1.4641vw;
            line-height: 1.4641vw;
            vertical-align: middle;
            width: 5.1245vw;
            touch-action: manipulation; }
          html .main .container .column .answer-area .button-show:hover, body .main .container .column .answer-area .button-show:hover {
            color: #55ffff; }
          html .main .container .column .answer-area .button-show:active, body .main .container .column .answer-area .button-show:active {
            -webkit-box-shadow: 0 0 0.7321vw #000000;
            box-shadow: 0 0 0.7321vw #000000; }
          html .main .container .column .answer-area .answer-part, body .main .container .column .answer-area .answer-part {
            margin: 0;
            padding: 2.9283vw 0 0 0;
            font-size: 1.1713vw; }
            html .main .container .column .answer-area .answer-part .answer-fields, body .main .container .column .answer-area .answer-part .answer-fields {
              text-align: left;
              border: none;
              margin: 0;
              padding: 0 0.7321vw 0 0.7321vw;
              width: 100%;
              box-sizing: border-box;
              font-size: 1.1713vw;
              overflow-wrap: break-word; }
              html .main .container .column .answer-area .answer-part .answer-fields .equation, body .main .container .column .answer-area .answer-part .answer-fields .equation {
                border: none;
                font-family: 'TeX Gyre Pagella Italic';
                font-size: 1.1713vw;
                padding: 0.29283vw 0 0 0;
                text-align: left; }
              html .main .container .column .answer-area .answer-part .answer-fields .latex-button, body .main .container .column .answer-area .answer-part .answer-fields .latex-button {
                border: none;
                display: inline-block;
                padding: 0;
                margin: 0;
                border-radius: 50%;
                height: 0.7321vw;
                width: 0.7321vw;
                background-color: #88e3ff; }
              html .main .container .column .answer-area .answer-part .answer-fields .latex-formula, body .main .container .column .answer-area .answer-part .answer-fields .latex-formula {
                text-align: left;
                margin: 0;
                padding: 0.2196vw 0 0.3660vw 0;
                border: none;
                font-family: 'TeX Gyre Pagella Italic';
                font-size: 0.8785vw;
                color: black;
                background-color: #ffffff;
                cursor: text;
                -webkit-user-select: text;
                /* Chrome/Safari */
                -moz-user-select: text;
                /* Firefox */
                -ms-user-select: text;
                /* IE10+ */ }
              html .main .container .column .answer-area .answer-part .answer-fields .latex-math-note, body .main .container .column .answer-area .answer-part .answer-fields .latex-math-note {
                font-family: 'TeX Gyre Pagella Italic';
                font-size: 0.8785vw;
                line-height: 90%;
                border: 0 solid red;
                margin: 0; }
              html .main .container .column .answer-area .answer-part .answer-fields .latex-math-font-size, body .main .container .column .answer-area .answer-part .answer-fields .latex-math-font-size {
                font-family: 'TeX Gyre Pagella Italic';
                font-size: 1.1713vw; }
              html .main .container .column .answer-area .answer-part .answer-fields .latex-math-font-size-2, body .main .container .column .answer-area .answer-part .answer-fields .latex-math-font-size-2 {
                font-family: 'TeX Gyre Pagella Italic';
                font-size: 1.3177vw; }
              html .main .container .column .answer-area .answer-part .answer-fields .latex-math-font-size-3, body .main .container .column .answer-area .answer-part .answer-fields .latex-math-font-size-3 {
                font-family: 'TeX Gyre Pagella Italic';
                font-size: 1.4641vw; }
              html .main .container .column .answer-area .answer-part .answer-fields .latex-math-font-size-4, body .main .container .column .answer-area .answer-part .answer-fields .latex-math-font-size-4 {
                font-family: 'TeX Gyre Pagella Italic';
                font-size: 1.0249vw; }
              html .main .container .column .answer-area .answer-part .answer-fields .latex-math-font-size-5, body .main .container .column .answer-area .answer-part .answer-fields .latex-math-font-size-5 {
                font-family: 'TeX Gyre Pagella Italic';
                font-size: 0.8785vw; }
              html .main .container .column .answer-area .answer-part .answer-fields .latex-math-font-size-6, body .main .container .column .answer-area .answer-part .answer-fields .latex-math-font-size-6 {
                font-family: 'TeX Gyre Pagella Italic';
                font-size: 0.7321vw; }
              html .main .container .column .answer-area .answer-part .answer-fields .solution, body .main .container .column .answer-area .answer-part .answer-fields .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 .answer-part .answer-fields #pta_9_1, html .main .container .column .answer-area .answer-part .answer-fields #pta_9_2, html .main .container .column .answer-area .answer-part .answer-fields #pta_9_3, body .main .container .column .answer-area .answer-part .answer-fields #pta_9_1, body .main .container .column .answer-area .answer-part .answer-fields #pta_9_2, body .main .container .column .answer-area .answer-part .answer-fields #pta_9_3 {
                margin: 0 0 0 1px;
                border: none;
                width: 2.8vw;
                font-family: 'TeX Gyre Pagella Italic';
                font-size: 1.1713vw; }
              html .main .container .column .answer-area .answer-part .answer-fields #pta_10_1, html .main .container .column .answer-area .answer-part .answer-fields #pta_10_2, html .main .container .column .answer-area .answer-part .answer-fields #pta_10_3, html .main .container .column .answer-area .answer-part .answer-fields #pta_10_4, body .main .container .column .answer-area .answer-part .answer-fields #pta_10_1, body .main .container .column .answer-area .answer-part .answer-fields #pta_10_2, body .main .container .column .answer-area .answer-part .answer-fields #pta_10_3, body .main .container .column .answer-area .answer-part .answer-fields #pta_10_4 {
                margin: 0 0 0 1px;
                border: none;
                width: 2.5622vw;
                font-family: 'TeX Gyre Pagella Italic';
                font-size: 1.1713vw; }
              html .main .container .column .answer-area .answer-part .answer-fields #pta_11_1, html .main .container .column .answer-area .answer-part .answer-fields #pta_11_2, body .main .container .column .answer-area .answer-part .answer-fields #pta_11_1, body .main .container .column .answer-area .answer-part .answer-fields #pta_11_2 {
                margin: 0 0 0 1px;
                border: none;
                width: 2.2vw;
                font-family: 'TeX Gyre Pagella Italic';
                font-size: 1.1713vw; }
              html .main .container .column .answer-area .answer-part .answer-fields .solution-unit, body .main .container .column .answer-area .answer-part .answer-fields .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 .answer-part .answer-fields .latex-input, body .main .container .column .answer-area .answer-part .answer-fields .latex-input {
                box-sizing: border-box;
                margin: 0.3660vw 0 0 0;
                padding: 0 0.3660vw 0 0.3660vw;
                border: none;
                width: 100%;
                resize: none;
                text-align: left;
                border: none;
                height: 3.74vw;
                font-size: 1.0249vw; }
              html .main .container .column .answer-area .answer-part .answer-fields .latex-input:focus, body .main .container .column .answer-area .answer-part .answer-fields .latex-input:focus {
                outline: none; }
              html .main .container .column .answer-area .answer-part .answer-fields #pta_3_1, html .main .container .column .answer-area .answer-part .answer-fields #pta_3_2, html .main .container .column .answer-area .answer-part .answer-fields #pta_4_1, html .main .container .column .answer-area .answer-part .answer-fields #pta_5_1, html .main .container .column .answer-area .answer-part .answer-fields #pta_5_2, html .main .container .column .answer-area .answer-part .answer-fields #pta_5_3, html .main .container .column .answer-area .answer-part .answer-fields #pta_5_4, body .main .container .column .answer-area .answer-part .answer-fields #pta_3_1, body .main .container .column .answer-area .answer-part .answer-fields #pta_3_2, body .main .container .column .answer-area .answer-part .answer-fields #pta_4_1, body .main .container .column .answer-area .answer-part .answer-fields #pta_5_1, body .main .container .column .answer-area .answer-part .answer-fields #pta_5_2, body .main .container .column .answer-area .answer-part .answer-fields #pta_5_3, body .main .container .column .answer-area .answer-part .answer-fields #pta_5_4 {
                height: 1.6vw; }
              html .main .container .column .answer-area .answer-part .answer-fields .latex-output, body .main .container .column .answer-area .answer-part .answer-fields .latex-output {
                display: inline-block;
                margin: 0;
                padding: 0;
                text-align: left;
                font-size: 1.1713vw;
                font-family: 'TeX Gyre Pagella Italic'; }
              html .main .container .column .answer-area .answer-part .answer-fields .check, body .main .container .column .answer-area .answer-part .answer-fields .check {
                display: inline-block;
                float: right;
                margin: 0 0.7321vw 0 0;
                padding: calc(0.2928vw + 4px) 0 0 0;
                height: 0.7321vw;
                line-height: 0.7321vw;
                vertical-align: middle;
                font-size: 0.7321vw;
                color: black;
                background-color: transparent;
                font-family: 'Merriweather', serif;
                border: none; }
            html .main .container .column .answer-area .answer-part .hints, body .main .container .column .answer-area .answer-part .hints {
              padding: 1.4641vw 0.7321vw 0 0.7321vw;
              text-align: center;
              width: 100%;
              box-sizing: border-box; }
              html .main .container .column .answer-area .answer-part .hints .latex-math-font-size, body .main .container .column .answer-area .answer-part .hints .latex-math-font-size {
                font-family: 'TeX Gyre Pagella Italic';
                font-size: 1.1713vw; }
              html .main .container .column .answer-area .answer-part .hints .latex-math-font-size-2, body .main .container .column .answer-area .answer-part .hints .latex-math-font-size-2 {
                font-family: 'TeX Gyre Pagella Italic';
                font-size: 1.3177vw; }
              html .main .container .column .answer-area .answer-part .hints .latex-math-font-size-3, body .main .container .column .answer-area .answer-part .hints .latex-math-font-size-3 {
                font-family: 'TeX Gyre Pagella Italic';
                font-size: 1.4641vw; }
              html .main .container .column .answer-area .answer-part .hints .latex-math-font-size-4, body .main .container .column .answer-area .answer-part .hints .latex-math-font-size-4 {
                font-family: 'TeX Gyre Pagella Italic';
                font-size: 1.0249vw; }
              html .main .container .column .answer-area .answer-part .hints .latex-math-font-size-5, body .main .container .column .answer-area .answer-part .hints .latex-math-font-size-5 {
                font-family: 'TeX Gyre Pagella Italic';
                font-size: 0.8785vw; }
              html .main .container .column .answer-area .answer-part .hints .latex-math-font-size-6, body .main .container .column .answer-area .answer-part .hints .latex-math-font-size-6 {
                font-family: 'TeX Gyre Pagella Italic';
                font-size: 0.7321vw; }
              html .main .container .column .answer-area .answer-part .hints .equation, body .main .container .column .answer-area .answer-part .hints .equation {
                border: none;
                font-family: 'TeX Gyre Pagella Italic';
                font-size: 1.1713vw;
                padding: 0.29283vw 0 0 0;
                text-align: center; }
              html .main .container .column .answer-area .answer-part .hints .latex-button, body .main .container .column .answer-area .answer-part .hints .latex-button {
                border: none;
                display: inline-block;
                padding: 0;
                margin: 0;
                border-radius: 50%;
                height: 0.7321vw;
                width: 0.7321vw;
                background-color: #88e3ff; }
              html .main .container .column .answer-area .answer-part .hints .latex-formula, body .main .container .column .answer-area .answer-part .hints .latex-formula {
                margin: 0;
                padding: 0.2196vw 0 0.3660vw 0;
                border: none;
                font-family: 'TeX Gyre Pagella Regular';
                font-size: 0.8785vw;
                color: black;
                background-color: #ffffff;
                overflow-wrap: break-word;
                cursor: text;
                -webkit-user-select: text;
                /* Chrome/Safari */
                -moz-user-select: text;
                /* Firefox */
                -ms-user-select: text;
                /* IE10+ */ }
            html .main .container .column .answer-area .answer-part .hint-text, body .main .container .column .answer-area .answer-part .hint-text {
              text-align: left;
              border: none;
              margin: 0;
              padding: 0 0.7321vw 0 0.7321vw;
              width: 100%;
              box-sizing: border-box; }
            html .main .container .column .answer-area .answer-part .finished-chapter, body .main .container .column .answer-area .answer-part .finished-chapter {
              color: #000088; }
  html .smiley-animation, body .smiley-animation {
    stroke-dasharray: 0 25;
    animation: smile 0.5s ease-out forwards; }
@keyframes smile {
  from {
    stroke-dasharray: 0 25; }
  to {
    stroke-dasharray: 25 0; } }
  html .key-button, body .key-button {
    -webkit-box-shadow: 0 0 0.7321vw #000000;
    box-shadow: 0 0 0.7321vw #000000; }
  html .pan-button, body .pan-button {
    -webkit-tap-highlight-color: transparent; }
  @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=example.css.map */
