/*---------- Search Button Glass ----------*/

.search-button {
    background: linear-gradient(to bottom, #f9c74f 0%, #f8961e 100%);
    border: none;
    border-radius: 0 6px 6px 0; /* match your input rounding */
    color: white;
    font-size: 1rem;
    padding: 0 1rem;
    cursor: pointer;
    position: relative;
    overflow: hidden;
}

    /* sheen overlay */
    .search-button::before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 50%; /* only top half for shine */
        background: rgba(255, 255, 255, 0.4);
        border-radius: inherit;
        pointer-events: none;
    }



/*---------- Division Boxes ----------*/

.box {
    margin: 0px 10px 10px 0px;
}

.box-2 {
    margin: 0px;
}

.appbox {
    width: 180px;
    height: 180px;
    border: 1px solid #87bad8;
}

/*---------- Half Height Boxes ----------*/

.appbox-2 {
    width: 180px;
    height: 90px;
    border: 1px solid #87bad8;
}

.boxname-2 {
    text-align: center;
    font-size: 1.15em;
    position: absolute;
    bottom: 0px;
    right: 0px;
}

.boxname-lg-2 {
    text-align: center;
    font-size: 1.25em;
    padding: 15px 0px 0px 0px;
    font-weight: 400;
    /*background-color:black;*/
}

    @media (max-width: 480px) {

        .box {
            margin: 0px 0px 10px 0px;
        }

        .appbox-2 {
            width: 100%;
        }

        .boxname-left {
            text-align: left;
            font-size: 1.5em;
            position: absolute;
            bottom: 10px;
            left: 15px;
        }

        .boxname {
            font-size: 1.25em;
        }

        .appbox {
            width: 100%;
        }

        .iconcenter {
            position: absolute;
            left: 37%;
            top: 35%;
            font-size: 3.0em;
        }


        .appname {
            width: 178px;
            text-align: left;
            font-size: 3em;
            position: absolute;
            top: 35%;
            margin-right: 45px;
            font-weight: 400;
        }

    }



/* ==========================================================================
   fa-triangle-exclamation Icon slow pulse
   ========================================================================== */

.pulse-warning {
    animation: pulse 1.5s infinite;
}

@keyframes pulse {
    0% {
        transform: scale(1);
        opacity: 1;
    }

    50% {
        transform: scale(1.2);
        opacity: 0.7;
    }

    100% {
        transform: scale(1);
        opacity: 1;
    }
}