a.text-white-50:hover {
    color: #ffffff !important;
}

.px-6 {
    padding-left: 5rem;
    padding-right: 5rem;
}

#topBar a,
#topBar .separator
{}

#navbar {height: 70px;}

#navbar .navbar-nav > .nav-item > a{
    font-family: 'Oswald', sans-serif; font-size: 20px;
    color: #ffffff; position:relative;
}
#navbar .navbar-nav > .nav-item > a:hover {
    color: #fff !important;
}
#navbar .navbar-nav .nav-item > a:after {
    content:""; height: 3px; width:0; background-color: #fff;
    position:absolute; top: calc(50% + 1.5rem); left: 50%;transform:translateX(-50%);transition:width .5s;
    border: none;
}
#navbar .navbar-nav .nav-item > a.show:after,
#navbar .navbar-nav .nav-item > a:hover:after {width:100%}

#pageFooter .list-group-item {
    background-color: transparent !important;
}

.carousel-caption {
    bottom: 45%;
}

/*
font-size: calc([minimum size] + ([maximum size] - [minimum size]) * ((100vw - [minimum viewport width])
                    / ([maximum viewport width] - [minimum viewport width])));
 */
.pageTitle {
    font-size: calc(1.2rem + (19.2 - 16) * ((100vw - 576px) / (1400 - 576)));
}

.sectionTitle {
    font-size: calc(2rem + (28.8 - 16) * ((100vw - 576px) / (1400 - 576)));
    text-transform: uppercase;
}
.sectionUnderline {
    width: 80px;position: relative;overflow: hidden;display: block;background: transparent;height: 5px;margin: 11px 0 0;
}
.sectionUnderline:before {
    position: absolute;top: 0;left: 0;width: 70px;height: 1px;background: #2c7873;content: "";
}
.sectionUnderline:after {
    position: absolute;bottom: 0;right: 0;width: 70px;height: 1px;background: #49aaa4;content: "";
}

.serviceBox {
    text-align: center;
}
.serviceBoxTitle img {
    width: 78px;
    z-index: 5; position: absolute; left: .5rem;
}
.serviceBoxTitle h3 {
    color: #2c7873;
    z-index: 4; margin-bottom: 0;
}

.serviceBoxTitle h3 {
    position: relative;
}

.productAvatar {
    height: 250px; width: 100%;
    background-size: cover; background-position: center;
}

/* Image hover */
.hoverToSee {
    width: 100%;
    overflow: hidden;
    position: relative;
    box-shadow: 1px 1px 3px 0 rgba(0, 0, 0, 0.3);
}
.hoverToSee .img,
.hoverToSee img {
    width: 100%;
    position: relative;
    top: 0;
    left: 0;
}
.hoverToSee .overlay {
    background: rgba(0, 0, 0, 0.5);
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
    opacity: 0;
    transition: all 0.3s;
}
.hoverToSee .buttons {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
.hoverToSee .buttons .fas {
    background: rgb(256, 256, 256);
    box-shadow: 0 0 1px rgba(0, 0, 0, 0.3);
    border-radius: 50%;
    display: inline-block;
    line-height: 40px;
    font-size: 16px;
    text-align: center;
    text-decoration: none;
    width: 40px;
    height: 40px;
    opacity: 0;
    position: relative;
    transition: all 0.3s, color 0.1s 0.3s;
    color: transparent;
}
.hoverToSee .buttons .fa-link {
    left: 22px;
}
.hoverToSee .buttons .fa-search {
    left: -22px;
}
.hoverToSee:hover .buttons .fas {
    opacity: 1;
    left: 0;
    color: rgba(50, 50, 50, 0.9);
}
.hoverToSee:hover .overlay {
    opacity: 1;
}
 /* End Image Hover */

/* X-Small devices (portrait phones, less than 576px) */
@media (max-width: 576px) {
    .animate__animated {
        /*CSS transitions*/
        transition-property: none !important;
        /*CSS transforms*/
        transform: none !important;
        /*CSS animations*/
        -webkit-animation: none !important;
        animation: none !important;
    }
}

/* Small devices (landscape phones, less than 768px) */
@media (min-width: 768px) {

}

/* Medium devices (tablets, less than 992px) */
@media (min-width: 992px) {
    .pageTitle {
        font-size: 2rem;
    }
    .serviceBoxTitle {
        padding-top: 3rem; background-color: #2c7873!important;
    }
    .serviceBoxTitle img {
        z-index: 5; top: -9rem; position: absolute; left: calc(50% - 110px);
        width: 50%;
    }
    .serviceBoxTitle h3 {
        color: #fff;
        z-index: 10; margin-bottom: 0;
    }
}

/* Large devices (desktops, less than 1200px) */
@media (min-width: 1200px) {
    .pageTitle {font-size: 3.5rem;}
    .sectionTitle {font-size: 2.5rem;}
}

