html {
  scroll-behavior: smooth;
  font-size: 62.5%; }

body {
  margin: 0;
  font-size: 1.8rem;
  padding: 0;
  font-family: 'Poppins', sans-serif; }

h1, h2, h3, h4, h5, h6, p {
  margin: 0; }

button {
  background-color: white;
  border: none;
}

button:hover {
  background-color: lightgray;
}

section.purple {
  background-color:  #3CB371;
  color: white;
}

section.red {
  background-color:  #DC143C;
  color: white;
}

section.red h1 {
  color: black;
  font-weight: 800;
}

section.purple h1 {
  color: black;
  font-weight: 800;
}

section.purple h2 {
  color: black;
  font-size: 8rem;
  font-weight: 800;
}

section.purple p {
  color: black;

}

section.white {
  background-color: white;
  color: black; }

section.padded {
  padding-top: 0rem;
  padding-bottom: 10rem; }

section.hero {
  background-color:   #a366ff;
  background-size:     cover;
  background-repeat:   no-repeat;
  background-position: center center;
  width: 100%;
  height: 100vh;
  padding-top: 30rem;
  padding-bottom: 30rem;

}

section.hero button {
  height:5rem;
  width:20%;
}

section.hero h1 {
  font-size: 7rem;
  font-weight: 800;

}

section.hero h2 {
  font-size: 4rem;
  font-weight: 500;

}

section.hero h3 {
  font-size: 7rem;
  font-weight: 800;
  color: white;
}

section.hero h5 {
  font-size: 150%;
  font-weight: 800;
}

section.hero p {
  color: white;
}

@media (max-width: 20rem) {

    section.hero h1 {
      font-size: 4rem;
      font-weight: 800;
    }

    section.hero h2 {
      font-size: 2rem;
      font-weight: 500;
    }

    section.hero h3 {
      font-size: 4rem;
      font-weight: 800;
      color: white;
    }

    section.hero h5 {
      font-size: .5rem;
      font-weight: 800;
    }

    section.hero p {
      font-size: 1rem;
      color: white;
    }

    section.hero p {
      color: white;
    }

    section.hero {
      padding-top: 12rem;
      padding-bottom: 30rem;
    }

    section.hero button {
      height:5rem;
      width:65%;
    }

}

@media (max-width: 60rem) {

    section.hero h1 {
      font-size: 4rem;
      font-weight: 800;
    }

    section.hero h2 {
      font-size: 2rem;
      font-weight: 500;
    }

    section.hero h3 {
      font-size: 4rem;
      font-weight: 800;
      color: white;
    }

    section.hero h5 {
      font-size: 1.5rem;
      font-weight: 800;
    }

    section.hero p {
      color: white;
    }

    section.hero p {
      color: white;
    }

    section.hero {
      padding-top: 12rem;
      padding-bottom: 30rem;
    }

    section.hero button {
      height:5rem;
      width:65%;
    }

}

.sticky-container{
    padding:0px;
    margin:0px;
    position:fixed;
    right:-130px;
    top:350px;
    width:210px;
    z-index: 1100;
}
.sticky li{
    list-style-type:none;
    background-color:#fff;
    color:#efefef;
    height:43px;
    padding:0px;
    margin:0px 0px 1px 0px;
    -webkit-transition:all 0.25s ease-in-out;
    -moz-transition:all 0.25s ease-in-out;
    -o-transition:all 0.25s ease-in-out;
    transition:all 0.25s ease-in-out;
    cursor:pointer;
}
.sticky li:hover{
    margin-left:-115px;
}
.sticky li img{
    float:left;
    margin:5px 4px;
    margin-right:5px;
}
.sticky li p{
    padding-top:5px;
    margin:0px;
    line-height:16px;
    font-size:11px;
}
.sticky li p a{
    text-decoration:none;
    color:#2C3539;
}
.sticky li p a:hover{
    text-decoration:underline;
}

.progress-bar {
    height: 100%;
    width: 0;
    color: #fff;
    background-color: black;
    transition: width .6s ease;
}

.progress {
    height: 1em;
    width: 100%;
    background-color: #f5f5f5;
    border-radius: 4px;
    box-shadow: inset 0 1px 2px rgba(0,0,0,.1);
}

section.content .container .row, section.content .container-fluid .row {
  padding-top: 3rem; }
  section.content .container .row .border-white, section.content .container-fluid .row .border-white {
    border: 0.1rem solid white; }
  section.content .container .row .border-black, section.content .container-fluid .row .border-black {
    border: 0.1rem solid black; }
  section.content .container .row .column-pad, section.content .container-fluid .row .column-pad {
    padding-top: 2rem; }