/********** Template CSS **********/
:root {
    --primary: #ffffff;
    --secondary: #a70505;
    --light: #F2F2F2;
}
.contact-item {
    background: url(../images/haklg.jpg) top center no-repeat;
    background-size: cover;
    transition: .5s;
}

.contact-item:hover {
    background: url(../images/haklg.jpg) bottom center no-repeat;
    background-size: cover;
}

.contact-item .contact-icon {
    margin-top: -50px;
    width: 100px;
    height: 100px;
    color: var(--secondary);
    background: #FFFFFF;
    transform: rotate(-45deg);
}

.contact-item .contact-icon div {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--primary);
    transition: .5s;
}

.contact-item .contact-icon i {
    transform: rotate(45deg);
    transition: .5s;
}

.contact-item:hover .contact-icon div {
    background: var(--secondary);
}

.contact-item:hover .contact-icon i {
    color: var(--primary);
}

.service-item a.btn {
    position: relative;
    bottom: -30px;
    opacity: 0;
}