/*-----------------------------------Color Change-----------------------------------*/

    .monochrome {
            
            filter: grayscale(100%);
/*            position: absolute;*/
        }

    .inverted {
            filter: invert(100%);
            background-color:black;
            color: black;
        }

     

/*-------------------------------------Big Cursor-------------------------------------*/
   
    :root {
            cursor: var(--custom-cursor);
        }

        body {
            --custom-cursor: url(https://cdn.userway.org/widgetapp/images/arrow_w.svg), auto;

        }

        #changeCursorButton {
            cursor: pointer;
        }

/*-----------------------------------Highlight Links-----------------------------------*/

    .highlighted_link {
            background-color: yellow;
            color: black;
            height: auto;
            border-radius: 10px;
            
        }   

        .highlighted_link a:hover{
            color: black;
        }

/*------------------------------------Show Headings--------------------------------------*/
    .show_heading {
            background-color: yellow;
        }

/*------------------------------------Text Spacing--------------------------------------*/
    .text_space {
            letter-spacing: 0;
            transition: letter-spacing 0.3s ease;
        }

/*----------------------------------Reading Guideline-----------------------------------*/

.devicer {         
            position: fixed; /* Fixed position within the viewport */
            display: none;             
            width: 200%;
            height: 8px;
            border-color: #61c818;
            background-color: greenyellow;
            transform: translate(-50%, -50%);          
            pointer-events: none; /* Ensure the cursor does not interfere with other elements */
            cursor: none; /* Hide the default cursor */
            z-index: 3;
        }
            




    button {
/*        background-color: none;*/
/*        color: white;*/
        border: none;
    }

/*----------------------------------Accessibility Menu Bar-----------------------------------*/

.accessibility-menu {
            display: none;
            position: absolute;
            margin-top: 80px;
            margin-left: 40px;
            border: 1px solid #ccc;
            padding: 2px 2px;
            border-radius: 5px;
            background-color: white;
/*            box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);*/
            z-index: 1;
        }

        .accessibility-menu.open {
            display: block;
        }

        #accessibility-button {
            position: absolute;
            background-color: white;
            color: white;
            border: none;
            border-radius: 20px;
            margin-top: 10px;
            margin-left: 30px;
            cursor: pointer;
            z-index: 1;
        }

      .iconimg {
        width: 60px;
        height: 60px;
      }
      .inch{
        display: inline;
        border: black;
        font-size: 13px;
/*        background-color: green;*/
        width:25px;
        padding: 5px 5px;
/*        color: white;*/
      }
      .inc{
       /* 
        margin-left: 5px;
        
        
        
        height: 10px;
        
        font-size: 13px;
        text-align: center;
        align-content: center;*/
      }