*
{
  font-family: Arial;
  font-size: 1.5rem;
  font-weight: normal;
  margin: 0;
  padding: 0;
  max-width: 100%;
}

strong
{
  font-weight: bold;
}

:root
{
  font-size: 14.4px;
}

.banner
{
  background-color: deepskyblue;
  height: 10rem;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
}

.uvv > img
{
  background-color: white;
  height: 6rem;
  left: calc(50% - 13rem);
  object-fit: fill;
  padding: 2rem 3rem;
  position: absolute;
  top: 0rem;
  width: 20rem;
  z-index: 1;
}

img
{
  object-fit: contain;
  height: 100%;
}

.pad
{
  position: relative;
}

.pad > a
{
  position: absolute;
  top: -8rem;
}

.navigation
{
  background-color: deepskyblue;
  display: flex;
  justify-content: space-between;
  left: 0;
  position: fixed;
  top : 0;
  width: 100%;
}

.grouping
{
  display: flex;
  justify-content: space-between;
}

.section
{
  font-weight: bold;
  padding: 1rem;
}

.sectionplus
{
  background-color: deepskyblue;
  display: none;
  line-height: 1.5rem;
  padding: 0 1rem 0 1rem;
  position: absolute;
  right: 0;
  text-align: right;
}

.sectionplus *
{
  font-size: 0.8rem;
}

.section:hover .sectionplus
{
  display: block;
}

a
{
  color: black;
  font-weight: bold;
  text-decoration: none;
}

a:hover
{
  color: blue;
}

body
{
  background-color: darkblue;
  margin: 0;
  position: relative;
}

main
{
  background-color: white;
  margin: 0 calc(50% - 500px);
  padding: 12% 5% 5% 5%;
  position: absolute;
  top: 10rem;
  z-index: -2;
}

main > *
{
  padding-bottom: 4rem;
}

.slogan
{
  font-family: Comic Sans textile, cursive;
  left: 15%;
  position: absolute;
  text-align: center;
  top: 15rem;
  width: 70%;
  z-index: -1;
}

.title
{
  border-top: 2px solid black;
  font-size: 2.5rem;
  font-weight: bold;
  padding: 3rem 0 3rem 0;
}

.spacer
{
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 3rem;
}

.spacer > img
{
  width: 30%;
}

.text
{
  padding: 0 2rem;
  width: 60%;
}

.text-full
{
  margin-bottom: 3rem;
  padding: 0 2rem;
}

.person
{
  font-size: 1.75rem;
  font-weight: bold;
  margin-bottom: 4rem;
}

.name
{
  font-size: 2rem;
  font-weight: bold;
  margin-bottom: 2rem;
}

.surround
{
  padding: 2rem;
}

.service-head
{
  display: flex;
  justify-content: center;
}

.service-type
{
  background-color: deepskyblue;
  border: 0.2rem solid black;
  border-width: 0.4rem 0.2rem;
  display: inline-block;
  font-size: 1.2rem;
  font-weight: bold;
  margin: 0;
  outline: none;
  padding: 1rem;
  text-align: center;
  width: 16.6667%;
}

.service-type:hover
{
  background-color: darkblue  !important;
  color: white                !important;
  cursor: pointer             !important;
}

.description
{
  background-color: white;
  height: 125rem;
  position: relative;
}

@media only screen and (max-width: 1000px)
{
  .sectionplus
  {
    display: block;
  }
  .banner
  {
    position: fixed;
  }
  .uvv > img
  {
    position: fixed;
  }
  :root
  {
    font-size: 1.44vw;
  }
  main
  {
    margin: 0 0;
  }
}

@media only screen and (min-width: 1440px)
{
  main
  {
    margin: 0 15%;
  }
}

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active)
{
  main
  {
    width: calc(981.8px - 8.18%);
    margin: 0 max(0%, calc(49.1% - 491px));
    padding: 12% 5% 5% 5%;
  }
  .description
  {
    width: 90%;
  }
  .type
  {
    width: 96.5%;
  }
  .service-type
  {
    font-size: 1.1rem;
  }
  @media only screen and (max-width: 1024px)
  {
    main
    {
      margin: 0 0;
      width: 90%;
    }
  }
}

.tip
{
  font-size: 1rem;
  font-style: italic;
}

.type
{
  display: none;
  left: 0;
  max-width: 100%;
  padding: 4rem;
  position: absolute;
  top: 6.75rem;
}

.quote
{
  background: linear-gradient(to bottom right, darkblue, purple);
  border-radius: 4rem;
  color: white;
  font-family: Comic Sans textile, cursive;
  font-weight: bold;
  padding: 2rem;
  text-align: center;
}

.motivation
{

}

.offer
{

}

.type > *
{
  margin-top: 4rem;
}

.subtitle
{
  font-size: 2rem;
  font-weight: bold;
}

.examples
{

}

.example
{
  display: flex;
  justify-content: space-between;
  margin: 3rem 0;
  max-height: 15rem;
}

.example > *
{
  border-radius: 3rem;
  font-size: 1.2rem;
  padding: 1rem;
  text-align: center;
  width: 30%;
}

.problem
{
  background-color: crimson;
}

.solution
{
  background-color: limegreen;
}
