Slate v2

Developer
Thomas Hare
Size
14,201 Kb
Views
10,120
  1. Slate v2 Previews
  2. Slate v2 HTML Codes
  3. Slate v2 CSS Codes
  4. Slate v2 JS Codes

How do I make an slate v2?

What is a slate v2? How do you make a slate v2? This script and codes were developed by Thomas Hare on 17 November 2022, Thursday.

Slate v2 Previews
IQ Test

Slate v2 - Script Codes HTML Codes

<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>slate v2</title> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/5.0.0/normalize.min.css"> <link rel='stylesheet prefetch' href='https://maxcdn.bootstrapcdn.com/font-awesome/latest/css/font-awesome.min.css'> <link rel="stylesheet" href="css/style.css">
</head>
<body> <div class="navbar" style="background-color: #FAFAFA;">	<div class="container">	<a class="brand-img" href="#">	<img alt="" src="https://cdn.rawgit.com/thomashare/slatecss/0596e2f6/img/slatecss-logo.png">	<span>Slate</span>	</a>	<span>Welcome!</span>	<a class="nav-toggle r md-hide" href="#"><i class="fa fa-bars"></i></a>	<ul class="nav r xs-hide md-show">	<li><a class="active" href="#">Lorem Ipsum</a></li>	<li><a href="#">Dolar Sit Amet</a></li>	<li><a href="#">Lorem Ipsum</a></li>	<li>	<a class="dropdown-toggle" href="#"><i class="fa fa-user-circle-o"></i> Tommy</a>	<ul class="dropdown-menu">	<li><a href="#">Account</a></li>	<li><a href="#">Edit Profile</a></li>	<li><a href="#">Saved</a></li>	</ul>	</li>	</ul>	</div>
</div>
<div class="container">	<div class="row">	<article class="xs-12 md-8 readable">	<h1 class="l">Article Title</h1>	<span class="r mt-6 block xs-clear xs-mx-0">Read Time <i class="fa fa-clock-o"></i> 3m</span>	<div class="clear meta">	<span>Written by Tommy, Today at 4PM</span>	</div>	<p>EARLY ON A STEAMY June morning in Plantation, Florida, Matt Steiner sits working at his parents’ 10-person dining room table. It’s the start of summer vacation, and he is joined by his buddy Chris, who is freshly home from his first year at college. <img alt="test image fit" class="r caption-bottom xs-12 md-5 mr--10 xs-mx-0 sm-mx-0" src="http://unsplash.it/300/435"></p>	<p>Between yawns the two send tweets<i class="dict">1</i> and check emails, but mostly they wait for 9 am. That’s when the pair will open access to <span class="hl ul">their website</span> for 60 minutes, just as they do every Thursday. During that hour, and that hour only, people can buy the use of Matt and Chris’ web bot.</p>	<aside class="l bold-box ml--6">	<p>Lorem Ipsum <br>Dolar Sit <br>Amet</p>	</aside>	<p>Finally the time comes. Within one minute, 10 orders have rolled in. By 9:04, that number has doubled. People are browsing the site from the UK, South Korea, Hong Kong, looking at images of limited-edition products. If they’re interested, they enter their address and payment informa­tion. If they want a hat, it’ll cost $10. For a T-shirt it’s $15. Hoodies are $20. To be clear, these aren’t prices for the shirts, hats, and hoodies; they’re the prices would-be shoppers pay to have a shot at buying the damn things when the apparel brand Supreme opens its own website and stores at 11 am.</p>	<p>More than 1,200 miles up the coast, in downtown Manhattan, people—mostly guys—are lined up outside Supreme’s NYC store for the same reason others are clicking on Matt and Chris’ website: to get their hands on gear. <img alt="We ordered EVERYTHING" class="tc l xs-6 md- caption-center ml--10 xs-mx-0 sm-mx-0" src="http://unsplash.it/280/420"> On the Supreme sub­reddit, photos are filtering in from shoppers who already got lucky in London and Paris, providing a valuable preview of what’s to come.</p>	<p>At 9:55, Matt and Chris are closing in on 10,000 visitors to their site. The problem is, on this Thursday their customers aren’t spending much money. Supreme releases only a handful of its seasonal collection each week, and this week’s drop isn’t a great one. The guys were hoping that the long-promised Everlast boxing bag would come out today, or at least the $200 basketball, covered with butterflies, designed by skating legend Mark Gonzales. Instead, the core of the drop is a series of T-shirts made in collaboration with a Jamaican musician from the ’80s. Most “hypebeasts”—the largely teenage and twenty­something consumers who obsess over streetwear and sneaker brands—are too young to know the <a href="#">dancehall stylings</a> of Barrington Levy. By the time Matt and Chris shut down their site to finalize details before the Supreme drop officially starts, they’ve topped out at 38 orders.</p>	<blockquote>“All right, it’s 10:59,” Chris announces, hovering between his two computers. Matt stands behind him, phone in hand, watching over Chris’ shoulder and nervously bouncing from foot to foot.</blockquote>	<aside class="r xs-12 md-4 mr--8 xs-mx-0 sm-mx-0">	<img alt="" class="fit" src="http://unsplash.it/300/300">	<p>Sometimes all it takes is ipsum</p>	<img alt="" class="fit" src="http://unsplash.it/300/100">	</aside>	<p>At precisely 11 am, their bot connects to Supreme’s servers, armed with all 38 customers’ shopping lists and credit card numbers, and efficiently completes the checkout process. It easily outpaces online shoppers who are trying to click through Supreme’s byzantine website, type in their billing information one keystroke at a time, and place orders before everything sells out—which it almost always does.</p>	<p><a href="#">Chris</a>, who didn’t want to reveal his last name, clicks over to a Gmail tab and checks his outbox. There are 38 newly sent messages, one automatically created for each person whose order was successfully filled. Completing them all took 19 seconds.</p>	</article>	<div class="xs-12">	<p class="footnote"><i class="dict">1</i> A message sent using the Twitter social network.</p>	</div>	<div class="xs-hide md-show md-4 pl-10 c-block">	<span class="txt-5 caps py-1">Popular</span>	<ul class="bt c-py-3">	<li class="">	<img alt="" class="xs-3" src="http://unsplash.it/50/50?random">	<p class="mt-0 pl-4 xs-9 txt-2">Lorem ipsum...</p>	</li>	</ul>	</div>	<div class="row">	<div class="xs-12">	<small class="tc">&copy; 2017 Lorem Ipsum</small>	</div>	</div>
</div> <script src='https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js'></script>
<script src='https://cdnjs.cloudflare.com/ajax/libs/hammer.js/2.0.8/hammer.min.js'></script> <script src="js/index.js"></script>
</body>
</html>

Slate v2 - Script Codes CSS Codes

@import url("https://fonts.googleapis.com/css?family=Libre+Baskerville");
*,
*:before,
*:after { box-sizing: border-box; letter-spacing: 0.03em; max-width: 100%;
}
.container { width: 100%;
}
.row { float: left; width: 100%;
}
.row:not(:first-child) { margin-top: 0.75em;
}
.row>* { float: left;
}
@media screen and (min-width: 0px) { .xs-1 { float: left; width: calc((100% / 12) * 1); } .xs-2 { float: left; width: calc((100% / 12) * 2); } .xs-3 { float: left; width: calc((100% / 12) * 3); } .xs-4 { float: left; width: calc((100% / 12) * 4); } .xs-5 { float: left; width: calc((100% / 12) * 5); } .xs-6 { float: left; width: calc((100% / 12) * 6); } .xs-7 { float: left; width: calc((100% / 12) * 7); } .xs-8 { float: left; width: calc((100% / 12) * 8); } .xs-9 { float: left; width: calc((100% / 12) * 9); } .xs-10 { float: left; width: calc((100% / 12) * 10); } .xs-11 { float: left; width: calc((100% / 12) * 11); } .xs-12 { float: left; width: calc((100% / 12) * 12); }
}
@media screen and (min-width: 576px) { .sm-1 { float: left; width: calc((100% / 12) * 1); } .sm-2 { float: left; width: calc((100% / 12) * 2); } .sm-3 { float: left; width: calc((100% / 12) * 3); } .sm-4 { float: left; width: calc((100% / 12) * 4); } .sm-5 { float: left; width: calc((100% / 12) * 5); } .sm-6 { float: left; width: calc((100% / 12) * 6); } .sm-7 { float: left; width: calc((100% / 12) * 7); } .sm-8 { float: left; width: calc((100% / 12) * 8); } .sm-9 { float: left; width: calc((100% / 12) * 9); } .sm-10 { float: left; width: calc((100% / 12) * 10); } .sm-11 { float: left; width: calc((100% / 12) * 11); } .sm-12 { float: left; width: calc((100% / 12) * 12); }
}
@media screen and (min-width: 768px) { .md-1 { float: left; width: calc((100% / 12) * 1); } .md-2 { float: left; width: calc((100% / 12) * 2); } .md-3 { float: left; width: calc((100% / 12) * 3); } .md-4 { float: left; width: calc((100% / 12) * 4); } .md-5 { float: left; width: calc((100% / 12) * 5); } .md-6 { float: left; width: calc((100% / 12) * 6); } .md-7 { float: left; width: calc((100% / 12) * 7); } .md-8 { float: left; width: calc((100% / 12) * 8); } .md-9 { float: left; width: calc((100% / 12) * 9); } .md-10 { float: left; width: calc((100% / 12) * 10); } .md-11 { float: left; width: calc((100% / 12) * 11); } .md-12 { float: left; width: calc((100% / 12) * 12); }
}
@media screen and (min-width: 992px) { .lg-1 { float: left; width: calc((100% / 12) * 1); } .lg-2 { float: left; width: calc((100% / 12) * 2); } .lg-3 { float: left; width: calc((100% / 12) * 3); } .lg-4 { float: left; width: calc((100% / 12) * 4); } .lg-5 { float: left; width: calc((100% / 12) * 5); } .lg-6 { float: left; width: calc((100% / 12) * 6); } .lg-7 { float: left; width: calc((100% / 12) * 7); } .lg-8 { float: left; width: calc((100% / 12) * 8); } .lg-9 { float: left; width: calc((100% / 12) * 9); } .lg-10 { float: left; width: calc((100% / 12) * 10); } .lg-11 { float: left; width: calc((100% / 12) * 11); } .lg-12 { float: left; width: calc((100% / 12) * 12); }
}
@media screen and (min-width: 1200px) { .xl-1 { float: left; width: calc((100% / 12) * 1); } .xl-2 { float: left; width: calc((100% / 12) * 2); } .xl-3 { float: left; width: calc((100% / 12) * 3); } .xl-4 { float: left; width: calc((100% / 12) * 4); } .xl-5 { float: left; width: calc((100% / 12) * 5); } .xl-6 { float: left; width: calc((100% / 12) * 6); } .xl-7 { float: left; width: calc((100% / 12) * 7); } .xl-8 { float: left; width: calc((100% / 12) * 8); } .xl-9 { float: left; width: calc((100% / 12) * 9); } .xl-10 { float: left; width: calc((100% / 12) * 10); } .xl-11 { float: left; width: calc((100% / 12) * 11); } .xl-12 { float: left; width: calc((100% / 12) * 12); }
}
@media screen and (min-width: 0px) { .xs-push-1 { margin-left: calc((100% / 12) * 1); } .xs-push-2 { margin-left: calc((100% / 12) * 2); } .xs-push-3 { margin-left: calc((100% / 12) * 3); } .xs-push-4 { margin-left: calc((100% / 12) * 4); } .xs-push-5 { margin-left: calc((100% / 12) * 5); } .xs-push-6 { margin-left: calc((100% / 12) * 6); } .xs-push-7 { margin-left: calc((100% / 12) * 7); } .xs-push-8 { margin-left: calc((100% / 12) * 8); } .xs-push-9 { margin-left: calc((100% / 12) * 9); } .xs-push-10 { margin-left: calc((100% / 12) * 10); } .xs-push-11 { margin-left: calc((100% / 12) * 11); } .xs-push-12 { margin-left: calc((100% / 12) * 12); }
}
@media screen and (min-width: 576px) { .sm-push-1 { margin-left: calc((100% / 12) * 1); } .sm-push-2 { margin-left: calc((100% / 12) * 2); } .sm-push-3 { margin-left: calc((100% / 12) * 3); } .sm-push-4 { margin-left: calc((100% / 12) * 4); } .sm-push-5 { margin-left: calc((100% / 12) * 5); } .sm-push-6 { margin-left: calc((100% / 12) * 6); } .sm-push-7 { margin-left: calc((100% / 12) * 7); } .sm-push-8 { margin-left: calc((100% / 12) * 8); } .sm-push-9 { margin-left: calc((100% / 12) * 9); } .sm-push-10 { margin-left: calc((100% / 12) * 10); } .sm-push-11 { margin-left: calc((100% / 12) * 11); } .sm-push-12 { margin-left: calc((100% / 12) * 12); }
}
@media screen and (min-width: 768px) { .md-push-1 { margin-left: calc((100% / 12) * 1); } .md-push-2 { margin-left: calc((100% / 12) * 2); } .md-push-3 { margin-left: calc((100% / 12) * 3); } .md-push-4 { margin-left: calc((100% / 12) * 4); } .md-push-5 { margin-left: calc((100% / 12) * 5); } .md-push-6 { margin-left: calc((100% / 12) * 6); } .md-push-7 { margin-left: calc((100% / 12) * 7); } .md-push-8 { margin-left: calc((100% / 12) * 8); } .md-push-9 { margin-left: calc((100% / 12) * 9); } .md-push-10 { margin-left: calc((100% / 12) * 10); } .md-push-11 { margin-left: calc((100% / 12) * 11); } .md-push-12 { margin-left: calc((100% / 12) * 12); }
}
@media screen and (min-width: 992px) { .lg-push-1 { margin-left: calc((100% / 12) * 1); } .lg-push-2 { margin-left: calc((100% / 12) * 2); } .lg-push-3 { margin-left: calc((100% / 12) * 3); } .lg-push-4 { margin-left: calc((100% / 12) * 4); } .lg-push-5 { margin-left: calc((100% / 12) * 5); } .lg-push-6 { margin-left: calc((100% / 12) * 6); } .lg-push-7 { margin-left: calc((100% / 12) * 7); } .lg-push-8 { margin-left: calc((100% / 12) * 8); } .lg-push-9 { margin-left: calc((100% / 12) * 9); } .lg-push-10 { margin-left: calc((100% / 12) * 10); } .lg-push-11 { margin-left: calc((100% / 12) * 11); } .lg-push-12 { margin-left: calc((100% / 12) * 12); }
}
@media screen and (min-width: 1200px) { .xl-push-1 { margin-left: calc((100% / 12) * 1); } .xl-push-2 { margin-left: calc((100% / 12) * 2); } .xl-push-3 { margin-left: calc((100% / 12) * 3); } .xl-push-4 { margin-left: calc((100% / 12) * 4); } .xl-push-5 { margin-left: calc((100% / 12) * 5); } .xl-push-6 { margin-left: calc((100% / 12) * 6); } .xl-push-7 { margin-left: calc((100% / 12) * 7); } .xl-push-8 { margin-left: calc((100% / 12) * 8); } .xl-push-9 { margin-left: calc((100% / 12) * 9); } .xl-push-10 { margin-left: calc((100% / 12) * 10); } .xl-push-11 { margin-left: calc((100% / 12) * 11); } .xl-push-12 { margin-left: calc((100% / 12) * 12); }
}
@media screen and (min-width: 0px) { .xs-hide { display: none; } .xs-hide.nav { clear: both; width: 100%; } .xs-hide.nav li { clear: both; display: block; position: relative; width: 100%; } .xs-hide.nav li a { padding: 1.75em 0.5em; } .xs-hide.nav .dropdown-menu { display: none; float: left; position: relative; top: 0; width: 100%; } .xs-show { display: block; } .xs-show.nav { clear: none; display: block !important; width: auto; } .xs-show.nav li { clear: none; display: block; float: left; width: auto; } .xs-show.nav li a { float: left !important; padding: 2em 0.65em; } .xs-show.nav .dropdown-toggle.toggled:after { -webkit-transform: rotate(90deg); transform: rotate(90deg); } .xs-show.nav .dropdown-menu { display: none; position: absolute; top: 4.05em; width: auto; } .xs-show.nav .dropdown-menu .dropdown-menu { position: relative; top: auto; } .xs-show.nav .dropdown-toggle + .dropdown-menu.toggled { display: block !important; }
}
@media screen and (min-width: 576px) { .sm-hide { display: none; } .sm-hide.nav { clear: both; width: 100%; } .sm-hide.nav li { clear: both; display: block; position: relative; width: 100%; } .sm-hide.nav li a { padding: 1.75em 0.5em; } .sm-hide.nav .dropdown-menu { display: none; float: left; position: relative; top: 0; width: 100%; } .sm-show { display: block; } .sm-show.nav { clear: none; display: block !important; width: auto; } .sm-show.nav li { clear: none; display: block; float: left; width: auto; } .sm-show.nav li a { float: left !important; padding: 2em 0.65em; } .sm-show.nav .dropdown-toggle.toggled:after { -webkit-transform: rotate(90deg); transform: rotate(90deg); } .sm-show.nav .dropdown-menu { display: none; position: absolute; top: 4.05em; width: auto; } .sm-show.nav .dropdown-menu .dropdown-menu { position: relative; top: auto; } .sm-show.nav .dropdown-toggle + .dropdown-menu.toggled { display: block !important; }
}
@media screen and (min-width: 768px) { .md-hide { display: none; } .md-hide.nav { clear: both; width: 100%; } .md-hide.nav li { clear: both; display: block; position: relative; width: 100%; } .md-hide.nav li a { padding: 1.75em 0.5em; } .md-hide.nav .dropdown-menu { display: none; float: left; position: relative; top: 0; width: 100%; } .md-show { display: block; } .md-show.nav { clear: none; display: block !important; width: auto; } .md-show.nav li { clear: none; display: block; float: left; width: auto; } .md-show.nav li a { float: left !important; padding: 2em 0.65em; } .md-show.nav .dropdown-toggle.toggled:after { -webkit-transform: rotate(90deg); transform: rotate(90deg); } .md-show.nav .dropdown-menu { display: none; position: absolute; top: 4.05em; width: auto; } .md-show.nav .dropdown-menu .dropdown-menu { position: relative; top: auto; } .md-show.nav .dropdown-toggle + .dropdown-menu.toggled { display: block !important; }
}
@media screen and (min-width: 992px) { .lg-hide { display: none; } .lg-hide.nav { clear: both; width: 100%; } .lg-hide.nav li { clear: both; display: block; position: relative; width: 100%; } .lg-hide.nav li a { padding: 1.75em 0.5em; } .lg-hide.nav .dropdown-menu { display: none; float: left; position: relative; top: 0; width: 100%; } .lg-show { display: block; } .lg-show.nav { clear: none; display: block !important; width: auto; } .lg-show.nav li { clear: none; display: block; float: left; width: auto; } .lg-show.nav li a { float: left !important; padding: 2em 0.65em; } .lg-show.nav .dropdown-toggle.toggled:after { -webkit-transform: rotate(90deg); transform: rotate(90deg); } .lg-show.nav .dropdown-menu { display: none; position: absolute; top: 4.05em; width: auto; } .lg-show.nav .dropdown-menu .dropdown-menu { position: relative; top: auto; } .lg-show.nav .dropdown-toggle + .dropdown-menu.toggled { display: block !important; }
}
@media screen and (min-width: 1200px) { .xl-hide { display: none; } .xl-hide.nav { clear: both; width: 100%; } .xl-hide.nav li { clear: both; display: block; position: relative; width: 100%; } .xl-hide.nav li a { padding: 1.75em 0.5em; } .xl-hide.nav .dropdown-menu { display: none; float: left; position: relative; top: 0; width: 100%; } .xl-show { display: block; } .xl-show.nav { clear: none; display: block !important; width: auto; } .xl-show.nav li { clear: none; display: block; float: left; width: auto; } .xl-show.nav li a { float: left !important; padding: 2em 0.65em; } .xl-show.nav .dropdown-toggle.toggled:after { -webkit-transform: rotate(90deg); transform: rotate(90deg); } .xl-show.nav .dropdown-menu { display: none; position: absolute; top: 4.05em; width: auto; } .xl-show.nav .dropdown-menu .dropdown-menu { position: relative; top: auto; } .xl-show.nav .dropdown-toggle + .dropdown-menu.toggled { display: block !important; }
}
.container { margin: 0 auto;
}
@media screen and (min-width: 534px) and (max-width: 567px) { .container { max-width: 520px; }
}
@media screen and (min-width: 568px) and (max-width: 639px) { .container { max-width: 560px; }
}
@media screen and (min-width: 640px) and (max-width: 859px) { .container { max-width: 620px; }
}
@media screen and (min-width: 860px) and (max-width: 1023px) { .container { max-width: 840px; }
}
@media screen and (min-width: 1024px) and (max-width: 1279px) { .container { max-width: 980px; }
}
@media screen and (min-width: 1280px) and (max-width: 1365px) { .container { max-width: 1150px; }
}
@media screen and (min-width: 1366px) and (max-width: 1919px) { .container { max-width: 1200px; }
}
@media screen and (min-width: 1920px) { .container { max-width: 1700px; }
}
.container .row,
.container-full .row { background: inherit;
}
.container .row > *:not(.navbar):not(.sidebar):not([class*='pb-']),
.container-full .row > *:not(.navbar):not(.sidebar):not([class*='pb-']) { padding-bottom: 0.75em;
}
.container .row > *:not(.navbar):not(.sidebar):not([class*='pl-']),
.container-full .row > *:not(.navbar):not(.sidebar):not([class*='pl-']) { padding-left: 0.75em;
}
.container .row > *:not(.navbar):not(.sidebar):not([class*='pr-']),
.container-full .row > *:not(.navbar):not(.sidebar):not([class*='pr-']) { padding-right: 0.75em;
}
.container .row > *:not(.navbar):not(.sidebar):not([class*='pt-']),
.container-full .row > *:not(.navbar):not(.sidebar):not([class*='pt-']) { padding-top: 0.75em;
}
html { font-family: -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", "Roboto", "Helvetica Neue", Arial, sans-serif false;
}
article { line-height: 2.19em;
}
article > *:not(.meta) { opacity: 0.75;
}
article .meta { opacity: 0.7;
}
.readable { font-family: 'Libre Baskerville'; font-size: 0.94em; text-align: justify;
}
.hl { background-color: #ff0;
}
.ul { text-decoration: underline;
}
.dict { color: #94c; font-size: smaller; font-style: italic; margin-left: 0.25em; margin-right: 0.5em; vertical-align: super;
}
.footnote { color: rgba(0,0,0,0.65);
}
img { display: block;
}
.l { margin-right: 1.5em;
}
.r { margin-left: 1.5em;
}
h1,
h2,
h3,
h4,
h5,
h6 { line-height: normal; margin-bottom: 0;
}
p { margin: 1.75em 0 0;
}
p img,
p .img-container { margin-bottom: 0.75em; margin-top: 0.75em;
}
.img-container { position: relative;
}
.img-container img { margin: 0; width: 100%;
}
.img-container img + .caption { background-color: rgba(0,0,0,0.75); bottom: 0; color: rgba(255,255,255,0.85); display: block; float: left; padding: 0.375em 0.75em; position: absolute; left: 0; width: 100%;
}
.img-container.caption-bottom .caption { bottom: 0;
}
.img-container.caption-top .caption { bottom: auto; top: 0;
}
.img-container.caption-center .caption { bottom: auto; -webkit-transform: translateY(-50%); transform: translateY(-50%); top: 50%;
}
blockquote { border-left: solid #8470ff 5px; margin: 0; padding-left: 1em; font-style: italic;
}
* + blockquote { margin-top: 1em;
}
a { text-decoration: none;
}
a:link,
a:focus,
a:active { color: #20109f;
}
a:hover { color: #2c16dc;
}
ol,
ul { margin: 0;
}
ol:not(.nav):not(.dropdown-menu) { padding-left: 2em;
}
ul:not(.nav):not(.dropdown-menu) { padding-left: 1em;
}
ul.bt { list-style: none; padding-left: 0 !important;
}
ul.bt li { border-top: solid #000 1px;
}
img.fit { max-width: 100%; -o-object-fit: cover; object-fit: cover; width: 100%;
}
aside { margin-bottom: 0.75em; margin-top: 0.75em;
}
aside.l { margin-right: 1.5em;
}
aside.r { margin-left: 1.5em;
}
aside > *:not(:first-child) { margin-top: 0.375em;
}
.bold-box { background-color: rgba(0,0,0,0.85); color: rgba(255,255,255,0.95); font-size: 1.15em; font-weight: bold; padding: 0.75em;
}
.bold-box-o { background: none; border: solid rgba(0,0,0,0.85) 5px; color: inherit;
}
.bold-box,
.bold-box-o { font-size: 1.25em; font-weight: bold; padding: 0.75em;
}
.bold-box > *:first-child,
.bold-box-o > *:first-child { margin: 0;
}
* + .idea { margin-top: 0.75em;
}
.dark,
.inversed { color: #fff;
}
.dark blockquote,
.inversed blockquote { border-color: #fff;
}
.navbar,
.navbar-full,
.navbar-top,
.navbar-bottom { padding-bottom: 0; border-radius: 4px; color: #404040; font-size: 0.95em; line-height: 0; margin-left: auto; margin-right: auto; position: relative; text-align: center; width: 100;
}
.navbar .container,
.navbar-full .container,
.navbar-top .container,
.navbar-bottom .container,
.navbar .container-full,
.navbar-full .container-full,
.navbar-top .container-full,
.navbar-bottom .container-full { display: inline-block; padding: 0 4px; text-align: initial;
}
.navbar .container > *:not(.brand):not(.brand-img):not(.nav):not(.nav-toggle),
.navbar-full .container > *:not(.brand):not(.brand-img):not(.nav):not(.nav-toggle),
.navbar-top .container > *:not(.brand):not(.brand-img):not(.nav):not(.nav-toggle),
.navbar-bottom .container > *:not(.brand):not(.brand-img):not(.nav):not(.nav-toggle),
.navbar .container-full > *:not(.brand):not(.brand-img):not(.nav):not(.nav-toggle),
.navbar-full .container-full > *:not(.brand):not(.brand-img):not(.nav):not(.nav-toggle),
.navbar-top .container-full > *:not(.brand):not(.brand-img):not(.nav):not(.nav-toggle),
.navbar-bottom .container-full > *:not(.brand):not(.brand-img):not(.nav):not(.nav-toggle) { float: left; padding: 1.8em 0.75em 0.5em;
}
.navbar .container-full,
.navbar-full .container-full,
.navbar-top .container-full,
.navbar-bottom .container-full { width: 100%;
}
.navbar-full,
.navbar-bottom,
.navbar-top { border-radius: 0; width: 100%;
}
.navbar-full .container,
.navbar-bottom .container,
.navbar-top .container { max-width: 100%;
}
[class^='navbar'],
[class*=' navbar'] { z-index: 1;
}
[class^='navbar'] a,
[class*=' navbar'] a { color: inherit; text-decoration: none;
}
[class^='navbar'] .brand,
[class*=' navbar'] .brand,
[class^='navbar'] .brand-img,
[class*=' navbar'] .brand-img { float: left; font-size: 1.35em; z-index: 999;
}
[class^='navbar'] .brand img,
[class*=' navbar'] .brand img,
[class^='navbar'] .brand-img img,
[class*=' navbar'] .brand-img img { display: inline-block; margin-right: 0.25em; max-height: 1.46em; vertical-align: middle;
}
[class^='navbar'] .brand,
[class*=' navbar'] .brand { opacity: 0.8; padding: 1.35em 0.5em 0;
}
[class^='navbar'] .brand-img,
[class*=' navbar'] .brand-img { padding: 0.6em 0.5em; white-space: nowrap;
}
[class^='navbar'] .brand-img > :not(img),
[class*=' navbar'] .brand-img > :not(img) { opacity: 0.8; vertical-align: middle;
}
[class^='navbar'] .nav,
[class*=' navbar'] .nav { font-size: 0.9em;
}
[class^='navbar'] .nav *,
[class*=' navbar'] .nav * { line-height: inherit;
}
[class^='navbar'] .nav-toggle,
[class*=' navbar'] .nav-toggle { font-size: 1.85em; opacity: 0.55; padding: 0.5em 0.5em; z-index: 999;
}
[class^='navbar'] .nav li,
[class*=' navbar'] .nav li { float: left; padding: 0 2px;
}
[class^='navbar'] .nav li:not(:last-child),
[class*=' navbar'] .nav li:not(:last-child) { margin-right: 0;
}
[class^='navbar'] .nav a,
[class*=' navbar'] .nav a { color: inherit; display: block; opacity: 0.75; padding: 2em 0.65em;
}
[class^='navbar'] .nav a:hover,
[class*=' navbar'] .nav a:hover,
[class^='navbar'] .nav a.active,
[class*=' navbar'] .nav a.active { opacity: 0.95;
}
[class^='navbar'] .nav a.active,
[class*=' navbar'] .nav a.active { background-color: #e8e8e8;
}
.navbar-bottom,
.navbar-top { left: 0; position: fixed;
}
.navbar-bottom { bottom: 0; box-shadow: inset 0 1px 0 rgba(255,255,255,0.5), 0 -1px 10px rgba(0,0,0,0.15);
}
.navbar-full,
.navbar-top { box-shadow: inset 0 -1px 0 rgba(255,255,255,0.5), 0 1px 10px rgba(0,0,0,0.15);
}
.navbar-top { top: 0;
}
.navbar-top + .container { margin-top: 3.65em;
}
.navbar-bottom + .container { margin-bottom: 3.65em;
}
.nav { list-style: none; padding-left: 0;
}
.nav li { display: inline-block;
}
.nav li:not(:last-child) { margin-right: 1em;
}
.nav li a { display: block;
}
.nav.block li { display: block; margin-right: 0;
}
.sidebar { padding: 1.5em 0.75em;
}
.sidebar > * { float: left; margin: 0 0 0.75em; width: 100%;
}
.sidebar > * > * { float: left; margin-bottom: 0.375em; width: 100%;
}
.sidebar .nav li { display: block;
}
.sidebar .nav li a { color: inherit;
}
.dropdown-toggle { height: 0; position: relative;
}
.dropdown-toggle + .dropdown-menu:not('.toggled') { display: none;
}
.dropdown-toggle:after { content: '\2023'; display: inline-block; font-size: 1.75em; margin-left: 0.05em; opacity: 0.75; -webkit-transform: rotate(90deg); transform: rotate(90deg); -webkit-transition: -webkit-transform 0.3s ease; transition: -webkit-transform 0.3s ease; transition: transform 0.3s ease; transition: transform 0.3s ease, -webkit-transform 0.3s ease; vertical-align: middle;
}
.dropdown-toggle.toggled:after { content: '\2023'; -webkit-transform: rotate(0deg); transform: rotate(0deg);
}
.nav .dropdown-menu { border-radius: 0 0 3px 3px; box-shadow: inset 0 1px 1px rgba(255,255,255,0.15), 0 1px 2px rgba(0,0,0,0.25); float: left; margin-bottom: 5px; padding: 3px 0; position: absolute; top: 4.05em; z-index: 3;
}
.nav .dropdown-menu li { width: 100%;
}
.nav .dropdown-menu li a { padding: 1.25em 0.5em; width: 100%;
}
form { float: left; width: 100%;
}
form .group { float: left; width: 100%;
}
form .group:not(:first-child) { border-top: solid rgba(0,0,0,0.05) 1px; box-shadow: inset 0 1px 0 rgba(255,255,255,0.075); margin-top: 0.75em; padding-top: 0.75em;
}
form .group + *:not(.group) { margin-top: 1em;
}
form .group input:first-child { border-radius: 2px 0 0 2px;
}
form .group input:last-child { border-radius: 0 2px 2px 0;
}
form input { background-color: #fff; border-width: 0 !important; box-shadow: inset 0 0 1px rgba(0,0,0,0.5); box-sizing: border-box; display: block; float: left; margin: 0; padding: 0.375em 0.5625em;
}
form input[type=button],
form input[type=submit] { background: #696; box-shadow: inset 0 0 1px rgba(255,255,255,0.5), 0 0 1px rgba(0,0,0,0.5); color: rgba(255,255,255,0.75); cursor: pointer;
}
.l { float: left !important;
}
.r { float: right !important;
}
.tl,
.tc,
.tr { display: block;
}
.tl { text-align: left;
}
.tc { text-align: center;
}
.tr { text-align: right;
}
.txt-1 { font-size: 0.4em;
}
.txt-2 { font-size: 0.8em;
}
.txt-3 { font-size: 1.2em;
}
.txt-4 { font-size: 1.6em;
}
.txt-5 { font-size: 2em;
}
.txt-6 { font-size: 2.4em;
}
.txt-7 { font-size: 2.8em;
}
.txt-8 { font-size: 3.2em;
}
.txt-9 { font-size: 3.6em;
}
.txt-10 { font-size: 4em;
}
.caps { text-transform: uppercase;
}
.hide { display: none;
}
.block,
.c-block > * { display: block;
}
.inline,
.c-inline > * { display: inline;
}
.i-block,
.c-i-block > * { display: inline-block;
}
.inversed { background: #000;
}
.inversed [class^='navbar'],
.inversed [class*=' navbar'],
.inversed .dropdown-menu { background: #000; color: rgba(255,255,255,0.85);
}
.inversed [class^='navbar'] a,
.inversed [class*=' navbar'] a,
.inversed .dropdown-menu a { background: inherit !important; color: inherit;
}
.inversed [class^='navbar'] .dropdown-menu,
.inversed [class*=' navbar'] .dropdown-menu,
.inversed .dropdown-menu .dropdown-menu { box-shadow: 0 0 3px rgba(255,255,255,0.85);
}
.inversed *,
.inversed *:before,
.inversed *:after,
.inversed border-color: #FFF,
.inversed color: #FFF !important,
.inversed img { background-color: none !important;
}
.inversed a,
.inversed blockquote,
.inversed i,
.inversed p,
.inversed span { opacity: 0.85;
}
.inversed p a { background-color: #fff !important; color: #000 !important; padding: 0 0.25em;
}
.inversed *:not([class*='navbar']) a:focus { opacity: 1; outline: solid #c0f 2px; position: relative;
}
.inversed .hl { background-color: #fff; color: #000;
}
.c-mx-0 > * { margin-left: 0em; margin-right: 0em;
}
.c-my-0 > * { margin-bottom: 0em; margin-top: 0em;
}
.c-px-0 > * { padding-left: 0em; padding-right: 0em;
}
.c-py-0 > * { padding-bottom: 0em; padding-top: 0em;
}
.mx-0 { margin-left: 0em; margin-right: 0em;
}
.my-0 { margin-bottom: 0em; margin-top: 0em;
}
.px-0 { padding-left: 0em; padding-right: 0em;
}
.py-0 { padding-bottom: 0em; padding-top: 0em;
}
.c-mb-0 > * { margin-bottom: 0em;
}
.c-ml-0 > * { margin-left: 0em;
}
.c-mr-0 > * { margin-right: 0em;
}
.c-mt-0 > * { margin-top: 0em;
}
.mb-0 { margin-bottom: 0em;
}
.ml-0 { margin-left: 0em;
}
.ml--0 { margin-left: 0em;
}
.mr-0 { margin-right: 0em;
}
.mr--0 { margin-right: 0em;
}
.mt-0 { margin-top: 0em;
}
.pb-0 { padding-bottom: 0em;
}
.pl-0 { padding-left: 0em;
}
.pr-0 { padding-right: 0em;
}
.pt-0 { padding-top: 0em;
}
.c-mx-1 > * { margin-left: 0.25em; margin-right: 0.25em;
}
.c-my-1 > * { margin-bottom: 0.25em; margin-top: 0.25em;
}
.c-px-1 > * { padding-left: 0.25em; padding-right: 0.25em;
}
.c-py-1 > * { padding-bottom: 0.25em; padding-top: 0.25em;
}
.mx-1 { margin-left: 0.25em; margin-right: 0.25em;
}
.my-1 { margin-bottom: 0.25em; margin-top: 0.25em;
}
.px-1 { padding-left: 0.25em; padding-right: 0.25em;
}
.py-1 { padding-bottom: 0.25em; padding-top: 0.25em;
}
.c-mb-1 > * { margin-bottom: 0.25em;
}
.c-ml-1 > * { margin-left: 0.25em;
}
.c-mr-1 > * { margin-right: 0.25em;
}
.c-mt-1 > * { margin-top: 0.25em;
}
.mb-1 { margin-bottom: 0.25em;
}
.ml-1 { margin-left: 0.25em;
}
.ml--1 { margin-left: -0.25em;
}
.mr-1 { margin-right: 0.25em;
}
.mr--1 { margin-right: -0.25em;
}
.mt-1 { margin-top: 0.25em;
}
.pb-1 { padding-bottom: 0.25em;
}
.pl-1 { padding-left: 0.25em;
}
.pr-1 { padding-right: 0.25em;
}
.pt-1 { padding-top: 0.25em;
}
.c-mx-2 > * { margin-left: 0.5em; margin-right: 0.5em;
}
.c-my-2 > * { margin-bottom: 0.5em; margin-top: 0.5em;
}
.c-px-2 > * { padding-left: 0.5em; padding-right: 0.5em;
}
.c-py-2 > * { padding-bottom: 0.5em; padding-top: 0.5em;
}
.mx-2 { margin-left: 0.5em; margin-right: 0.5em;
}
.my-2 { margin-bottom: 0.5em; margin-top: 0.5em;
}
.px-2 { padding-left: 0.5em; padding-right: 0.5em;
}
.py-2 { padding-bottom: 0.5em; padding-top: 0.5em;
}
.c-mb-2 > * { margin-bottom: 0.5em;
}
.c-ml-2 > * { margin-left: 0.5em;
}
.c-mr-2 > * { margin-right: 0.5em;
}
.c-mt-2 > * { margin-top: 0.5em;
}
.mb-2 { margin-bottom: 0.5em;
}
.ml-2 { margin-left: 0.5em;
}
.ml--2 { margin-left: -0.5em;
}
.mr-2 { margin-right: 0.5em;
}
.mr--2 { margin-right: -0.5em;
}
.mt-2 { margin-top: 0.5em;
}
.pb-2 { padding-bottom: 0.5em;
}
.pl-2 { padding-left: 0.5em;
}
.pr-2 { padding-right: 0.5em;
}
.pt-2 { padding-top: 0.5em;
}
.c-mx-3 > * { margin-left: 0.75em; margin-right: 0.75em;
}
.c-my-3 > * { margin-bottom: 0.75em; margin-top: 0.75em;
}
.c-px-3 > * { padding-left: 0.75em; padding-right: 0.75em;
}
.c-py-3 > * { padding-bottom: 0.75em; padding-top: 0.75em;
}
.mx-3 { margin-left: 0.75em; margin-right: 0.75em;
}
.my-3 { margin-bottom: 0.75em; margin-top: 0.75em;
}
.px-3 { padding-left: 0.75em; padding-right: 0.75em;
}
.py-3 { padding-bottom: 0.75em; padding-top: 0.75em;
}
.c-mb-3 > * { margin-bottom: 0.75em;
}
.c-ml-3 > * { margin-left: 0.75em;
}
.c-mr-3 > * { margin-right: 0.75em;
}
.c-mt-3 > * { margin-top: 0.75em;
}
.mb-3 { margin-bottom: 0.75em;
}
.ml-3 { margin-left: 0.75em;
}
.ml--3 { margin-left: -0.75em;
}
.mr-3 { margin-right: 0.75em;
}
.mr--3 { margin-right: -0.75em;
}
.mt-3 { margin-top: 0.75em;
}
.pb-3 { padding-bottom: 0.75em;
}
.pl-3 { padding-left: 0.75em;
}
.pr-3 { padding-right: 0.75em;
}
.pt-3 { padding-top: 0.75em;
}
.c-mx-4 > * { margin-left: 1em; margin-right: 1em;
}
.c-my-4 > * { margin-bottom: 1em; margin-top: 1em;
}
.c-px-4 > * { padding-left: 1em; padding-right: 1em;
}
.c-py-4 > * { padding-bottom: 1em; padding-top: 1em;
}
.mx-4 { margin-left: 1em; margin-right: 1em;
}
.my-4 { margin-bottom: 1em; margin-top: 1em;
}
.px-4 { padding-left: 1em; padding-right: 1em;
}
.py-4 { padding-bottom: 1em; padding-top: 1em;
}
.c-mb-4 > * { margin-bottom: 1em;
}
.c-ml-4 > * { margin-left: 1em;
}
.c-mr-4 > * { margin-right: 1em;
}
.c-mt-4 > * { margin-top: 1em;
}
.mb-4 { margin-bottom: 1em;
}
.ml-4 { margin-left: 1em;
}
.ml--4 { margin-left: -1em;
}
.mr-4 { margin-right: 1em;
}
.mr--4 { margin-right: -1em;
}
.mt-4 { margin-top: 1em;
}
.pb-4 { padding-bottom: 1em;
}
.pl-4 { padding-left: 1em;
}
.pr-4 { padding-right: 1em;
}
.pt-4 { padding-top: 1em;
}
.c-mx-5 > * { margin-left: 1.25em; margin-right: 1.25em;
}
.c-my-5 > * { margin-bottom: 1.25em; margin-top: 1.25em;
}
.c-px-5 > * { padding-left: 1.25em; padding-right: 1.25em;
}
.c-py-5 > * { padding-bottom: 1.25em; padding-top: 1.25em;
}
.mx-5 { margin-left: 1.25em; margin-right: 1.25em;
}
.my-5 { margin-bottom: 1.25em; margin-top: 1.25em;
}
.px-5 { padding-left: 1.25em; padding-right: 1.25em;
}
.py-5 { padding-bottom: 1.25em; padding-top: 1.25em;
}
.c-mb-5 > * { margin-bottom: 1.25em;
}
.c-ml-5 > * { margin-left: 1.25em;
}
.c-mr-5 > * { margin-right: 1.25em;
}
.c-mt-5 > * { margin-top: 1.25em;
}
.mb-5 { margin-bottom: 1.25em;
}
.ml-5 { margin-left: 1.25em;
}
.ml--5 { margin-left: -1.25em;
}
.mr-5 { margin-right: 1.25em;
}
.mr--5 { margin-right: -1.25em;
}
.mt-5 { margin-top: 1.25em;
}
.pb-5 { padding-bottom: 1.25em;
}
.pl-5 { padding-left: 1.25em;
}
.pr-5 { padding-right: 1.25em;
}
.pt-5 { padding-top: 1.25em;
}
.c-mx-6 > * { margin-left: 1.5em; margin-right: 1.5em;
}
.c-my-6 > * { margin-bottom: 1.5em; margin-top: 1.5em;
}
.c-px-6 > * { padding-left: 1.5em; padding-right: 1.5em;
}
.c-py-6 > * { padding-bottom: 1.5em; padding-top: 1.5em;
}
.mx-6 { margin-left: 1.5em; margin-right: 1.5em;
}
.my-6 { margin-bottom: 1.5em; margin-top: 1.5em;
}
.px-6 { padding-left: 1.5em; padding-right: 1.5em;
}
.py-6 { padding-bottom: 1.5em; padding-top: 1.5em;
}
.c-mb-6 > * { margin-bottom: 1.5em;
}
.c-ml-6 > * { margin-left: 1.5em;
}
.c-mr-6 > * { margin-right: 1.5em;
}
.c-mt-6 > * { margin-top: 1.5em;
}
.mb-6 { margin-bottom: 1.5em;
}
.ml-6 { margin-left: 1.5em;
}
.ml--6 { margin-left: -1.5em;
}
.mr-6 { margin-right: 1.5em;
}
.mr--6 { margin-right: -1.5em;
}
.mt-6 { margin-top: 1.5em;
}
.pb-6 { padding-bottom: 1.5em;
}
.pl-6 { padding-left: 1.5em;
}
.pr-6 { padding-right: 1.5em;
}
.pt-6 { padding-top: 1.5em;
}
.c-mx-7 > * { margin-left: 1.75em; margin-right: 1.75em;
}
.c-my-7 > * { margin-bottom: 1.75em; margin-top: 1.75em;
}
.c-px-7 > * { padding-left: 1.75em; padding-right: 1.75em;
}
.c-py-7 > * { padding-bottom: 1.75em; padding-top: 1.75em;
}
.mx-7 { margin-left: 1.75em; margin-right: 1.75em;
}
.my-7 { margin-bottom: 1.75em; margin-top: 1.75em;
}
.px-7 { padding-left: 1.75em; padding-right: 1.75em;
}
.py-7 { padding-bottom: 1.75em; padding-top: 1.75em;
}
.c-mb-7 > * { margin-bottom: 1.75em;
}
.c-ml-7 > * { margin-left: 1.75em;
}
.c-mr-7 > * { margin-right: 1.75em;
}
.c-mt-7 > * { margin-top: 1.75em;
}
.mb-7 { margin-bottom: 1.75em;
}
.ml-7 { margin-left: 1.75em;
}
.ml--7 { margin-left: -1.75em;
}
.mr-7 { margin-right: 1.75em;
}
.mr--7 { margin-right: -1.75em;
}
.mt-7 { margin-top: 1.75em;
}
.pb-7 { padding-bottom: 1.75em;
}
.pl-7 { padding-left: 1.75em;
}
.pr-7 { padding-right: 1.75em;
}
.pt-7 { padding-top: 1.75em;
}
.c-mx-8 > * { margin-left: 2em; margin-right: 2em;
}
.c-my-8 > * { margin-bottom: 2em; margin-top: 2em;
}
.c-px-8 > * { padding-left: 2em; padding-right: 2em;
}
.c-py-8 > * { padding-bottom: 2em; padding-top: 2em;
}
.mx-8 { margin-left: 2em; margin-right: 2em;
}
.my-8 { margin-bottom: 2em; margin-top: 2em;
}
.px-8 { padding-left: 2em; padding-right: 2em;
}
.py-8 { padding-bottom: 2em; padding-top: 2em;
}
.c-mb-8 > * { margin-bottom: 2em;
}
.c-ml-8 > * { margin-left: 2em;
}
.c-mr-8 > * { margin-right: 2em;
}
.c-mt-8 > * { margin-top: 2em;
}
.mb-8 { margin-bottom: 2em;
}
.ml-8 { margin-left: 2em;
}
.ml--8 { margin-left: -2em;
}
.mr-8 { margin-right: 2em;
}
.mr--8 { margin-right: -2em;
}
.mt-8 { margin-top: 2em;
}
.pb-8 { padding-bottom: 2em;
}
.pl-8 { padding-left: 2em;
}
.pr-8 { padding-right: 2em;
}
.pt-8 { padding-top: 2em;
}
.c-mx-9 > * { margin-left: 2.25em; margin-right: 2.25em;
}
.c-my-9 > * { margin-bottom: 2.25em; margin-top: 2.25em;
}
.c-px-9 > * { padding-left: 2.25em; padding-right: 2.25em;
}
.c-py-9 > * { padding-bottom: 2.25em; padding-top: 2.25em;
}
.mx-9 { margin-left: 2.25em; margin-right: 2.25em;
}
.my-9 { margin-bottom: 2.25em; margin-top: 2.25em;
}
.px-9 { padding-left: 2.25em; padding-right: 2.25em;
}
.py-9 { padding-bottom: 2.25em; padding-top: 2.25em;
}
.c-mb-9 > * { margin-bottom: 2.25em;
}
.c-ml-9 > * { margin-left: 2.25em;
}
.c-mr-9 > * { margin-right: 2.25em;
}
.c-mt-9 > * { margin-top: 2.25em;
}
.mb-9 { margin-bottom: 2.25em;
}
.ml-9 { margin-left: 2.25em;
}
.ml--9 { margin-left: -2.25em;
}
.mr-9 { margin-right: 2.25em;
}
.mr--9 { margin-right: -2.25em;
}
.mt-9 { margin-top: 2.25em;
}
.pb-9 { padding-bottom: 2.25em;
}
.pl-9 { padding-left: 2.25em;
}
.pr-9 { padding-right: 2.25em;
}
.pt-9 { padding-top: 2.25em;
}
.c-mx-10 > * { margin-left: 2.5em; margin-right: 2.5em;
}
.c-my-10 > * { margin-bottom: 2.5em; margin-top: 2.5em;
}
.c-px-10 > * { padding-left: 2.5em; padding-right: 2.5em;
}
.c-py-10 > * { padding-bottom: 2.5em; padding-top: 2.5em;
}
.mx-10 { margin-left: 2.5em; margin-right: 2.5em;
}
.my-10 { margin-bottom: 2.5em; margin-top: 2.5em;
}
.px-10 { padding-left: 2.5em; padding-right: 2.5em;
}
.py-10 { padding-bottom: 2.5em; padding-top: 2.5em;
}
.c-mb-10 > * { margin-bottom: 2.5em;
}
.c-ml-10 > * { margin-left: 2.5em;
}
.c-mr-10 > * { margin-right: 2.5em;
}
.c-mt-10 > * { margin-top: 2.5em;
}
.mb-10 { margin-bottom: 2.5em;
}
.ml-10 { margin-left: 2.5em;
}
.ml--10 { margin-left: -2.5em;
}
.mr-10 { margin-right: 2.5em;
}
.mr--10 { margin-right: -2.5em;
}
.mt-10 { margin-top: 2.5em;
}
.pb-10 { padding-bottom: 2.5em;
}
.pl-10 { padding-left: 2.5em;
}
.pr-10 { padding-right: 2.5em;
}
.pt-10 { padding-top: 2.5em;
}
@media screen and (min-width: 0px) and (max-width: 576px) { .xs-mb-0 { margin-bottom: 0; } .xs-ml-0 { margin-left: 0; } .xs-mr-0 { margin-right: 0; } .xs-mt-0 { margin-top: 0; } .xs-mx-0 { margin-left: 0; margin-right: 0; } .xs-my-0 { margin-bottom: 0; margin-top: 0; } .xs-pb-0 { padding-bottom: 0; } .xs-pl-0 { padding-left: 0; } .xs-pr-0 { padding-right: 0; } .xs-pt-0 { padding-top: 0; } .xs-px-0 { padding-left: 0; padding-right: 0; } .xs-py-0 { padding-bottom: 0; padding-top: 0; }
}
@media screen and (min-width: 576px) and (max-width: 768px) { .sm-mb-0 { margin-bottom: 0; } .sm-ml-0 { margin-left: 0; } .sm-mr-0 { margin-right: 0; } .sm-mt-0 { margin-top: 0; } .sm-mx-0 { margin-left: 0; margin-right: 0; } .sm-my-0 { margin-bottom: 0; margin-top: 0; } .sm-pb-0 { padding-bottom: 0; } .sm-pl-0 { padding-left: 0; } .sm-pr-0 { padding-right: 0; } .sm-pt-0 { padding-top: 0; } .sm-px-0 { padding-left: 0; padding-right: 0; } .sm-py-0 { padding-bottom: 0; padding-top: 0; }
}
@media screen and (min-width: 768px) and (max-width: 992px) { .md-mb-0 { margin-bottom: 0; } .md-ml-0 { margin-left: 0; } .md-mr-0 { margin-right: 0; } .md-mt-0 { margin-top: 0; } .md-mx-0 { margin-left: 0; margin-right: 0; } .md-my-0 { margin-bottom: 0; margin-top: 0; } .md-pb-0 { padding-bottom: 0; } .md-pl-0 { padding-left: 0; } .md-pr-0 { padding-right: 0; } .md-pt-0 { padding-top: 0; } .md-px-0 { padding-left: 0; padding-right: 0; } .md-py-0 { padding-bottom: 0; padding-top: 0; }
}
@media screen and (min-width: 992px) and (max-width: 1200px) { .lg-mb-0 { margin-bottom: 0; } .lg-ml-0 { margin-left: 0; } .lg-mr-0 { margin-right: 0; } .lg-mt-0 { margin-top: 0; } .lg-mx-0 { margin-left: 0; margin-right: 0; } .lg-my-0 { margin-bottom: 0; margin-top: 0; } .lg-pb-0 { padding-bottom: 0; } .lg-pl-0 { padding-left: 0; } .lg-pr-0 { padding-right: 0; } .lg-pt-0 { padding-top: 0; } .lg-px-0 { padding-left: 0; padding-right: 0; } .lg-py-0 { padding-bottom: 0; padding-top: 0; }
}
.clear { clear: both; float: none !important;
}
.clear-l { clear: left; float: none !important;
}
.clear-r { clear: right; float: none !important;
}
@media screen and (min-width: 0px) and (max-width: 576px) { .xs-clear { clear: both; float: none !important; } .xs-clear-l { clear: left; float: none !important; } .xs-clear-r { clear: right; float: none !important; }
}
@media screen and (min-width: 576px) and (max-width: 768px) { .sm-clear { clear: both; float: none !important; } .sm-clear-l { clear: left; float: none !important; } .sm-clear-r { clear: right; float: none !important; }
}
@media screen and (min-width: 768px) and (max-width: 992px) { .md-clear { clear: both; float: none !important; } .md-clear-l { clear: left; float: none !important; } .md-clear-r { clear: right; float: none !important; }
}
@media screen and (min-width: 992px) and (max-width: 1200px) { .lg-clear { clear: both; float: none !important; } .lg-clear-l { clear: left; float: none !important; } .lg-clear-r { clear: right; float: none !important; }
}

Slate v2 - Script Codes JS Codes

$('.nav-toggle').click( function() {	$(this).toggleClass('toggled').next('.nav').slideToggle(150);
});
$('.dropdown-toggle').click( function() {	$(this).toggleClass('toggled').next('.dropdown-menu').slideToggle(150);	return false;
});
//handle keyboard navigation
$('.dropdown-toggle').keydown( function(e) {	if (e.keyCode == 13) {	$(this).toggleClass('toggled').next('.dropdown-menu').slideToggle(150);	return false;	}
});
//toggle visual impaired mode via button combo
$(document).keydown( function(e) {	if ( e.ctrlKey && ( e.which === 73 ) ) {	$('html').toggleClass('inversed');	}
});
//triple tap for visual impaired mode on mobile
var mc = new Hammer.Manager(document);
// Tap recognizer with minimal 3 taps
mc.add( new Hammer.Tap({ event: 'tripletap', taps: 3 }) );
// Single tap recognizer
mc.add( new Hammer.Tap({ event: 'singletap' }) );
// we want to recognize this simulatenous, so a quadrupletap will be detected even while a tap has been recognized.
mc.get('tripletap').recognizeWith('singletap');
// we only want to trigger a tap, when we don't have detected a tripletap
mc.get('singletap').requireFailure('tripletap');
mc.on("tripletap", function() {	$('html').toggleClass('inversed');
});
// img alt to captions
$(document).ready( function() {	// for each image	$('img[class*=caption-]').each( function() {	// wrap the image in a 'img-container' class	$(this).wrap( '<div class="img-container">' );	$(this).parent().addClass( $(this).attr( 'class' ) );	$(this).removeAttr( 'class' );	// get the image's alt text	altText = $(this).attr( 'alt' );	// add the image caption element after the image	$(this).after( '<span class="caption">' + altText + '</span>' );	imgCaption = $(this).next( 'caption' );	})
})
Slate v2 - Script Codes
Slate v2 - Script Codes
Home Page Home
Developer Thomas Hare
Username tommyhare
Uploaded November 17, 2022
Rating 3
Size 14,201 Kb
Views 10,120
Do you need developer help for Slate v2?

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!

Thomas Hare (tommyhare) Script Codes
Name
Space Ashley
Ashley Fitness
Simple Passwords
Table Classes
Micropush
Bootstrap V4 tabs
Responsive Sidebar
Bootstrap Form Fun
Stock Card
Material UI
Create amazing love letters 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!