<!-- CONTACT US PAGE -->

<section class="contact-us-page">
    <div class="container">
        <div class="row">
            <div class="col-md-12 col-sm-12 col-xs-12">
                <h2 class="heading">CONTACT <span>US</span></h2>
            </div>

            <div class="col-md-6 col-sm-6 col-xs-12">
                <form action="" class="contact-us-form-page">
                    <h4>Contact Form</h4>
                    
                    <div class="contact-us-form-box">
                    <label for=""> Enter Name <span>*</span> </label>
                        <input type="text" placeholder="Enter Your Full Name">
                    </div>
                    <div class="contact-us-form-box">
                        <label for=""> Email Id <span>*</span> </label>
                        <input type="text" placeholder="Enter Your Email Id">
                    </div>
                    <div class="contact-us-form-box">
                        <label for=""> Message <span>*</span> </label>
                        <textarea name="" id="" rows="5" placeholder="Message"></textarea>
                    </div>
                    <button>SUBMIT</button>
                </form>
            </div>

            <div class="col-md-6 col-sm-6 col-xs-12">
                <div class="information-box">
                    <h4>INFORMATION</h4>
                    <ul>
                        <li>** Please note that response and issue resolving time will be maximum of 24Hrs from the time of complaint.</li>
                        
                        <li><i class="far fa-envelope"></i> info@unboxcatalysts.com</li>
                        <li><i class="fab fa-edge"></i> unboxcatalysts.com</li>
                    </ul>
                </div>
               
                <!-- <div class="col-md-4 col-sm-4 col-xs-12">
				<div class="contactus-points-box">
					<img src="https://www.yeti.com/on/demandware.static/-/Library-Sites-SiteGenesisSharedLibrary/default/dwffe66454/images/contactus/icon-shipping.svg" alt="">
					<h4>SHIPPING & RETURNS</h4>
				</div>
			</div> -->
                <!-- <div class="col-md-4 col-sm-4 col-xs-12">
				<div class="contactus-points-box">
					<img src="https://www.yeti.com/on/demandware.static/-/Library-Sites-SiteGenesisSharedLibrary/default/dw6681d0e5/images/contactus/icon-warranty.svg" alt="">
					<h4>WARRANTY</h4>
				</div>
			</div> -->
                
                <!-- <div class="col-md-4 col-sm-4 col-xs-12">
				<div class="contactus-points-box">
					<img src="https://www.yeti.com/on/demandware.static/-/Library-Sites-SiteGenesisSharedLibrary/default/dw0527666a/images/contactus/200028-Privacy-Inquiry-Icon.svg" alt="">
					<h4>PRIVACY INQUIRY</h4>
				</div>
			</div> -->
                
            </div>
        </div>
    </div>
</section>

<!-- CSS FOR CONNECT WITH US -->

<style>
    .contact-us-page {
        padding: 3em 0;
        border-top: 2px solid #f0f0f0;
    }

    .heading {
        position: relative;
        margin: 0 0 10px;
        padding-bottom: 22px;
        text-align: center;
        font-size: 26px;
        color: #ec2027;
        font-family: 'Roboto Slab', serif;
    }

    .contact-us-page .contact-us-form-page {
        background: whitesmoke;
        padding: 30px;
        margin-top: 1em;
        border-radius: 4px;
        border: 1px solid #d6d6d6;
        box-shadow: -2px 4px 10px 2px #ccc;
        border-top: 8px solid #ec2027;
    }


    .contact-us-page .information-box h4 {
        margin: 0;
        color: #292929;
        font-size: 22px;
        border-bottom: 2px solid;
        padding-bottom: 10px;
        margin-bottom: 10px;
    }

    .contact-us-page .information-box ul li {
        color: #000;
        margin-bottom: 16px;
        font-weight: 400;
    }

    .contact-us-page .contactus-points-box {
        text-align: center;
        margin-top: 1em;
        background: #ec2027;
        padding: 20px 0;
        border-radius: 4px;
        border: 1px solid #d6d6d6;
    }

    .contact-us-page .contactus-points-box img {
        width: 30%;
        height: 48px;
    }

    .contact-us-page .contactus-points-box h4 {
        margin: 0;
        font-size: 13px;
        color: #fff;
        padding-top: 20px;

    }


    .contact-us-page .contact-us-form-page h4 {
        margin: 0;
        color: #000;
        font-size: 20px;
        border-bottom: 2px solid #d2d2d2;
        padding-bottom: 10px;
        margin-bottom: 1em;
        font-weight: 600;
    }

    .contact-us-page .contact-us-form-page label {
        width: 100%;
        margin: 0;
        color: #000;
        font-size: 14px;
        padding-bottom: 10px;
        font-weight: 500;
    }

    .contact-us-page .contact-us-form-page input,
    .contact-us-page .contact-us-form-page textarea {
        width: 100%;
        padding: 14px;
        color: #000;
        outline: none;
        margin-bottom: 2em;
        border: 1px solid #d4d4d4;
        border-radius: 6px;
        font-weight: 400;
    }

    .contact-us-page .information-box ul {
        background: whitesmoke;
        padding: 20px;
        border-radius: 4px;
        border: 1px solid #d6d6d6;
        box-shadow: -2px 4px 10px 2px #ccc;
    }

    .contact-us-page .contact-us-form-page button:hover {
        background: #fff;
        color: #ec2027;
    }

    .contact-us-page .contact-us-form-page button {
        background: #ec2027;
        border: none;
        color: #fff;
        padding: 10px 30px;
        font-size: 16px;
        border-radius: 4px;
        outline: none;
        transition: all .25s ease-in-out;
        border: 1px solid #ef555a;
    }

    .contact-us-page .contact-us-form-page label span {
        color: blue;
    }
</style>