/* These styles are used on this page only to make the demo page look nicer. Don't use them in your project. */

/* Bootstrap stuff */
.buttonsizes * {
	vertical-align: bottom;
	margin-bottom: 0;
	margin-right: 10px;
	margin-left: 0;
}

/* code blocks */
pre {
	font-size: .9em;
	word-wrap: break-word;
}

/* formatting for grid system */
.dark {
	background-color: rgb(172, 172, 172);
}

.light {
	background-color: rgb(223, 223, 223);
}

.col {
	text-align: center;
}

.row {
	line-height: 2em;
}

/* pretty heading demo display (all headings on one line) */
.headings *:not(first-of-type) {
	display: inline;
}

/* fancy page heading styles */
h1:not(.exampleh1) {
	margin: 0.2em 0;
	border-bottom: 5px solid;
	margin-bottom: 15px;
	padding-bottom: 5px;
}

/* normally, the button would extend past the page top and be invisible but when it's in the middle of the page it shows */
.navbar button.btn-close.btn-sm {
	padding-top: 4px;
	margin-top: -49px;
}

/* this fixes the display of the demo-navbar when the page is resized */
.navbar .container {
	margin: 0 20px;
}

/* support tables */
.support span.full, .support tr.full {
	background: #3c5;
}

.support span.partial, .support tr.partial {
	background: #fd5;
}

.support span.none, .support tr.none {
	background: #d55;
}

.key {
	padding: 5px;
	line-height: 30px;
}

.support th, .support td, .support table {
	border: 1px solid;
}
.support table, .support .key {
	font-weight: bold;
}

@media (max-width: 900px) {
	.browserdetails {
		display: none;
	}
}

nav {
	display: block;
}

.c12{width:98%}.c11{width:89.66%}.c10{width:81.33%}.c9{width:73%}.c8{width:64.66%}.c7{width:56.33%}.c6{width:48%}.c5{width:39.66%}.c4{width:31.33%}.c3{width:23%}.c2{width:14.66%}.c1{width:6.33%}

.col { margin: 0 1%; }

@media (max-width: 870px) {
	.row .col {
		margin: 0;
	}
}

.krakenholder {
	display: block;
	width: 150px;
	margin: auto;
}

.krakenholder:hover .kraken {
	height: 0;
}

.krakenholder:hover:before {
	position: relative;
	display: block;
	height: 150px;
	text-align: center;
	font-size: 40px;
	line-height: 150px;
	font-weight: bold;
	background: red;
	content: "ROAR";
}
