.main-padding-template {
    padding: 33px 3.547% 30px 3.547%;
}

.col-hm-p {
    padding: 0 1.642% 1.642% 1.642%;
    margin-bottom: 11px;
    width: 100%;
}

.card-col-top-img {
    height: auto;
    width: 100%;
    border-radius: 4px 4px 0 0;
    transition: all .2s ease-in-out;
}

.card-col-top {
    cursor: pointer;

    position: relative;
    overflow: hidden;
}

.card-col-bottom {
    cursor: pointer;
    text-align: center;
    padding: 15px 20px;
    font-size: 24px;
    font-weight: bold;
    letter-spacing: 0;
    color: #000000DE;

    background: transparent 0% 0% no-repeat padding-box;
    border: 1px solid #E4E4E4;
    border-radius: 0 0 4px 4px;
}

.card-col-top-hover:hover {
    background: rgba(0,0,0,.4);
    transition: opacity 0.35s ease 0s, transform 0.35s ease 0s;
    -webkit-transition: opacity 0.35s ease 0s, -webkit-transform 0.35s ease 0s;
    -moz-transition: opacity 0.35s ease 0s, -moz-transform 0.35s ease 0s;
    -ms-transition: opacity 0.35s ease 0s, -ms-transform 0.35s ease 0s;
    -o-transition: opacity 0.35s ease 0s, -o-transform 0.35s ease 0s;
    -webkit-transition: all 500ms ease 0s;
    -moz-transition: all 500ms ease 0s;
    -o-transition: all 500ms ease 0s;
    transition: all 500ms ease 0s;
}

.card-col-top-hover {
    height: 100%;
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    border-radius: 4px 4px 0 0;
    transform: translate3d(0px, 0px, 0px);
    -webkit-transform: translate3d(0px, 0px, 0px);
    -moz-transform: translate3d(0px, 0px, 0px);
    -ms-transform: translate3d(0px, 0px, 0px);
    -o-transform: translate3d(0px, 0px, 0px);
    -webkit-transition: all 500ms ease 0s;
    -moz-transition: all 500ms ease 0s;
    -o-transition: all 500ms ease 0s;
    transition: all 500ms ease 0s;

    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    align-items: center;
    justify-content: center;
}

.eye-icon {
    width: 100px;
    height: auto;

    margin: auto;

    opacity: 0;
    -webkit-transition: all 0.5s ease 0s;
    -moz-transition: all 0.5s ease 0s;
    -ms-transition: all 0.5s ease 0s;
    -o-transition: all 0.5s ease 0s;
    transition: all 0.5s ease 0s;

    -webkit-filter: invert(63%) sepia(34%) saturate(5238%) hue-rotate(49deg) brightness(102%) contrast(95%);
    -moz-filter: invert(63%) sepia(34%) saturate(5238%) hue-rotate(49deg) brightness(102%) contrast(95%);
    -ms-filter: invert(63%) sepia(34%) saturate(5238%) hue-rotate(49deg) brightness(102%) contrast(95%);
    -o-filter: invert(63%) sepia(34%) saturate(5238%) hue-rotate(49deg) brightness(102%) contrast(95%);
    filter: invert(63%) sepia(34%) saturate(5238%) hue-rotate(49deg) brightness(102%) contrast(95%);
}

.eye-icon-hover {
    opacity: 1;
    -webkit-transition: all 0.5s ease 0s;
    -moz-transition: all 0.5s ease 0s;
    -ms-transition: all 0.5s ease 0s;
    -o-transition: all 0.5s ease 0s;
    transition: all 0.5s ease 0s;
}



.announces {
    background: #fff;
    border-radius: 5px;
    border: 1px solid #ececec;
    padding: 15px 0;
    margin-bottom: 30px;
}

.announces h3 {
    font-size: 16px;
    letter-spacing: 0.9px;
    margin-bottom: 3px;
    font-weight: 600;
    text-align: center;
}

.announces p {
    font-size: 14px;
    letter-spacing: 0.5px;
    text-align: center;
}

.truck-img {
    background-image: url('/images/2.0/icons/truck.svg');
}

.money-bill-img {
    background-image: url('/images/2.0/icons/money-bill.svg');
}

.chat-img {
    background-image: url('/images/2.0/icons/chat.svg');
}

.heartbeat-img {
    background-image: url('/images/2.0/icons/heartbeat.svg');
}

.store-img {
    background-image: url('/images/2.0/icons/store.svg');
}

.img-announce {
    background-position: center;
    width: 60px;
    height: 60px;
    content: '';
    z-index: 0;
    position: relative;
    top: 0;
    clear: both;
    margin: 0 auto;
    display: block !important;

    -webkit-transition: all 400ms ease-in-out 0s;
    -moz-transition: all 400ms ease-in-out 0s;
    -ms-transition: all 400ms ease-in-out 0s;
    -o-transition: all 400ms ease-in-out 0s;
    transition: all 400ms ease-in-out 0s;
}

.img-announce:hover {
    transform-style: preserve-3d;
    -webkit-transition: all 500ms linear;
    -moz-transition: all 500ms linear;
    -ms-transition: all 500ms linear;
    -o-transition: all 500ms linear;
    transition: all 500ms linear;

    -webkit-transform: scaleX(-1);
    -moz-transform: scaleX(-1);
    -ms-transform: scaleX(-1);
    -o-transform: scaleX(-1);
    transform: scaleX(-1);
}