/*!Spectre.css Icons | MIT License | github.com/picturepan2/spectre*/.icon {
 box-sizing:border-box;
 display:inline-block;
 font-size:inherit;
 font-style:normal;
 height:1em;
 position:relative;
 text-indent:-999rem;
 vertical-align:middle;
 width:1em
}
.icon::before,
.icon::after {
 display:block;
 left:50%;
 position:absolute;
 top:50%;
 -webkit-transform:translate(-50%,-50%);
 -ms-transform:translate(-50%,-50%);
 transform:translate(-50%,-50%)
}
.icon-arrow-down::before,
.icon-arrow-left::before,
.icon-arrow-right::before,
.icon-arrow-up::before,
.icon-downward::before,
.icon-back::before,
.icon-forward::before,
.icon-upward::before {
 border:.2rem solid currentColor;
 border-bottom:0;
 border-right:0;
 content:"";
 height:.65em;
 -webkit-transform:translate(-25%,-50%) rotate(-45deg);
 -ms-transform:translate(-25%,-50%) rotate(-45deg);
 transform:translate(-25%,-50%) rotate(-45deg);
 width:.65em
}
.icon-arrow-down,
.icon-downward {
 -webkit-transform:rotate(-90deg);
 -ms-transform:rotate(-90deg);
 transform:rotate(-90deg)
}
.icon-arrow-right,
.icon-forward {
 -webkit-transform:rotate(180deg);
 -ms-transform:rotate(180deg);
 transform:rotate(180deg)
}
.icon-arrow-up,
.icon-upward {
 -webkit-transform:rotate(90deg);
 -ms-transform:rotate(90deg);
 transform:rotate(90deg)
}
.icon-downward::before,
.icon-back::before,
.icon-forward::before,
.icon-upward::before {
 -webkit-transform:translate(-50%,-50%) rotate(-45deg);
 -ms-transform:translate(-50%,-50%) rotate(-45deg);
 transform:translate(-50%,-50%) rotate(-45deg)
}
.icon-downward::after,
.icon-back::after,
.icon-forward::after,
.icon-upward::after {
 background:currentColor;
 content:"";
 height:.2rem;
 left:55%;
 width:.8em
}
.icon-caret::before {
 border-left:.3em solid transparent;
 border-right:.3em solid transparent;
 border-top:.3em solid currentColor;
 content:"";
 height:0;
 -webkit-transform:translate(-50%,-25%);
 -ms-transform:translate(-50%,-25%);
 transform:translate(-50%,-25%);
 width:0
}
.icon-menu::before {
 background:currentColor;
 box-shadow:0 -.35em,0 .35em;
 content:"";
 height:.2rem;
 width:100%
}
.icon-apps::before {
 background:currentColor;
 box-shadow:-.35em -.35em,-.35em 0,-.35em .35em,0 -.35em,0 .35em,.35em -.35em,.35em 0,.35em .35em;
 content:"";
 height:.3rem;
 width:.3rem
}
.icon-resize-horiz::before,
.icon-resize-vert::before,
.icon-resize-horiz::after,
.icon-resize-vert::after {
 border:.2rem solid currentColor;
 border-bottom:0;
 border-right:0;
 content:"";
 height:.45em;
 width:.45em
}
.icon-resize-horiz::before,
.icon-resize-vert::before {
 -webkit-transform:translate(-50%,-90%) rotate(45deg);
 -ms-transform:translate(-50%,-90%) rotate(45deg);
 transform:translate(-50%,-90%) rotate(45deg)
}
.icon-resize-horiz::after,
.icon-resize-vert::after {
 -webkit-transform:translate(-50%,-10%) rotate(225deg);
 -ms-transform:translate(-50%,-10%) rotate(225deg);
 transform:translate(-50%,-10%) rotate(225deg)
}
.icon-resize-horiz::before {
 -webkit-transform:translate(-90%,-50%) rotate(-45deg);
 -ms-transform:translate(-90%,-50%) rotate(-45deg);
 transform:translate(-90%,-50%) rotate(-45deg)
}
.icon-resize-horiz::after {
 -webkit-transform:translate(-10%,-50%) rotate(135deg);
 -ms-transform:translate(-10%,-50%) rotate(135deg);
 transform:translate(-10%,-50%) rotate(135deg)
}
.icon-more-horiz::before,
.icon-more-vert::before {
 background:currentColor;
 border-radius:50%;
 box-shadow:-.4em 0,.4em 0;
 content:"";
 height:.3rem;
 width:.3rem
}
.icon-more-vert::before {
 box-shadow:0 -.4em,0 .4em
}
.icon-plus::before,
.icon-minus::before,
.icon-cross::before {
 background:currentColor;
 content:"";
 height:.2rem;
 width:100%
}
.icon-plus::after,
.icon-cross::after {
 background:currentColor;
 content:"";
 height:100%;
 width:.2rem
}
.icon-cross::before {
 width:100%
}
.icon-cross::after {
 height:100%
}
.icon-cross::before,
.icon-cross::after {
 -webkit-transform:translate(-50%,-50%) rotate(45deg);
 -ms-transform:translate(-50%,-50%) rotate(45deg);
 transform:translate(-50%,-50%) rotate(45deg)
}
.icon-check::before {
 border:.2rem solid currentColor;
 border-right:0;
 border-top:0;
 content:"";
 height:.5em;
 -webkit-transform:translate(-50%,-75%) rotate(-45deg);
 -ms-transform:translate(-50%,-75%) rotate(-45deg);
 transform:translate(-50%,-75%) rotate(-45deg);
 width:.9em
}
.icon-stop {
 border:.2rem solid currentColor;
 border-radius:50%
}
.icon-stop::before {
 background:currentColor;
 content:"";
 height:.2rem;
 -webkit-transform:translate(-50%,-50%) rotate(45deg);
 -ms-transform:translate(-50%,-50%) rotate(45deg);
 transform:translate(-50%,-50%) rotate(45deg);
 width:1em
}
.icon-shutdown {
 border:.2rem solid currentColor;
 border-radius:50%;
 border-top-color:transparent
}
.icon-shutdown::before {
 background:currentColor;
 content:"";
 height:.5em;
 top:.1em;
 width:.2rem
}
.icon-refresh::before {
 border:.2rem solid currentColor;
 border-radius:50%;
 border-right-color:transparent;
 content:"";
 height:1em;
 width:1em
}
.icon-refresh::after {
 border:.2em solid currentColor;
 border-left-color:transparent;
 border-top-color:transparent;
 content:"";
 height:0;
 left:80%;
 top:20%;
 width:0
}
.icon-search::before {
 border:.2rem solid currentColor;
 border-radius:50%;
 content:"";
 height:.75em;
 left:5%;
 top:5%;
 -webkit-transform:translate(0,0) rotate(45deg);
 -ms-transform:translate(0,0) rotate(45deg);
 transform:translate(0,0) rotate(45deg);
 width:.75em
}
.icon-search::after {
 background:currentColor;
 content:"";
 height:.2rem;
 left:80%;
 top:80%;
 -webkit-transform:translate(-50%,-50%) rotate(45deg);
 -ms-transform:translate(-50%,-50%) rotate(45deg);
 transform:translate(-50%,-50%) rotate(45deg);
 width:.4em
}
.icon-edit::before {
 border:.2rem solid currentColor;
 content:"";
 height:.4em;
 -webkit-transform:translate(-40%,-60%) rotate(-45deg);
 -ms-transform:translate(-40%,-60%) rotate(-45deg);
 transform:translate(-40%,-60%) rotate(-45deg);
 width:.85em
}
.icon-edit::after {
 border:.15em solid currentColor;
 border-right-color:transparent;
 border-top-color:transparent;
 content:"";
 height:0;
 left:5%;
 top:95%;
 -webkit-transform:translate(0,-100%);
 -ms-transform:translate(0,-100%);
 transform:translate(0,-100%);
 width:0
}
.icon-delete::before {
 border:.2rem solid currentColor;
 border-bottom-left-radius:.2rem;
 border-bottom-right-radius:.2rem;
 border-top:0;
 content:"";
 height:.75em;
 top:60%;
 width:.75em
}
.icon-delete::after {
 background:currentColor;
 box-shadow:-.25em .2em,.25em .2em;
 content:"";
 height:.2rem;
 top:.1rem;
 width:.5em
}
.icon-share {
 border:.2rem solid currentColor;
 border-radius:.2rem;
 border-right:0;
 border-top:0
}
.icon-share::before {
 border:.2rem solid currentColor;
 border-left:0;
 border-top:0;
 content:"";
 height:.4em;
 left:100%;
 top:.25em;
 -webkit-transform:translate(-125%,-50%) rotate(-45deg);
 -ms-transform:translate(-125%,-50%) rotate(-45deg);
 transform:translate(-125%,-50%) rotate(-45deg);
 width:.4em
}
.icon-share::after {
 border:.2rem solid currentColor;
 border-bottom:0;
 border-radius:75% 0;
 border-right:0;
 content:"";
 height:.5em;
 width:.6em
}
.icon-flag::before {
 background:currentColor;
 content:"";
 height:1em;
 left:15%;
 width:.2rem
}
.icon-flag::after {
 border:.2rem solid currentColor;
 border-bottom-right-radius:.2rem;
 border-left:0;
 border-top-right-radius:.2rem;
 content:"";
 height:.65em;
 left:60%;
 top:35%;
 width:.8em
}
.icon-bookmark::before {
 border:.2rem solid currentColor;
 border-bottom:0;
 border-top-left-radius:.2rem;
 border-top-right-radius:.2rem;
 content:"";
 height:.9em;
 width:.8em
}
.icon-bookmark::after {
 border:.2rem solid currentColor;
 border-bottom:0;
 border-left:0;
 border-radius:.2rem;
 content:"";
 height:.5em;
 -webkit-transform:translate(-50%,35%) rotate(-45deg) skew(15deg,15deg);
 -ms-transform:translate(-50%,35%) rotate(-45deg) skew(15deg,15deg);
 transform:translate(-50%,35%) rotate(-45deg) skew(15deg,15deg);
 width:.5em
}
.icon-download,
.icon-upload {
 border-bottom:.2rem solid currentColor
}
.icon-download::before,
.icon-upload::before {
 border:.2rem solid currentColor;
 border-bottom:0;
 border-right:0;
 content:"";
 height:.5em;
 -webkit-transform:translate(-50%,-60%) rotate(-135deg);
 -ms-transform:translate(-50%,-60%) rotate(-135deg);
 transform:translate(-50%,-60%) rotate(-135deg);
 width:.5em
}
.icon-download::after,
.icon-upload::after {
 background:currentColor;
 content:"";
 height:.6em;
 top:40%;
 width:.2rem
}
.icon-upload::before {
 -webkit-transform:translate(-50%,-60%) rotate(45deg);
 -ms-transform:translate(-50%,-60%) rotate(45deg);
 transform:translate(-50%,-60%) rotate(45deg)
}
.icon-upload::after {
 top:50%
}
.icon-time {
 border:.2rem solid currentColor;
 border-radius:50%
}
.icon-time::before {
 background:currentColor;
 content:"";
 height:.4em;
 -webkit-transform:translate(-50%,-75%);
 -ms-transform:translate(-50%,-75%);
 transform:translate(-50%,-75%);
 width:.2rem
}
.icon-time::after {
 background:currentColor;
 content:"";
 height:.3em;
 -webkit-transform:translate(-50%,-75%) rotate(90deg);
 -ms-transform:translate(-50%,-75%) rotate(90deg);
 transform:translate(-50%,-75%) rotate(90deg);
 -webkit-transform-origin:50% 90%;
 -ms-transform-origin:50% 90%;
 transform-origin:50% 90%;
 width:.2rem
}
.icon-mail::before {
 border:.2rem solid currentColor;
 border-radius:.2rem;
 content:"";
 height:.8em;
 width:1em
}
.icon-mail::after {
 border:.2rem solid currentColor;
 border-right:0;
 border-top:0;
 content:"";
 height:.5em;
 -webkit-transform:translate(-50%,-90%) rotate(-45deg) skew(10deg,10deg);
 -ms-transform:translate(-50%,-90%) rotate(-45deg) skew(10deg,10deg);
 transform:translate(-50%,-90%) rotate(-45deg) skew(10deg,10deg);
 width:.5em
}
.icon-people::before {
 border:.2rem solid currentColor;
 border-radius:50%;
 content:"";
 height:.45em;
 top:25%;
 width:.45em
}
.icon-people::after {
 border:.2rem solid currentColor;
 border-radius:50% 50% 0 0;
 content:"";
 height:.4em;
 top:75%;
 width:.9em
}
.icon-message {
 border:.2rem solid currentColor;
 border-bottom:0;
 border-radius:.2rem;
 border-right:0
}
.icon-message::before {
 border:.2rem solid currentColor;
 border-bottom-right-radius:.2rem;
 border-left:0;
 border-top:0;
 content:"";
 height:.8em;
 left:65%;
 top:40%;
 width:.7em
}
.icon-message::after {
 background:currentColor;
 border-radius:.2rem;
 content:"";
 height:.3em;
 left:10%;
 top:100%;
 -webkit-transform:translate(0,-90%) rotate(45deg);
 -ms-transform:translate(0,-90%) rotate(45deg);
 transform:translate(0,-90%) rotate(45deg);
 width:.2rem
}
.icon-photo {
 border:.2rem solid currentColor;
 border-radius:.2rem
}
.icon-photo::before {
 border:.2rem solid currentColor;
 border-radius:50%;
 content:"";
 height:.25em;
 left:35%;
 top:35%;
 width:.25em
}
.icon-photo::after {
 border:.2rem solid currentColor;
 border-bottom:0;
 border-left:0;
 content:"";
 height:.5em;
 left:60%;
 -webkit-transform:translate(-50%,25%) rotate(-45deg);
 -ms-transform:translate(-50%,25%) rotate(-45deg);
 transform:translate(-50%,25%) rotate(-45deg);
 width:.5em
}
.icon-link::before,
.icon-link::after {
 border:.2rem solid currentColor;
 border-radius:5em 0 0 5em;
 border-right:0;
 content:"";
 height:.5em;
 width:.75em
}
.icon-link::before {
 -webkit-transform:translate(-70%,-45%) rotate(-45deg);
 -ms-transform:translate(-70%,-45%) rotate(-45deg);
 transform:translate(-70%,-45%) rotate(-45deg)
}
.icon-link::after {
 -webkit-transform:translate(-30%,-55%) rotate(135deg);
 -ms-transform:translate(-30%,-55%) rotate(135deg);
 transform:translate(-30%,-55%) rotate(135deg)
}
.icon-location::before {
 border:.2rem solid currentColor;
 border-radius:50% 50% 50% 0;
 content:"";
 height:.8em;
 -webkit-transform:translate(-50%,-60%) rotate(-45deg);
 -ms-transform:translate(-50%,-60%) rotate(-45deg);
 transform:translate(-50%,-60%) rotate(-45deg);
 width:.8em
}
.icon-location::after {
 border:.2rem solid currentColor;
 border-radius:50%;
 content:"";
 height:.2em;
 -webkit-transform:translate(-50%,-80%);
 -ms-transform:translate(-50%,-80%);
 transform:translate(-50%,-80%);
 width:.2em
}
.icon-emoji {
 border:.2rem solid currentColor;
 border-radius:50%
}
.icon-emoji::before {
 border-radius:50%;
 box-shadow:-.17em -.15em,.17em -.15em;
 content:"";
 height:.1em;
 width:.1em
}
.icon-emoji::after {
 border:.2rem solid currentColor;
 border-bottom-color:transparent;
 border-radius:50%;
 border-right-color:transparent;
 content:"";
 height:.5em;
 -webkit-transform:translate(-50%,-40%) rotate(-135deg);
 -ms-transform:translate(-50%,-40%) rotate(-135deg);
 transform:translate(-50%,-40%) rotate(-135deg);
 width:.5em
}
.btn .icon,
.toast .icon,
.menu .icon {
 vertical-align:-10%
}