Twitch viewer

Developer
Daniel
Size
37,236 Kb
Views
4,048
  1. Twitch viewer Previews
  2. Twitch viewer HTML Codes
  3. Twitch viewer CSS Codes
  4. Twitch viewer JS Codes

How do I make an twitch viewer?

What is a twitch viewer? How do you make a twitch viewer? This script and codes were developed by Daniel on 20 January 2023, Friday.

Twitch viewer Previews
IQ Test

Twitch viewer - Script Codes HTML Codes

<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>Twitch viewer</title> <link rel='stylesheet prefetch' href='https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.0.0-alpha.6/css/bootstrap.min.css'> <link rel="stylesheet" href="css/style.css">
</head>
<body> <!DOCTYPE html>
<html lang="en">
<head> <!-- Required meta tags --> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> <!-- Bootstrap CSS --> <link rel="stylesheet" href="bootstrap4/scss/bootstrap.min.css" integrity="sha384-rwoIResjU2yc3z8GV/NPeZWAv56rSmLldC3R/AZzGRnGxQQKnKkoFVhFQhNUwEyJ" crossorigin="anonymous"> <script src="https://opensource.keycdn.com/angularjs/1.6.5/angular.min.js" integrity="sha384-vBWWzlZJ8ea9aCX4pEW3rVHjgjt7zpkNpZk+02D9phzyeVkE+jo0ieGizqPLForn" crossorigin="anonymous"></script> <script src="bootstrap4/js/app.js"></script>
</head>
<body data-spy="scroll" data-target="#basic-nav" ng-app="twitchApp"> <div class=" col-xs-12"> <nav class="navbar navbar-light navbar-inverse navbar-toggleable-md navbar-fixed bg-primary flex-column" id="basic-nav"> <button class="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse" data-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation"> <span class="navbar-toggler-icon"></span> </button> <a class="navbar-brand" href="#"> <img src="http://res.cloudinary.com/undreamtmayhem/image/upload/v1499817024/logo_c9o8zs.png" width="30" height="30" class="d-inline-block align-top" alt=""> Twitch Viewer </a> <div class="collapse navbar-collapse justify-content-center" id="navbarNav"> <ul class="navbar-nav justify-content-center"> <li class="nav-item active"> <a class="nav-link" href="#">Home<span class="sr-only">(current)</span></a> </li> <li class="nav-item"> <a class="nav-link" href="#users">Users</a> </li> <li class="nav-item"> <a class="nav-link" href="#fave-games">Favorite games</a> </li> </ul> </div> </nav> </div> <div class="container-fluid channels" id="users"> <div class="row no-gutters "> <h2 class="col align-self-start"><span class="header">Users</span></h2> <div class="dropdown"> <button class="btn btn-square dropdown-toggle" type="button" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> Sort by </button> <div class="dropdown-menu dropdown-menu-right" aria-labelledby="dropdownMenuButton"> <a class="dropdown-item" href="#" ng-click="filters.category = All">All</a> <a class="dropdown-item" href="#">Online</a> <a class="dropdown-item" href="#">Offline</a> </div> </div> </div> <!-- <div class="card-group row justify-content-center" ng-controller="ChannelController"> <div class="card m-3" style="width: 18rem;" ng-repeat="channel in channels"> <img class="card-img-top" src="{{channel.video_banner}}" alt="Card image cap"> <div class="channel-live"> <span ng-if="channel.live">Live now <div class="circle"></div></span> </div> <div class="card-block"> <div class="row align-items-start"> <div class="col"><img class="logo" src="{{channel.logo}}" alt="Channel Logo"> {{channel.channelLogo}}</div> <div class="col"> <h4 class="card-title"><a href="{{channel.url}}">{{channel.display_name}}</a></h4></div> </div> <p class="status">{{channel.status}}</p> <div class="d-flex flex-row"> <div class="p-2">Follower: {{channel.followers}}</div> <div class="p-2">Views: {{channel.views}}</div> {{channelsz}} <div class="p-2 stream-modal"><a href="#" class="follow-button btn-follow btn-square" data-toggle="modal" data-target="#exampleModal"><span>&#10084;</span> Follow</a> </div> </div> </div> </div> </div>
--> <div class="card-group row justify-content-center" id="channel" ng-controller="ChannelController"> <div class="card m-4 {{channel.onlinestatus}}" style="width: 18rem;" ng-repeat="channel in channelsModel" data-status="{{channel.onlinestatus}}"> <img class="card-img-top" ng-src="{{channel.video_banner}}" alt="Card image cap"> <div class="channel-live" ng-if="channel.onlinestatus === 'Online'"> <span>Live now <div class="circle"></div></span> </div> <div class="card-block"> <div class="row align-items-start"> <div class="col"><img class="logo" src="{{channel.logo}}" alt="Channel Logo"> {{channel.channelLogo}}</div> <div class="col"> <h4 class="card-title"><a href="{{channel.url}}">{{channel.display_name}}</a></h4></div> </div> <p class="status">{{channel.status}}</p> <div class="d-flex flex-row"> <div class="p-2">Follower: {{channel.followers}}</div> <div class="p-2">Views: {{channel.views}}</div> <div class="p-2 stream-modal" ng-if="channel.onlinestatus === 'Online'"><a href="#" class="follow-button btn-follow btn-square" data-toggle="modal" data-target="#{{channel.name}}"><span>&#127918; </span>Stream Info</a> </div> </div> </div> </div> <!-- insert more cards style="width: 18rem;"--> </div> </div> </div> <div class="container fave-game" id="fave-games"> <h2 class="text-center">Favorite Games</h2> <div class="card-group row" ng-controller="FavGameComponent"> <div class="game-card m-1" style="width: 34rem;" ng-repeat="game in games"> <img class="card-img-top" src="{{game.image}}" alt="Card image cap"> <div class="card-block"> <h5 class="card-title text-center">{{game.title}}</h5> </div> </div> </div> </div> <footer class="container-fluid"> <div class="row d-flex justify-content-center"> <p class="col-xs-9">Designed and Created by: UndreamtMayhem thanks to twitch for the API. <i>Please don't abuse there API with this site.</i></p> </div> <div class="row d-flex justify-content-center footer-logo"> <img class="img-fluid col-xs-3" src="http://res.cloudinary.com/undreamtmayhem/image/upload/v1499817026/undreamtmayhem_hjikco.png" alt="undreamtmayhem logo" style="height: 50px"> </div> </footer> <!-- insert modals--> <div class="stream" ng-controller="ChannelController"> <div ng-repeat="stream in streamModel"> <div class="modal fade" id="{{stream.stream.channel.name}}" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true"> <div class="modal-dialog" role="document"> <div class="modal-content"> <div class="modal-header p-0"> <img class="img-fluid" src="{{stream.stream.preview.large}}" alt=""> <div class="channel-live"> <span class="ng-scope">Live now <div class="circle"></div></span> </div> <button type="button" class="close modal-close" data-dismiss="modal" aria-label="Close"> <span aria-hidden="true">&times;</span> </button> </div> <div class="modal-body p-0"> <div class="player row"> <div class="m-2 col-sm-3"> <img class="stream-logo p-1" src="{{stream.stream.channel.logo}}" alt=""> </div> <div class="stream-info m-2 col"> <h3 class="stream-channel-name"><a href="#">{{stream.stream.channel.name}}</a></h3> <p class="status">{{stream.stream.channel.status}}</p> <p><span>&#127918;</span> Playing: {{stream.stream.game}}</p> <p><span>&#128065; </span>Views: {{stream.stream.viewers}}</p> <button class="btn btn-outline-info" data-dismiss="modal">Close</button> <button class="btn btn-outline-primary"><a href="{{stream.stream.channel.url}}">Watch</button> </div> </div> </div> </div> </div> </div> </div> </div> <!-- end of modal --> <!-- jQuery first, then Tether, then Bootstrap JS. --> <script src="https://code.jquery.com/jquery-3.1.1.slim.min.js" integrity="sha384-A7FZj7v+d/sdmMqp/nOQwliLvUsJfDHW+k9Omg/a/EheAdgtzNs3hpfag6Ed950n" crossorigin="anonymous"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/tether/1.4.0/js/tether.min.js" integrity="sha384-DztdAPBWPRXSA/3eYEEUWrWCy7G5KFbe8fFjk5JAIxUYHKkDx6Qin1DkWx51bBrb" crossorigin="anonymous"></script> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/js/bootstrap.min.js" integrity="sha384-vBWWzlZJ8ea9aCX4pEW3rVHjgjt7zpkNpZk+02D9phzyeVkE+jo0ieGizqPLForn" crossorigin="anonymous"></script> <script> $(document).ready(function() { $('.dropdown-item').click(function() { var filterBY = $(this).html(); if (filterBY === 'Online') { $(".Offline").each(function(index) { $(this).css('display', 'none'); }); $(".Online").each(function(index) { $(this).css('display', 'flex'); }); } else if (filterBY === 'Offline') { $(".Online").each(function(index) { $(this).css('display', 'none'); }); $(".Offline").each(function(index) { $(this).css('display', 'flex'); }); } else if (filterBY === 'All') { console.log('all selected'); $(".Offline").each(function(index) { $(this).css('display', 'flex'); }); $(".Online").each(function(index) { $(this).css('display', 'flex'); });; } }) }); </script>
</body>
</html> <script src='https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.6.5/angular.min.js'></script> <script src="js/index.js"></script>
</body>
</html>

Twitch viewer - Script Codes CSS Codes

/*! * Bootstrap v4.0.0-alpha.6 (https://getbootstrap.com) * Copyright 2011-2017 The Bootstrap Authors * Copyright 2011-2017 Twitter, Inc. * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE) */
.header { background: rgba(0, 0, 0, 0.5); color: white; padding: 0 5px; border-radius: 4%; font-size: 2.7rem;
}
.channels { padding-top: 10px; background-image: url("http://res.cloudinary.com/undreamtmayhem/image/upload/v1499896372/channel-cover_d75sn8.jpg"); background-size: cover; background-repeat: no-repeat; background-attachment: fixed;
}
.channel-live { position: absolute; top: 0; bottom: auto; color: white; right: 0px; margin-right: 10px; background-color: black; border-radius: 8%; padding: 2px; border: 1px solid white; margin-top: 5px;
}
.channel-live span { padding: 2px;
}
.circle { height: 13px; width: 13px; background-color: red; border-radius: 100%; display: inline-block;
}
.logo { height: 70px; border: 4px solid white; position: absolute; bottom: 0px; top: -40px;
}
.card-block { padding-top: 10px !important;
}
.navbar-brand { color: white !important;
}
.status { font-style: italic; word-wrap: break-word;
}
.fave-game { background-color: white;
}
.fave-game h2 { padding: 20px;
}
footer { background-color: #19171c; color: white; padding-top: 10px;
}
.stream-logo { height: 100px;
}
.stream-channel-name { display: inline-block;
}
.footer-logo { padding: 10px;
}
.img-thumbnail { height: 50px !important;
}
/*! normalize.css v5.0.0 | MIT License | github.com/necolas/normalize.css */
html { font-family: sans-serif; line-height: 1.15; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%;
}
body { margin: 0;
}
article, aside, footer, header, nav, section { display: block;
}
h1 { font-size: 2em; margin: 0.67em 0;
}
figcaption, figure, main { display: block;
}
figure { margin: 1em 40px;
}
hr { box-sizing: content-box; height: 0; overflow: visible;
}
pre { font-family: monospace, monospace; font-size: 1em;
}
a { background-color: transparent; -webkit-text-decoration-skip: objects;
}
a:active, a:hover { outline-width: 0;
}
abbr[title] { border-bottom: none; text-decoration: underline; text-decoration: underline dotted;
}
b, strong { font-weight: inherit;
}
b, strong { font-weight: bolder;
}
code, kbd, samp { font-family: monospace, monospace; font-size: 1em;
}
dfn { font-style: italic;
}
mark { background-color: #ff0; color: #000;
}
small { font-size: 80%;
}
sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline;
}
sub { bottom: -0.25em;
}
sup { top: -0.5em;
}
audio, video { display: inline-block;
}
audio:not([controls]) { display: none; height: 0;
}
img { border-style: none;
}
svg:not(:root) { overflow: hidden;
}
button, input, optgroup, select, textarea { font-family: sans-serif; font-size: 100%; line-height: 1.15; margin: 0;
}
button, input { overflow: visible;
}
button, select { text-transform: none;
}
button, html [type="button"], [type="reset"], [type="submit"] { -webkit-appearance: button;
}
button::-moz-focus-inner, [type="button"]::-moz-focus-inner, [type="reset"]::-moz-focus-inner, [type="submit"]::-moz-focus-inner { border-style: none; padding: 0;
}
button:-moz-focusring, [type="button"]:-moz-focusring, [type="reset"]:-moz-focusring, [type="submit"]:-moz-focusring { outline: 1px dotted ButtonText;
}
fieldset { border: 1px solid #c0c0c0; margin: 0 2px; padding: 0.35em 0.625em 0.75em;
}
legend { box-sizing: border-box; color: inherit; display: table; max-width: 100%; padding: 0; white-space: normal;
}
progress { display: inline-block; vertical-align: baseline;
}
textarea { overflow: auto;
}
[type="checkbox"], [type="radio"] { box-sizing: border-box; padding: 0;
}
[type="number"]::-webkit-inner-spin-button, [type="number"]::-webkit-outer-spin-button { height: auto;
}
[type="search"] { -webkit-appearance: textfield; outline-offset: -2px;
}
[type="search"]::-webkit-search-cancel-button, [type="search"]::-webkit-search-decoration { -webkit-appearance: none;
}
::-webkit-file-upload-button { -webkit-appearance: button; font: inherit;
}
details, menu { display: block;
}
summary { display: list-item;
}
canvas { display: inline-block;
}
template { display: none;
}
[hidden] { display: none;
}
@media print { *, *::before, *::after, p::first-letter, div::first-letter, blockquote::first-letter, li::first-letter, p::first-line, div::first-line, blockquote::first-line, li::first-line { text-shadow: none !important; box-shadow: none !important; } a, a:visited { text-decoration: underline; } abbr[title]::after { content: " (" attr(title) ")"; } pre { white-space: pre-wrap !important; } pre, blockquote { border: 1px solid #999; page-break-inside: avoid; } thead { display: table-header-group; } tr, img { page-break-inside: avoid; } p, h2, h3 { orphans: 3; widows: 3; } h2, h3 { page-break-after: avoid; } .navbar { display: none; } .badge { border: 1px solid #000; } .table { border-collapse: collapse !important; } .table td, .table th { background-color: #fff !important; } .table-bordered th, .table-bordered td { border: 1px solid #ddd !important; }
}
html { box-sizing: border-box;
}
*, *::before, *::after { box-sizing: inherit;
}
@-ms-viewport { width: device-width;
}
html { -ms-overflow-style: scrollbar; -webkit-tap-highlight-color: transparent;
}
body { font-family: -apple-system,system-ui,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif; font-size: 1rem; font-weight: normal; line-height: 1.5; color: #292b2c; background-color: #fff;
}
[tabindex="-1"]:focus { outline: none !important;
}
h1, h2, h3, h4, h5, h6 { margin-top: 0; margin-bottom: .5rem;
}
p { margin-top: 0; margin-bottom: 1rem;
}
abbr[title], abbr[data-original-title] { cursor: help;
}
address { margin-bottom: 1rem; font-style: normal; line-height: inherit;
}
ol, ul, dl { margin-top: 0; margin-bottom: 1rem;
}
ol ol, ul ul, ol ul, ul ol { margin-bottom: 0;
}
dt { font-weight: bold;
}
dd { margin-bottom: .5rem; margin-left: 0;
}
blockquote { margin: 0 0 1rem;
}
a { color: #6441a4; text-decoration: none;
}
a:focus, a:hover { color: #432b6d; text-decoration: underline;
}
a:not([href]):not([tabindex]) { color: inherit; text-decoration: none;
}
a:not([href]):not([tabindex]):focus, a:not([href]):not([tabindex]):hover { color: inherit; text-decoration: none;
}
a:not([href]):not([tabindex]):focus { outline: 0;
}
pre { margin-top: 0; margin-bottom: 1rem; overflow: auto;
}
figure { margin: 0 0 1rem;
}
img { vertical-align: middle;
}
[role="button"] { cursor: pointer;
}
a, area, button, [role="button"], input, label, select, summary, textarea { touch-action: manipulation;
}
table { border-collapse: collapse; background-color: transparent;
}
caption { padding-top: .75rem; padding-bottom: .75rem; color: #636c72; text-align: left; caption-side: bottom;
}
th { text-align: left;
}
label { display: inline-block; margin-bottom: .5rem;
}
button:focus { outline: 1px dotted; outline: 5px auto -webkit-focus-ring-color;
}
input, button, select, textarea { line-height: inherit;
}
input[type="radio"]:disabled, input[type="checkbox"]:disabled { cursor: not-allowed;
}
input[type="date"], input[type="time"], input[type="datetime-local"], input[type="month"] { -webkit-appearance: listbox;
}
textarea { resize: vertical;
}
fieldset { min-width: 0; padding: 0; margin: 0; border: 0;
}
legend { display: block; width: 100%; padding: 0; margin-bottom: .5rem; font-size: 1.5rem; line-height: inherit;
}
input[type="search"] { -webkit-appearance: none;
}
output { display: inline-block;
}
[hidden] { display: none !important;
}
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 { margin-bottom: .5rem; font-family: inherit; font-weight: 500; line-height: 1.1; color: inherit;
}
h1, .h1 { font-size: 2.5rem;
}
h2, .h2 { font-size: 2rem;
}
h3, .h3 { font-size: 1.75rem;
}
h4, .h4 { font-size: 1.5rem;
}
h5, .h5 { font-size: 1.25rem;
}
h6, .h6 { font-size: 1rem;
}
.lead { font-size: 1.25rem; font-weight: 300;
}
.display-1 { font-size: 6rem; font-weight: 300; line-height: 1.1;
}
.display-2 { font-size: 5.5rem; font-weight: 300; line-height: 1.1;
}
.display-3 { font-size: 4.5rem; font-weight: 300; line-height: 1.1;
}
.display-4 { font-size: 3.5rem; font-weight: 300; line-height: 1.1;
}
hr { margin-top: 1rem; margin-bottom: 1rem; border: 0; border-top: 1px solid rgba(0, 0, 0, 0.1);
}
small, .small { font-size: 80%; font-weight: normal;
}
mark, .mark { padding: .2em; background-color: #fcf8e3;
}
.list-unstyled { padding-left: 0; list-style: none;
}
.list-inline { padding-left: 0; list-style: none;
}
.list-inline-item { display: inline-block;
}
.list-inline-item:not(:last-child) { margin-right: 5px;
}
.initialism { font-size: 90%; text-transform: uppercase;
}
.blockquote { padding: .5rem 1rem; margin-bottom: 1rem; font-size: 1.25rem; border-left: .25rem solid #eceeef;
}
.blockquote-footer { display: block; font-size: 80%; color: #636c72;
}
.blockquote-footer::before { content: "\2014 \00A0";
}
.blockquote-reverse { padding-right: 1rem; padding-left: 0; text-align: right; border-right: .25rem solid #eceeef; border-left: 0;
}
.blockquote-reverse .blockquote-footer::before { content: "";
}
.blockquote-reverse .blockquote-footer::after { content: "\00A0 \2014";
}
.img-fluid { max-width: 100%; height: auto;
}
.img-thumbnail { padding: .25rem; background-color: #fff; border: 1px solid #ddd; height: 50px; border-radius: .25rem; transition: all 0.2s ease-in-out; max-width: 100%; height: auto;
}
.figure { display: inline-block;
}
.figure-img { margin-bottom: .5rem; line-height: 1;
}
.figure-caption { font-size: 90%; color: #636c72;
}
code, kbd, pre, samp { font-family: Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;
}
code { padding: .2rem .4rem; font-size: 90%; color: #bd4147; background-color: #f7f7f9; border-radius: .25rem;
}
a > code { padding: 0; color: inherit; background-color: inherit;
}
kbd { padding: .2rem .4rem; font-size: 90%; color: #fff; background-color: #292b2c; border-radius: .2rem;
}
kbd kbd { padding: 0; font-size: 100%; font-weight: bold;
}
pre { display: block; margin-top: 0; margin-bottom: 1rem; font-size: 90%; color: #292b2c;
}
pre code { padding: 0; font-size: inherit; color: inherit; background-color: transparent; border-radius: 0;
}
.pre-scrollable { max-height: 340px; overflow-y: scroll;
}
.container { position: relative; margin-left: auto; margin-right: auto; padding-right: 15px; padding-left: 15px;
}
@media (min-width: 576px) { .container { padding-right: 15px; padding-left: 15px; }
}
@media (min-width: 768px) { .container { padding-right: 15px; padding-left: 15px; }
}
@media (min-width: 992px) { .container { padding-right: 15px; padding-left: 15px; }
}
@media (min-width: 1200px) { .container { padding-right: 15px; padding-left: 15px; }
}
@media (min-width: 576px) { .container { width: 540px; max-width: 100%; }
}
@media (min-width: 768px) { .container { width: 720px; max-width: 100%; }
}
@media (min-width: 992px) { .container { width: 960px; max-width: 100%; }
}
@media (min-width: 1200px) { .container { width: 1140px; max-width: 100%; }
}
.container-fluid { position: relative; margin-left: auto; margin-right: auto; padding-right: 15px; padding-left: 15px;
}
@media (min-width: 576px) { .container-fluid { padding-right: 15px; padding-left: 15px; }
}
@media (min-width: 768px) { .container-fluid { padding-right: 15px; padding-left: 15px; }
}
@media (min-width: 992px) { .container-fluid { padding-right: 15px; padding-left: 15px; }
}
@media (min-width: 1200px) { .container-fluid { padding-right: 15px; padding-left: 15px; }
}
.row { display: flex; flex-wrap: wrap; margin-right: -15px; margin-left: -15px;
}
@media (min-width: 576px) { .row { margin-right: -15px; margin-left: -15px; }
}
@media (min-width: 768px) { .row { margin-right: -15px; margin-left: -15px; }
}
@media (min-width: 992px) { .row { margin-right: -15px; margin-left: -15px; }
}
@media (min-width: 1200px) { .row { margin-right: -15px; margin-left: -15px; }
}
.no-gutters { margin-right: 0; margin-left: 0;
}
.no-gutters > .col, .no-gutters > [class*="col-"] { padding-right: 0; padding-left: 0;
}
.col-1, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-10, .col-11, .col-12, .col, .col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm, .col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12, .col-md, .col-lg-1, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg, .col-xl-1, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-10, .col-xl-11, .col-xl-12, .col-xl { position: relative; width: 100%; min-height: 1px; padding-right: 15px; padding-left: 15px;
}
@media (min-width: 576px) { .col-1, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-10, .col-11, .col-12, .col, .col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm, .col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12, .col-md, .col-lg-1, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg, .col-xl-1, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-10, .col-xl-11, .col-xl-12, .col-xl { padding-right: 15px; padding-left: 15px; }
}
@media (min-width: 768px) { .col-1, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-10, .col-11, .col-12, .col, .col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm, .col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12, .col-md, .col-lg-1, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg, .col-xl-1, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-10, .col-xl-11, .col-xl-12, .col-xl { padding-right: 15px; padding-left: 15px; }
}
@media (min-width: 992px) { .col-1, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-10, .col-11, .col-12, .col, .col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm, .col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12, .col-md, .col-lg-1, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg, .col-xl-1, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-10, .col-xl-11, .col-xl-12, .col-xl { padding-right: 15px; padding-left: 15px; }
}
@media (min-width: 1200px) { .col-1, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-10, .col-11, .col-12, .col, .col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm, .col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12, .col-md, .col-lg-1, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg, .col-xl-1, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-10, .col-xl-11, .col-xl-12, .col-xl { padding-right: 15px; padding-left: 15px; }
}
.col { flex-basis: 0; flex-grow: 1; max-width: 100%;
}
.col-auto { flex: 0 0 auto; width: auto;
}
.col-1 { flex: 0 0 8.33333%; max-width: 8.33333%;
}
.col-2 { flex: 0 0 16.66667%; max-width: 16.66667%;
}
.col-3 { flex: 0 0 25%; max-width: 25%;
}
.col-4 { flex: 0 0 33.33333%; max-width: 33.33333%;
}
.col-5 { flex: 0 0 41.66667%; max-width: 41.66667%;
}
.col-6 { flex: 0 0 50%; max-width: 50%;
}
.col-7 { flex: 0 0 58.33333%; max-width: 58.33333%;
}
.col-8 { flex: 0 0 66.66667%; max-width: 66.66667%;
}
.col-9 { flex: 0 0 75%; max-width: 75%;
}
.col-10 { flex: 0 0 83.33333%; max-width: 83.33333%;
}
.col-11 { flex: 0 0 91.66667%; max-width: 91.66667%;
}
.col-12 { flex: 0 0 100%; max-width: 100%;
}
.pull-0 { right: auto;
}
.pull-1 { right: 8.33333%;
}
.pull-2 { right: 16.66667%;
}
.pull-3 { right: 25%;
}
.pull-4 { right: 33.33333%;
}
.pull-5 { right: 41.66667%;
}
.pull-6 { right: 50%;
}
.pull-7 { right: 58.33333%;
}
.pull-8 { right: 66.66667%;
}
.pull-9 { right: 75%;
}
.pull-10 { right: 83.33333%;
}
.pull-11 { right: 91.66667%;
}
.pull-12 { right: 100%;
}
.push-0 { left: auto;
}
.push-1 { left: 8.33333%;
}
.push-2 { left: 16.66667%;
}
.push-3 { left: 25%;
}
.push-4 { left: 33.33333%;
}
.push-5 { left: 41.66667%;
}
.push-6 { left: 50%;
}
.push-7 { left: 58.33333%;
}
.push-8 { left: 66.66667%;
}
.push-9 { left: 75%;
}
.push-10 { left: 83.33333%;
}
.push-11 { left: 91.66667%;
}
.push-12 { left: 100%;
}
.offset-1 { margin-left: 8.33333%;
}
.offset-2 { margin-left: 16.66667%;
}
.offset-3 { margin-left: 25%;
}
.offset-4 { margin-left: 33.33333%;
}
.offset-5 { margin-left: 41.66667%;
}
.offset-6 { margin-left: 50%;
}
.offset-7 { margin-left: 58.33333%;
}
.offset-8 { margin-left: 66.66667%;
}
.offset-9 { margin-left: 75%;
}
.offset-10 { margin-left: 83.33333%;
}
.offset-11 { margin-left: 91.66667%;
}
@media (min-width: 576px) { .col-sm { flex-basis: 0; flex-grow: 1; max-width: 100%; } .col-sm-auto { flex: 0 0 auto; width: auto; } .col-sm-1 { flex: 0 0 8.33333%; max-width: 8.33333%; } .col-sm-2 { flex: 0 0 16.66667%; max-width: 16.66667%; } .col-sm-3 { flex: 0 0 25%; max-width: 25%; } .col-sm-4 { flex: 0 0 33.33333%; max-width: 33.33333%; } .col-sm-5 { flex: 0 0 41.66667%; max-width: 41.66667%; } .col-sm-6 { flex: 0 0 50%; max-width: 50%; } .col-sm-7 { flex: 0 0 58.33333%; max-width: 58.33333%; } .col-sm-8 { flex: 0 0 66.66667%; max-width: 66.66667%; } .col-sm-9 { flex: 0 0 75%; max-width: 75%; } .col-sm-10 { flex: 0 0 83.33333%; max-width: 83.33333%; } .col-sm-11 { flex: 0 0 91.66667%; max-width: 91.66667%; } .col-sm-12 { flex: 0 0 100%; max-width: 100%; } .pull-sm-0 { right: auto; } .pull-sm-1 { right: 8.33333%; } .pull-sm-2 { right: 16.66667%; } .pull-sm-3 { right: 25%; } .pull-sm-4 { right: 33.33333%; } .pull-sm-5 { right: 41.66667%; } .pull-sm-6 { right: 50%; } .pull-sm-7 { right: 58.33333%; } .pull-sm-8 { right: 66.66667%; } .pull-sm-9 { right: 75%; } .pull-sm-10 { right: 83.33333%; } .pull-sm-11 { right: 91.66667%; } .pull-sm-12 { right: 100%; } .push-sm-0 { left: auto; } .push-sm-1 { left: 8.33333%; } .push-sm-2 { left: 16.66667%; } .push-sm-3 { left: 25%; } .push-sm-4 { left: 33.33333%; } .push-sm-5 { left: 41.66667%; } .push-sm-6 { left: 50%; } .push-sm-7 { left: 58.33333%; } .push-sm-8 { left: 66.66667%; } .push-sm-9 { left: 75%; } .push-sm-10 { left: 83.33333%; } .push-sm-11 { left: 91.66667%; } .push-sm-12 { left: 100%; } .offset-sm-0 { margin-left: 0%; } .offset-sm-1 { margin-left: 8.33333%; } .offset-sm-2 { margin-left: 16.66667%; } .offset-sm-3 { margin-left: 25%; } .offset-sm-4 { margin-left: 33.33333%; } .offset-sm-5 { margin-left: 41.66667%; } .offset-sm-6 { margin-left: 50%; } .offset-sm-7 { margin-left: 58.33333%; } .offset-sm-8 { margin-left: 66.66667%; } .offset-sm-9 { margin-left: 75%; } .offset-sm-10 { margin-left: 83.33333%; } .offset-sm-11 { margin-left: 91.66667%; }
}
@media (min-width: 768px) { .col-md { flex-basis: 0; flex-grow: 1; max-width: 100%; } .col-md-auto { flex: 0 0 auto; width: auto; } .col-md-1 { flex: 0 0 8.33333%; max-width: 8.33333%; } .col-md-2 { flex: 0 0 16.66667%; max-width: 16.66667%; } .col-md-3 { flex: 0 0 25%; max-width: 25%; } .col-md-4 { flex: 0 0 33.33333%; max-width: 33.33333%; } .col-md-5 { flex: 0 0 41.66667%; max-width: 41.66667%; } .col-md-6 { flex: 0 0 50%; max-width: 50%; } .col-md-7 { flex: 0 0 58.33333%; max-width: 58.33333%; } .col-md-8 { flex: 0 0 66.66667%; max-width: 66.66667%; } .col-md-9 { flex: 0 0 75%; max-width: 75%; } .col-md-10 { flex: 0 0 83.33333%; max-width: 83.33333%; } .col-md-11 { flex: 0 0 91.66667%; max-width: 91.66667%; } .col-md-12 { flex: 0 0 100%; max-width: 100%; } .pull-md-0 { right: auto; } .pull-md-1 { right: 8.33333%; } .pull-md-2 { right: 16.66667%; } .pull-md-3 { right: 25%; } .pull-md-4 { right: 33.33333%; } .pull-md-5 { right: 41.66667%; } .pull-md-6 { right: 50%; } .pull-md-7 { right: 58.33333%; } .pull-md-8 { right: 66.66667%; } .pull-md-9 { right: 75%; } .pull-md-10 { right: 83.33333%; } .pull-md-11 { right: 91.66667%; } .pull-md-12 { right: 100%; } .push-md-0 { left: auto; } .push-md-1 { left: 8.33333%; } .push-md-2 { left: 16.66667%; } .push-md-3 { left: 25%; } .push-md-4 { left: 33.33333%; } .push-md-5 { left: 41.66667%; } .push-md-6 { left: 50%; } .push-md-7 { left: 58.33333%; } .push-md-8 { left: 66.66667%; } .push-md-9 { left: 75%; } .push-md-10 { left: 83.33333%; } .push-md-11 { left: 91.66667%; } .push-md-12 { left: 100%; } .offset-md-0 { margin-left: 0%; } .offset-md-1 { margin-left: 8.33333%; } .offset-md-2 { margin-left: 16.66667%; } .offset-md-3 { margin-left: 25%; } .offset-md-4 { margin-left: 33.33333%; } .offset-md-5 { margin-left: 41.66667%; } .offset-md-6 { margin-left: 50%; } .offset-md-7 { margin-left: 58.33333%; } .offset-md-8 { margin-left: 66.66667%; } .offset-md-9 { margin-left: 75%; } .offset-md-10 { margin-left: 83.33333%; } .offset-md-11 { margin-left: 91.66667%; }
}
@media (min-width: 992px) { .col-lg { flex-basis: 0; flex-grow: 1; max-width: 100%; } .col-lg-auto { flex: 0 0 auto; width: auto; } .col-lg-1 { flex: 0 0 8.33333%; max-width: 8.33333%; } .col-lg-2 { flex: 0 0 16.66667%; max-width: 16.66667%; } .col-lg-3 { flex: 0 0 25%; max-width: 25%; } .col-lg-4 { flex: 0 0 33.33333%; max-width: 33.33333%; } .col-lg-5 { flex: 0 0 41.66667%; max-width: 41.66667%; } .col-lg-6 { flex: 0 0 50%; max-width: 50%; } .col-lg-7 { flex: 0 0 58.33333%; max-width: 58.33333%; } .col-lg-8 { flex: 0 0 66.66667%; max-width: 66.66667%; } .col-lg-9 { flex: 0 0 75%; max-width: 75%; } .col-lg-10 { flex: 0 0 83.33333%; max-width: 83.33333%; } .col-lg-11 { flex: 0 0 91.66667%; max-width: 91.66667%; } .col-lg-12 { flex: 0 0 100%; max-width: 100%; } .pull-lg-0 { right: auto; } .pull-lg-1 { right: 8.33333%; } .pull-lg-2 { right: 16.66667%; } .pull-lg-3 { right: 25%; } .pull-lg-4 { right: 33.33333%; } .pull-lg-5 { right: 41.66667%; } .pull-lg-6 { right: 50%; } .pull-lg-7 { right: 58.33333%; } .pull-lg-8 { right: 66.66667%; } .pull-lg-9 { right: 75%; } .pull-lg-10 { right: 83.33333%; } .pull-lg-11 { right: 91.66667%; } .pull-lg-12 { right: 100%; } .push-lg-0 { left: auto; } .push-lg-1 { left: 8.33333%; } .push-lg-2 { left: 16.66667%; } .push-lg-3 { left: 25%; } .push-lg-4 { left: 33.33333%; } .push-lg-5 { left: 41.66667%; } .push-lg-6 { left: 50%; } .push-lg-7 { left: 58.33333%; } .push-lg-8 { left: 66.66667%; } .push-lg-9 { left: 75%; } .push-lg-10 { left: 83.33333%; } .push-lg-11 { left: 91.66667%; } .push-lg-12 { left: 100%; } .offset-lg-0 { margin-left: 0%; } .offset-lg-1 { margin-left: 8.33333%; } .offset-lg-2 { margin-left: 16.66667%; } .offset-lg-3 { margin-left: 25%; } .offset-lg-4 { margin-left: 33.33333%; } .offset-lg-5 { margin-left: 41.66667%; } .offset-lg-6 { margin-left: 50%; } .offset-lg-7 { margin-left: 58.33333%; } .offset-lg-8 { margin-left: 66.66667%; } .offset-lg-9 { margin-left: 75%; } .offset-lg-10 { margin-left: 83.33333%; } .offset-lg-11 { margin-left: 91.66667%; }
}
@media (min-width: 1200px) { .col-xl { flex-basis: 0; flex-grow: 1; max-width: 100%; } .col-xl-auto { flex: 0 0 auto; width: auto; } .col-xl-1 { flex: 0 0 8.33333%; max-width: 8.33333%; } .col-xl-2 { flex: 0 0 16.66667%; max-width: 16.66667%; } .col-xl-3 { flex: 0 0 25%; max-width: 25%; } .col-xl-4 { flex: 0 0 33.33333%; max-width: 33.33333%; } .col-xl-5 { flex: 0 0 41.66667%; max-width: 41.66667%; } .col-xl-6 { flex: 0 0 50%; max-width: 50%; } .col-xl-7 { flex: 0 0 58.33333%; max-width: 58.33333%; } .col-xl-8 { flex: 0 0 66.66667%; max-width: 66.66667%; } .col-xl-9 { flex: 0 0 75%; max-width: 75%; } .col-xl-10 { flex: 0 0 83.33333%; max-width: 83.33333%; } .col-xl-11 { flex: 0 0 91.66667%; max-width: 91.66667%; } .col-xl-12 { flex: 0 0 100%; max-width: 100%; } .pull-xl-0 { right: auto; } .pull-xl-1 { right: 8.33333%; } .pull-xl-2 { right: 16.66667%; } .pull-xl-3 { right: 25%; } .pull-xl-4 { right: 33.33333%; } .pull-xl-5 { right: 41.66667%; } .pull-xl-6 { right: 50%; } .pull-xl-7 { right: 58.33333%; } .pull-xl-8 { right: 66.66667%; } .pull-xl-9 { right: 75%; } .pull-xl-10 { right: 83.33333%; } .pull-xl-11 { right: 91.66667%; } .pull-xl-12 { right: 100%; } .push-xl-0 { left: auto; } .push-xl-1 { left: 8.33333%; } .push-xl-2 { left: 16.66667%; } .push-xl-3 { left: 25%; } .push-xl-4 { left: 33.33333%; } .push-xl-5 { left: 41.66667%; } .push-xl-6 { left: 50%; } .push-xl-7 { left: 58.33333%; } .push-xl-8 { left: 66.66667%; } .push-xl-9 { left: 75%; } .push-xl-10 { left: 83.33333%; } .push-xl-11 { left: 91.66667%; } .push-xl-12 { left: 100%; } .offset-xl-0 { margin-left: 0%; } .offset-xl-1 { margin-left: 8.33333%; } .offset-xl-2 { margin-left: 16.66667%; } .offset-xl-3 { margin-left: 25%; } .offset-xl-4 { margin-left: 33.33333%; } .offset-xl-5 { margin-left: 41.66667%; } .offset-xl-6 { margin-left: 50%; } .offset-xl-7 { margin-left: 58.33333%; } .offset-xl-8 { margin-left: 66.66667%; } .offset-xl-9 { margin-left: 75%; } .offset-xl-10 { margin-left: 83.33333%; } .offset-xl-11 { margin-left: 91.66667%; }
}
.table { width: 100%; max-width: 100%; margin-bottom: 1rem;
}
.table th, .table td { padding: .75rem; vertical-align: top; border-top: 1px solid #eceeef;
}
.table thead th { vertical-align: bottom; border-bottom: 2px solid #eceeef;
}
.table tbody + tbody { border-top: 2px solid #eceeef;
}
.table .table { background-color: #fff;
}
.table-sm th, .table-sm td { padding: .3rem;
}
.table-bordered { border: 1px solid #eceeef;
}
.table-bordered th, .table-bordered td { border: 1px solid #eceeef;
}
.table-bordered thead th, .table-bordered thead td { border-bottom-width: 2px;
}
.table-striped tbody tr:nth-of-type(odd) { background-color: rgba(0, 0, 0, 0.05);
}
.table-hover tbody tr:hover { background-color: rgba(0, 0, 0, 0.075);
}
.table-active, .table-active > th, .table-active > td { background-color: rgba(0, 0, 0, 0.075);
}
.table-hover .table-active:hover { background-color: rgba(0, 0, 0, 0.075);
}
.table-hover .table-active:hover > td, .table-hover .table-active:hover > th { background-color: rgba(0, 0, 0, 0.075);
}
.table-success, .table-success > th, .table-success > td { background-color: #dff0d8;
}
.table-hover .table-success:hover { background-color: #d0e9c6;
}
.table-hover .table-success:hover > td, .table-hover .table-success:hover > th { background-color: #d0e9c6;
}
.table-info, .table-info > th, .table-info > td { background-color: #d9edf7;
}
.table-hover .table-info:hover { background-color: #c4e3f3;
}
.table-hover .table-info:hover > td, .table-hover .table-info:hover > th { background-color: #c4e3f3;
}
.table-warning, .table-warning > th, .table-warning > td { background-color: #fcf8e3;
}
.table-hover .table-warning:hover { background-color: #faf2cc;
}
.table-hover .table-warning:hover > td, .table-hover .table-warning:hover > th { background-color: #faf2cc;
}
.table-danger, .table-danger > th, .table-danger > td { background-color: #f2dede;
}
.table-hover .table-danger:hover { background-color: #ebcccc;
}
.table-hover .table-danger:hover > td, .table-hover .table-danger:hover > th { background-color: #ebcccc;
}
.thead-inverse th { color: #fff; background-color: #292b2c;
}
.thead-default th { color: #464a4c; background-color: #eceeef;
}
.table-inverse { color: #fff; background-color: #292b2c;
}
.table-inverse th, .table-inverse td, .table-inverse thead th { border-color: #fff;
}
.table-inverse.table-bordered { border: 0;
}
.table-responsive { display: block; width: 100%; overflow-x: auto; -ms-overflow-style: -ms-autohiding-scrollbar;
}
.table-responsive.table-bordered { border: 0;
}
.form-control { display: block; width: 100%; padding: .5rem .75rem; font-size: 1rem; line-height: 1.25; color: #464a4c; background-color: #fff; background-image: none; background-clip: padding-box; border: 1px solid rgba(0, 0, 0, 0.15); border-radius: .25rem; transition: border-color ease-in-out 0.15s,box-shadow ease-in-out 0.15s;
}
.form-control::-ms-expand { background-color: transparent; border: 0;
}
.form-control:focus { color: #464a4c; background-color: #fff; border-color: #a991d3; outline: none;
}
.form-control::placeholder { color: #636c72; opacity: 1;
}
.form-control:disabled, .form-control[readonly] { background-color: #eceeef; opacity: 1;
}
.form-control:disabled { cursor: not-allowed;
}
select.form-control:not([size]):not([multiple]) { height: calc(2.25rem + 2px);
}
select.form-control:focus::-ms-value { color: #464a4c; background-color: #fff;
}
.form-control-file, .form-control-range { display: block;
}
.col-form-label { padding-top: calc(.5rem - 1px * 2); padding-bottom: calc(.5rem - 1px * 2); margin-bottom: 0;
}
.col-form-label-lg { padding-top: calc(.75rem - 1px * 2); padding-bottom: calc(.75rem - 1px * 2); font-size: 1.25rem;
}
.col-form-label-sm { padding-top: calc(.25rem - 1px * 2); padding-bottom: calc(.25rem - 1px * 2); font-size: .875rem;
}
.col-form-legend { padding-top: .5rem; padding-bottom: .5rem; margin-bottom: 0; font-size: 1rem;
}
.form-control-static { padding-top: .5rem; padding-bottom: .5rem; margin-bottom: 0; line-height: 1.25; border: solid transparent; border-width: 1px 0;
}
.form-control-static.form-control-sm, .form-control-static.form-control-lg { padding-right: 0; padding-left: 0;
}
.form-control-sm { padding: .25rem .5rem; font-size: .875rem; border-radius: .2rem;
}
select.form-control-sm:not([size]):not([multiple]) { height: 1.8125rem;
}
.form-control-lg { padding: .75rem 1.5rem; font-size: 1.25rem; border-radius: .3rem;
}
select.form-control-lg:not([size]):not([multiple]) { height: 3.16667rem;
}
.form-group { margin-bottom: 1rem;
}
.form-text { display: block; margin-top: .25rem;
}
.form-check { position: relative; display: block; margin-bottom: .5rem;
}
.form-check.disabled .form-check-label { color: #636c72; cursor: not-allowed;
}
.form-check-label { padding-left: 1.25rem; margin-bottom: 0; cursor: pointer;
}
.form-check-input { position: absolute; margin-top: .25rem; margin-left: -1.25rem;
}
.form-check-input:only-child { position: static;
}
.form-check-inline { display: inline-block;
}
.form-check-inline .form-check-label { vertical-align: middle;
}
.form-check-inline + .form-check-inline { margin-left: .75rem;
}
.form-control-feedback { margin-top: .25rem;
}
.form-control-success, .form-control-warning, .form-control-danger { padding-right: 2.25rem; background-repeat: no-repeat; background-position: center right .5625rem; background-size: 1.125rem 1.125rem;
}
.has-success .form-control-feedback, .has-success .form-control-label, .has-success .col-form-label, .has-success .form-check-label, .has-success .custom-control { color: #5cb85c;
}
.has-success .form-control { border-color: #5cb85c;
}
.has-success .input-group-addon { color: #5cb85c; border-color: #5cb85c; background-color: #eaf6ea;
}
.has-success .form-control-success { background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%235cb85c' d='M2.3 6.73L.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3E%3C/svg%3E");
}
.has-warning .form-control-feedback, .has-warning .form-control-label, .has-warning .col-form-label, .has-warning .form-check-label, .has-warning .custom-control { color: #f0ad4e;
}
.has-warning .form-control { border-color: #f0ad4e;
}
.has-warning .input-group-addon { color: #f0ad4e; border-color: #f0ad4e; background-color: #fff;
}
.has-warning .form-control-warning { background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%23f0ad4e' d='M4.4 5.324h-.8v-2.46h.8zm0 1.42h-.8V5.89h.8zM3.76.63L.04 7.075c-.115.2.016.425.26.426h7.397c.242 0 .372-.226.258-.426C6.726 4.924 5.47 2.79 4.253.63c-.113-.174-.39-.174-.494 0z'/%3E%3C/svg%3E");
}
.has-danger .form-control-feedback, .has-danger .form-control-label, .has-danger .col-form-label, .has-danger .form-check-label, .has-danger .custom-control { color: #d9534f;
}
.has-danger .form-control { border-color: #d9534f;
}
.has-danger .input-group-addon { color: #d9534f; border-color: #d9534f; background-color: #fdf7f7;
}
.has-danger .form-control-danger { background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23d9534f' viewBox='-2 -2 7 7'%3E%3Cpath stroke='%23d9534f' d='M0 0l3 3m0-3L0 3'/%3E%3Ccircle r='.5'/%3E%3Ccircle cx='3' r='.5'/%3E%3Ccircle cy='3' r='.5'/%3E%3Ccircle cx='3' cy='3' r='.5'/%3E%3C/svg%3E");
}
.form-inline { display: flex; flex-flow: row wrap; align-items: center;
}
.form-inline .form-check { width: 100%;
}
@media (min-width: 576px) { .form-inline label { display: flex; align-items: center; justify-content: center; margin-bottom: 0; } .form-inline .form-group { display: flex; flex: 0 0 auto; flex-flow: row wrap; align-items: center; margin-bottom: 0; } .form-inline .form-control { display: inline-block; width: auto; vertical-align: middle; } .form-inline .form-control-static { display: inline-block; } .form-inline .input-group { width: auto; } .form-inline .form-control-label { margin-bottom: 0; vertical-align: middle; } .form-inline .form-check { display: flex; align-items: center; justify-content: center; width: auto; margin-top: 0; margin-bottom: 0; } .form-inline .form-check-label { padding-left: 0; } .form-inline .form-check-input { position: relative; margin-top: 0; margin-right: .25rem; margin-left: 0; } .form-inline .custom-control { display: flex; align-items: center; justify-content: center; padding-left: 0; } .form-inline .custom-control-indicator { position: static; display: inline-block; margin-right: .25rem; vertical-align: text-bottom; } .form-inline .has-feedback .form-control-feedback { top: 0; }
}
.btn, .follow-button { display: inline-block; font-weight: normal; line-height: 1.25; text-align: center; white-space: nowrap; vertical-align: middle; user-select: none; padding: .5rem 1rem; font-size: 1rem; border-radius: .25rem; transition: all 0.2s ease-in-out;
}
.btn:focus, .follow-button:focus, .btn:hover, .follow-button:hover { text-decoration: none;
}
.btn:focus, .follow-button:focus, .btn.focus, .focus.follow-button { outline: 0; box-shadow: 0 0 0 2px rgba(100, 65, 164, 0.25);
}
.btn.disabled, .disabled.follow-button, .btn:disabled, .follow-button:disabled { cursor: not-allowed; opacity: .65;
}
.btn:active, .follow-button:active, .btn.active, .active.follow-button { background-image: none;
}
a.btn.disabled, a.disabled.follow-button, fieldset[disabled] a.btn, fieldset[disabled] a.follow-button { pointer-events: none;
}
.btn-primary { color: #fff; background-color: #6441a4; border-color: #6441a4;
}
.btn-primary:hover { color: #fff; background-color: #4e337f; border-color: #493078;
}
.btn-primary:focus, .btn-primary.focus { box-shadow: 0 0 0 2px rgba(100, 65, 164, 0.5);
}
.btn-primary.disabled, .btn-primary:disabled { background-color: #6441a4; border-color: #6441a4;
}
.btn-primary:active, .btn-primary.active, .show > .btn-primary.dropdown-toggle { color: #fff; background-color: #4e337f; background-image: none; border-color: #493078;
}
.btn-secondary { color: #292b2c; background-color: #fff; border-color: #ccc;
}
.btn-secondary:hover { color: #292b2c; background-color: #e6e6e6; border-color: #adadad;
}
.btn-secondary:focus, .btn-secondary.focus { box-shadow: 0 0 0 2px rgba(204, 204, 204, 0.5);
}
.btn-secondary.disabled, .btn-secondary:disabled { background-color: #fff; border-color: #ccc;
}
.btn-secondary:active, .btn-secondary.active, .show > .btn-secondary.dropdown-toggle { color: #292b2c; background-color: #e6e6e6; background-image: none; border-color: #adadad;
}
.btn-info { color: #fff; background-color: #5bc0de; border-color: #5bc0de;
}
.btn-info:hover { color: #fff; background-color: #31b0d5; border-color: #2aabd2;
}
.btn-info:focus, .btn-info.focus { box-shadow: 0 0 0 2px rgba(91, 192, 222, 0.5);
}
.btn-info.disabled, .btn-info:disabled { background-color: #5bc0de; border-color: #5bc0de;
}
.btn-info:active, .btn-info.active, .show > .btn-info.dropdown-toggle { color: #fff; background-color: #31b0d5; background-image: none; border-color: #2aabd2;
}
.btn-success { color: #fff; background-color: #5cb85c; border-color: #5cb85c;
}
.btn-success:hover { color: #fff; background-color: #449d44; border-color: #419641;
}
.btn-success:focus, .btn-success.focus { box-shadow: 0 0 0 2px rgba(92, 184, 92, 0.5);
}
.btn-success.disabled, .btn-success:disabled { background-color: #5cb85c; border-color: #5cb85c;
}
.btn-success:active, .btn-success.active, .show > .btn-success.dropdown-toggle { color: #fff; background-color: #449d44; background-image: none; border-color: #419641;
}
.btn-warning { color: #fff; background-color: #f0ad4e; border-color: #f0ad4e;
}
.btn-warning:hover { color: #fff; background-color: #ec971f; border-color: #eb9316;
}
.btn-warning:focus, .btn-warning.focus { box-shadow: 0 0 0 2px rgba(240, 173, 78, 0.5);
}
.btn-warning.disabled, .btn-warning:disabled { background-color: #f0ad4e; border-color: #f0ad4e;
}
.btn-warning:active, .btn-warning.active, .show > .btn-warning.dropdown-toggle { color: #fff; background-color: #ec971f; background-image: none; border-color: #eb9316;
}
.btn-danger { color: #fff; background-color: #d9534f; border-color: #d9534f;
}
.btn-danger:hover { color: #fff; background-color: #c9302c; border-color: #c12e2a;
}
.btn-danger:focus, .btn-danger.focus { box-shadow: 0 0 0 2px rgba(217, 83, 79, 0.5);
}
.btn-danger.disabled, .btn-danger:disabled { background-color: #d9534f; border-color: #d9534f;
}
.btn-danger:active, .btn-danger.active, .show > .btn-danger.dropdown-toggle { color: #fff; background-color: #c9302c; background-image: none; border-color: #c12e2a;
}
.btn-follow { color: #fff; background-color: #6441a4; border-color: #fff;
}
.btn-follow:hover { color: #fff; background-color: #4e337f; border-color: #e0e0e0;
}
.btn-follow:focus, .btn-follow.focus { box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.5);
}
.btn-follow.disabled, .btn-follow:disabled { background-color: #6441a4; border-color: #fff;
}
.btn-follow:active, .btn-follow.active, .show > .btn-follow.dropdown-toggle { color: #fff; background-color: #4e337f; background-image: none; border-color: #e0e0e0;
}
.btn-outline-primary { color: #6441a4; background-image: none; background-color: transparent; border-color: #6441a4;
}
.btn-outline-primary:hover { color: #fff; background-color: #6441a4; border-color: #6441a4;
}
.btn-outline-primary:focus, .btn-outline-primary.focus { box-shadow: 0 0 0 2px rgba(100, 65, 164, 0.5);
}
.btn-outline-primary.disabled, .btn-outline-primary:disabled { color: #6441a4; background-color: transparent;
}
.btn-outline-primary:active, .btn-outline-primary.active, .show > .btn-outline-primary.dropdown-toggle { color: #fff; background-color: #6441a4; border-color: #6441a4;
}
.btn-outline-secondary { color: #ccc; background-image: none; background-color: transparent; border-color: #ccc;
}
.btn-outline-secondary:hover { color: #fff; background-color: #ccc; border-color: #ccc;
}
.btn-outline-secondary:focus, .btn-outline-secondary.focus { box-shadow: 0 0 0 2px rgba(204, 204, 204, 0.5);
}
.btn-outline-secondary.disabled, .btn-outline-secondary:disabled { color: #ccc; background-color: transparent;
}
.btn-outline-secondary:active, .btn-outline-secondary.active, .show > .btn-outline-secondary.dropdown-toggle { color: #fff; background-color: #ccc; border-color: #ccc;
}
.btn-outline-info { color: #5bc0de; background-image: none; background-color: transparent; border-color: #5bc0de;
}
.btn-outline-info:hover { color: #fff; background-color: #5bc0de; border-color: #5bc0de;
}
.btn-outline-info:focus, .btn-outline-info.focus { box-shadow: 0 0 0 2px rgba(91, 192, 222, 0.5);
}
.btn-outline-info.disabled, .btn-outline-info:disabled { color: #5bc0de; background-color: transparent;
}
.btn-outline-info:active, .btn-outline-info.active, .show > .btn-outline-info.dropdown-toggle { color: #fff; background-color: #5bc0de; border-color: #5bc0de;
}
.btn-outline-success { color: #5cb85c; background-image: none; background-color: transparent; border-color: #5cb85c;
}
.btn-outline-success:hover { color: #fff; background-color: #5cb85c; border-color: #5cb85c;
}
.btn-outline-success:focus, .btn-outline-success.focus { box-shadow: 0 0 0 2px rgba(92, 184, 92, 0.5);
}
.btn-outline-success.disabled, .btn-outline-success:disabled { color: #5cb85c; background-color: transparent;
}
.btn-outline-success:active, .btn-outline-success.active, .show > .btn-outline-success.dropdown-toggle { color: #fff; background-color: #5cb85c; border-color: #5cb85c;
}
.btn-outline-warning { color: #f0ad4e; background-image: none; background-color: transparent; border-color: #f0ad4e;
}
.btn-outline-warning:hover { color: #fff; background-color: #f0ad4e; border-color: #f0ad4e;
}
.btn-outline-warning:focus, .btn-outline-warning.focus { box-shadow: 0 0 0 2px rgba(240, 173, 78, 0.5);
}
.btn-outline-warning.disabled, .btn-outline-warning:disabled { color: #f0ad4e; background-color: transparent;
}
.btn-outline-warning:active, .btn-outline-warning.active, .show > .btn-outline-warning.dropdown-toggle { color: #fff; background-color: #f0ad4e; border-color: #f0ad4e;
}
.btn-outline-danger { color: #d9534f; background-image: none; background-color: transparent; border-color: #d9534f;
}
.btn-outline-danger:hover { color: #fff; background-color: #d9534f; border-color: #d9534f;
}
.btn-outline-danger:focus, .btn-outline-danger.focus { box-shadow: 0 0 0 2px rgba(217, 83, 79, 0.5);
}
.btn-outline-danger.disabled, .btn-outline-danger:disabled { color: #d9534f; background-color: transparent;
}
.btn-outline-danger:active, .btn-outline-danger.active, .show > .btn-outline-danger.dropdown-toggle { color: #fff; background-color: #d9534f; border-color: #d9534f;
}
.btn-link { font-weight: normal; color: #6441a4; border-radius: 0;
}
.btn-link, .btn-link:active, .btn-link.active, .btn-link:disabled { background-color: transparent;
}
.btn-link, .btn-link:focus, .btn-link:active { border-color: transparent;
}
.btn-link:hover { border-color: transparent;
}
.btn-link:focus, .btn-link:hover { color: #432b6d; text-decoration: underline; background-color: transparent;
}
.btn-link:disabled { color: #636c72;
}
.btn-link:disabled:focus, .btn-link:disabled:hover { text-decoration: none;
}
.btn-lg { padding: .75rem 1.5rem; font-size: 1.25rem; border-radius: .3rem;
}
.btn-sm { padding: .25rem .5rem; font-size: .875rem; border-radius: .2rem;
}
.btn-square { padding: .75rem 1rem; font-size: .875rem; border-radius: 0%;
}
.btn-block { display: block; width: 100%;
}
.btn-block + .btn-block { margin-top: .5rem;
}
input[type="submit"].btn-block, input[type="reset"].btn-block, input[type="button"].btn-block { width: 100%;
}
.dropup, .dropdown { position: relative;
}
.dropdown-toggle::after { display: inline-block; width: 0; height: 0; margin-left: .3em; vertical-align: middle; content: ""; border-top: .3em solid; border-right: .3em solid transparent; border-left: .3em solid transparent;
}
.dropdown-toggle:focus { outline: 0;
}
.dropup .dropdown-toggle::after { border-top: 0; border-bottom: .3em solid;
}
.dropdown-menu { position: absolute; top: 100%; left: 0; z-index: 1000; display: none; float: left; min-width: 10rem; padding: .5rem 0; margin: .125rem 0 0; font-size: 1rem; color: #292b2c; text-align: left; list-style: none; background-color: #fff; background-clip: padding-box; border: 1px solid rgba(0, 0, 0, 0.15); border-radius: .25rem;
}
.dropdown-divider { height: 1px; margin: .5rem 0; overflow: hidden; background-color: #eceeef;
}
.dropdown-item { display: block; width: 100%; padding: 3px 1.5rem; clear: both; font-weight: normal; color: #292b2c; text-align: inherit; white-space: nowrap; background: none; border: 0;
}
.dropdown-item:focus, .dropdown-item:hover { color: #1d1e1f; text-decoration: none; background-color: #f7f7f9;
}
.dropdown-item.active, .dropdown-item:active { color: #fff; text-decoration: none; background-color: #6441a4;
}
.dropdown-item.disabled, .dropdown-item:disabled { color: #636c72; cursor: not-allowed; background-color: transparent;
}
.show > .dropdown-menu { display: block;
}
.show > a { outline: 0;
}
.dropdown-menu-right { right: 0; left: auto;
}
.dropdown-menu-left { right: auto; left: 0;
}
.dropdown-header { display: block; padding: .5rem 1.5rem; margin-bottom: 0; font-size: .875rem; color: #636c72; white-space: nowrap;
}
.dropdown-backdrop { position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 990;
}
.dropup .dropdown-menu { top: auto; bottom: 100%; margin-bottom: .125rem;
}
.nav { display: flex; padding-left: 0; margin-bottom: 0; list-style: none;
}
.nav-link { display: block; padding: 0.5em 1em;
}
.nav-link:focus, .nav-link:hover { text-decoration: none;
}
.nav-link.disabled { color: #636c72; cursor: not-allowed;
}
.nav-tabs { border-bottom: 1px solid #ddd;
}
.nav-tabs .nav-item { margin-bottom: -1px;
}
.nav-tabs .nav-link { border: 1px solid transparent; border-top-right-radius: .25rem; border-top-left-radius: .25rem;
}
.nav-tabs .nav-link:focus, .nav-tabs .nav-link:hover { border-color: #eceeef #eceeef #ddd;
}
.nav-tabs .nav-link.disabled { color: #636c72; background-color: transparent; border-color: transparent;
}
.nav-tabs .nav-link.active, .nav-tabs .nav-item.show .nav-link { color: #464a4c; background-color: #fff; border-color: #ddd #ddd #fff;
}
.nav-tabs .dropdown-menu { margin-top: -1px; border-top-right-radius: 0; border-top-left-radius: 0;
}
.nav-pills .nav-link { border-radius: .25rem;
}
.nav-pills .nav-link.active, .nav-pills .nav-item.show .nav-link { color: #fff; cursor: default; background-color: #6441a4;
}
.nav-fill .nav-item { flex: 1 1 auto; text-align: center;
}
.nav-justified .nav-item { flex: 1 1 100%; text-align: center;
}
.tab-content > .tab-pane { display: none;
}
.tab-content > .active { display: block;
}
.navbar { position: relative; display: flex; flex-direction: column; padding: .5rem 1rem;
}
.navbar-brand { display: inline-block; padding-top: .25rem; padding-bottom: .25rem; margin-right: 1rem; font-size: 1.25rem; line-height: inherit; white-space: nowrap;
}
.navbar-brand:focus, .navbar-brand:hover { text-decoration: none;
}
.navbar-nav { display: flex; flex-direction: column; padding-left: 0; margin-bottom: 0; list-style: none;
}
.navbar-nav .nav-link { padding-right: 0; padding-left: 0;
}
.navbar-text { display: inline-block; padding-top: .425rem; padding-bottom: .425rem;
}
.navbar-toggler { align-self: flex-start; padding: .25rem .75rem; font-size: 1.25rem; line-height: 1; background: transparent; border: 1px solid transparent; border-radius: .25rem;
}
.navbar-toggler:focus, .navbar-toggler:hover { text-decoration: none;
}
.navbar-toggler-icon { display: inline-block; width: 1.5em; height: 1.5em; vertical-align: middle; content: ""; background: no-repeat center center; background-size: 100% 100%;
}
.navbar-toggler-left { position: absolute; left: 1rem;
}
.navbar-toggler-right { position: absolute; right: 1rem;
}
@media (max-width: 575px) { .navbar-toggleable .navbar-nav .dropdown-menu { position: static; float: none; } .navbar-toggleable > .container { padding-right: 0; padding-left: 0; }
}
@media (min-width: 576px) { .navbar-toggleable { flex-direction: row; flex-wrap: nowrap; align-items: center; } .navbar-toggleable .navbar-nav { flex-direction: row; } .navbar-toggleable .navbar-nav .nav-link { padding-right: .5rem; padding-left: .5rem; } .navbar-toggleable > .container { display: flex; flex-wrap: nowrap; align-items: center; } .navbar-toggleable .navbar-collapse { display: flex !important; width: 100%; } .navbar-toggleable .navbar-toggler { display: none; }
}
@media (max-width: 767px) { .navbar-toggleable-sm .navbar-nav .dropdown-menu { position: static; float: none; } .navbar-toggleable-sm > .container { padding-right: 0; padding-left: 0; }
}
@media (min-width: 768px) { .navbar-toggleable-sm { flex-direction: row; flex-wrap: nowrap; align-items: center; } .navbar-toggleable-sm .navbar-nav { flex-direction: row; } .navbar-toggleable-sm .navbar-nav .nav-link { padding-right: .5rem; padding-left: .5rem; } .navbar-toggleable-sm > .container { display: flex; flex-wrap: nowrap; align-items: center; } .navbar-toggleable-sm .navbar-collapse { display: flex !important; width: 100%; } .navbar-toggleable-sm .navbar-toggler { display: none; }
}
@media (max-width: 991px) { .navbar-toggleable-md .navbar-nav .dropdown-menu { position: static; float: none; } .navbar-toggleable-md > .container { padding-right: 0; padding-left: 0; }
}
@media (min-width: 992px) { .navbar-toggleable-md { flex-direction: row; flex-wrap: nowrap; align-items: center; } .navbar-toggleable-md .navbar-nav { flex-direction: row; } .navbar-toggleable-md .navbar-nav .nav-link { padding-right: .5rem; padding-left: .5rem; } .navbar-toggleable-md > .container { display: flex; flex-wrap: nowrap; align-items: center; } .navbar-toggleable-md .navbar-collapse { display: flex !important; width: 100%; } .navbar-toggleable-md .navbar-toggler { display: none; }
}
@media (max-width: 1199px) { .navbar-toggleable-lg .navbar-nav .dropdown-menu { position: static; float: none; } .navbar-toggleable-lg > .container { padding-right: 0; padding-left: 0; }
}
@media (min-width: 1200px) { .navbar-toggleable-lg { flex-direction: row; flex-wrap: nowrap; align-items: center; } .navbar-toggleable-lg .navbar-nav { flex-direction: row; } .navbar-toggleable-lg .navbar-nav .nav-link { padding-right: .5rem; padding-left: .5rem; } .navbar-toggleable-lg > .container { display: flex; flex-wrap: nowrap; align-items: center; } .navbar-toggleable-lg .navbar-collapse { display: flex !important; width: 100%; } .navbar-toggleable-lg .navbar-toggler { display: none; }
}
.navbar-toggleable-xl { flex-direction: row; flex-wrap: nowrap; align-items: center;
}
.navbar-toggleable-xl .navbar-nav .dropdown-menu { position: static; float: none;
}
.navbar-toggleable-xl > .container { padding-right: 0; padding-left: 0;
}
.navbar-toggleable-xl .navbar-nav { flex-direction: row;
}
.navbar-toggleable-xl .navbar-nav .nav-link { padding-right: .5rem; padding-left: .5rem;
}
.navbar-toggleable-xl > .container { display: flex; flex-wrap: nowrap; align-items: center;
}
.navbar-toggleable-xl .navbar-collapse { display: flex !important; width: 100%;
}
.navbar-toggleable-xl .navbar-toggler { display: none;
}
.navbar-light .navbar-brand, .navbar-light .navbar-toggler { color: rgba(0, 0, 0, 0.9);
}
.navbar-light .navbar-brand:focus, .navbar-light .navbar-brand:hover, .navbar-light .navbar-toggler:focus, .navbar-light .navbar-toggler:hover { color: rgba(0, 0, 0, 0.9);
}
.navbar-light .navbar-nav .nav-link { color: rgba(0, 0, 0, 0.5);
}
.navbar-light .navbar-nav .nav-link:focus, .navbar-light .navbar-nav .nav-link:hover { color: rgba(0, 0, 0, 0.7);
}
.navbar-light .navbar-nav .nav-link.disabled { color: rgba(0, 0, 0, 0.3);
}
.navbar-light .navbar-nav .open > .nav-link, .navbar-light .navbar-nav .active > .nav-link, .navbar-light .navbar-nav .nav-link.open, .navbar-light .navbar-nav .nav-link.active { color: rgba(0, 0, 0, 0.9);
}
.navbar-light .navbar-toggler { border-color: rgba(0, 0, 0, 0.1);
}
.navbar-light .navbar-toggler-icon { background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(0,0,0,0.5)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E");
}
.navbar-light .navbar-text { color: rgba(0, 0, 0, 0.5);
}
.navbar-inverse .navbar-brand, .navbar-inverse .navbar-toggler { color: #fff;
}
.navbar-inverse .navbar-brand:focus, .navbar-inverse .navbar-brand:hover, .navbar-inverse .navbar-toggler:focus, .navbar-inverse .navbar-toggler:hover { color: #fff;
}
.navbar-inverse .navbar-nav .nav-link { color: rgba(255, 255, 255, 0.5);
}
.navbar-inverse .navbar-nav .nav-link:focus, .navbar-inverse .navbar-nav .nav-link:hover { color: rgba(255, 255, 255, 0.75);
}
.navbar-inverse .navbar-nav .nav-link.disabled { color: rgba(255, 255, 255, 0.25);
}
.navbar-inverse .navbar-nav .open > .nav-link, .navbar-inverse .navbar-nav .active > .nav-link, .navbar-inverse .navbar-nav .nav-link.open, .navbar-inverse .navbar-nav .nav-link.active { color: #fff;
}
.navbar-inverse .navbar-toggler { border-color: rgba(255, 255, 255, 0.1);
}
.navbar-inverse .navbar-toggler-icon { background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(255,255,255,0.5)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E");
}
.navbar-inverse .navbar-text { color: rgba(255, 255, 255, 0.5);
}
.card, .game-card { position: relative; display: flex; flex-direction: column; background-color: #fff; border: 1px solid rgba(0, 0, 0, 0.125); box-shadow: 14px 6px 21px rgba(0, 0, 0, 0.5); border-radius: .25rem; max-width: 600px;
}
.game-card { box-shadow: none; border: none; max-width: 200px;
}
.card-block { flex: 1 1 auto; padding: 1.25rem;
}
.card-title { margin-bottom: .75rem;
}
.card-subtitle { margin-top: -.375rem; margin-bottom: 0;
}
.card-text:last-child { margin-bottom: 0;
}
.card-link:hover { text-decoration: none;
}
.card-link + .card-link { margin-left: 1.25rem;
}
.card > .list-group:first-child .list-group-item:first-child, .game-card > .list-group:first-child .list-group-item:first-child { border-top-right-radius: .25rem; border-top-left-radius: .25rem;
}
.card > .list-group:last-child .list-group-item:last-child, .game-card > .list-group:last-child .list-group-item:last-child { border-bottom-right-radius: .25rem; border-bottom-left-radius: .25rem;
}
.card-header { padding: .75rem 1.25rem; margin-bottom: 0; background-color: #f7f7f9; border-bottom: 1px solid rgba(0, 0, 0, 0.125);
}
.card-header:first-child { border-radius: calc(.25rem - 1px) calc(.25rem - 1px) 0 0;
}
.card-footer { padding: .75rem 1.25rem; background-color: #f7f7f9; border-top: 1px solid rgba(0, 0, 0, 0.125);
}
.card-footer:last-child { border-radius: 0 0 calc(.25rem - 1px) calc(.25rem - 1px);
}
.card-header-tabs { margin-right: -.625rem; margin-bottom: -.75rem; margin-left: -.625rem; border-bottom: 0;
}
.card-header-pills { margin-right: -.625rem; margin-left: -.625rem;
}
.card-primary { background-color: #6441a4; border-color: #6441a4;
}
.card-primary .card-header, .card-primary .card-footer { background-color: transparent;
}
.card-success { background-color: #5cb85c; border-color: #5cb85c;
}
.card-success .card-header, .card-success .card-footer { background-color: transparent;
}
.card-info { background-color: #5bc0de; border-color: #5bc0de;
}
.card-info .card-header, .card-info .card-footer { background-color: transparent;
}
.card-warning { background-color: #f0ad4e; border-color: #f0ad4e;
}
.card-warning .card-header, .card-warning .card-footer { background-color: transparent;
}
.card-danger { background-color: #d9534f; border-color: #d9534f;
}
.card-danger .card-header, .card-danger .card-footer { background-color: transparent;
}
.card-outline-primary { background-color: transparent; border-color: #6441a4;
}
.card-outline-secondary { background-color: transparent; border-color: #ccc;
}
.card-outline-info { background-color: transparent; border-color: #5bc0de;
}
.card-outline-success { background-color: transparent; border-color: #5cb85c;
}
.card-outline-warning { background-color: transparent; border-color: #f0ad4e;
}
.card-outline-danger { background-color: transparent; border-color: #d9534f;
}
.card-inverse { color: rgba(255, 255, 255, 0.65);
}
.card-inverse .card-header, .card-inverse .card-footer { background-color: transparent; border-color: rgba(255, 255, 255, 0.2);
}
.card-inverse .card-header, .card-inverse .card-footer, .card-inverse .card-title, .card-inverse .card-blockquote { color: #fff;
}
.card-inverse .card-link, .card-inverse .card-text, .card-inverse .card-subtitle, .card-inverse .card-blockquote .blockquote-footer { color: rgba(255, 255, 255, 0.65);
}
.card-inverse .card-link:focus, .card-inverse .card-link:hover { color: #fff;
}
.card-blockquote { padding: 0; margin-bottom: 0; border-left: 0;
}
.card-img { border-radius: calc(.25rem - 1px);
}
.card-img-overlay { position: absolute; top: 0; right: 0; bottom: 0; left: 0; padding: 1.25rem;
}
.card-img-top { border-top-right-radius: calc(.25rem - 1px); border-top-left-radius: calc(.25rem - 1px); height: 250px;
}
.card-img-bottom { border-bottom-right-radius: calc(.25rem - 1px); border-bottom-left-radius: calc(.25rem - 1px);
}
@media (min-width: 576px) { .card-deck { display: flex; flex-flow: row wrap; } .card-deck .card, .card-deck .game-card { display: flex; flex: 1 0 0; flex-direction: column; } .card-deck .card:not(:first-child), .card-deck .game-card:not(:first-child) { margin-left: 15px; } .card-deck .card:not(:last-child), .card-deck .game-card:not(:last-child) { margin-right: 15px; }
}
@media (min-width: 576px) { .card-group { display: flex; flex-flow: row wrap; } .card-group .card, .card-group .game-card { flex: 1 0 0; } .card-group .card + .card, .card-group .game-card + .card, .card-group .card + .game-card, .card-group .game-card + .game-card { margin-left: 0; border-left: 0; } .card-group .card:first-child, .card-group .game-card:first-child { border-bottom-right-radius: 0; border-top-right-radius: 0; } .card-group .card:first-child .card-img-top, .card-group .game-card:first-child .card-img-top { border-top-right-radius: 0; } .card-group .card:first-child .card-img-bottom, .card-group .game-card:first-child .card-img-bottom { border-bottom-right-radius: 0; } .card-group .card:last-child, .card-group .game-card:last-child { border-bottom-left-radius: 0; border-top-left-radius: 0; } .card-group .card:last-child .card-img-top, .card-group .game-card:last-child .card-img-top { border-top-left-radius: 0; } .card-group .card:last-child .card-img-bottom, .card-group .game-card:last-child .card-img-bottom { border-bottom-left-radius: 0; } .card-group .card:not(:first-child):not(:last-child), .card-group .game-card:not(:first-child):not(:last-child) { border-radius: 0; } .card-group .card:not(:first-child):not(:last-child) .card-img-top, .card-group .game-card:not(:first-child):not(:last-child) .card-img-top, .card-group .card:not(:first-child):not(:last-child) .card-img-bottom, .card-group .game-card:not(:first-child):not(:last-child) .card-img-bottom { border-radius: 0; }
}
@media (min-width: 576px) { .card-columns { column-count: 3; column-gap: 1.25rem; } .card-columns .card, .card-columns .game-card { display: inline-block; width: 100%; margin-bottom: .75rem; }
}
.embed-responsive { position: relative; display: block; width: 100%; padding: 0; overflow: hidden;
}
.embed-responsive::before { display: block; content: "";
}
.embed-responsive .embed-responsive-item, .embed-responsive iframe, .embed-responsive embed, .embed-responsive object, .embed-responsive video { position: absolute; top: 0; bottom: 0; left: 0; width: 100%; height: 100%; border: 0;
}
.embed-responsive-21by9::before { padding-top: 42.85714%;
}
.embed-responsive-16by9::before { padding-top: 56.25%;
}
.embed-responsive-4by3::before { padding-top: 75%;
}
.embed-responsive-1by1::before { padding-top: 100%;
}
.close { position: absolute; top: 0; font-weight: bold; line-height: 1; color: white; padding: 5px 10px; font-size: 2.2rem; text-shadow: 0 1px 0 #fff; opacity: .5;
}
.close:focus, .close:hover { color: #fefefe; text-decoration: none; cursor: pointer; opacity: .75;
}
button.close { padding: 5px 10px; cursor: pointer; background: transparent; border: 0; -webkit-appearance: none;
}
.modal-open { overflow: hidden;
}
.modal { position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 1050; display: none; overflow: hidden; outline: 0;
}
.modal.fade .modal-dialog { transition: transform 0.3s ease-out; transform: translate(0, -25%);
}
.modal.show .modal-dialog { transform: translate(0, 0);
}
.modal-open .modal { overflow-x: hidden; overflow-y: auto;
}
.modal-dialog { position: relative; width: auto; margin: 10px;
}
.modal-content { position: relative; display: flex; flex-direction: column; background-color: #fff; background-clip: padding-box; outline: 0;
}
.modal-backdrop { position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 1040; background-color: #000;
}
.modal-backdrop.fade { opacity: 0;
}
.modal-backdrop.show { opacity: .5;
}
.modal-header { display: flex; align-items: center; justify-content: space-between; padding: 15px; border-bottom: 1px solid #eceeef;
}
.modal-title { margin-bottom: 0; line-height: 1.5;
}
.modal-body { position: relative; flex: 1 1 auto; padding: 15px;
}
.modal-footer { display: flex; align-items: center; justify-content: flex-end; padding: 15px; border-top: 1px solid #eceeef;
}
.modal-footer > :not(:first-child) { margin-left: .25rem;
}
.modal-footer > :not(:last-child) { margin-right: .25rem;
}
.modal-scrollbar-measure { position: absolute; top: -9999px; width: 50px; height: 50px; overflow: scroll;
}
@media (min-width: 576px) { .modal-dialog { max-width: 500px; margin: 30px auto; } .modal-sm { max-width: 300px; }
}
@media (min-width: 992px) { .modal-lg { max-width: 800px; }
}
.align-baseline { vertical-align: baseline !important;
}
.align-top { vertical-align: top !important;
}
.align-middle { vertical-align: middle !important;
}
.align-bottom { vertical-align: bottom !important;
}
.align-text-bottom { vertical-align: text-bottom !important;
}
.align-text-top { vertical-align: text-top !important;
}
.bg-faded { background-color: #f7f7f7;
}
.bg-primary { background-color: #6441a4 !important;
}
a.bg-primary:focus, a.bg-primary:hover { background-color: #4e337f !important;
}
.bg-success { background-color: #5cb85c !important;
}
a.bg-success:focus, a.bg-success:hover { background-color: #449d44 !important;
}
.bg-info { background-color: #5bc0de !important;
}
a.bg-info:focus, a.bg-info:hover { background-color: #31b0d5 !important;
}
.bg-warning { background-color: #f0ad4e !important;
}
a.bg-warning:focus, a.bg-warning:hover { background-color: #ec971f !important;
}
.bg-danger { background-color: #d9534f !important;
}
a.bg-danger:focus, a.bg-danger:hover { background-color: #c9302c !important;
}
.bg-inverse { background-color: #292b2c !important;
}
a.bg-inverse:focus, a.bg-inverse:hover { background-color: #101112 !important;
}
.border-0 { border: 0 !important;
}
.border-top-0 { border-top: 0 !important;
}
.border-right-0 { border-right: 0 !important;
}
.border-bottom-0 { border-bottom: 0 !important;
}
.border-left-0 { border-left: 0 !important;
}
.rounded { border-radius: .25rem;
}
.rounded-top { border-top-right-radius: .25rem; border-top-left-radius: .25rem;
}
.rounded-right { border-bottom-right-radius: .25rem; border-top-right-radius: .25rem;
}
.rounded-bottom { border-bottom-right-radius: .25rem; border-bottom-left-radius: .25rem;
}
.rounded-left { border-bottom-left-radius: .25rem; border-top-left-radius: .25rem;
}
.rounded-circle { border-radius: 50%;
}
.rounded-0 { border-radius: 0;
}
.clearfix::after { display: block; content: ""; clear: both;
}
.d-none { display: none !important;
}
.d-inline { display: inline !important;
}
.d-inline-block { display: inline-block !important;
}
.d-block { display: block !important;
}
.d-table { display: table !important;
}
.d-table-cell { display: table-cell !important;
}
.d-flex { display: flex !important;
}
.d-inline-flex { display: inline-flex !important;
}
@media (min-width: 576px) { .d-sm-none { display: none !important; } .d-sm-inline { display: inline !important; } .d-sm-inline-block { display: inline-block !important; } .d-sm-block { display: block !important; } .d-sm-table { display: table !important; } .d-sm-table-cell { display: table-cell !important; } .d-sm-flex { display: flex !important; } .d-sm-inline-flex { display: inline-flex !important; }
}
@media (min-width: 768px) { .d-md-none { display: none !important; } .d-md-inline { display: inline !important; } .d-md-inline-block { display: inline-block !important; } .d-md-block { display: block !important; } .d-md-table { display: table !important; } .d-md-table-cell { display: table-cell !important; } .d-md-flex { display: flex !important; } .d-md-inline-flex { display: inline-flex !important; }
}
@media (min-width: 992px) { .d-lg-none { display: none !important; } .d-lg-inline { display: inline !important; } .d-lg-inline-block { display: inline-block !important; } .d-lg-block { display: block !important; } .d-lg-table { display: table !important; } .d-lg-table-cell { display: table-cell !important; } .d-lg-flex { display: flex !important; } .d-lg-inline-flex { display: inline-flex !important; }
}
@media (min-width: 1200px) { .d-xl-none { display: none !important; } .d-xl-inline { display: inline !important; } .d-xl-inline-block { display: inline-block !important; } .d-xl-block { display: block !important; } .d-xl-table { display: table !important; } .d-xl-table-cell { display: table-cell !important; } .d-xl-flex { display: flex !important; } .d-xl-inline-flex { display: inline-flex !important; }
}
.flex-first { order: -1;
}
.flex-last { order: 1;
}
.flex-unordered { order: 0;
}
.flex-row { flex-direction: row !important;
}
.flex-column { flex-direction: column !important;
}
.flex-row-reverse { flex-direction: row-reverse !important;
}
.flex-column-reverse { flex-direction: column-reverse !important;
}
.flex-wrap { flex-wrap: wrap !important;
}
.flex-nowrap { flex-wrap: nowrap !important;
}
.flex-wrap-reverse { flex-wrap: wrap-reverse !important;
}
.justify-content-start { justify-content: flex-start !important;
}
.justify-content-end { justify-content: flex-end !important;
}
.justify-content-center { justify-content: center !important;
}
.justify-content-between { justify-content: space-between !important;
}
.justify-content-around { justify-content: space-around !important;
}
.align-items-start { align-items: flex-start !important;
}
.align-items-end { align-items: flex-end !important;
}
.align-items-center { align-items: center !important;
}
.align-items-baseline { align-items: baseline !important;
}
.align-items-stretch { align-items: stretch !important;
}
.align-content-start { align-content: flex-start !important;
}
.align-content-end { align-content: flex-end !important;
}
.align-content-center { align-content: center !important;
}
.align-content-between { align-content: space-between !important;
}
.align-content-around { align-content: space-around !important;
}
.align-content-stretch { align-content: stretch !important;
}
.align-self-auto { align-self: auto !important;
}
.align-self-start { align-self: flex-start !important;
}
.align-self-end { align-self: flex-end !important;
}
.align-self-center { align-self: center !important;
}
.align-self-baseline { align-self: baseline !important;
}
.align-self-stretch { align-self: stretch !important;
}
@media (min-width: 576px) { .flex-sm-first { order: -1; } .flex-sm-last { order: 1; } .flex-sm-unordered { order: 0; } .flex-sm-row { flex-direction: row !important; } .flex-sm-column { flex-direction: column !important; } .flex-sm-row-reverse { flex-direction: row-reverse !important; } .flex-sm-column-reverse { flex-direction: column-reverse !important; } .flex-sm-wrap { flex-wrap: wrap !important; } .flex-sm-nowrap { flex-wrap: nowrap !important; } .flex-sm-wrap-reverse { flex-wrap: wrap-reverse !important; } .justify-content-sm-start { justify-content: flex-start !important; } .justify-content-sm-end { justify-content: flex-end !important; } .justify-content-sm-center { justify-content: center !important; } .justify-content-sm-between { justify-content: space-between !important; } .justify-content-sm-around { justify-content: space-around !important; } .align-items-sm-start { align-items: flex-start !important; } .align-items-sm-end { align-items: flex-end !important; } .align-items-sm-center { align-items: center !important; } .align-items-sm-baseline { align-items: baseline !important; } .align-items-sm-stretch { align-items: stretch !important; } .align-content-sm-start { align-content: flex-start !important; } .align-content-sm-end { align-content: flex-end !important; } .align-content-sm-center { align-content: center !important; } .align-content-sm-between { align-content: space-between !important; } .align-content-sm-around { align-content: space-around !important; } .align-content-sm-stretch { align-content: stretch !important; } .align-self-sm-auto { align-self: auto !important; } .align-self-sm-start { align-self: flex-start !important; } .align-self-sm-end { align-self: flex-end !important; } .align-self-sm-center { align-self: center !important; } .align-self-sm-baseline { align-self: baseline !important; } .align-self-sm-stretch { align-self: stretch !important; }
}
@media (min-width: 768px) { .flex-md-first { order: -1; } .flex-md-last { order: 1; } .flex-md-unordered { order: 0; } .flex-md-row { flex-direction: row !important; } .flex-md-column { flex-direction: column !important; } .flex-md-row-reverse { flex-direction: row-reverse !important; } .flex-md-column-reverse { flex-direction: column-reverse !important; } .flex-md-wrap { flex-wrap: wrap !important; } .flex-md-nowrap { flex-wrap: nowrap !important; } .flex-md-wrap-reverse { flex-wrap: wrap-reverse !important; } .justify-content-md-start { justify-content: flex-start !important; } .justify-content-md-end { justify-content: flex-end !important; } .justify-content-md-center { justify-content: center !important; } .justify-content-md-between { justify-content: space-between !important; } .justify-content-md-around { justify-content: space-around !important; } .align-items-md-start { align-items: flex-start !important; } .align-items-md-end { align-items: flex-end !important; } .align-items-md-center { align-items: center !important; } .align-items-md-baseline { align-items: baseline !important; } .align-items-md-stretch { align-items: stretch !important; } .align-content-md-start { align-content: flex-start !important; } .align-content-md-end { align-content: flex-end !important; } .align-content-md-center { align-content: center !important; } .align-content-md-between { align-content: space-between !important; } .align-content-md-around { align-content: space-around !important; } .align-content-md-stretch { align-content: stretch !important; } .align-self-md-auto { align-self: auto !important; } .align-self-md-start { align-self: flex-start !important; } .align-self-md-end { align-self: flex-end !important; } .align-self-md-center { align-self: center !important; } .align-self-md-baseline { align-self: baseline !important; } .align-self-md-stretch { align-self: stretch !important; }
}
@media (min-width: 992px) { .flex-lg-first { order: -1; } .flex-lg-last { order: 1; } .flex-lg-unordered { order: 0; } .flex-lg-row { flex-direction: row !important; } .flex-lg-column { flex-direction: column !important; } .flex-lg-row-reverse { flex-direction: row-reverse !important; } .flex-lg-column-reverse { flex-direction: column-reverse !important; } .flex-lg-wrap { flex-wrap: wrap !important; } .flex-lg-nowrap { flex-wrap: nowrap !important; } .flex-lg-wrap-reverse { flex-wrap: wrap-reverse !important; } .justify-content-lg-start { justify-content: flex-start !important; } .justify-content-lg-end { justify-content: flex-end !important; } .justify-content-lg-center { justify-content: center !important; } .justify-content-lg-between { justify-content: space-between !important; } .justify-content-lg-around { justify-content: space-around !important; } .align-items-lg-start { align-items: flex-start !important; } .align-items-lg-end { align-items: flex-end !important; } .align-items-lg-center { align-items: center !important; } .align-items-lg-baseline { align-items: baseline !important; } .align-items-lg-stretch { align-items: stretch !important; } .align-content-lg-start { align-content: flex-start !important; } .align-content-lg-end { align-content: flex-end !important; } .align-content-lg-center { align-content: center !important; } .align-content-lg-between { align-content: space-between !important; } .align-content-lg-around { align-content: space-around !important; } .align-content-lg-stretch { align-content: stretch !important; } .align-self-lg-auto { align-self: auto !important; } .align-self-lg-start { align-self: flex-start !important; } .align-self-lg-end { align-self: flex-end !important; } .align-self-lg-center { align-self: center !important; } .align-self-lg-baseline { align-self: baseline !important; } .align-self-lg-stretch { align-self: stretch !important; }
}
@media (min-width: 1200px) { .flex-xl-first { order: -1; } .flex-xl-last { order: 1; } .flex-xl-unordered { order: 0; } .flex-xl-row { flex-direction: row !important; } .flex-xl-column { flex-direction: column !important; } .flex-xl-row-reverse { flex-direction: row-reverse !important; } .flex-xl-column-reverse { flex-direction: column-reverse !important; } .flex-xl-wrap { flex-wrap: wrap !important; } .flex-xl-nowrap { flex-wrap: nowrap !important; } .flex-xl-wrap-reverse { flex-wrap: wrap-reverse !important; } .justify-content-xl-start { justify-content: flex-start !important; } .justify-content-xl-end { justify-content: flex-end !important; } .justify-content-xl-center { justify-content: center !important; } .justify-content-xl-between { justify-content: space-between !important; } .justify-content-xl-around { justify-content: space-around !important; } .align-items-xl-start { align-items: flex-start !important; } .align-items-xl-end { align-items: flex-end !important; } .align-items-xl-center { align-items: center !important; } .align-items-xl-baseline { align-items: baseline !important; } .align-items-xl-stretch { align-items: stretch !important; } .align-content-xl-start { align-content: flex-start !important; } .align-content-xl-end { align-content: flex-end !important; } .align-content-xl-center { align-content: center !important; } .align-content-xl-between { align-content: space-between !important; } .align-content-xl-around { align-content: space-around !important; } .align-content-xl-stretch { align-content: stretch !important; } .align-self-xl-auto { align-self: auto !important; } .align-self-xl-start { align-self: flex-start !important; } .align-self-xl-end { align-self: flex-end !important; } .align-self-xl-center { align-self: center !important; } .align-self-xl-baseline { align-self: baseline !important; } .align-self-xl-stretch { align-self: stretch !important; }
}
.float-left { float: left !important;
}
.float-right { float: right !important;
}
.float-none { float: none !important;
}
@media (min-width: 576px) { .float-sm-left { float: left !important; } .float-sm-right { float: right !important; } .float-sm-none { float: none !important; }
}
@media (min-width: 768px) { .float-md-left { float: left !important; } .float-md-right { float: right !important; } .float-md-none { float: none !important; }
}
@media (min-width: 992px) { .float-lg-left { float: left !important; } .float-lg-right { float: right !important; } .float-lg-none { float: none !important; }
}
@media (min-width: 1200px) { .float-xl-left { float: left !important; } .float-xl-right { float: right !important; } .float-xl-none { float: none !important; }
}
.fixed-top { position: fixed; top: 0; right: 0; left: 0; z-index: 1030;
}
.fixed-bottom { position: fixed; right: 0; bottom: 0; left: 0; z-index: 1030;
}
.sticky-top { position: sticky; top: 0; z-index: 1030;
}
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); border: 0;
}
.sr-only-focusable:active, .sr-only-focusable:focus { position: static; width: auto; height: auto; margin: 0; overflow: visible; clip: auto;
}
.w-25 { width: 25% !important;
}
.w-50 { width: 50% !important;
}
.w-75 { width: 75% !important;
}
.w-100 { width: 100% !important;
}
.h-25 { height: 25% !important;
}
.h-50 { height: 50% !important;
}
.h-75 { height: 75% !important;
}
.h-100 { height: 100% !important;
}
.mw-100 { max-width: 100% !important;
}
.mh-100 { max-height: 100% !important;
}
.m-0 { margin: 0 0 !important;
}
.mt-0 { margin-top: 0 !important;
}
.mr-0 { margin-right: 0 !important;
}
.mb-0 { margin-bottom: 0 !important;
}
.ml-0 { margin-left: 0 !important;
}
.mx-0 { margin-right: 0 !important; margin-left: 0 !important;
}
.my-0 { margin-top: 0 !important; margin-bottom: 0 !important;
}
.m-1 { margin: .25rem .25rem !important;
}
.mt-1 { margin-top: .25rem !important;
}
.mr-1 { margin-right: .25rem !important;
}
.mb-1 { margin-bottom: .25rem !important;
}
.ml-1 { margin-left: .25rem !important;
}
.mx-1 { margin-right: .25rem !important; margin-left: .25rem !important;
}
.my-1 { margin-top: .25rem !important; margin-bottom: .25rem !important;
}
.m-2 { margin: .5rem .5rem !important;
}
.mt-2 { margin-top: .5rem !important;
}
.mr-2 { margin-right: .5rem !important;
}
.mb-2 { margin-bottom: .5rem !important;
}
.ml-2 { margin-left: .5rem !important;
}
.mx-2 { margin-right: .5rem !important; margin-left: .5rem !important;
}
.my-2 { margin-top: .5rem !important; margin-bottom: .5rem !important;
}
.m-3 { margin: 1rem 1rem !important;
}
.mt-3 { margin-top: 1rem !important;
}
.mr-3 { margin-right: 1rem !important;
}
.mb-3 { margin-bottom: 1rem !important;
}
.ml-3 { margin-left: 1rem !important;
}
.mx-3 { margin-right: 1rem !important; margin-left: 1rem !important;
}
.my-3 { margin-top: 1rem !important; margin-bottom: 1rem !important;
}
.m-4 { margin: 1.5rem 1.5rem !important;
}
.mt-4 { margin-top: 1.5rem !important;
}
.mr-4 { margin-right: 1.5rem !important;
}
.mb-4 { margin-bottom: 1.5rem !important;
}
.ml-4 { margin-left: 1.5rem !important;
}
.mx-4 { margin-right: 1.5rem !important; margin-left: 1.5rem !important;
}
.my-4 { margin-top: 1.5rem !important; margin-bottom: 1.5rem !important;
}
.m-5 { margin: 3rem 3rem !important;
}
.mt-5 { margin-top: 3rem !important;
}
.mr-5 { margin-right: 3rem !important;
}
.mb-5 { margin-bottom: 3rem !important;
}
.ml-5 { margin-left: 3rem !important;
}
.mx-5 { margin-right: 3rem !important; margin-left: 3rem !important;
}
.my-5 { margin-top: 3rem !important; margin-bottom: 3rem !important;
}
.p-0 { padding: 0 0 !important;
}
.pt-0 { padding-top: 0 !important;
}
.pr-0 { padding-right: 0 !important;
}
.pb-0 { padding-bottom: 0 !important;
}
.pl-0 { padding-left: 0 !important;
}
.px-0 { padding-right: 0 !important; padding-left: 0 !important;
}
.py-0 { padding-top: 0 !important; padding-bottom: 0 !important;
}
.p-1 { padding: .25rem .25rem !important;
}
.pt-1 { padding-top: .25rem !important;
}
.pr-1 { padding-right: .25rem !important;
}
.pb-1 { padding-bottom: .25rem !important;
}
.pl-1 { padding-left: .25rem !important;
}
.px-1 { padding-right: .25rem !important; padding-left: .25rem !important;
}
.py-1 { padding-top: .25rem !important; padding-bottom: .25rem !important;
}
.p-2 { padding: .5rem .5rem !important;
}
.pt-2 { padding-top: .5rem !important;
}
.pr-2 { padding-right: .5rem !important;
}
.pb-2 { padding-bottom: .5rem !important;
}
.pl-2 { padding-left: .5rem !important;
}
.px-2 { padding-right: .5rem !important; padding-left: .5rem !important;
}
.py-2 { padding-top: .5rem !important; padding-bottom: .5rem !important;
}
.p-3 { padding: 1rem 1rem !important;
}
.pt-3 { padding-top: 1rem !important;
}
.pr-3 { padding-right: 1rem !important;
}
.pb-3 { padding-bottom: 1rem !important;
}
.pl-3 { padding-left: 1rem !important;
}
.px-3 { padding-right: 1rem !important; padding-left: 1rem !important;
}
.py-3 { padding-top: 1rem !important; padding-bottom: 1rem !important;
}
.p-4 { padding: 1.5rem 1.5rem !important;
}
.pt-4 { padding-top: 1.5rem !important;
}
.pr-4 { padding-right: 1.5rem !important;
}
.pb-4 { padding-bottom: 1.5rem !important;
}
.pl-4 { padding-left: 1.5rem !important;
}
.px-4 { padding-right: 1.5rem !important; padding-left: 1.5rem !important;
}
.py-4 { padding-top: 1.5rem !important; padding-bottom: 1.5rem !important;
}
.p-5 { padding: 3rem 3rem !important;
}
.pt-5 { padding-top: 3rem !important;
}
.pr-5 { padding-right: 3rem !important;
}
.pb-5 { padding-bottom: 3rem !important;
}
.pl-5 { padding-left: 3rem !important;
}
.px-5 { padding-right: 3rem !important; padding-left: 3rem !important;
}
.py-5 { padding-top: 3rem !important; padding-bottom: 3rem !important;
}
.m-auto { margin: auto !important;
}
.mt-auto { margin-top: auto !important;
}
.mr-auto { margin-right: auto !important;
}
.mb-auto { margin-bottom: auto !important;
}
.ml-auto { margin-left: auto !important;
}
.mx-auto { margin-right: auto !important; margin-left: auto !important;
}
.my-auto { margin-top: auto !important; margin-bottom: auto !important;
}
@media (min-width: 576px) { .m-sm-0 { margin: 0 0 !important; } .mt-sm-0 { margin-top: 0 !important; } .mr-sm-0 { margin-right: 0 !important; } .mb-sm-0 { margin-bottom: 0 !important; } .ml-sm-0 { margin-left: 0 !important; } .mx-sm-0 { margin-right: 0 !important; margin-left: 0 !important; } .my-sm-0 { margin-top: 0 !important; margin-bottom: 0 !important; } .m-sm-1 { margin: .25rem .25rem !important; } .mt-sm-1 { margin-top: .25rem !important; } .mr-sm-1 { margin-right: .25rem !important; } .mb-sm-1 { margin-bottom: .25rem !important; } .ml-sm-1 { margin-left: .25rem !important; } .mx-sm-1 { margin-right: .25rem !important; margin-left: .25rem !important; } .my-sm-1 { margin-top: .25rem !important; margin-bottom: .25rem !important; } .m-sm-2 { margin: .5rem .5rem !important; } .mt-sm-2 { margin-top: .5rem !important; } .mr-sm-2 { margin-right: .5rem !important; } .mb-sm-2 { margin-bottom: .5rem !important; } .ml-sm-2 { margin-left: .5rem !important; } .mx-sm-2 { margin-right: .5rem !important; margin-left: .5rem !important; } .my-sm-2 { margin-top: .5rem !important; margin-bottom: .5rem !important; } .m-sm-3 { margin: 1rem 1rem !important; } .mt-sm-3 { margin-top: 1rem !important; } .mr-sm-3 { margin-right: 1rem !important; } .mb-sm-3 { margin-bottom: 1rem !important; } .ml-sm-3 { margin-left: 1rem !important; } .mx-sm-3 { margin-right: 1rem !important; margin-left: 1rem !important; } .my-sm-3 { margin-top: 1rem !important; margin-bottom: 1rem !important; } .m-sm-4 { margin: 1.5rem 1.5rem !important; } .mt-sm-4 { margin-top: 1.5rem !important; } .mr-sm-4 { margin-right: 1.5rem !important; } .mb-sm-4 { margin-bottom: 1.5rem !important; } .ml-sm-4 { margin-left: 1.5rem !important; } .mx-sm-4 { margin-right: 1.5rem !important; margin-left: 1.5rem !important; } .my-sm-4 { margin-top: 1.5rem !important; margin-bottom: 1.5rem !important; } .m-sm-5 { margin: 3rem 3rem !important; } .mt-sm-5 { margin-top: 3rem !important; } .mr-sm-5 { margin-right: 3rem !important; } .mb-sm-5 { margin-bottom: 3rem !important; } .ml-sm-5 { margin-left: 3rem !important; } .mx-sm-5 { margin-right: 3rem !important; margin-left: 3rem !important; } .my-sm-5 { margin-top: 3rem !important; margin-bottom: 3rem !important; } .p-sm-0 { padding: 0 0 !important; } .pt-sm-0 { padding-top: 0 !important; } .pr-sm-0 { padding-right: 0 !important; } .pb-sm-0 { padding-bottom: 0 !important; } .pl-sm-0 { padding-left: 0 !important; } .px-sm-0 { padding-right: 0 !important; padding-left: 0 !important; } .py-sm-0 { padding-top: 0 !important; padding-bottom: 0 !important; } .p-sm-1 { padding: .25rem .25rem !important; } .pt-sm-1 { padding-top: .25rem !important; } .pr-sm-1 { padding-right: .25rem !important; } .pb-sm-1 { padding-bottom: .25rem !important; } .pl-sm-1 { padding-left: .25rem !important; } .px-sm-1 { padding-right: .25rem !important; padding-left: .25rem !important; } .py-sm-1 { padding-top: .25rem !important; padding-bottom: .25rem !important; } .p-sm-2 { padding: .5rem .5rem !important; } .pt-sm-2 { padding-top: .5rem !important; } .pr-sm-2 { padding-right: .5rem !important; } .pb-sm-2 { padding-bottom: .5rem !important; } .pl-sm-2 { padding-left: .5rem !important; } .px-sm-2 { padding-right: .5rem !important; padding-left: .5rem !important; } .py-sm-2 { padding-top: .5rem !important; padding-bottom: .5rem !important; } .p-sm-3 { padding: 1rem 1rem !important; } .pt-sm-3 { padding-top: 1rem !important; } .pr-sm-3 { padding-right: 1rem !important; } .pb-sm-3 { padding-bottom: 1rem !important; } .pl-sm-3 { padding-left: 1rem !important; } .px-sm-3 { padding-right: 1rem !important; padding-left: 1rem !important; } .py-sm-3 { padding-top: 1rem !important; padding-bottom: 1rem !important; } .p-sm-4 { padding: 1.5rem 1.5rem !important; } .pt-sm-4 { padding-top: 1.5rem !important; } .pr-sm-4 { padding-right: 1.5rem !important; } .pb-sm-4 { padding-bottom: 1.5rem !important; } .pl-sm-4 { padding-left: 1.5rem !important; } .px-sm-4 { padding-right: 1.5rem !important; padding-left: 1.5rem !important; } .py-sm-4 { padding-top: 1.5rem !important; padding-bottom: 1.5rem !important; } .p-sm-5 { padding: 3rem 3rem !important; } .pt-sm-5 { padding-top: 3rem !important; } .pr-sm-5 { padding-right: 3rem !important; } .pb-sm-5 { padding-bottom: 3rem !important; } .pl-sm-5 { padding-left: 3rem !important; } .px-sm-5 { padding-right: 3rem !important; padding-left: 3rem !important; } .py-sm-5 { padding-top: 3rem !important; padding-bottom: 3rem !important; } .m-sm-auto { margin: auto !important; } .mt-sm-auto { margin-top: auto !important; } .mr-sm-auto { margin-right: auto !important; } .mb-sm-auto { margin-bottom: auto !important; } .ml-sm-auto { margin-left: auto !important; } .mx-sm-auto { margin-right: auto !important; margin-left: auto !important; } .my-sm-auto { margin-top: auto !important; margin-bottom: auto !important; }
}
@media (min-width: 768px) { .m-md-0 { margin: 0 0 !important; } .mt-md-0 { margin-top: 0 !important; } .mr-md-0 { margin-right: 0 !important; } .mb-md-0 { margin-bottom: 0 !important; } .ml-md-0 { margin-left: 0 !important; } .mx-md-0 { margin-right: 0 !important; margin-left: 0 !important; } .my-md-0 { margin-top: 0 !important; margin-bottom: 0 !important; } .m-md-1 { margin: .25rem .25rem !important; } .mt-md-1 { margin-top: .25rem !important; } .mr-md-1 { margin-right: .25rem !important; } .mb-md-1 { margin-bottom: .25rem !important; } .ml-md-1 { margin-left: .25rem !important; } .mx-md-1 { margin-right: .25rem !important; margin-left: .25rem !important; } .my-md-1 { margin-top: .25rem !important; margin-bottom: .25rem !important; } .m-md-2 { margin: .5rem .5rem !important; } .mt-md-2 { margin-top: .5rem !important; } .mr-md-2 { margin-right: .5rem !important; } .mb-md-2 { margin-bottom: .5rem !important; } .ml-md-2 { margin-left: .5rem !important; } .mx-md-2 { margin-right: .5rem !important; margin-left: .5rem !important; } .my-md-2 { margin-top: .5rem !important; margin-bottom: .5rem !important; } .m-md-3 { margin: 1rem 1rem !important; } .mt-md-3 { margin-top: 1rem !important; } .mr-md-3 { margin-right: 1rem !important; } .mb-md-3 { margin-bottom: 1rem !important; } .ml-md-3 { margin-left: 1rem !important; } .mx-md-3 { margin-right: 1rem !important; margin-left: 1rem !important; } .my-md-3 { margin-top: 1rem !important; margin-bottom: 1rem !important; } .m-md-4 { margin: 1.5rem 1.5rem !important; } .mt-md-4 { margin-top: 1.5rem !important; } .mr-md-4 { margin-right: 1.5rem !important; } .mb-md-4 { margin-bottom: 1.5rem !important; } .ml-md-4 { margin-left: 1.5rem !important; } .mx-md-4 { margin-right: 1.5rem !important; margin-left: 1.5rem !important; } .my-md-4 { margin-top: 1.5rem !important; margin-bottom: 1.5rem !important; } .m-md-5 { margin: 3rem 3rem !important; } .mt-md-5 { margin-top: 3rem !important; } .mr-md-5 { margin-right: 3rem !important; } .mb-md-5 { margin-bottom: 3rem !important; } .ml-md-5 { margin-left: 3rem !important; } .mx-md-5 { margin-right: 3rem !important; margin-left: 3rem !important; } .my-md-5 { margin-top: 3rem !important; margin-bottom: 3rem !important; } .p-md-0 { padding: 0 0 !important; } .pt-md-0 { padding-top: 0 !important; } .pr-md-0 { padding-right: 0 !important; } .pb-md-0 { padding-bottom: 0 !important; } .pl-md-0 { padding-left: 0 !important; } .px-md-0 { padding-right: 0 !important; padding-left: 0 !important; } .py-md-0 { padding-top: 0 !important; padding-bottom: 0 !important; } .p-md-1 { padding: .25rem .25rem !important; } .pt-md-1 { padding-top: .25rem !important; } .pr-md-1 { padding-right: .25rem !important; } .pb-md-1 { padding-bottom: .25rem !important; } .pl-md-1 { padding-left: .25rem !important; } .px-md-1 { padding-right: .25rem !important; padding-left: .25rem !important; } .py-md-1 { padding-top: .25rem !important; padding-bottom: .25rem !important; } .p-md-2 { padding: .5rem .5rem !important; } .pt-md-2 { padding-top: .5rem !important; } .pr-md-2 { padding-right: .5rem !important; } .pb-md-2 { padding-bottom: .5rem !important; } .pl-md-2 { padding-left: .5rem !important; } .px-md-2 { padding-right: .5rem !important; padding-left: .5rem !important; } .py-md-2 { padding-top: .5rem !important; padding-bottom: .5rem !important; } .p-md-3 { padding: 1rem 1rem !important; } .pt-md-3 { padding-top: 1rem !important; } .pr-md-3 { padding-right: 1rem !important; } .pb-md-3 { padding-bottom: 1rem !important; } .pl-md-3 { padding-left: 1rem !important; } .px-md-3 { padding-right: 1rem !important; padding-left: 1rem !important; } .py-md-3 { padding-top: 1rem !important; padding-bottom: 1rem !important; } .p-md-4 { padding: 1.5rem 1.5rem !important; } .pt-md-4 { padding-top: 1.5rem !important; } .pr-md-4 { padding-right: 1.5rem !important; } .pb-md-4 { padding-bottom: 1.5rem !important; } .pl-md-4 { padding-left: 1.5rem !important; } .px-md-4 { padding-right: 1.5rem !important; padding-left: 1.5rem !important; } .py-md-4 { padding-top: 1.5rem !important; padding-bottom: 1.5rem !important; } .p-md-5 { padding: 3rem 3rem !important; } .pt-md-5 { padding-top: 3rem !important; } .pr-md-5 { padding-right: 3rem !important; } .pb-md-5 { padding-bottom: 3rem !important; } .pl-md-5 { padding-left: 3rem !important; } .px-md-5 { padding-right: 3rem !important; padding-left: 3rem !important; } .py-md-5 { padding-top: 3rem !important; padding-bottom: 3rem !important; } .m-md-auto { margin: auto !important; } .mt-md-auto { margin-top: auto !important; } .mr-md-auto { margin-right: auto !important; } .mb-md-auto { margin-bottom: auto !important; } .ml-md-auto { margin-left: auto !important; } .mx-md-auto { margin-right: auto !important; margin-left: auto !important; } .my-md-auto { margin-top: auto !important; margin-bottom: auto !important; }
}
@media (min-width: 992px) { .m-lg-0 { margin: 0 0 !important; } .mt-lg-0 { margin-top: 0 !important; } .mr-lg-0 { margin-right: 0 !important; } .mb-lg-0 { margin-bottom: 0 !important; } .ml-lg-0 { margin-left: 0 !important; } .mx-lg-0 { margin-right: 0 !important; margin-left: 0 !important; } .my-lg-0 { margin-top: 0 !important; margin-bottom: 0 !important; } .m-lg-1 { margin: .25rem .25rem !important; } .mt-lg-1 { margin-top: .25rem !important; } .mr-lg-1 { margin-right: .25rem !important; } .mb-lg-1 { margin-bottom: .25rem !important; } .ml-lg-1 { margin-left: .25rem !important; } .mx-lg-1 { margin-right: .25rem !important; margin-left: .25rem !important; } .my-lg-1 { margin-top: .25rem !important; margin-bottom: .25rem !important; } .m-lg-2 { margin: .5rem .5rem !important; } .mt-lg-2 { margin-top: .5rem !important; } .mr-lg-2 { margin-right: .5rem !important; } .mb-lg-2 { margin-bottom: .5rem !important; } .ml-lg-2 { margin-left: .5rem !important; } .mx-lg-2 { margin-right: .5rem !important; margin-left: .5rem !important; } .my-lg-2 { margin-top: .5rem !important; margin-bottom: .5rem !important; } .m-lg-3 { margin: 1rem 1rem !important; } .mt-lg-3 { margin-top: 1rem !important; } .mr-lg-3 { margin-right: 1rem !important; } .mb-lg-3 { margin-bottom: 1rem !important; } .ml-lg-3 { margin-left: 1rem !important; } .mx-lg-3 { margin-right: 1rem !important; margin-left: 1rem !important; } .my-lg-3 { margin-top: 1rem !important; margin-bottom: 1rem !important; } .m-lg-4 { margin: 1.5rem 1.5rem !important; } .mt-lg-4 { margin-top: 1.5rem !important; } .mr-lg-4 { margin-right: 1.5rem !important; } .mb-lg-4 { margin-bottom: 1.5rem !important; } .ml-lg-4 { margin-left: 1.5rem !important; } .mx-lg-4 { margin-right: 1.5rem !important; margin-left: 1.5rem !important; } .my-lg-4 { margin-top: 1.5rem !important; margin-bottom: 1.5rem !important; } .m-lg-5 { margin: 3rem 3rem !important; } .mt-lg-5 { margin-top: 3rem !important; } .mr-lg-5 { margin-right: 3rem !important; } .mb-lg-5 { margin-bottom: 3rem !important; } .ml-lg-5 { margin-left: 3rem !important; } .mx-lg-5 { margin-right: 3rem !important; margin-left: 3rem !important; } .my-lg-5 { margin-top: 3rem !important; margin-bottom: 3rem !important; } .p-lg-0 { padding: 0 0 !important; } .pt-lg-0 { padding-top: 0 !important; } .pr-lg-0 { padding-right: 0 !important; } .pb-lg-0 { padding-bottom: 0 !important; } .pl-lg-0 { padding-left: 0 !important; } .px-lg-0 { padding-right: 0 !important; padding-left: 0 !important; } .py-lg-0 { padding-top: 0 !important; padding-bottom: 0 !important; } .p-lg-1 { padding: .25rem .25rem !important; } .pt-lg-1 { padding-top: .25rem !important; } .pr-lg-1 { padding-right: .25rem !important; } .pb-lg-1 { padding-bottom: .25rem !important; } .pl-lg-1 { padding-left: .25rem !important; } .px-lg-1 { padding-right: .25rem !important; padding-left: .25rem !important; } .py-lg-1 { padding-top: .25rem !important; padding-bottom: .25rem !important; } .p-lg-2 { padding: .5rem .5rem !important; } .pt-lg-2 { padding-top: .5rem !important; } .pr-lg-2 { padding-right: .5rem !important; } .pb-lg-2 { padding-bottom: .5rem !important; } .pl-lg-2 { padding-left: .5rem !important; } .px-lg-2 { padding-right: .5rem !important; padding-left: .5rem !important; } .py-lg-2 { padding-top: .5rem !important; padding-bottom: .5rem !important; } .p-lg-3 { padding: 1rem 1rem !important; } .pt-lg-3 { padding-top: 1rem !important; } .pr-lg-3 { padding-right: 1rem !important; } .pb-lg-3 { padding-bottom: 1rem !important; } .pl-lg-3 { padding-left: 1rem !important; } .px-lg-3 { padding-right: 1rem !important; padding-left: 1rem !important; } .py-lg-3 { padding-top: 1rem !important; padding-bottom: 1rem !important; } .p-lg-4 { padding: 1.5rem 1.5rem !important; } .pt-lg-4 { padding-top: 1.5rem !important; } .pr-lg-4 { padding-right: 1.5rem !important; } .pb-lg-4 { padding-bottom: 1.5rem !important; } .pl-lg-4 { padding-left: 1.5rem !important; } .px-lg-4 { padding-right: 1.5rem !important; padding-left: 1.5rem !important; } .py-lg-4 { padding-top: 1.5rem !important; padding-bottom: 1.5rem !important; } .p-lg-5 { padding: 3rem 3rem !important; } .pt-lg-5 { padding-top: 3rem !important; } .pr-lg-5 { padding-right: 3rem !important; } .pb-lg-5 { padding-bottom: 3rem !important; } .pl-lg-5 { padding-left: 3rem !important; } .px-lg-5 { padding-right: 3rem !important; padding-left: 3rem !important; } .py-lg-5 { padding-top: 3rem !important; padding-bottom: 3rem !important; } .m-lg-auto { margin: auto !important; } .mt-lg-auto { margin-top: auto !important; } .mr-lg-auto { margin-right: auto !important; } .mb-lg-auto { margin-bottom: auto !important; } .ml-lg-auto { margin-left: auto !important; } .mx-lg-auto { margin-right: auto !important; margin-left: auto !important; } .my-lg-auto { margin-top: auto !important; margin-bottom: auto !important; }
}
@media (min-width: 1200px) { .m-xl-0 { margin: 0 0 !important; } .mt-xl-0 { margin-top: 0 !important; } .mr-xl-0 { margin-right: 0 !important; } .mb-xl-0 { margin-bottom: 0 !important; } .ml-xl-0 { margin-left: 0 !important; } .mx-xl-0 { margin-right: 0 !important; margin-left: 0 !important; } .my-xl-0 { margin-top: 0 !important; margin-bottom: 0 !important; } .m-xl-1 { margin: .25rem .25rem !important; } .mt-xl-1 { margin-top: .25rem !important; } .mr-xl-1 { margin-right: .25rem !important; } .mb-xl-1 { margin-bottom: .25rem !important; } .ml-xl-1 { margin-left: .25rem !important; } .mx-xl-1 { margin-right: .25rem !important; margin-left: .25rem !important; } .my-xl-1 { margin-top: .25rem !important; margin-bottom: .25rem !important; } .m-xl-2 { margin: .5rem .5rem !important; } .mt-xl-2 { margin-top: .5rem !important; } .mr-xl-2 { margin-right: .5rem !important; } .mb-xl-2 { margin-bottom: .5rem !important; } .ml-xl-2 { margin-left: .5rem !important; } .mx-xl-2 { margin-right: .5rem !important; margin-left: .5rem !important; } .my-xl-2 { margin-top: .5rem !important; margin-bottom: .5rem !important; } .m-xl-3 { margin: 1rem 1rem !important; } .mt-xl-3 { margin-top: 1rem !important; } .mr-xl-3 { margin-right: 1rem !important; } .mb-xl-3 { margin-bottom: 1rem !important; } .ml-xl-3 { margin-left: 1rem !important; } .mx-xl-3 { margin-right: 1rem !important; margin-left: 1rem !important; } .my-xl-3 { margin-top: 1rem !important; margin-bottom: 1rem !important; } .m-xl-4 { margin: 1.5rem 1.5rem !important; } .mt-xl-4 { margin-top: 1.5rem !important; } .mr-xl-4 { margin-right: 1.5rem !important; } .mb-xl-4 { margin-bottom: 1.5rem !important; } .ml-xl-4 { margin-left: 1.5rem !important; } .mx-xl-4 { margin-right: 1.5rem !important; margin-left: 1.5rem !important; } .my-xl-4 { margin-top: 1.5rem !important; margin-bottom: 1.5rem !important; } .m-xl-5 { margin: 3rem 3rem !important; } .mt-xl-5 { margin-top: 3rem !important; } .mr-xl-5 { margin-right: 3rem !important; } .mb-xl-5 { margin-bottom: 3rem !important; } .ml-xl-5 { margin-left: 3rem !important; } .mx-xl-5 { margin-right: 3rem !important; margin-left: 3rem !important; } .my-xl-5 { margin-top: 3rem !important; margin-bottom: 3rem !important; } .p-xl-0 { padding: 0 0 !important; } .pt-xl-0 { padding-top: 0 !important; } .pr-xl-0 { padding-right: 0 !important; } .pb-xl-0 { padding-bottom: 0 !important; } .pl-xl-0 { padding-left: 0 !important; } .px-xl-0 { padding-right: 0 !important; padding-left: 0 !important; } .py-xl-0 { padding-top: 0 !important; padding-bottom: 0 !important; } .p-xl-1 { padding: .25rem .25rem !important; } .pt-xl-1 { padding-top: .25rem !important; } .pr-xl-1 { padding-right: .25rem !important; } .pb-xl-1 { padding-bottom: .25rem !important; } .pl-xl-1 { padding-left: .25rem !important; } .px-xl-1 { padding-right: .25rem !important; padding-left: .25rem !important; } .py-xl-1 { padding-top: .25rem !important; padding-bottom: .25rem !important; } .p-xl-2 { padding: .5rem .5rem !important; } .pt-xl-2 { padding-top: .5rem !important; } .pr-xl-2 { padding-right: .5rem !important; } .pb-xl-2 { padding-bottom: .5rem !important; } .pl-xl-2 { padding-left: .5rem !important; } .px-xl-2 { padding-right: .5rem !important; padding-left: .5rem !important; } .py-xl-2 { padding-top: .5rem !important; padding-bottom: .5rem !important; } .p-xl-3 { padding: 1rem 1rem !important; } .pt-xl-3 { padding-top: 1rem !important; } .pr-xl-3 { padding-right: 1rem !important; } .pb-xl-3 { padding-bottom: 1rem !important; } .pl-xl-3 { padding-left: 1rem !important; } .px-xl-3 { padding-right: 1rem !important; padding-left: 1rem !important; } .py-xl-3 { padding-top: 1rem !important; padding-bottom: 1rem !important; } .p-xl-4 { padding: 1.5rem 1.5rem !important; } .pt-xl-4 { padding-top: 1.5rem !important; } .pr-xl-4 { padding-right: 1.5rem !important; } .pb-xl-4 { padding-bottom: 1.5rem !important; } .pl-xl-4 { padding-left: 1.5rem !important; } .px-xl-4 { padding-right: 1.5rem !important; padding-left: 1.5rem !important; } .py-xl-4 { padding-top: 1.5rem !important; padding-bottom: 1.5rem !important; } .p-xl-5 { padding: 3rem 3rem !important; } .pt-xl-5 { padding-top: 3rem !important; } .pr-xl-5 { padding-right: 3rem !important; } .pb-xl-5 { padding-bottom: 3rem !important; } .pl-xl-5 { padding-left: 3rem !important; } .px-xl-5 { padding-right: 3rem !important; padding-left: 3rem !important; } .py-xl-5 { padding-top: 3rem !important; padding-bottom: 3rem !important; } .m-xl-auto { margin: auto !important; } .mt-xl-auto { margin-top: auto !important; } .mr-xl-auto { margin-right: auto !important; } .mb-xl-auto { margin-bottom: auto !important; } .ml-xl-auto { margin-left: auto !important; } .mx-xl-auto { margin-right: auto !important; margin-left: auto !important; } .my-xl-auto { margin-top: auto !important; margin-bottom: auto !important; }
}
.text-justify { text-align: justify !important;
}
.text-nowrap { white-space: nowrap !important;
}
.text-truncate { overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.text-left { text-align: left !important;
}
.text-right { text-align: right !important;
}
.text-center { text-align: center !important;
}
@media (min-width: 576px) { .text-sm-left { text-align: left !important; } .text-sm-right { text-align: right !important; } .text-sm-center { text-align: center !important; }
}
@media (min-width: 768px) { .text-md-left { text-align: left !important; } .text-md-right { text-align: right !important; } .text-md-center { text-align: center !important; }
}
@media (min-width: 992px) { .text-lg-left { text-align: left !important; } .text-lg-right { text-align: right !important; } .text-lg-center { text-align: center !important; }
}
@media (min-width: 1200px) { .text-xl-left { text-align: left !important; } .text-xl-right { text-align: right !important; } .text-xl-center { text-align: center !important; }
}
.text-lowercase { text-transform: lowercase !important;
}
.text-uppercase { text-transform: uppercase !important;
}
.text-capitalize { text-transform: capitalize !important;
}
.font-weight-normal { font-weight: normal;
}
.font-weight-bold { font-weight: bold;
}
.font-italic { font-style: italic;
}
.text-white { color: #fff !important;
}
.text-muted { color: #636c72 !important;
}
a.text-muted:focus, a.text-muted:hover { color: #4b5257 !important;
}
.text-primary { color: #6441a4 !important;
}
a.text-primary:focus, a.text-primary:hover { color: #4e337f !important;
}
.text-success { color: #5cb85c !important;
}
a.text-success:focus, a.text-success:hover { color: #449d44 !important;
}
.text-info { color: #5bc0de !important;
}
a.text-info:focus, a.text-info:hover { color: #31b0d5 !important;
}
.text-warning { color: #f0ad4e !important;
}
a.text-warning:focus, a.text-warning:hover { color: #ec971f !important;
}
.text-danger { color: #d9534f !important;
}
a.text-danger:focus, a.text-danger:hover { color: #c9302c !important;
}
.text-gray-dark { color: #292b2c !important;
}
a.text-gray-dark:focus, a.text-gray-dark:hover { color: #101112 !important;
}
.text-hide { font: 0/0 a; color: transparent; text-shadow: none; background-color: transparent; border: 0;
}
.invisible { visibility: hidden !important;
}
.hidden-xs-up { display: none !important;
}
@media (max-width: 575px) { .hidden-xs-down { display: none !important; }
}
@media (min-width: 576px) { .hidden-sm-up { display: none !important; }
}
@media (max-width: 767px) { .hidden-sm-down { display: none !important; }
}
@media (min-width: 768px) { .hidden-md-up { display: none !important; }
}
@media (max-width: 991px) { .hidden-md-down { display: none !important; }
}
@media (min-width: 992px) { .hidden-lg-up { display: none !important; }
}
@media (max-width: 1199px) { .hidden-lg-down { display: none !important; }
}
@media (min-width: 1200px) { .hidden-xl-up { display: none !important; }
}
.hidden-xl-down { display: none !important;
}
.visible-print-block { display: none !important;
}
@media print { .visible-print-block { display: block !important; }
}
.visible-print-inline { display: none !important;
}
@media print { .visible-print-inline { display: inline !important; }
}
.visible-print-inline-block { display: none !important;
}
@media print { .visible-print-inline-block { display: inline-block !important; }
}
@media print { .hidden-print { display: none !important; }
}

Twitch viewer - Script Codes JS Codes

// Define the `phonecatApp` module
var twitchApp = angular.module('twitchApp', []);
var users = ["ESL_SC2", "OgamingSC2", "cretetion", "freecodecamp", "storbeck", "habathcx", "RobotCaleb", "noobs2ninjas"];
// https://wind-bow.glitch.me/twitch-api/users/ESL_SC2
// https://wind-bow.glitch.me/twitch-api/channels/freecodecamp
// var channels = ["freecodecamp","test_channel","ESL_SC2"];
twitchApp.controller('ChannelController', function ChannelController($scope, $http, $sce){ var channels = ["freecodecamp","test_channel","ESL_SC2", "ukmasters", "OgamingSC2", "cretetion", "storbeck", "habathcx", "RobotCaleb", "noobs2ninjas"]; //var channels = ["ukmasters"]; $scope.channelsModel = []; $scope.streamModel = []; channels.forEach(function(channel) { function makeURL(type, id) { return 'https://wind-bow.gomix.me/twitch-api/' + type + '/' + id; }; var url = makeURL('streams', channel); var trustedUrl = $sce.trustAsResourceUrl(url); $http.jsonp(trustedUrl, {jsonpCallbackParam: 'callback'}) .then(function successCallback(response) { if (response.data.stream !== null){ console.log("Online"); $scope.streamModel.push(response.data); //refactor var url = makeURL('channels', channel); var trustedUrl = $sce.trustAsResourceUrl(url); channelRequest(trustedUrl, "Online"); } else if(response.data.stream === null ){ console.log("Offline"); onlineStatus = "Offline"; var url = makeURL('channels', channel); var trustedUrl = $sce.trustAsResourceUrl(url); channelRequest(trustedUrl, onlineStatus); } else if (response.data.stream === undefined) { console.log("Account Closed"); onlineStatus = "Account Closed"; // get request //channelRequest(makeURL('stream', channel), onlineStatus) } }, function errorCallback(response) { console.log(response); }); function channelRequest(trustedUrl, onlineStatus){ $http.jsonp(trustedUrl, {jsonpCallbackParam: 'callback'}) .then(function successCallback(response) { response.data.onlinestatus = onlineStatus; if(response.data.video_banner === null){ response.data.video_banner = 'https://dummyimage.com/600x400/6441a4/fcfcfc.png&text=6e6f7420666f756e64'; } if(response.data.logo === null){ response.data.logo = 'https://dummyimage.com/300x300/6441a4/fcfcfc.png&text=6c6f676f0d0a'; } $scope.channelsModel.push(response.data); }, function errorCallback(response) { console.log(response); }); } }); /* */ /* */ /* */ $scope.channels = [ { "status": "Some GoLang Today #go #golang #youtube", "display_name": "FreeCodeCamp", "name": "freecodecamp", "logo": "https://static-cdn.jtvnw.net/jtv_user_pictures/freecodecamp-profile_image-d9514f2df0962329-300x300.png", "video_banner": "https://static-cdn.jtvnw.net/jtv_user_pictures/freecodecamp-channel_offline_image-b8e133c78cd51cb0-1920x1080.png", "profile_banner": "https://static-cdn.jtvnw.net/jtv_user_pictures/freecodecamp-profile_banner-6f5e3445ff474aec-480.png", "url": "https://www.twitch.tv/freecodecamp", "views": 189385, "followers": 10989, "_id": 79776140, live: true }, { "status": "Some GoLang Today #go #golang #youtube", "display_name": "FreeCodeCamp", "name": "freecodecamp", "logo": "https://static-cdn.jtvnw.net/jtv_user_pictures/freecodecamp-profile_image-d9514f2df0962329-300x300.png", "video_banner": "https://static-cdn.jtvnw.net/jtv_user_pictures/freecodecamp-channel_offline_image-b8e133c78cd51cb0-1920x1080.png", "profile_banner": "https://static-cdn.jtvnw.net/jtv_user_pictures/freecodecamp-profile_banner-6f5e3445ff474aec-480.png", "url": "https://www.twitch.tv/freecodecamp", "views": 189385, "followers": 10989, "_id": 1, live: true }, { "status": "Some GoLang Today #go #golang #youtube", "display_name": "FreeCodeCamp", "name": "freecodecamp", "logo": "https://static-cdn.jtvnw.net/jtv_user_pictures/freecodecamp-profile_image-d9514f2df0962329-300x300.png", "video_banner": "https://static-cdn.jtvnw.net/jtv_user_pictures/freecodecamp-channel_offline_image-b8e133c78cd51cb0-1920x1080.png", "profile_banner": "https://static-cdn.jtvnw.net/jtv_user_pictures/freecodecamp-profile_banner-6f5e3445ff474aec-480.png", "url": "https://www.twitch.tv/freecodecamp", "views": 189385, "followers": 10989, "_id": 0, live: true }, ] //functions online, offline, all
});
twitchApp.controller('FavGameComponent', function FavGameComponent($scope){ //needs to be array $scope.games = [ { image: 'https://static-cdn.jtvnw.net/ttv-boxart/League%20of%20Legends-272x380.jpg', title: 'League of Legends' }, { image: 'https://static-cdn.jtvnw.net/ttv-boxart/PLAYERUNKNOWN%27S%20BATTLEGROUNDS-272x380.jpg', title: 'PLAYERUNKNOWN BATTLEGROUND' }, { image: 'https://static-cdn.jtvnw.net/ttv-boxart/Grand%20Theft%20Auto%20V-272x380.jpg', title: 'GTA V' }, { image: 'https://static-cdn.jtvnw.net/ttv-boxart/Dota%202-272x380.jpg', title: 'DOTA 2' }, { image: 'https://static-cdn.jtvnw.net/ttv-boxart/Counter-Strike:%20Global%20Offensive-272x380.jpg', title: 'Counter-Strike Global Offensive' }, { image: 'https://static-cdn.jtvnw.net/ttv-boxart/Overwatch-272x380.jpg', title: 'Overwatch' }, { image: 'https://static-cdn.jtvnw.net/ttv-boxart/Diablo%20III:%20Reaper%20of%20Souls-272x380.jpg', title: 'Diablo 20III Reaper of Souls' }, { image: 'https://static-cdn.jtvnw.net/ttv-boxart/Destiny-272x380.jpg', title: 'Destiny' }, { image: 'https://static-cdn.jtvnw.net/ttv-boxart/ARK-272x380.jpg', title: 'Ark' }, { image: 'https://static-cdn.jtvnw.net/ttv-boxart/Minecraft-272x380.jpg', title: 'Minecraft' }, /* { image: '', title: 'Overwatch' },
*/
{ image: 'https://static-cdn.jtvnw.net/ttv-boxart/Friday%20the%2013th:%20The%20Game-272x380.jpg', title: 'Friday the 13th: The game'
},
{ image: 'https://static-cdn.jtvnw.net/ttv-boxart/RuneScape-272x380.jpg', title: 'RuneScape'
}, ]
});
twitchApp.controller('StreamComponent', function StreamComponent($scope){ //needs to be array $scope.streams = [ { game: 'BATMAN - The Telltale Series', viewers: 7254, "preview": { "small": "https://static-cdn.jtvnw.net/previews-ttv/live_user_dansgaming-80x45.jpg", "medium": "https://static-cdn.jtvnw.net/previews-ttv/live_user_dansgaming-320x180.jpg", "large": "https://static-cdn.jtvnw.net/previews-ttv/live_user_dansgaming-640x360.jpg", "template": "https://static-cdn.jtvnw.net/previews-ttv/live_user_dansgaming-{width}x{height}.jpg" }, "channel": { "mature": false, "status": "Dan is Batman? - Telltale's Batman", "broadcaster_language": "en", "display_name": "DansGaming", "name": "dansgaming", "logo": "https://static-cdn.jtvnw.net/jtv_user_pictures/dansgaming-profile_image-76e4a4ab9388bc9c-300x300.png", "video_banner": "https://static-cdn.jtvnw.net/jtv_user_pictures/dansgaming-channel_offline_image-d3551503c24c08ad-1920x1080.png", "profile_banner": "https://static-cdn.jtvnw.net/jtv_user_pictures/dansgaming-profile_banner-4c2b8ece8cd010b4-480.jpeg", "url": "https://www.twitch.tv/dansgaming", "views": 63906830, "followers": 538598 } } ] $scope.setStream = function(){ }
});
Twitch viewer - Script Codes
Twitch viewer - Script Codes
Home Page Home
Developer Daniel
Username undreamtmayhem
Uploaded January 20, 2023
Rating 3
Size 37,236 Kb
Views 4,048
Do you need developer help for Twitch viewer?

Find the perfect freelance services for your business! Fiverr's mission is to change how the world works together. Fiverr connects businesses with freelancers offering digital services in 500+ categories. Find Developer!

Daniel (undreamtmayhem) Script Codes
Name
Wikipedia Viewer CodeCamp
Band page v1
A Pen by Daniel
CodeCamp build a Tribute page
Code camp portfolio
WeatherApp
JavaScript Calculator CodeCamp
Create amazing marketing copy with AI!

Jasper is the AI Content Generator that helps you and your team break through creative blocks to create amazing, original content 10X faster. Discover all the ways the Jasper AI Content Platform can help streamline your creative workflows. Start For Free!