- Welcome
- Main File Structure
- HTML Structure
- CSS Structure
- Customization
- Sources & Credits
- Support

Copyright © 2023 All Rights Reserved.

# Newsim- News Portal HTML Template

Created: 05 November 2023
Latest Update: 05 November 2023
Thank you for purchasing our product, Newsim- News Portal HTML Template. If you have any question, please feel free to contact us.

# Main File Structure

All the file are well organized, its so easy to work with the template.
1. Unzip the files.
2. Open "Newsim" folder.
You will see 4 directories, css, fonts, images and js.
In the CSS folder that you will find style.css and other styling files the all the other files expect the htmls.
Js folder contain only the jquery library. Fonts folder contain essetial font files for fonts.

                        Newsim/
                        |    |
                        |    assets
                        |    ├── css/
                        |    |    └── bootstrap.min.css
                        |    |    └── font-awesome.min.css
                        |    |    └── magnific-popup.css
                        |    |    └── nice-select.css
                        |    |    └── animate.css
                        |    |    └── flaticon.css
                        |    |    └── responsive.css
                        |    |    └── slick.css
                        |    |    └── style.css
                        |    |
                        |    |
                        |    |
                        |    |
                        |    |
                        |    ├── js/
                        |         └── jquery-3.6.0.min.js
                        |         └── jquery.magnific-popup.js
                        |         └── bootstrap.min.js
                        |         └── jquery.marquee.min.js
                        │         └── jquery.nice-select.js
                        │         └── slick.min.js
                        │         └── theia-sticky-sidebar.min.js
                        │         └── wow.min.js
                        │         └── main.js
                        │
                        ├── about.html
                        ├── author.html
                        ├── bussiness.html
                        ├── bussiness-02.html
                        ├── cart.html
                        ├── contact.html
                        ├── financial.html
                        ├── index.html
                        ├── index-02.html
                        ├── index-03.html
                        ├── login.html
                        ├── product-details.html
                        ├── products.html
                        ├── signup.html
                        ├── sport.html

# Customization

### How to Change Site Title And Favicon Icon

### How to Change Logo

### How to Change Phone Number, E-Mail Address and Address

### How to Change Copyright Text

# HTML Structure

The base structure was organized by row, col-** class

    		<!-- Latest News Section Start Here -->
            <section class="latest-news-section">
                <div class="container custom-container">
                    <div class="row">
                        <div class="col-lg-4 col-md-6">
                            <div class="top-sticky-wrapper">
                                <div class="image-box-item-three">
                                    <div class="thumbnail style-01">
                                        <img src="assets/img/section-img/recent/recent-18.png" alt="">
                                    </div>
                                    <div class="content ml-xl-4 ml-sm-6">
                                        <span class="tag-02">business</span>
                                        <a href="business-02.html"><h4 class="title">Sub penthouse at for One Bloor goes</h4></a>
                                        <ul class="post-meta">
                                            <li>
                                                <a href="#">By <span>Admin</span></a>
                                            </li>
                                            <li>
                                                <span class="posted-on">
                                                    <a href="#" rel="bookmark">
                                                        <span class="entry-date published updated"><i class="fas fa-calendar-alt"></i>JAN 14, 2022</span>
                                                    </a>
                                                </span>
                                            </li>
                                        </ul>
                                    </div>
                                </div>
                                <div class="image-box-item-three">
                                    <div class="thumbnail style-01">
                                        <img src="assets/img/section-img/recent/recent-19.png" alt="">
                                    </div>
                                    <div class="content ml-xl-4 ml-sm-6">
                                        <span class="tag-02">business</span>
                                        <a href="business-02.html"><h4 class="title">Cava producers are looking good</h4></a>
                                        <ul class="post-meta">
                                            <li>
                                                <a href="#">By <span>Admin</span></a>
                                            </li>
                                            <li>
                                                <span class="posted-on">
                                                    <a href="#" rel="bookmark">
                                                        <span class="entry-date published updated"><i class="fas fa-calendar-alt"></i>JAN 14, 2022</span>
                                                    </a>
                                                </span>
                                            </li>
                                        </ul>
                                    </div>
                                </div>
                                <div class="image-box-item-three">
                                    <div class="thumbnail style-01">
                                        <img src="assets/img/section-img/recent/recent-20.png" alt="">
                                    </div>
                                    <div class="content ml-xl-4 ml-sm-6">
                                        <span class="tag-02">business</span>
                                        <a href="business-02.html"><h4 class="title">Mortgage Rundown The countdown</h4></a>
                                        <ul class="post-meta">
                                            <li>
                                                <a href="#">By <span>Admin</span></a>
                                            </li>
                                            <li>
                                                <span class="posted-on">
                                                    <a href="#" rel="bookmark">
                                                        <span class="entry-date published updated"><i class="fas fa-calendar-alt"></i>JAN 14, 2022</span>
                                                    </a>
                                                </span>
                                            </li>
                                        </ul>
                                    </div>
                                </div>
                                <div class="widget widget_social margin-top-40">
                                    <h3 class="widget-headline">STAY CONNECTED<span></span></h3>
                                    <ul class="contact_info_list">
                                        <li class="single-info-item">
                                            <div class="icon">
                                                <i class="fab fa-facebook-square"></i>
                                            </div>
                                            <div class="details">
                                                <p><span>1250M +</span>Followers</p>
                                            </div>
                                        </li>
                                        <li class="single-info-item style-01">
                                            <div class="icon">
                                                <i class="fab fa-twitter-square"></i>
                                            </div>
                                            <div class="details">
                                                <p><span>1250M +</span>Followers</p>
                                            </div>
                                        </li>
                                        <li class="single-info-item style-02">
                                            <div class="icon">
                                                <i class="fab fa-youtube-square"></i>
                                            </div>
                                            <div class="details">
                                                <p><span>1250M +</span>Followers</p>
                                            </div>
                                        </li>
                                        <li class="single-info-item style-03">
                                            <div class="icon">
                                                <i class="fab fa-linkedin"></i>
                                            </div>
                                            <div class="details">
                                                <p><span>1250M +</span>Followers</p>
                                            </div>
                                        </li>
                                    </ul>
                                </div>
                                <div class="image-box-item-seven bg-image" style="background-image: url(assets/img/section-img/news/agreement.png);">
                                    <div class="content">
                                        <h4 class="title">NEWSIM Newspaper</h4>
                                        <h6 class="subtitle">WordPress Theme</h6>
                                        <div class="btn-wrap desktop-center">
                                            <a href="#" class="boxed-btn buy-btn">Read More</a>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="col-lg-8 col-md-6">
                            <div class="row">
                                <div class="col-lg-6 col-md-12">
                                    <div class="blog-grid-item-01 margin-bottom-30">
                                        <div class="thumb">
                                            <img src="assets/img/section-img/news/news-16.png" alt="">
                                        </div>
                                        <span class="tag absolute">Products</span>
                                        <div class="content">
                                            <a href="business-02.html"><h4 class="title">Animal Nation Are Strugling To Save Their Wildlife</h4></a>
                                            <ul class="post-meta">
                                                <li>
                                                    <a href="#">By <span>Admin</span></a>
                                                </li>
                                                <li>
                                                    <span class="posted-on">
                                                        <a href="#" rel="bookmark">
                                                            <span class="entry-date published updated"><i class="fas fa-calendar-alt"></i>JAN 14, 2022</span>
                                                        </a>
                                                    </span>
                                                </li>
                                            </ul>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-lg-6 col-md-12">
                                    <div class="blog-grid-item-01 margin-bottom-30">
                                        <div class="thumb">
                                            <img src="assets/img/section-img/news/news-17.png" alt="">
                                        </div>
                                        <span class="tag style-02 absolute">Business</span>
                                        <div class="content">
                                            <a href="business-02.html"><h4 class="title">Animal Nation Are Strugling To Save Their Wildlife</h4></a>
                                            <ul class="post-meta">
                                                <li>
                                                    <a href="#">By <span>Admin</span></a>
                                                </li>
                                                <li>
                                                    <span class="posted-on">
                                                        <a href="#" rel="bookmark">
                                                            <span class="entry-date published updated"><i class="fas fa-calendar-alt"></i>JAN 14, 2022</span>
                                                        </a>
                                                    </span>
                                                </li>
                                            </ul>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-lg-6 col-md-12">
                                    <div class="blog-grid-item-01 margin-bottom-30">
                                        <div class="thumb">
                                            <img src="assets/img/section-img/news/news-18.png" alt="">
                                        </div>
                                        <span class="tag style-03 absolute">Tech</span>
                                        <div class="content">
                                            <a href="business-02.html"><h4 class="title">Animal Nation Are Strugling To Save Their Wildlife</h4></a>
                                            <ul class="post-meta">
                                                <li>
                                                    <a href="#">By <span>Admin</span></a>
                                                </li>
                                                <li>
                                                    <span class="posted-on">
                                                        <a href="#" rel="bookmark">
                                                            <span class="entry-date published updated"><i class="fas fa-calendar-alt"></i>JAN 14, 2022</span>
                                                        </a>
                                                    </span>
                                                </li>
                                            </ul>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-lg-6 col-md-12">
                                    <div class="blog-grid-item-01 margin-bottom-30">
                                        <div class="thumb">
                                            <img src="assets/img/section-img/news/news-19.png" alt="">
                                        </div>
                                        <span class="tag style-04 absolute">Travel</span>
                                        <div class="content">
                                            <a href="business-02.html"><h4 class="title">Animal Nation Are Strugling To Save Their Wildlife</h4></a>
                                            <ul class="post-meta">
                                                <li>
                                                    <a href="#">By <span>Admin</span></a>
                                                </li>
                                                <li>
                                                    <span class="posted-on">
                                                        <a href="#" rel="bookmark">
                                                            <span class="entry-date published updated"><i class="fas fa-calendar-alt"></i>JAN 14, 2022</span>
                                                        </a>
                                                    </span>
                                                </li>
                                            </ul>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-lg-6 col-md-12">
                                    <div class="blog-grid-item-01 margin-bottom-30">
                                        <div class="thumb">
                                            <img src="assets/img/section-img/news/news-20.png" alt="">
                                        </div>
                                        <span class="tag absolute">Products</span>
                                        <div class="content">
                                            <a href="business-02.html"><h4 class="title">Animal Nation Are Strugling To Save Their Wildlife</h4></a>
                                            <ul class="post-meta">
                                                <li>
                                                    <a href="#">By <span>Admin</span></a>
                                                </li>
                                                <li>
                                                    <span class="posted-on">
                                                        <a href="#" rel="bookmark">
                                                            <span class="entry-date published updated"><i class="fas fa-calendar-alt"></i>JAN 14, 2022</span>
                                                        </a>
                                                    </span>
                                                </li>
                                            </ul>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-lg-6 col-md-12">
                                    <div class="blog-grid-item-01 margin-bottom-30">
                                        <div class="thumb">
                                            <img src="assets/img/section-img/news/news-21.png" alt="">
                                        </div>
                                        <span class="tag style-05 absolute">Food</span>
                                        <div class="content">
                                            <a href="business-02.html"><h4 class="title">Animal Nation Are Strugling To Save Their Wildlife</h4></a>
                                            <ul class="post-meta">
                                                <li>
                                                    <a href="#">By <span>Admin</span></a>
                                                </li>
                                                <li>
                                                    <span class="posted-on">
                                                        <a href="#" rel="bookmark">
                                                            <span class="entry-date published updated"><i class="fas fa-calendar-alt"></i>JAN 14, 2022</span>
                                                        </a>
                                                    </span>
                                                </li>
                                            </ul>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-lg-6 col-md-12">
                                    <div class="blog-grid-item-01 margin-bottom-30">
                                        <div class="thumb">
                                            <img src="assets/img/section-img/news/news-22.png" alt="">
                                        </div>
                                        <span class="tag absolute">Products</span>
                                        <div class="content">
                                            <a href="business-02.html"><h4 class="title">Animal Nation Are Strugling To Save Their Wildlife</h4></a>
                                            <ul class="post-meta">
                                                <li>
                                                    <a href="#">By <span>Admin</span></a>
                                                </li>
                                                <li>
                                                    <span class="posted-on">
                                                        <a href="#" rel="bookmark">
                                                            <span class="entry-date published updated"><i class="fas fa-calendar-alt"></i>JAN 14, 2022</span>
                                                        </a>
                                                    </span>
                                                </li>
                                            </ul>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-lg-6 col-md-12">
                                    <div class="blog-grid-item-01 margin-bottom-30">
                                        <div class="thumb">
                                            <img src="assets/img/section-img/news/news-23.png" alt="">
                                        </div>
                                        <span class="tag style-02 absolute">Business</span>
                                        <div class="content">
                                            <a href="business-02.html"><h4 class="title">Animal Nation Are Strugling To Save Their Wildlife</h4></a>
                                            <ul class="post-meta">
                                                <li>
                                                    <a href="#">By <span>Admin</span></a>
                                                </li>
                                                <li>
                                                    <span class="posted-on">
                                                        <a href="#" rel="bookmark">
                                                            <span class="entry-date published updated"><i class="fas fa-calendar-alt"></i>JAN 14, 2022</span>
                                                        </a>
                                                    </span>
                                                </li>
                                            </ul>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="row justify-content-end">
                        <div class="col-lg-8">
                            <div class="blog-pagination desktop-center">
                                <ul>
                                    <li><span>PREV</span></li>
                                    <li><a class="page-numbers" href="#">01</a></li>
                                    <li><a class="page-numbers current" href="#">02</a></li>
                                    <li><a class="page-numbers" href="#">03</a></li>
                                    <li><span class="next">NEXT</span></li>
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>
            </section>
            <!-- Latest News Section End Here -->

# CSS Structure

The base structure was organized by row, col-** class

                        /*-------------------------
                        Icon Box Item
                        -------------------------*/
                        .single-icon-box {
                          background-color: #fff;
                          text-align: center;
                          padding: 35px;
                          position: relative;
                          z-index: 0;
                          overflow: hidden;
                          border-radius: 6px;
                          -webkit-transition: 0.3s all ease;
                          transition: 0.3s all ease;
                          margin-bottom: 30px;
                      }
                      .single-icon-box.active {
                          -webkit-filter: drop-shadow(0 10px 30px rgba(25, 88, 216, 0.12));
                          filter: drop-shadow(0 10px 30px rgba(25, 88, 216, 0.12));
                      }
                      .single-icon-box:hover {
                          -webkit-filter: drop-shadow(0 10px 30px rgba(25, 88, 216, 0.12));
                          filter: drop-shadow(0 10px 30px rgba(25, 88, 216, 0.12));
                      }
                      .single-icon-box .icon {
                          width: 75px;
                          height: 75px;
                          line-height: 75px;
                          text-align: center;
                          background: var(--secondary-color);
                          border-radius: 6px;
                          font-size: 35px;
                          color: #fff;
                          margin: auto;
                          margin-bottom: 22px;
                      }
                      .single-icon-box .content span {
                          font-size: 16px;
                          line-height: 1.6;
                          font-family: var(--body-font);
                          font-weight: 500;
                          color: #161616;
                          display: block;
                      }

                      .image-box-wrapper {
                          border-bottom: 1px solid #e3e3e3;
                          padding-bottom: 40px;
                          margin-bottom: 40px;
                      }

                      .image-box-item {
                          display: -webkit-box;
                          display: -ms-flexbox;
                          display: flex;
                          background: #fff;
                          padding: 20px 20px 20px 20px;
                          border-radius: 6px;
                      }
                      .image-box-item.style-01 {
                          -webkit-box-align: center;
                          -ms-flex-align: center;
                          align-items: center;
                      }
                      .image-box-item.style-01 .thumbnail img {
                          border-radius: 6px;
                          width: 260px;
                      }
                      .image-box-item .thumbnail img {
                          border-radius: 6px;
                          width: 170px;
                      }
                      .image-box-item .content {
                          -webkit-box-flex: 1;
                          -ms-flex: 1;
                          flex: 1;
                          margin-left: 30px;
                      }
                      .image-box-item .content .title {
                          font-size: 18px;
                          line-height: 1.6;
                          font-family: var(--heading-font);
                          font-weight: 700;
                          -webkit-transition: 0.3s all ease;
                          transition: 0.3s all ease;
                          color: var(--heading-color);
                          margin-bottom: 10px;
                          margin-top: 10px;
                          transition: 0.3s all ease;
                      }
                      .image-box-item .content .title:hover {
                          color: var(--secondary-color);
                      }
                      .image-box-item .content p {
                          font-size: 16px;
                          line-height: 1.7;
                          font-family: var(--body-font);
                          font-weight: 400;
                          color: var(--heading-color);
                          margin-bottom: 10px;
                      }
                      .image-box-item .content .price {
                          color: #fff;
                          font-size: 28px;
                          font-weight: 700;
                          font-family: var(--heading-font);
                      }

                      .image-box-item-two {
                          position: relative;
                          z-index: 0;
                          margin-bottom: 30px;
                      }
                      .image-box-item-two.style-01 {
                          margin-left: 15px;
                          margin-right: 15px;
                      }
                      .image-box-item-two.bg-image {
                          background-position: center center;
                          background-repeat: no-repeat;
                          background-size: cover;
                          position: relative;
                          z-index: 0;
                          min-height: 480px;
                          border-radius: 6px;
                      }
                      .image-box-item-two.bg-image:after {
                          content: "";
                          position: absolute;
                          left: 0;
                          top: 0;
                          width: 100%;
                          height: 100%;
                          background: rgba(0, 0, 0, 0.7);
                          background-size: cover;
                          z-index: -1;
                          border-radius: 6px;
                      }
                      .image-box-item-two .content {
                          position: absolute;
                          left: 40px;
                          bottom: 40px;
                          width: calc(100% - 80px);
                      }
                      .image-box-item-two .content.style-01 {
                          left: 30px;
                          bottom: 30px;
                          width: calc(100% - 60px);
                      }
                      .image-box-item-two .content .title {
                          font-size: 26px;
                          line-height: 1.54;
                          font-family: var(--heading-font);
                          font-weight: 700;
                          color: #fff;
                          margin-top: 10px;
                          margin-bottom: 3px;
                          position: relative;
                      }
                      .image-box-item-two .content .title a {
                          padding-bottom: 6px;
                          background: -webkit-gradient(linear, left top, right top, from(currentColor), to(currentColor));
                          background: linear-gradient(to right, currentColor 0%, currentColor 100%);
                          background-size: 0px 2px;
                          background-repeat: no-repeat;
                          background-position: left 87%;
                          display: inline;
                          -webkit-transition: 0.2s all ease;
                          transition: 0.2s all ease;
                      }
                      .image-box-item-two .content .title a:hover {
                          color: #fff;
                          background-size: 100% 2px;
                          display: inline;
                      }
                      .image-box-item-two .content .title.style-01 {
                          font-size: 21px;
                          line-height: 1.82;
                      }

                      .image-box-item-three {
                          display: -webkit-box;
                          display: -ms-flexbox;
                          display: flex;
                          -webkit-box-align: center;
                          -ms-flex-align: center;
                          align-items: center;
                      }
                      .image-box-item-three.style-01 + .image-box-item-three {
                          border-top: 1px solid #e3e3e3;
                          padding-top: 35px;
                          margin-top: 35px;
                      }
                      .image-box-item-three + .image-box-item-three {
                          border-top: 1px solid #e3e3e3;
                          padding-top: 25px;
                          margin-top: 25px;
                      }
                      .image-box-item-three .thumbnail.style-01 img {
                          border-radius: 6px;
                      }
                      .image-box-item-three .thumbnail img {
                          border-radius: 6px;
                      }
                      .image-box-item-three .content {
                          -webkit-box-flex: 1;
                          -ms-flex: 1;
                          flex: 1;
                          margin-left: 30px;
                      }
                      .image-box-item-three .content.style-01 {
                          padding-left: 20px;
                          margin-left: 0;
                      }
                      .image-box-item-three .content .title {
                          font-size: 18px;
                          line-height: 1.7;
                          font-family: var(--heading-font);
                          font-weight: 700;
                          -webkit-transition: 0.3s all ease;
                          transition: 0.3s all ease;
                          color: var(--heading-color);
                          margin-bottom: 10px;
                          margin-top: 10px;
                          transition: 0.3s all ease;
                      }
                      .image-box-item-three .content .title:hover {
                          color: var(--secondary-color);
                      }
                      .image-box-item-three .content .price {
                          color: #fff;
                          font-size: 28px;
                          font-weight: 700;
                          font-family: var(--heading-font);
                      }

                      .image-box-item-four {
                          display: -webkit-box;
                          display: -ms-flexbox;
                          display: flex;
                          -webkit-box-align: center;
                          -ms-flex-align: center;
                          align-items: center;
                      }
                      .image-box-item-four:last-child {
                          margin-bottom: 30px;
                      }
                      .image-box-item-four.style-01 + .image-box-item-four {
                          border-top: 1px solid #e3e3e3;
                          padding-top: 38px;
                          margin-top: 38px;
                      }
                      .image-box-item-four + .image-box-item-four {
                          border-top: 1px solid #e3e3e3;
                          padding-top: 30px;
                          margin-top: 30px;
                      }
                      .image-box-item-four .thumbnail img {
                          border-radius: 6px;
                      }
                      .image-box-item-four .content {
                          -webkit-box-flex: 1;
                          -ms-flex: 1;
                          flex: 1;
                          margin-left: 30px;
                      }
                      .image-box-item-four .content .title {
                          font-size: 18px;
                          line-height: 1.6;
                          font-family: var(--heading-font);
                          font-weight: 700;
                          -webkit-transition: 0.3s all ease;
                          transition: 0.3s all ease;
                          color: var(--heading-color);
                          margin-bottom: 10px;
                          margin-top: 10px;
                      }
                      .image-box-item-four .content .title:hover {
                          color: var(--secondary-color);
                      }
                      .image-box-item-four .content p {
                          font-size: 16px;
                          line-height: 1.75;
                          font-family: var(--body-font);
                          font-weight: 400;
                          color: var(--heading-color);
                          margin-top: 10px;
                          margin-bottom: 22px;
                      }
                      .image-box-item-four .content .price {
                          color: #fff;
                          font-size: 28px;
                          font-weight: 700;
                          font-family: var(--heading-font);
                      }

                      .image-box-item-five {
                          position: relative;
                          z-index: 0;
                          margin-bottom: 80px;
                      }
                      .image-box-item-five.bg-image {
                          background-position: center center;
                          background-repeat: no-repeat;
                          background-size: cover;
                          position: relative;
                          z-index: 0;
                          min-height: 540px;
                          border-radius: 6px;
                      }
                      .image-box-item-five.bg-image:after {
                          content: "";
                          position: absolute;
                          left: 0;
                          top: 0;
                          width: 100%;
                          height: 100%;
                          background: transparent -webkit-gradient(linear, left top, left bottom, from(#21212100), to(#000000C7)) 0% 0% no-repeat padding-box;
                          background: transparent linear-gradient(180deg, #21212100 0%, #000000C7 100%) 0% 0% no-repeat padding-box;
                          background-size: cover;
                          z-index: -1;
                          border-radius: 6px;
                      }
                      .image-box-item-five.bg-image-02 {
                          background-position: center center;
                          background-repeat: no-repeat;
                          background-size: cover;
                          position: relative;
                          z-index: 0;
                          min-height: 425px;
                          border-radius: 6px;
                          margin-left: 15px;
                          margin-right: 15px;
                      }
                      .image-box-item-five.bg-image-02:after {
                          content: "";
                          position: absolute;
                          left: 0;
                          top: 0;
                          width: 100%;
                          height: 100%;
                          background: transparent -webkit-gradient(linear, left top, left bottom, from(#21212100), to(#000000C7)) 0% 0% no-repeat padding-box;
                          background: transparent linear-gradient(180deg, #21212100 0%, #000000C7 100%) 0% 0% no-repeat padding-box;
                          background-size: cover;
                          z-index: -1;
                          border-radius: 6px;
                      }
                      .image-box-item-five.bg-image-03 {
                          background-position: center center;
                          background-repeat: no-repeat;
                          background-size: cover;
                          position: relative;
                          z-index: 0;
                          min-height: 450px;
                          border-radius: 6px;
                      }
                      .image-box-item-five.bg-image-03:after {
                          content: "";
                          position: absolute;
                          left: 0;
                          top: 0;
                          width: 100%;
                          height: 100%;
                          background: transparent -webkit-gradient(linear, left top, left bottom, from(#21212100), to(#000000C7)) 0% 0% no-repeat padding-box;
                          background: transparent linear-gradient(180deg, #21212100 0%, #000000C7 100%) 0% 0% no-repeat padding-box;
                          background-size: cover;
                          z-index: -1;
                          border-radius: 6px;
                      }
                      .image-box-item-five .content {
                          position: absolute;
                          left: 40px;
                          bottom: 40px;
                          width: calc(100% - 80px);
                      }
                      .image-box-item-five .content.style-01 {
                          left: 30px;
                          bottom: 30px;
                          width: calc(100% - 60px);
                      }
                      .image-box-item-five .content.style-01 .title {
                          font-size: 18px;
                          line-height: 1.67;
                      }
                      .image-box-item-five .content .title {
                          font-size: 26px;
                          line-height: 1.54;
                          font-family: var(--heading-font);
                          font-weight: 700;
                          color: #fff;
                          margin-top: 10px;
                          margin-bottom: 10px;
                          position: relative;
                      }
                      .image-box-item-five .content .title a {
                          padding-bottom: 6px;
                          background: -webkit-gradient(linear, left top, right top, from(currentColor), to(currentColor));
                          background: linear-gradient(to right, currentColor 0%, currentColor 100%);
                          background-size: 0px 2px;
                          background-repeat: no-repeat;
                          background-position: left 87%;
                          display: inline;
                          -webkit-transition: 0.2s all ease;
                          transition: 0.2s all ease;
                      }
                      .image-box-item-five .content .title a:hover {
                          color: #fff;
                          background-size: 100% 2px;
                          display: inline;
                      }

                      .image-box-item-six {
                          position: relative;
                          z-index: 0;
                          margin-bottom: 30px;
                          overflow: hidden;
                          margin-left: 15px;
                          margin-right: 15px;
                      }
                      .image-box-item-six:hover .box-number::before {
                          width: 100%;
                      }
                      .image-box-item-six.bg-image {
                          background-position: center center;
                          background-repeat: no-repeat;
                          background-size: cover;
                          position: relative;
                          z-index: 0;
                          min-height: 130px;
                          border-radius: 6px;
                      }
                      .image-box-item-six.bg-image::after {
                          content: "";
                          position: absolute;
                          left: 0;
                          top: 0;
                          width: 100%;
                          height: 100%;
                          background: rgba(33, 33, 33, 0.6);
                          background-size: cover;
                          z-index: -1;
                          border-radius: 6px;
                      }
                      .image-box-item-six .content {
                          position: absolute;
                          left: 50%;
                          top: 50%;
                          -webkit-transform: translate(-50%, -50%);
                          transform: translate(-50%, -50%);
                      }
                      .image-box-item-six .content .title {
                          font-size: 16px;
                          line-height: 2;
                          font-family: var(--heading-font);
                          font-weight: 700;
                          color: #fff;
                          margin-bottom: 0;
                          text-transform: uppercase;
                          -webkit-transition: 0.3s all ease;
                          transition: 0.3s all ease;
                      }
                      .image-box-item-six .box-number {
                          font-size: 18px;
                          line-height: 1.4;
                          font-family: var(--body-font);
                          font-weight: 700;
                          color: #fff;
                          -webkit-transition: 0.3s all ease;
                          transition: 0.3s all ease;
                          margin-bottom: 0px;
                          position: absolute;
                          right: 15px;
                          top: 6px;
                          z-index: 0;
                      }
                      .image-box-item-six .box-number::before {
                          content: "";
                          position: absolute;
                          z-index: -1;
                          right: -50px;
                          top: -50px;
                          width: 100px;
                          height: 100px;
                          border-radius: 50%;
                          background: #2962FF;
                          -webkit-transition: 0.3s all ease;
                          transition: 0.3s all ease;
                      }

                      .image-box-item-seven {
                          position: relative;
                          z-index: 0;
                          margin-bottom: 30px;
                      }
                      .image-box-item-seven.bg-image {
                          background-position: center center;
                          background-repeat: no-repeat;
                          background-size: cover;
                          position: relative;
                          z-index: 0;
                          min-height: 650px;
                          border-radius: 6px;
                      }
                      .image-box-item-seven.bg-image:after {
                          content: "";
                          position: absolute;
                          left: 0;
                          top: 0;
                          width: 100%;
                          height: 100%;
                          background: rgba(0, 0, 0, 0.7);
                          background-size: cover;
                          z-index: -1;
                          border-radius: 6px;
                      }
                      .image-box-item-seven .content {
                          position: absolute;
                          left: 50px;
                          bottom: 50px;
                          width: calc(100% - 100px);
                      }
                      .image-box-item-seven .content .title {
                          font-size: 35px;
                          line-height: 1.54;
                          font-family: var(--heading-font);
                          font-weight: 700;
                          color: #fff;
                          margin-top: 10px;
                          margin-bottom: 29px;
                          text-align: center;
                      }
                      .image-box-item-seven .content .subtitle {
                          font-size: 20px;
                          line-height: 1.54;
                          font-family: var(--heading-font);
                          font-weight: 600;
                          color: #fff;
                          margin-top: 10px;
                          margin-bottom: 27px;
                          text-align: center;
                          letter-spacing: 5px;
                      }

# Sources & Credits

- Fonts
  - Spartan
  - Roboto
- Icons
  - flaticon
- CSS
  - Animate
  - Bootstrap
  - Font Awesome
  - Magnific Popup
  - Nice Select
  - Slick Slider
- JS
  - Slick Slider
  - Bootstrap
  - Jquery
  - Nice Select
  - Magnific Popup
  - Wow js
  - theia-sticky-sidebar.min
  - jQuery Marquee

# Supports

Thank you for reading the documentaion. If you still have any question or any problem, please contact with us. We will give you best support Open Ticket. Thanks.