|
After Width: | Height: | Size: 240 KiB |
|
After Width: | Height: | Size: 278 KiB |
|
After Width: | Height: | Size: 530 KiB |
|
After Width: | Height: | Size: 156 KiB |
|
After Width: | Height: | Size: 435 KiB |
|
After Width: | Height: | Size: 232 KiB |
|
After Width: | Height: | Size: 247 KiB |
|
After Width: | Height: | Size: 266 KiB |
|
After Width: | Height: | Size: 302 KiB |
|
After Width: | Height: | Size: 185 KiB |
|
After Width: | Height: | Size: 234 KiB |
@ -1,152 +1,226 @@ |
|||||
<!-- Hero Section --> |
<!-- Hero Section --> |
||||
<div class="container pt-4 mt-4 rounded" style="background-color: #f0f2f4; font-family: Montserrat, 'sans-serif';"> |
<div class="container pt-4 mt-4 rounded" style="background-color: #f0f2f4; font-family: Montserrat, 'sans-serif';"> |
||||
<div class="row"> |
<div class="row"> |
||||
<div class="col-lg-12 mb-4"> |
<div class="col-lg-12 mb-4"> |
||||
<img src="images/Cybrosys.png" alt="Cybrosys Logo" style="width: 120px; height: auto;"> |
<img src="images/Cybrosys.png" alt="Cybrosys Logo" style="width: 120px; height: auto;"> |
||||
<hr style="border-color: #e1e5e9;" /> |
<hr style="border-color: #e1e5e9;" /> |
||||
</div> |
</div> |
||||
</div> |
|
||||
<div class="row"> |
|
||||
<div class="col-lg-12 text-center"> |
|
||||
<img src="images/hero.png" width=60% height="auto" class="mb-4" alt="Theme Screenshot"> |
|
||||
</div> |
|
||||
<div class="col-lg-12 text-center"> |
|
||||
<h1 class="mt-4">Theme Xtream</h1> |
|
||||
<p class="lead" style="max-width: 700px; margin: 0 auto;"> |
|
||||
Theme Xtream is a attractive and unique front end theme mainly suitable for eCommerce website. Many custom |
|
||||
designed snippets facilitates to add better user experience. Contains best deals with new arrival products |
|
||||
slider, testimonial slider that are configured from the backend. This theme fully customized the eCommerce website, shop view, custom categories view, product view, contact us page...etc. it contains price filter and clear cart options by default. |
|
||||
</p> |
|
||||
</div> |
|
||||
</div> |
|
||||
<div class="row"> |
|
||||
<div class="col-lg-12 text-center p-4"> |
|
||||
<a href="#" class="btn btn-primary m-2 px-4 py-3 shadow-sm" style=" |
|
||||
background-color: #b22126; |
|
||||
border-style: none; |
|
||||
border-radius: 4em; |
|
||||
font-weight: bold; |
|
||||
"><i class="fa fa-desktop mr-2"></i>Live Demo</a> |
|
||||
<a href="#" class="btn btn-primary m-2 px-4 py-3 shadow-sm" style=" |
|
||||
background-color: #576574; |
|
||||
border-style: none; |
|
||||
border-radius: 4em; |
|
||||
font-weight: bold; |
|
||||
"><i class="fa fa-download mr-2"></i>Download</a> |
|
||||
</div> |
|
||||
</div> |
|
||||
<!-- End of Hero Section --> |
|
||||
<!-- Second Section --> |
|
||||
<div class="row p-4"> |
|
||||
<div class="col-lg-6 px-4" style="margin-top: 100px;"> |
|
||||
<h2>Desktop View</h2> |
|
||||
<p class="lead"> |
|
||||
It is easy to customize and use. Just drag and drop the building blocks to make attractive webpages. |
|
||||
</p> |
|
||||
</div> |
|
||||
<div class="col-lg-6 px-4"> |
|
||||
<img style="border-radius: 0.5em;" src="images/laptop-screenshots.jpg" width="90%" height="auto" |
|
||||
class="mb-4 shadow-sm" alt="Theme Screenshot"> |
|
||||
</div> |
|
||||
</div> |
|
||||
<!-- End of Second Section --> |
|
||||
<!-- Third Section --> |
|
||||
<div class="row p-4"> |
|
||||
<div class="col-lg-6 px-4"> |
|
||||
<img style="border-radius: 0.5em;" src="images/phone-screenshots.jpg" width="90%" height="auto" |
|
||||
class="mb-4 shadow-sm" alt="Theme Screenshot"> |
|
||||
</div> |
</div> |
||||
<div class="col-lg-6 px-4" style="margin-top: 100px;"> |
<div class="row"> |
||||
<h2>Mobile View</h2> |
<div class="col-lg-12 text-center"> |
||||
<p class="lead"> |
<img src="images/hero.png" width=60% height="auto" class="mb-4" alt="Theme Screenshot"> |
||||
User friendly and modern looking makes your page more Stylist And Beautiful. |
</div> |
||||
</p> |
<div class="col-lg-12 text-center"> |
||||
|
<h1 class="mt-4">Theme Xtream</h1> |
||||
|
<p class="lead mb-4" style="max-width: 700px; margin: 0 auto;"> |
||||
|
Theme Xtream is a attractive and unique front-end theme mainly suitable for eCommerce website. Many |
||||
|
custom |
||||
|
designed snippets facilitates to add better user experience. Contains best deals with new arrival |
||||
|
products |
||||
|
slider, testimonial slider that are configured from the backend. This theme fully customized the |
||||
|
eCommerce |
||||
|
website, shop view, custom categories view, product view, contact us page...etc. it contains price |
||||
|
filter and |
||||
|
clear cart options by default. |
||||
|
</p> |
||||
|
</div> |
||||
</div> |
</div> |
||||
</div> |
|
||||
<!-- End of Third Section --> |
|
||||
|
|
||||
<!-- Feature Tiles --> |
<!-- End of Hero Section --> |
||||
<div class="row mt-4"> |
|
||||
<div class="col-lg-12 text-center"> |
<!-- Alternate Section --> |
||||
<h2>Features</h2> |
<div class="row p-4"> |
||||
<hr style=" border: 2px solid #b22126; margin-top: 2px;" width="40px"> |
<div class="col-lg-6 px-4" style="margin-top: 100px;"> |
||||
|
<h2>Desktop View</h2> |
||||
|
<p class="lead"> |
||||
|
It is easy to customize and use. Just drag and drop the building blocks to make attractive webpages. |
||||
|
</p> |
||||
|
</div> |
||||
|
<div class="col-lg-6 px-4"> |
||||
|
<img style="border-radius: 0.5em;" src="images/laptop-screenshots.jpg" width="90%" height="auto" |
||||
|
class="mb-4 shadow-sm" alt="Theme Screenshot"> |
||||
|
</div> |
||||
</div> |
</div> |
||||
</div> |
<div class="row p-4"> |
||||
<div class="row p-4" style="margin: 0 6%;"> |
<div class="col-lg-6 px-4"> |
||||
<div class="col-lg-3 bg-white shadow-sm p-4 mb-4 mr-4" |
<img style="border-radius: 0.5em;" src="images/phone-screenshots.jpg" width="90%" height="auto" |
||||
style="border-radius: 0.5em; min-width: 200px; max-width: 200px;"> |
class="mb-4 shadow-sm" alt="Theme Screenshot"> |
||||
<i class="fa fa-tablet mb-2" style="font-size: 2em; margin: 0 40%;"></i> |
</div> |
||||
<h5 class="text-center" style="margin: 0 5%;">Responsive</h5> |
<div class="col-lg-6 px-4" style="margin-top: 100px;"> |
||||
|
<h2>Mobile View</h2> |
||||
|
<p class="lead"> |
||||
|
User friendly and modern looking theme makes your page more Stylish And Beautiful. |
||||
|
</p> |
||||
|
</div> |
||||
</div> |
</div> |
||||
|
<!-- End of Alternate Section --> |
||||
|
|
||||
<div class="col-lg-3 bg-white shadow-sm p-4 mb-4 mr-4" |
|
||||
style="border-radius: 0.5em; min-width: 200px; max-width: 200px;"> |
|
||||
<i class="fa fa-magic mb-2" style="font-size: 2em; margin: 0 40%;"></i> |
|
||||
<h5 class="text-center" style="margin: 0 5%;">Modern</h5> |
|
||||
</div> |
|
||||
|
|
||||
<div class="col-lg-3 bg-white shadow-sm p-4 mb-4 mr-4" |
<!-- Two Columns Section --> |
||||
style="border-radius: 0.5em; min-width: 200px; max-width: 200px;"> |
<div class="row p-4"> |
||||
<i class="fa fa-shopping-cart mb-2" style="font-size: 2em; margin: 0 40%;"></i> |
<!-- Column 1 --> |
||||
<h5 class="text-center" style="margin: 0 5%;">E-com Ready</h5> |
<div class="col-lg-6"> |
||||
|
<div class="row"> |
||||
|
<div class="col-lg-12"> |
||||
|
<img style="border-radius: 0.5em;" src="images/1.jpg" width="100%" height="auto" |
||||
|
class="mb-4 shadow-sm" alt="Theme Screenshot"> |
||||
|
</div> |
||||
|
<div class="col-lg-12 mt-4"> |
||||
|
<h2 class="text-center">Shop View</h2> |
||||
|
<p class="lead text-center"> |
||||
|
It is easy to customize and use. Just drag and drop the building blocks to make attractive |
||||
|
webpages. |
||||
|
</p> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
<!-- End of Column 1 --> |
||||
|
|
||||
|
<!-- Column 2 --> |
||||
|
<div class="col-lg-6"> |
||||
|
<div class="row"> |
||||
|
<div class="col-lg-12"> |
||||
|
<img style="border-radius: 0.5em;" src="images/2.jpg" width="100%" height="auto" |
||||
|
class="mb-4 shadow-sm" alt="Theme Screenshot"> |
||||
|
</div> |
||||
|
<div class="col-lg-12 mt-4"> |
||||
|
<h2 class="text-center">Cart View</h2> |
||||
|
<p class="lead text-center"> |
||||
|
It is easy to customize and use. Just drag and drop the building blocks to make attractive |
||||
|
webpages. |
||||
|
</p> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
<!-- End of Column 2 --> |
||||
</div> |
</div> |
||||
|
<!-- End of Two Columns Section --> |
||||
|
|
||||
|
|
||||
<div class="col-lg-3 bg-white mb-4 mr-4 shadow-sm p-4" |
<!-- One Column Section --> |
||||
style="border-radius: 0.5em; min-width: 200px; max-width: 200px;"> |
<div class="row p-4"> |
||||
<i class="fa fa-arrow-circle-o-right mb-2" style="font-size: 2em; margin: 0 40%;"></i> |
<div class="col-lg-6"> |
||||
<h5 class="text-center" style="margin: 0 4%;">Built-in Slider</h5> |
<img style="border-radius: 0.5em;" src="images/3.jpg" width="90%" height="auto" class="mb-4 shadow-sm" |
||||
|
alt="Theme Screenshot"> |
||||
|
</div> |
||||
|
<div class="col-lg-6" style="padding-top: 100px;"> |
||||
|
<h2>Overview</h2> |
||||
|
<p class="lead"> |
||||
|
It is easy to customize and use. Just drag and drop the building blocks to make attractive webpages. |
||||
|
</p> |
||||
|
</div> |
||||
</div> |
</div> |
||||
</div> |
<!-- End of Two Columns Section --> |
||||
<!-- End of Feature Tiles --> |
|
||||
|
<!-- Two Columns Section --> |
||||
|
<div class="row p-4"> |
||||
|
<!-- Column 1 --> |
||||
|
<div class="col-lg-4"> |
||||
|
<div class="row"> |
||||
|
<div class="col-lg-12"> |
||||
|
<img style="border-radius: 0.5em;" src="images/4.jpg" width="100%" height="auto" |
||||
|
class="mb-4 shadow-sm" alt="Theme Screenshot"> |
||||
|
</div> |
||||
|
<div class="col-lg-12 mt-4"> |
||||
|
<h2 class="text-center">New Arrivals</h2> |
||||
|
<p class="lead text-center"> |
||||
|
It is easy to customize and use. Just drag and drop the building blocks to make attractive |
||||
|
webpages. |
||||
|
</p> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
<!-- End of Column 1 --> |
||||
|
|
||||
|
<!-- Column 2 --> |
||||
|
<div class="col-lg-4"> |
||||
|
<div class="row"> |
||||
|
<div class="col-lg-12"> |
||||
|
<img style="border-radius: 0.5em;" src="images/5.jpg" width="100%" height="auto" |
||||
|
class="mb-4 shadow-sm" alt="Theme Screenshot"> |
||||
|
</div> |
||||
|
<div class="col-lg-12 mt-4"> |
||||
|
<h2 class="text-center">Contact Map</h2> |
||||
|
<p class="lead text-center"> |
||||
|
It is easy to customize and use. Just drag and drop the building blocks to make attractive |
||||
|
webpages. |
||||
|
</p> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
<!-- End of Column 2 --> |
||||
|
|
||||
|
|
||||
<!-- Footer --> |
<!-- Column 4 --> |
||||
<div class="row mt-4"> |
<div class="col-lg-4"> |
||||
<div class="col-lg-12 text-center"> |
<div class="row"> |
||||
<h2>Get Help</h2> |
<div class="col-lg-12"> |
||||
<hr style=" border: 2px solid #b22126; margin-top: 2px;" width="40px"> |
<img style="border-radius: 0.5em;" src="images/6.jpg" width="100%" height="auto" |
||||
<p class="text-center" style="max-width: 650px; margin: 0 auto;">If you have anything to share with us based on |
class="mb-4 shadow-sm" alt="Theme Screenshot"> |
||||
your use of this module, please let us know. We are ready to offer our support.</p> |
</div> |
||||
|
<div class="col-lg-12 mt-4"> |
||||
|
<h2 class="text-center">Checkout Address</h2> |
||||
|
<p class="lead text-center"> |
||||
|
It is easy to customize and use. Just drag and drop the building blocks to make attractive |
||||
|
webpages. |
||||
|
</p> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
<!-- End of Column 4 --> |
||||
</div> |
</div> |
||||
</div> |
<!-- End of Two Columns Section --> |
||||
<div class="row"> |
|
||||
<div class="col px-4 pt-3 pb-2 shadow-sm" |
|
||||
style="background-color: #fff; max-width: 450px; border-radius: 0.5em; margin: 1em auto;"> |
<!-- Footer --> |
||||
<div class="row"> |
<div class="row" style="margin-top: 4rem;"> |
||||
<div class="col-lg-8"> |
<div class="col-lg-12 text-center"> |
||||
<h6><a href="mailto:info@cybrosys.com" target="_blank" style="color: #050505; text-decoration: none;"><i |
<h2>Get Help</h2> |
||||
class="fa fa-envelope mr-2"></i>info@cybrosys.com</a></h6> |
<hr style=" border: 2px solid #b22126; margin-top: 2px;" width="40px"> |
||||
</div> |
<p class="text-center" style="max-width: 650px; margin: 0 auto;">If you have anything to share with us based |
||||
<div class="col-lg-4" style="position: relative;"> |
on |
||||
<h6><a href="mailto:info@cybrosys.com" target="_blank" |
your use of this module, please let us know. We are ready to offer our support.</p> |
||||
style="color: #050505; text-decoration: none; position: absolute; right: 10px;"><i |
</div> |
||||
class="fa fa-chevron-right"></i></a></h6> |
|
||||
</div> |
|
||||
</div> |
|
||||
</div> |
</div> |
||||
</div> |
<div class="row"> |
||||
<div class="row"> |
<div class="col px-4 pt-3 pb-2 shadow-sm" |
||||
<div class="col px-4 pt-3 pb-2 shadow-sm" |
style="background-color: #fff; max-width: 450px; border-radius: 0.5em; margin: 1em auto;"> |
||||
style="background-color: #fff; max-width: 450px; border-radius: 0.5em; margin: 1em auto;"> |
<div class="row"> |
||||
<div class="row"> |
<div class="col-lg-8"> |
||||
<div class="col-lg-8"> |
<h6><a href="mailto:info@cybrosys.com" target="_blank" |
||||
<h6><a href="https://www.cybrosys.com" target="_blank" style="color: #050505; text-decoration: none;"><i |
style="color: #050505; text-decoration: none;"><i |
||||
class="fa fa-globe mr-2"></i>www.cybrosys.com</a></h6> |
class="fa fa-envelope mr-2"></i>info@cybrosys.com</a></h6> |
||||
</div> |
</div> |
||||
<div class="col-lg-4" style="position: relative;"> |
<div class="col-lg-4 d-flex justify-content-end" style="position: relative;"> |
||||
<h6><a href="https://www.cybrosys.com" target="_blank" |
<h6><a href="mailto:info@cybrosys.com" target="_blank" |
||||
style="color: #050505; text-decoration: none; position: absolute; right: 10px;"><i |
style="color: #050505; text-decoration: none;"><i class="fa fa-chevron-right"></i></a></h6> |
||||
class="fa fa-chevron-right"></i></a></h6> |
</div> |
||||
</div> |
</div> |
||||
</div> |
</div> |
||||
</div> |
</div> |
||||
</div> |
<div class="row"> |
||||
<div class="row"> |
<div class="col px-4 pt-3 pb-2 shadow-sm" |
||||
<div class="col-lg-12 mt-4 mb-2 text-center"> |
style="background-color: #fff; max-width: 450px; border-radius: 0.5em; margin: 1em auto;"> |
||||
<p style="font-weight: bold">A Quality Theme From</p> |
<div class="row"> |
||||
|
<div class="col-lg-8"> |
||||
|
<h6><a href="https://www.cybrosys.com" target="_blank" |
||||
|
style="color: #050505; text-decoration: none;"><i |
||||
|
class="fa fa-globe mr-2"></i>www.cybrosys.com</a></h6> |
||||
|
</div> |
||||
|
<div class="col-lg-4 d-flex justify-content-end" style="position: relative;"> |
||||
|
<h6><a href="https://www.cybrosys.com" target="_blank" |
||||
|
style="color: #050505; text-decoration: none;"><i class="fa fa-chevron-right"></i></a></h6> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
</div> |
</div> |
||||
<div class="col-lg-12 text-center"> |
<div class="row"> |
||||
<img src="images/cybro-logo-oca.png" width="80px" height="auto"> |
<div class="col-lg-12 mt-4 mb-2 text-center"> |
||||
|
<p style="font-weight: bold">A Quality Theme From</p> |
||||
|
</div> |
||||
|
<div class="col-lg-12 text-center"> |
||||
|
<img src="images/cybro-logo-oca.png" width="80px" height="auto"> |
||||
|
</div> |
||||
</div> |
</div> |
||||
</div> |
<!-- End of Footer --> |
||||
<!-- End of Footer --> |
|
||||
</div> |
</div> |
||||