﻿* {
  margin: 0;
  padding: 0;
  box-sizing: border-box; }

html, body {
  background-color: #e7f1fd; }

ul, ol {
  list-style: none; }

a, img {
  text-decoration: none;
  outline: none; }

label {
  width: 100%;
  display: flex;
  align-items: flex-end;
  font: 500 14px "Plus Jakarta Sans", sans-serif;
  color: #505050; }
  label small {
    display: inline-block;
    width: auto;
    font: 500 12px "Plus Jakarta Sans", sans-serif;
    color: #505050;
    margin: 0 0 0 4px; }

input[type=text] {
  display: block;
  width: 100%;
  height: 40px;
  border-radius: 6px;
  padding: 8px;
  background-color: #fff;
  border: 1px solid #c0c0c0;
  font: 500 14px "Plus Jakarta Sans", sans-serif;
  color: #202020; }
  input[type=text]:focus {
    outline: none;
    border-color: #505050; }
  input[type=text].date {
    background: url(../icons/calendar.svg) no-repeat right 8px center #fff;
    background-size: 18px; }

textarea {
  display: block;
  width: 100%;
  height: 96px;
  border-radius: 6px;
  padding: 8px;
  background-color: #fff;
  border: 1px solid #c0c0c0;
  font: 500 14px "Plus Jakarta Sans", sans-serif;
  color: #202020; }
  textarea:focus {
    outline: none;
    border-color: #505050; }

select {
  appearance: none;
  display: block;
  width: 100%;
  height: 40px;
  border-radius: 6px;
  padding: 8px;
  background: url(../icons/drop-down.svg) no-repeat right 6px center #fff;
  background-size: 22px;
  border: 1px solid #c0c0c0;
  font: 500 14px "Plus Jakarta Sans", sans-serif;
  color: #202020; }
  select:focus {
    outline: none;
    border-color: #505050; }

.error {
  display: block;
  width: 100%;
  text-align: left;
  font: 500 12px "Plus Jakarta Sans", sans-serif;
  color: red; }

.wrapper {
  width: 100%;
  border-top: 8px solid #0b4d9c;
  background-color: #e7f1fd;
  padding: 8px 0 48px 0; }
  .wrapper .container {
    width: 100%;
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 24px;
    display: flex;
    flex-flow: column;
    gap: 24px; }
    .wrapper .container header {
      width: 100%;
      display: flex;
      align-items: center; }
      @media (max-width: 768px) {
        .wrapper .container header {
          flex-flow: column; } }
      .wrapper .container header .logo {
        width: 180px; }
        @media (max-width: 1024px) {
          .wrapper .container header .logo {
            width: 160px; } }
        @media (max-width: 768px) {
          .wrapper .container header .logo {
            width: 140px; } }
        .wrapper .container header .logo img {
          display: block;
          width: 100%; }
      .wrapper .container header .schoolName {
        width: 100%;
        display: flex;
        flex-flow: column;
        gap: 12px;
        align-items: center; }
        @media (max-width: 560px) {
          .wrapper .container header .schoolName {
            display: none; } }
        .wrapper .container header .schoolName h2 {
          text-align: center;
          font: 800 48px "Plus Jakarta Sans", sans-serif;
          color: #0b4d9c;
          text-transform: uppercase; }
          @media (max-width: 1024px) {
            .wrapper .container header .schoolName h2 {
              font: 700 36px "Plus Jakarta Sans", sans-serif; } }
          @media (max-width: 768px) {
            .wrapper .container header .schoolName h2 {
              font: 700 28px "Plus Jakarta Sans", sans-serif; } }
          @media (max-width: 560px) {
            .wrapper .container header .schoolName h2 {
              font: 700 22px "Plus Jakarta Sans", sans-serif; } }
        .wrapper .container header .schoolName b {
          display: inline-block;
          width: auto;
          font: 600 20px "Plus Jakarta Sans", sans-serif;
          color: #0b4d9c;
          padding: 0 48px; }
          @media (max-width: 1024px) {
            .wrapper .container header .schoolName b {
              font: 600 16px "Plus Jakarta Sans", sans-serif;
              padding: 0 24px; } }
          @media (max-width: 768px) {
            .wrapper .container header .schoolName b {
              font: 600 14px "Plus Jakarta Sans", sans-serif;
              padding: 0 20px; } }
          @media (max-width: 560px) {
            .wrapper .container header .schoolName b {
              font: 600 12px "Plus Jakarta Sans", sans-serif;
              text-align: center;
              line-height: normal;
              padding: 6px 20px; } }
        .wrapper .container header .schoolName p {
          text-align: center;
          font: 600 16px "Plus Jakarta Sans", sans-serif;
          color: #202020; }
          @media (max-width: 1024px) {
            .wrapper .container header .schoolName p {
              font: 600 14px "Plus Jakarta Sans", sans-serif; } }
          @media (max-width: 560px) {
            .wrapper .container header .schoolName p {
              font: 500 13px "Plus Jakarta Sans", sans-serif; } }
    .wrapper .container .heading {
      width: 100%;
      display: flex;
      flex-flow: column;
      align-items: center;
      gap: 4px; }
      .wrapper .container .heading h2 {
        text-align: center;
        font: 800 36px "Plus Jakarta Sans", sans-serif;
        color: #202020;
        text-transform: uppercase; }
        @media (max-width: 1024px) {
          .wrapper .container .heading h2 {
            font: 800 30px "Plus Jakarta Sans", sans-serif; } }
        @media (max-width: 560px) {
          .wrapper .container .heading h2 {
            font: 800 24px "Plus Jakarta Sans", sans-serif; } }
      .wrapper .container .heading b {
        display: block;
        width: 100%;
        text-align: center;
        font: 700 32px "Plus Jakarta Sans", sans-serif;
        color: #202020; }
        @media (max-width: 1024px) {
          .wrapper .container .heading b {
            font: 700 24px "Plus Jakarta Sans", sans-serif; } }
        @media (max-width: 560px) {
          .wrapper .container .heading b {
            font: 700 20px "Plus Jakarta Sans", sans-serif; } }
    .wrapper .container .form {
      width: 100%;
      display: flex;
      flex-flow: column;
      gap: 24px;
      /******* Medical Form ****/
      /****** Transport Form *****/ }
      .wrapper .container .form .infoForm {
        width: 100%;
        display: flex;
        flex-flow: column;
        gap: 16px; }
        .wrapper .container .form .infoForm ul {
          width: 100%;
          display: grid;
          grid-gap: 16px;
          grid-template-columns: repeat(4, 1fr);
          align-items: flex-start; }
          @media (max-width: 1024px) {
            .wrapper .container .form .infoForm ul {
              grid-template-columns: repeat(2, 1fr); } }
          @media (max-width: 560px) {
            .wrapper .container .form .infoForm ul {
              grid-template-columns: repeat(1, 1fr); } }
          .wrapper .container .form .infoForm ul li {
            width: 100%;
            display: flex;
            flex-flow: column;
            align-items: flex-start;
            gap: 8px; }
            .wrapper .container .form .infoForm ul li .dob {
              width: 100%;
              display: grid;
              grid-gap: 4px;
              grid-template-columns: 72px auto 82px;
              align-items: center; }
            .wrapper .container .form .infoForm ul li b {
              display: block;
              width: 100%;
              height: 40px;
              border-radius: 6px;
              padding: 8px;
              background-color: #F2F2F2;
              border: 1px solid #c0c0c0;
              font: 500 14px "Plus Jakarta Sans", sans-serif;
              color: #202020; }
        .wrapper .container .form .infoForm dl {
          width: 100%;
          display: grid;
          grid-gap: 16px;
          grid-template-columns: repeat(2, 1fr);
          align-items: flex-start; }
          @media (max-width: 1024px) {
            .wrapper .container .form .infoForm dl {
              grid-template-columns: repeat(1, 1fr); } }
          @media (max-width: 560px) {
            .wrapper .container .form .infoForm dl {
              grid-template-columns: repeat(1, 1fr); } }
          .wrapper .container .form .infoForm dl dt {
            width: 100%;
            display: flex;
            flex-flow: column;
            align-items: flex-start;
            gap: 8px; }
            .wrapper .container .form .infoForm dl dt label {
              position: relative; }
              .wrapper .container .form .infoForm dl dt label b {
                display: inline-flex;
                align-items: center;
                position: absolute;
                right: 0;
                top: 0; }
                .wrapper .container .form .infoForm dl dt label b input[type=checkbox] {
                  height: 14px;
                  width: 14px; }
                  .wrapper .container .form .infoForm dl dt label b input[type=checkbox]:checked ~ label {
                    color: #0060DF; }
                .wrapper .container .form .infoForm dl dt label b label {
                  display: inline-block;
                  width: auto;
                  font: 500 12px/14px "Plus Jakarta Sans", sans-serif;
                  color: #202020;
                  padding: 0 0 0 8px; }
      .wrapper .container .form .previousSchoolAttended {
        width: 100%;
        border-top: 1px solid #d0d0d0;
        padding: 20px 0 0 0;
        display: flex;
        flex-flow: column;
        gap: 16px; }
        .wrapper .container .form .previousSchoolAttended b {
          display: block;
          width: 100%;
          text-align: left;
          font: 600 16px "Plus Jakarta Sans", sans-serif;
          color: #000; }
        .wrapper .container .form .previousSchoolAttended ul {
          width: 100%;
          display: grid;
          grid-gap: 16px;
          grid-template-columns: repeat(4, 1fr);
          align-items: flex-start; }
          @media (max-width: 560px) {
            .wrapper .container .form .previousSchoolAttended ul {
              grid-template-columns: repeat(1, 1fr); } }
          .wrapper .container .form .previousSchoolAttended ul li {
            width: 100%;
            display: flex;
            flex-flow: column;
            align-items: flex-start;
            gap: 8px; }
            .wrapper .container .form .previousSchoolAttended ul li:first-child {
              grid-column: 1 / 4; }
              @media (max-width: 560px) {
                .wrapper .container .form .previousSchoolAttended ul li:first-child {
                  grid-column: 1 / 2; } }
            .wrapper .container .form .previousSchoolAttended ul li b {
              display: block;
              width: 100%;
              height: 40px;
              border-radius: 6px;
              padding: 8px;
              background-color: #F2F2F2;
              border: 1px solid #c0c0c0;
              font: 500 14px "Plus Jakarta Sans", sans-serif;
              color: #202020; }
      .wrapper .container .form .siblingInformation {
        width: 100%;
        border-top: 1px solid #d0d0d0;
        padding: 20px 0 0 0;
        display: flex;
        flex-flow: column;
        gap: 16px; }
        .wrapper .container .form .siblingInformation b {
          display: block;
          width: 100%;
          text-align: left;
          font: 600 16px "Plus Jakarta Sans", sans-serif;
          color: #000; }
        .wrapper .container .form .siblingInformation .prevyesno {
          width: 100%;
          display: flex;
          align-items: center;
          margin: 24px 0 0 0; }
          .wrapper .container .form .siblingInformation .prevyesno label {
            display: inline-block;
            width: auto;
            text-align: left;
            font: 600 16px "Plus Jakarta Sans", sans-serif;
            color: #202020;
            padding: 0 0 0 8px; }
        .wrapper .container .form .siblingInformation .sibinfo {
          width: 100%;
          display: flex;
          flex-flow: column;
          gap: 16px; }
          .wrapper .container .form .siblingInformation .sibinfo table {
            width: 100%;
            border-collapse: collapse; }
            .wrapper .container .form .siblingInformation .sibinfo table tbody {
              width: 100%;
              display: flex;
              flex-flow: column;
              gap: 16px; }
              .wrapper .container .form .siblingInformation .sibinfo table tbody tr {
                display: block;
                width: 100%; }
                .wrapper .container .form .siblingInformation .sibinfo table tbody tr td {
                  display: block;
                  width: 100%; }
                  .wrapper .container .form .siblingInformation .sibinfo table tbody tr td ul {
                    width: 100%;
                    display: grid;
                    grid-gap: 16px;
                    grid-template-columns: repeat(2, 1fr);
                    align-items: flex-start; }
                    @media (max-width: 560px) {
                      .wrapper .container .form .siblingInformation .sibinfo table tbody tr td ul {
                        grid-template-columns: repeat(1, 1fr); } }
                    .wrapper .container .form .siblingInformation .sibinfo table tbody tr td ul li {
                      width: 100%;
                      display: flex;
                      flex-flow: column;
                      align-items: flex-start;
                      gap: 8px; }
                      .wrapper .container .form .siblingInformation .sibinfo table tbody tr td ul li b {
                        display: block;
                        width: 100%;
                        height: 40px;
                        border-radius: 6px;
                        padding: 8px;
                        background-color: #F2F2F2;
                        border: 1px solid #c0c0c0;
                        font: 500 14px "Plus Jakarta Sans", sans-serif;
                        color: #202020; }
          .wrapper .container .form .siblingInformation .sibinfo .addnewsib {
            width: 100%;
            display: flex;
            align-items: center;
            justify-content: flex-end; }
            .wrapper .container .form .siblingInformation .sibinfo .addnewsib a {
              display: inline-block;
              width: auto;
              font: 500 14px/42px "Plus Jakarta Sans", sans-serif;
              color: #fff;
              background: url(../icons/plus.svg) no-repeat left 16px center #0060DF;
              background-size: 22px;
              padding: 0 24px 0 44px;
              border-radius: 8px; }
              .wrapper .container .form .siblingInformation .sibinfo .addnewsib a:hover {
                background-color: #1c50af; }
      .wrapper .container .form .otherInformationP {
        width: 100%;
        border-top: 1px solid #d0d0d0;
        padding: 20px 0 0 0;
        display: flex;
        flex-flow: column;
        gap: 16px; }
        .wrapper .container .form .otherInformationP b {
          display: block;
          width: 100%;
          text-align: left;
          font: 600 16px "Plus Jakarta Sans", sans-serif;
          color: #000; }
        .wrapper .container .form .otherInformationP ul {
          width: 100%;
          display: grid;
          grid-gap: 16px;
          grid-template-columns: repeat(2, 1fr);
          align-items: flex-start; }
          @media (max-width: 560px) {
            .wrapper .container .form .otherInformationP ul {
              grid-template-columns: repeat(1, 1fr); } }
          .wrapper .container .form .otherInformationP ul li {
            width: 100%;
            display: flex;
            flex-flow: column;
            align-items: flex-start;
            gap: 8px; }
            .wrapper .container .form .otherInformationP ul li b {
              display: block;
              width: 100%;
              height: 40px;
              border-radius: 6px;
              padding: 8px;
              background-color: #F2F2F2;
              border: 1px solid #c0c0c0;
              font: 500 14px "Plus Jakarta Sans", sans-serif;
              color: #202020; }
        .wrapper .container .form .otherInformationP dl {
          width: 100%;
          display: grid;
          grid-gap: 16px;
          grid-template-columns: repeat(3, 1fr);
          align-items: flex-start; }
          @media (max-width: 560px) {
            .wrapper .container .form .otherInformationP dl {
              grid-template-columns: repeat(1, 1fr); } }
          .wrapper .container .form .otherInformationP dl dt {
            width: 100%;
            display: flex;
            flex-flow: column;
            align-items: flex-start;
            gap: 8px; }
            .wrapper .container .form .otherInformationP dl dt b {
              display: block;
              width: 100%;
              height: 40px;
              border-radius: 6px;
              padding: 8px;
              background-color: #F2F2F2;
              border: 1px solid #c0c0c0;
              font: 500 14px "Plus Jakarta Sans", sans-serif;
              color: #202020; }
        .wrapper .container .form .otherInformationP .rusticatedornot {
          width: 100%;
          display: flex;
          flex-flow: column;
          align-items: flex-start;
          gap: 8px; }
      .wrapper .container .form .medicalRecord {
        width: 100%;
        border-top: 1px solid #d0d0d0;
        padding: 20px 0 0 0;
        display: flex;
        flex-flow: column;
        gap: 16px; }
        .wrapper .container .form .medicalRecord b {
          display: block;
          width: 100%;
          text-align: left;
          font: 600 16px "Plus Jakarta Sans", sans-serif;
          color: #000; }
        .wrapper .container .form .medicalRecord dl {
          width: 100%;
          display: grid;
          grid-template-columns: repeat(3, 1fr);
          align-items: flex-start;
          grid-gap: 16px; }
          @media (max-width: 1024px) {
            .wrapper .container .form .medicalRecord dl {
              grid-template-columns: repeat(1, 1fr); } }
          .wrapper .container .form .medicalRecord dl dt {
            width: 100%;
            display: flex;
            flex-flow: column;
            align-items: flex-start;
            gap: 8px; }
        .wrapper .container .form .medicalRecord ul {
          width: 100%;
          display: grid;
          grid-template-columns: repeat(4, 1fr);
          align-items: flex-start;
          grid-gap: 16px; }
          @media (max-width: 1024px) {
            .wrapper .container .form .medicalRecord ul {
              grid-template-columns: repeat(2, 1fr); } }
          @media (max-width: 560px) {
            .wrapper .container .form .medicalRecord ul {
              grid-template-columns: repeat(1, 1fr); } }
          .wrapper .container .form .medicalRecord ul li {
            width: 100%;
            display: flex;
            flex-flow: column;
            align-items: flex-start;
            gap: 8px; }
      .wrapper .container .form .transportReq {
        width: 100%;
        border-top: 1px solid #d0d0d0;
        padding: 20px 0 0 0;
        display: flex;
        gap: 24px; }
        .wrapper .container .form .transportReq b {
          display: inline-block;
          width: auto;
          text-align: left;
          font: 500 14px "Plus Jakarta Sans", sans-serif;
          color: #000; }
        .wrapper .container .form .transportReq table {
          width: auto;
          border-collapse: collapse; }
          .wrapper .container .form .transportReq table tbody {
            width: auto; }
            .wrapper .container .form .transportReq table tbody tr {
              width: auto;
              display: inline-flex;
              align-items: center;
              gap: 24px; }
              .wrapper .container .form .transportReq table tbody tr input[type=checkbox] {
                height: 14px;
                width: 14px; }
                .wrapper .container .form .transportReq table tbody tr input[type=checkbox]:checked ~ label {
                  color: #0060DF; }
              .wrapper .container .form .transportReq table tbody tr label {
                display: inline-block;
                width: auto;
                text-align: left;
                font: 500 14px "Plus Jakarta Sans", sans-serif;
                color: #202020;
                padding: 0 0 0 4px; }
      .wrapper .container .form .familyWrapp {
        width: 100%;
        border-top: 1px solid #d0d0d0;
        padding: 20px 0 0 0;
        display: flex;
        flex-flow: column;
        gap: 16px; }
        .wrapper .container .form .familyWrapp b {
          display: block;
          width: 100%;
          text-align: left;
          font: 600 16px "Plus Jakarta Sans", sans-serif;
          color: #000; }
        .wrapper .container .form .familyWrapp .familyCon {
          width: 100%;
          display: flex;
          flex-flow: column;
          gap: 24px;
          align-items: flex-start; }
          .wrapper .container .form .familyWrapp .familyCon .parentsCon {
            width: 100%;
            display: flex;
            flex-flow: column;
            gap: 16px; }
            .wrapper .container .form .familyWrapp .familyCon .parentsCon b {
              display: block;
              width: 100%;
              text-align: left;
              font: 500 14px "Plus Jakarta Sans", sans-serif;
              color: #000; }
              .wrapper .container .form .familyWrapp .familyCon .parentsCon b small {
                display: inline-block;
                width: auto;
                text-align: left;
                font: 500 12px "Plus Jakarta Sans", sans-serif;
                color: #000;
                padding: 0 0 0 4px; }
            .wrapper .container .form .familyWrapp .familyCon .parentsCon ul {
              width: 100%;
              display: grid;
              grid-gap: 16px;
              grid-template-columns: repeat(4, minmax(0, 1fr));
              align-items: flex-start; }
              @media (max-width: 1024px) {
                .wrapper .container .form .familyWrapp .familyCon .parentsCon ul {
                  grid-template-columns: repeat(2, minmax(0, 1fr)); } }
              @media (max-width: 560px) {
                .wrapper .container .form .familyWrapp .familyCon .parentsCon ul {
                  grid-template-columns: repeat(1, minmax(0, 1fr)); } }
              .wrapper .container .form .familyWrapp .familyCon .parentsCon ul li {
                width: 100%;
                display: flex;
                flex-flow: column;
                gap: 8px; }
                .wrapper .container .form .familyWrapp .familyCon .parentsCon ul li dl {
                  width: 100%;
                  display: grid;
                  grid-gap: 4px;
                  grid-template-columns: 66px auto;
                  align-items: flex-start; }
                  .wrapper .container .form .familyWrapp .familyCon .parentsCon ul li dl dt {
                    width: 100%;
                    display: flex;
                    flex-flow: column;
                    gap: 8px;
                    align-items: flex-start; }
                .wrapper .container .form .familyWrapp .familyCon .parentsCon ul li .uploadIDProof {
                  width: 100%;
                  height: 40px;
                  position: relative; }
                  .wrapper .container .form .familyWrapp .familyCon .parentsCon ul li .uploadIDProof input[type=file] {
                    position: absolute;
                    left: 0;
                    top: 0;
                    height: 100%;
                    width: 100%;
                    opacity: 0;
                    z-index: 99;
                    cursor: pointer; }
                  .wrapper .container .form .familyWrapp .familyCon .parentsCon ul li .uploadIDProof .fileName {
                    width: 100%;
                    height: 40px;
                    position: relative;
                    border-radius: 6px;
                    padding: 8px 116px 8px 8px;
                    background-color: #fff;
                    border: 1px solid #c0c0c0;
                    font: 500 13px/20px "Plus Jakarta Sans", sans-serif;
                    color: #202020;
                    overflow: hidden;
                    text-overflow: ellipsis;
                    white-space: nowrap; }
                .wrapper .container .form .familyWrapp .familyCon .parentsCon ul li i {
                  display: inline-block;
                  width: auto;
                  font: 500 12px/28px "Plus Jakarta Sans", sans-serif;
                  color: #fff;
                  border-radius: 6px;
                  padding: 0 12px;
                  background-color: #0060DF;
                  position: absolute;
                  top: 5px;
                  right: 4px;
                  font-style: normal; }
            .wrapper .container .form .familyWrapp .familyCon .parentsCon .address {
              width: 100%;
              display: flex;
              flex-flow: column;
              gap: 8px;
              align-items: flex-start; }
      .wrapper .container .form .uploadPhotosWrapp {
        width: 100%;
        border-top: 1px solid #d0d0d0;
        padding: 20px 0 0 0;
        display: flex;
        flex-flow: column;
        gap: 16px; }
        .wrapper .container .form .uploadPhotosWrapp b {
          display: block;
          width: 100%;
          text-align: left;
          font: 600 16px "Plus Jakarta Sans", sans-serif;
          color: #000; }
        .wrapper .container .form .uploadPhotosWrapp ul {
          width: 100%;
          display: grid;
          grid-gap: 24px;
          grid-template-columns: repeat(5, 1fr);
          align-items: flex-start; }
          @media (max-width: 1024px) {
            .wrapper .container .form .uploadPhotosWrapp ul {
              grid-template-columns: repeat(3, 1fr); } }
          @media (max-width: 560px) {
            .wrapper .container .form .uploadPhotosWrapp ul {
              grid-template-columns: repeat(1, minmax(0, 1fr)); } }
          .wrapper .container .form .uploadPhotosWrapp ul li {
            width: 100%;
            display: flex;
            flex-flow: column;
            align-items: flex-start;
            gap: 8px; }
            .wrapper .container .form .uploadPhotosWrapp ul li.groupPhoto {
              grid-column: 4 / 6; }
              @media (max-width: 1024px) {
                .wrapper .container .form .uploadPhotosWrapp ul li.groupPhoto {
                  grid-column: 1 / 4; } }
              @media (max-width: 560px) {
                .wrapper .container .form .uploadPhotosWrapp ul li.groupPhoto {
                  grid-column: 1 / 2; } }
            .wrapper .container .form .uploadPhotosWrapp ul li .photoImg {
              width: 100%;
              display: flex;
              align-items: flex-start; }
              @media (max-width: 560px) {
                .wrapper .container .form .uploadPhotosWrapp ul li .photoImg {
                  align-items: center;
                  justify-content: center; } }
              .wrapper .container .form .uploadPhotosWrapp ul li .photoImg .image {
                width: 100%;
                max-width: 200px;
                aspect-ratio: 1 / 1;
                position: relative;
                overflow: hidden;
                border: 1px solid #c0c0c0;
                background: url(../icons/file-upload.png) no-repeat center #F0F0F0;
                background-size: 66px;
                border-radius: 8px; }
              .wrapper .container .form .uploadPhotosWrapp ul li .photoImg .image1 {
                width: 100%;
                max-width: 355px;
                aspect-ratio: 16 / 9;
                position: relative;
                overflow: hidden;
                border: 1px solid #c0c0c0;
                background: url(../icons/file-upload.png) no-repeat center #F0F0F0;
                background-size: 66px;
                border-radius: 8px; }
              .wrapper .container .form .uploadPhotosWrapp ul li .photoImg .upload-image-preview > img {
                display: inline-block;
                width: auto;
                max-width: 100%;
                max-height: 100%;
                height: auto;
                object-fit: contain; }
              .wrapper .container .form .uploadPhotosWrapp ul li .photoImg .upload-image-preview {
                width: 100%;
                aspect-ratio: 1 / 1;
                z-index: 1;
                display: flex;
                align-items: center;
                justify-content: center; }
              .wrapper .container .form .uploadPhotosWrapp ul li .photoImg .upload-image-preview1 {
                width: 100%;
                aspect-ratio: 16 / 9;
                z-index: 1;
                display: flex;
                align-items: center;
                justify-content: center; }
              .wrapper .container .form .uploadPhotosWrapp ul li .photoImg .upload-image-preview1 > img {
                display: inline-block;
                width: auto;
                max-width: 100%;
                max-height: 100%;
                height: auto;
                object-fit: contain; }
              .wrapper .container .form .uploadPhotosWrapp ul li .photoImg .fileContainer:hover img {
                opacity: .2; }
              .wrapper .container .form .uploadPhotosWrapp ul li .photoImg .fileContainer [type=file] {
                cursor: inherit;
                display: block;
                font-size: 999px;
                filter: alpha(opacity=0);
                height: 100%;
                width: 100%;
                opacity: 0;
                position: absolute;
                text-align: right;
                top: 0; }
      .wrapper .container .form .declarationsWrapp {
        width: 100%;
        border-top: 1px solid #d0d0d0;
        padding: 20px 0 0 0;
        display: flex;
        flex-flow: column;
        gap: 16px; }
        .wrapper .container .form .declarationsWrapp b {
          display: block;
          width: 100%;
          text-align: left;
          font: 600 16px "Plus Jakarta Sans", sans-serif;
          color: #000; }
        .wrapper .container .form .declarationsWrapp p {
          text-align: left;
          font: 500 14px "Plus Jakarta Sans", sans-serif;
          color: #202020; }
        .wrapper .container .form .declarationsWrapp ul {
          width: 100%;
          display: flex;
          flex-flow: column;
          align-items: flex-start;
          gap: 12px; }
          .wrapper .container .form .declarationsWrapp ul li {
            width: calc(100% - 16px);
            text-align: left;
            font: 500 14px "Plus Jakarta Sans", sans-serif;
            color: #202020;
            list-style: decimal;
            padding: 0 0 0 12px;
            margin: 0 0 0 16px; }
      .wrapper .container .form .acceptTerms {
        width: 100%;
        display: flex;
        align-items: flex-start;
        margin: 24px 0 0 0; }
        .wrapper .container .form .acceptTerms input[type=checkbox] {
          height: 16px;
          width: 16px;
          transform: translateY(1px); }
        .wrapper .container .form .acceptTerms label {
          display: inline-block;
          width: auto;
          font: 600 14px "Plus Jakarta Sans", sans-serif;
          color: #202020;
          padding: 0 0 0 12px; }
      .wrapper .container .form .save {
        width: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
        margin: 36px 0 0 0; }
        .wrapper .container .form .save input[type=submit] {
          appearance: none;
          height: 48px;
          width: 100%;
          max-width: 234px;
          border-radius: 8px;
          border: none;
          cursor: pointer;
          font: 500 14px "Plus Jakarta Sans", sans-serif;
          color: #fff;
          background-color: #2963D2; }
          @media (max-width: 560px) {
            .wrapper .container .form .save input[type=submit] {
              max-width: 100%; } }
          .wrapper .container .form .save input[type=submit]:hover {
            background-color: #1c50af; }
      .wrapper .container .form .medicalFormPersonalInfo {
        width: 100%;
        display: flex;
        flex-flow: column;
        gap: 16px; }
        .wrapper .container .form .medicalFormPersonalInfo ul {
          width: 100%;
          display: grid;
          grid-template-columns: repeat(3, 1fr);
          align-items: flex-start;
          grid-gap: 16px; }
          @media (max-width: 768px) {
            .wrapper .container .form .medicalFormPersonalInfo ul {
              grid-template-columns: repeat(1, 1fr); } }
          .wrapper .container .form .medicalFormPersonalInfo ul li {
            width: 100%;
            display: flex;
            flex-flow: column;
            gap: 8px; }
            .wrapper .container .form .medicalFormPersonalInfo ul li dl {
              width: 100%;
              display: grid;
              grid-template-columns: repeat(2, 1fr);
              align-items: flex-start;
              grid-gap: 8px; }
              .wrapper .container .form .medicalFormPersonalInfo ul li dl dt {
                width: 100%; }
        .wrapper .container .form .medicalFormPersonalInfo .address {
          width: 100%;
          display: flex;
          flex-flow: column;
          gap: 8px; }
      .wrapper .container .form .medicalFormVision {
        width: 100%;
        display: flex;
        flex-flow: column;
        gap: 24px; }
        .wrapper .container .form .medicalFormVision h2 {
          text-align: left;
          font: 700 20px "Plus Jakarta Sans", sans-serif;
          color: #202020; }
        .wrapper .container .form .medicalFormVision ul {
          width: 100%;
          display: flex;
          align-items: center;
          gap: 96px; }
          @media (max-width: 768px) {
            .wrapper .container .form .medicalFormVision ul {
              flex-flow: column;
              gap: 24px; } }
          .wrapper .container .form .medicalFormVision ul li {
            width: 100%;
            display: flex;
            flex-flow: column;
            gap: 8px;
            border-radius: 12px;
            border: 1px solid #ccc;
            padding: 16px;
            position: relative; }
            .wrapper .container .form .medicalFormVision ul li b {
              display: inline-block;
              width: auto;
              text-align: center;
              font: 700 14px "Plus Jakarta Sans", sans-serif;
              color: #202020;
              background-color: #F6FFF5;
              padding: 4px 8px;
              position: absolute;
              left: 13px;
              top: -15px; }
            .wrapper .container .form .medicalFormVision ul li dl {
              width: 100%;
              display: grid;
              grid-template-columns: repeat(2, 1fr);
              grid-gap: 16px; }
              .wrapper .container .form .medicalFormVision ul li dl dt {
                width: 100%;
                display: flex;
                flex-flow: column;
                gap: 8px; }
      .wrapper .container .form .medicalFormcodeN {
        width: 100%;
        display: flex;
        flex-flow: column;
        gap: 16px; }
        .wrapper .container .form .medicalFormcodeN h2 {
          text-align: left;
          font: 700 20px "Plus Jakarta Sans", sans-serif;
          color: #202020; }
        .wrapper .container .form .medicalFormcodeN b {
          display: block;
          width: 100%;
          text-align: left;
          font: 600 18px "Plus Jakarta Sans", sans-serif;
          color: #202020; }
        .wrapper .container .form .medicalFormcodeN ul {
          width: 100%;
          display: grid;
          grid-gap: 16px;
          grid-template-columns: repeat(3, 1fr);
          align-items: flex-start; }
          @media (max-width: 768px) {
            .wrapper .container .form .medicalFormcodeN ul {
              grid-template-columns: repeat(1, 1fr); } }
          .wrapper .container .form .medicalFormcodeN ul li {
            width: 100%;
            display: flex;
            flex-flow: column;
            gap: 8px; }
      .wrapper .container .form .medicalFormNuero {
        width: 100%;
        display: flex;
        flex-flow: column;
        gap: 16px; }
        .wrapper .container .form .medicalFormNuero h2 {
          text-align: left;
          font: 700 20px "Plus Jakarta Sans", sans-serif;
          color: #202020; }
        .wrapper .container .form .medicalFormNuero ul {
          width: 100%;
          display: grid;
          grid-gap: 16px;
          grid-template-columns: repeat(3, 1fr);
          align-items: flex-start; }
          @media (max-width: 768px) {
            .wrapper .container .form .medicalFormNuero ul {
              grid-template-columns: repeat(1, 1fr); } }
          .wrapper .container .form .medicalFormNuero ul li {
            width: 100%;
            display: flex;
            flex-flow: column;
            gap: 8px; }
      .wrapper .container .form .medicalFormDoctorAdvice {
        width: 100%;
        display: flex;
        flex-flow: column;
        gap: 16px; }
        .wrapper .container .form .medicalFormDoctorAdvice h2 {
          text-align: left;
          font: 700 20px "Plus Jakarta Sans", sans-serif;
          color: #202020; }
        .wrapper .container .form .medicalFormDoctorAdvice b {
          display: block;
          width: 100%;
          text-align: left;
          font: 500 14px "Plus Jakarta Sans", sans-serif;
          color: #202020; }
      .wrapper .container .form .certifymedicalform {
        width: 100%;
        display: flex;
        align-items: flex-start; }
        .wrapper .container .form .certifymedicalform input[type=checkbox] {
          transform: translateY(2px);
          flex-shrink: 0; }
        .wrapper .container .form .certifymedicalform label {
          display: block;
          padding: 0 0 0 12px; }
          .wrapper .container .form .certifymedicalform label span {
            display: inline-block;
            font: 600 14px "Plus Jakarta Sans", sans-serif;
            color: #202020;
            margin: 0 4px; }
      .wrapper .container .form .transportForm {
        width: 100%;
        display: flex;
        flex-flow: column;
        gap: 16px; }
        .wrapper .container .form .transportForm ul {
          width: 100%;
          display: grid;
          grid-gap: 16px;
          grid-template-columns: repeat(4, 1fr);
          align-items: flex-start; }
          @media (max-width: 1024px) {
            .wrapper .container .form .transportForm ul {
              grid-template-columns: repeat(3, 1fr); } }
          @media (max-width: 768px) {
            .wrapper .container .form .transportForm ul {
              grid-template-columns: repeat(2, 1fr); } }
          @media (max-width: 560px) {
            .wrapper .container .form .transportForm ul {
              grid-template-columns: repeat(1, 1fr); } }
          .wrapper .container .form .transportForm ul li {
            width: 100%;
            display: flex;
            flex-flow: column;
            gap: 8px; }
        .wrapper .container .form .transportForm b {
          display: block;
          width: 100%;
          text-align: left;
          font: 600 14px "Plus Jakarta Sans", sans-serif;
          color: #202020; }
        .wrapper .container .form .transportForm dl {
          width: 100%;
          display: grid;
          grid-gap: 16px;
          grid-template-columns: repeat(2, 1fr);
          align-items: flex-start; }
          @media (max-width: 768px) {
            .wrapper .container .form .transportForm dl {
              grid-template-columns: repeat(1, 1fr); } }
          .wrapper .container .form .transportForm dl dt {
            width: 100%;
            display: flex;
            flex-flow: column;
            gap: 8px; }
      .wrapper .container .form .transportFormStudentInfo {
        width: 100%;
        display: flex;
        flex-flow: column;
        gap: 16px; }
        .wrapper .container .form .transportFormStudentInfo h2 {
          text-align: left;
          font: 700 20px "Plus Jakarta Sans", sans-serif;
          color: #202020; }
        .wrapper .container .form .transportFormStudentInfo ul {
          width: 100%;
          display: grid;
          grid-gap: 16px;
          grid-template-columns: repeat(4, 1fr);
          align-items: flex-start; }
          @media (max-width: 1024px) {
            .wrapper .container .form .transportFormStudentInfo ul {
              grid-template-columns: repeat(3, 1fr); } }
          @media (max-width: 768px) {
            .wrapper .container .form .transportFormStudentInfo ul {
              grid-template-columns: repeat(2, 1fr); } }
          @media (max-width: 560px) {
            .wrapper .container .form .transportFormStudentInfo ul {
              grid-template-columns: repeat(1, 1fr); } }
          .wrapper .container .form .transportFormStudentInfo ul li {
            width: 100%;
            display: flex;
            flex-flow: column;
            gap: 8px; }
            .wrapper .container .form .transportFormStudentInfo ul li.uploadPhoto {
              grid-row: 1 / 3;
              grid-column: 4 / 5; }
              @media (max-width: 1024px) {
                .wrapper .container .form .transportFormStudentInfo ul li.uploadPhoto {
                  grid-column: 3 / 4; } }
              @media (max-width: 768px) {
                .wrapper .container .form .transportFormStudentInfo ul li.uploadPhoto {
                  grid-column: 2 / 3; } }
              @media (max-width: 560px) {
                .wrapper .container .form .transportFormStudentInfo ul li.uploadPhoto {
                  grid-column: 1 / 2;
                  grid-row: 1 / 2; } }
            .wrapper .container .form .transportFormStudentInfo ul li dl {
              width: 100%;
              display: grid;
              grid-gap: 4px;
              grid-template-columns: 72px auto 82px;
              align-items: center; }
              .wrapper .container .form .transportFormStudentInfo ul li dl dt {
                width: 100%; }
            .wrapper .container .form .transportFormStudentInfo ul li b {
              display: block;
              width: 100%;
              height: 40px;
              border-radius: 6px;
              padding: 8px;
              background-color: #F2F2F2;
              border: 1px solid #c0c0c0;
              font: 500 14px "Plus Jakarta Sans", sans-serif;
              color: #202020; }
            .wrapper .container .form .transportFormStudentInfo ul li .transportPhoto {
              display: flex;
              align-items: center;
              justify-content: center; }
              .wrapper .container .form .transportFormStudentInfo ul li .transportPhoto .photoDis {
                display: block;
                width: 146px;
                aspect-ratio: 1 / 1;
                overflow: hidden;
                border-radius: 8px; }
                .wrapper .container .form .transportFormStudentInfo ul li .transportPhoto .photoDis img {
                  display: block;
                  width: 100%;
                  height: 100%;
                  object-fit: cover; }
        .wrapper .container .form .transportFormStudentInfo .address {
          width: 100%;
          display: flex;
          flex-flow: column;
          gap: 8px; }
      .wrapper .container .form .transportFormdeclaration {
        width: 100%;
        display: flex;
        flex-flow: column;
        gap: 16px; }
        .wrapper .container .form .transportFormdeclaration h2 {
          text-align: left;
          font: 700 20px "Plus Jakarta Sans", sans-serif;
          color: #202020; }
        .wrapper .container .form .transportFormdeclaration .declarationtrans {
          width: 100%;
          display: flex;
          align-items: flex-start; }
          .wrapper .container .form .transportFormdeclaration .declarationtrans input[type=checkbox] {
            transform: translateY(2px);
            flex-shrink: 0; }
          .wrapper .container .form .transportFormdeclaration .declarationtrans label {
            display: block;
            padding: 0 0 0 12px; }
            .wrapper .container .form .transportFormdeclaration .declarationtrans label span {
              display: inline-block;
              font: 600 14px "Plus Jakarta Sans", sans-serif;
              color: #202020;
              margin: 0 4px; }
      .wrapper .container .form .transportTerms {
        width: 100%;
        display: flex;
        flex-flow: column;
        gap: 16px; }
        .wrapper .container .form .transportTerms h2 {
          text-align: left;
          font: 700 20px "Plus Jakarta Sans", sans-serif;
          color: #202020; }
        .wrapper .container .form .transportTerms ul {
          width: 100%;
          display: flex;
          flex-flow: column;
          align-items: flex-start;
          gap: 12px; }
          .wrapper .container .form .transportTerms ul li {
            width: calc(100% - 16px);
            text-align: left;
            font: 500 14px "Plus Jakarta Sans", sans-serif;
            color: #202020;
            list-style: decimal;
            padding: 0 0 0 12px;
            margin: 0 0 0 16px; }
    .wrapper .container .thankyou {
      width: 100%;
      max-width: 560px;
      padding: 48px 0;
      display: flex;
      flex-flow: column;
      gap: 48px;
      margin: 0 auto; }
      .wrapper .container .thankyou .icon {
        width: 100%;
        display: flex;
        align-items: center;
        justify-content: center; }
        .wrapper .container .thankyou .icon img {
          display: block;
          width: 82px; }
      .wrapper .container .thankyou .text {
        width: 100%;
        display: flex;
        align-items: center;
        flex-flow: column;
        gap: 16px; }
        .wrapper .container .thankyou .text h1 {
          text-align: center;
          font: 700 36px "Plus Jakarta Sans", sans-serif;
          color: #12C55E; }
        .wrapper .container .thankyou .text b {
          text-align: center;
          font: 500 14px/20px "Plus Jakarta Sans", sans-serif;
          color: #222; }
      .wrapper .container .thankyou .buttons {
        width: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 16px; }
        @media (max-width: 560px) {
          .wrapper .container .thankyou .buttons {
            flex-flow: column;
            gap: 8px; } }
        .wrapper .container .thankyou .buttons input[type=submit] {
          appearance: none;
          width: auto;
          display: inline-block;
          text-align: center;
          font: 500 14px "Plus Jakarta Sans", sans-serif;
          color: #fff;
          background-color: #000;
          padding: 0 40px;
          border-radius: 8px;
          height: 48px;
          border: none;
          cursor: pointer; }
          @media (max-width: 560px) {
            .wrapper .container .thankyou .buttons input[type=submit] {
              width: 100%;
              display: block; } }
          .wrapper .container .thankyou .buttons input[type=submit].b1 {
            background-color: #2963D2; }
            .wrapper .container .thankyou .buttons input[type=submit].b1:hover {
              background-color: #19489f; }
          .wrapper .container .thankyou .buttons input[type=submit].b2 {
            background-color: #0dab5f; }
            .wrapper .container .thankyou .buttons input[type=submit].b2:hover {
              background-color: #09874a; }
          .wrapper .container .thankyou .buttons input[type=submit].b3 {
            background-color: #9729d2; }
            .wrapper .container .thankyou .buttons input[type=submit].b3:hover {
              background-color: #7717aa; }
          .wrapper .container .thankyou .buttons input[type=submit]:focus {
            outline: none; }

.dob {
  width: 100%;
  display: grid;
  grid-gap: 4px;
  grid-template-columns: 72px auto 82px;
  align-items: center; }

label {
  display: block;
  width: 100%;
  text-align: left;
  color: #505050;
  margin: 0 0 8px 0; }
  label strong {
    display: inline-block;
    margin: 0 0 0 4px;
    color: red;
    font-size: 14px; }

.error_botton_msg {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 8px; }
  .error_botton_msg span {
    display: inline-flex;
    width: auto;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    font-weight: 500;
    color: #e23d3d;
    border: 1px solid #e23d3d;
    background: #ffeded;
    padding: 10px 24px;
    border-radius: 12px;
    border-left-width: 4px; }
