UNPKG

@digitallyhappy/backstrap

Version:

Free Bootstrap 4 Admin Panel HTML Template

711 lines (710 loc) 74.8 kB
<!DOCTYPE html> <!-- * Backstrap - Free Bootstrap Admin Template * @version v0.2.0 * @link https://backstrap.net * Copyright (c) 2018 Cristian Tabacitu * Licensed under MIT (https://coreui.io/license) --> <html lang="en"> <head> <base href="./../"> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no"> <meta name="description" content="Backstrap - Open Source Bootstrap 4 Admin Template on top of CoreUI"> <meta name="author" content="Cristian Tabacitu"> <meta name="keyword" content="Bootstrap,Admin,Template,Open,Source,jQuery,CSS,HTML,RWD,Dashboard,CoreUI"> <title>BackStrap - Free Bootstrap 4 Admin Template</title> <!-- Icons--> <link href="node_modules/@coreui/icons/css/coreui-icons.min.css" rel="stylesheet"> <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="https://maxcdn.icons8.com/fonts/line-awesome/1.1/css/line-awesome.min.css" rel="stylesheet"> <link href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,600,700,300italic,400italic,600italic" rel="stylesheet"> <!-- Main styles for this application--> <link href="css/style.css" rel="stylesheet"> <link href="vendors/pace-progress/css/pace.min.css" rel="stylesheet"> </head> <body class="app aside-menu-fixed sidebar-lg-show"> <header class="app-header bg-light border-0 navbar"> <button class="navbar-toggler sidebar-toggler d-lg-none mr-auto ml-3" type="button" data-toggle="sidebar-show"><span class="navbar-toggler-icon"></span></button><a class="navbar-brand" href="#"><b>Back</b><span>strap</span></a> <button class="navbar-toggler sidebar-toggler d-md-down-none" type="button" data-toggle="sidebar-lg-show"><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 class="img-avatar" src="img/avatars/6.jpg" 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="dropdown-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 d-md-down-none" type="button" data-toggle="aside-menu-lg-show"><span class="navbar-toggler-icon"></span></button> <button class="navbar-toggler aside-menu-toggler d-lg-none mr-3" type="button" data-toggle="aside-menu-show"><span class="navbar-toggler-icon"></span></button> </header> <div class="app-body"> <div class="sidebar sidebar-pills bg-transparent"> <nav class="sidebar-nav"> <ul class="nav"> <li class="nav-item"><a class="nav-link" href="index.html"><i class="nav-icon la la-lg la-dashboard"></i> Dashboard</a></li> <li class="nav-title">Theme</li> <li class="nav-item"><a class="nav-link" href="colors.html"><i class="nav-icon la la-lg la-bullseye"></i> Colors</a></li> <li class="nav-item"><a class="nav-link" href="typography.html"><i class="nav-icon la la-lg la-pencil"></i> Typography</a></li> <li class="nav-title">Components</li> <li class="nav-item nav-dropdown"><a class="nav-link nav-dropdown-toggle" href="#"><i class="nav-icon la la-lg la-bank"></i> Base</a> <ul class="nav-dropdown-items"> <li class="nav-item"><a class="nav-link" href="base/breadcrumb.html"><i class="nav-icon la la-lg la-puzzle"></i> Breadcrumb</a></li> <li class="nav-item"><a class="nav-link" href="base/cards.html"><i class="nav-icon la la-lg la-puzzle"></i> Cards</a></li> <li class="nav-item"><a class="nav-link" href="base/carousel.html"><i class="nav-icon la la-lg la-puzzle"></i> Carousel</a></li> <li class="nav-item"><a class="nav-link" href="base/collapse.html"><i class="nav-icon la la-lg la-puzzle"></i> Collapse</a></li> <li class="nav-item"><a class="nav-link" href="base/forms.html"><i class="nav-icon la la-lg la-puzzle"></i> Forms</a></li> <li class="nav-item"><a class="nav-link" href="base/jumbotron.html"><i class="nav-icon la la-lg la-puzzle"></i> Jumbotron</a></li> <li class="nav-item"><a class="nav-link" href="base/list-group.html"><i class="nav-icon la la-lg la-puzzle"></i> List group</a></li> <li class="nav-item"><a class="nav-link" href="base/navs.html"><i class="nav-icon la la-lg la-puzzle"></i> Navs</a></li> <li class="nav-item"><a class="nav-link" href="base/pagination.html"><i class="nav-icon la la-lg la-puzzle"></i> Pagination</a></li> <li class="nav-item"><a class="nav-link" href="base/popovers.html"><i class="nav-icon la la-lg la-puzzle"></i> Popovers</a></li> <li class="nav-item"><a class="nav-link" href="base/progress.html"><i class="nav-icon la la-lg la-puzzle"></i> Progress</a></li> <li class="nav-item"><a class="nav-link" href="base/scrollspy.html"><i class="nav-icon la la-lg la-puzzle"></i> Scrollspy</a></li> <li class="nav-item"><a class="nav-link" href="base/switches.html"><i class="nav-icon la la-lg la-puzzle"></i> Switches</a></li> <li class="nav-item"><a class="nav-link" href="base/tables.html"><i class="nav-icon la la-lg la-puzzle"></i> Tables</a></li> <li class="nav-item"><a class="nav-link" href="base/tabs.html"><i class="nav-icon la la-lg la-puzzle"></i> Tabs</a></li> <li class="nav-item"><a class="nav-link" href="base/tooltips.html"><i class="nav-icon la la-lg la-puzzle"></i> Tooltips</a></li> </ul> </li> <li class="nav-item nav-dropdown"><a class="nav-link nav-dropdown-toggle" href="#"><i class="nav-icon la la-lg la-hand-pointer-o"></i> Buttons</a> <ul class="nav-dropdown-items"> <li class="nav-item"><a class="nav-link" href="buttons/buttons.html"><i class="nav-icon la la-lg la-cursor"></i> Buttons</a></li> <li class="nav-item"><a class="nav-link" href="buttons/button-group.html"><i class="nav-icon la la-lg la-cursor"></i> Buttons Group</a></li> <li class="nav-item"><a class="nav-link" href="buttons/dropdowns.html"><i class="nav-icon la la-lg la-cursor"></i> Dropdowns</a></li> <li class="nav-item"><a class="nav-link" href="buttons/brand-buttons.html"><i class="nav-icon la la-lg la-cursor"></i> Brand Buttons</a></li> </ul> </li> <li class="nav-item"><a class="nav-link" href="charts.html"><i class="nav-icon la la-lg la-pie-chart"></i> Charts</a></li> <li class="nav-item nav-dropdown"><a class="nav-link nav-dropdown-toggle" href="#"><i class="nav-icon la la-lg la-star"></i> Icons</a> <ul class="nav-dropdown-items"> <li class="nav-item"><a class="nav-link" href="icons/line-awesome.html"> Line Awesome<span class="badge badge-primary">NEW</span></a></li> <li class="nav-item"><a class="nav-link" href="icons/coreui-icons.html"> CoreUI Icons</a></li> <li class="nav-item"><a class="nav-link" href="icons/flags.html"> Flags</a></li> <li class="nav-item"><a class="nav-link" href="icons/font-awesome.html"> Font Awesome</a></li> <li class="nav-item"><a class="nav-link" href="icons/simple-line-icons.html"> Simple Line Icons</a></li> </ul> </li> <li class="nav-item nav-dropdown"><a class="nav-link nav-dropdown-toggle" href="#"><i class="nav-icon la la-lg la-bell"></i> Notifications</a> <ul class="nav-dropdown-items"> <li class="nav-item"><a class="nav-link" href="notifications/alerts.html"><i class="nav-icon la la-lg la-bell"></i> Alerts</a></li> <li class="nav-item"><a class="nav-link" href="notifications/badge.html"><i class="nav-icon la la-lg la-bell"></i> Badge</a></li> <li class="nav-item"><a class="nav-link" href="notifications/modals.html"><i class="nav-icon la la-lg la-bell"></i> Modals</a></li> </ul> </li> <li class="nav-item"><a class="nav-link" href="widgets.html"><i class="nav-icon la la-lg la-calculator"></i> Widgets</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="nav-icon la la-lg la-file"></i> Pages</a> <ul class="nav-dropdown-items"> <li class="nav-item"><a class="nav-link" href="login.html" target="_top"><i class="nav-icon la la-lg la-star"></i> Login</a></li> <li class="nav-item"><a class="nav-link" href="register.html" target="_top"><i class="nav-icon la la-lg la-star"></i> Register</a></li> <li class="nav-item"><a class="nav-link" href="404.html" target="_top"><i class="nav-icon la la-lg la-star"></i> Error 404</a></li> <li class="nav-item"><a class="nav-link" href="500.html" target="_top"><i class="nav-icon la la-lg la-star"></i> Error 500</a></li> </ul> </li> </ul> </nav> </div> <main class="main"> <!-- Breadcrumb--> <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> <!-- Breadcrumb Menu--> <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"> <div class="card-header"><i class="fa fa-font-awesome"></i> Flags</div> <div class="card-body"> <div class="row"> <div class="col-12 mb-5">For using the flags inline with text add the classes<code>.flag-icon</code> and<code>.flag-icon-xx</code> (where xx is the ISO 3166-1-alpha-2 code of a country) to an empty span. If you want to have a squared version flag then add the class flag-icon-squared as well.</div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-ad h1" id="ad" title="ad"></i> <div>flag-icon-ad</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-ae h1" id="ae" title="ae"></i> <div>flag-icon-ae</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-af h1" id="af" title="af"></i> <div>flag-icon-af</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-ag h1" id="ag" title="ag"></i> <div>flag-icon-ag</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-ai h1" id="ai" title="ai"></i> <div>flag-icon-ai</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-al h1" id="al" title="al"></i> <div>flag-icon-al</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-am h1" id="am" title="am"></i> <div>flag-icon-am</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-ao h1" id="ao" title="ao"></i> <div>flag-icon-ao</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-aq h1" id="aq" title="aq"></i> <div>flag-icon-aq</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-ar h1" id="ar" title="ar"></i> <div>flag-icon-ar</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-as h1" id="as" title="as"></i> <div>flag-icon-as</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-at h1" id="at" title="at"></i> <div>flag-icon-at</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-au h1" id="au" title="au"></i> <div>flag-icon-au</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-aw h1" id="aw" title="aw"></i> <div>flag-icon-aw</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-ax h1" id="ax" title="ax"></i> <div>flag-icon-ax</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-az h1" id="az" title="az"></i> <div>flag-icon-az</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-ba h1" id="ba" title="ba"></i> <div>flag-icon-ba</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-bb h1" id="bb" title="bb"></i> <div>flag-icon-bb</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-bd h1" id="bd" title="bd"></i> <div>flag-icon-bd</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-be h1" id="be" title="be"></i> <div>flag-icon-be</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-bf h1" id="bf" title="bf"></i> <div>flag-icon-bf</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-bg h1" id="bg" title="bg"></i> <div>flag-icon-bg</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-bh h1" id="bh" title="bh"></i> <div>flag-icon-bh</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-bi h1" id="bi" title="bi"></i> <div>flag-icon-bi</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-bj h1" id="bj" title="bj"></i> <div>flag-icon-bj</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-bl h1" id="bl" title="bl"></i> <div>flag-icon-bl</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-bm h1" id="bm" title="bm"></i> <div>flag-icon-bm</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-bn h1" id="bn" title="bn"></i> <div>flag-icon-bn</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-bo h1" id="bo" title="bo"></i> <div>flag-icon-bo</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-bq h1" id="bq" title="bq"></i> <div>flag-icon-bq</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-br h1" id="br" title="br"></i> <div>flag-icon-br</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-bs h1" id="bs" title="bs"></i> <div>flag-icon-bs</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-bt h1" id="bt" title="bt"></i> <div>flag-icon-bt</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-bv h1" id="bv" title="bv"></i> <div>flag-icon-bv</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-bw h1" id="bw" title="bw"></i> <div>flag-icon-bw</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-by h1" id="by" title="by"></i> <div>flag-icon-by</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-bz h1" id="bz" title="bz"></i> <div>flag-icon-bz</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-ca h1" id="ca" title="ca"></i> <div>flag-icon-ca</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-cc h1" id="cc" title="cc"></i> <div>flag-icon-cc</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-cd h1" id="cd" title="cd"></i> <div>flag-icon-cd</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-cf h1" id="cf" title="cf"></i> <div>flag-icon-cf</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-cg h1" id="cg" title="cg"></i> <div>flag-icon-cg</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-ch h1" id="ch" title="ch"></i> <div>flag-icon-ch</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-ci h1" id="ci" title="ci"></i> <div>flag-icon-ci</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-ck h1" id="ck" title="ck"></i> <div>flag-icon-ck</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-cl h1" id="cl" title="cl"></i> <div>flag-icon-cl</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-cm h1" id="cm" title="cm"></i> <div>flag-icon-cm</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-cn h1" id="cn" title="cn"></i> <div>flag-icon-cn</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-co h1" id="co" title="co"></i> <div>flag-icon-co</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-cr h1" id="cr" title="cr"></i> <div>flag-icon-cr</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-cu h1" id="cu" title="cu"></i> <div>flag-icon-cu</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-cv h1" id="cv" title="cv"></i> <div>flag-icon-cv</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-cw h1" id="cw" title="cw"></i> <div>flag-icon-cw</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-cx h1" id="cx" title="cx"></i> <div>flag-icon-cx</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-cy h1" id="cy" title="cy"></i> <div>flag-icon-cy</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-cz h1" id="cz" title="cz"></i> <div>flag-icon-cz</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-de h1" id="de" title="de"></i> <div>flag-icon-de</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-dj h1" id="dj" title="dj"></i> <div>flag-icon-dj</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-dk h1" id="dk" title="dk"></i> <div>flag-icon-dk</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-dm h1" id="dm" title="dm"></i> <div>flag-icon-dm</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-do h1" id="do" title="do"></i> <div>flag-icon-do</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-dz h1" id="dz" title="dz"></i> <div>flag-icon-dz</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-ec h1" id="ec" title="ec"></i> <div>flag-icon-ec</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-ee h1" id="ee" title="ee"></i> <div>flag-icon-ee</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-eg h1" id="eg" title="eg"></i> <div>flag-icon-eg</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-eh h1" id="eh" title="eh"></i> <div>flag-icon-eh</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-er h1" id="er" title="er"></i> <div>flag-icon-er</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-es h1" id="es" title="es"></i> <div>flag-icon-es</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-et h1" id="et" title="et"></i> <div>flag-icon-et</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-fi h1" id="fi" title="fi"></i> <div>flag-icon-fi</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-fj h1" id="fj" title="fj"></i> <div>flag-icon-fj</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-fk h1" id="fk" title="fk"></i> <div>flag-icon-fk</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-fm h1" id="fm" title="fm"></i> <div>flag-icon-fm</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-fo h1" id="fo" title="fo"></i> <div>flag-icon-fo</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-fr h1" id="fr" title="fr"></i> <div>flag-icon-fr</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-ga h1" id="ga" title="ga"></i> <div>flag-icon-ga</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-gb h1" id="gb" title="gb"></i> <div>flag-icon-gb</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-gd h1" id="gd" title="gd"></i> <div>flag-icon-gd</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-ge h1" id="ge" title="ge"></i> <div>flag-icon-ge</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-gf h1" id="gf" title="gf"></i> <div>flag-icon-gf</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-gg h1" id="gg" title="gg"></i> <div>flag-icon-gg</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-gh h1" id="gh" title="gh"></i> <div>flag-icon-gh</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-gi h1" id="gi" title="gi"></i> <div>flag-icon-gi</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-gl h1" id="gl" title="gl"></i> <div>flag-icon-gl</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-gm h1" id="gm" title="gm"></i> <div>flag-icon-gm</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-gn h1" id="gn" title="gn"></i> <div>flag-icon-gn</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-gp h1" id="gp" title="gp"></i> <div>flag-icon-gp</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-gq h1" id="gq" title="gq"></i> <div>flag-icon-gq</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-gr h1" id="gr" title="gr"></i> <div>flag-icon-gr</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-gs h1" id="gs" title="gs"></i> <div>flag-icon-gs</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-gt h1" id="gt" title="gt"></i> <div>flag-icon-gt</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-gu h1" id="gu" title="gu"></i> <div>flag-icon-gu</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-gw h1" id="gw" title="gw"></i> <div>flag-icon-gw</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-gy h1" id="gy" title="gy"></i> <div>flag-icon-gy</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-hk h1" id="hk" title="hk"></i> <div>flag-icon-hk</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-hm h1" id="hm" title="hm"></i> <div>flag-icon-hm</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-hn h1" id="hn" title="hn"></i> <div>flag-icon-hn</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-hr h1" id="hr" title="hr"></i> <div>flag-icon-hr</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-ht h1" id="ht" title="ht"></i> <div>flag-icon-ht</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-hu h1" id="hu" title="hu"></i> <div>flag-icon-hu</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-id h1" id="id" title="id"></i> <div>flag-icon-id</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-ie h1" id="ie" title="ie"></i> <div>flag-icon-ie</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-il h1" id="il" title="il"></i> <div>flag-icon-il</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-im h1" id="im" title="im"></i> <div>flag-icon-im</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-in h1" id="in" title="in"></i> <div>flag-icon-in</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-io h1" id="io" title="io"></i> <div>flag-icon-io</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-iq h1" id="iq" title="iq"></i> <div>flag-icon-iq</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-ir h1" id="ir" title="ir"></i> <div>flag-icon-ir</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-is h1" id="is" title="is"></i> <div>flag-icon-is</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-it h1" id="it" title="it"></i> <div>flag-icon-it</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-je h1" id="je" title="je"></i> <div>flag-icon-je</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-jm h1" id="jm" title="jm"></i> <div>flag-icon-jm</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-jo h1" id="jo" title="jo"></i> <div>flag-icon-jo</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-jp h1" id="jp" title="jp"></i> <div>flag-icon-jp</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-ke h1" id="ke" title="ke"></i> <div>flag-icon-ke</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-kg h1" id="kg" title="kg"></i> <div>flag-icon-kg</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-kh h1" id="kh" title="kh"></i> <div>flag-icon-kh</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-ki h1" id="ki" title="ki"></i> <div>flag-icon-ki</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-km h1" id="km" title="km"></i> <div>flag-icon-km</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-kn h1" id="kn" title="kn"></i> <div>flag-icon-kn</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-kp h1" id="kp" title="kp"></i> <div>flag-icon-kp</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-kr h1" id="kr" title="kr"></i> <div>flag-icon-kr</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-kw h1" id="kw" title="kw"></i> <div>flag-icon-kw</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-ky h1" id="ky" title="ky"></i> <div>flag-icon-ky</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-kz h1" id="kz" title="kz"></i> <div>flag-icon-kz</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-la h1" id="la" title="la"></i> <div>flag-icon-la</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-lb h1" id="lb" title="lb"></i> <div>flag-icon-lb</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-lc h1" id="lc" title="lc"></i> <div>flag-icon-lc</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-li h1" id="li" title="li"></i> <div>flag-icon-li</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-lk h1" id="lk" title="lk"></i> <div>flag-icon-lk</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-lr h1" id="lr" title="lr"></i> <div>flag-icon-lr</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-ls h1" id="ls" title="ls"></i> <div>flag-icon-ls</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-lt h1" id="lt" title="lt"></i> <div>flag-icon-lt</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-lu h1" id="lu" title="lu"></i> <div>flag-icon-lu</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-lv h1" id="lv" title="lv"></i> <div>flag-icon-lv</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-ly h1" id="ly" title="ly"></i> <div>flag-icon-ly</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-ma h1" id="ma" title="ma"></i> <div>flag-icon-ma</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-mc h1" id="mc" title="mc"></i> <div>flag-icon-mc</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-md h1" id="md" title="md"></i> <div>flag-icon-md</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-me h1" id="me" title="me"></i> <div>flag-icon-me</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-mf h1" id="mf" title="mf"></i> <div>flag-icon-mf</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-mg h1" id="mg" title="mg"></i> <div>flag-icon-mg</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-mh h1" id="mh" title="mh"></i> <div>flag-icon-mh</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-mk h1" id="mk" title="mk"></i> <div>flag-icon-mk</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-ml h1" id="ml" title="ml"></i> <div>flag-icon-ml</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-mm h1" id="mm" title="mm"></i> <div>flag-icon-mm</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-mn h1" id="mn" title="mn"></i> <div>flag-icon-mn</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-mo h1" id="mo" title="mo"></i> <div>flag-icon-mo</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-mp h1" id="mp" title="mp"></i> <div>flag-icon-mp</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-mq h1" id="mq" title="mq"></i> <div>flag-icon-mq</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-mr h1" id="mr" title="mr"></i> <div>flag-icon-mr</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-ms h1" id="ms" title="ms"></i> <div>flag-icon-ms</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-mt h1" id="mt" title="mt"></i> <div>flag-icon-mt</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-mu h1" id="mu" title="mu"></i> <div>flag-icon-mu</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-mv h1" id="mv" title="mv"></i> <div>flag-icon-mv</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-mw h1" id="mw" title="mw"></i> <div>flag-icon-mw</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-mx h1" id="mx" title="mx"></i> <div>flag-icon-mx</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-my h1" id="my" title="my"></i> <div>flag-icon-my</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-mz h1" id="mz" title="mz"></i> <div>flag-icon-mz</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-na h1" id="na" title="na"></i> <div>flag-icon-na</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-nc h1" id="nc" title="nc"></i> <div>flag-icon-nc</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-ne h1" id="ne" title="ne"></i> <div>flag-icon-ne</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-nf h1" id="nf" title="nf"></i> <div>flag-icon-nf</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-ng h1" id="ng" title="ng"></i> <div>flag-icon-ng</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-ni h1" id="ni" title="ni"></i> <div>flag-icon-ni</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-nl h1" id="nl" title="nl"></i> <div>flag-icon-nl</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-no h1" id="no" title="no"></i> <div>flag-icon-no</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-np h1" id="np" title="np"></i> <div>flag-icon-np</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-nr h1" id="nr" title="nr"></i> <div>flag-icon-nr</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-nu h1" id="nu" title="nu"></i> <div>flag-icon-nu</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-nz h1" id="nz" title="nz"></i> <div>flag-icon-nz</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-om h1" id="om" title="om"></i> <div>flag-icon-om</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-pa h1" id="pa" title="pa"></i> <div>flag-icon-pa</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-pe h1" id="pe" title="pe"></i> <div>flag-icon-pe</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-pf h1" id="pf" title="pf"></i> <div>flag-icon-pf</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-pg h1" id="pg" title="pg"></i> <div>flag-icon-pg</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-ph h1" id="ph" title="ph"></i> <div>flag-icon-ph</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-pk h1" id="pk" title="pk"></i> <div>flag-icon-pk</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-pl h1" id="pl" title="pl"></i> <div>flag-icon-pl</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-pm h1" id="pm" title="pm"></i> <div>flag-icon-pm</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-pn h1" id="pn" title="pn"></i> <div>flag-icon-pn</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-pr h1" id="pr" title="pr"></i> <div>flag-icon-pr</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-ps h1" id="ps" title="ps"></i> <div>flag-icon-ps</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-pt h1" id="pt" title="pt"></i> <div>flag-icon-pt</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-pw h1" id="pw" title="pw"></i> <div>flag-icon-pw</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-py h1" id="py" title="py"></i> <div>flag-icon-py</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-qa h1" id="qa" title="qa"></i> <div>flag-icon-qa</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-re h1" id="re" title="re"></i> <div>flag-icon-re</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-ro h1" id="ro" title="ro"></i> <div>flag-icon-ro</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"><i class="flag-icon flag-icon-rs h1" id="rs" title="rs"></i> <div>flag-icon-rs</div> </div> <div class="col-sm-2 col-xs-3 text-center mb-5"