:root {
  --white-color: rgba(255, 255, 255, 1);
  --white-light-color: rgba(255, 255, 255, .5);
  --black-color: rgba(0, 0, 0, 1);
  --black-light-color: rgba(0, 0, 0, .5);
  --light-color: rgba(139, 245, 255, 1);
  --light-light-color: rgba(139, 245, 255, .5);
  --primary-color: rgba(79, 194, 247, 1);
  --primary-light-color: rgba(79, 194, 247, .5);
  --dark-color: rgba(0, 146, 196, 1);
  --dark-light-color: rgba(0, 146, 196, .5);
  --image-header-url: url(../../img/backgroundHeader/bg-header-1.jpg);
  --image-body-url: url(../../img/backgroundBody/bg-body-1.jpg);
  --image-footer-url: url(../../img/backgroundFooter/bg-footer-1.png);
  --background-header: var(--primary-color, rgba(79, 194, 247, 1)) var(--image-header-url) no-repeat fixed center;
  --background-body: var(--primary-color, rgba(79, 194, 247, 1)) var(--image-body-url) repeat fixed; }

@font-face {
  font-family: Mistral;
  src: url("../../webfontkit/mistral.woff"); }
@font-face {
  font-family: "Roboto Light";
  src: url("../../webfontkit/Roboto-Light.ttf");
  src: url("../../webfontkit/roboto-light-webfont.woff");
  src: url("../../webfontkit/roboto-light-webfont.woff2"); }
@font-face {
  font-family: "Roboto Medium";
  src: url("../../webfontkit/Roboto-Medium.ttf");
  src: url("../../webfontkit/roboto-medium-webfont.woff");
  src: url("../../webfontkit/roboto-medium-webfont.woff2"); }
html body {
  margin: 0 auto;
  background-color: #0c5460;
  max-width: 992px; }
  html body aside {
    position: fixed;
    bottom: 0;
    z-index: 3; }
    html body aside div.boxChatAndTheme #boxChat {
      background-color: var(--white-color, white);
      border: 1px solid var(--white-color, white);
      margin-left: 1.1em;
      margin-bottom: .5em;
      width: 19em; }
      html body aside div.boxChatAndTheme #boxChat div.card-header, html body aside div.boxChatAndTheme #boxChat div.card-footer {
        background-color: var(--dark-color, #0092c4); }
      html body aside div.boxChatAndTheme #boxChat div.card-header {
        color: var(--white-color, white); }
      html body aside div.boxChatAndTheme #boxChat div.card-body div.divGuessMessageTime {
        margin-top: 5%; }
        html body aside div.boxChatAndTheme #boxChat div.card-body div.divGuessMessageTime div.divGuessMessage {
          padding: 2% 5%;
          background-color: var(--primary-color, #4fc2f7);
          border: 1px solid var(--dark-color, #0092c4);
          color: var(--white-color, white); }
        html body aside div.boxChatAndTheme #boxChat div.card-body div.divGuessMessageTime div.divGuessTime {
          margin-left: 4%; }
      html body aside div.boxChatAndTheme #boxChat div.card-body div.divOwnerMessageTime {
        margin-top: 5%; }
        html body aside div.boxChatAndTheme #boxChat div.card-body div.divOwnerMessageTime div.divOwnerMessage {
          padding: 2% 5%;
          background-color: transparent;
          border: 1px solid var(--dark-color, #0092c4);
          color: var(--black-color, black); }
        html body aside div.boxChatAndTheme #boxChat div.card-body div.divOwnerMessageTime div.divOwnerTime {
          margin-right: 4%; }
      html body aside div.boxChatAndTheme #boxChat div.card-footer > form {
        border-radius: 10px;
        background-color: var(--white-color, white); }
        html body aside div.boxChatAndTheme #boxChat div.card-footer > form button {
          color: var(--dark-color, #0092c4); }
    html body aside div.boxChatAndTheme #boxTheme {
      background-color: var(--white-color, white);
      margin-left: 5em;
      margin-bottom: .5em;
      max-width: 57%;
      border: 1px solid var(--white-color, white);
      text-align: center;
      padding-top: .8em;
      padding-bottom: .8em; }
      html body aside div.boxChatAndTheme #boxTheme h5 {
        font-size: large; }
      html body aside div.boxChatAndTheme #boxTheme .boxColors > div {
        width: 25px;
        height: 25px;
        margin-left: 3%;
        margin-top: 5%;
        border: 1px solid var(--dark-color, #0092c4);
        cursor: pointer; }
      html body aside div.boxChatAndTheme #boxTheme .boxColors > div:nth-child(1) {
        background-color: #0092c4; }
      html body aside div.boxChatAndTheme #boxTheme .boxColors > div:nth-child(2) {
        background-color: black; }
      html body aside div.boxChatAndTheme #boxTheme .boxColors > div:nth-child(3) {
        background-color: #bb002a; }
      html body aside div.boxChatAndTheme #boxTheme .boxColors > div:nth-child(4) {
        background-color: rgba(201, 168, 51, 0.5); }
      html body aside div.boxChatAndTheme #boxTheme .boxColors > div:nth-child(5) {
        background-color: rgba(146, 70, 0, 0.5); }
      html body aside div.boxChatAndTheme #boxTheme .boxColors > div:nth-child(6) {
        background-color: rgba(70, 160, 51, 0.5); }
      html body aside div.boxChatAndTheme #boxTheme .boxColors > div:nth-child(7) {
        background-color: white; }
      html body aside div.boxChatAndTheme #boxTheme .boxColors > div:nth-child(8) {
        background-color: rgba(101, 0, 154, 0.5); }
    html body aside div.boxIcons div.boxIcon {
      margin-left: 5%; }
      html body aside div.boxIcons div.boxIcon button {
        width: 45px;
        height: 45px;
        background-color: var(--white-color, white);
        color: var(--dark-color, #0092c4); }
        html body aside div.boxIcons div.boxIcon button .fa-2x {
          font-size: 1.6em; }
      html body aside div.boxIcons div.boxIcon button:hover, html body aside div.boxIcons div.boxIcon button.active {
        background-color: var(--dark-color, #0092c4);
        color: var(--white-color, white); }
    html body aside div.boxIcons div.boxIcon:last-child {
      margin-left: 1.5rem; }
  html body div.modal {
    font-family: "Roboto Light", "Times New Roman", Times, serif; }
    html body div.modal div.modal-dialog div.modal-content div.modal-header {
      background-color: var(--dark-light-color);
      color: var(--white-color, white); }
    html body div.modal div.modal-dialog div.modal-content div.modal-footer {
      border-color: var(--black-color, black); }
      html body div.modal div.modal-dialog div.modal-content div.modal-footer button {
        background-color: var(--dark-light-color);
        color: var(--white-color, white); }
      html body div.modal div.modal-dialog div.modal-content div.modal-footer button:hover {
        border: 1px solid var(--white-color, white); }
  html body #mainDivPageBody {
    background: var(--background-body);
    min-height: 100vh; }
    html body #mainDivPageBody header {
      height: 150px;
      background: var(--background-header); }
      html body #mainDivPageBody header p.quote {
        font-family: Mistral, "Times New Roman", Times, serif;
        font-style: normal;
        font-weight: normal;
        font-size: small;
        line-height: 2rem;
        /* or 135% */
        text-align: center;
        letter-spacing: 1.25px;
        color: var(--white-color, white);
        text-shadow: 0 4px 4px rgba(0, 0, 0, 0.25); }
        html body #mainDivPageBody header p.quote span:nth-child(2) {
          color: var(--black-light-color); }
      html body #mainDivPageBody header div:nth-child(2) div.imgProfile {
        z-index: 1;
        margin-top: -1%; }
      html body #mainDivPageBody header div:nth-child(2) form {
        margin-top: -2.5%;
        max-height: max-content; }
        html body #mainDivPageBody header div:nth-child(2) form button {
          background-color: var(--dark-color, #0092c4); }
        html body #mainDivPageBody header div:nth-child(2) form button:hover, html body #mainDivPageBody header div:nth-child(2) form button:visited, html body #mainDivPageBody header div:nth-child(2) form button:focus {
          border: 1px solid var(--white-color, white); }
    html body #mainDivPageBody nav.mainLargeMenu #SVGRootLargeMenu .groupMenuItems:hover path.boxMenuItem, html body #mainDivPageBody nav.mainLargeMenu #SVGRootLargeMenu a.active > .groupMenuItems path.boxMenuItem, html body #mainDivPageBody nav.mainLargeMenu #SVGRootSmallMenu .groupMenuItems:hover path.boxMenuItem, html body #mainDivPageBody nav.mainLargeMenu #SVGRootSmallMenu a.active > .groupMenuItems path.boxMenuItem {
      fill: var(--dark-color, #0092c4); }
    html body #mainDivPageBody nav.mainLargeMenu #SVGRootLargeMenu .groupMenuItems:hover text.textMenuItem, html body #mainDivPageBody nav.mainLargeMenu #SVGRootLargeMenu a.active > .groupMenuItems text.textMenuItem, html body #mainDivPageBody nav.mainLargeMenu #SVGRootSmallMenu .groupMenuItems:hover text.textMenuItem, html body #mainDivPageBody nav.mainLargeMenu #SVGRootSmallMenu a.active > .groupMenuItems text.textMenuItem {
      fill: var(--white-color, white); }
    html body #mainDivPageBody nav.mainLargeMenu #SVGRootLargeMenu path.boxMenuItem, html body #mainDivPageBody nav.mainLargeMenu #SVGRootSmallMenu path.boxMenuItem {
      fill: var(--light-color); }
    html body #mainDivPageBody nav.mainLargeMenu #SVGRootLargeMenu path.boxMenuLeft, html body #mainDivPageBody nav.mainLargeMenu #SVGRootSmallMenu path.boxMenuLeft {
      fill: none;
      stroke: var(--black-color, black);
      stroke-width: 1px;
      stroke-linecap: butt;
      stroke-linejoin: miter;
      stroke-opacity: 1; }
    html body #mainDivPageBody nav.mainLargeMenu #SVGRootLargeMenu text.textMenuItem, html body #mainDivPageBody nav.mainLargeMenu #SVGRootSmallMenu text.textMenuItem {
      font-family: "Roboto Medium", "Times New Roman", Times, serif;
      font-style: normal;
      font-weight: 500;
      font-variant: normal;
      font-stretch: normal;
      font-size: 35px;
      line-height: 1.25;
      font-variant-ligatures: normal;
      font-variant-caps: normal;
      font-variant-numeric: normal;
      font-feature-settings: normal;
      text-align: start;
      letter-spacing: 1.25px;
      word-spacing: 0;
      writing-mode: lr-tb;
      text-anchor: start;
      fill: var(--dark-color, #0092c4);
      fill-opacity: 1;
      stroke: none;
      stroke-width: 1; }
    html body #mainDivPageBody nav.mainLargeMenu #SVGRootFakeArc, html body #mainDivPageBody nav.mainLargeMenu #SVGRootLargeMenu {
      display: none; }
    html body #mainDivPageBody nav.mainLargeMenu #SVGRootSmallMenu {
      float: right;
      max-width: 85%;
      background-color: var(--white-color, white); }
    html body #mainDivPageBody main {
      clear: both;
      padding: 10% 5% 5% 5%; }
    html body #mainDivPageBody footer {
      margin-top: 5%; }
      html body #mainDivPageBody footer .imgFooter {
        content: var(--image-footer-url);
        max-width: 100%;
        height: auto; }
      html body #mainDivPageBody footer div {
        margin-top: -10%; }
        html body #mainDivPageBody footer div p {
          font-family: "Roboto Medium", "Times New Roman", Times, serif;
          font-style: normal;
          font-weight: 500;
          font-size: xx-small;
          letter-spacing: 1.25px;
          color: var(--white-color, white); }

@media (min-width: 576px) {
  html body #mainDivPageBody header {
    height: 250px; }
    html body #mainDivPageBody header p.quote {
      font-size: medium; }
    html body #mainDivPageBody header div:nth-child(2) div.imgProfile {
      margin-top: 0; }
  html body #mainDivPageBody footer div p {
    font-size: x-small; } }
@media (min-width: 768px) {
  html body #mainDivPageBody header p.quote {
    font-size: x-large; }
  html body #mainDivPageBody header div:nth-child(2) div.imgProfile {
    margin-top: -2.5%;
    margin-left: 42.5%; }
  html body #mainDivPageBody nav.mainLargeMenu #SVGRootLargeMenu {
    display: inline-block; }
  html body #mainDivPageBody nav.mainLargeMenu #SVGRootFakeArc {
    display: inline-block;
    margin-top: -2.5%;
    fill: var(--white-color, white);
    stroke: var(--white-color, white);
    stroke-width: 1px;
    stroke-linecap: butt;
    stroke-linejoin: miter;
    stroke-opacity: 1; }
  html body #mainDivPageBody nav.mainLargeMenu #SVGRootSmallMenu {
    display: none; }
  html body #mainDivPageBody main {
    padding: 0 3%; }
  html body #mainDivPageBody footer div p {
    font-size: small; } }

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