html, body {
    background-color: #ffffff;
    margin: 10px;
    font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
    color: #000;
}

enhanced {
    font-weight: bold;
    color: black;
}
.brighten {
    opacity: 0.5 !important;
}
.brighten:hover {
    opacity: 0.8 !important;
}

.ibew-panel {
    background: rgba(255, 255, 255, 0.45);
    /*opacity: 0.25;*/
    border-radius: 6px;
    border: 1px solid #888;
    margin: 10px;
    padding: 10px;
    z-index: -1;
    /*background-color: black;*/
    /*opacity: 0.5;
    filter: blur(10px);
    -webkit-filter: blur(10px);
    -moz-filter: blur(10px);
    -o-filter: blur(10px);
    -ms-filter: blur(10px);*/
}

@media screen and (min-width: 768px) {
    .ibew-panel {
        /*position: relative;*/
        margin-top: 100px;
    }
}

.ibew-container {
    height: auto;
    display: grid;
    grid-gap: 20px;
    grid-template-columns: repeat(auto-fit, minmax(250px,1fr));
    grid-auto-rows: 75px;
    grid-auto-flow: row;
    justify-content: space-around;
    align-content: space-around;
    z-index: 10;
}

/*.horizontal {
            grid-column: 1 / span 2;
            grid-column: auto / span 2;
        }

        .vertical {
            grid-row: span 2;
        }

        .big {
            grid-column: span 2;
            grid-row: span 2;
        }*/

.ibew-header {
    display: flex;
    background-color: #719898;
    color: black;
    height: 50px;
    border-radius: 4px;
    margin-bottom: 10px;
    justify-content: center;
    align-items: center;
    padding-right: 10px;
    padding-left: 10px;
}
    .ibew-header > div:nth-child(1) > i:hover {
        color: white;
    }
    .ibew-header > div:nth-child(2) {
        color: white;
        margin-left: auto;
        font-size: 1.5em;
    }
    .ibew-header > div:nth-child(3) {
        margin-left: auto;
    }
    .ibew-header > div:nth-child(3) > i:hover {
        color: #FFF;
    }

.ibew-container > div.ibew-content {
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 1.25em;
    overflow-wrap: break-word;
    word-break: break-word;
    border-radius: 4px;
    padding: 3px;
}

    .ibew-container > div.home {
        font-size: 1.25em;
        font-weight: bold;
        background-color: #Cf0000 !important;
        color: white !important;
        border: 2px solid #FFF;
    }

.ibew-container > div.ibew-content {
    border: 2px solid #FFF;
    border-radius: 3px;
    background-color: #Cf0000;
    color: #fff;
}

    /*.ibew-container > div.ibew-content:nth-child(2n) {
        background-color: #1168a1;
        color: #FFF;
    }

    .ibew-container > div.ibew-content:nth-child(3n) {
        background-color: #1993ba;
        color: black;
    }

    .ibew-container > div.ibew-content:nth-child(4n) {
        background-color: #51b1d0;
        color: black;
    }

    .ibew-container > div.ibew-content:nth-child(5n) {
        background-color: #9ab7c1;
        color: black;
    }*/
/*
    -----------------------------------------------------------------------------------------------
*/
.electrical-contractors {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    grid-gap: 1rem;
}
    .electrical-contractors > contractor {
        display: flex;
        flex-flow: column;
        border-radius: 1rem;
        border: 1px solid #719898;
        padding: 2rem;
        background-color: #FFF;
        color: #000;
        /*background-image: linear-gradient(to bottom, #fff 0%, #719898 100%);*/
    }
        .electrical-contractors > contractor > img {
            order: -1;
            align-self: center;
            max-width: 150px;
            max-height: 150px;
        }
        .electrical-contractors > contractor > h1 {
            margin: 1rem 1rem 0;
        }
        .electrical-contractors > contractor > h3 {
            margin: 1rem 1rem 0;
        }

        .electrical-contractors > contractor > ul {
            margin: 0 0 1rem;
        }
        .electrical-contractors > contractor > ul > li {
            font-size: 1.1em;
        }
            .electrical-contractors > contractor > ul > li > a {
                color: navy;
            }
            .electrical-contractors > contractor > ul > li > a:hover {
                color: #0e0335;
            }

        .electrical-contractors > contractor > desc {
            max-height: 250px;
            overflow-x: auto;
        }
        .electrical-contractors > contractor > desc > p {
            margin: 0.25em 1rem 1rem;
        }

.product-categories, .service-categories {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    grid-auto-rows: 75px;
    grid-auto-flow: row;
    grid-gap: 1rem;
}
    .product-categories > product, .service-categories > service {
        border: 2px solid #FFF;
        border-radius: 3px;
        background-color: #Cf0000;
        color: #fff;
        display: flex;
        justify-content: center;
        align-items: center;
        font-size: 1.25em;
        overflow-wrap: break-word;
        word-break: break-word;
        border-radius: 4px;
        padding: 3px;
        font-family:'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif !important
    }
    .product-categories > div.center, .service-categories > div.center {
        display: flex;
        justify-content: center;
        align-items: center;
        align-self: center;
    }
/*  
    display of individual products/services returned from category selections......................
*/
items {
    display: grid;
    grid-gap: 1rem;
    grid-template-columns: repeat(auto-fit, minmax(250px,1fr));
}

    items > productitem, items > serviceitem {
        display: flex;
        flex-flow: column;
        border-radius: 1rem;
        border: 1px solid #000;
        padding: 1rem;
        background-color: #FFF;
        overflow-wrap: break-word;
        word-break: break-word;
    }

        items > productitem > img, items >serviceitem > img {
            order: -1;
            align-self: center;
            max-width: 150px;
            max-height: 150px;
        }
        items > productitem > h3, items > serviceitem > h3 {
            margin: 1rem 1rem 0;
        }

        items > productitem > ul, items > serviceitem > ul {
            margin: 0 0 1rem;
        }

            items > productitem > ul > li, items > serviceitem > ul > li {
                font-size: 1.1em;
                color: #000;
            }
                items > productitem > ul > li > a, items > serviceitem > ul > li > a {
                    color: #062b7e
                }
                    items > productitem > ul > li > a:hover, items > serviceitem > ul > li > a:hover {
                        color: #056363
                    }
        items > productitem > desc, items > serviceitem > desc {
            max-height: 250px;
            overflow-x: auto;
            font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif !important
        }
div.product-detail-header {
    display: flex;
    flex-flow: row;
    /*border-radius: 1rem;
    border: 1px solid #000;*/
    padding: 1rem;
    color: #FFFFFF;
    background-color: #3D5B72;
    overflow-wrap: break-word;
    word-break: break-word;
    flex-wrap: wrap;
}
    div.product-detail-header > h4 {
        flex: 5;
    }
    div.product-detail-header > button {
        flex: 1;
    }
div.product-content {
    display: flex;
    flex-flow: column;
    justify-content: center;
    align-items: center;
    /*border-radius: 1rem;
    border: 1px solid #000;*/
    padding: 1rem;
    background-color: #FFF;
    overflow-wrap: break-word;
    word-break: break-word;
}
    div.product-content > div.flex-sub1 {
        display: flex;
        flex-flow: row;
    }
        div.product-content > div.flex-sub1 > #thumbwrap {
            flex:3;
        }
        div.product-content > div.flex-sub1 > div.flex-sub2 {
            flex: 2;
        }

        div.product-content > div > a.thumb > img {
            order: -1;
            align-self: center;
            max-width: 150px;
            max-height: 150px;
        }

        div.product-content > div.flex-sub1 > div.flex-sub2 {
            display: flex;
            flex-flow: column;
            /*justify-content:space-around;*/
            align-content: flex-start;
        }
        div.product-content > div.flex-sub1 > div.flex-sub2 > button {
            margin-top: 10px;
        }
    /*div .product-content > p.dtl-product-description > div > div > img.thumbnail {
        float:left;
        margin: 10px;
    }*/
    div .product-content > p.dtl-product-description > div.desc {
        max-height: 250px;
        overflow-x: auto;
        font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif !important
    }
    div.product-content > div.section-align-start {
        justify-content: flex-start;
        margin-left: 5px;
    }
    div.product-content > #LocalContactWrapper {
        justify-content: flex-start;
        align-content: stretch;
        width: 100%;
        margin-left: 5px;
    }

cartbox {
    display: flex;
    flex-flow: row;
    justify-content: space-between;
    align-items: stretch;
    /*border-radius: 1rem;
    border: 1px solid #000;*/
    background-color: #FFF;
    overflow-wrap: break-word;
    word-break: break-word;
}

    cartbox > item:nth-child(1) {
        flex: 4;
        padding-right: 10px;
        padding-left: 10px;
    }
    cartbox > item:nth-child(2) {
        flex: 1;
        
    }

div.menu-footer-box {
    display: flex;
    flex-flow: row;
    justify-content: space-between;
    align-items: stretch;
    margin-top: 10px;
    /*border-radius: 1rem;
    border: 1px solid #000;*/
    overflow-wrap: break-word;
    word-break: break-word;
}
    div.menu-footer-box > div:nth-child(1) {
        padding-top:5px;
        flex: 1;
    }
    div.menu-footer-box > div:nth-child(2) {
        margin-top: -5px;
        padding: 5px;
        flex: 1;
        background-image: linear-gradient(to bottom, #5cb85c 0%, #419641 100%);
    }
    div.menu-footer-box > div:nth-child(3) {
        flex: 3;
    }
    div.menu-footer-box > div:nth-child(4) {
        flex: 1;
        align-self: flex-end;
        margin-top: 0px;
    }
.remove-row-border {
    border-top: 0px solid #fff !important;
}