/* line 8, ../../sass/activities/modal-cards.scss */
.cards-modal-select {
  display: flex;
  flex-direction: column;
  background-color: #F0F5F7;
  font-family: Calibri, Roboto, san-serif;
  color: #5A6167;
}
/* line 16, ../../sass/activities/modal-cards.scss */
.cards-modal-select > .card, .cards-modal-select > .card-option, .cards-modal-select > .card-modal {
  display: flex;
  flex-direction: column;
  min-width: 0;
  word-wrap: break-word;
  text-align: center;
  border: .5em solid #fff;
  border-radius: .7em;
  box-shadow: 0 0.2em 1rem rgba(0, 0, 0, 0.1);
  cursor: pointer;
  max-width: 248px;
  max-height: 383px;
}
/* line 30, ../../sass/activities/modal-cards.scss */
.cards-modal-select > .card:first-child, .cards-modal-select > .card-option:first-child, .cards-modal-select > .card-modal:first-child {
  margin-left: 0;
}
/* line 34, ../../sass/activities/modal-cards.scss */
.cards-modal-select > .card:last-child, .cards-modal-select > .card-option:last-child, .cards-modal-select > .card-modal:last-child {
  margin-right: 0;
}
/* line 43, ../../sass/activities/modal-cards.scss */
.cards-modal-select > .card-option {
  border: none;
}
/* line 47, ../../sass/activities/modal-cards.scss */
.cards-modal-select > .card-modal {
  flex-direction: column;
  border: 1px solid transparent;
  transition: 200ms ease-in;
  position: relative;
  padding: .5em;
  height: 27vw;
}
/* line 55, ../../sass/activities/modal-cards.scss */
.cards-modal-select > .card-modal-selected {
  height: auto !important;
  flex: 1;
}
/* line 59, ../../sass/activities/modal-cards.scss */
.cards-modal-select > .card-modal-selected:first-child {
  margin-left: 0 !important;
}
/* line 63, ../../sass/activities/modal-cards.scss */
.cards-modal-select > .card-modal-selected:last-child {
  margin-right: 0 !important;
}
/* line 67, ../../sass/activities/modal-cards.scss */
.cards-modal-select > .card-modal-selected img {
  background-color: #fff !important;
}
/* line 72, ../../sass/activities/modal-cards.scss */
.cards-modal-select > .card-modal:before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  border: 1px solid #D6DEE3;
  width: 20px;
  height: 20px;
  width: 86%;
  height: 89%;
  border-radius: .7em;
}
/* line 86, ../../sass/activities/modal-cards.scss */
.cards-modal-select > .card-modal p {
  align-self: center;
  width: 75%;
  margin-bottom: 0;
  margin-top: auto;
}
/* line 93, ../../sass/activities/modal-cards.scss */
.cards-modal-select > .card-modal img {
  width: 2vw;
  height: 2vw;
  min-height: 37px;
  min-width: 37px;
  max-width: 40px;
  max-height: 40px;
  padding: 0.8em;
  z-index: 5;
  background-color: #F0F5F7;
  padding: .5em;
  transition: 200ms ease-in;
}
/* line 106, ../../sass/activities/modal-cards.scss */
.cards-modal-select > .card-modal img:last-child {
  align-self: flex-end;
  margin-left: auto;
  margin-top: auto;
}
/* line 115, ../../sass/activities/modal-cards.scss */
.cards-modal-select > .card-modal:hover {
  background-color: #fff;
  border: 1px solid #7AD1ED;
}
/* line 119, ../../sass/activities/modal-cards.scss */
.cards-modal-select > .card-modal:hover img {
  background-color: #fff;
}
/* line 123, ../../sass/activities/modal-cards.scss */
.cards-modal-select > .card-modal:hover p {
  color: #000;
}

/* line 131, ../../sass/activities/modal-cards.scss */
#cards-modal {
  font-family: Calibri, Roboto, san-serif;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 95%;
  max-width: 1385px;
  margin: 0 !important;
  border-radius: .6em;
  padding: .5em 1.2em;
  box-shadow: none;
}
/* line 143, ../../sass/activities/modal-cards.scss */
#cards-modal > .modal-header {
  display: flex;
  flex-direction: column;
  padding: 1em;
  border-bottom: none;
  background-color: #fff;
  color: #5A6167;
  border-radius: .6em;
}
/* line 152, ../../sass/activities/modal-cards.scss */
#cards-modal > .modal-header .btn-close {
  border-radius: 50%;
  right: 0;
  background-color: #17697F;
  color: #fff;
  outline: 0;
}
/* line 160, ../../sass/activities/modal-cards.scss */
#cards-modal > .modal-header .btn-close:before {
  padding: 0em 0.5em 0.25em;
  color: #fff;
  opacity: 1;
}
/* line 167, ../../sass/activities/modal-cards.scss */
#cards-modal > .modal-header p {
  margin-bottom: 0;
}
/* line 170, ../../sass/activities/modal-cards.scss */
#cards-modal > .modal-header p:first-child {
  font-size: 1.4em;
  font-weight: bold;
}
/* line 177, ../../sass/activities/modal-cards.scss */
#cards-modal > .modal-body {
  max-height: 100%;
}
/* line 180, ../../sass/activities/modal-cards.scss */
#cards-modal > .modal-body .cards-modal-select {
  background-color: #fff;
}
/* line 183, ../../sass/activities/modal-cards.scss */
#cards-modal > .modal-body .cards-modal-select .card-modal {
  box-shadow: none;
}

/* line 192, ../../sass/activities/modal-cards.scss */
.module-progress {
  display: flex;
  justify-content: flex-end;
  padding: 2em 0;
}
/* line 197, ../../sass/activities/modal-cards.scss */
.module-progress > .module-back, .module-progress .module-next {
  padding: 0.5em 1.8em;
  background-color: #D6DEE3;
  font-family: inherit;
  font-size: 1.15em;
  color: #5A6167;
  border: none;
  outline: 0;
  border-radius: 3em;
}
/* line 208, ../../sass/activities/modal-cards.scss */
.module-progress > .module-next {
  margin-left: .7em;
  color: #fff;
  background-color: #17697F;
}

@media (min-width: 768px) {
  /* line 218, ../../sass/activities/modal-cards.scss */
  .cards-modal-select {
    flex-direction: row;
  }
  /* line 221, ../../sass/activities/modal-cards.scss */
  .cards-modal-select > .card, .cards-modal-select > .card-option, .cards-modal-select > .card-modal {
    flex-basis: 50%;
    margin: 0 .5em;
  }
}
@media (min-width: 1500px) {
  /* line 229, ../../sass/activities/modal-cards.scss */
  .cards-modal-select {
    flex-direction: row;
    flex-wrap: wrap;
  }
  /* line 233, ../../sass/activities/modal-cards.scss */
  .cards-modal-select > .card, .cards-modal-select > .card-option, .cards-modal-select > .card-modal {
    flex: 1;
    margin: 1em;
  }
  /* line 238, ../../sass/activities/modal-cards.scss */
  .cards-modal-select > .card-modal {
    margin: .4em;
    background-color: #fff;
  }
  /* line 243, ../../sass/activities/modal-cards.scss */
  .cards-modal-select > .card-modal-selected {
    margin: 1em !important;
  }
}
/* line 261, ../../sass/activities/modal-cards.scss */
.cards-modal .text {
  margin-left: 2vw;
  font-weight: 500;
  font-size: 1.3em;
}
/* line 267, ../../sass/activities/modal-cards.scss */
.cards-modal .title-info {
  margin: 2vw 0 0 2vw !important;
}

/* line 272, ../../sass/activities/modal-cards.scss */
.cards-modal-container {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  padding: 0 2vw 0 2vw;
  background-color: #fff;
  font-family: Calibri, Roboto, san-serif;
  transition: 200ms ease-in-out;
}
/* line 281, ../../sass/activities/modal-cards.scss */
.cards-modal-container-active {
  background-color: #fff;
}
/* line 286, ../../sass/activities/modal-cards.scss */
.cards-modal-container > .playing-card {
  box-sizing: border-box;
  position: relative;
  flex-basis: calc(50% - 1em);
  border-radius: 1em;
  overflow: hidden;
  max-width: 300px;
  cursor: pointer;
  margin: .5em;
  border: 1px solid #D6DEE3;
  box-shadow: rgba(9, 30, 66, 0.25) 0px 4px 8px -2px, rgba(9, 30, 66, 0.31) 0px 0px 1px;
}
/* line 298, ../../sass/activities/modal-cards.scss */
.cards-modal-container > .playing-card__result {
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  font-family: inherit;
  max-width: 250px;
  height: 385px;
  background-size: 100% 100%;
  background-repeat: no-repeat;
  border-radius: 1.4em !important;
  box-shadow: 0 0 0.5em 0 rgba(0, 0, 0, 0.4);
}
/* line 311, ../../sass/activities/modal-cards.scss */
.cards-modal-container > .playing-card__result .result__text {
  width: 80%;
}
/* line 315, ../../sass/activities/modal-cards.scss */
.cards-modal-container > .playing-card__result img {
  display: none !important;
}
/* line 321, ../../sass/activities/modal-cards.scss */
.cards-modal-container > .playing-card-init > .card-content {
  display: none;
}
/* line 327, ../../sass/activities/modal-cards.scss */
.cards-modal-container > .playing-card-selected > .card-content {
  background-color: #fff !important;
  transition: 200ms ease-in-out;
}
/* line 331, ../../sass/activities/modal-cards.scss */
.cards-modal-container > .playing-card-selected > .card-content img {
  background-color: #fff !important;
}
/* line 337, ../../sass/activities/modal-cards.scss */
.cards-modal-container > .playing-card-modal {
  box-shadow: none;
}
/* line 341, ../../sass/activities/modal-cards.scss */
.cards-modal-container > .playing-card-selected, .cards-modal-container > .playing-card-modal {
  background-color: #F0F5F7;
  transition: 200ms ease-in-out;
}
/* line 345, ../../sass/activities/modal-cards.scss */
.cards-modal-container > .playing-card-selected:hover, .cards-modal-container > .playing-card-modal:hover {
  border: 1px solid #7AD1ED;
  background-color: #fff;
}
/* line 350, ../../sass/activities/modal-cards.scss */
.cards-modal-container > .playing-card-selected > .card-content, .cards-modal-container > .playing-card-modal > .card-content {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  padding: .8em;
  text-align: center;
  background-color: #f3f4fe;
  transition: 200ms ease-in-out;
}
/* line 364, ../../sass/activities/modal-cards.scss */
.cards-modal-container > .playing-card-selected > .card-content:before, .cards-modal-container > .playing-card-modal > .card-content:before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 90%;
  height: 91%;
  border: 1px solid #D6DEE3;
  z-index: 1;
  border-radius: .7em;
  background-color: transparent;
}
/* line 378, ../../sass/activities/modal-cards.scss */
.cards-modal-container > .playing-card-selected > .card-content:hover, .cards-modal-container > .playing-card-modal > .card-content:hover {
  background-color: #fff;
}
/* line 382, ../../sass/activities/modal-cards.scss */
.cards-modal-container > .playing-card-selected > .card-content:hover img, .cards-modal-container > .playing-card-modal > .card-content:hover img {
  background-color: #fff;
}
/* line 387, ../../sass/activities/modal-cards.scss */
.cards-modal-container > .playing-card-selected > .card-content img, .cards-modal-container > .playing-card-modal > .card-content img {
  width: 1.8em;
  height: 1.8em;
  z-index: 2;
  background-color: #F0F5F7;
}
/* line 393, ../../sass/activities/modal-cards.scss */
.cards-modal-container > .playing-card-selected > .card-content img:last-child, .cards-modal-container > .playing-card-modal > .card-content img:last-child {
  margin-left: auto;
}
/* line 398, ../../sass/activities/modal-cards.scss */
.cards-modal-container > .playing-card-selected > .card-content p, .cards-modal-container > .playing-card-modal > .card-content p {
  align-self: center;
  width: 80%;
  font-size: 1em;
}

@media (min-width: 900px) {
  /* line 409, ../../sass/activities/modal-cards.scss */
  .cards-modal-container > .playing-card-modal > .card-content p {
    font-size: 1em;
  }
}
@media (max-width: 600px) {
  /* line 415, ../../sass/activities/modal-cards.scss */
  .cards-modal-container {
    padding: 0;
  }
  /* line 418, ../../sass/activities/modal-cards.scss */
  .cards-modal-container .playing-card {
    min-height: 200px;
  }

  /* line 423, ../../sass/activities/modal-cards.scss */
  .modal-body {
    padding: 0 !important;
  }
}
/* line 428, ../../sass/activities/modal-cards.scss */
.card-result-wrapper {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 1em;
  min-width: 250px;
}
/* line 436, ../../sass/activities/modal-cards.scss */
.card-result-wrapper .playing-card__result {
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  font-family: inherit;
  max-width: 250px;
  height: 385px;
  margin-bottom: 1em;
  background-size: 100% 100%;
  background-repeat: no-repeat;
  border-radius: 1.4em !important;
  box-shadow: 0 0 0.5em 0 rgba(0, 0, 0, 0.4);
}
/* line 450, ../../sass/activities/modal-cards.scss */
.card-result-wrapper .playing-card__result .result__text {
  width: 80%;
  font-size: 1.2em;
}
/* line 455, ../../sass/activities/modal-cards.scss */
.card-result-wrapper .playing-card__result img {
  display: none !important;
}
/* line 462, ../../sass/activities/modal-cards.scss */
.card-result-wrapper .result__icon--correct:before {
  color: #B7CB34;
  font-size: 2.6em;
  margin-right: 0 !important;
}
/* line 470, ../../sass/activities/modal-cards.scss */
.card-result-wrapper .result__icon--incorrect:before {
  color: #CD4995;
  font-size: 2.6em;
  margin-right: 0 !important;
}

/* line 480, ../../sass/activities/modal-cards.scss */
.card-result-table {
  padding: 2em;
  background-color: #fff;
}
/* line 484, ../../sass/activities/modal-cards.scss */
.card-result-table__container {
  border-top-left-radius: 1em;
  border-top-right-radius: 1em;
  overflow: hidden;
}
/* line 490, ../../sass/activities/modal-cards.scss */
.card-result-table__header {
  width: 100%;
  background-color: #17697F;
  color: #fff;
  font-weight: 500;
  font-family: inherit;
  margin: 0 !important;
  text-transform: capitalize !important;
  padding: 0.8em 1.4em !important;
}
/* line 501, ../../sass/activities/modal-cards.scss */
.card-result-table__list {
  margin-left: 0 !important;
  border-bottom: 1px solid #D6DEE3;
  border-left: 1px solid #D6DEE3;
  border-right: 1px solid #D6DEE3;
  border-bottom-left-radius: 1em;
  border-bottom-right-radius: 1em;
}
/* line 510, ../../sass/activities/modal-cards.scss */
.card-result-table__item {
  font-family: inherit;
  padding: 1.4em;
  border-top: 1px solid #D6DEE3;
  margin-bottom: 0 !important;
  font-size: 1.2em;
}
/* line 518, ../../sass/activities/modal-cards.scss */
.card-result-table__item:first-child {
  border-top: none;
}

/* line 524, ../../sass/activities/modal-cards.scss */
.cards-answers {
  background-color: #DCE0E4;
  padding: calc(2em + 2vw) 2vw calc(2em + 2vw) 2vw;
}

/* line 529, ../../sass/activities/modal-cards.scss */
.section-heading--rel {
  font-family: Calibri, Roboto, sans-serif;
  display: inline-block;
  top: 1em;
  transform: translateY(50%);
  padding: .3em .7em;
  margin-left: 2vw;
  background-color: #357EB0;
  color: #fff;
  font-weight: 700;
  font-size: 1.6em;
  border-radius: 40px;
  text-transform: none;
}

@media (min-width: 768px) {
  /* line 550, ../../sass/activities/modal-cards.scss */
  .cards-modal-container > .playing-card {
    flex-basis: calc(33% - 1em);
  }
}
@media (min-width: 1000px) {
  /* line 558, ../../sass/activities/modal-cards.scss */
  .cards-modal-container {
    flex-wrap: wrap;
    justify-content: space-between;
    flex-direction: row;
  }
  /* line 564, ../../sass/activities/modal-cards.scss */
  .cards-modal-container > .playing-card {
    flex-basis: calc(20% - 1em);
    max-width: 250px;
    position: relative;
  }
}
/* line 574, ../../sass/activities/modal-cards.scss */
#expand_modal {
  height: auto;
  font-family: Calibri, Roboto, san-serif;
  top: 50% !important;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 95%;
  max-width: 1385px;
  margin: 0 !important;
  border-radius: .6em;
  padding: .5em 1.2em;
  box-shadow: none;
  height: 93vh;
  overflow-y: auto;
}
/* line 590, ../../sass/activities/modal-cards.scss */
#expand_modal > .modal-header {
  display: flex;
  flex-direction: column;
  padding: 1em;
  border-bottom: none;
  background-color: #fff;
  color: #5A6167;
  border-radius: .6em;
}
/* line 599, ../../sass/activities/modal-cards.scss */
#expand_modal > .modal-header .btn-close {
  border-radius: 50%;
  right: 0;
  background-color: #17697F;
  color: #fff;
  outline: 0;
}
/* line 607, ../../sass/activities/modal-cards.scss */
#expand_modal > .modal-header .btn-close:before {
  padding: 0em 0.5em 0.25em;
  color: #fff;
  opacity: 1;
}
/* line 614, ../../sass/activities/modal-cards.scss */
#expand_modal > .modal-header p {
  margin-bottom: 0;
}
/* line 617, ../../sass/activities/modal-cards.scss */
#expand_modal > .modal-header p:first-child {
  font-size: 1.4em;
  font-weight: bold;
  font-size: 1.2em !important;
  color: #000;
}
/* line 626, ../../sass/activities/modal-cards.scss */
#expand_modal > .modal-body {
  max-height: 100%;
}
/* line 629, ../../sass/activities/modal-cards.scss */
#expand_modal > .modal-body .cards-modal-select {
  background-color: #fff;
}
/* line 632, ../../sass/activities/modal-cards.scss */
#expand_modal > .modal-body .cards-modal-select .card-modal {
  box-shadow: none;
}