2 changed files with 261 additions and 244 deletions
@ -1,135 +1,152 @@ |
|||
<!-- Hero Section --> |
|||
<div class="container pt-4 mt-4 rounded" style="background-color: #f0f2f4; font-family: Montserrat, 'sans-serif';"> |
|||
<div class="row"> |
|||
<div class="col-lg-12 mb-4"> |
|||
<img src="images/Cybrosys.png" alt="Cybrosys Logo" style="width: 120px; height: auto;"> |
|||
<hr style="border-color: #e1e5e9;" /> |
|||
</div> |
|||
<div class="row"> |
|||
<div class="col-lg-12 mb-4"> |
|||
<img src="images/Cybrosys.png" alt="Cybrosys Logo" style="width: 120px; height: auto;"> |
|||
<hr style="border-color: #e1e5e9;" /> |
|||
</div> |
|||
<div class="row"> |
|||
<div class="col-lg-12 text-center" style="display: flex; flex-direction: column; justify-content: center; align-items: center;"> |
|||
<img src="images/hero.png" width="700px" height="auto" class="mb-4" alt="Theme Screenshot"> |
|||
<h1 class="mt-4">Blast</h1> |
|||
<p class="lead" style="max-width: 700px;"> |
|||
Blast is a popular 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 countdown, best products slider, testimonial slider that are configured from the backend. |
|||
</p> |
|||
</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="row"> |
|||
<div class="col-lg-12 text-center p-4" style="display: flex; justify-content: center; align-items: center;"> |
|||
<a |
|||
href="#" |
|||
class="btn btn-primary m-2 px-4 py-3 shadow-sm" |
|||
style=" |
|||
<div class="col-lg-12 text-center"> |
|||
<h1 class="mt-4">Blast</h1> |
|||
<p class="lead" style="max-width: 700px; margin: 0 auto;"> |
|||
Blast is a popular 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 countdown, best products |
|||
slider, testimonial slider that are configured from the backend. |
|||
</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=" |
|||
"><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> |
|||
"><i class="fa fa-download mr-2"></i>Download</a> |
|||
</div> |
|||
<!-- End of Hero Section --> |
|||
<!-- Second Section --> |
|||
<div class="row p-4"> |
|||
<div class="col-lg-6 px-4" style="display: flex; flex-direction: column; justify-content: center;"> |
|||
<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" |
|||
style="display: flex; justify-content: center; align-items: center" |
|||
> |
|||
<img style="border-radius: 0.5em;" src="images/laptop-screenshots.jpg" width="450px" height="auto" class="mb-4 shadow-sm" alt="Theme Screenshot"> |
|||
</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> |
|||
<!-- End of Second Section --> |
|||
<!-- Third Section --> |
|||
<div class="row p-4"> |
|||
<div |
|||
class="col-lg-6 px-4" |
|||
style="display: flex; justify-content: center; align-items: center" |
|||
> |
|||
<img style="border-radius: 0.5em;" src="images/phone-screenshots.jpg" width="450px" height="auto" class="mb-4 shadow-sm" alt="Theme Screenshot"> |
|||
</div> |
|||
<div class="col-lg-6 px-4" style="display: flex; flex-direction: column; justify-content: center;"> |
|||
<h2>Mobile View</h2> |
|||
<p class="lead"> |
|||
User friendly and modern looking makes your page more Stylist And Beautiful. |
|||
</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 class="col-lg-6 px-4" style="margin-top: 100px;"> |
|||
<h2>Mobile View</h2> |
|||
<p class="lead"> |
|||
User friendly and modern looking makes your page more Stylist And Beautiful. |
|||
</p> |
|||
</div> |
|||
<!-- End of Third Section --> |
|||
</div> |
|||
<!-- End of Third Section --> |
|||
|
|||
<!-- Feature Tiles --> |
|||
<div class="row mt-4"> |
|||
<div class="col-lg-12 text-center"> |
|||
<h2>Features</h2> |
|||
<hr style=" border: 2px solid #b22126; margin-top: 2px;" width="40px"> |
|||
</div> |
|||
<!-- Feature Tiles --> |
|||
<div class="row mt-4"> |
|||
<div class="col-lg-12 text-center"> |
|||
<h2>Features</h2> |
|||
<hr style=" border: 2px solid #b22126; margin-top: 2px;" width="40px"> |
|||
</div> |
|||
</div> |
|||
<div class="row p-4" style="margin: 0 6%;"> |
|||
<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-tablet mb-2" style="font-size: 2em; margin: 0 40%;"></i> |
|||
<h5 class="text-center" style="margin: 0 5%;">Responsive</h5> |
|||
</div> |
|||
<div class="row p-4" style="display: flex; justify-content: center; align-items: center;"> |
|||
<div class="col-lg-3 bg-white shadow-sm p-4 mb-4 mr-4" style="display: flex; flex-direction: column; justify-content: center; align-items: center; border-radius: 0.5em; min-width: 200px; max-width: 200px;"> |
|||
<i class="fa fa-tablet mb-2" style="font-size: 2em;"></i> |
|||
<h5>Responsive</h5> |
|||
</div> |
|||
|
|||
<div class="col-lg-3 bg-white shadow-sm p-4 mb-4 mr-4" style="display: flex; flex-direction: column; justify-content: center; align-items: center; border-radius: 0.5em; min-width: 200px; max-width: 200px;"> |
|||
<i class="fa fa-magic mb-2" style="font-size: 2em;"></i> |
|||
<h5>Modern</h5> |
|||
</div> |
|||
<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" style="display: flex; flex-direction: column; justify-content: center; align-items: center; border-radius: 0.5em; min-width: 200px; max-width: 200px;"> |
|||
<i class="fa fa-shopping-cart mb-2" style="font-size: 2em;"></i> |
|||
<h5>E-com Ready</h5> |
|||
</div> |
|||
<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-shopping-cart mb-2" style="font-size: 2em; margin: 0 40%;"></i> |
|||
<h5 class="text-center" style="margin: 0 5%;">E-com Ready</h5> |
|||
</div> |
|||
|
|||
<div class="col-lg-3 bg-white mb-4 mr-4 shadow-sm p-4" style="display: flex; flex-direction: column; justify-content: center; align-items: center; border-radius: 0.5em; min-width: 200px; max-width: 200px;"> |
|||
<i class="fa fa-arrow-circle-o-right mb-2" style="font-size: 2em;"></i> |
|||
<h5>Built-in Slider</h5> |
|||
</div> |
|||
<div class="col-lg-3 bg-white mb-4 mr-4 shadow-sm p-4" |
|||
style="border-radius: 0.5em; min-width: 200px; max-width: 200px;"> |
|||
<i class="fa fa-arrow-circle-o-right mb-2" style="font-size: 2em; margin: 0 40%;"></i> |
|||
<h5 class="text-center" style="margin: 0 4%;">Built-in Slider</h5> |
|||
</div> |
|||
<!-- End of Feature Tiles --> |
|||
</div> |
|||
<!-- End of Feature Tiles --> |
|||
|
|||
<!-- Footer --> |
|||
<div class="row mt-4"> |
|||
<div class="col-lg-12" style="display: flex; flex-direction: column; justify-content: center; align-items: center;"> |
|||
<h2>Get Help</h2> |
|||
<hr style=" border: 2px solid #b22126; margin-top: 2px;" width="40px"> |
|||
<p class="text-center" style="max-width: 650px">If you have anything to share with us based on your use of this module, please let us know. We are ready to offer our support.</p> |
|||
</div> |
|||
<!-- Footer --> |
|||
<div class="row mt-4"> |
|||
<div class="col-lg-12 text-center"> |
|||
<h2>Get Help</h2> |
|||
<hr style=" border: 2px solid #b22126; margin-top: 2px;" width="40px"> |
|||
<p class="text-center" style="max-width: 650px; margin: 0 auto;">If you have anything to share with us based on |
|||
your use of this module, please let us know. We are ready to offer our support.</p> |
|||
</div> |
|||
<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; display: flex; justify-content: space-between; align-items: center;"> |
|||
<h6><a href="mailto:info@cybrosys.com" target="_blank" style="color: #050505; text-decoration: none;"><i class="fa fa-envelope mr-2"></i>info@cybrosys.com</a></h6> |
|||
<h6><a href="mailto:info@cybrosys.com" target="_blank" style="color: #050505; text-decoration: none;"><i class="fa fa-chevron-right"></i></a></h6> |
|||
</div> |
|||
<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;"> |
|||
<div class="row"> |
|||
<div class="col-lg-8"> |
|||
<h6><a href="mailto:info@cybrosys.com" target="_blank" style="color: #050505; text-decoration: none;"><i |
|||
class="fa fa-envelope mr-2"></i>info@cybrosys.com</a></h6> |
|||
</div> |
|||
</div> |
|||
<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; display: flex; justify-content: space-between; align-items: center;"> |
|||
<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> |
|||
<h6><a href="https://www.cybrosys.com" target="_blank" style="color: #050505; text-decoration: none;"></a><i class="fa fa-chevron-right"></i></a></h6> |
|||
<div class="col-lg-4" style="position: relative;"> |
|||
<h6><a href="mailto:info@cybrosys.com" target="_blank" |
|||
style="color: #050505; text-decoration: none; position: absolute; right: 10px;"><i |
|||
class="fa fa-chevron-right"></i></a></h6> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
<div class="row"> |
|||
<div class="col-lg-12 my-4" style="display: flex; flex-direction: column; justify-content: center; align-items: center;"> |
|||
<p style="font-weight: bold">A Quality Theme From</p> |
|||
<img src="images/cybro-logo-oca.png" width="80px" height="auto"> |
|||
</div> |
|||
<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;"> |
|||
<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" style="position: relative;"> |
|||
<h6><a href="https://www.cybrosys.com" target="_blank" |
|||
style="color: #050505; text-decoration: none; position: absolute; right: 10px;"><i |
|||
class="fa fa-chevron-right"></i></a></h6> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
<div class="row"> |
|||
<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> |
|||
<!-- End of Footer --> |
|||
</div> |
|||
<!-- End of Footer --> |
|||
</div> |
Loading…
Reference in new issue