@import 'partials';
.contact-wrp{
    display: flex;
    width: 100%;
    flex-direction: column;
    padding: 43px 0 76px;
    background: url(../img/contact_form_img.png) no-repeat #F1F8FD;
    background-position: bottom right;
    background-size: contain;
    background-size: 700px;
    @media ($sm-1679){
        background-size: 500px;
    }
    .info-wrp{
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
        margin-bottom: 60px;
        .info-blks{
            margin-right: 12px;
            width: calc((100% / 3) - 12px);
            border: 1px solid #D9D9D9;
            border-radius: 10px;
            background-color: #fff;
            padding: 20px 17px;
            display: flex;
            align-items: center;
            flex-wrap: wrap;
            flex: 0 0 auto;
            .icon{
                width: 35px;
                height: 35px;
                margin-right: 20px;
                flex-shrink: 0;
                img{
                    width: 100%;
                    height: 100%;
                    object-fit: contain;
                }
            }
            .cont{
                flex: 1;
                font-size: 15px;
                color: #496273;
                word-wrap: break-word;
                .link{
                    color: #496273;
                }
                .mail{
                    color: #496273;
                    text-decoration: underline;
                }
            }
        }
    }
    .form-wrp{
        display: flex;
        flex-wrap: wrap;
        background: linear-gradient(131.64deg, #FFFFFF 18.11%, rgba(255, 255, 255, 0) 93.14%);
        .title-blk{
            font-size: 29px;
            line-height: 38px;
            font-family: $primary-font;
            font-weight: 800;
            flex: 1;
            padding: 103px 20px 0 70px;
            span{
                display: block;
            }
        }
        .form-rt{
            max-width: 1040px;
            width: 100%;
            padding: 144px 88px 178px;
            border-left: 1px solid #D7E2E9;
            @media ($sm-1481){
                max-width: 988px;
                padding: 130px 70px 150px;
            }
            .contact-forms{
                .col-md-6{
                    padding-left: 21.5px;
                    padding-right: 21.5px;
                    @media ($sm-1679){
                        padding-left: 18px;
                        padding-right: 18px;
                    }
                    @media ($sm-1441){
                        padding-left: 15px;
                        padding-right: 15px;
                    }
                    @media ($sm-1199){
                        padding-left: 12px;
                        padding-right: 12px;
                    }
                }
                .form-group{
                    margin-top: 23px;
                    position: relative;
                    .error{
                        position: absolute;
                        color: red;
                        font-size: 14px;
                    }
                }
                .form-label{
                    font-weight: 500;
                    color: #000;
                    font-size: 17px;
                    @media ($sm-1679){
                        font-size: 16px;
                    }
                    @media ($sm-1441){
                        font-size: 15px;
                    }
                    @media ($sm-1441){
                        font-size: 14px;
                    }
                }
                .form-select{
                    background-color: #F4F9FD;
                    border-radius: 6px;
                }
                .form-control{
                    height: 48px;
                    border-color: #8D94B54D;
                    background-color: #F4F9FD;
                    border-radius: 6px;
                    &:focus{
                        box-shadow: 0px 4px 4px 0px #0000000D;
                    }
                    &.txtarea{
                        height: 159px;
                    }
                }
            }
            .btn-blk{
                display: flex;
                flex-wrap: wrap;
                justify-content: flex-end;
                margin-top: 42px;
                .btn-submit{
                    width: 183px;
                    height: 41px;
                    display: flex;
                    align-items: center;
                    justify-content: center;
                    color: #fff;
                    font-weight: 500;
                    font-size: 16px;
                    background-color: #0E2F4B;
                    border-radius: 20px;
                }
            }
        }
    }
}