.layout-overlay {
    height: 100%;
    width: 100%;
    position: absolute;
    z-index: 2000;
    left: 0;
    top: 0
}

    .layout-overlay > div {
        position: relative;
        text-align: center;
        top: 50%;
        transform: translateY(-50%)
    }

        .layout-overlay > div img {
            height: 40px;
            width: 40px;
            vertical-align: middle;
            position: center
        }
/*###########################*/

.nav-link h5 {
    padding:2px;
    margin:8px auto;
    color: #888;
    /*border-bottom: 2px solid #ccc*/
}

.nav-link h5.red {
    border-bottom: 2px solid #fcc
}
.nav-link.active h5.red {
    border-bottom: 2px solid #f00
}

.nav-link h5.green {
    border-bottom: 2px solid #cfc
}

.nav-link.active h5.green {
    border-bottom: 2px solid #0f0
}

.nav-link h5.blue {
    border-bottom: 2px solid #ccf
}

.nav-link.active h5.blue {
    border-bottom: 2px solid #00f
}

    .nav-link.active, .nav-link.active > * {
        color: #495057;
        font-weight: bold
    }

/* ***** BREADCRUMB ***** */
#breadCrumb,
.breadcrumb-new {
    /*background-color: #e9ecef;
    border-radius: 4px;*/
    font-family: "Segoe UI",Arial,sans-serif;
    font-size: 22px;
    margin: 0px 0px 20px 0px;
    padding: 10px;
}

    #breadCrumb li ,
    .breadcrumb-new li {
        display: inline-block;
        margin: 0px 10px 0px 0px;
    }

        #breadCrumb li:after,
        .breadcrumb-new li:after {
            content: "\BB";
        }

        #breadCrumb li:last-of-type:after ,
        .breadcrumb-new li:last-of-type:after {
            content: none;
        }

        #breadCrumb li a ,
        .breadcrumb-new li a {
            display: inline-block;
            padding: 0px 10px 0px 0px;
            text-decoration: none;
        }

        #breadCrumb li:last-of-type a,
        .breadcrumb-new li:last-of-type a {
            color: #000101;
        }

            #breadCrumb li a:hover ,
            .breadcrumb-new li a:hover {
                color: #007bff;
            }
/* ***** BREADCRUMB ***** */


/* ***** Matching Page ***** */
.opDetails img {
    border: 1px solid #dcdcdc;
    /*position: absolute;
    right: 10px;
    top: 48px;*/
}

.opDetails dl {
    margin: 0px;
}

.opDetails dl dt {
    clear: both;
    float: left;
    line-height: 1.2em;
    padding-right: 10px;
}

.opDetails dl dd {
    float: left;
    line-height: 1.2em;
    min-height: 1.2em;
}

.detailedImage {
    position: relative;
}

.detailedImage > img {
    opacity: 1;
   /*   display: block;  */
    transition: .5s ease;
    backface-visibility: hidden;
}

.detailedImage > .text {
    transition: .5s ease;
    opacity: 0;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    text-align: center;
}

    .detailedImage:hover > img {
        opacity: 0.3;
    }

    .detailedImage:hover > .text {
        opacity: 1;
    }

#bgPopUp {
    background: #000;
    height: 100%;
    left: 0px;
    opacity: 0.8;
    position: fixed;
    top: 0px;
    width: 100%;
    z-index: 1;
}

.opaque4 {
    opacity:.4
}