/* 
Theme Name: Wuppo
Description: This is a theme developed by Sam Eddy
Version: 1.0
Author: Sam Eddy
Author URI: http://sameddyswork.com/
*/

/*
@import url(//fonts.googleapis.com/css?family=Arapey:400italic,400);
@import url(//fonts.googleapis.com/css?family=Libre+Baskerville:400italic,400);
@import url(//fonts.googleapis.com/css?family=Tienne);
@import url(//fonts.googleapis.com/css?family=Tienne:400italic,400);
@import url(//fonts.googleapis.com/css?family=Libre+Baskerville:400italic,400);
*/
@import url(//fonts.googleapis.com/css?family=Roboto+Slab);


/* General CSS */
html { overflow-y:scroll; font-family: 'Roboto Slab', serif; font-size: 14px; }
/*html { overflow-y:scroll; font-family: 'Arapey', Arial, serif; font-size: 16px; }*/

html, body { background:#FFF; margin:0 !important; padding:0 !important; }
.clear { clear:both !important; }
.clearSpacer { clear: both; height: 40px; }
a, a:link, a:visited { text-decoration: none; color: #705A40; }
a:hover { color: #95846f; }

.siteBg { z-index: 1; position: fixed; left: 0px; top: 0px; bottom: 0px; right: 0px; background:#FFF url('../../../images/layout/background.jpg') no-repeat 50% top; background-size: cover; }

.fullPage { z-index: 5; position: relative; margin: 0 auto; min-width: 780px; }
.contentWidth { position: relative; margin: 0 auto; width: 740px; }

.header { margin: 0 auto; background: url('../../../images/layout/BANNER_v3.png') no-repeat 50% top; height: 310px; }
	.logo { display: block; margin: 0 auto; /*background: url('http://wuppogame.com/images/layout/logo.png') no-repeat 50% bottom;*/ width: 740px; height: 305px; }
		.headerLinks { position: absolute; bottom: 0px; left: 0px; right: 0px; }
			.socialLinks { float: left; }
				.socialLink { display: block; float: left; width: 36px; height: 38px; margin-right: 3px; background-position: 50% top; }
				.socialLink:hover { opacity: .66; }
					.socialLink.reddit { background-image: url('../../../images/layout/socialIcons/link_red_V3.png'); }
					.socialLink.facebook { background-image: url('../../../images/layout/socialIcons/link_fb_V3.png'); }
					.socialLink.twitter { background-image: url('../../../images/layout/socialIcons/link_twit_V3.png'); }
					.socialLink.youtube1 { background-image: url('../../../images/layout/socialIcons/link_yt1_V3.png'); }
					.socialLink.youtube2 { background-image: url('../../../images/layout/socialIcons/link_yt2_V3.png'); }
					.socialLink.soundcloud { background-image: url('../../../images/layout/socialIcons/link_sc_V3.png'); }
					.socialLink.rss { background-image: url('../../../images/layout/socialIcons/link_feed_V3.png'); }
		.nav { float: right; text-align: right; color: #525252; font-size: 18.5px; padding: 5px 0px; margin-top: 2px;
				/*background: rgba(195,198,202,.5);
				background: -moz-linear-gradient(left,  rgba(195,198,202,.5) 0%, rgba(203,206,195,.5) 100%);
				background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(195,198,202,.5)), color-stop(100%,rgba(203,206,195,.5)));
				background: -webkit-linear-gradient(left,  rgba(195,198,202,.5) 0%,rgba(203,206,195,.5) 100%);
				background: -o-linear-gradient(left,  rgba(195,198,202,.5) 0%,rgba(203,206,195,.5) 100%);
				background: -ms-linear-gradient(left,  rgba(195,198,202,.5) 0%,rgba(203,206,195,.5) 100%);
				background: linear-gradient(to right,  rgba(195,198,202,.5) 0%,rgba(203,206,195,.5) 100%);
				filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#c3c6ca', endColorstr='#cbcec3',GradientType=1 );*/ }
			.nav a, .nav div { display: inline; color: #333333 !important; text-transform: lowercase; padding: 0 8px; position: relative; }
			.nav div { padding-bottom: 8px; }
			.nav a:hover { color: #666 !important; }
				.nav div:hover .subNav { display: block; }
				.subNav { display: none; z-index: 500; position: absolute; top: 25px; left: 0px; padding: 0px 10px;
							background: rgba(195,198,202,.8); /* Old browsers */
							background: -moz-linear-gradient(left,  rgba(195,198,202,.8) 0%, rgba(203,206,195,.8) 100%); /* FF3.6+ */
							background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(195,198,202,.8)), color-stop(100%,rgba(203,206,195,.8))); /* Chrome,Safari4+ */
							background: -webkit-linear-gradient(left,  rgba(195,198,202,.8) 0%,rgba(203,206,195,.8) 100%); /* Chrome10+,Safari5.1+ */
							background: -o-linear-gradient(left,  rgba(195,198,202,.8) 0%,rgba(203,206,195,.8) 100%); /* Opera 11.10+ */
							background: -ms-linear-gradient(left,  rgba(195,198,202,.8) 0%,rgba(203,206,195,.8) 100%); /* IE10+ */
							background: linear-gradient(to right,  rgba(195,198,202,.8) 0%,rgba(203,206,195,.8) 100%); /* W3C */
							filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#c3c6ca', endColorstr='#cbcec3',GradientType=1 ); /* IE6-9 */ }
					.subNav a { display: block; clear: both; text-align: left; padding: 8px 10px; }


.pinkBar { display: block; clear: both; margin: -6px 0 30px -20px; width: 780px; height: 29px; background: url('../../../images/layout/bar.png') 50% top no-repeat; }
.content { }
.samEddyLink { z-index: 999; position: relative; margin: 50px auto; text-align: center; font-size: 14px; }

/* Headers Styling */
h1 { font-size: 36px; margin: 40px 0 20px; color: #585047;}
h2 { font-size: 28px; margin: 40px 0 15px; color: #585047;}
h3 { font-size: 24px; margin: 20px 0 8px; color: #585047;}

/* Posts */
.homeRecentPost { position: relative; clear: both; margin: 0 auto 10px; width: 680px; height: 210px; }
	.homeRecentPost .imagery { position: relative; width: 100%; height: 100%; }
		.homeRecentPost .postBack { position: absolute; left: 0px; top: 0px; width: 606px; height: 187px; background: url('../../../images/posts/bubble_blue.png') no-repeat left top; }
		.homeRecentPost .postBack.back2 { background-image: url('../../../images/posts/bubble_green.png'); }
		.homeRecentPost .postBack.back3 { background-image: url('../../../images/posts/bubble_pink.png'); }
		.homeRecentPost .postBack.back4 { background-image: url('../../../images/posts/bubble_yellow.png'); }
		.postBack:not(.wum):not(.popoboss):not(.allesweter) { background-image: url('../../../images/posts/bubble_neutral.png') !important; }
		.homeRecentPost .postAvatar { position: absolute; right: 0px; bottom: 0px; width: 146px; height: 150px; background: no-repeat right bottom; }
		.homeRecentPost .postAvatar.wum { background-image: url('../../../images/posts/avatar_wum.png'); }
		.homeRecentPost .postAvatar.popoboss { background-image: url('../../../images/posts/avatar_popoboss.png'); }
		.homeRecentPost .postAvatar.allesweter { background-image: url('../../../images/posts/avatar_allesweter.png'); }
	.homeRecentPost .postContent { position: absolute; top: 30px; width: 470px; overflow: hidden; }
		.homeRecentPost .postContent .postTitle { font-size: 18px; margin-bottom: 6px; font-weight: bold; clear: both; }

.homeRecentPost.even .imagery { -moz-transform: scaleX(-1);
								-webkit-transform: scaleX(-1);
								-o-transform: scaleX(-1);
								transform: scaleX(-1);
								-ms-filter: fliph; /*IE*/
								filter: fliph; /*IE*/ }
.homeRecentPost.odd .postContent { left: 65px; }
.homeRecentPost.even .postContent { right: 65px; }

/* Form Styling */
form { width: 100%; clear: both; }
	form input, form select, form textarea { display: block; clear: both; margin-bottom: 10px; padding: 8px 16px; border: 1px solid #666; font-size: 22px; }
	form input[type="text"], form input[type="email"], form textarea { width: 300px; }
	form textarea { min-width: 300px; min-height: 120px; }
	form select { width: 333px; }


















/* DO NOT REMOVE FROM HERE DOWN */
/* Blog */
.blog-content { /*float:right; width:555px;*/ }
.blog-content h2 { font-weight:bold; margin-top:0; }
.blog-content h1 { font-weight:bold; margin-top:0; }
/* Sidebar */
#sidebar { width:140px; float:left; border-right:1px solid #000; padding-right:10px; }
#sidebar ul { margin:0;padding:0; }
#sidebar h2 { border-top:0; border-bottom:0; text-align:left; margin-bottom:0; margin-top:0; }
#sidebar ul ul { padding: 0 0 15px 2em; }
#sidebar ul li { list-style:none;padding: 0; }
#sidebar ul li li { list-style:none;padding: 5px 0; }
#sidebar ul.feed { margin:0;padding:0; }
#sidebar ul.feed li { list-style:none; }
#sidebar ul li li { }
#sidebar ul.feed li { list-style-image:none;padding:3px 17px; }
/* Main */
#content ul { margin: 0.5em 0;padding: 0 0 0 2em; }
#content ul li { padding:5px 0;line-height:1.8em; }
#content ol { margin:0;padding:0 0 0 3em;}
#content ol li { margin:0;padding:3px;line-height:1.8em; }
#content .entry { clear:both;margin:0; }
.post .date { float:right; margin:5px 0 0 5px;padding:0 10px;text-align:center;font-size: 0.8em;border:#ccc 1px solid;font-weight:bold;font-family: Verdana, Tahoma, Arial, Serif;color: #666; }
.post .date span { display:block; }
.post .date .day { font-size:1.6em; }
.post .meta { margin-bottom: 10px;padding-left: 5px;font-size: 0.9em;color:#999; }
.post .comments { font-size:0.9em;border-bottom:#ccc 1px dotted;color:#999;padding-left:17px; }
.post .comments a { border-bottom:0px; }
.post { margin-bottom: 30px; }
#content .trackback { padding:3px 12px; }
ul.authorposts { margin:0;padding:0 2em; }
ul.authorposts li { margin:0;padding:5px; }
ul.authorposts li em { float:right;font-style:normal; }

.field input, textarea { width:300px; }

/* Comments */
input.textbox { border:#ccc 1px solid;background:#f9f9f9;font:1em Verdana, Tahoma, Arial, Serif;padding:2px;width:150px; }
#commentform textarea{ width: 90%;padding:5px;height: 20em;border: 1px solid #ccc;background:#f9f9f9;font:1em Verdana, Tahoma, Arial, Serif; }
input.textbox:focus, textarea:focus {background:#fff;border:#999 1px solid; }
#commentform { margin:10px; padding:0; }
#content .commentlist { margin:0; padding:0; }
#content .commentlist li { list-style:none;margin: 0;padding: 1em;border-bottom:#ddd 1px solid;font-size:0.9em; }
#content .commentlist li .cmtinfo { padding:5px;margin-bottom: 5px;position:relative; }
#content .commentlist li .cmtinfo em { margin:0;padding:0 1em;font-weight:normal;font-style:normal;color:#999; }
#content .commentlist li cite { font-style:normal;font-weight:bold;font-size:1.1em; }
#content .nocomments { font-size:0.9em;color:#999;text-align:center; }