/* remove default gradient bg */
.gradient {
  background: none !important;
  padding-bottom: 0em !Important;
}

.more-wrap a.button-link:hover {
    background: #317aba !important;
    color: #fff;
    text-decoration: none;
}

.bord-rad-25 {
    border-radius: 25px;
}

.more-wrap {
    background: #073850;
    padding: 35px;
    border-radius: 25px;
}

.quiz-wrap {
    background: #c05231;
    padding: 20px;
    border-radius: 25px;
    margin-bottom: 5rem !important;
}

.role-wrap {
    display: flex;
    flex-direction: column;
    gap: 5rem;
}

.ub-roles {
    display: flex; 
    justify-content: start; 
    align-items: stretch; 
}

.branch-ub {
    border-right: 2px solid #ccc; 
    padding-right: 5vw;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.flex-ub {
    padding-left: 5vw;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.more-wrap > .column:first-child {
    padding-left: 0em !important;
}

.more-wrap > .column:last-child {
    padding-right: 0em !important;
}

.quiz-wrap > .column:first-child {
    padding-left: 0em !important;
}

.quiz-wrap > .column:last-child {
    padding-right: 0em !important;
}


/* mobile styles*/

@media (max-width: 758px) {
  
  .more-wrap > .column:first-child {
      padding-left: 0em !important;
      padding-right: 0em !important;
  }

  .more-wrap > .column:last-child {
      padding-right: 0em !important;
      padding-left: 0em !important;
  }

  .quiz-wrap > .column:first-child {
      padding-left: 0em !important;
      padding-right: 0em !important;
  }

  .quiz-wrap > .column:last-child {
      padding-right: 0em !important;
      padding-left: 0em !important;
  }
  
  .role-mbl-cover {
      object-fit: cover;
      object-position: 100% 17%;
      height: 150px;
      width: 100%;
      margin-bottom: 1.5em;
  }

   .quiz-wrap .role-mbl-cover {
      object-fit: cover;
      object-position: 100% 55%;
      height: 150px;
      width: 100%;
      margin-bottom: 1.5em;
  }

  .quiz-wrap { 
      padding: 30px !important;
  }
  
  .more-wrap { 
      padding: 30px !important;
  }
  
  .branch-ub {
      border-right: 2px solid #ccc; 
      padding-right: 5vw;
      flex: 1;
      display: flex;
      flex-direction: column;
      justify-content: space-between;
  }

  .flex-ub {
      padding-left: 5vw; 
      flex: 1;
      display: flex;
      flex-direction: column;
      justify-content: space-between;
  }
}
/* end mobile styles */