/** 
 * screen-reader-text
 * ========================================================================== */

.screen-reader-text {
    clip:rect(1px,1px,1px,1px);
    clip-path:polygon(0px 0px,0px 0px,0px 0px,0px 0px);
    height:1px;
    overflow:hidden;
    position:absolute!important;
    white-space:nowrap;
    width:1px;

    &:focus {
        clip:auto!important;
        clip-path:none;
        display:block;
        height:auto;
        left:5px;
        padding:0 .3em;
        top:5px;
        width:auto;
        z-index:100000;
    }
}

/**
 * Not visible when focus
 * ========================================================================== */
.nopassword,
.wp-block-search__label,
.archive-title .term,
.archive-title .separator{
    @extend .screen-reader-text;
    &:focus{
        clip:rect(1px,1px,1px,1px);
        clip-path:polygon(0px 0px,0px 0px,0px 0px,0px 0px); 
    }
}
/**
 * Visible when focus
 * ========================================================================== */

a.screen-reader-text:active,
a.screen-reader-text:focus {
    background-color:#f1f1f1;
    box-shadow:0 0 2px 2px rgba(0, 0, 0, .6 );
    color:#21759b;
    font-size:108%;
    font-weight:bold;
    line-height:normal;
    padding:1rem 1.5rem;
    text-decoration:none;
    text-transform:none;
    width:auto;
}
.logged-in .screen-reader-text:focus {
    top:32px
}
/**
 * jQuery Tooltip
 * ========================================================================== */
.ui-helper-hidden-accessible {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
}
/**
 * Skip link
 * ========================================================================== */
#document .skip-link{
    a:hover{
        color:#333;
    }   
}
#document .logged-in{
    main:target{
        margin-top:-60px;
        padding-top:60px;
    }
}