.greendot {
    height: 14px;
    width: 14px;
    background-color: green;
    border-radius: 50%;
    display: inline-block;
}

.reddot {
    height: 14px;
    width: 14px;
    background-color: red;
    border-radius: 50%;
    display: inline-block;
}


.smallcaps {
    font-variant: small-caps;
}

.nosmallcaps {
    font-variant: normal !important;
}

.btn:not(:disabled):not(.disabled) {
    cursor: pointer;
}
.btn {
    text-decoration: none;
    background-color: transparent;
    background-image: none;
    border-color: black !important;
    border-radius: .25rem;
    display: inline-block;
    font-weight: 400;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    /* -webkit-user-select: none;
       -moz-user-select: none;
       -ms-user-select: none;
       user-select: none; */
    border: 1px solid transparent;
    /* padding: .215rem .5rem; */
    padding: .215rem .215rem .4rem .215rem;
    font-size: 1rem;
    border-radius: .25rem;
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}

.btn.icon {
    padding: .215rem .5rem .3rem .5rem;
}

.btn:hover:not(.disabled) {
    background: lightgrey;
    color: white;
}

.btn.disabled {
    color: grey;
    cursor: default;
    border-color: grey !important;
}

.btnlabel {
    text-decoration: none;
    background-color: transparent;
    background-image: none;
    display: inline-block;
    font-weight: 400;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    padding: .215rem .5rem;
    font-size: 1rem;
}

.asr-hidden {
    display: none;
}

img.disabled {
    -webkit-filter: grayscale(100%); 
    filter: grayscale(100%); 
}

.wavesurfer-handle {
    width: 4px !important;
}

.wavesurfer-handle-start {
    background-image: linear-gradient(to right, black, grey, white) !important;
} 

.wavesurfer-handle-end {
    background-image: linear-gradient(to right, white, grey, black) !important;
}

/* https://www.w3schools.com/htmL/html_colors_hsl.asp#:~:text=%20HTML%20HSL%20and%20HSLA%20Colors%20%201,Alpha%20channel%20-%20which%20specifies%20the...%20More */

region.selected {
    background-color: hsla(200, 50%, 70%, 0.4) !important;
    filter: brightness(100%) !important;
    filter: saturate(400%) !important;
}

/* region.unchecked :not(.selected) {
   background-color: hsla(0, 0%, 75%, 0.3) !important;
   }
   region.ok :not(.selected) {
   background-color: hsla(120, 100%, 75%, 0.3) !important;
   }
   region.skip :not(.selected) {
   background-color: hsla(39, 100%, 50%, 0.3) !important;
   }
 */
.selected-font {
    font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";
    /* font-size: 1rem; */
    font-size: 11pt;
    font-weight: 400;
    line-height: 1.5;
    color: #212529;
    text-align: left;
    font-variant: normal !important;
}

.disabled {
    background-color: #DCDCDC;
}

.not-supported {
    background-color: #F5F5F5;
}

.hidden {
    display: none;
}

.textarea {
    height: 200px;
    border: 1px solid #ccc;
    padding: 5px;
}

.title {
    animation-duration: 1s; 
    animation-name: slidein;
}

.pagename {
    text-transform: capitalize;
    /*text-transform: capitalize;*/
    font-size: 150%;
    font-weight: bold;
}

.resizable {    
    overflow: auto;
    resize: both;
}

.noborder {
    border: none !important;
}

.rounded-border {
    border: 1px solid #ccc;
    border-radius: 10px;
}

/* body { */
/*     zoom: 95%;  */
/*     transform: scale(95%);  */
/*     -moz-transform: scale(95%);  */
/*     -moz-transform-origin: 0 0; */
/*     transform-origin: 0 0; */
/* } */

summary:hover {
    cursor: pointer;
}

.current_status_div {
    text-decoration: none;
    /* background-color: transparent; */
    background-image: none;
    border-color: black;
    border-radius: .25rem;
    display: inline-block;
    font-weight: 400;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    /* -webkit-user-select: none;
       -moz-user-select: none;
       -ms-user-select: none;
       user-select: none; */
    border: 3px solid transparent;
    /* padding: .215rem .5rem; */
    padding: .215rem .5rem .35rem .5rem;
    font-size: 1rem;
    border-radius: .25rem;
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}

@keyframes wiggle {
    0% { transform: rotate(10deg); }
    25% { transform: rotate(-10deg); }
    50% { transform: rotate(0deg); }
}

#reverse_expansion.wiggle {
    display: inline-block;
    animation: wiggle 1.5s;
}

.search_active {
    /* border: 1pt solid transparent!important; */
    /* border-color: blue !important; */
    /* border-radius: .25rem; */
    font-weight: 700;
    font-style: italic;
}

details {
	/* background-color: yellow; */
	margin-top: 20px;
	width: 700px;
}      