// Counter Shortcode

.counter-wrap-style_1{
        position: relative;
        height: 200px;
        width: 200px;
        border: 1px solid transparent;
        background-color: fade(@black, 10%);
        border-radius: 100%;
        margin: 0 auto;
        .transition( all 0.35s ease-in-out);
    .gr-counter{
         &:before{
            content: '';
            opacity: 0;
            top: 10px;
            left: 10px;
            right: 10px;
            bottom: 10px;
            .scale(1.4);
            background-color: @white;
            position: absolute;
            border-radius: 100%;
            .transition( all 0.35s ease-in-out);
        }
        .content-inner{
            padding: 55px 0;
            position: relative;
            text-align: center;
            color: @white;
            font-weight: bold;
            line-height: 1.3;
            .gr-number-counter{
                font-size: 50px;
                .transition( all 0.35s ease);
            }
            .gr-text-defaul{
                white-space: nowrap;
                font-size: 14px;
                text-transform: uppercase;
                .transition( all 0.35s ease);
            }
        }
        
    }
    &:hover{
        border-color: @white;
        background-color: transparent;
        .gr-counter{ 
            &:before{
                opacity: 1;
                .scale(1);
            }
            .content-inner{
                .gr-number-counter,.gr-text-defaul{
                    color: @secondary_color;
                }
            }
        }

    }
    @media (max-width: 991px){
        margin: 15px auto;
    }   
}