/* 

1. Add your custom Css styles below
2. Place the this code in your template: 

 <link href="css/custom.css" rel="stylesheet">

*/
.portfolio-image.bg {
    background-size: auto 150%;
    background-repeat: no-repeat;
    background-position: center center;
    transition: all .5s;
    height: 15rem;
}

.portfolio-item.img-zoom:hover .portfolio-image.bg {
    transform: scale(1.1);
}

.portfolio-3-columns .portfolio-image {
    display: flex;
    align-items: center;
    justify-content: center;
}

.portfolio-3-columns .portfolio-image > a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
}

.portfolio-3-columns .portfolio-image img {
    width: auto;
    max-width: 100%;
    height: auto;
    max-height: 100%;
}

.topNavPad {
    margin: 0 1.5% 0 1.6%;
}

@media (min-width: 500px) {
    .flexMeMd {
        display: flex;
        align-items: center;
        justify-content: center;
    }
}

.center-text {
    text-align: center !important;
}

[data-notify] {
    z-index: 9999 !important;
}

.alert .close {
    color: #fff;
    font-weight: 300;
    background: transparent;
    border: none;
    padding: 0;
}