/**
 *             ddd
 *         ddd ddd    eee                                      mm    mm     eee
 *       ddddddddd  eeeeee  rr rr ppp pppp  yyy   yyy      mm mmmmm mmmm  eeeeeee
 *      dddd   ddd ee   eee rrrrr pppp   pp yyy   yyy      mm   mmm  mmm eee
 * eee
 *      dddd   ddd eeeeeeee rrr   ppppp ppp  yyyyyyy  ooo  mm   mmm  mmm
 * eeeeeeeee
 *       ddddddddd eee      rrr   ppppppppp   yyyyy  ooooo mm   mmm  mmm  eee
 *        dddd ddd   eeee   rrr   ppp  pp      yyy    ooo  mm   mmm  mmm    eeee
 *                                ppp        yyyy
 *
 * derpy.me - main stylesheet
 * @author Diftraku
 * @version 1.3
 * @license http://creativecommons.org/licenses/by-nc-nd/3.0/ Creative Commons
 * By-NC-ND v3.0
 * @package derpy.me
 * @subpackage css-main
 */
html, body {
	height: 100%;
}
body {
	background-color: #232130;
	background-image: url(../img/muffins.png);
	background-position: 50% 50%;
	color: #C5C7BA;
}
a, a:visited {
	color: #DFCB42;
}
a:hover, a:active {
	text-decoration: underline;
	color: #E5CE45;
}
body div.container {
	height: 100%;
}
/**
 * Bootstrap Colour Overrides
 */
a {
	color: #DFCB42 !important;
}
.well {
	border: 1px solid #272536;

	background-color: #272536;
	background-image: none;
	box-shadow: none;
}
.dropdown-menu {
	text-decoration: none;
	background-color: #201E2B;
	background-image: none;
	color: #E5CE45;
	text-align: justify !important;
}
.dropdown-menu a {
	background-image: none !important;
}
.caret {
	border-top-color: #DFCB42 !important;
	border-bottom-color: #DFCB42 !important;
}
.dropdown-menu li a:hover, .dropdown-menu li a:focus, .dropdown-menu li a:focus {
	background-color: #44415E !important;
}
.dropdown-menu .divider {
	background-color: #44415E !important;
}
.form-control, .input-group-addon {
	background-color: #44415E !important;
	border-color: #44415E !important;
	color: #C5C7BA !important;
}
.input-group-addon {
	background-color: #272536 !important;
}
.input-group-addon label {
	margin-bottom: 0;
}
.form-control:focus {
	background-color: #272536 !important;
	outline: 0;
	box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(68, 65, 94, 0.6);
}
/**
 * Static Style Defs
 */
body.content {
	padding-top: 50px;
}
#floater {
	float: left;
	height: 50%;
	margin-bottom: -205px;
	margin-bottom: -400px;
}
#banner {
	clear: left;
	margin: 0 auto;
	height: 0;

	/*background-image: url(../img/derped.png);
	background-position: 260px 0;
	background-repeat: no-repeat; */
	width: 600px;
	height: 219px;
	position: relative;
	bottom: -47px;
	z-index: 999;
	display: none;
}

#banner > span {
	font-family: monospace;
	bottom: 0px;
	left: 10px;
	position: absolute;
}

@media (max-width: 768px) {
	#banner {
		background-image: none !important;
	}
}

#wrapper {
	min-height: 361px;
	background-image: url(../img/derpy.png);
	background-repeat: no-repeat;
	background-position: 10px 48px;
}
#header {
	text-align: center;
	line-height: 175px;
}
#header img {
	margin: 0 auto !important;
}
.twitter {
	height: 56px;
	overflow: hidden !important;
	position: relative;
	margin-bottom: 0 !important;
	background-color: #44415E;
	border-color: #44415E;
	font-size: 10px !important;
	padding: 3px !important;
}
.twitter iframe.twitter-timeline {
	height: 50px !important;
	min-height: 50px !important;
	position: relative;
	overflow: hidden !important;
}
#footer, #footer .dropdown-header {
	font-size: 10px;
	line-height: 1.028;
}
#footer p {
	margin: 0 0 5px;
}
body.error.h401 #wrapper, body.error.h403 #wrapper, body.error.denied #wrapper {
	background-image: url(../img/denied.png);
	background-position: 10px 105px;
}
body.error.h400 #wrapper, body.error.h404 #wrapper, body.error.flood #wrapper {
	background-image: url(../img/flood.png);
	background-position: -55px 105px;
}
body.error.h500 #wrapper, body.error.h503 #wrapper, body.error.derped #wrapper {
	background-image: url(../img/derped.png);
	background-position: -95px 200px;
}
body.error #header {
	height: 125px;
}
body.error div.error {
	padding: 10px;
	background-color: #44415E;
	border-color: #44415E;
}
body.error div.error h3 {
	margin-top: 0;
}
body.error.redirect #wrapper {
	background-image: url(../img/stats.png);
	background-position: 20px 55px;
}
body.error.redirect div.error {
	margin-top: 15px;
}
body.stats .big-graph.line {
	margin-top: 39px;
}
body.stats #wrapper {
	background: #201E2B url(../img/stats.png) no-repeat 20px 10px;
}
body.stats div.body-content > div {
	float: left;
}
body.stats div.big-graph {
	height: 340px;
}
body.stats div.graph {
	height: 220px;
}
body.stats #footer {
	margin-bottom: 20px;
	clear: both;
}
#molestia {
	z-index: 9999;
	position: absolute;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100%;
	text-align: center;
}
#molestia-spacer {
	float: left;
	height: 50%;
	margin-bottom: -360px;
}
#molestia-quest {
	width: 1280px;
	height: 720px;
	margin: 0 auto;
	position: relative;
	clear: left;
}
#molestia a {
	position: relative;
	top: 5px;
}

@media (max-width: 768px) {
	#floater {
		float: none !important;
		clear: both;
		height: 0 !important;
		margin-bottom: 0 !important;
	}
	#wrapper, body {
		background: #201E2B;
	}
	#wrapper {
		background-image: none !important;
	}

    #footer {
	    font-size: 12px;
	    line-height: 1.228;
    }
    .well {
	    padding: 9px;
	    border-radius: 3px;
    }
}
@media (min-width: 768px) and (max-width: 991px) {
	#wrapper {
		background: #201E2B;
		background-image: none !important;
	}
	body.error.redirect div.error {
		margin-top: 140px;
	}		div#floatingderpy {
		background-image: none !important;
	}
}

@media (max-width: 1200px) {
	div#floatingderpy {
		left: -150px !important;
	}

	img#tofrontpage {
		left: 15px !important;
	}
}

@media (max-width: 992px) {
	div#floatingderpy {
		display: none;
	}
}

/**
 * Wow, so snow
 * Blatantly stolen from steamdb.info
 * <3, no haet!
 */
#wow-very-snow {
	background: none;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: -1;
}


img#tofrontpage {
	position: relative;
	left: 115px;
}

div#floatingderpy {
	z-index: 10;
	width: 180px;
	height: 306px;
	position: absolute;
	background-image: url(/static/img/derpy.png);
	background-repeat: no-repeat;
	left: -50px;
	top: -50px;
}

div#derpyparent {
	position: relative;
}