* {
  margin: 0;
  padding: 0;
}
body {
  font-family: Noto Sans;
  background-color: #fff;
}

/*Service 1*/
.service-1-container {
  display: flex;
  justify-content: center;
  margin: 5em 0em 0em 0em;
}
.service-1-container-aligment {
  display: flex;
  flex-direction: column;
  width: 85%;
}

.service-1-content-container {
  display: flex;
  background-color: #fff;
}
.title-container {
  background-color: #012258;
  width: 100%;
  border-radius: 1em 1em 0em 0em;
  font-size: 1.5em;
  padding: 1em;
}
.title-steps-container h3 {
  letter-spacing: 0.1em;
  padding: 1em 1em 1em 1em;
  border-radius: 1em;
  color: #fff;
  background-color: #1e5bbf;
  margin: 1em 0em 3em 0em;
}

.service-1-content-container {
  display: flex;
  /* border-top: 6px solid #1e5bbf;
  border-left: 6px solid #1e5bbf;
  border-right: 6px solid #1e5bbf;
  border-bottom: 6px solid #1e5bbf; */
  border-radius: 0em 1em 1em 1em;
  padding: 2em;
}
.service-1-image-container {
  width: 45%;
}

.service-1-text-steps-container {
  display: flex;
  flex-direction: column;
  width: 55%;
  margin: 0em 0em 4em 0em;
}
.paragraph-container {
  height: 60%;
  width: 100%;
}
.service-1-text {
  line-height: 2em;
  font-size: 1.2em;
  margin: 1.5em 0em 2em 0em;
}
.title-steps-container {
  margin: 1em 0em 3em 0em;
}
.steps-container {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 40%;
  width: 100%;
}

.step-1,
.step-2,
.step-3 {
  text-align: center;
  align-content: center;
  width: 100%;
  height: 7em;
  border: 2px solid #000000;
  border-radius: 0.5em 0.5em 0.5em 0.5em;
}
.step-line-container {
  display: flex;
  justify-content: center;
  align-items: center;
}
.step-line {
  align-content: center;
  background-color: #000000;
  height: 0.13em;
  width: 10em;
}
.steps-text {
  font-size: 0.9em;
  color: #000;
  font-weight: 600;
  letter-spacing: 0.1em;
}
/*Service 1 End*/

/*Service 2 - 3 Horizontal Containers*/

.services-2-3-container {
  /* border: 3px solid red; */
  margin: 2em 0em 5em 0em;
  display: flex;
  justify-content: center;
}

.services-2-3-container-aligment {
  display: flex;
  justify-content: space-around;
  width: 85%;
}

.service-2-container {
  display: flex;
  flex-direction: column;
  width: 40%;
  /* border: 1px solid green; */
}
.service-3-container {
  display: flex;
  flex-direction: column;
  width: 40%;
  /* border: 1px solid green; */
}

/*Service 2*/
.service-2-title-container {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  background-color: #012258;
  font-size: 1.5em;
  border-radius: 1em 1em 0em 0em;
}
.service-2-title-container h3 {
  font-weight: 400;
  letter-spacing: 0.1em;
  color: #fff;
  padding: 1em 1em 1em 1em;
}
.service-2-image-container {
  display: flex;
  justify-content: center;
  margin: 2em 0em 4em 0em;
}
.title-container-2 {
  letter-spacing: 0.1em;
  padding: 1em 1em 1em 1em;
  border-radius: 1em;
  color: #fff;
  background-color: #1e5bbf;
  margin: 1em 0em 3em 0em;
}
.service-2-steps-numbers {
  color: #000000;
  font-size: 1.5em;
  margin: 0em 1em 0em 0em;
}
.service-2-steps {
  border: 1px solid #000000;
  color: #000000;
  margin: 0em 0em 2em 0em;
  padding: 1em 1em 1em 1em;
  border-radius: 1em;
  font-size: 0.9em;
  letter-spacing: 0.1em;
  font-weight: 600;
}
.service-2-steps:hover {
  background-color: #1e5bbf;
  color: #fff;
}
.service-2-paragraph-container {
  margin: 3em 0em 0em 0em;
}
.service-2-paragraph {
  font-size: 1.2em;
  line-height: 2em;
  margin: 1em 0em 1em 0em;
}

/*Service 3*/
.service-3-title-container {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  background-color: #012258;
  font-size: 1.5em;
  border-radius: 1em 1em 0em 0em;
}
.service-3-title-container h3 {
  font-weight: 400;
  letter-spacing: 0.1em;
  color: #fff;
  padding: 1em 1em 1em 1em;
}
.service-3-image-container {
  display: flex;
  justify-content: center;
  margin: 2em 0em 4em 0em;
}
.title-container-3 {
  letter-spacing: 0.1em;
  padding: 1em 1em 1em 1em;
  border-radius: 1em;
  color: #fff;
  background-color: #1e5bbf;
  margin: 1em 0em 3em 0em;
}
.service-3-steps-numbers {
  color: #000000;
  font-size: 1.5em;
  margin: 0em 1em 0em 0em;
}
.service-3-steps {
  border: 1px solid #000000;
  color: #000000;
  margin: 0em 0em 2em 0em;
  padding: 1em 1em 1em 1em;
  border-radius: 1em;
  font-size: 0.9em;
  letter-spacing: 0.1em;
  font-weight: 600;
}
.service-3-steps:hover {
  background-color: #1e5bbf;
  color: #fff;
}
.service-3-paragraph-container {
  margin: 3em 0em 0em 0em;
}
.service-3-paragraph {
  line-height: 2em;
  font-size: 1.2em;
  margin: 1em 0em 1em 0em;
}
.service-3-list {
  font-size: 1.2em;
  margin: 2em 0em 2em 2em;
}
.service-3-list li {
  margin: 1em 0em 0em 0em;
}

/*Service 4*/
.service-4-container {
  display: flex;
  justify-content: center;
  margin: 5em 0em 0em 0em;
}
.service-4-container-aligment {
  display: flex;
  flex-direction: column;
  width: 85%;
}

.service-4-content-container {
  display: flex;
  background-color: #fff;
}
.title-container {
  background-color: #012258;
  width: 100%;
  border-radius: 1em 1em 0em 0em;
  font-size: 1.5em;
  padding: 1em;
}
.title-container h3 {
  font-weight: 400;
  letter-spacing: 0.1em;
  color: #fff;
}

.service-4-content-container {
  display: flex;
  /* border-top: 6px solid #1e5bbf;
  border-left: 6px solid #1e5bbf;
  border-right: 6px solid #1e5bbf;
  border-bottom: 6px solid #1e5bbf; */
  border-radius: 0em 1em 1em 1em;
  padding: 2em;
}
.service-4-image-container {
  width: 45%;
}

.service-4-text-steps-container {
  display: flex;
  flex-direction: column;
  width: 55%;
  margin: 0em 0em 4em 0em;
}
.paragraph-container {
  height: 60%;
  width: 100%;
}
.service-4-text {
  line-height: 2em;
  font-size: 1.2em;
  margin: 1.5em 0em 2em 0em;
}

.steps-container-4 {
  display: flex;
  justify-content: space-between;
  align-items: center;
  height: 40%;
  width: 100%;
}
.service-4-step-1,
.service-4-step-2,
.service-4-step-3,
.service-4-step-4 {
  text-align: center;
  align-content: center;
  width: 100%;
  height: 7em;
  border: 2px solid #000000;
  border-radius: 0.5em 0.5em 0.5em 0.5em;
  margin: 0em 2em 0em 2em;
  padding: 0em 2em 0em 2em;
}
.steps-text {
  font-size: 0.9em;
  color: #000;
  font-weight: 600;
  letter-spacing: 0.1em;
}
.title-steps-container-4 h3 {
  letter-spacing: 0.1em;
  padding: 1em 1em 1em 1em;
  border-radius: 1em;
  color: #fff;
  background-color: #1e5bbf;
  margin: 1em 0em 3em 0em;
}
/*Service 4 End*/

/*Footer*/

.social-media-links {
  text-decoration: none;
  color: #fff;
}

/*Responsive*/
@media (min-width: 340px) and (max-width: 600px) {
  .nohoverlogo {
    width: 1em;
    margin: 0em;
    padding: 0em;
  }

  .sidebar-text a {
    color: #000000;
  }
  .service-1-container {
    width: 100%;
  }
  .title-container {
    font-size: 1.1em;
  }
  .service-1-container-aligment {
    align-items: center;
  }
  .service-1-content-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 80%;
    padding: 0em;
  }
  .service-1-image-container {
    display: flex;
    justify-content: center;
  }
  .service-1-image {
    width: 10em;
  }
  .service-1-text-steps-container {
    display: flex;
    flex-direction: column;
    width: 100%;
    padding: 0em;
    margin: 0em;
  }
  .title-container {
    width: 100%;
  }

  .steps-container {
    display: flex;
    flex-direction: column;
    margin: -2em 0em 0em 0em;
  }
  .step-1,
  .step-2,
  .step-3 {
    margin: 2em 0em 0em 0em;
  }
  .step-line {
    display: none;
  }

  .service-1-text {
    font-size: 1em;
  }
  /*------------------------------------------*/
  .services-2-3-container-aligment {
    display: flex;
    flex-direction: column;
    align-items: center;
  }

  .service-2-container {
    display: flex;
    flex-direction: column;
    width: 100%;
  }

  .service-2-image-container {
    display: flex;
    justify-content: center;
  }
  .service-2-image {
    width: 10em;
  }

  .service-2-paragraph {
    font-size: 1em;
    margin: 0em 0em 4em 0em;
  }

  /*-----------------------------------------------*/
  .service-3-container {
    display: flex;
    flex-direction: column;
    width: 100%;
  }

  .service-3-image-container {
    display: flex;
    justify-content: center;
  }
  .service-3-image {
    width: 10em;
  }

  .service-3-paragraph {
    font-size: 1em;
    margin: 0em 0em 4em 0em;
  }

  /*--------------------------------------------------*/

  .service-4-container {
    width: 100%;
  }
  .service-4-container-aligment {
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  .service-4-content-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 0em;
  }
  .service-4-text-steps-container {
    display: flex;
    flex-direction: column;
    width: 100%;
  }
  .service-4-image-container {
    justify-content: center;
  }
  .service-4-image {
    width: 10em;
  }
  .steps-container-4 {
    display: flex;
    flex-direction: column;
  }
  /*Steps*/
  .service-4-step-1,
  .service-4-step-2,
  .service-4-step-3,
  .service-4-step-4 {
    width: 80%;
    margin: 2em 0em 0em 0em;
  }
  /*End Steps*/

  .service-4-text {
    width: 100%;
    font-size: 1em;
  }

  /*Footer*/
  .col {
    margin: 0em 0em 4em 0em;
  }
  .footer-link-holder {
    margin: 0em 0em 2em 0em;
  }
  .footer-list-manager li:first-child {
    margin: 3em 0em 0em 0em;
  }

  .footer-slogan {
    font-size: 0.8em;
  }
}

@media (min-width: 601px) and (max-width: 1024px) {
  .hideOnMobile {
    display: none;
  }
  .menu-button {
    display: block;
  }
  footer {
    bottom: unset;
  }
  .col {
    flex-basis: 100%;
  }
  .nohoverlogo {
    width: 1em;
    margin: 0em;
    padding: 0em;
  }
  .sidebar-text a {
    color: #000000;
  }
  .service-1-container {
    width: 100%;
  }
  .title-container {
    font-size: 1.1em;
  }
  .service-1-container-aligment {
    align-items: center;
  }
  .service-1-content-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 80%;
    padding: 0em;
  }
  .service-1-image-container {
    display: flex;
    justify-content: center;
  }
  .service-1-image {
    width: 10em;
  }
  .service-1-text-steps-container {
    display: flex;
    flex-direction: column;
    width: 100%;
    padding: 0em;
    margin: 0em;
  }
  .title-container {
    width: 100%;
  }

  .steps-container {
    display: flex;
    flex-direction: column;
    margin: -2em 0em 0em 0em;
  }
  .step-1,
  .step-2,
  .step-3 {
    margin: 2em 0em 0em 0em;
  }
  .step-line {
    display: none;
  }

  .service-1-text {
    font-size: 1em;
  }
  /*------------------------------------------*/
  .services-2-3-container-aligment {
    display: flex;
    flex-direction: column;
    align-items: center;
  }

  .service-2-container {
    display: flex;
    flex-direction: column;
    width: 100%;
  }

  .service-2-image-container {
    display: flex;
    justify-content: center;
  }
  .service-2-image {
    width: 10em;
  }

  .service-2-paragraph {
    font-size: 1em;
    margin: 0em 0em 4em 0em;
  }

  /*-----------------------------------------------*/
  .service-3-container {
    display: flex;
    flex-direction: column;
    width: 100%;
  }

  .service-3-image-container {
    display: flex;
    justify-content: center;
  }
  .service-3-image {
    width: 10em;
  }

  .service-3-paragraph {
    font-size: 1em;
    margin: 0em 0em 4em 0em;
  }

  /*--------------------------------------------------*/

  .service-4-container {
    width: 100%;
  }
  .service-4-container-aligment {
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  .service-4-content-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 0em;
  }
  .service-4-text-steps-container {
    display: flex;
    flex-direction: column;
    width: 100%;
  }
  .service-4-image-container {
    justify-content: center;
  }
  .service-4-image {
    width: 10em;
  }
  .steps-container-4 {
    display: flex;
    flex-direction: column;
  }
  /*Steps*/
  .service-4-step-1,
  .service-4-step-2,
  .service-4-step-3,
  .service-4-step-4 {
    width: 80%;
    margin: 2em 0em 0em 0em;
  }
  /*End Steps*/

  .service-4-text {
    width: 100%;
    font-size: 1em;
  }

  /*Footer*/
  .col {
    margin: 0em 0em 4em 0em;
  }
  .footer-link-holder {
    margin: 0em 0em 2em 0em;
  }
  .footer-list-manager li:first-child {
    margin: 3em 0em 0em 0em;
  }

  .footer-slogan {
    font-size: 0.8em;
  }
}

@media (max-width: 319px) {
  .sidebar {
    width: 100%;
  }
}