/*
* strip-unit - Unit stripper [10px = 10]
* param - $num : the value with a unit suffix, E.g: 10px
* return - $result : the value without any suffix, E.g: 10
* E.g. strip-unit(100px) = 100
*/
/*
* pxToEM - Convert PX value to EM value [100px = 6.25em]
* param - $target : the value in px without 'px' suffix, E.g: 100
* return - $result : the value in em with 'em' suffix, E.g: 6.25em
* E.g. pxToEM(100) = 6.25em
*/
/*
* u - PX and REM constrictor
* param - $property : css property, E.g: padding
* param - $values... : list of values for the property, note values are multiplied by $pixelBase, E.g.: 10, 20, 30, 40
* return - $result : the css property with values applied in pixels
* E.g. @include u(padding, 10, 20, 30, 40) = padding: 100px, 200px, 300px, 400px;
*/
/*! _form */
.portal-content .c2form_zero {
  border: 1px solid #C7CBFF;
  padding: 2rem; }
  .portal-content .c2form_zero .c2form_row:nth-child(1), .portal-content .c2form_zero .c2form_row:nth-child(2) {
    width: 50%; }
  .portal-content .c2form_zero .c2form_row textarea {
    width: 100%;
    height: 70px; }
  .portal-content .c2form_zero .c2form_row input,
  .portal-content .c2form_zero .c2form_row textarea,
  .portal-content .c2form_zero .c2form_row select {
    border-radius: 0 !important;
    border-color: #BDBDBD !important;
    border-width: 2px; }
    .portal-content .c2form_zero .c2form_row input:focus,
    .portal-content .c2form_zero .c2form_row textarea:focus,
    .portal-content .c2form_zero .c2form_row select:focus {
      outline: 0 !important;
      border: 2px solid #4B54C7 !important;
      /* Change to Primary/Secondary System Color */
      box-shadow: 0 0 5px rgba(4, 16, 159, 0.5) !important;
      /* Change to Primary/Secondary System Color */
      transition: box-shadow 0.5s, border-color 0.25s ease-in-out; }
  .portal-content .c2form_zero .c2form_buttons {
    text-align: left;
    margin-top: 1rem; }
    .portal-content .c2form_zero .c2form_buttons button:not(.c2btncancel) {
      border-radius: 2px;
      text-transform: uppercase;
      font-weight: 700;
      box-shadow: #04109f 0px 1px 2px;
      background-color: #4B54C7;
      letter-spacing: 0.5px;
      color: #fefefe !important;
      border: unset !important; }
    .portal-content .c2form_zero .c2form_buttons button.c2btncancel {
      border-color: #4B54C7;
      color: #4B54C7;
      text-transform: uppercase;
      border-radius: 2px;
      box-shadow: #04109f 0px 1px 2px;
      font-weight: 700; }
      .portal-content .c2form_zero .c2form_buttons button.c2btncancel:hover {
        background-color: #4B54C7;
        color: #fff; }

.evaluationbuttons {
  float: unset !important;
  display: flex;
  flex-wrap: wrap;
  column-gap: 59px;
  row-gap: 3.5rem; }
  @media (max-width: 1400px) {
    .evaluationbuttons {
      column-gap: 51px; } }
  @media (max-width: 1200px) {
    .evaluationbuttons {
      column-gap: 43px; } }
  .evaluationbuttons a:not(.c2btnbacktolisting):not(._primary):not(._unregistered):not(._sub):not(.back) {
    width: 30.33% !important;
    height: 223px !important;
    margin: 0 !important;
    max-width: unset !important;
    background: #4b54c7;
    background: linear-gradient(128deg, #4b54c7 0%, #8842bc 100%);
    display: flex !important;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    position: relative;
    font-size: 1.3rem; }
    @media (max-width: 992px) {
      .evaluationbuttons a:not(.c2btnbacktolisting):not(._primary):not(._unregistered):not(._sub):not(.back) {
        width: 47% !important; } }
    @media (max-width: 768px) {
      .evaluationbuttons a:not(.c2btnbacktolisting):not(._primary):not(._unregistered):not(._sub):not(.back) {
        width: 100% !important; } }
    @media (max-width: 576px) {
      .evaluationbuttons a:not(.c2btnbacktolisting):not(._primary):not(._unregistered):not(._sub):not(.back) {
        width: 80% !important;
        margin: 0 auto !important; } }
    .evaluationbuttons a:not(.c2btnbacktolisting):not(._primary):not(._unregistered):not(._sub):not(.back) h2 {
      font-size: 22px;
      text-align: center; }
    .evaluationbuttons a:not(.c2btnbacktolisting):not(._primary):not(._unregistered):not(._sub):not(.back) .material-icons {
      font-size: 80px; }
    .evaluationbuttons a:not(.c2btnbacktolisting):not(._primary):not(._unregistered):not(._sub):not(.back)._incomplete:after {
      content: "";
      position: absolute;
      top: -20px;
      right: -22px;
      width: 55px;
      height: 55px;
      background-image: url("/p/1/Warning%20Icon.svg");
      background-repeat: no-repeat;
      background-size: contain; }
  .evaluationbuttons ._mulbutton {
    width: 30.33%; }

.links {
  text-align: left;
  margin-top: 1rem;
  margin-bottom: 1rem;
  /*button:not(.c2btncancel) {
				border-radius: 2px;
    			text-transform: uppercase;
    			font-weight: 700;
   	 			box-shadow: #814c07 0px 1px 2px;
    			background-color: #F39314;
    			letter-spacing: 0.5px;
    			color: #fefefe !important;
				border: unset!important;
			}*/ }
  .links a {
    border: 1px solid #F39314 !important;
    color: #F39314 !important;
    background-color: #fff;
    text-transform: uppercase;
    border-radius: 2px;
    box-shadow: #814c07 0px 1px 2px !important;
    font-weight: 700; }
    .links a:focus {
      background-color: #F39314 !important;
      border-color: #F39314 !important;
      color: #fff !important;
      box-shadow: #814c07 0px 1px 2px !important; }
    .links a:hover {
      background-color: #F39314 !important;
      border-color: #F39314 !important;
      color: #fff !important;
      box-shadow: #814c07 0px 1px 2px !important; }

/*! _project-summary */
.resultlist {
  display: flex;
  flex-wrap: wrap;
  margin-top: 2rem;
  justify-content: space-between; }
  .resultlist ._results {
    display: none; }
  .resultlist .project-summary-wrapper {
    position: relative;
    overflow: hidden;
    transition: all .2s ease; }
    @media (max-width: 1400px) {
      .resultlist .project-summary-wrapper {
        width: 48%; } }
    .resultlist .project-summary-wrapper img {
      object-fit: cover;
      width: 100%;
      height: 100%;
      max-height: 300px;
      transition: all .2s ease; }
    .resultlist .project-summary-wrapper .project-summary-footer {
      position: absolute;
      bottom: 50px;
      left: 100px;
      width: 100%;
      z-index: 1;
      color: #fff;
      transform: rotate(-9deg); }
      .resultlist .project-summary-wrapper .project-summary-footer h2 {
        font-size: 26px; }
    .resultlist .project-summary-wrapper .project-summary-link {
      position: absolute;
      top: 0;
      right: 0;
      bottom: 0;
      left: 0;
      opacity: 0;
      z-index: 2; }
    .resultlist .project-summary-wrapper:before {
      content: "";
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background-color: rgba(0, 0, 0, 0.3); }
    .resultlist .project-summary-wrapper:after {
      content: "";
      position: absolute;
      top: 196px;
      left: 13px;
      width: 100%;
      height: 100%;
      background: #4b54c7;
      background: linear-gradient(132deg, #4b54c7 0%, #8842bc 100%);
      transform: rotate(-10deg); }
    .resultlist .project-summary-wrapper:hover {
      box-shadow: rgba(75, 84, 199, 0.3) 0px 0px 0px 3px; }

/*! _general-portal */
.c2rlayout {
  margin-top: 3rem; }

/*! _body */
body {
  min-height: 100vh;
  height: 100%;
  display: flex;
  flex-direction: column; }
  body > .c2pgitm_wrap {
    margin-top: auto; }
  body #wrap {
    min-height: 92.5vh;
    height: 100%;
    display: flex;
    flex-direction: column; }
    body #wrap .c2pgitm_wrap:last-child {
      margin-top: auto; }

/*! _footer */
.c2-footer .row > div {
  display: flex;
  align-items: center; }

.c2-footer a {
  color: #fff !important;
  text-decoration: none;
  font-weight: bold; }
  .c2-footer a:hover {
    text-decoration: underline; }

.c2-footer p {
  color: #fff; }

/*! _project-detail */
.project-detail-wrapper {
  margin-top: 3rem; }
  .project-detail-wrapper .c2rlayout {
    margin-top: 0; }

/*! _project-session-summary */
.resultlist {
  display: flex;
  flex-wrap: wrap;
  margin-top: 2rem; }
  .resultlist .project-session-summary-wrapper {
    position: relative;
    overflow: hidden;
    transition: all .2s ease; }
    .resultlist .project-session-summary-wrapper img {
      object-fit: cover;
      width: 100%;
      height: 100%;
      max-height: 300px;
      transition: all .2s ease; }
    .resultlist .project-session-summary-wrapper .project-summary-footer {
      position: absolute;
      bottom: 0;
      left: 0;
      width: 100%;
      z-index: 1;
      color: #fff;
      display: flex;
      justify-content: space-between;
      align-items: center;
      padding: 0 1.5rem .5rem 1.5rem; }
      .resultlist .project-session-summary-wrapper .project-summary-footer h2 {
        font-size: 20px; }
      .resultlist .project-session-summary-wrapper .project-summary-footer .project-summary-footer-right {
        text-align: center;
        padding-bottom: 0; }
        .resultlist .project-session-summary-wrapper .project-summary-footer .project-summary-footer-right p {
          font-size: 14px;
          padding: 0 15px; }
      .resultlist .project-session-summary-wrapper .project-summary-footer .project-summary-footer-left {
        margin-bottom: 1rem;
        margin-top: auto; }
    .resultlist .project-session-summary-wrapper .project-summary-link {
      position: absolute;
      top: 0;
      right: 0;
      bottom: 0;
      left: 0;
      opacity: 0;
      z-index: 2; }
    .resultlist .project-session-summary-wrapper:before {
      content: "";
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background-color: rgba(0, 0, 0, 0.3); }
    .resultlist .project-session-summary-wrapper:after {
      content: "";
      position: absolute;
      top: 135px;
      left: -72px;
      width: 120%;
      height: 100%;
      background: #4b54c7;
      background: linear-gradient(132deg, #4b54c7 0%, #8842bc 100%);
      transform: rotate(-12deg); }
    .resultlist .project-session-summary-wrapper:hover {
      box-shadow: rgba(75, 84, 199, 0.3) 0px 0px 0px 3px; }

/*! _project-session-evaluation */
.portal-content {
  margin-top: 3rem;
  margin-bottom: 1rem; }
  .portal-content table {
    width: 100%; }

/*! _project-evaluation */
.evaluation-wrap ._buttons {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  row-gap: 3em; }

.evaluation-wrap ._mulbutton {
  display: flex;
  flex-direction: column;
  position: relative; }
  .evaluation-wrap ._mulbutton .c2btn.evalbtn {
    height: 100%;
    margin: 0 !important;
    max-width: unset !important;
    width: 100%;
    background: #4b54c7;
    background: linear-gradient(128deg, #4b54c7 0%, #8842bc 100%);
    display: flex !important;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    position: relative;
    font-size: 1.3rem; }
    .evaluation-wrap ._mulbutton .c2btn.evalbtn i {
      font-size: 80px; }
  .evaluation-wrap ._mulbutton .c2btn._sub {
    width: 50px;
    height: 50px;
    border: 3px solid #fff;
    border-radius: 50%;
    position: absolute;
    display: flex;
    align-items: center;
    max-width: unset !important;
    justify-content: center;
    background: transparent;
    color: #fff;
    top: 10px;
    left: 10px;
    opacity: 1; }
    .evaluation-wrap ._mulbutton .c2btn._sub:hover {
      background-color: #fff;
      color: #000; }

.evaluation-wrap .c2btn.back,
.evaluation-wrap .c2btnbacktolisting {
  border: 1px solid #F39314 !important;
  color: #F39314 !important;
  background-color: #fff;
  text-transform: uppercase;
  border-radius: 2px;
  box-shadow: #814c07 0px 1px 2px !important;
  font-weight: 700; }
  .evaluation-wrap .c2btn.back:hover,
  .evaluation-wrap .c2btnbacktolisting:hover {
    background-color: #F39314 !important;
    border-color: #F39314 !important;
    color: #fff !important;
    box-shadow: #814c07 0px 1px 2px !important; }

/*! _session-plan */
.portal-content > table {
  border-collapse: separate;
  table-layout: fixed;
  border-spacing: 20px; }
  .portal-content > table table {
    border-spacing: 20px;
    border-collapse: separate;
    border-width: 1px;
    margin: 20px 0; }
    .portal-content > table table tr td:nth-child(2) {
      width: 50%; }
  .portal-content > table + .c2btn.evalbtn.back {
    display: flex;
    margin-top: 1rem;
    align-items: center;
    width: max-content;
    padding: 15px;
    column-gap: 0.5rem; }
    .portal-content > table + .c2btn.evalbtn.back h2 {
      font-size: 1.35rem;
      margin: 0; }