<link href="//maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"></script> <script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> <!------ Include the above in your HEAD tag ----------> <link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css" rel="stylesheet" integrity="sha384-T8Gy5hrqNKT+hzMclPo118YTQO6cYprQmhrYwIiQ/3axmI1hQomh7Ud2hPOy8SP1" crossorigin="anonymous"> <nav class="navbar navbar-expand-sm bg-light navbar-light border fixed-top"> <div class="container"> <!-- Brand --> <a class="navbar-brand" href="#"> <img src="http://sarto.edge-themes.com/wp-content/uploads/2018/04/landing-img-18.png" alt="Logo" style="width:70px;"> </a> <!-- Toggler/collapsibe Button --> <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#collapsibleNavbar"> <span class="navbar-toggler-icon"></span> </button> <!-- Navbar links --> <div class="collapse navbar-collapse" id="collapsibleNavbar"> <ul class="navbar-nav ml-auto"> <li class="nav-item"> <a class="nav-link" href="#">Home</a> </li> <li class="nav-item"> <a class="nav-link" href="#">About Us</a> </li> <li class="nav-item"> <a class="nav-link" href="#">Categories</a> </li> <li class="nav-item"> <a class="nav-link" href="#">License</a> </li> <li class="nav-item"> <a class="nav-link" href="#">Support</a> </li> <button type="button" class="btn btn-light">Contact Us</button> <button type="button" class="btn btn-light"data-toggle="modal" data-target="#toploginModal">Login</button> </ul> </div> </div> </nav> <div class="modal fade" id="toploginModal" tabindex="-1" role="dialog" aria-labelledby="toploginModalLabel" aria-hidden="true"> <div class="modal-dialog" role="document"> <div class="modal-content"> <div class="modal-header bg-primary text-white"> <h5 class="modal-title" id="toploginModalLabel">Login</h5> <button type="button" class="close" data-dismiss="modal" aria-label="Close"> <span aria-hidden="true">×</span> </button> </div> <div class="modal-body"> <form class="form-horizontal"> <div class="form-group"> <input id="email" name="email" placeholder="Email" class="form-control" required="required" type="text"> </div> <div class="form-group"> <input id="password" name="password" placeholder="password" class="form-control" type="text"> </div> <div class="form-group"> <button name="submit" type="submit" class="btn btn-primary">Login</button> <button type="button" class="btn btn-link">Forgot Password?</button> </div> </form> </div> <div class="modal-footer"> <small>New to Refers ?<a href="#">Register here</a></small> </div> </div> </div> </div> <div class="mt-5"></div> <section class="aboutus py-5" id="aboutus"> <div class="container-fluid"> <div class="row"> <div class="col-md-3"> <div class="card"> <div class=""> <h4 class="pl-3 py-2">Categories</h4> <div class="row"> <div class="col-md-12"> <div class="card-body"> <img src="https://w3layouts.com/wp-content/uploads/2018/04/edu_academy_Free03-03-2018_1807826200.jpg"alt="#"> </div> </div> </div> <div class="row"> <div class="col-md-12"> <div class="card-body"> <img src="https://w3layouts.com/wp-content/uploads/2018/04/edu_academy_Free03-03-2018_1807826200.jpg"alt="#"> </div> </div> </div> </div> </div> </div> <div class="col-md-9"> <div class="card pb-5"> <div class="card-body"> <div class="row"> <div class="col-md-12"> <h5>Campus Education Category Bootstrap Responsive Web Template</h5> <div class="pb-3"></div> </div> </div> <div class="row"> <div class="col-md-12"> <img src="https://w3layouts.com/wp-content/uploads/2018/01/campus_Free10-01-2018_434855747.jpg"alt=""> </div> </div> <div class="row mt-5 text-center"> <div class="col-md-12"> <button type="button" class="btn btn-primary">View Demo</button> <button type="button" class="btn btn-primary">Download Template</button> <button type="button" class="btn btn-primary">Remove Backlinks</button> </div> </div> <div class="row pt-4"> <div class="col-md-12"> <p> Campus is a clean, minimal and modern template for all kinds of educational center like School, College, University & Training center or any other educational establishment. It is compatible with Education, Academy, Agency, Magizine, Charity, University and much more for all your educational websites in order to expand your online presence and online business. It can also be used for any other businesses or services, and is a perfect website for your eduaction related business. This creatively designed campus template comes with necessary features with top bar and a static banner image with text elegantly crafted on it, about the history of a company and required services, a image-rich gallery , professional & educational teaching staff, a contact form and a subscribe form to get free updates of your educational system and elegance style of design in every detail. It is designed so simple that can easily be adapted as per your convinence for your online educational websites. Grab this template if you need to build a sustainable educational website that will boost your brand awareness and help your business grow. This template is 100% responsive cross browser template, compatible on all devices, displayed on all screen sizes. It is entirely built in Bootstrap framework, HTML5, CSS3 and JQuery. Make it yours now by using it, downloading it and please share it. </p> </div> </div> </div> </div> </div> </div> </div> </section> <section class="footer bg-light py-5" id="footer"> <div class="container"> <div class="row"> <div class="col-md-3"> <h5>About Sarto</h5> <p>Person usually begins a job by becoming an employee, volunteering, or starting a business. Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusant doloremque laudantium, totam rem aperiam eaque ipsa quae.</p> </div> <div class="col-md-3"> <h5>About Sarto</h5> <ul class="list-inline list-unstyled"> <li><a href="#"> Administrator</a></li> <li><a href="#"> Account</a></li> <li><a href="#"> Finance</a></li> <li><a href="#"> Developer</a></li> <li><a href="#"> Project Manager</a></li> <li><a href="#"> Art Director</a></li> <li><a href="#"> Animator</a></li> </ul> </div> <div class="col-md-3"> <h5>About Sarto</h5> <ul class="list-inline list-unstyled"> <li><a href="#"> Administrator</a></li> <li><a href="#"> Account</a></li> <li><a href="#"> Finance</a></li> <li><a href="#"> Developer</a></li> <li><a href="#"> Project Manager</a></li> <li><a href="#"> Art Director</a></li> <li><a href="#"> Animator</a></li> </ul> </div> <div class="col-md-3"> <h5>About Sarto</h5> <ul class="list-inline list-unstyled"> <li><a href="#"> Administrator</a></li> <li><a href="#"> Account</a></li> <li><a href="#"> Finance</a></li> <li><a href="#"> Developer</a></li> <li><a href="#"> Project Manager</a></li> <li><a href="#"> Art Director</a></li> <li><a href="#"> Animator</a></li> </ul> </div> </div> </div> </section> <section class="copyright border bg-dark text-white py-2" id="copyright"> <div class="container"> <div class="row text-center"> <div class="col-md-12"> <small>Sarto © 2018, All Rights Reserved, Design & Developed By: </small> </div> </div> </div> </section>

body {background:#;} .fa {margin-right:15px;} a {color:#696969;} a:hover {text-decoration: none;} img {width:100%;}