/*----------------------------------------------------------------------------------
CSS created and maintained by Michael Sigler. www.siglerdesign.com for Joleine Phelps
www.joleine.com

I would like to thank the little people who made this possible. All the ninjas,
robots and pirates that had to die for this project, know that they did not die in 
vain, but with great honor. Without them, this site would never have been made.

Feel free to browse around and see what I've made. Maybe you can learn from it. If
you see any errors, please let me know. I mean, you wouldn't let me walk around with
collard greens stuck in my teeth would you? 

If you must steal it, well, consider this fair warning that an entire legion of 
undead pirates and vanishing ninjas will join forces to bring you to a swift, but
most assuredly painful demise.
----------------------------------------------------------------------------------*/

/* Setting some standards for ourselves */
* {
	margin: 0px;
	color: #FFFFFF;
}

body {
	margin: 0px;
	padding: 0px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	background: #332119 url(/img/bg/bg-page-brown.png) repeat-x left top;
	font-size: 70%;
}
a:link, a:visited, a:hover, a:active {
	text-decoration: underline;
	color: #f493aa;
}
a:visited {
	text-decoration: none;
}
a:hover {
	color: #fbb1c2;
}
a:active {
	color: #f493aa;
}
a img { border: 0px none; }


/* .clearer is used to aid in the proper clearing of floats within nested divs. More info can be found at sitepoint.com in
the forums at http://www.sitepoint.com/forums/showthread.php?t=171943 */
.clearer {
	clear: both;
	height: 1px;
	overflow: hidden;
	margin-top: -1px; 
}


/* Page Layout ----------------------------------------------- */
/* The centered container for all content */
#container {
	width: 1000px;
	margin-right: auto;
	margin-left: auto;
	background: url(/img/bg/bg-content-brown.png) no-repeat center 166px;
	position: relative;
}
/* The masthead contains my ever so spectacular logo. */
#masthead {
	width: 1000px;
	height: 166px;
}
#column1 {
	width: 480px;
	margin: 94px 45px 45px 125px;
	float: left;
	display: inline;
}
#column2 {
	width: 225px;
	margin: 94px 0px 45px;
	float: left;
	display: inline;
	z-index: 200;
	position: relative;
}
#footer {
	width: 750px;
	margin: 0px 0px 0px 125px;
	background: url(/img/bg/bg-footer-brown.png);
	height: 40px;
	float: left;
	border-top: 5px solid #FFFFFF;
}

/* Column 1 Layout */
.post {
	width: 480px;
	margin: 0 0 65px;
	float: left;
}

/* Column 2 Layout */
.col2box {
	margin: 0 0 35px;
	width: 225px;
	float: left;
	}
#about {
	margin: 0 0 25px;
}
#flickr {
}
#links {
    margin: 0 0 185px;
}



/* Text Treatments ----------------------------------------- */
/* Custom Text */
#column2 p.note {
	font-size: 0.8em;
	margin: 3px 0px;
	color: #ED63AF;
}

/* Column 1 Text */
#column1 .posttitle {
	float: left;
	margin: 0 0 10px;
	border-bottom: 2px solid #f493aa;
	padding: 0 0 10px 0;
	width: 100%;
}
#column1 .posttitle h2 {
	font-size: 1.4em;
	float: left;
	display: block;
}
#column1 .posttitle h2 a {
	text-decoration: none;
	color: white;
	}
#column1 .posttitle h2 a:hover {
	color: #ED63AF;
	}
#column1 .posttitle p.timestamp {
	float: right;
	display: block;
	margin: 5px 0 0;
}
#column1 .post p {
	margin: 0 0 1.5em;
	font-size: .95em;
	line-height: 1.5em;
	float: left;
}
#column1 .postfooter {
	width: 100%;
	float: left;
}
#column1 .postfooter p.comments {
	float: left;
	width: 230px;
}
#column1 .postfooter p.tags {
	float: right;
	width: 250px;
	text-align: right;
}

/* End Column 1 Text */

/* Column 2 Text */

#column2 h2 {
	font-size: 1.4em;
	margin: 0px 0px 10px 0px;
	border-bottom: 2px solid #f493aa;
	padding-bottom: 10px;
}
#column2 p {
	margin-bottom: 1.5em;
	font-size: .95em;
	line-height: 1.5em;
}
/* End Col 2 Text */

/* Footer Text */
#footer p {
	font-size: .75em;
	height: 25px;
	padding-top: 15px;
	padding-left: 15px;
}


/* Lists Styles ------------------------------------------------------------- */
ul, ol {
	margin: 0 0 1.5em 0;
	padding: 0;
}
ul {
	list-style: none;
	}
ol {
	padding-left: 3.5em;
	}
li {
	margin: 0 0 0.5em;
	padding: 0;
	font-size: .95em;
}
ul li {
	background: url(/img/icons/heart-brown.png) no-repeat 0em 0.2em;
	padding-left: 2em;
	margin-left: 1.5em;
}
#column2 ul li {
	margin: 0 0 1.5em 0;
	padding-left:2em;
	}
ul li.left {
	background: url(/img/icons/leftarrow.gif) no-repeat 0em 0.2em;
}
ul li.right {
	background: url(/img/icons/rightarrow.gif) no-repeat 0em 0.2em;
}

ol li {
}

/* FLOWER POWER BIATCHES! */

#flower {
	position: absolute;
	height: 215px;
	width: 182px;
	bottom: 45px;
	right: 125px;
	z-index: 1;
}


/* Flickr Badge */

	/*
	Images are wrapped in divs classed "flickr_badge_image" with ids
	"flickr_badge_imageX" where "X" is an integer specifying ordinal position.
	Below are some styles to get you started!
	*/
#flickr_badge_uber_wrapper {
	text-align:center; 
	width:225px;
	}
#flickr_badge_wrapper {
	padding: 0px;
	}
.flickr_badge_image {
	margin:0px 0px 6px 6px;
	float: left;
	}
#flickr_badge_image1, #flickr_badge_image4, #flickr_badge_image7 {
	margin: 0px 0px 6px 0px;
	}
.flickr_badge_image img {
	height: 65px;
	width: 65px; 
	}
.flickr_badge_image a:link img {
	border: 3px solid #f493aa;
}
.flickr_badge_image a:hover img {
	border: 3px solid #FFF;
}



/* Styles for the Comments */

#comments {
	width: 480px;
	float: left;
	display: inline;
}
.commentbox, .commentbox-m, .commentbox-preview {
	width: 480px;
	float: left;
	border-top: 1px solid #CCCCCC;
	margin-bottom: 0px;
	padding-bottom: 15px;
	padding-top: 15px;
	margin-top: 0px;
}
.commentbox-m {
	border-top: 1px solid #DC0072;
}
.commentbox-preview {
	border: none;
	margin: -15px 0px 0px;
	padding-top: 0px;
}
.comment-author {
	float: left;
	display: inline;
	width: 480px;
	}
#comments p.author {
	font-weight: bold;
	margin: 0px;
}
#comments p.date {
	margin: 0 0 10px;
	padding: 0px;
	line-height: 1.1em;
	color: #666666;
	font-size: 10px;
	color: #fff;
}
.comment {
	float: left;
	width: 480px;
}
#comments .comment p {
	width: 480px;
}

/* Comment Form */
#commentform {
	width: 480px;
	margin: 10px 0px 0px;
	padding: 20px 0px 0px;
	display: block;
	float: left;
}
#commentform form {
	width: 480px;
	display: block;
	margin: 20px 0px 0px;
	padding: 0px;
}
.form-input {
	float: left;
	width: 480px;
	padding: 15px 0px;
	border-top: 1px solid #ED63AF;
	margin: 0px;
}
#commentform input {
	border: 1px solid #ED63AF;
	float: left;
	width: 200px;
	margin: 0px;
	padding: 0px;
	height: 20px;
	color: #444;
}
#commentform textarea {
	width: 395px;
	border: 1px solid #CCC;
	color:	#444;
}
* html #content textarea { /* I really hate IE */
	\width: 390px;
	w\idth: 390px;
	color: #444;
}
#commentform label {
	float: left;
	width: 125px;
	margin: 0px 0px 5px;
	padding: 0px;
	font-size: 1em;
	line-height: 20px;
	font-weight: bold;
}
#commentform form p {
	width: 380px;
	float: left;
	margin: 0px 0px 0px 10px;
}
#commentform input.button {
	width: 15px;
	margin: 0px;
	padding: 0px;
	float: left;
	height: 15px;
}
#commentform input.submit, #commentform input.submit2 {
	padding: 5px 0px;
	width: 75px;
	margin: 0px;
	float: left;
	background: #DC0072;
	color: #FFFFFF;
	font-size: 1em;
	border-top: none;
	border-right: none;
	border-bottom: none;
	border-left: none;
	line-height: 1em;
	height: 25px;
}
#commentform input.submit2 {
	margin-left: 15px;
}