@charset "UTF-8";
/* 
PlugLife CSS Document
Created 7/26/2009
*/

/* Colors

Gray: 555 - Borders and Background color for widget boxes
Gray: 999 - This gray is used for some of the text
Lime Green: BDF218 - Used throughout the site for most and titles some borders; This denotes the "westside"
Red: FF3B34 - This denotes "downtown"
Orange: FF9C00 - This denotes "hollywood"
Yellow: FFF000 - This detones "south bay"
Sky Blue: 6699FF - This denotes "the valley"
Cobalt Blue: 2E5CFF - This is for the border on the input boxes


*/

/* Reset CSS elements */

body, html, div, blockquote, img, label, p, h1, h2, h3, h4, h5, h6, pre, ul,  
ol, li, dl, dt, dd, form, a, fieldset, input, th, td {  
	margin: 0; padding: 0; border: 0; outline: none;  
	} 
	
ul, ol { list-style: none; }

/* GENERAL Styles */

body {
	font-family: Arial, Helvetica, sans-serif;
	line-height: 1;  
   	font-size: 1em;
	background-color: #000;
	color: #fff;
   	} 
   	
textarea {
	font-family: Arial, Helvetica, sans-serif; 
	font-size: 12px;
	color: #666;
	border: 1px solid #2E5CFF;
}

a {	text-decoration: none; color: #fff; }
	
a:hover { text-decoration: underline; }
	
h1 {
	font-size: 1.2em;
	font-weight:bold;
	color: #333;
	margin-bottom: 1em;
	padding: 3px;
	padding-left: 0px;
	}
	
h2 {
	font-size: 1.1em;
	font-weight:bold;
	color: #333;
	margin-bottom: 1em;
	padding: 3px;
	padding-left: 0px;
	}
	
h3 {
	font-size: 1em;
	font-weight:bold;
	color: #333;
	margin-bottom: 1em;
	padding: 3px;
	padding-left: 0px;
	}
h3.event-date{
	font-size: 13px;
	font-weight: normal;
	margin-bottom: 5px;
}
br.clear {
	clear:both;
	margin:0;
	padding:0;
	}
	
.limegreen { color: #BDF218; }
.red { color: #FF3B34; }
.orange { color: #FF9C00; }
.yellow { color: #FFF000; }
.skyblue { color: #6699FF; } 

	
/* P styles -- There are many different paragraph styles depending on where they are located. */

p {
	font-size: .8em;
	line-height: 1.4em;
	margin-bottom: 1em;
	}
	
p.contributorBox {
	color: #333;
	font-size: 1em;
	} 

/* Master Styles */

#outerwrapper {
	width: 950px;
	padding: 0;
	margin: 20px auto 0px auto;
	}	

.page-content{
	padding: 5px;
}

/* Content Styles */

#leftCol {
	position: relative;
	z-index: 100;
	float: left;
	width: 180px;
	padding-right: 10px;
	}

#centerCol {
	position: relative;
	z-index: 90;
	float: left;
	width: 480px;
	padding-right:10px;
	margin-left:15px;
	}

#rightCol {
	position: relative;
	z-index: 80;
	float: left;
	width: 230px;
	padding-right:10px;
	margin-left: 15px;
	}

/* Footer Styles */

#footerbottomimage {
	position: relative;
	z-index: 70;
	width: 946px;
	height: 100px;
	border-top: 2px solid #BDF218;
	background-color: #555;
	background: #555 url(/images/site/footer_circuitboard.png) 0 0 repeat;
	}
	
.locationImage { /* This is the image that displays depending on the selected location */
	position: absolute;
	height: 500px;
	width: 240px;
	background-color: #999;
	left: 0px;
	top: -502px;
	}	
	
/* Widget Boxes -- These are the main elements of the PlugLife site */

.WidgetOuterContainer {
	float: left;
	width: 100%;
	margin-bottom: 15px;
	margin-right: 4px;
	}

.WidgetContainer {
	float: left;
	width: 100%;
	background-color: #000;
	border: 2px solid #555;
	padding: 1px;
	}

.WidgetTab {
	float:left;
	min-width: 50px;
	height: 17px;
	background-image: url('/images/site/widgettabcorner.gif');
	background-repeat: no-repeat;
	background-position: center right;
	background-color: #555;
	padding: 7px 39px 0px 8px;
	}
	
.WidgetTabTitle {
	font-family:"Courier New", Courier, monospace;
	font-size:.9em;
	letter-spacing: 1px;
	color: #BDF218;
	}
	
.WidgetContentContainerGray {
	margin: 2px;
	background-color: #555;
	}
	
.WidgetContentContainerGreen {
	margin: 2px;
	background-color: #BDF218;
	padding: 10px;
	}
	
.WidgetContentContainerWhite {
	margin: 2px;
	min-height: 850px;
	background-color: #fff;
	color: #666;
	}

.WidgetContentContainerWhite .actions{
	padding: 10px 5px;
	color: #666;
	font-size: 0.8em;
}

.WidgetContentContainerWhite #comments a,
.WidgetContentContainerWhite .actions a{
	color: #666;
}

.WidgetContentContainerWhite #comments{
	padding: 5px;
	color: #666;
}

.WidgetContentContainerWhite #comment-form{
	color: #666;
	font-size: 0.8em;
	padding: 5px;
}

.WidgetContentContainerWhite form h3,
.WidgetContentContainerWhite #comment-form h3,
.WidgetContentContainerWhite #comments h3{
	color: #222;
	font-size: 1em;
	margin-bottom: 10px;
	font-weight: normal;
}

.WidgetContentContainerWhite form#member_form img{
	margin-bottom: 10px;
}

.WidgetContentContainerWhite form#member_form div{
	margin-bottom: 5px;
}

.WidgetContentContainerWhite #comments .comment{
	border-bottom: 1px solid #EFEFEF;
	margin-bottom: 12px;
}

.WidgetContentContainerWhite #comments .commentor{
	padding: 0 0 0 0;
	margin: 0 0 0 0;
	color: #666;
	font-size: 0.7em;
}

.WidgetContentContainerWhite form{
	padding: 5px;
	color: #666;
}

.WidgetContentContainerWhite label{
	float: left;
	width: 150px;
	display: block;
	font-size: 12px;
	clear: both;
}

.WidgetContentContainerWhite input.input{
	border: 1px solid #2E5CFF;
	padding: 5px 2px;
	color: #666;
	width: 210px;
	margin: 0 0 5px 0;
}

.WidgetContentContainerWhite select{
	width: 205px;
	margin: 0 0 5px 0;
}

.WidgetContentContainerWhite button{
	margin: 10px 0 0 150px;
	clear: both;
	border: 1px solid #2E5CFF;
	background-color: #333;
	color: #fff;
	font-size: .8em;
	padding: 2px 10px;
	font-family:"Courier New", Courier, monospace;
}
	
.WidgetContentContainerWhite button:hover{
	color: #2E5CFF;
	background-color: #fff;
}

.WidgetContentContainerWhite textarea{
	width: 310px;
	height: 200px;
}

.WidgetContentContainerWhite #entryform div{
	position: relative;
	clear: both;
	overflow: hidden;
}

.WidgetContentContainerWhite #entryform div span.mceEditor{
	clear: both;
	float: left;
	margin: 5px 0 0 0;
	height: 210px;
}

.WidgetContentContainerWhite #entryform textarea{
	clear: both;
	margin: 10px 0 0 0;
	width: 464px;
	height: 200px;
}

.WidgetContentContainerWhite #entryform button{
	margin-left: 0;
	clear: both !important;
}

.WidgetContentContainerWhite form#comment_form{
	padding: 5px;
	width: 466px;
}

.WidgetContentContainerWhite form#comment_form textarea{
	width: 354px;
}

.WidgetContentContainerWhite form .divider{
	padding-top: 10px;
	margin-bottom: 20px !important;
}




/* Widget Frames -- These are the main elements of the PlugLife site */

.WidgetFrameRight {
	float:left;
	width: 100%;
	padding: 4px;
	margin-bottom: 15px;
	min-height: 100px;
	}
	
.WidgetFrameCenter {
	float:left;
	text-align: left;
	width: 480px;
	margin-bottom: 15px;
	}
	
.WidgetFrameTitle {
	font-size: 1.1em;
	float: left;
	text-align: left;	
	font-family:Arial, Helvetica, sans-serif;
	color: #fff;
	}
	
.limegreenheading {
	color: #BDF218;
	font-size: .9em;
	}
	
.WidgetHeaderLink {
	color: #fff;
	font-size: .8em;
	}

/* Header Styles -- These are all the elements in the top navigation and header area. */

#headerwrapper {
	padding: 0px;
	width: 945px;
	position: relative;
	display: block;
	}
	
#logged-in{
	position: absolute;
	top: 0;
	right: 0;
}
	
.logobox {
	position: relative;
	float: left;
	width: 185px;
	height: 144px;
	margin-left: 20px;
	background-image: url(/images/site/pluglifelogo.gif);
	background-repeat: no-repeat;	
	}
	
.logobox a{
	position: absolute;
	top: 0;
	left: 0;
	display: block;
	width: 185px;
	height: 144px;
	cursor: pointer;
}

.logobox a span{
	display: none;
}
	
#headerLeftContainer {
	float: left;
	display: block;
	min-height: 50px;
	margin-top: 50px;
	}

.headerTitleBox {
	float: left;
	background-color: #555;
	border: 1px solid #BDF218;
	padding: 5px 5px 3px 5px;
	font-size: 1.1em;
	font-family:"Courier New", Courier, monospace;
	}

.headerLocationBox {
	float: left;
	border-top: 1px solid #BDF218;
	padding: 5px 5px 3px 5px;
	font-size: 1.1em;
	letter-spacing: 2px;
	}
	
.headerStatement {
	float: left;
	padding: 20px 5px 10px 5px;
	width: 300px;
	font-color: #fff;
	border-left: 1px solid #BDF218;
	font-size: .8em;
	line-height: 1.1em;
	}
	
.headerRegionNav {
	float: left;
	border-bottom: 1px solid #BDF218;
	padding: 3px 0px;
	border-left: 1px solid #BDF218;
	}
	
a.topnav {
	color: #BDF218;
	padding: 3px 8px;
	font-size: .9em;
	border-right: 1px solid #BDF218;
	}
	
a.topnav:hover {
	text-decoration: none;
	color: #fff;
	}
	
.headerCategoryNav {
	float: left;
	padding: 3px 0px;
	}

a.categorynav {
	color: #fff;
	padding: 3px 8px;
	font-size: .9em;
	border-right: 1px solid #BDF218;
	}

a.categorynav.active,	
a.categorynav:hover {
	text-decoration: none;
	color: #BDF218;
	}
	
a.myarea{
	color: #ff9c00 !important;
}

/* Membership Login */

#memberloginWrapper {
	position: absolute;
	bottom: 0px;
	right: 0px;
	display: block;
	}

.inputMemberLogin {
	border: 1px solid #2E5CFF;
	border-right: none;
	background-color: #333;
	height: 17px;
	padding: 2px;
	color: #fff;
	width: 120px;
	}

.memberLogin {
	border: 0px;
	border-collapse: collapse;
	font-size: .9em;
	font-family:"Courier New", Courier, monospace;
	}

.memberFieldNames {
	font-size: .8em;
	}

td.LoginSpacer {
	padding-bottom: 5px;
	}
	
.memberLowerLogin {
	border: 0px;
	border-collapse: collapse;
	}
	
.signinbutton {
	border: 1px solid #2E5CFF;
	background-color: #333;
	color: #fff;
	font-size: .8em;
	padding: 2px 10px;
	font-family:"Courier New", Courier, monospace;
	}
	
.signinbutton:hover {
	color: #2E5CFF;
	background-color: #fff;
	}

span.signinlinks,	
a.signinlinks {
	font-size: .7em;
	color: #fff;
	}
	

/* Events Widget Section */

.eventWelcome {
	float: left;
	font-size: .8em;
	font-weight: bold;
	color: #fff;
	line-height: 1.2em;
	padding: 3px;
	}

.eventDateHeader {
	float: left;
	font-size: 42px;
	color: #BDF218;
	margin-left: 5px;
	padding-top: 6px;
	}

#eventDowntown, #eventHollywood, #eventSouthbay, #eventWestside, #eventValley {
	padding: 0;
	}
	
a.eventTitleLink {
	color: #fff;
	}
	
a.eventRegionLink {
	font-family:"Courier New", Courier, monospace;
	font-size: 15px;
	}

p.noResults,
p.noEvents,
p.eventAddress {
	font-size: .6em;
	color: #fff;
	padding: 0px 3px 3px 3px;
	line-height: 1em;
	margin-bottom: 3px;
	}	

p.noResults{
	font-size: .85em;
	color: #666;
	padding: 10px 0 0 5px;
}

/* Downtown Styles */
	
#eventDowntown .eventRegion a.eventRegionLink {
	display: block;
	font-weight: bold;
	color: #FF3B34;
	border-top: 2px dotted #222;
	border-bottom: 2px dotted #222;
	padding: 3px 0px;
	margin: 3px;
	}

#eventDowntown .eventTimeTitle {
	display: block;
	font-size: .8em;
	padding: 0px 3px 3px 3px;
	color: #FF3B34;
	text-transform: uppercase;
	}	
	
#eventDowntown .eventTimeTitle a.eventTitleLink:hover {
	 color: #FF3B34;
	 text-decoration: none;
	 }

/* Hollywood Styles */

#eventHollywood .eventRegion a.eventRegionLink {
	display: block;
	font-weight: bold;
	color: #FF9C00;
	border-top: 2px dotted #222;
	border-bottom: 2px dotted #222;
	padding: 3px 0px;
	margin: 3px;
	}

#eventHollywood .eventTimeTitle {
	display: block;
	font-size: .8em;
	padding: 0px 3px 3px 3px;
	color: #FF9C00;
	text-transform: uppercase;
	}	
	
#eventHollywood .eventTimeTitle a.eventTitleLink:hover {
	 color: #FF9C00;
	 text-decoration: none;
	 }

/* Southbay Styles */

#eventSouthbay .eventRegion a.eventRegionLink {
	display: block;
	font-weight: bold;
	color: #FFF000;
	border-top: 2px dotted #222;
	border-bottom: 2px dotted #222;
	padding: 3px 0px;
	margin: 3px;
	}

#eventSouthbay .eventTimeTitle {
	display: block;
	font-size: .8em;
	padding: 0px 3px 3px 3px;
	color: #FFF000;
	text-transform: uppercase;
	}	
	
#eventSouthbay .eventTimeTitle a.eventTitleLink:hover {
	 color: #FFF000;
	 text-decoration: none;
	 }

/* Westside Styles */

#eventWestside .eventRegion a.eventRegionLink {
	display: block;
	font-weight: bold;
	color: #BDF218;
	border-top: 2px dotted #222;
	border-bottom: 2px dotted #222;
	padding: 3px 0px;
	margin: 3px;
	}

#eventWestside .eventTimeTitle {
	display: block;
	font-size: .8em;
	padding: 0px 3px 3px 3px;
	color: #BDF218;
	text-transform: uppercase;
	}	
	
#eventWestside .eventTimeTitle a.eventTitleLink:hover {
	 color: #BDF218;
	 text-decoration: none;
	 }

/* The Valley Styles */

#eventValley .eventRegion a.eventRegionLink {
	display: block;
	font-weight: bold;
	color: #6699FF;
	border-top: 2px dotted #222;
	border-bottom: 2px dotted #222;
	padding: 3px 0px;
	margin: 3px;
	}

#eventValley .eventTimeTitle {
	display: block;
	font-size: .8em;
	padding: 0px 3px 3px 3px;
	color: #6699FF;
	text-transform: uppercase;
	}	
	
#eventValley .eventTimeTitle a.eventTitleLink:hover {
	 color: #6699FF;
	 text-decoration: none;
	 }
	 
/* DATE PICKER */

.WidgetContentContainerWhite .events{
	margin: 5px 0;
	display: none;
}

.WidgetContentContainerWhite .events.show{
	display: block;
}

.WidgetContentContainerWhite #entry_date_picker .ui-datepicker{
	border: 1px solid #2E5CFF;
	font-size: 12px;
	padding: 5px;
	margin: 0 0 5px 150px;
	position: relative;
}



.WidgetContentContainerWhite #entry_date_picker .ui-datepicker a:hover{
	text-decoration: underline;
}

.WidgetContentContainerWhite #entry_date_picker .ui-datepicker td{
	padding: 2px;
}

.WidgetContentContainerWhite #entry_date_picker .ui-datepicker td,
.WidgetContentContainerWhite #entry_date_picker a{
	color: #666;
}

.WidgetContentContainerWhite #entry_date_picker .ui-datepicker .ui-datepicker-title{
	display: block;
	text-align: center;
	margin: 0;
}

.WidgetContentContainerWhite #entry_date_picker .ui-datepicker .ui-datepicker-prev{
	position: absolute;
	z-index: 200;
	left: 3px;
	cursor: pointer;
}

.WidgetContentContainerWhite #entry_date_picker .ui-datepicker .ui-datepicker-next{
	position: absolute;
	z-index: 200;
	right: 8px;
	cursor: pointer;
}

.WidgetContentContainerWhite #entry_date_picker .ui-datepicker .ui-datepicker-title span{
	display: inline;
}

/* Live Wire Styles -- This is the main section for all user generated content on the size */

#findYourArea{
	margin: 0 0 0 20px;
	padding: 20px 0 20px 0;
}

#findYourArea li{
	color: #666;
	font-size: .85em;	
	margin: 0 0 10px 0;
}

#findYourArea li a{
	color: #666;
}

.articlewrapper {
	display: block;
	padding: 0px;
	margin-bottom: 10px;
	overflow:hidden;
	}

.articlecontent {
	float: left;
	display: block;
	width: 380px;
	margin: 3px 0px 0px 3px;
	}
.articlecontent a{color: #666; text-decoration: underline;}
.articlecontent a:hover{color: #2E5CFF;}
.articlecontent object{margin: 10px 0; clear: both;}
.articlethumbnail {
	float: left;
	margin: 3px 8px 3px 2px;
	width: 115px;
	background-color:#000;
	}
	
.articlecontentwrapper {
	float: left;
	display: block;
	width: 250px;
	}
	
.articlecontent ul{
	margin: 0 0 0 20px;
	list-style-type: disc;
	font-size: 0.8em;
	list-style-position: inside;
}

.articlecontent ol{
	margin: 0 0 0 20px;
	list-style-type: decimal;
	font-size: 0.8em;
	list-style-position: inside;
}

.articlecontent li{
	margin: 0 0 5px 0;
}
.articlecontent li a{
	color: #555;
}
	
.articlewrapper h2 /*.articleheadline*/ {
	font-size: 1em;
	font-weight:normal;
	color: #222;
	margin-bottom: 5px;
	padding-bottom: 0;
	}

.articlewrapper p.byline {
	font-size:13px;
	margin:0;
}
.articlewrapper p.byline a {
	padding: 3px 0px;
	color: #666;
	font-size:11px;
	text-decoration: none;
	}
	
.articlebyline a{
	color: #666;
}

.grayseparator {
	font-size: .8em;
	color: #666;
	}

div.articletext p{
	font-size: .8em;
	color: #666;
	line-height: 1.1em;
	margin: 3px 0px 0px 0px;
	}
	
.pluggedDate {
	display: block;
	font-size:11px;
	color: #BDF218;
	}
	
.articlewrapper p.meta {
	font-size:10px;
	color: #222;
	margin:-1em 0 0 0;
}
.articlewrapper p.meta a {
	color: #222;
	}
	
.darkgrayseparator {
	font-size: .7em;
	color: #222;
	}
	
.articleavatarbox {
	float: right;
	width: 60px;
	margin: 3px 5px 0px 0px;
	}

.avatar {
	width: 60px;
	height: 60px;
	background-color: #000;
	margin-bottom: 3px;
	margin-top: 3px;
	}


/* Contributor Widget Section */

.contributeJoinButton {
	background-color: #555;
	border: 2px solid #000;
	text-align: center;
	padding: 5px;
	font-size: .7em;
	font-family:"Courier New", Courier, monospace;
	}
	
a.join:hover {
	color: #BDF218;
	text-decoration: none;
	}


.contributorname {
	display: inline-block;
	overflow: hidden;
	width: 115px;
	font-size: .8em;
	color: #BDF218;
	padding: 3px 0px;
	}
	
.pluggedindate {
	display: inline-block;
	text-align: right;
	overflow: hidden;
	width: 115px;
	font-size: .8em;
	color: #666;
	padding: 3px 0px;
	}

/* Daily Feed Widget */

.feedImagePreview {
	width: 229px;
	height: 220px;
	background: #000;
	}

.feedPreviewHeadline {
	background-color: #222;
	padding: 4px 3px;
	color: #fff;
	font-size: .8em;
	}

.feedtopstories {
	background-color: #BDF218;
	font-size: .9em;
	color: #000;
	padding: 4px;
	border-top: 2px solid #000;
	border-bottom: 2px solid #000;
	}
	
a.feedSectionHeading {
	display: block;
	font-size: .8em;
	color: #fff;
	border-top: 2px dotted #BDF218;
	border-bottom: 2px dotted #BDF218;
	padding: 3px;
	margin: 3px 0px;
	}
	
a.feedSectionHeading:hover {
	text-decoration: none;
	color: #BDF218;
	}
	
h2.feedArticleHeading {
	font-size: .7em;
	text-transform: uppercase;
	color: #fff;
	padding: 3px 3px 0px 3px;
	margin: 0px;
	line-height: 1em;
	}
	
p.feedArticleDescription {
	font-size: .7em;
	color: #fff;
	padding: 3px;
	margin: 0px;
	line-height: 1em;
	}

.feedReadmoreLink {
	display: block;
	font-size: .6em;
	color: #BDF218;
	padding: 3px 3px 5px 3px;
	}

.plugsectionlinks {
	display: inline-block;
	float: left;
	text-align: left;
	overflow: hidden;
	width: 240px;
	font-size: .9em;
	color: #BDF218;
	padding: 5px 0px;
	}
	
.archive{
	padding: 5px 5px 0 5px;
	color: #FFF;
	font-size: 11px;
	overflow: hidden;
	position: relative;
}

.archive li{
	margin-bottom: 5px;
}

.archive li a{
	display: block;
}
	
.paginate{
	padding: 5px;
	font-size: 12px;
	line-height: 1.1em;
	color: #999;
	position: relative;
	height: 20px;
}
.paginate a{
	color: #333;
}
.paginate a.prev{
	float: left;
}
.paginate a.next{
	float: right;
}
#weather{
	position: absolute;
	top: 0;
	right: 0;
	font-size: 11px;
	padding: 0 0 5px 0;
	border-bottom: 2px dotted #bdf218;
}
#weather.in{
	top: 40px;
}
#weather .date{
	font-size: 24px;
	color: #bdf218;
	padding: 5px 0 2px 0;
}
#weather .time{
	font-size: 36px;
	color: #bdf218;
	border-bottom: 2px dotted #bdf218;
	padding: 2px 0 5px 0;
}
#weather .location{
	padding-left: 5px;
}
#weather .location td{
	padding: 1px;
	color: #2e5cff;
}