* {
  margin: 0px;
  margin-bottom: 0px;
  padding: 0px;
  font-family: raleway, sans-serif;
  box-sizing: border-box;
  color: white; }

h1 {
  font-size: 3.2vmax;
  margin-bottom: 0.2em;
  cursor: default;
  user-select: none; }

h2 {
  color: #f20151;
  margin-bottom: 0.2em;
  user-select: none; }

p {
  line-height: 1.4em;
  user-select: none; }

.cyan {
  color: #56fdd8;
  background-color: unset;
  transition: 0.5s; }

.ico {
  text-decoration: none; }
  .ico span {
    display: block;
    text-align: center;
    font-size: 1.5em;
    padding-top: 0.5em;
    color: #4d4d4d; }

#icoOn span {
  color: #56fdd8; }

.btn {
  display: block;
  color: #56fdd8;
  width: 140px;
  border: 2px solid #56fdd8;
  text-align: center;
  padding: 0.3em;
  border-radius: 0.2em;
  text-decoration: none;
  margin-top: 2em;
  transition: 0.5s;
  font-weight: 600;
  background-color: #262626;
  cursor: pointer; }
  .btn:hover {
    background-color: #56fdd8;
    color: #262626;
    transition: 0.5s; }

.subHeader {
  color: #4d4d4d;
  font-weight: 500; }

body {
  height: 100%;
  overflow: hidden; }
  body nav {
    position: absolute;
    width: 80px;
    height: 100%;
    background-color: #181818;
    z-index: 2;
    box-shadow: 0px 0px 20px #181818; }
    body nav #navWrapper {
      position: absolute;
      transform: translateY(-50%);
      top: 50%;
      width: 80px;
      text-align: center; }
      body nav #navWrapper a {
        display: block;
        position: relative;
        transition: 0.6s; }
        body nav #navWrapper a .navHov {
          display: block;
          opacity: 0;
          position: absolute;
          transform: translateY(-50%);
          top: 50%;
          text-align: center;
          width: 100%;
          transition: 0.6s;
          color: #56fdd8;
          font-size: 0.9em;
          font-weight: 600; }
        body nav #navWrapper a img {
          width: 40px;
          padding-top: 1em;
          padding-bottom: 1em;
          transition: 0.6s; }
        body nav #navWrapper a:hover .navHov {
          display: block;
          opacity: 1;
          transition: 0.6s; }
        body nav #navWrapper a:hover img {
          opacity: 0;
          transition: 0.6s; }
  body .page {
    position: absolute;
    padding-left: 80px;
    height: 100%;
    width: 100%;
    background-color: #262626; }
    body .page .bind {
      padding-left: 10%;
      padding-right: 10%;
      height: 100%;
      width: 100%; }
      body .page .bind .wrapper {
        width: 100%;
        height: 100%;
        position: relative; }
        body .page .bind .wrapper .listBox {
          position: absolute;
          transform: translateY(-50%);
          top: 50%;
          left: 50%;
          width: 50%;
          padding-left: 50px; }
          body .page .bind .wrapper .listBox .listItem {
            width: 48%;
            display: inline-block;
            margin-bottom: 1em; }
            body .page .bind .wrapper .listBox .listItem ul {
              list-style: none; }
              body .page .bind .wrapper .listBox .listItem ul li {
                color: #4d4d4d;
                font-weight: 500;
                line-height: 1.3em; }
        body .page .bind .wrapper .textBox {
          position: absolute;
          transform: translateY(-50%);
          top: 50%;
          width: 50%; }
          body .page .bind .wrapper .textBox p {
            cursor: default;
            margin-top: 0.5em; }
          body .page .bind .wrapper .textBox span {
            cursor: default; }
          body .page .bind .wrapper .textBox:hover .cyan {
            color: #f20151;
            transition: .5s; }
          body .page .bind .wrapper .textBox #leftFloat {
            width: 48%;
            display: inline-block;
            float: left; }
          body .page .bind .wrapper .textBox #rightFloat {
            width: 48%;
            display: inline-block;
            float: left; }
          body .page .bind .wrapper .textBox .listItem {
            width: 100%;
            margin-top: 1em;
            margin-bottom: 1em;
            padding-right: 1em; }
            body .page .bind .wrapper .textBox .listItem ul {
              list-style: none; }
              body .page .bind .wrapper .textBox .listItem ul li {
                line-height: 1.4em;
                font-size: 0.9em; }
          body .page .bind .wrapper .textBox .date {
            color: #4d4d4d;
            font-size: 0.8em;
            font-weight: 700; }
          body .page .bind .wrapper .textBox form {
            cursor: unset; }
            body .page .bind .wrapper .textBox form .input {
              outline: none;
              width: 400px;
              max-width: 100%;
              border: 0px solid;
              border-bottom: 2px solid darkgray;
              padding-bottom: 8px;
              padding-top: 8px;
              margin-top: 5px;
              margin-bottom: 20px;
              display: block;
              background: transparent; }
            body .page .bind .wrapper .textBox form textarea {
              outline: none;
              width: 100%;
              height: 8em;
              border: 0px solid;
              border-bottom: 2px solid darkgray;
              padding-bottom: 8px;
              padding-top: 8px;
              margin-top: 5px;
              margin-bottom: 20px;
              display: block;
              background: transparent; }
        body .page .bind .wrapper .folioBox {
          position: absolute;
          transform: translateY(-50%);
          top: 50%;
          left: 50%;
          width: 50%;
          padding-left: 10px; }
          body .page .bind .wrapper .folioBox .workSpan {
            display: block;
            text-align: center;
            color: #4d4d4d;
            font-size: 1.5em;
            margin-bottom: 20px; }
          body .page .bind .wrapper .folioBox .logoWrapper {
            width: 32.5%;
            display: inline-block;
            position: relative;
            height: 170px; }
            body .page .bind .wrapper .folioBox .logoWrapper img {
              width: 150px;
              transition: 0.5s;
              margin: auto;
              display: block;
              margin-bottom: 10px;
              margin-top: 10px;
              position: absolute;
              top: 0;
              bottom: 0;
              margin: auto;
              left: 0;
              right: 0;
              max-width: 80%; }
            body .page .bind .wrapper .folioBox .logoWrapper .imgHover {
              opacity: 0;
              transition: 0.5s; }
              body .page .bind .wrapper .folioBox .logoWrapper .imgHover:hover {
                opacity: 1;
                transition: 0.5s; }
        body .page .bind .wrapper .graphicBox {
          position: absolute;
          transform: translateY(-50%);
          top: 50%;
          left: 50%;
          width: 50%;
          padding-left: 50px; }
          body .page .bind .wrapper .graphicBox img {
            position: absolute;
            top: 0px;
            bottom: 0px;
            margin: auto;
            transition: 0.5s;
            display: block; }
          body .page .bind .wrapper .graphicBox:hover #imgTrans {
            transform: translateX(-0.5%);
            transition: 0.5s; }
          body .page .bind .wrapper .graphicBox:hover #imgTran {
            transform: translateX(0.5%);
            transition: 0.5s; }

@media screen and (max-width: 1500px) {
  body .page .bind {
    padding-left: 5%;
    padding-right: 5%; } }
@media screen and (max-width: 1080px) {
  body .page .bind {
    padding-left: 5%;
    padding-right: 5%; }
    body .page .bind .wrapper .textBox {
      width: 100%; }
    body .page .bind .wrapper .graphicBox, body .page .bind .wrapper .listBox {
      display: none; } }

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