html, body { height: 100%; }

body {
	margin: 0;
	padding: 0;
	background: #f7f8f6;
	font-family: 'Open Sans', sans-serif;
	font-size: 12pt;
	color: #363636;
}

h1, h2, h3 { margin: 0; padding: 0; }
p, ol, ul { margin: 0; line-height: 200%; }
table { border-collapse: separate; float: none; }

.list { list-style-type: none; padding: 0; }
.list li:before {
	content: "\2745";
	font-size: 1.25em;
	padding-right: 0.5em;
	color: #ffd260;
}


/* ==========================================================================
   Container
   ========================================================================== */

#container { background: #f7f8f6 url(/images/layout/00/bg.png) repeat top left; padding-top: 0.35em; }
.full { padding: 0; }
.center { float: none; margin: 0 auto; }


/* ==========================================================================
   Top
   ========================================================================== */

#top-img {
	width: 898px;
	margin: 0 auto 1.25em ;
	position: relative;
}

#top-snow {
	position: absolute;
	top: 51.77065767284992%;
	left: 57.01559020044543%;
	width: 42.98440979955457%;
	height: 29.679595278246207%;
}

@media only screen and (max-width: 920px) { #top-img { width: 100%; } }
@media only screen and (max-width: 1199px) { #top-nav { display: none; } #content-login-bar { display: none; } }

#top-nav {
	position: absolute;
	top: 83.5%;
	left: 49%;
	width: 500px;
	text-align: center;
}

	#top-nav a {
		display: inline-block;
		margin: 3px 5px;
		padding: 5px;
		width: 150px;
		background: #ff83ab;
		letter-spacing: 1px;
		text-decoration: none;
		text-align: center;
		text-transform: uppercase;
		font-family: 'Susanna', sans-serif;
		font-size: 1.2em;
		color: #fff;
		border-bottom: 3px solid #ff83ab;
	}

	#top-nav a:hover, #top-nav .active { background: #dfbbe6; border-bottom: 3px solid #d093d6; }


/* ==========================================================================
   Top Login
   ========================================================================== */

#login-bar, #content-login-bar {
	margin: 0;
	background: #fec4cf;
	text-align: center;
	vertical-align: middle;
}

#content-login-bar { margin-bottom: 2em; }
#login-form-menu, #content-login-form-menu { padding: 10px 0; }

#login-bar .top-login, #content-login-bar .top-login { margin: 0; padding: 0; }
.login-bar-remember-submit { font-size: 0.8em; }
.login-bar-remember { margin: 6px 0.8em 0; }

	#login-form-menu ul, #content-login-form-menu ul { margin: 0; padding: 0; }
	#login-form-menu li, #content-login-form-menu li { margin-bottom: -8px; display: inline-block; }

	#login-form-menu a, #content-login-form-menu a {
		display: block;
		width: 175px;
		margin-right: 4px;
		font-family: 'Roboto Condensed', sans-serif;
	}
	#content-login-form-menu a { width: 160px; font-weight: normal!important; }

	#login-form-menu .hover, #content-login-form-menu .hover { color: #999; }
	#login-form-menu .hover:hover, #content-login-form-menu .hover:hover { background: #dbe1e4; color: #fff; }
	#login-form-menu .badge { margin-left: 5px; background: #b5bbbe; } #content-login-form-menu .addon-prize { color: #ff538f; }

#login-bar .navbar-toggle:focus,
#login-bar .navbar-toggle:hover {
	background-color: #f8adbb;
}

.login-error { font-size: 0.8em; padding-bottom: 10px; }
.login-error a { display: inline-block!important; width: auto!important; }


/* ==========================================================================
   Navbar
   ========================================================================== */

@media only screen and (max-width: 768px) { .navbar-collapse { padding-top: 0; padding-bottom: 0.5em; } }
@media only screen and (min-width: 1200px) { #nav { display: none; } #login-bar { display: none; } }

#nav { margin: 0; background: #ff83ab; }

	#nav ul {
		margin: 6px 0 0;
		padding: 5px;
		list-style: none;
		line-height: normal;
		text-align: center;
	}

	#nav li { display: inline-block; padding: 0.5em; }

	#nav a {
		display: block;
		padding: 0;
		letter-spacing: 0;
		text-decoration: none;
		text-align: center;
		text-transform: uppercase;
		font-family: 'Susanna', sans-serif;
		font-size: 1.75em;
		border: none;
		color: #fff;
	}

	#nav a:hover, #nav .active a { color: #d94978; }

.navbar-toggle, #login-bar .navbar-toggle { border-color: #fff; }
.navbar-toggle .icon-bar { background-color:#fff; }

.navbar-toggle:focus,
.navbar-toggle:hover {
	background-color: #d94978;
}


/* ==========================================================================
   Content & Side
   ========================================================================== */

#content, #side { margin-top: 0.5em; margin-bottom: 3em; padding: 0.5em; }
#content { background: #fff; font-size: 0.8em; }

#side-wrap { margin-bottom: 2em; }

#side-box {
	padding: 0.5em;
	text-align: justify;
	font-size: 0.75em;
	font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
	background: #fff;
}

	#side h1 {
		padding: 0.5em;
		font-size: 0.85em;
		letter-spacing: 1px;
		text-align: left;
		text-transform: uppercase;
		color: #fff;
		background: #ff9dbd;
		border-bottom: 3px solid #ff83ab;
	}

		#side h1:before {
			content: "\2746";
			font-size: 1.5em;
			padding-right: 0.3em;
			color: #fff;
		}

	.quick-link	{ padding: 0.75em 1em!important; }
	.quick-link a {
		display: block;
		margin: 0.25em auto;
		background-color: #fec4cf;
		padding: 0.75em;
		text-align: center;
		text-transform: lowercase;
		letter-spacing: 0.02em;
		color: #fff;
	}

	.quick-link a:focus, .quick-link a:hover {
		color: #fff;
		background-color: #fbb6c3;
	}


/* ==========================================================================
   Footer
   ========================================================================== */

#footer { background: #d580a3; padding: 0.5em 0; }
#footer table { margin: auto; }

#footer p {
	margin: 0;
	padding-left: 1em;
	text-align: center;
	line-height: 150%;
	font-family: 'Roboto Condensed', sans-serif;
	font-size: 0.9em;
	color: #fef6fa;
}

#footer a { text-decoration: none; color: #edcdda; }
#footer a:hover { color: #c3098b; }
#footer i { color: #f7e4f7; }


/* ==========================================================================
   Headers
   ========================================================================== */

h1 {
	font-family: 'Susanna', sans-serif;
	font-size: 2.5em;
	color: #ffa6bd;
}

	#content h1:after {
		content: '';
		display: block;
		height: 2px;
		width: 95%;
		margin: 0.333em auto 0.667em;
		background: #f0f1f3;
	}

h2, #deck-list th, #deck-list-text th, #levels th, #activities th {
	font-family: 'Roboto Condensed', sans-serif;
	font-size: 1.65em;
	text-transform: uppercase;
	letter-spacing: 1px;
	color: #c1a2c9;
}

h3 {
	font-family: 'Open Sans Condensed', sans-serif;
	font-size: 1.25em;
	text-align: center;
	color: #deab68;
}


/* ==========================================================================
   Tables
   ========================================================================== */

@media only screen and (max-width: 492px) { 
	table { margin: auto; } 
	#activities-wrap td { width: 100%; }
	#side-box td { text-align: left; }

	tr, th, td, #members td, #decks td, #member-panel td, #activities-wrap td { display: block; text-align: center; }
	#members tr, #members td, #decks tr, #decks td { margin-bottom: 2px; }
	#members tr:last-child, #members td:last-child, #decks tr:last-child, #decks td:last-child { margin-bottom: 0; }
	#levels th, #activities th { display: none; }
	#levels tr { margin-bottom: 4px; } #levels tr:last-child { margin-bottom: 0; }
	#easyupdate-cards td { padding: 0.5em 0!important; }
	#member-panel textarea { height: 38px; }
}

#members, #decks { width: 100%; border-spacing: 0.5em; margin: 1em 0 0.7em; }

#members td, #decks td {
	text-align: center;
	padding: 8px; padding-bottom: 12px;
	border-radius: 5px;
	font-size: 0.85em;
}

	.member-active { background-color: rgba(222,222,222,.25); }
	.deck-active { background-color: rgba(222,222,222,.5); }
	.member-pending { background-color: rgba(222,222,222,.5); }
	.member-hiatus { background-color: rgba(239,65,77,.1); }
	span.member-active, span.member-hiatus { padding: 2px 20px; }

	.member-img, .deck-img { margin-top: 0.5em; }
	.member-username, .deck-series { text-transform: uppercase; }
	.member-level, .deck-deckname { color: #bb5266; font-style: italic; }

	#members .mem-new, #decks .deck-new { margin-left: 1px; }


/* ==============
   View Deck 
   ============== */

#view-deck { width: 100%; border-spacing: 5px; margin: 1.9em 0 0.7em; }

#view-deck td {
	text-align: center;
	vertical-align: top;
	font-size: 0.8em;
	padding: 5px;
}

	#view-deck td:first-child { background-color: rgba(222,222,222,.3); border-radius: 5px; }
	.deck-master { margin-top: 1em; }


/* ==============
   Text List 
   ============== */

#deck-list, #deck-list-text, #levels, #activities { width: 100%; border-spacing: 5px; margin: 1em 0 0.7em; } #levels { margin: 1em 0; }
#deck-list th, #deck-list-text th, #levels th, #activities th { text-align: center; font-size: 1.3em; border-bottom: 2px solid #f0f1f3; }
#deck-list td, #deck-list-text td, #levels td, #activities td { text-align: center; padding: 2px; background: #f0f1f3; font-size: 0.9em; } #deck-list-text td, #activities td { padding: 8px; }
#deck-list .submit { padding: 5px 1em; }
#deck-list form { margin: 0; }


/* ==============
   Easy Update Card 
   ============== */

#easyupdate-cards { width: 100%; margin: 0.7em 0 0.7em; }
#easyupdate-cards td { padding: 0.5em; }
#easyupdate-cards td:first-child { padding-left: 0; }
#easyupdate-cards td:last-child { padding-right: 0; }


/* ==========================================================================
   Forms
   ========================================================================== */

.form-group, .form-inline { margin-bottom: 5px; }
.form-control, .input-group-addon, .submit { border: 2px solid #dbe1e4; }

select option { color: #363636; }
select option:first-child { color: #999; }
select.select-label { color: #999; }

.form-control {
	border-left: 0;
	border-color: #dbe1e4!important;
	-webkit-box-shadow: none!important;
	-moz-box-shadow: none!important;
	box-shadow: none!important;
}

.input-group-addon {
	border-right: 0;
	color: #c9d3d8;
	background: #f8f9fa;
}

.submit {
	background: #f8f9fa;
	color: #788084;
	padding: 5px 3em;
	border-radius: 4px;
	height: 34px;
}

	.submit:hover { color: #ff83ab; }

.checkbox-normal { font-weight: normal; }
.login-remember-submit { width: 100%; margin-top: 5px; }
.join-birthday { margin-left: -14px; }
.selectAll { border-left: 2px solid #dbe1e4; }

	.g-recaptcha { margin: 0 auto 5px; width: 304px; }

	.wishlist { margin-top: 0; } .wishlist-series { margin: 0; }
	.button-wishlist { text-transform: none; border: 0; background: none; padding: 0; }
	.add-wishlist:before { font-family: FontAwesome; font-size: 1.2em; color: #ff83ab; content: '\f184 \2009 \2009'; }
	.remove-wishlist:before { font-family: FontAwesome; font-size: 1.2em; color: #f9334d; content: '\f056 \2009 \2009'; }

	.edit-wishlist form { display: inline-block; margin: 0; padding: 0; }
	#member-panel .button-wishlist { font-size: 0.9em; padding-right: 2em; }

	#addcomment-form label { width: 34px; }
	#addcomment-form .form-control { border-left: 2px solid #dbe1e4; }


/* ==============
   Member Panel 
   ============== */

#member-panel { width: 100%; }
#member-panel tr:first-child th { border-top: 0; border-bottom: 9px solid #fff; }
#member-panel th { padding: 0.2em 0.5em; font-size: 1.2em; background: #f8f9fa; border-top: 2em solid #fff; }
#member-panel td { height: 34px; padding-bottom: 5px; }
#member-panel tr:last-child td { padding: 1em 0 0; }

#member-panel .form-control { border-left: 2px solid #dbe1e4; }
#member-panel .control-label, #edit-info .radio-inline { padding-top: 0; }


/* ==========================================================================
   Styling Fun
   ========================================================================== */

	#content a { font-weight: bold; }
	form { margin: 1.25em 0 1.1em; }
	p, ol, ul { margin: 0.5em 0; }
	h1 + h2 { margin-top: 1.2em; } h1 + form { margin-top: 2.3em; }
	h1 + .img-break { margin-top: 2.3em; } h1 + .alert { margin-top: -4px; } h1 + .prizeclaim { margin-top: 2.3em; }
	p + h2, ul + h2, #copy + h2, #claimlog + h2, table + h2 { margin-top: 1.5em;  }
	p + h3, h2 + h3 { margin-top: 1em;  }
	.img-break img { padding: 0 1px 8px; }
	.tcg-exchange { line-height: 100%; text-align: center; margin: 0 auto; } .tcg-exchange td { padding: 0 3px; vertical-align: middle; }

b { color: #db89bb; }
em { color: #d2a6c9;  }
.mem-new, .deck-new { color: #ffcc53; }
.fa-envelope { margin-right: 5px; }

.updatefreebies  { padding: 1px; opacity:1; }
.dimmed { padding: 1px; opacity:0.2; filter:alpha(opacity=20); }


/* ==============
   Links 
   ============== */

a, .button-wishlist { text-decoration: none; color: #ff538f; }
a:focus, a:hover, .button-wishlist:hover { text-decoration: none; color: #dfbbe6; }
a:visited { text-decoration: none; }
a img { border: none; }


/* ==============
   Alert 
   ============== */

.alert {
	background: none;
	border: 0;
	border-radius: 0;
	padding: 12px;
	text-align: left;
	margin: 0 auto 2px;
	min-height: 54px;
}

.alert-danger, .alert-success, .alert-info { font-weight: 600; }
.alert-danger { color: #da4f4f; }
.alert-danger:before, .alert-success:before { content: '\f12a'; background-color: #da4f4f; }
.alert-success { color: #00bfa5; }
.alert-success:before { content: '\f00c'; background-color: #00bfa5; }
.alert-info { color: #61bef3; }
.alert-info:before { content: '\f129'; background-color: #61bef3; }

.alert-danger:before, .alert-success:before, .alert-info:before {
	font-family: FontAwesome;
	font-size: 1.5em;
	display: block;
	float: left;
	overflow: auto;
	width: 30px;
	height: 30px;
	text-align: center;
	margin-right: 12px;
	color: #fff;
}


/* ==============
   Tooltip 
   ============== */

.tooltip.bottom { text-transform: none; }
.tooltip.bottom .tooltip-inner { background-color: #030a20; }
.tooltip.bottom .tooltip-arrow { border-bottom-color: #030a20; }

.img-tooltip + .tooltip > .tooltip-inner { padding: 5px; background: #fff; }
.img-tooltip + .tooltip > .tooltip-arrow { border: none; }


/* ==============
   Prizeclaim 
   ============== */

#prizeclaim {
	display: inline-block;
	padding: 6px 13px 3px 13px;
	margin: 0 6px 14px; 
	border-radius: 8px;
	background-color: #ff9dbd;
	border-bottom: 5px solid #ff83ab;
	color: #fff;
}

#prizeclaim .fa-gift { font-size: 6em; }
#prizeclaim:hover { background: #dfbbe6; border-bottom: 5px solid #d093d6; }