|
Server IP : 162.214.80.37 / Your IP : 216.73.216.68 Web Server : Apache System : Linux sh013.webhostingservices.com 4.19.286-203.ELK.el7.x86_64 #1 SMP Wed Jun 14 04:33:55 CDT 2023 x86_64 User : imyrqtmy ( 2189) PHP Version : 8.2.18 Disable Function : NONE MySQL : OFF | cURL : ON | WGET : ON | Perl : ON | Python : ON Directory (0755) : /home2/imyrqtmy/www/dts/html/ |
| [ Home ] | [ C0mmand ] | [ Upload File ] |
|---|
<!DOCTYPE html> <!--[if lt IE 7]> <html class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]--> <!--[if IE 7]> <html class="no-js lt-ie9 lt-ie8"> <![endif]--> <!--[if IE 8]> <html class="no-js lt-ie9"> <![endif]--> <!--[if gt IE 8]><!--> <html class="no-js"> <!--<![endif]--> <!-- Mirrored from html.modernwebtemplates.com/drively/shortcodes_typography.html by HTTrack Website Copier/3.x [XR&CO'2014], Mon, 03 Feb 2025 12:04:54 GMT --> <head> <title>Drively - Bootstrap 4 premium MultePage HTML template</title> <meta charset="utf-8"> <!--[if IE]> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <![endif]--> <meta name="description" content=""> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> <!-- Place favicon.ico and apple-touch-icon.png in the root directory --> <link rel="stylesheet" href="css/bootstrap.min.css"> <link rel="stylesheet" href="css/animations.css"> <link rel="stylesheet" href="css/regular.min.css"> <link rel="stylesheet" href="css/brands.min.css"> <link rel="stylesheet" href="css/solid.min.css"> <link rel="stylesheet" href="css/fontawesome.min.css"> <link rel="stylesheet" href="css/font-awesome.css"> <link rel="stylesheet" href="css/main.css" class="color-switcher-link"> <script src="js/vendor/modernizr-custom.js"></script> <!--[if lt IE 9]> <script src="js/vendor/html5shiv.min.js"></script> <script src="js/vendor/respond.min.js"></script> <script src="js/vendor/jquery-1.12.4.min.js"></script> <![endif]--> </head> <body> <!--[if lt IE 9]> <div class="bg-danger text-center">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/" class="color-main">upgrade your browser</a> to improve your experience.</div> <![endif]--> <div class="preloader"> <div class="preloader_image"></div> </div> <!-- search modal --> <div class="modal" tabindex="-1" role="dialog" aria-labelledby="search_modal" id="search_modal"> <button type="button" class="close" data-dismiss="modal" aria-label="Close"> <span aria-hidden="true">×</span> </button> <div class="widget widget_search"> <form method="get" class="searchform search-form" action="https://html.modernwebtemplates.com/"> <div class="form-group"> <input type="text" value="" name="search" class="form-control" placeholder="Search keyword" id="modal-search-input"> </div> <button type="submit" class="btn">Search</button> </form> </div> </div> <div class="modal" tabindex="-1" role="dialog" aria-labelledby="search_modal" id="mail_modal"> <div class="container"> <div class="row c-gutter-0 align-items-center"> <div class="ls col-md-12 col-lg-6"> <form class="contact-form c-mb-10 c-gutter-10" method="post" action="https://html.modernwebtemplates.com/"> <div class="row"> <div class="col-sm-12"> <h4><span class="color-main">Email</span> Us</h4> <div class="divider-sm-0 divider-md-30"></div> <div class="form-group has-placeholder"> <label for="name">Full Name <span class="required">*</span></label> <input type="text" aria-required="true" size="30" value="" name="name" id="name" class="form-control" placeholder="Full Name"> </div> <div class="form-group has-placeholder"> <label for="email">Email address<span class="required">*</span></label> <input type="email" aria-required="true" size="30" value="" name="email" id="email" class="form-control" placeholder="Email"> </div> <div class="form-group has-placeholder"> <label for="message">Message</label> <textarea aria-required="true" rows="6" cols="45" name="message" id="message" class="form-control" placeholder="Message"></textarea> </div> </div> </div> <div class="row mt-30"> <div class="col-sm-12"> <div class="form-group"> <button type="submit" id="contact_form_submit" name="contact_submit" class="btn btn-outline-darkgrey">Email Us</button> </div> </div> </div> </form> </div> <div class="col-md-12 col-lg-6"> <img src="images/email-modal.jpg" alt=""> </div> </div> </div> </div> <div class="modal" tabindex="-1" role="dialog" aria-labelledby="search_modal" id="sign_up_modal"> <div class="container"> <div class="row c-gutter-0 align-items-center"> <div class="ls col-12 col-sm-6"> <form class="contact-form sign-in c-mb-10 c-gutter-10" method="post" action="https://html.modernwebtemplates.com/"> <div class="row"> <div class="col-sm-12"> <h4><span class="color-main">Sign Up</span> / Sign In</h4> <div class="divider-sm-0 divider-md-30"></div> <div class="form-group has-placeholder"> <label for="name">Full Name <span class="required">*</span></label> <input type="text" aria-required="true" size="30" value="" name="name" id="signupname" class="form-control" placeholder="Full Name"> </div> <div class="form-group has-placeholder"> <label for="password">Password<span class="required">*</span></label> <input type="password" aria-required="true" size="30" value="" name="password" id="signuppassword" class="form-control" placeholder="Password"> </div> <div class="form-group has-placeholder"> <label for="email">Email<span class="required">*</span></label> <input type="email" aria-required="true" size="30" value="" name="email" id="signupemail" class="form-control" placeholder="Email"> </div> <div> <input type="checkbox" class="checkbox" id="signupcheckbox" /> <label for="signupcheckbox">I agree with all the text in the agreement</label> </div> </div> </div> <div class="row"> <div class="col-sm-12"> <div class="form-group"> <button type="submit" id="contact_signupform_submit" name="contact_submit" class="btn btn-outline-darkgrey">Email Us</button> </div> </div> <a class="phone_modal_button sign_up_modal close-modal" data-dismiss="modal" aria-label="Close" href="#sign_in_modal"><span aria-hidden="true">I am already Member</span></a> </div> </form> </div> <div class="col-12 col-sm-6 d-none d-sm-block"> <img src="images/sing-in-modal.jpg" alt=""> </div> </div> </div> </div> <div class="modal" tabindex="-1" role="dialog" aria-labelledby="search_modal" id="sign_in_modal"> <div class="container"> <div class="row c-gutter-0 align-items-center"> <div class="ls col-12 col-sm-6"> <form class="contact-form sign-in c-mb-10 c-gutter-10" method="post" action="https://html.modernwebtemplates.com/"> <div class="row"> <div class="col-sm-12"> <h4><span class="color-main">Sign In</span> / Sign Up</h4> <div class="divider-sm-0 divider-md-30"></div> <div class="form-group has-placeholder"> <label for="name">Full Name <span class="required">*</span></label> <input type="text" aria-required="true" size="30" value="" name="name" id="signname" class="form-control" placeholder="Full Name"> </div> <div class="form-group has-placeholder"> <label for="password">Password<span class="required">*</span></label> <input type="password" aria-required="true" size="30" value="" name="password" id="password" class="form-control" placeholder="Password"> </div> </div> </div> <div class="row"> <div class="col-sm-12"> <div class="form-group"> <button type="submit" id="contact_signinform_submit" name="contact_submit" class="btn btn-outline-darkgrey">Email Us</button> </div> </div> <a class="sign_up_modal close-modal" data-dismiss="modal" aria-label="Close" href="#sign_up_modal"><span aria-hidden="true">Forgot Password?</span></a> </div> </form> </div> <div class="col-12 col-sm-6 d-none d-sm-block"> <img src="images/sing-in-modal.jpg" alt=""> </div> </div> </div> </div> <!-- Unyson messages modal --> <div class="modal fade" tabindex="-1" role="dialog" id="messages_modal"> <div class="fw-messages-wrap ls p-normal"> <!-- Uncomment this UL with LI to show messages in modal popup to your user: --> <!-- <ul class="list-unstyled"> <li>Message To User</li> </ul> --> </div> </div><!-- eof .modal --> <!-- wrappers for visual page editor and boxed version of template --> <div id="canvas"> <div id="box_wrapper"> <!-- template sections --> <div class="header_absolute ds cover-background"> <!--topline section visible only on small screens|--> <section class="page_topline ds c-my-10 s-overlay"> <div class="container"> <div class="row align-items-center"> <div class="col-12 col-sm-5 text-left"> <span class="social-icons"> <a href="#" class="fa fa-facebook " title="facebook"></a> <a href="#" class="fab fa-youtube " title="youtube"></a> <a href="#" class="fab fa-linkedin-in " title="linkedin"></a> <a href="#" class="fa fa-twitter " title="twitter"></a> <a href="#" class="fa fa-google " title="google"></a> </span> </div> <div class="col-12 col-sm-7 text-right"> <ul class="small-text"> <li> <p class="phone_number"><span>Questions?</span><a href="tel:855374-6211">(855) 374-6211</a></p> </li> <li> <span> <a class="phone_modal_button" href="#sign_in_modal"><span class="ico icon-profile"></span></a> </span> </li> <li> <a class="email_modal_button" href="#mail_modal"><span class="ico icon-icon"></span></a> </li> <li> <a href="#"><span class="ico icon-comments"></span></a> </li> </ul> </div> </div> </div> </section> <!--eof topline--> <!-- header with two Bootstrap columns - left for logo and right for navigation and includes (search, social icons, additional links and buttons etc --> <header class="page_header ds justify-nav-end"> <div class="container"> <div class="row align-items-center"> <div class="col-xl-3 col-lg-4 col-md-5 col-11"> <a href="index-2.html" class="logo"> <img src="images/logo.png" alt=""> </a> </div> <div class="col-xl-9 col-lg-8 col-md-7 col-1"> <div class="nav-wrap"> <!-- main nav start --> <nav class="top-nav"> <ul class="nav sf-menu"> <li class="active"> <a href="index.html">Home</a> <ul> <li> <a href="index.html">MultiPage</a> </li> <li> <a href="index_static.html">Static Intro</a> </li> <li> <a href="index_singlepage.html">Single Page</a> </li> </ul> </li> <li> <a href="about.html">Pages</a> <ul> <li> <a href="about.html">About</a> </li> <!-- features --> <li> <a href="shortcodes_iconbox.html">Shortcodes</a> <ul> <li> <a href="shortcodes_typography.html">Typography</a> </li> <li> <a href="shortcodes_buttons.html">Buttons</a> </li> <li> <a href="shortcodes_iconbox.html">Icon Boxes</a> </li> <li> <a href="shortcodes_progress.html">Progress</a> </li> <li> <a href="shortcodes_tabs.html">Tabs & Collapse</a> </li> <li> <a href="shortcodes_bootstrap.html">Bootstrap Elements</a> </li> <li> <a href="shortcodes_animation.html">Animation</a> </li> <li> <a href="shortcodes_icons.html">Template Icons</a> </li> <li> <a href="shortcodes_socialicons.html">Social Icons</a> </li> </ul> </li> <!-- eof shortcodes --> <li> <a href="services.html">Our Services</a> <ul> <li> <a href="services.html">Services 1</a> </li> <li> <a href="services2.html">Services 2</a> </li> <li> <a href="services3.html">Services 3</a> </li> <li> <a href="service-single.html">Single Service</a> </li> </ul> </li> <li> <a href="pricing.html">Pricing</a> </li> <!-- shop --> <li> <a href="shop-right.html">Shop</a> <ul> <li> <a href="shop-account-dashboard.html">Account</a> <ul> <li> <a href="shop-account-details.html">Account details</a> </li> <li> <a href="shop-account-addresses.html">Addresses</a> </li> <li> <a href="shop-account-address-edit.html">Edit Address</a> </li> <li> <a href="shop-account-orders.html">Orders</a> </li> <li> <a href="shop-account-order-single.html">Single Order</a> </li> <li> <a href="shop-account-downloads.html">Downloads</a> </li> <li> <a href="shop-account-password-reset.html">Password Reset</a> </li> <li> <a href="shop-account-login.html">Login/Logout</a> </li> </ul> </li> <li> <a href="shop-right.html">Right Sidebar</a> </li> <li> <a href="shop-left.html">Left Sidebar</a> </li> <li> <a href="shop-product-right.html">Product Right Sidebar</a> </li> <li> <a href="shop-product-left.html">Product Left Sidebar</a> </li> <li> <a href="shop-cart.html">Cart</a> </li> <li> <a href="shop-checkout.html">Checkout</a> </li> <li> <a href="shop-order-received.html">Order Received</a> </li> </ul> </li> <!-- eof shop --> <!-- blog --> <li> <a href="blog-right.html">Blog</a> <ul> <li> <a href="blog-right.html">Right Sidebar</a> </li> <li> <a href="blog-left.html">Left Sidebar</a> </li> <li> <a href="blog-full.html">No Sidebar</a> </li> <li> <a href="blog-grid.html">Blog Grid</a> </li> <li> <a href="blog-single-right.html">Post</a> <ul> <li> <a href="blog-single-right.html">Right Sidebar</a> </li> <li> <a href="blog-single-left.html">Left Sidebar</a> </li> <li> <a href="blog-single-full.html">No Sidebar</a> </li> </ul> </li> <li> <a href="blog-single-video-right.html">Video Post</a> <ul> <li> <a href="blog-single-video-right.html">Right Sidebar</a> </li> <li> <a href="blog-single-video-left.html">Left Sidebar</a> </li> <li> <a href="blog-single-video-full.html">No Sidebar</a> </li> </ul> </li> </ul> </li> <!-- eof blog --> <!-- gallery --> <li> <a href="gallery-image.html">Gallery</a> <ul> <!-- Gallery image only --> <li> <a href="gallery-image.html">Image Only</a> <ul> <li> <a href="gallery-image-2-cols.html">2 columns</a> </li> <li> <a href="gallery-image.html">3 columns</a> </li> <li> <a href="gallery-image-4-cols-fullwidth.html">4 columns fullwidth</a> </li> </ul> </li> <!-- eof Gallery image only --> <!-- Gallery with title --> <li> <a href="gallery-title.html">Image With Title</a> <ul> <li> <a href="gallery-title-2-cols.html">2 columns</a> </li> <li> <a href="gallery-title.html">3 column</a> </li> <li> <a href="gallery-title-4-cols-fullwidth.html">4 columns fullwidth</a> </li> </ul> </li> <!-- eof Gallery with title --> <!-- Gallery with excerpt --> <li> <a href="gallery-excerpt.html">Image with Excerpt</a> <ul> <li> <a href="gallery-excerpt-2-cols.html">2 columns</a> </li> <li> <a href="gallery-excerpt.html">3 column</a> </li> <li> <a href="gallery-excerpt-4-cols-fullwidth.html">4 columns fullwdith</a> </li> </ul> </li> <!-- eof Gallery with excerpt --> <li> <a href="gallery-tiled.html">Tiled Gallery</a> </li> <!-- Gallery item --> <li> <a href="gallery-single.html">Gallery Item</a> <ul> <li> <a href="gallery-single.html">Style 1</a> </li> <li> <a href="gallery-single2.html">Style 2</a> </li> </ul> </li> <!-- eof Gallery item --> </ul> </li> <!-- eof Gallery --> <li> <a href="shortcodes_widgets_default.html">Widgets</a> <ul> <li> <a href="shortcodes_widgets_default.html">Default Widgets</a> </li> <li> <a href="shortcodes_widgets_shop.html">Shop Widgets</a> </li> <li> <a href="shortcodes_widgets_custom.html">Custom Widgets</a> </li> </ul> </li> <!-- events --> <li> <a href="events-left.html">Events</a> <ul> <li> <a href="events-left.html">Left Sidebar</a> </li> <li> <a href="events-right.html">Right Sidebar</a> </li> <li> <a href="events-full.html">Full Width</a> </li> <li> <a href="event-single-left.html">Single Event</a> <ul> <li> <a href="event-single-left.html">Left Sidebar</a> </li> <li> <a href="event-single-right.html">Right Sidebar</a> </li> <li> <a href="event-single-full.html">Full Width</a> </li> </ul> </li> </ul> </li> <!-- eof events --> <li> <a href="team.html">Team</a> <ul> <li> <a href="team.html">Team List</a> </li> <li> <a href="team-single.html">Team Member</a> </li> </ul> </li> <li> <a href="comingsoon.html">Comingsoon</a> </li> <li> <a href="package.html">Package</a> </li> <li> <a href="courses.html">Courses</a> <ul> <li> <a href="courses.html">Courses</a> </li> <li> <a href="courses-single.html">Single course</a> </li> </ul> </li> <li> <a href="404.html">404</a> </li> </ul> </li> <!-- eof pages --> <li> <a href="how-it-works.html">How it works</a> </li> <li> <a href="#">Features</a> <div class="mega-menu"> <ul class="mega-menu-row"> <li class="mega-menu-col"> <a href="#">Headers</a> <ul> <li> <a href="header1.html">Header Type 1</a> </li> <li> <a href="header2.html">Header Type 2</a> </li> <li> <a href="header3.html">Header Type 3</a> </li> <li> <a href="header4.html">Header Type 4</a> </li> <li> <a href="header5.html">Header Type 5</a> </li> <li> <a href="header6.html">Header Type 6</a> </li> </ul> </li> <li class="mega-menu-col"> <a href="#">Side Menus</a> <ul> <li> <a href="header-side.html">Push Left</a> </li> <li> <a href="header-side-right.html">Push Right</a> </li> <li> <a href="header-side-slide.html">Slide Left</a> </li> <li> <a href="header-side-slide-right.html">Slide Right</a> </li> <li> <a href="header-side-sticked.html">Sticked Left</a> </li> <li> <a href="header-side-sticked-right.html">Sticked Right</a> </li> </ul> </li> <li class="mega-menu-col"> <a href="title1.html">Title Sections</a> <ul> <li> <a href="title1.html">Title section 1</a> </li> <li> <a href="title2.html">Title section 2</a> </li> <li> <a href="title3.html">Title section 3</a> </li> <li> <a href="title4.html">Title section 4</a> </li> <li> <a href="title5.html">Title section 5</a> </li> <li> <a href="title6.html">Title section 6</a> </li> </ul> </li> <li class="mega-menu-col"> <a href="footer1.html#footer">Footers</a> <ul> <li> <a href="footer1.html#footer">Footer Type 1</a> </li> <li> <a href="footer2.html#footer">Footer Type 2</a> </li> <li> <a href="footer3.html#footer">Footer Type 3</a> </li> <li> <a href="footer4.html#footer">Footer Type 4</a> </li> <li> <a href="footer5.html#footer">Footer Type 5</a> </li> <li> <a href="footer6.html#footer">Footer Type 6</a> </li> </ul> </li> <li class="mega-menu-col"> <a href="copyright1.html#copyright">Copyright</a> <ul> <li> <a href="copyright1.html#copyright">Copyright 1</a> </li> <li> <a href="copyright2.html#copyright">Copyright 2</a> </li> <li> <a href="copyright3.html#copyright">Copyright 3</a> </li> <li> <a href="copyright4.html#copyright">Copyright 4</a> </li> <li> <a href="copyright5.html#copyright">Copyright 5</a> </li> <li> <a href="copyright6.html#copyright">Copyright 6</a> </li> </ul> </li> </ul> </div> <!-- eof mega menu --> </li> <!-- eof features --> <li> <a href="faq.html">FAQ</a> <ul> <li> <a href="faq.html">FAQ</a> </li> <li> <a href="faq2.html">FAQ 2</a> </li> </ul> </li> <!-- contacts --> <li> <a href="contact.html">Contact</a> <ul> <li> <a href="contact.html">Contact 1</a> </li> <li> <a href="contact2.html">Contact 2</a> </li> <li> <a href="contact3.html">Contact 3</a> </li> <li> <a href="contact4.html">Contact 4</a> </li> </ul> </li> <!-- eof contacts --> </ul> </nav> <!-- eof main nav --> <!--hidding includes on small devices. They are duplicated in topline--> <ul class="top-includes d-none d-xl-block"> <li> <!--modal search--> <span> <a href="#" class="search_modal_button"> <i class="fa fa-search"></i> </a> </span> </li> </ul> </div> </div> </div> </div> <!-- header toggler --> <span class="toggle_menu"><span></span></span> </header> <section class="page_title padding-mobile cs s-pt-59 s-pb-94"> <div class="container"> <div class="row"> <div class="col-md-12"> <h1 class="bold">Typography</h1> <ul class="breadcrumb"> <li class="breadcrumb-item"> <a href="index-2.html">Home</a> </li> <li class="breadcrumb-item"> <a href="#">Pages</a> </li> <li class="breadcrumb-item active"> Typography </li> </ul> </div> </div> </div> </section> </div> <section class="ls s-py-50 c-mb-60"> <div class="container"> <div class="row"> <div class="d-none d-lg-block divider-70"></div> <div class="col-md-12"> <h2>Layout: Columns</h2> <hr> <h3>Full Width</h3> <p class="excerpt"> At vero eos accusam justo duo dolores et rebum clita kasd gubergren nosea takimata sanctus est dolor sit amet </p> <p> At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor amet consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt. </p> <p> Labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, At accusam aliquyam diam diam dolore dolores duo eirmod eos erat, et nonumy sed tempor et et invidunt justo labore Stet clita ea et gubergren, kasd magna no rebum. </p> <blockquote> <p> Nam liber tempor csoluta nobis eleifend option congue nihil imperdiet doming idquod mazim placerat facer possim assum lorem ipsum dolor siamet consectetuer. </p> <div class="item-meta"> <span>January 23, 2019</span><span>Web hosting</span> </div> </blockquote> <p> Lorem ipsum dolor sit amet, consetetur sadipscing elitr, At accusam aliquyam diam diam dolore dolores duo eirmod eos erat, et nonumy sed tempor et et invidunt justo labore Stet clita ea et gubergren, kasd magna no rebum. </p> <p> <img class="alignleft" alt="" src="images/side-image-small.jpg"> </p> <p> At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctusamet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat. </p> <p> At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, At accusam aliquyam diam diam dolore dolores duo eirmod eos erat, et nonumy sed tempor et et invidunt justo labore Stet clita ea et gubergren, kasd magna no rebum. sanctus sesed takimata vero voluptua est ipsum dolor. </p> <p>Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et ea rebum stet clita kasd gubergren no sea takimata sanctus est Lorem ipsum dolor sit amet lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est </p> <p> <img class="alignright" alt="" src="images/side-image-smal-rightl.jpg"> </p> <p> At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum </p> <p> Consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. </p> </div> </div> <div class="row"> <div class="col-md-6"> <h3>1/2</h3> <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Facere dolorem nisi unde itaque, aliquid. Necessitatibus, dolorem tempora repudiandae modi. Quis, esse eveniet suscipit! Enim dicta voluptate quas ea, facilis repellat!</p> </div> <div class="col-md-6"> <h3>1/2</h3> <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ut doloribus obcaecati incidunt quas iusto eos nobis. Laudantium veniam, reprehenderit nemo alias ducimus, illo, omnis voluptas doloribus cupiditate repudiandae porro numquam?</p> </div> </div> <div class="row"> <div class="col-md-4"> <h3>1/3</h3> <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Facere dolorem nisi unde itaque, aliquid. Necessitatibus, dolorem tempora repudiandae modi. Quis, esse eveniet suscipit! Enim dicta voluptate quas ea, facilis repellat!</p> </div> <div class="col-md-4"> <h3>1/3</h3> <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ut doloribus obcaecati incidunt quas iusto eos nobis. Laudantium veniam, reprehenderit nemo alias ducimus, illo, omnis voluptas doloribus cupiditate repudiandae porro numquam?</p> </div> <div class="col-md-4"> <h3>1/3</h3> <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ut doloribus obcaecati incidunt quas iusto eos nobis. Laudantium veniam, reprehenderit nemo alias ducimus, illo, omnis voluptas doloribus cupiditate repudiandae porro.</p> </div> </div> <div class="row"> <div class="col-md-3"> <h3>1/4</h3> <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Facere dolorem nisi unde itaque, aliquid. Necessitatibus, dolorem tempora repudiandae modi. Quis, esse eveniet suscipit! Enim dicta voluptate quas ea, facilis repellat!</p> </div> <div class="col-md-3"> <h3>1/4</h3> <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ut doloribus obcaecati incidunt quas iusto eos nobis. Laudantium veniam, reprehenderit nemo alias ducimus, illo, omnis voluptas doloribus cupiditate repudiandae porro numquam?</p> </div> <div class="col-md-3"> <h3>1/4</h3> <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ut doloribus obcaecati incidunt quas iusto eos nobis. Laudantium veniam, reprehenderit nemo alias ducimus, illo, omnis voluptas doloribus cupiditate repudiandae porro.</p> </div> <div class="col-md-3"> <h3>1/4</h3> <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ut doloribus obcaecati incidunt quas iusto eos nobis. Laudantium veniam, reprehenderit nemo alias ducimus, illo, omnis voluptas doloribus cupiditate repudiandae porro numquam?</p> </div> </div> <h2>Text Formatting:</h2> <hr> <div class="row"> <div class="col-md-12"> <h1>Heading 1</h1> <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Porro nam reprehenderit aperiam, non suscipit ex. Aliquam at, molestias impedit deserunt debitis voluptates soluta dolor asperiores fuga enim tempore ad saepe!</p> <h2>Heading 2</h2> <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Reiciendis libero nisi tempora ex magnam et inventore explicabo maxime qui numquam blanditiis accusantium quod rerum sequi, at molestiae delectus, commodi dicta!</p> <h3>Heading 3</h3> <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Perferendis fugit consequuntur laudantium laboriosam numquam repellat, minus hic doloremque commodi porro est molestias, quasi fuga quae modi expedita ab, perspiciatis odio.</p> <h4>Heading 4</h4> <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Saepe ullam aspernatur ex harum culpa mollitia blanditiis a. At corporis ullam sint asperiores. Asperiores modi dignissimos dicta vitae neque incidunt sed.</p> <h5>Heading 5</h5> <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Commodi laudantium quidem deserunt soluta eaque in ad iure? Modi ducimus distinctio at accusantium porro ipsum quisquam, beatae magnam, magni pariatur temporibus?</p> <h6>Heading 6</h6> <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Eveniet non pariatur odio, modi ad, incidunt temporibus suscipit voluptas nostrum iste expedita, ducimus dignissimos, corporis? Debitis ipsa perspiciatis atque, vero quidem.</p> <blockquote> Lorem ipsum dolor sit amet, consectetur adipisicing elit. Voluptate aspernatur, voluptatum omnis, repellendus ipsa atque cumque suscipit quia nostrum dicta, iste mollitia! Distinctio eos cum est dolorem officiis. Iusto, quaerat. </blockquote> <p> Lorem ipsum dolor sit amet, consectetur adipisicing elit. Vero odit, ipsum deleniti! Ullam quos laboriosam distinctio aperiam esse alias et non at. Aliquam officia, quisquam impedit nisi vel totam itaque. </p> <p> Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nihil dolorum, sit repellat consequuntur excepturi? Omnis ipsam quia numquam alias quas temporibus ducimus ratione asperiores, quo odio nisi, similique non? Nisi. </p> <h3 class="text-center">Centered Heading</h3> <p class="text-center"><strong>Centered Paragraph:</strong> Lorem ipsum dolor sit amet, consectetur adipisicing elit. Officia nihil porro eius facilis consectetur, voluptas, ex, sequi maxime eum accusamus ratione magni nesciunt dolorum illo ullam? Hic, asperiores laborum ipsa.</p> <div class="my-40"> </div> <h2>Special headers:</h2> <hr> <h3 class="special-heading">Section heading</h3> <p>and paragraph below</p> <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Repudiandae, quidem, neque. Sunt dolores enim ad quibusdam natus consequuntur, sint vitae ducimus optio tempora itaque architecto necessitatibus ex, cupiditate iste hic?</p> <h3 class="special-heading text-center">Centered heading</h3> <p>and paragraph below</p> <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Assumenda quis quasi ipsa veritatis? Harum est recusandae perferendis, nesciunt eaque libero, vel cum officia aut sapiente dolor accusantium praesentium. Quos, hic.</p> <h3 class="special-heading big text-center">Big centered heading</h3> <p>and paragraph below</p> <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Reiciendis, sit laboriosam voluptatum. Magnam ipsa, dolorem. Quam beatae, optio dolore eligendi labore ea. Temporibus commodi natus neque numquam impedit veritatis voluptates?</p> <h3 class="special-heading small text-center">Small centered <strong class="color-main">heading</strong> </h3> <p>and paragraph below</p> <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Dignissimos nisi, dolorem repudiandae, nemo minus repellendus, natus non iste voluptatem ipsa aut quae aspernatur recusandae cumque. Doloribus qui ipsum odio. Ex.</p> <h3 class="special-heading text-center">Centered heading</h3> <h3 class="text-center">and heading h3 below</h3> <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Repudiandae numquam eius, quo modi provident, vel quas. Maiores unde enim eveniet cupiditate quos officiis autem, cum optio, ipsum itaque harum excepturi?</p> <h3>Headings with Font Awesome:</h3> <h1><i class="fa fa-check-circle"></i> Lorem ipsum</h1> <h2><i class="fa fa-check-circle"></i> Sint animi non</h2> <h3><i class="fa fa-check-circle"></i> Eaque blanditiis nemo</h3> <h4><i class="fa fa-check-circle"></i> Amet, consectetur adipisicing</h4> <h5><i class="fa fa-check-circle"></i> Blanditiis nemo quaerat</h5> <h6><i class="fa fa-check-circle"></i> Adipisicing nemo animi</h6> </div> </div> <h2>Lists:</h2> <hr> <div class="row"> <div class="col-md-6"> <h5>Theme List</h5> <ul class="list-styled"> <li>Lorem ipsum dolor sit amet</li> <li>Sint animi non ut sed</li> <li>Eaque blanditiis nemo</li> <li>Amet, consectetur adipisicing</li> <li>Blanditiis nemo quaerat</li> </ul> </div> <div class="col-md-6"> <h5>Theme Bordered List</h5> <ul class="list-bordered"> <li>Lorem ipsum dolor sit amet</li> <li>Sint animi non ut sed</li> <li>Eaque blanditiis nemo</li> </ul> </div> </div> <div class="row"> <div class="col-md-6"> <h5>Unordered list</h5> <ul> <li>Lorem ipsum dolor sit amet</li> <li>Sint animi non ut sed</li> <li>Eaque blanditiis nemo</li> <li>Amet, consectetur adipisicing</li> <li>Blanditiis nemo quaerat</li> </ul> </div> <div class="col-md-6"> <h5>Order list</h5> <ol> <li>Lorem ipsum dolor sit amet</li> <li>Sint animi non ut sed</li> <li>Eaque blanditiis nemo</li> <li>Amet, consectetur adipisicing</li> <li>Blanditiis nemo quaerat</li> </ol> </div> </div> <h2>Tables:</h2> <hr> <div class="row"> <div class="col-md-12"> <h3>Default Table</h3> <table> <thead> <tr> <th>#</th> <th>First Name</th> <th>Last Name</th> <th>Username</th> </tr> </thead> <tbody> <tr> <td rowspan="2">1</td> <td>Mark</td> <td>Otto</td> <td>@mdo</td> </tr> <tr> <td>Mark</td> <td>Otto</td> <td>@TwBootstrap</td> </tr> <tr> <td>2</td> <td>Jacob</td> <td>Thornton</td> <td>@fat</td> </tr> <tr> <td>3</td> <td colspan="2">Larry the Bird</td> <td>@twitter</td> </tr> </tbody> </table> <h3>Bootstrap Stripped Table</h3> <table class="table table-striped"> <thead> <tr> <th>#</th> <th>First Name</th> <th>Last Name</th> <th>Username</th> </tr> </thead> <tbody> <tr> <td>1</td> <td>Mark</td> <td>Otto</td> <td>@mdo</td> </tr> <tr> <td>2</td> <td>Jacob</td> <td>Thornton</td> <td>@fat</td> </tr> <tr> <td>3</td> <td>Larry</td> <td>the Bird</td> <td>@twitter</td> </tr> </tbody> </table> <h3>Bootstrap Bordered Table</h3> <table class="table table-bordered"> <thead> <tr> <th>#</th> <th>First Name</th> <th>Last Name</th> <th>Username</th> </tr> </thead> <tbody> <tr> <td rowspan="2">1</td> <td>Mark</td> <td>Otto</td> <td>@mdo</td> </tr> <tr> <td>Mark</td> <td>Otto</td> <td>@TwBootstrap</td> </tr> <tr> <td>2</td> <td>Jacob</td> <td>Thornton</td> <td>@fat</td> </tr> <tr> <td>3</td> <td colspan="2">Larry the Bird</td> <td>@twitter</td> </tr> </tbody> </table> </div> </div> </div> </section> <footer class="page_footer ds s-pt-77 s-pb-60 c-gutter-60"> <div class="container"> <div class="row"> <div class="divider-20 d-none d-xl-block"></div> <div class="col-md-6 col-xl-4 animate" data-animation="fadeInUp"> <div class="widget widget_text "> <img src="images/logo.png" alt=""> <p>The Leader in Defensive Driving, Traffic School & Drivers Education for both Teens and Adults.</p> <p class="copyright"><i>Example.com Copyright <span class="copyright_year">©2019</span></i></p> </div> </div> <div class="col-md-6 col-xl-2 animate" data-animation="fadeInUp"> <div class="widget widget_working_hours"> <h3>Company</h3> <ul class="list-not-style"> <li> <a href="#">About us</a> </li> <li> <a href="#">Courses</a> </li> <li> <a href="#">Instructors</a> </li> <li> <a href="#">Pricing</a> </li> <li> <a href="#">Contact us</a> </li> </ul> </div> </div> <div class="col-md-6 col-xl-3 animate" data-animation="fadeInUp"> <div class="widget widget_icons_list"> <h3>Contacts</h3> <div class="media side-icon-box"> <div class="icon-styled color-main fs-14"> <i class="ico icon-facebook-placeholder-for-locate-places-on-maps"></i> </div> <p class="media-body">USA, 3280 Cabell Avenue Alexandria, VA 22301</p> </div> <div class="media side-icon-box"> <div class="icon-styled color-main fs-14"> <i class="ico icon-phone-receiver"></i> </div> <p class="media-body">Tel.: +1 703-518-6099</p> </div> <div class="media side-icon-box"> <div class="icon-styled color-main fs-14"> <i class="fa fa-envelope"></i> </div> <p class="media-body"> <a href="#"><span class="__cf_email__" data-cfemail="543d3a323b1421272021303d7a373b39">[email protected]</span></a> </p> </div> </div> </div> <div class="col-md-6 col-xl-3 animate" data-animation="fadeInUp"> <div class="widget widget_mailchimp"> <h3 class="widget-title">Subscribe</h3> <p> Get latest updates and offers </p> <form class="signup" action="https://html.modernwebtemplates.com/"> <label for="mailchimp_email"> <span class="screen-reader-text">Subscribe:</span> </label> <input id="mailchimp_email" name="email" type="email" class="form-control mailchimp_email" placeholder="Enter Your E-mail"> <button type="submit" class="search-submit"> <span class="screen-reader-text">Subscribe</span> </button> <div class="response"></div> </form> </div> <div class="row c-gutter-30"> <div class="col-sm-12 col-xl-6"> <a href="#" class="fa fa-facebook" title="facebook"><span>facebook</span></a> <a href="#" class="fa fa-twitter" title="twitter"><span>twitter</span></a> </div> <div class="col-sm-12 col-xl-6"> <a href="#" class="fab fa-linkedin-in" title="linkedin"><span>linkedin</span></a> <a href="#" class="fa fa-google" title="google"><span>google</span></a> </div> </div> </div> </div> </div> </footer> </div><!-- eof #box_wrapper --> </div><!-- eof #canvas --> <script data-cfasync="false" src="../cdn-cgi/scripts/5c5dd728/cloudflare-static/email-decode.min.js"></script><script src="js/compressed.js"></script> <script src="js/main.js"></script> <script src="js/switcher.js"></script> </body> <!-- Mirrored from html.modernwebtemplates.com/drively/shortcodes_typography.html by HTTrack Website Copier/3.x [XR&CO'2014], Mon, 03 Feb 2025 12:04:56 GMT --> </html>