.fv-plugins-message-container {
  --input-invalid-color: var(--bs-danger);
  margin-top: 0.3rem;
}
.fv-plugins-message-container .fv-help-block {
  color: var(--bs-danger);
  font-size: 1rem;
  font-weight: 400;
}
.fv-plugins-message-container.valid-feedback, .fv-plugins-message-container.invalid-feedback {
  display: block;
  font-weight: 400;
}

#banner_title_contents_section .banner-title-area-col .banner-title-area span.subtitle {
  color: #797979;
  font-family: "Raleway-Bold";
  font-size: 18px;
}
#banner_title_contents_section .banner-title-area-col .banner-title-area .h-title {
  color: #000;
  font-size: 52px;
  font-family: "Lexend-SemiBold";
}
#banner_title_contents_section .banner-title-area-col .banner-title-area .h-title span {
  background: -webkit-linear-gradient(right, #004e8f 0%, #3889be 50%, #72c6ef 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
#banner_title_contents_section .banner-description-area-col {
  padding-left: 50px;
}
#banner_title_contents_section .banner-description-area-col img {
  max-width: 380px;
  display: table;
  position: absolute;
  transform: translateY(-50%);
  top: 50%;
  left: 0;
  right: 0;
}

#training_numbers_section {
  padding: 40px 0px;
  margin: 40px 0px;
  background-color: #0f75bc;
  position: relative;
}
#training_numbers_section .number-left {
  position: absolute;
  width: 20%;
  right: 0;
  bottom: 0;
}
#training_numbers_section .number-right {
  position: absolute;
  left: 0;
  top: 0;
  width: 17%;
}
#training_numbers_section .training-numbers-area .training-numbers-title {
  margin-bottom: 30px;
}
#training_numbers_section .training-numbers-area .training-numbers-title h3 {
  color: #fff;
  font-size: 28px;
}
#training_numbers_section .training-numbers-area .training-numbers-title p {
  color: #fff;
}
#training_numbers_section .training-numbers-area .training-numbers-area {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
}
#training_numbers_section .training-numbers-area .training-numbers-area .number-content-box {
  padding: 20px 30px;
  text-align: center;
}
#training_numbers_section .training-numbers-area .training-numbers-area .number-content-box .count-number {
  font-size: 45px;
  font-family: "Lexend-SemiBold";
  color: #fff;
}
#training_numbers_section .training-numbers-area .training-numbers-area .number-content-box p {
  color: #fff;
}
#training_numbers_section .training-numbers-area .training-numbers-area .two-border {
  border-right: 1px solid rgba(231, 231, 231, 0.1921568627);
  border-left: 1px solid rgba(231, 231, 231, 0.1921568627);
}
#training_numbers_section .training-numbers-area .training-numbers-area .right-border {
  border-right: 1px solid rgba(231, 231, 231, 0.1921568627);
}

.video-list img.youtube-icon {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 0;
  right: 0;
  margin: auto;
}
.video-list iframe {
  width: 100%;
  border-radius: 15px;
  border: 1px solid #edebeb;
}

h2 {
  font-family: "Raleway-SemiBold";
  font-size: 36px;
}

.ecosystem-section {
  background-color: #F0F6FC;
}
.ecosystem-section h3 {
  display: list-item;
}

.tech-learning-section .visit-channel {
  background: #0F75BC;
  display: table;
  color: #fff;
}

.wscube-section {
  background: #F0F6FC;
}
.wscube-section .wsCube-list img {
  border: 10px solid #fff;
}

.position-btn {
  background: #0F75BC;
  color: #fff;
}
.position-btn:hover {
  background: #0b6cb1;
  color: #fff;
}

.milestone-container {
  width: 1000px;
  margin: auto;
  height: 96%;
}
.milestone-container .milestone {
  width: 430px;
  margin: auto;
}
.milestone-container .milestone .svg-div {
  position: absolute;
  left: -17px;
  top: 50%;
  transform: translateY(-50%);
}
.milestone-container .milestone .line-dot {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: -80px;
}
.milestone-container .milestone1 {
  float: right;
}
.milestone-container .milestone2 {
  float: left;
  margin-top: 200px;
}
.milestone-container .milestone2 .svg-div {
  right: -17px;
  left: auto;
}
.milestone-container .milestone2 svg {
  transform: rotate(180deg);
}
.milestone-container .milestone2 .line-dot {
  right: -80px;
  left: auto;
}
.milestone-container .milestone3 {
  float: right;
  margin-top: 200px;
}
.milestone-container .milestone4 {
  float: left;
  margin-top: 200px;
}
.milestone-container .milestone4 .svg-div {
  right: -17px;
  left: auto;
}
.milestone-container .milestone4 svg {
  transform: rotate(180deg);
}
.milestone-container .milestone4 .line-dot {
  right: -80px;
  left: auto;
}
.milestone-container .milestone5 {
  float: right;
  margin-top: 200px;
}
.milestone-container .milestone6 {
  float: left;
  margin-top: 200px;
}
.milestone-container .milestone6 .svg-div {
  right: -17px;
  left: auto;
}
.milestone-container .milestone6 svg {
  transform: rotate(180deg);
}
.milestone-container .milestone6 .line-dot {
  right: -80px;
  left: auto;
}
.milestone-container .milestone7 {
  float: right;
  margin-top: 200px;
}
.milestone-container .milestone8 {
  float: left;
  margin-top: 200px;
}
.milestone-container .milestone8 .svg-div {
  right: -17px;
  left: auto;
}
.milestone-container .milestone8 svg {
  transform: rotate(180deg);
}
.milestone-container .milestone8 .line-dot {
  right: -80px;
  left: auto;
}
.milestone-container .milestone9 {
  float: right;
  margin-top: 200px;
}
.milestone-container .milestone10 {
  float: left;
  margin-top: 200px;
}
.milestone-container .milestone10 .svg-div {
  right: -17px;
  left: auto;
}
.milestone-container .milestone10 svg {
  transform: rotate(180deg);
}
.milestone-container .milestone10 .line-dot {
  right: -80px;
  left: auto;
}
.milestone-container .milestone11 {
  float: right;
  margin-top: 200px;
}
.milestone-container .milestone12 {
  float: left;
  margin-top: 200px;
}
.milestone-container .milestone12 .svg-div {
  right: -17px;
  left: auto;
}
.milestone-container .milestone12 svg {
  transform: rotate(180deg);
}
.milestone-container .milestone12 .line-dot {
  right: -80px;
  left: auto;
}
.milestone-container .milestone13 {
  float: right;
  margin-top: 200px;
}
.milestone-container .milestone14 {
  float: left;
  margin-top: 200px;
}
.milestone-container .milestone14 .svg-div {
  right: -17px;
  left: auto;
}
.milestone-container .milestone14 svg {
  transform: rotate(180deg);
}
.milestone-container .milestone14 .line-dot {
  right: -80px;
  left: auto;
}
.milestone-container .milestone15 {
  float: right;
  margin-top: 200px;
}
.milestone-container .line-contr {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  width: 3px;
  bottom: 0;
  margin: auto;
  background: #EFEFEF;
}

@media (max-width: 1199px) {
  .milestone-container {
    width: auto;
  }
  .milestone-container .line-contr {
    display: none;
  }
  .milestone-container .milestone {
    float: none !important;
    margin-top: 35px !important;
    width: 100%;
  }
  .milestone-container .milestone .line-dot {
    display: none;
  }
  .milestone-container .milestone .svg-div {
    left: 0;
    top: auto;
    bottom: -20px;
    right: 0;
    transform: rotate(-90deg) !important;
  }
  .milestone-container .milestone2 .svg-div,
  .milestone-container .milestone4 .svg-div,
  .milestone-container .milestone6 .svg-div,
  .milestone-container .milestone8 .svg-div,
  .milestone-container .milestone10 .svg-div,
  .milestone-container .milestone12 .svg-div {
    transform: rotate(90deg) !important;
  }
}
@media (max-width: 991px) {
  #banner_title_contents_section .banner-title-area-col .banner-title-area .h-title {
    font-size: 32px;
  }
  h2 {
    font-size: 28px;
  }
}
@media (max-width: 767px) {
  #learning_add_section {
    margin-top: 30px;
    margin-bottom: 30px;
  }
  #training_numbers_section {
    padding: 30px 0px;
    padding-bottom: 0;
  }
  #training_numbers_section .training-numbers-area .training-numbers-area {
    grid-template-columns: repeat(2, 1fr);
  }
  #training_numbers_section .training-numbers-area .training-numbers-area .number-content-box .count-number {
    font-size: 24px;
  }
  #training_numbers_section .training-numbers-area .training-numbers-area .two-border {
    border: none;
  }
  #training_numbers_section .training-numbers-area .training-numbers-area .right-border {
    border: none;
  }
  #banner_title_contents_section .banner-description-area-col img {
    display: inline;
    position: initial;
    transform: none;
    text-align: left;
  }
  #banner_title_contents_section .banner-title-area-col .banner-title-area .h-title {
    font-size: 24px;
  }
  h2 {
    font-size: 21px;
  }
  #banner_title_contents_section .banner-description-area-col {
    padding-left: 10px;
  }
  .wscube-section .wsCube-list img {
    border: 3px solid #fff;
  }
}
@media (max-width: 767px) {
  html:lang(ar) .join-us-section .text-start {
    text-align: right !important;
  }
}