
.users{
  padding-left:5vw;
  padding-right:5vw;
  padding-top:5vw;
}

.users h1{
  text-align:center;
}
.users .personas{
  display:flex;
  flex-wrap:wrap;
  justify-content:space-between;
  margin-top:5vw
}
.users .personas div{
  max-width:300px;
  padding:10px;
  position:relative;
  margin:auto;
}
.persona1{
  color:#D2597F
}
.persona2{
  color:#4FBAD9
}
.persona3{
  color:#A1CB60
}
.persona4{
  color:#F3D24A
}


/** Umbrella manual styles **/

#toc-wrapper .blog {
  background-color: #fff; 
}

#toc-wrapper .blog-single {
  margin: 0;
  border-radius: 0;
  background-color: white;
  box-shadow: 0 0 0 0 rgba(0, 0, 0, 0);
  padding: 0; }

#toc-wrapper .content {
  padding: 50px 0; }
  .content h1, .content h2, .content h3, .content h4, .content h5, .content h6 {
    margin-bottom: 20px; }

#toc-wrapper img {
    margin:0;
    display:inline;
    padding:0;
    border:none;
    vertical-align:middle;
  width:240px;
  margin:10px;
  border:1px solid #eee;
}

#toc-wrapper .fullwidth img {
    width: 90%;
}

#toc-wrapper h3 {
  font-size: 1.4em;
font-weight: bold;
color: #B83657;
}

#toc-wrapper p, #toc-wrapper li {
color: #333;
}


#toc-wrapper table td, #toc-wrapper table th{
padding: 10px;
border: 1px solid #ddd;
}

#toc-wrapper table {
margin-bottom: 20px;
}

.ca-menu {
  padding: 0;
  margin: 20px auto;
}

#toc {
  top: 10%;
  right: 0;
  bottom: 0;
  left: auto;
  width: 20%;
  background-color: #fff;
  padding: 20px;
  position: absolute;
  z-index: 0;
  display: none;
}

#toc::before {
  content: "";
  top: 15%;
  bottom: 15%;
  left: -1px;
  width: 1px;
  background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, rgba(227,224,216,0)), color-stop(20%, #e3e0d8), color-stop(80%, #e3e0d8), color-stop(100%, rgba(227,224,216,0)));
  background: -webkit-linear-gradient(top, rgba(227,224,216,0) 0%,#e3e0d8 20%,#e3e0d8 80%,rgba(227,224,216,0) 100%);
  background: -moz-linear-gradient(top, rgba(227,224,216,0) 0%,#e3e0d8 20%,#e3e0d8 80%,rgba(227,224,216,0) 100%);
  background: -o-linear-gradient(top, rgba(227,224,216,0) 0%,#e3e0d8 20%,#e3e0d8 80%,rgba(227,224,216,0) 100%);
  background: linear-gradient(top, rgba(227,224,216,0) 0%,#e3e0d8 20%,#e3e0d8 80%,rgba(227,224,216,0) 100%);
}

#toc-inner {
  display: table-cell;
  vertical-align: middle;
}

.nav-list, #TableOfContents ul {
  height: 50%;
  padding-left: 1em;
  margin: auto 0;
}

#TableOfContents li {
  font-size: 15.8px; 
}

.sidebar-header-3 {
  margin-left: 1em;
}

div.clear {
  clear: both;
}


#toc-wrapper .blog{
  max-width: 950px;
  color: #000;
}

#toc-wrapper ul.list, ol.list {
  padding-left: 3.333em;
  max-width: 580px;
}


@media (min-width: 43.75em) {
  #toc-wrapper .blog {
    max-width: 950px;
    padding: 20px 50px;
  }
}

@media (min-width: 73em) {
  #toc {
    display: table;
  }
}

@media (max-width: 73em) {
  #toc {
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    position: relative;
    z-index: 0;
    display: table;
   }
}
