@coreui/ajax

<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> <meta name="description" content="CoreUI - Open Source Bootstrap Admin Template"> <meta name="author" content="Łukasz Holeczek"> <meta name="keyword" content="Bootstrap,Admin,Template,Open,Source,AngularJS,Angular,Angular2,Angular 2,Angular4,Angular 4,jQuery,CSS,HTML,RWD,Dashboard,React,React.js,Vue,Vue.js"> <link rel="shortcut icon" href="img/favicon.png"> <title>CoreUI - Open Source Bootstrap Admin Template</title>  <link href="node_modules/flag-icon-css/css/flag-icon.min.css" rel="stylesheet"> <link href="node_modules/font-awesome/css/font-awesome.min.css" rel="stylesheet"> <link href="node_modules/simple-line-icons/css/simple-line-icons.css" rel="stylesheet">  <link href="css/style.css" rel="stylesheet">  </head>  <body class="app header-fixed sidebar-fixed aside-menu-fixed aside-menu-hidden"> <header class="app-header navbar"> <button class="navbar-toggler mobile-sidebar-toggler d-lg-none mr-auto" type="button"> <span class="navbar-toggler-icon"></span> </button> <a class="navbar-brand" href="#"></a> <button class="navbar-toggler sidebar-toggler d-md-down-none" type="button"> <span class="navbar-toggler-icon"></span> </button> <ul class="nav navbar-nav d-md-down-none"> <li class="nav-item px-3"> <a class="nav-link" href="#">Dashboard</a> </li> <li class="nav-item px-3"> <a class="nav-link" href="#">Users</a> </li> <li class="nav-item px-3"> <a class="nav-link" href="#">Settings</a> </li> </ul> <ul class="nav navbar-nav ml-auto"> <li class="nav-item d-md-down-none"> <a class="nav-link" href="#"><i class="icon-bell"></i><span class="badge badge-pill badge-danger">5</span></a> </li> <li class="nav-item d-md-down-none"> <a class="nav-link" href="#"><i class="icon-list"></i></a> </li> <li class="nav-item d-md-down-none"> <a class="nav-link" href="#"><i class="icon-location-pin"></i></a> </li> <li class="nav-item dropdown"> <a class="nav-link" data-toggle="dropdown" href="#" role="button" aria-haspopup="true" aria-expanded="false"> <img src="img/avatars/6.jpg" class="img-avatar" alt="admin@bootstrapmaster.com"> </a> <div class="dropdown-menu dropdown-menu-right"> <div class="dropdown-header text-center"> <strong>Account</strong> </div> <a class="dropdown-item" href="#"><i class="fa fa-bell-o"></i> Updates<span class="badge badge-info">42</span></a> <a class="dropdown-item" href="#"><i class="fa fa-envelope-o"></i> Messages<span class="badge badge-success">42</span></a> <a class="dropdown-item" href="#"><i class="fa fa-tasks"></i> Tasks<span class="badge badge-danger">42</span></a> <a class="dropdown-item" href="#"><i class="fa fa-comments"></i> Comments<span class="badge badge-warning">42</span></a> <div class="dropdown-header text-center"> <strong>Settings</strong> </div> <a class="dropdown-item" href="#"><i class="fa fa-user"></i> Profile</a> <a class="dropdown-item" href="#"><i class="fa fa-wrench"></i> Settings</a> <a class="dropdown-item" href="#"><i class="fa fa-usd"></i> Payments<span class="badge badge-secondary">42</span></a> <a class="dropdown-item" href="#"><i class="fa fa-file"></i> Projects<span class="badge badge-primary">42</span></a> <div class="divider"></div> <a class="dropdown-item" href="#"><i class="fa fa-shield"></i> Lock Account</a> <a class="dropdown-item" href="#"><i class="fa fa-lock"></i> Logout</a> </div> </li> </ul> <button class="navbar-toggler aside-menu-toggler" type="button"> <span class="navbar-toggler-icon"></span> </button> </header> <div class="app-body"> <div class="sidebar"> <nav class="sidebar-nav"> <ul class="nav"> <li class="nav-item"> <a class="nav-link" href="index.html"><i class="icon-speedometer"></i> Dashboard <span class="badge badge-primary">NEW</span></a> </li> <li class="nav-title"> Theme </li> <li class="nav-item"> <a href="colors.html" class="nav-link"><i class="icon-drop"></i> Colors</a> </li> <li class="nav-item"> <a href="typography.html" class="nav-link"><i class="icon-pencil"></i> Typograhy</a> </li> <li class="nav-title"> Components </li> <li class="nav-item nav-dropdown"> <a class="nav-link nav-dropdown-toggle" href="#"><i class="icon-puzzle"></i> Base</a> <ul class="nav-dropdown-items"> <li class="nav-item"> <a class="nav-link" href="base-breadcrumb.html"><i class="icon-puzzle"></i> Breadcrumb</a> </li> <li class="nav-item"> <a class="nav-link" href="base-cards.html"><i class="icon-puzzle"></i> Cards</a> </li> <li class="nav-item"> <a class="nav-link" href="base-carousel.html"><i class="icon-puzzle"></i> Carousel</a> </li> <li class="nav-item"> <a class="nav-link" href="base-collapse.html"><i class="icon-puzzle"></i> Collapse</a> </li> <li class="nav-item"> <a class="nav-link" href="base-forms.html"><i class="icon-puzzle"></i> Forms</a> </li> <li class="nav-item"> <a class="nav-link" href="base-jumbotron.html"><i class="icon-puzzle"></i> Jumbotron</a> </li> <li class="nav-item"> <a class="nav-link" href="base-list-group.html"><i class="icon-puzzle"></i> List group</a> </li> <li class="nav-item"> <a class="nav-link" href="base-navs.html"><i class="icon-puzzle"></i> Navs</a> </li> <li class="nav-item"> <a class="nav-link" href="base-pagination.html"><i class="icon-puzzle"></i> Pagination</a> </li> <li class="nav-item"> <a class="nav-link" href="base-popovers.html"><i class="icon-puzzle"></i> Popovers</a> </li> <li class="nav-item"> <a class="nav-link" href="base-progress.html"><i class="icon-puzzle"></i> Progress</a> </li> <li class="nav-item"> <a class="nav-link" href="base-switches.html"><i class="icon-puzzle"></i> Switches</a> </li> <li class="nav-item"> <a class="nav-link" href="base-tables.html"><i class="icon-puzzle"></i> Tables</a> </li> <li class="nav-item"> <a class="nav-link" href="base-tabs.html"><i class="icon-puzzle"></i> Tabs</a> </li> <li class="nav-item"> <a class="nav-link" href="base-tooltips.html"><i class="icon-puzzle"></i> Tooltips</a> </li> </ul> </li> <li class="nav-item nav-dropdown"> <a class="nav-link nav-dropdown-toggle" href="#"><i class="icon-cursor"></i> Buttons</a> <ul class="nav-dropdown-items"> <li class="nav-item"> <a class="nav-link" href="buttons-buttons.html"><i class="icon-cursor"></i> Buttons</a> </li> <li class="nav-item"> <a class="nav-link" href="buttons-button-group.html"><i class="icon-cursor"></i> Buttons Group</a> </li> <li class="nav-item"> <a class="nav-link" href="buttons-dropdowns.html"><i class="icon-cursor"></i> Dropdowns</a> </li> <li class="nav-item"> <a class="nav-link" href="buttons-social-buttons.html"><i class="icon-cursor"></i> Social Buttons</a> </li> </ul> </li> <li class="nav-item"> <a class="nav-link" href="charts.html"><i class="icon-pie-chart"></i> Charts</a> </li> <li class="nav-item nav-dropdown"> <a class="nav-link nav-dropdown-toggle" href="#"><i class="icon-star"></i> Icons</a> <ul class="nav-dropdown-items"> <li class="nav-item"> <a class="nav-link" href="icons-flags.html"><i class="icon-star"></i> Flags <span class="badge badge-success">NEW</span></a> </li> <li class="nav-item"> <a class="nav-link" href="icons-font-awesome.html"><i class="icon-star"></i> Font Awesome <span class="badge badge-secondary">4.7</span></a> </li> <li class="nav-item"> <a class="nav-link" href="icons-simple-line-icons.html"><i class="icon-star"></i> Simple Line Icons</a> </li> </ul> </li> <li class="nav-item nav-dropdown"> <a class="nav-link nav-dropdown-toggle" href="#"><i class="icon-bell"></i> Notifications</a> <ul class="nav-dropdown-items"> <li class="nav-item"> <a class="nav-link" href="notifications-alerts.html"><i class="icon-bell"></i> Alerts</a> </li> <li class="nav-item"> <a class="nav-link" href="notifications-badge.html"><i class="icon-bell"></i> Badge</a> </li> <li class="nav-item"> <a class="nav-link" href="notifications-modals.html"><i class="icon-bell"></i> Modals</a> </li> </ul> </li> <li class="nav-item"> <a class="nav-link" href="widgets.html"><i class="icon-calculator"></i> Widgets <span class="badge badge-primary">NEW</span></a> </li> <li class="divider"></li> <li class="nav-title"> Extras </li> <li class="nav-item nav-dropdown"> <a class="nav-link nav-dropdown-toggle" href="#"><i class="icon-star"></i> Pages</a> <ul class="nav-dropdown-items"> <li class="nav-item"> <a class="nav-link" href="pages-login.html" target="_top"><i class="icon-star"></i> Login</a> </li> <li class="nav-item"> <a class="nav-link" href="pages-register.html" target="_top"><i class="icon-star"></i> Register</a> </li> <li class="nav-item"> <a class="nav-link" href="pages-404.html" target="_top"><i class="icon-star"></i> Error 404</a> </li> <li class="nav-item"> <a class="nav-link" href="pages-500.html" target="_top"><i class="icon-star"></i> Error 500</a> </li> </ul> </li> <li class="nav-item mt-auto"> <a class="nav-link nav-link-success" href="http://coreui.io/" target="_top"><i class="icon-cloud-download"></i> Download CoreUI</a> </li> <li class="nav-item"> <a class="nav-link nav-link-danger" href="http://coreui.io/pro/" target="_top"><i class="icon-layers"></i> Try CoreUI <strong>PRO</strong></a> </li> </ul> </nav> <button class="sidebar-minimizer brand-minimizer" type="button"></button> </div>  <main class="main">  <ol class="breadcrumb"> <li class="breadcrumb-item">Home</li> <li class="breadcrumb-item"><a href="#">Admin</a></li> <li class="breadcrumb-item active">Dashboard</li>  <li class="breadcrumb-menu d-md-down-none"> <div class="btn-group" role="group" aria-label="Button group"> <a class="btn" href="#"><i class="icon-speech"></i></a> <a class="btn" href="./"><i class="icon-graph"></i>  Dashboard</a> <a class="btn" href="#"><i class="icon-settings"></i>  Settings</a> </div> </li> </ol> <div class="container-fluid"> <div class="animated fadeIn"> <div class="card-columns"> <div class="card"> <img class="card-img-top" data-src="holder.js/100px180/?text=Image cap" alt="Image cap [100%x180]" src="data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%22318%22%20height%3D%22180%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20318%20180%22%20preserveAspectRatio%3D%22none%22%3E%3Cdefs%3E%3Cstyle%20type%3D%22text%2Fcss%22%3E%23holder_16050836ef6%20text%20%7B%20fill%3Argba(255%2C255%2C255%2C.75)%3Bfont-weight%3Anormal%3Bfont-family%3AHelvetica%2C%20monospace%3Bfont-size%3A16pt%20%7D%20%3C%2Fstyle%3E%3C%2Fdefs%3E%3Cg%20id%3D%22holder_16050836ef6%22%3E%3Crect%20width%3D%22318%22%20height%3D%22180%22%20fill%3D%22%23777%22%3E%3C%2Frect%3E%3Cg%3E%3Ctext%20x%3D%22109.140625%22%20y%3D%2297.2%22%3EImage%20cap%3C%2Ftext%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E" data-holder-rendered="true" style="height: 180px; width: 100%; display: block;"> <div class="card-body"> <h4 class="card-title">Card title</h4> <p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content. </p> <a href="#" class="btn btn-primary">Go somewhere</a> </div> </div> <div class="card"> <div class="card-body"> This is some text within a card body. </div> </div> <div class="card"> <div class="card-body"> <h4 class="card-title">Card title</h4> <h6 class="card-subtitle mb-2 text-muted">Card subtitle</h6> <p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content. </p> <a href="#" class="card-link">Card link</a> <a href="#" class="card-link">Another link</a> </div> </div> <div class="card"> <img class="card-img-top" data-src="holder.js/100px180/?text=Image cap" alt="Image cap [100%x180]" src="data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%22318%22%20height%3D%22180%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20318%20180%22%20preserveAspectRatio%3D%22none%22%3E%3Cdefs%3E%3Cstyle%20type%3D%22text%2Fcss%22%3E%23holder_16050836ef3%20text%20%7B%20fill%3Argba(255%2C255%2C255%2C.75)%3Bfont-weight%3Anormal%3Bfont-family%3AHelvetica%2C%20monospace%3Bfont-size%3A16pt%20%7D%20%3C%2Fstyle%3E%3C%2Fdefs%3E%3Cg%20id%3D%22holder_16050836ef3%22%3E%3Crect%20width%3D%22318%22%20height%3D%22180%22%20fill%3D%22%23777%22%3E%3C%2Frect%3E%3Cg%3E%3Ctext%20x%3D%22109.140625%22%20y%3D%2297.2%22%3EImage%20cap%3C%2Ftext%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E" data-holder-rendered="true" style="height: 180px; width: 100%; display: block;"> <div class="card-body"> <p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content. </p> </div> </div> <div class="card"> <ul class="list-group list-group-flush"> <li class="list-group-item">Cras justo odio</li> <li class="list-group-item">Dapibus ac facilisis in</li> <li class="list-group-item">Vestibulum at eros</li> </ul> </div> <div class="card"> <div class="card-header"> Featured </div> <ul class="list-group list-group-flush"> <li class="list-group-item">Cras justo odio</li> <li class="list-group-item">Dapibus ac facilisis in</li> <li class="list-group-item">Vestibulum at eros</li> </ul> </div> <div class="card"> <img class="card-img-top" data-src="holder.js/100px180/?text=Image cap" alt="Image cap [100%x180]" src="data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%22318%22%20height%3D%22180%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20318%20180%22%20preserveAspectRatio%3D%22none%22%3E%3Cdefs%3E%3Cstyle%20type%3D%22text%2Fcss%22%3E%23holder_16050836ef6%20text%20%7B%20fill%3Argba(255%2C255%2C255%2C.75)%3Bfont-weight%3Anormal%3Bfont-family%3AHelvetica%2C%20monospace%3Bfont-size%3A16pt%20%7D%20%3C%2Fstyle%3E%3C%2Fdefs%3E%3Cg%20id%3D%22holder_16050836ef6%22%3E%3Crect%20width%3D%22318%22%20height%3D%22180%22%20fill%3D%22%23777%22%3E%3C%2Frect%3E%3Cg%3E%3Ctext%20x%3D%22109.140625%22%20y%3D%2297.2%22%3EImage%20cap%3C%2Ftext%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E" data-holder-rendered="true" style="height: 180px; width: 100%; display: block;"> <div class="card-body"> <h4 class="card-title">Card title</h4> <p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content. </p> </div> <ul class="list-group list-group-flush"> <li class="list-group-item">Cras justo odio</li> <li class="list-group-item">Dapibus ac facilisis in</li> <li class="list-group-item">Vestibulum at eros</li> </ul> <div class="card-body"> <a href="#" class="card-link">Card link</a> <a href="#" class="card-link">Another link</a> </div> </div> <div class="card"> <div class="card-header"> Featured </div> <div class="card-body"> <h4 class="card-title">Special title treatment</h4> <p class="card-text">With supporting text below as a natural lead-in to additional content.</p> <a href="#" class="btn btn-primary">Go somewhere</a> </div> </div> <div class="card"> <h4 class="card-header">Featured</h4> <div class="card-body"> <h4 class="card-title">Special title treatment</h4> <p class="card-text">With supporting text below as a natural lead-in to additional content.</p> <a href="#" class="btn btn-primary">Go somewhere</a> </div> </div> <div class="card"> <div class="card-header"> Quote </div> <div class="card-body"> <blockquote class="blockquote mb-0"> <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.</p> <footer class="blockquote-footer">Someone famous in <cite title="Source Title">Source Title</cite> </footer> </blockquote> </div> </div> <div class="card text-center"> <div class="card-header"> Featured </div> <div class="card-body"> <h4 class="card-title">Special title treatment</h4> <p class="card-text">With supporting text below as a natural lead-in to additional content.</p> <a href="#" class="btn btn-primary">Go somewhere</a> </div> <div class="card-footer text-muted"> 2 days ago </div> </div> </div> <div class="row"> <div class="col-sm-6"> <div class="card"> <div class="card-body"> <h4 class="card-title">Special title treatment</h4> <p class="card-text">With supporting text below as a natural lead-in to additional content.</p> <a href="#" class="btn btn-primary">Go somewhere</a> </div> </div> </div> <div class="col-sm-6"> <div class="card"> <div class="card-body"> <h4 class="card-title">Special title treatment</h4> <p class="card-text">With supporting text below as a natural lead-in to additional content.</p> <a href="#" class="btn btn-primary">Go somewhere</a> </div> </div> </div> </div> <div class="row"> <div class="col"> <div class="card w-75"> <div class="card-body"> <h4 class="card-title">Card title</h4> <p class="card-text">With supporting text below as a natural lead-in to additional content.</p> <a href="#" class="btn btn-primary">Button</a> </div> </div> <div class="card w-50"> <div class="card-body"> <h4 class="card-title">Card title</h4> <p class="card-text">With supporting text below as a natural lead-in to additional content.</p> <a href="#" class="btn btn-primary">Button</a> </div> </div> </div> </div> <div class="card" style="width: 20rem;"> <div class="card-body"> <h4 class="card-title">Special title treatment</h4> <p class="card-text">With supporting text below as a natural lead-in to additional content.</p> <a href="#" class="btn btn-primary">Go somewhere</a> </div> </div> <div class="row"> <div class="col-md-4"> <div class="card"> <div class="card-body"> <h4 class="card-title">Special title treatment</h4> <p class="card-text">With supporting text below as a natural lead-in to additional content.</p> <a href="#" class="btn btn-primary">Go somewhere</a> </div> </div> </div> <div class="col-md-4"> <div class="card text-center"> <div class="card-body"> <h4 class="card-title">Special title treatment</h4> <p class="card-text">With supporting text below as a natural lead-in to additional content.</p> <a href="#" class="btn btn-primary">Go somewhere</a> </div> </div> </div> <div class="col-md-4"> <div class="card text-right"> <div class="card-body"> <h4 class="card-title">Special title treatment</h4> <p class="card-text">With supporting text below as a natural lead-in to additional content.</p> <a href="#" class="btn btn-primary">Go somewhere</a> </div> </div> </div> </div> <div class="row"> <div class="col-md-6"> <div class="card text-center"> <div class="card-header"> <ul class="nav nav-tabs card-header-tabs"> <li class="nav-item"> <a class="nav-link active" href="#">Active</a> </li> <li class="nav-item"> <a class="nav-link" href="#">Link</a> </li> <li class="nav-item"> <a class="nav-link disabled" href="#">Disabled</a> </li> </ul> </div> <div class="card-body"> <h4 class="card-title">Special title treatment</h4> <p class="card-text">With supporting text below as a natural lead-in to additional content.</p> <a href="#" class="btn btn-primary">Go somewhere</a> </div> </div> </div> <div class="col-md-6"> <div class="card text-center"> <div class="card-header"> <ul class="nav nav-pills card-header-pills"> <li class="nav-item"> <a class="nav-link active" href="#">Active</a> </li> <li class="nav-item"> <a class="nav-link" href="#">Link</a> </li> <li class="nav-item"> <a class="nav-link disabled" href="#">Disabled</a> </li> </ul> </div> <div class="card-body"> <h4 class="card-title">Special title treatment</h4> <p class="card-text">With supporting text below as a natural lead-in to additional content.</p> <a href="#" class="btn btn-primary">Go somewhere</a> </div> </div> </div> </div> <div class="row"> <div class="col-md-4"> <div class="card mb-3"> <img class="card-img-top" data-src="holder.js/100px180/" alt="100%x180" src="data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%22894%22%20height%3D%22180%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20894%20180%22%20preserveAspectRatio%3D%22none%22%3E%3Cdefs%3E%3Cstyle%20type%3D%22text%2Fcss%22%3E%23holder_16050836efb%20text%20%7B%20fill%3Argba(255%2C255%2C255%2C.75)%3Bfont-weight%3Anormal%3Bfont-family%3AHelvetica%2C%20monospace%3Bfont-size%3A45pt%20%7D%20%3C%2Fstyle%3E%3C%2Fdefs%3E%3Cg%20id%3D%22holder_16050836efb%22%3E%3Crect%20width%3D%22894%22%20height%3D%22180%22%20fill%3D%22%23777%22%3E%3C%2Frect%3E%3Cg%3E%3Ctext%20x%3D%22331.8984375%22%20y%3D%22110.15625%22%3E397x180%3C%2Ftext%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E" data-holder-rendered="true" style="height: 180px; width: 100%; display: block;"> <div class="card-body"> <h4 class="card-title">Card title</h4> <p class="card-text">This is a wider card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.</p> <p class="card-text"> <small class="text-muted">Last updated 3 mins ago</small> </p> </div> </div> </div> <div class="col-md-4"> <div class="card"> <div class="card-body"> <h4 class="card-title">Card title</h4> <p class="card-text">This is a wider card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.</p> <p class="card-text"> <small class="text-muted">Last updated 3 mins ago</small> </p> </div> <img class="card-img-bottom" data-src="holder.js/100px180/" alt="100%x180" src="data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%22894%22%20height%3D%22180%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20894%20180%22%20preserveAspectRatio%3D%22none%22%3E%3Cdefs%3E%3Cstyle%20type%3D%22text%2Fcss%22%3E%23holder_16050836f02%20text%20%7B%20fill%3Argba(255%2C255%2C255%2C.75)%3Bfont-weight%3Anormal%3Bfont-family%3AHelvetica%2C%20monospace%3Bfont-size%3A45pt%20%7D%20%3C%2Fstyle%3E%3C%2Fdefs%3E%3Cg%20id%3D%22holder_16050836f02%22%3E%3Crect%20width%3D%22894%22%20height%3D%22180%22%20fill%3D%22%23777%22%3E%3C%2Frect%3E%3Cg%3E%3Ctext%20x%3D%22331.8984375%22%20y%3D%22110.15625%22%3E397x180%3C%2Ftext%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E" data-holder-rendered="true" style="height: 180px; width: 100%; display: block;"> </div> </div> <div class="col-md-4"> <div class="card bg-dark text-white"> <img class="card-img" data-src="holder.js/100px270/#55595c:#373a3c/text:Card image" alt="100%x270" src="data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%22894%22%20height%3D%22270%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20894%20270%22%20preserveAspectRatio%3D%22none%22%3E%3Cdefs%3E%3Cstyle%20type%3D%22text%2Fcss%22%3E%23holder_16050836f05%20text%20%7B%20fill%3Argba(255%2C255%2C255%2C.75)%3Bfont-weight%3Anormal%3Bfont-family%3AHelvetica%2C%20monospace%3Bfont-size%3A45pt%20%7D%20%3C%2Fstyle%3E%3C%2Fdefs%3E%3Cg%20id%3D%22holder_16050836f05%22%3E%3Crect%20width%3D%22894%22%20height%3D%22270%22%20fill%3D%22%23777%22%3E%3C%2Frect%3E%3Cg%3E%3Ctext%20x%3D%22331.8984375%22%20y%3D%22155.15625%22%3E397x360%3C%2Ftext%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E" data-holder-rendered="true" style="height: 360px; width: 100%; display: block;"> <div class="card-img-overlay"> <h4 class="card-title">Card title</h4> <p class="card-text">This is a wider card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.</p> <p class="card-text">Last updated 3 mins ago</p> </div> </div> </div> </div> <div class="card-columns"> <div class="card text-white bg-primary mb-3"> <div class="card-header">Header</div> <div class="card-body"> <h4 class="card-title">Primary card title</h4> <p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content. </p> </div> </div> <div class="card text-white bg-secondary mb-3"> <div class="card-header">Header</div> <div class="card-body"> <h4 class="card-title">Secondary card title</h4> <p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content. </p> </div> </div> <div class="card text-white bg-success mb-3"> <div class="card-header">Header</div> <div class="card-body"> <h4 class="card-title">Success card title</h4> <p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content. </p> </div> </div> <div class="card text-white bg-danger mb-3"> <div class="card-header">Header</div> <div class="card-body"> <h4 class="card-title">Danger card title</h4> <p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content. </p> </div> </div> <div class="card text-white bg-warning mb-3"> <div class="card-header">Header</div> <div class="card-body"> <h4 class="card-title">Warning card title</h4> <p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content. </p> </div> </div> <div class="card text-white bg-info mb-3"> <div class="card-header">Header</div> <div class="card-body"> <h4 class="card-title">Info card title</h4> <p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content. </p> </div> </div> <div class="card bg-light mb-3"> <div class="card-header">Header</div> <div class="card-body"> <h4 class="card-title">Light card title</h4> <p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content. </p> </div> </div> <div class="card text-white bg-dark mb-3"> <div class="card-header">Header</div> <div class="card-body"> <h4 class="card-title">Dark card title</h4> <p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content. </p> </div> </div> <div class="card border-primary mb-3"> <div class="card-header">Header</div> <div class="card-body text-primary"> <h4 class="card-title">Primary card title</h4> <p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content. </p> </div> </div> <div class="card border-secondary mb-3"> <div class="card-header">Header</div> <div class="card-body text-secondary"> <h4 class="card-title">Secondary card title</h4> <p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content. </p> </div> </div> <div class="card border-success mb-3"> <div class="card-header">Header</div> <div class="card-body text-success"> <h4 class="card-title">Success card title</h4> <p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content. </p> </div> </div> <div class="card border-danger mb-3"> <div class="card-header">Header</div> <div class="card-body text-danger"> <h4 class="card-title">Danger card title</h4> <p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content. </p> </div> </div> <div class="card border-warning mb-3"> <div class="card-header">Header</div> <div class="card-body text-warning"> <h4 class="card-title">Warning card title</h4> <p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content. </p> </div> </div> <div class="card border-info mb-3"> <div class="card-header">Header</div> <div class="card-body text-info"> <h4 class="card-title">Info card title</h4> <p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content. </p> </div> </div> <div class="card border-light mb-3"> <div class="card-header">Header</div> <div class="card-body"> <h4 class="card-title">Light card title</h4> <p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content. </p> </div> </div> <div class="card border-dark mb-3"> <div class="card-header">Header</div> <div class="card-body text-dark"> <h4 class="card-title">Dark card title</h4> <p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content. </p> </div> </div> <div class="card border-success mb-3"> <div class="card-header bg-transparent border-success">Header</div> <div class="card-body text-success"> <h4 class="card-title">Success card title</h4> <p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content. </p> </div> <div class="card-footer bg-transparent border-success">Footer</div> </div> </div> <div class="card-group"> <div class="card"> <img class="card-img-top" data-src="holder.js/100px180/" alt="100%x180" src="data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%22297%22%20height%3D%22180%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20297%20180%22%20preserveAspectRatio%3D%22none%22%3E%3Cdefs%3E%3Cstyle%20type%3D%22text%2Fcss%22%3E%23holder_16050836f0d%20text%20%7B%20fill%3Argba(255%2C255%2C255%2C.75)%3Bfont-weight%3Anormal%3Bfont-family%3AHelvetica%2C%20monospace%3Bfont-size%3A15pt%20%7D%20%3C%2Fstyle%3E%3C%2Fdefs%3E%3Cg%20id%3D%22holder_16050836f0d%22%3E%3Crect%20width%3D%22297%22%20height%3D%22180%22%20fill%3D%22%23777%22%3E%3C%2Frect%3E%3Cg%3E%3Ctext%20x%3D%22110.1328125%22%20y%3D%2296.7171875%22%3E418x180%3C%2Ftext%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E" data-holder-rendered="true" style="height: 180px; width: 100%; display: block;"> <div class="card-body"> <h4 class="card-title">Card title</h4> <p class="card-text">This is a wider card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.</p> <p class="card-text"> <small class="text-muted">Last updated 3 mins ago</small> </p> </div> </div> <div class="card"> <img class="card-img-top" data-src="holder.js/100px180/" alt="100%x180" src="data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%22297%22%20height%3D%22180%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20297%20180%22%20preserveAspectRatio%3D%22none%22%3E%3Cdefs%3E%3Cstyle%20type%3D%22text%2Fcss%22%3E%23holder_16050836f0d%20text%20%7B%20fill%3Argba(255%2C255%2C255%2C.75)%3Bfont-weight%3Anormal%3Bfont-family%3AHelvetica%2C%20monospace%3Bfont-size%3A15pt%20%7D%20%3C%2Fstyle%3E%3C%2Fdefs%3E%3Cg%20id%3D%22holder_16050836f0d%22%3E%3Crect%20width%3D%22297%22%20height%3D%22180%22%20fill%3D%22%23777%22%3E%3C%2Frect%3E%3Cg%3E%3Ctext%20x%3D%22110.1328125%22%20y%3D%2296.7171875%22%3E418x180%3C%2Ftext%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E" data-holder-rendered="true" style="height: 180px; width: 100%; display: block;"> <div class="card-body"> <h4 class="card-title">Card title</h4> <p class="card-text">This card has supporting text below as a natural lead-in to additional content.</p> <p class="card-text"> <small class="text-muted">Last updated 3 mins ago</small> </p> </div> </div> <div class="card"> <img class="card-img-top" data-src="holder.js/100px180/" alt="100%x180" src="data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%22297%22%20height%3D%22180%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20297%20180%22%20preserveAspectRatio%3D%22none%22%3E%3Cdefs%3E%3Cstyle%20type%3D%22text%2Fcss%22%3E%23holder_16050836f0d%20text%20%7B%20fill%3Argba(255%2C255%2C255%2C.75)%3Bfont-weight%3Anormal%3Bfont-family%3AHelvetica%2C%20monospace%3Bfont-size%3A15pt%20%7D%20%3C%2Fstyle%3E%3C%2Fdefs%3E%3Cg%20id%3D%22holder_16050836f0d%22%3E%3Crect%20width%3D%22297%22%20height%3D%22180%22%20fill%3D%22%23777%22%3E%3C%2Frect%3E%3Cg%3E%3Ctext%20x%3D%22110.1328125%22%20y%3D%2296.7171875%22%3E418x180%3C%2Ftext%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E" data-holder-rendered="true" style="height: 180px; width: 100%; display: block;"> <div class="card-body"> <h4 class="card-title">Card title</h4> <p class="card-text">This is a wider card with supporting text below as a natural lead-in to additional content. This card has even longer content than the first to show that equal height action.</p> <p class="card-text"> <small class="text-muted">Last updated 3 mins ago</small> </p> </div> </div> </div> <br> <div class="card-group"> <div class="card"> <img class="card-img-top" data-src="holder.js/100px180/" alt="100%x180" src="data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%22297%22%20height%3D%22180%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20297%20180%22%20preserveAspectRatio%3D%22none%22%3E%3Cdefs%3E%3Cstyle%20type%3D%22text%2Fcss%22%3E%23holder_16050836f0d%20text%20%7B%20fill%3Argba(255%2C255%2C255%2C.75)%3Bfont-weight%3Anormal%3Bfont-family%3AHelvetica%2C%20monospace%3Bfont-size%3A15pt%20%7D%20%3C%2Fstyle%3E%3C%2Fdefs%3E%3Cg%20id%3D%22holder_16050836f0d%22%3E%3Crect%20width%3D%22297%22%20height%3D%22180%22%20fill%3D%22%23777%22%3E%3C%2Frect%3E%3Cg%3E%3Ctext%20x%3D%22110.1328125%22%20y%3D%2296.7171875%22%3E418x180%3C%2Ftext%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E" data-holder-rendered="true" style="height: 180px; width: 100%; display: block;"> <div class="card-body"> <h4 class="card-title">Card title</h4> <p class="card-text">This is a wider card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.</p> </div> <div class="card-footer"> <small class="text-muted">Last updated 3 mins ago</small> </div> </div> <div class="card"> <img class="card-img-top" data-src="holder.js/100px180/" alt="100%x180" src="data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%22297%22%20height%3D%22180%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20297%20180%22%20preserveAspectRatio%3D%22none%22%3E%3Cdefs%3E%3Cstyle%20type%3D%22text%2Fcss%22%3E%23holder_16050836f0d%20text%20%7B%20fill%3Argba(255%2C255%2C255%2C.75)%3Bfont-weight%3Anormal%3Bfont-family%3AHelvetica%2C%20monospace%3Bfont-size%3A15pt%20%7D%20%3C%2Fstyle%3E%3C%2Fdefs%3E%3Cg%20id%3D%22holder_16050836f0d%22%3E%3Crect%20width%3D%22297%22%20height%3D%22180%22%20fill%3D%22%23777%22%3E%3C%2Frect%3E%3Cg%3E%3Ctext%20x%3D%22110.1328125%22%20y%3D%2296.7171875%22%3E418x180%3C%2Ftext%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E" data-holder-rendered="true" style="height: 180px; width: 100%; display: block;"> <div class="card-body"> <h4 class="card-title">Card title</h4> <p class="card-text">This card has supporting text below as a natural lead-in to additional content.</p> </div> <div class="card-footer"> <small class="text-muted">Last updated 3 mins ago</small> </div> </div> <div class="card"> <img class="card-img-top" data-src="holder.js/100px180/" alt="100%x180" src="data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%22297%22%20height%3D%22180%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20297%20180%22%20preserveAspectRatio%3D%22none%22%3E%3Cdefs%3E%3Cstyle%20type%3D%22text%2Fcss%22%3E%23holder_16050836f0d%20text%20%7B%20fill%3Argba(255%2C255%2C255%2C.75)%3Bfont-weight%3Anormal%3Bfont-family%3AHelvetica%2C%20monospace%3Bfont-size%3A15pt%20%7D%20%3C%2Fstyle%3E%3C%2Fdefs%3E%3Cg%20id%3D%22holder_16050836f0d%22%3E%3Crect%20width%3D%22297%22%20height%3D%22180%22%20fill%3D%22%23777%22%3E%3C%2Frect%3E%3Cg%3E%3Ctext%20x%3D%22110.1328125%22%20y%3D%2296.7171875%22%3E418x180%3C%2Ftext%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E" data-holder-rendered="true" style="height: 180px; width: 100%; display: block;"> <div class="card-body"> <h4 class="card-title">Card title</h4> <p class="card-text">This is a wider card with supporting text below as a natural lead-in to additional content. This card has even longer content than the first to show that equal height action.</p> </div> <div class="card-footer"> <small class="text-muted">Last updated 3 mins ago</small> </div> </div> </div> <br> <div class="card-deck"> <div class="card"> <img class="card-img-top" data-src="holder.js/100px200/" alt="100%x200" src="data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%22277%22%20height%3D%22200%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20277%20200%22%20preserveAspectRatio%3D%22none%22%3E%3Cdefs%3E%3Cstyle%20type%3D%22text%2Fcss%22%3E%23holder_16050836f1e%20text%20%7B%20fill%3Argba(255%2C255%2C255%2C.75)%3Bfont-weight%3Anormal%3Bfont-family%3AHelvetica%2C%20monospace%3Bfont-size%3A14pt%20%7D%20%3C%2Fstyle%3E%3C%2Fdefs%3E%3Cg%20id%3D%22holder_16050836f1e%22%3E%3Crect%20width%3D%22277%22%20height%3D%22200%22%20fill%3D%22%23777%22%3E%3C%2Frect%3E%3Cg%3E%3Ctext%20x%3D%22102.6953125%22%20y%3D%22106.2390625%22%3E397x200%3C%2Ftext%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E" data-holder-rendered="true" style="height: 200px; width: 100%; display: block;"> <div class="card-body"> <h4 class="card-title">Card title</h4> <p class="card-text">This is a longer card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.</p> <p class="card-text"> <small class="text-muted">Last updated 3 mins ago</small> </p> </div> </div> <div class="card"> <img class="card-img-top" data-src="holder.js/100px200/" alt="100%x200" src="data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%22277%22%20height%3D%22200%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20277%20200%22%20preserveAspectRatio%3D%22none%22%3E%3Cdefs%3E%3Cstyle%20type%3D%22text%2Fcss%22%3E%23holder_16050836f1e%20text%20%7B%20fill%3Argba(255%2C255%2C255%2C.75)%3Bfont-weight%3Anormal%3Bfont-family%3AHelvetica%2C%20monospace%3Bfont-size%3A14pt%20%7D%20%3C%2Fstyle%3E%3C%2Fdefs%3E%3Cg%20id%3D%22holder_16050836f1e%22%3E%3Crect%20width%3D%22277%22%20height%3D%22200%22%20fill%3D%22%23777%22%3E%3C%2Frect%3E%3Cg%3E%3Ctext%20x%3D%22102.6953125%22%20y%3D%22106.2390625%22%3E397x200%3C%2Ftext%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E" data-holder-rendered="true" style="height: 200px; width: 100%; display: block;"> <div class="card-body"> <h4 class="card-title">Card title</h4> <p class="card-text">This card has supporting text below as a natural lead-in to additional content.</p> <p class="card-text"> <small class="text-muted">Last updated 3 mins ago</small> </p> </div> </div> <div class="card"> <img class="card-img-top" data-src="holder.js/100px200/" alt="100%x200" src="data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%22277%22%20height%3D%22200%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20277%20200%22%20preserveAspectRatio%3D%22none%22%3E%3Cdefs%3E%3Cstyle%20type%3D%22text%2Fcss%22%3E%23holder_16050836f1e%20text%20%7B%20fill%3Argba(255%2C255%2C255%2C.75)%3Bfont-weight%3Anormal%3Bfont-family%3AHelvetica%2C%20monospace%3Bfont-size%3A14pt%20%7D%20%3C%2Fstyle%3E%3C%2Fdefs%3E%3Cg%20id%3D%22holder_16050836f1e%22%3E%3Crect%20width%3D%22277%22%20height%3D%22200%22%20fill%3D%22%23777%22%3E%3C%2Frect%3E%3Cg%3E%3Ctext%20x%3D%22102.6953125%22%20y%3D%22106.2390625%22%3E397x200%3C%2Ftext%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E" data-holder-rendered="true" style="height: 200px; width: 100%; display: block;"> <div class="card-body"> <h4 class="card-title">Card title</h4> <p class="card-text">This is a wider card with supporting text below as a natural lead-in to additional content. This card has even longer content than the first to show that equal height action.</p> <p class="card-text"> <small class="text-muted">Last updated 3 mins ago</small> </p> </div> </div> </div> <br> <div class="card-deck"> <div class="card"> <img c