<?php require_once(THEME_ROOT . '/blocks/head.php'); ?>
<?php require_once(THEME_ROOT . '/blocks/top.php'); ?>
    <style>
        @media ( max-width: 700px ) {
            .stripes {
                grid: repeat(5, 40px)/repeat(10, 1fr) !important;
            }
        }
    </style>
    <div class="container text-center">
        <div class="row optimize_margin">
            <h1 class="animated fadeInDown"
                style="color:#fff;margin-bottom:175px;"><?php echo T('Связаться с нами'); ?></h1>
        </div>
    </div>
    <style>
        .page-contact {
            position: relative;
            z-index: 1;
        }

        .page-contact .block-contact {
            border-radius: 10px;
            background: linear-gradient(135deg, #080e7b 15%, #a23aff 85%);
            padding: 10px;
            box-shadow: 0 2px 12px -3px #9a51ff;
        }

        .form-login-auth input {
            color: #fff !important;
            background: transparent;
        }

        .form-login-auth input::placeholder {
            color: #fff;
        }

        .form-login-auth textarea::placeholder {
            color: #fff;
        }

        .form-login-auth textarea {
            background: transparent;
            font-size: 18px;
            color: #fff;
            border: 0;
            width: 100%;
            font-weight: 400;
            resize: none;
            outline: 0;
        }

        .page-contact .col-md-4 .block-contacts {
            text-align: center;
            padding: 10px;
            color: #fff;
            border-radius: 10px;
            font-weight: 300;
            margin-bottom: 10px;
            color: rgb(50, 50, 93);
            text-align: left;
            box-shadow: 0 2px 5px rgba(134, 150, 168, 0.29);
        }

        .page-contact .col-md-4 .block-contacts h3 {
            font-weight: 400;
            margin: 0;
            margin-left: 10px;
        }

        .page-contact .col-md-4 .block-contacts p {
            margin-left: 10px;
            margin-bottom: 0;
        }

        footer {
            margin-top: 0;
        }
    </style>

    <div class="page-contact">
        <div class="container">
            <div style="margin-bottom:30px;" class="row">
                <div class="col-md-4">
                    <div class="block-contacts">
                        <table>
                            <tbody>
                            <tr>
                                <td>
                                    <svg xmlns="http://www.w3.org/2000/svg" width="40" height="40" viewbox="0 0 24 24"
                                         fill="none" stroke="#32325d" stroke-width="2" stroke-linecap="round"
                                         stroke-linejoin="round">
                                        <path d="M4 4h16c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2z"></path>
                                        <polyline points="22,6 12,13 2,6"></polyline>
                                    </svg>
                                </td>
                                <td>
                                    <h3><?php if (isset($social_links['email'])) { ?>
                                            <?php echo escape($social_links['email']); ?>
                                        <?php } ?></h3>
                                    <p><?php echo T('Напишите нам'); ?></p>
                                </td>
                            </tr>
                            </tbody>
                        </table>
                    </div>
                </div>

                <?php if (isset($social_links['phone'])) { ?>
                    <div class="col-md-4">
                        <div class="block-contacts">
                            <table>
                                <tbody>
                                <tr>
                                    <td>
                                        <svg xmlns="http://www.w3.org/2000/svg" width="40" height="40" viewbox="0 0 24 24"
                                             fill="none" stroke="#32325d" stroke-width="2" stroke-linecap="round"
                                             stroke-linejoin="round">
                                            <path d="M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72 12.84 12.84 0 0 0 .7 2.81 2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45 12.84 12.84 0 0 0 2.81.7A2 2 0 0 1 22 16.92z"></path>
                                        </svg>
                                    </td>
                                    <td>
                                        <h3><?php echo escape($social_links['phone']); ?></h3>
                                        <p><?php echo T('Горячая линия'); ?></p>
                                    </td>
                                </tr>
                                </tbody>
                            </table>
                        </div>
                    </div>
                <?php } ?>

                <?php if (isset($social_links['address'])) { ?>
                    <div class="col-md-4">
                        <div class="block-contacts">
                            <table>
                                <tbody>
                                <tr>
                                    <td>
                                        <svg xmlns="http://www.w3.org/2000/svg" width="40" height="40" viewbox="0 0 24 24"
                                             fill="none" stroke="#32325d" stroke-width="2" stroke-linecap="round"
                                             stroke-linejoin="round">
                                            <path d="M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0 1 18 0z"></path>
                                            <circle cx="12" cy="10" r="3"></circle>
                                        </svg>
                                    </td>
                                    <td>
                                        <h3><?php echo escape($social_links['address']); ?></h3>
                                        <p><?php echo T('Наш адрес'); ?></p>
                                    </td>
                                </tr>
                                </tbody>
                            </table>
                        </div>
                    </div>
                <?php } ?>
            </div>
            <div class="row">

                <div class="col-md-7">
                    <div style="width:50%;float:left;">
                        <div style="background:#f6f9fc;padding:10px;border-radius:10px;">
                            <img style="max-width:100%;box-shadow:0 14px 24px 0 rgba(41, 68, 95, 0.17), 0 5px 13px 0 rgba(41, 68, 95, 0.4);border-radius:10px;" src="/theme/demo108/assets/common/Assets/images/office.png">
                        </div>
                    </div>
                    <div style="width:50%;float:left;">
                        <div style="padding:10px;">
                            <?php if (isset($social_links['address'])) { ?>
                                <p style="font-size:20px;font-weight:300;"><?php echo escape($social_links['address']); ?></p>
                            <?php } ?>
                            <?php if (isset($social_links['email'])) { ?>
                                <p style="font-size:20px;font-weight:300;"><?php echo escape($social_links['email']); ?></p>
                            <?php } ?>
                            <?php if (isset($social_links['phone'])) { ?>
                                <p style="font-size:20px;font-weight:300;"><?php echo escape($social_links['phone']); ?></p>
                            <?php } ?>
                        </div>
                    </div>
                    <iframe style="margin-top:20px;border-radius:10px;"
                            src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d967.9285949822505!2d149.13101736261234!3d-35.31316818978098!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x0%3A0xa2fc482397261daa!2sMinter+Ellison!5e0!3m2!1sru!2sru!4v1499375925762"
                            width="100%" height="250" frameborder="0" allowfullscreen></iframe>
                </div>

                <div class="col-md-5">
                    <div class="block-contact">
                        <div style="padding:0px 30px;" class="form-login-auth">

                            <?php echo flash_show('support'); ?>
                            <form method="post" action="/handlers/support.php">
                                <?php echo form_init(); ?>
                                <h3 style="color:#fff;text-align:center;font-weight:300;"><?php echo T('Связаться с нами:'); ?></h3>
                                <label>
                                    <input type="text" name="login" value="<?php echo escape(post('login')); ?>" required size="30" class="inpts" placeholder="<?php echo T('Логин'); ?>">
                                </label>
                                <label>
                                    <input type="email" name="email" value="<?php echo escape(post('email')); ?>" required size="30" class="inpts" placeholder="E-mail">
                                </label>
                                <label style="height:auto;">
                                <textarea name="message" required class="message" cols="45" rows="4" placeholder="<?php echo T('Сообщение ...'); ?>"><?php echo escape(post('message')); ?></textarea>
                                </label>

                                <div id="captcha_support" style="margin-top: 10px;"></div>

                                <div class="text-center">
                                    <input type="submit" value="<?php echo T('Отправить'); ?>" name="Send" class="sbmt">
                                </div>
                            </form>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

<?php require_once(THEME_ROOT . '/blocks/footer.php'); ?>