website/index.html

527 lines
34 KiB
HTML
Executable File

<!DOCTYPE html>
<!--[if lt IE 7]><html class="no-js lt-ie10 lt-ie9 lt-ie8 lt-ie7 "> <![endif]-->
<!--[if IE 7]><html class="no-js lt-ie10 lt-ie9 lt-ie8"> <![endif]-->
<!--[if IE 8]><html class="no-js lt-ie10 lt-ie9"> <![endif]-->
<!--[if IE 9]><html class="no-js lt-ie10"> <![endif]-->
<!--[if gt IE 8]><!-->
<html class="no-js">
<!--<![endif]-->
<head>
<!-- Basic Page Needs -->
<meta charset="utf-8">
<title>Automated Bytes</title>
<meta name="description" content="">
<meta name="author" content="">
<!-- Mobile Specific Metas -->
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<!-- Favicons -->
<link rel="shortcut icon" href="content/firm/images/favicon.ico">
<!-- FONTS -->
<link rel='stylesheet' href='http://fonts.googleapis.com/css?family=Roboto:100,300,400,400italic,700'>
<link rel='stylesheet' href='http://fonts.googleapis.com/css?family=Patua+One:100,300,400,400italic,700'>
<link rel='stylesheet' href='http://fonts.googleapis.com/css?family=Raleway:200,400,400italic,700,700italic,900'>
<link rel='stylesheet' href='http://fonts.googleapis.com/css?family=Biryani:200,400,400italic,700,700italic,900'>
<!-- CSS -->
<link rel='stylesheet' href='css/global.css'>
<link rel='stylesheet' href='content/firm/css/structure.css'>
<link rel='stylesheet' href='content/firm/css/firm.css'>
<link rel='stylesheet' href='content/firm/css/custom.css'>
</head>
<body class="home layout-full-width nice-scroll-on mobile-tb-left button-flat no-content-padding no-table-hover header-stack header-center minimalist-header-no sticky-header sticky-white ab-hide subheader-both-center menu-line-below-80-1 menuo-no-borders footer-copy-center tr-header tr-menu tr-content">
<!-- Main Theme Wrapper -->
<div id="Wrapper">
<!-- Header Wrapper -->
<div id="Header_wrapper">
<!-- Header -->
<header id="Header">
<!-- Header - Logo and Menu area -->
<div id="Top_bar">
<div class="container">
<div class="column one">
<div class="top_bar_left clearfix">
<!-- Logo-->
<div class="logo">
<a id="logo" href="index-firm.html" title="BeFirm - BeTheme"><img class="logo-main scale-with-grid" src="content/firm/images/firm.png" alt="BeFirm - BeTheme" /><img class="logo-sticky scale-with-grid" src="content/firm/images/firm.png" alt=""><img class="logo-mobile scale-with-grid" src="content/firm/images/firm.png" alt="">
</a>
</div>
<!-- Main menu-->
<div class="menu_wrapper">
<nav id="menu" class="menu-main-menu-container">
<ul id="menu-main-menu" class="menu">
<li class="current_page_item">
<a href="index.html"><span>Home</span></a>
</li>
<li>
<a href="content/firm/about.html"><span>About</span></a>
</li>
<li>
<a href="content/firm/offer.html"><span>Offer</span></a>
</li>
<li>
<a href="content/firm/our-crew.html"><span>Our crew</span></a>
</li>
<li>
<a href="content/firm/contact.html"><span>Contact</span></a>
</li>
<li>
<a target="_blank" href="http://bit.ly/1M6lijQ"><span><span style="padding: 0; color: #e8ca00;">Buy now</span></span></a>
</li>
</ul>
</nav><a class="responsive-menu-toggle" href="#"><i class="icon-menu"></i></a>
</div>
<!-- Secondary menu area - only for certain pages -->
<div class="secondary_menu_wrapper"></div>
<!-- Banner area - only for certain pages-->
<div class="banner_wrapper"></div>
<!-- Header Searchform area-->
<div class="search_wrapper">
<form method="get" id="searchform" action="#">
<i class="icon_search icon-search"></i><a href="#" class="icon_close"><i class="icon-cancel"></i></a>
<input type="text" class="field" name="s" id="s" placeholder="Enter your search" />
<input type="submit" class="submit" value="" style="display:none;" />
</form>
</div>
</div>
</div>
</div>
</div>
</header>
</div>
<!-- Main Content -->
<div id="Content">
<div class="content_wrapper clearfix">
<div class="sections_group">
<div class="entry-content">
<div class="section mcb-section full-screen " style="padding-top:120px; padding-bottom:80px; ">
<div class="section_wrapper mcb-section-inner">
<div class="wrap mcb-wrap one clearfix">
<!-- One Full Row-->
<div class="column mcb-column one column_divider ">
<hr class="no_line" style="margin: 0 auto 80px;" />
</div>
<!-- One Full Row-->
<div class="column mcb-column one column_column">
<div class="column_attr align_center">
<h1 style="color: #fff; margin: 0;">AUTOMATED BYTES
<br>
EMPOWERS YOUR I.T.</h1>
</div>
</div>
<!-- One Full Row-->
<div class="column mcb-column one column_column">
<div class="column_attr align_center">
<div style="width: 100%; height: 1px; background: #fff;"></div>
</div>
</div>
<!-- One Sixth (1/6) Column -->
<div class="column mcb-column one-sixth column_placeholder">
<div class="placeholder">
&nbsp;
</div>
</div>
<!-- Two Third (2/3) Column -->
<div class="column mcb-column two-third column_column">
<div class="column_attr align_center">
<h4 style="color: #fff;">Give your staff the technical assistance they need to elevate your business</h4>
</div>
</div>
<!-- One Full Row-->
<div class="column mcb-column one column_column column-margin-0px">
<div class="column_attr align_center">
<a class="button button_right button_large button_js" href="content/firm/about.html"><span class="button_icon"><i class="icon-comment-line" ></i></span><span class="button_label">See the details</span></a>
</div>
</div>
</div>
</div>
</div>
<div class="section mcb-section section-border-top " style="padding-top:0px; padding-bottom:0px; background-color:rgba(255,230,0,.9)">
<div class="section_wrapper mcb-section-inner">
<div class="wrap mcb-wrap one column-margin-0px clearfix">
<!-- One Full Row-->
<div class="column mcb-column one column_image ">
<div class="image_frame image_item no_link scale-with-grid aligncenter no_border">
<div class="image_wrapper"><img class="scale-with-grid" src="content/firm/images/home_firm_sep.png" alt="" width="1" height="98" />
</div>
</div>
</div>
<!-- One Full Row-->
<div class="column mcb-column one column_divider ">
<hr class="no_line" style="margin: 0 auto 30px;" />
</div>
<!-- One Full Row-->
<div class="column mcb-column one column_column">
<div class="column_attr align_center" style=" padding:0 5%;">
<p>
Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium
</p>
<hr class="no_line" style="margin: 0 auto 20px;" />
<h2><span style="color: #fff;">Excepteur sint occaecat</span> cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</h2>
<h2 style="font-weight: 200;">Sed ut perspiciatis unde omnis iste natus error sit volupta.</h2>
<hr class="no_line" style="margin: 0 auto 40px;" />
<a class="button button_large button_theme button_js" href="content/firm/about.html"><span class="button_label">Read more</span></a>
</div>
</div>
<!-- One Full Row-->
<div class="column mcb-column one column_divider ">
<hr class="no_line" style="margin: 0 auto 20px;" />
</div>
<!-- One Full Row-->
<div class="column mcb-column one column_image ">
<div class="image_frame image_item no_link scale-with-grid aligncenter no_border">
<div class="image_wrapper"><img class="scale-with-grid" src="content/firm/images/home_firm_sep.png" alt="" width="1" height="98" />
</div>
</div>
</div>
</div>
</div>
</div>
<div class="section mcb-section section-border-top " style="padding-top:120px; padding-bottom:80px; background-color:rgba(6,12,23,.7); background-image:url(content/firm/images/home_firm_pattern1.png); background-repeat:repeat; background-position:center top; ">
<div class="section_wrapper mcb-section-inner">
<div class="wrap mcb-wrap one clearfix">
<!-- One Full Row-->
<div class="column mcb-column one column_column">
<div class="column_attr align_center">
<h2 style="color: #fff;">WHAT CAN WE DO?</h2>
<p style="color: #fff;">
Sed ut per omnis iste natus error sit voluptatemiumpiciatis unde omnis iste natus
<br> cerror sit voluptatem accusantium
</p>
</div>
</div>
<!-- One Third (1/3) Column -->
<div class="column mcb-column one-third column_zoom_box ">
<div class="zoom_box">
<a href="content/firm/offer.html">
<div class="photo"><img class="scale-with-grid" src="content/firm/images/home_firm_offer1.jpg" alt="" width="700" height="1305" />
</div>
<div class="desc" style="background-color:rgba(9, 21, 46, 0.8);">
<div class="desc_wrap">
<div class="desc_img"><img class="scale-with-grid" src="content/firm/images/home_firm_ico1.png" alt="">
</div>
<div class="desc_txt">
Sed fringilla purus nec tortor
</div>
</div>
</div>
</a>
</div>
</div>
<!-- One Third (1/3) Column -->
<div class="column mcb-column one-third column_zoom_box ">
<div class="zoom_box">
<a href="content/firm/offer.html">
<div class="photo"><img class="scale-with-grid" src="content/firm/images/home_firm_offer2.jpg" alt="" width="700" height="1305" />
</div>
<div class="desc" style="background-color:rgba(9, 21, 46, 0.8);">
<div class="desc_wrap">
<div class="desc_img"><img class="scale-with-grid" src="content/firm/images/home_firm_ico2.png" alt="">
</div>
<div class="desc_txt">
Praesent eu sodales lacus
</div>
</div>
</div>
</a>
</div>
</div>
<!-- One Third (1/3) Column -->
<div class="column mcb-column one-third column_zoom_box ">
<div class="zoom_box">
<a href="content/firm/offer.html">
<div class="photo"><img class="scale-with-grid" src="content/firm/images/home_firm_offer3.jpg" alt="" width="700" height="1305" />
</div>
<div class="desc" style="background-color:rgba(9, 21, 46, 0.8);">
<div class="desc_wrap">
<div class="desc_img"><img class="scale-with-grid" src="content/firm/images/home_firm_ico3.png" alt="">
</div>
<div class="desc_txt">
Ut nec varius mauris sceleris
</div>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
<div class="section mcb-section section-border-top " style="padding-top:120px; padding-bottom:80px; background-color:rgba(255,255,255,.9)">
<div class="section_wrapper mcb-section-inner">
<div class="wrap mcb-wrap one clearfix">
<!-- One Full Row-->
<div class="column mcb-column one column_column">
<div class="column_attr">
<h2>Proin suscipit elit nulla id arcu</h2>
</div>
</div>
<!-- One Second (1/2) Column -->
<div class="column mcb-column one-second column_column">
<div class="column_attr" style=" background-color:rgba(255,255,255,.8); padding:30px 20px;">
<div style="background: url(content/firm/images/home_firm_icon1.png) no-repeat left top; padding-left: 65px; margin-bottom: 30px;">
<h4 style="margin-bottom: 7px;">Suspendisse hendrerit ex</h4>
<p>
Dictum varius; erat risus tempus mi, ac molestie velit leo vel ligula. Pellentesque ullamcorper, lacus nec.
</p>
</div>
<div style="background: url(content/firm/images/home_firm_icon2.png) no-repeat left top; padding-left: 65px; margin-bottom: 30px;">
<h4 style="margin-bottom: 7px;">Nullam consectetur ipsum</h4>
<p>
Proin eu lacinia purus. Praesent dui metus, mattis nec nulla vel, pharetra scelerisque mi nullam finibus.
</p>
</div>
<div style="background: url(content/firm/images/home_firm_icon3.png) no-repeat left top; padding-left: 65px;">
<h4 style="margin-bottom: 7px;">Consectetur ipsumx</h4>
<p>
Pharetra scelerisque mi. Nullam consectetur ipsum finibus dui pulvinar, vel tempor sapien sed.
</p>
</div>
</div>
</div>
<!-- One Second (1/2) Column -->
<div class="column mcb-column one-second column_column">
<div class="column_attr" style=" padding:15px 0 0 3%;">
<h4>Proin accumsan mauris elit, suscipit iaculis mi elementum sit amet. Pellentesque suscipit metus justo, vitae auctor lacus convallis id. Praesent dolor volutpat.</h4>
<p>
Dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
</p>
<a class="button button_large button_theme button_js" href="content/firm/about.html"><span class="button_label">Read more</span></a>
</div>
</div>
</div>
</div>
</div>
<div class="section mcb-section section-border-top " style="padding-top:120px; padding-bottom:80px; background-color:rgba(227,229,232,.95)">
<div class="section_wrapper mcb-section-inner">
<div class="wrap mcb-wrap one clearfix">
<!-- One Full Row-->
<div class="column mcb-column one column_column">
<div class="column_attr">
<h2>We can help you</h2>
</div>
</div>
<div class="column mcb-column one-fourth column_column">
<div class="column_attr" style=" padding:0 5% 0 0;">
<h4>Our crew</h4>
<p class="big">
Praesent gravida sollicitudin enim, vel consectetur.
</p>
<p>
pellentesque condimentum. Aenean nec sollicitudin libero, ut ultrices libero. Morbi ultricies posuere.
</p>
</div>
</div>
<div class="column mcb-column one-fourth column_image ">
<div class="image_frame image_item no_link scale-with-grid aligncenter no_border">
<div class="image_wrapper"><img class="scale-with-grid" src="content/firm/images/home_firm_staff1.jpg" alt="" width="700" height="750" />
</div>
</div>
</div>
<div class="column mcb-column one-fourth column_image ">
<div class="image_frame image_item no_link scale-with-grid aligncenter no_border">
<div class="image_wrapper"><img class="scale-with-grid" src="content/firm/images/home_firm_staff2.jpg" alt="" width="700" height="750" />
</div>
</div>
</div>
<div class="column mcb-column one-fourth column_image ">
<div class="image_frame image_item no_link scale-with-grid aligncenter no_border">
<div class="image_wrapper"><img class="scale-with-grid" src="content/firm/images/home_firm_staff3.jpg" alt="" width="700" height="750" />
</div>
</div>
</div>
</div>
</div>
</div>
<div class="section mcb-section section-border-top " style="padding-top:200px; padding-bottom:160px; ">
<div class="section_wrapper mcb-section-inner">
<div class="wrap mcb-wrap one clearfix">
<!-- One Full Row-->
<div class="column mcb-column one column_column">
<div class="column_attr align_center">
<h1 style="color: #fff;">INTERESTED?
<br>
PLEASE <a style="color: #ffe600;" href="content/firm/contact.html">CONTACT US</a></h1>
</div>
</div>
</div>
</div>
</div>
<div class="section the_content no_content">
<div class="section_wrapper">
<div class="the_content_wrapper"></div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Footer-->
<footer id="Footer" class="clearfix">
<div class="widgets_wrapper" style="padding:40px 0;">
<div class="container">
<!-- One Fourth (1/4) Column -->
<div class="column one-fourth">
<!-- Text Area -->
<aside class="widget widget_text">
<h4>Aenean sollicit</h4>
<div class="textwidget">
<ul style="border-left: 1px solid rgba(255, 255, 255, 0.1); padding-left: 20px; line-height: 32px;">
<li>
<a href="#">Quent per conubia nostra</a>
</li>
<li>
<a href="#">Nceptos himenaeos</a>
</li>
<li>
<a href="#">Mauris in erat</a>
</li>
<li>
<a href="#">Lustoac</a>
</li>
</ul>
</div>
</aside>
</div>
<!-- One Fourth (1/4) Column -->
<div class="column one-fourth">
<!-- Text Area -->
<aside class="widget widget_text">
<h4>Bibendum auctor</h4>
<div class="textwidget">
<ul style="border-left: 1px solid rgba(255, 255, 255, 0.1); padding-left: 20px; line-height: 32px;">
<li>
<a href="#">Aenean sollicitudin orem qui</a>
</li>
<li>
<a href="#">Duis sed odio sit amet nibh</a>
</li>
<li>
<a href="#">Morbi accumsan ipsum velit</a>
</li>
<li>
<a href="#">Nam nec tellus </a>
</li>
<li>
<a href="#">Class aptent taciti sociosqu </a>
</li>
<li>
<a href="#">Mauris in erat justo</a>
</li>
<li>
<a href="#">Sed non neque</a>
</li>
</ul>
</div>
</aside>
</div>
<!-- One Fourth (1/4) Column -->
<div class="column one-fourth">
<!-- Text Area -->
<aside class="widget widget_text">
<h4>Quisque cursus</h4>
<div class="textwidget">
<ul style="border-left: 1px solid rgba(255, 255, 255, 0.1); padding-left: 20px; line-height: 32px;">
<li>
<a href="#">Duis sed odio sit amet nibh</a>
</li>
<li>
<a href="#">Morbi accumsan ipsum velit</a>
</li>
<li>
<a href="#">Nam nec tellus </a>
</li>
<li>
<a href="#">Class aptent taciti sociosqu </a>
</li>
<li>
<a href="#">Mauris in erat justo</a>
</li>
<li>
<a href="#">Sed non neque</a>
</li>
</ul>
</div>
</aside>
</div>
<!-- One Fourth (1/4) Column -->
<div class="column one-fourth">
<!-- Text Area -->
<aside class="widget widget_text">
<h4>Vesti bulum</h4>
<div class="textwidget">
<ul style="border-left: 1px solid rgba(255, 255, 255, 0.1); padding-left: 20px; line-height: 32px;">
<li>
<a href="#">Nam nec tellus </a>
</li>
<li>
<a href="#">Class aptent taciti sociosqu </a>
</li>
<li>
<a href="#">Mauris in erat justo</a>
</li>
<li>
<a href="#">Sed non neque</a>
</li>
</ul>
</div>
</aside>
</div>
</div>
</div>
<!-- Footer copyright-->
<div class="footer_copy">
<div class="container">
<div class="column one">
<div class="copyright">
&copy; 2017 BeFirm - BeTheme. Muffin group - HTML by <a target="_blank" rel="nofollow" href="http://bit.ly/1M6lijQ">BeantownThemes</a>
</div>
<!--Social info area-->
<ul class="social"></ul>
</div>
</div>
</div>
</footer>
</div>
<!-- JS -->
<script src="js/jquery-2.1.4.min.js"></script>
<script src="js/mfn.menu.js"></script>
<script src="js/jquery.plugins.js"></script>
<script src="js/jquery.jplayer.min.js"></script>
<script src="js/animations/animations.js"></script>
<script src="js/translate3d.js"></script>
<script src="js/scripts.js"></script>
<script>
jQuery(window).load(function() {
var retina = window.devicePixelRatio > 1 ? true : false;
if (retina) {
var retinaEl = jQuery("#logo img.logo-main");
var retinaLogoW = retinaEl.width();
var retinaLogoH = retinaEl.height();
retinaEl.attr("src", "content/firm/images/retina-firm.png").width(retinaLogoW).height(retinaLogoH);
var stickyEl = jQuery("#logo img.logo-sticky");
var stickyLogoW = stickyEl.width();
var stickyLogoH = stickyEl.height();
stickyEl.attr("src", "content/firm/images/retina-firm.png").width(stickyLogoW).height(stickyLogoH);
var mobileEl = jQuery("#logo img.logo-mobile");
var mobileLogoW = mobileEl.width();
var mobileLogoH = mobileEl.height();
mobileEl.attr("src", "content/firm/images/retina-firm.png").width(mobileLogoW).height(mobileLogoH);
}
});
</script>
</body>
</html>