/*===========================
    8.QUOTE css 
===========================*/






.quote-area{
    padding-top: 124px;
    & .quote-thumb{
        & img{
            width: 100%;
        }
    }
    & .quote-content{
            @media #{$md} {
                margin-top: 30px;
            }
            @media #{$xs} {
                margin-top: 30px;
            }
        
        & .title{
            font-weight: 300;
            font-size: 40px;
            color: #8a8a8a;
            line-height: 55px;
            & span{
                color: $black;
                font-weight: 600;
                font-size: 46px;
                @media #{$lg} {
                    font-size: 38px;
                }
                @media #{$xs} {
                    font-size: 40px;
                }
                @media #{$sm} {
                    font-size: 46px;
                }
                & span{
                    font-weight: 400;
                    color: $theme-color-2;
                }
            }
        }
        & form{
            & .input-box{
                position: relative;
                & label{
                    font-size: 18px;
                    font-weight: 600;
                    color: $black;
                }
                & input{
                    width: 100%;
                    background: #eef3f9;
                    border: 2px solid #eef3f9;
                    line-height: 70px;
                    padding-left: 30px;
                    color: #8a8a8a;
                    &::placeholder{
                        color: #8a8a8a;
                        opacity: 1;
                    }
                    &:focus{
                        border-color: $theme-color-2;
                        background-color: transparent;
                    }
                }
                & textarea{
                    background: #eef3f9;
                    width: 100%;
                    height: 130px;
                    border: 2px solid #eef3f9;
                    padding-left: 30px;
                    padding-top: 20px;
                    color: #8a8a8a;
                    resize: none;
                    &:focus{
                        border-color: $theme-color-2;
                        background-color: transparent;
                    }
                    &::placeholder{
                        opacity: 1;
                        color: #8a8a8a;
                        
                    }
                }
                & i{
                    color: $theme-color-2;
                    position: absolute;
                    right: 30px;
                    top: 65px;
                    font-size: 14px;
                    
                }
            }
        }

    }
}