Elements

These modular elements can be readily used and customized across pages and in different blocks.


	<div class="row">
		<div class="col-md-5 col-lg-4">
			<div class="media contact-media">
				<div class="icon icon-circle">
					<i class="fa fa-map-marker" aria-hidden="true"></i>
				</div>
				<div class="media-body">
					14631 Hill Country New York <br>
					Austin, expert 68472
				</div>
			</div>
			<div class="media contact-media">
				<div class="icon icon-circle">
					<i class="fa fa-phone" aria-hidden="true"></i>
				</div>
				<div class="media-body">
					+9623 442 1083 446 <br>
					+9613 573 3544 289
				</div>
			</div>
			<div class="media contact-media">
				<div class="icon icon-circle">
					<i class="fa fa-envelope-o" aria-hidden="true"></i>
				</div>
				<div class="media-body">
					info@onex.com <br>
					contact@onex.com
				</div>
			</div>
		</div>

		<div class="col-md-7 col-lg-8">
			<form class="">
				<div class="row pt-5">
					<div class="form-group col-md-6">
						<input type="text" class="form-control" id="exampleInputName" placeholder="Name">
					</div>
					<div class="form-group col-md-6">
						<input type="email" class="form-control" id="exampleInputEmail" placeholder="Email">
					</div>
					<div class="form-group col-md-12">
						<textarea class="form-control" id="exampleTextarea" rows="6" placeholder="Message"></textarea>
					</div>
				</div>
				<div class="d-flex">
						<button type="submit" class="btn btn-lg btn-primary ml-auto">Send Message</button>
				</div>
			</form>
		</div>
	</div>
how to use
  • Copy the code. Don't remove the classnames. Use your own class for customization

Example:

14631 Hill Country New York
Austin, expert 68472
+9623 442 1083 446
+9613 573 3544 289
info@onex.com
contact@onex.com 

	<div class="row">
		<div class="col-md-7 col-lg-8">
			<form class="">
				<div class="row pt-5">
					<div class="form-group col-md-6">
						<input type="text" class="form-control" id="exampleInputName" placeholder="Name">
					</div>
					<div class="form-group col-md-6">
						<input type="email" class="form-control" id="exampleInputEmail" placeholder="Email">
					</div>
					<div class="form-group col-12">
						<textarea class="form-control" id="exampleTextarea" rows="6" placeholder="Message"></textarea>
					</div>
				</div>
				<div class="d-flex">
					<button type="submit" class="btn btn-lg btn-primary mr-auto">Send Message</button>
				</div>
			</form>
		</div>

		<div class="col-md-5 col-lg-4">
			<div class="media contact-media flex-row-reverse">
				<div class="icon icon-ract ract45">
					<i class="fa fa-map-marker" aria-hidden="true"></i>
				</div>
				<div class="media-body text-right">
					14631 Hill Country New York <br>
					Austin, expert 68472
				</div>
			</div>
			<div class="media contact-media flex-row-reverse">
				<div class="icon icon-ract ract45">
					<i class="fa fa-phone" aria-hidden="true"></i>
				</div>
				<div class="media-body text-right">
					+9623 442 1083 446 <br>
					+9613 573 3544 289
				</div>
			</div>
			<div class="media contact-media flex-row-reverse">
				<div class="icon icon-ract ract45">
					<i class="fa fa-envelope-o" aria-hidden="true"></i>
				</div>
				<div class="media-body text-right">
					info@onex.com <br>
					contact@onex.com
				</div>
			</div>
		</div>
	</div>
how to use
  • Copy the code. Don't remove the classnames. Use your own class for customization

Example:

14631 Hill Country New York
Austin, expert 68472
+9623 442 1083 446
+9613 573 3544 289
info@onex.com
contact@onex.com