@charset "UTF-8";

/*———————————–———————————–
  Overwrite Bootstrap
———————————–———————————–*/

body {
  border-top: 5px solid rgba(142, 68, 173, 1);
  font-family: 'Alegreya Sans', sans-serif;
  font-weight: 300;
  font-size: 18px;
}
code {
  color: inherit;
  font-size: 80%;
  background-color: #F5DDFF;
}
.btn-primary {
  border-color: #804897 !important;
  background-color: #9b59b6 !important;
  color: #FFF !important;
}
.btn-primary:hover {
  border-color: #783892 !important;
  background-color: #8e44ad !important;
  color: #FFF !important;
}
.hljs {
  padding: 0;
  background: transparent;
}
.lead {
  font-size: 24px;
}

/*———————————–———————————–
  Styles
———————————–———————————–*/

.main-padding {
  padding-top: 100px;
}
main {
  padding-bottom: 100px;
}
.space-lg {
  margin-top: 45px;
}
.space-md {
  margin-top: 30px;
}
.space-sm {
  margin-top: 15px;
}
.title, .subheading {
  font-family: 'Gentium Book Basic', serif;
  font-style: italic;
  font-weight: 400;
}
.title {
  font-size: 50px;
}
.extension {
  color: rgba(142, 68, 173, 1);
}
.subheading {
  font-size: 35px;
  text-align: center;
}
.example-step1 > img,
.example-step2 > button {
  margin: 15px 0 30px;
}
.example-step2 > p:last-child {
  margin-top: 30px;
}
.example-multiple button + button {
  margin-left: 15px;
}
.example-multiple img + img {
  margin-left: 10px;
}