/* From Uiverse.io by dovatgabriel */ 
.group {
 position: relative;
}

.input {
 font-size: 16px;
 padding: 10px 10px 10px 5px;
 display: block;
 width: 100%;
 border: none;
 border-bottom: 1px solid #515151;
 background: transparent;
 color: #ffffff
}

.input:focus {
 outline: none;
}

label {
 color: #999;
 font-size: 18px;
 font-weight: normal;
 position: absolute;
 pointer-events: none;
 left: 5px;
 top: 10px;
 transition: 0.2s ease all;
 -moz-transition: 0.2s ease all;
 -webkit-transition: 0.2s ease all;
}

.input:focus ~ label, .input:valid ~ label {
 top: -20px;
 font-size: 14px;
 color: #9146ff;
}

.bar {
 position: relative;
 display: block;
 width: 200px;
}

.bar:before, .bar:after {
 content: '';
 height: 2px;
 width: 0;
 bottom: 1px;
 position: absolute;
 background: transparent;
 transition: 0.2s ease all;
 -moz-transition: 0.2s ease all;
 -webkit-transition: 0.2s ease all;
}

.bar:before {
 left: 50%;
}

.bar:after {
 right: 50%;
}

.input:focus ~ .bar:before, .input:focus ~ .bar:after {
 width: 50%;
}

.highlight {
 position: absolute;
 height: 60%;
 width: 100px;
 top: 25%;
 left: 0;
 pointer-events: none;
 opacity: 0.5;
}

.input:focus ~ .highlight {
 animation: inputHighlighter 0.3s ease;
}

@keyframes inputHighlighter {
 from {
  background: #000000;
 }

 to {
  width: 0;
  background: transparent;
 }
}

ul{
    list-style: disc;
}

ul li{
    list-style-type: disc;
    margin-left: 20px;
    
}

li ul li{
    list-style: upper-alpha;
    margin-left: 20px;
}

ol{
    list-style: decimal;
    margin-left: 20px;
}



.rbullet{
    list-style: lower-alpha;
}

.sbullet{
    list-style: upper-roman;
}

.tbullet{
    list-style: disc;
}

.ubullet{
    list-style: square;
}

.vbullet{
    list-style: circle;
}

li::marker {
  color: #ffffff !important;
}