@use '../utils' as *;

/*----------------------------------------*/
/*  29. video css start
/*----------------------------------------*/
.it-video {
    &-thumb {
        & img {
            width: 100%;
        }
    }
    &-icon {
        position: absolute;
        top: 50%;
        left: 0;
        right: 0;
        text-align: center;
        transform: translateY(-50%);
        & a {
            display: inline-block;
            height: 102px;
            width: 102px;
            text-align: center;
            line-height: 102px;
            border-radius: 50%;
            background-color: var(--it-common-white);
            @media #{$xs}{
                height: 50px;
                width: 50px;
                line-height: 48px;
            }
            & svg,i {
                display: inline-block;
                padding-left: 4px;
                color: var(--it-common-red);
                @media #{$xs}{
                    padding-left: 1px;
                    width: 15px;
                }
            }
        }
    }
    &-text {
        & p {
            font-weight: 600;
            font-size: 17px;
            line-height: 1.76;
            color: #fff;
            margin-left: 195px;
            letter-spacing: -1px;
            @media #{$xl}{
                margin-left: 30px;
            } 
            @media #{$lg}{
                margin-left: 45px;
            } 
            @media #{$md,$xs}{
                margin-left: 0;
                margin-top: 25px;
                & br{
                    display: none;
                }
            } 
        }
    }
}