/* Hellchick.net CSS */



/***** GENERAL TEXT FORMATTING *****/

body { 
	font: 10pt/15pt century gothic, arial; 
	color: #ffff99; 
	background-color: #ffffff;
	margin: 0px; 
	padding: 0px;
	}
	
	.h1 { text-align: center; color: #ffffff; font-size: 18pt; }
	.h2 { color: #960014; font-size: 18pt; }

h1 {
	display: block;
	text-indent:-9009px;
	background:transparent url(/_img/logo_word.png); 
	background-repeat: no-repeat; 
	position: absolute; 
	height: 160px; 
	width: 320px; 
	top: 0px; 
	left: 2%; 
	z-index: 100; 
	clear: none;
}
	
h1 a {
	display:block;
	width:100%;
	height:100%;
	outline:none;
}
	
h2 {
	display: block;
	text-indent:-9009px;
	background:transparent url(/_img/logo_main.png); 
	background-repeat: no-repeat; 
	position: absolute; 
	height: 180px; 
	width: 180px; 
	top: -8px; 
	right: 3%; 
	z-index: 100; 
	clear: none; 
}
	
h2 a {
	display:block;
	width:100%;
	height:100%;
	outline:none;
}

.headers { text-align: center; }

b.orange { color:  #ff8000; text-decoration: none; font-weight: bold; font: 2.5em/1.2em century gothic, arial; }
b.red { color:  #800000; text-decoration: none; font-weight: bold; font: 2.5em/1.2em century gothic, arial; }


/***** TOP CONTAINERS *****/

#footer {
  background: url(/_img/footer.png);
	background-color: #000000;
	background-repeat: repeat-x;
	height: 50px;
	width: 100%;
	position: relative;
	bottom: 0px;
	left: 0px;
	z-index: 100;
	clear: both;
	font: 8pt/10pt century gothic, arial;
	color: #ffff99; 
	text-align: center;
}

#header {
    background: url(/_img/header.png);
	background-repeat: repeat-x;
	height: 156px;
	width: 100%;
	position: relative;
	top: 0px;
	left: 0px;
	border-bottom-width: 1px;
	border-bottom-style: dashed;
	border-bottom-color: #EF9C00;
}

#mid { 
	background: url(/_img/flames2.png); background-repeat: repeat-y; background-position: left;
	position: relative; height: 100%; width: 100%; top: 20px; 
	z-index: 0; 
	margin-left: auto; margin-right: auto; margin-top: auto;
	padding-bottom: 40px;
	clear: both;
	float: left; 
}

#logoMain { 
	background: url(/_img/logo_main.png); 
	background-repeat: no-repeat; 
	position: absolute; 
	height: 180px; 
	width: 180px; 
	top: 0px; 
	right: 3%; 
	z-index: 100; 
	clear: none; 
}

#logoWord { 
	background: url(/_img/logo_word.png); 
	background-repeat: no-repeat; 
	position: absolute; 
	height: 160px; 
	width: 320px; 
	top: 5px; 
	left: 2%; 
	z-index: 100; 
	clear: none;
}

#_main { position: absolute; width: 100%; height: auto; z-index: 0; }

#containerContent { position: absolute; width: 900px; height: auto; z-index: 0; }

#containerNav {	position: absolute; height: 25px; top: 132px; right: 225px; color: #000000; }

	#containerNav a { color: #000000; text-decoration: none; font-weight: bold; }
	#containerNav a:hover { color: #a80000; text-decoration: none; font-weight: bold; }

	.bullet {
    	background: url(/_img/bullet_orange.gif); background-repeat: no-repeat; background-position: center right;
		padding-left: 15px; padding-right: 30px;
		width: auto; height: 22px;
		z-index: 10;
		clear: none; float: left;
		font-weight: bold;
	}
	
#containerTop {
		position: relative; height: auto; width: 900px;
		margin: 0 auto;
		/* clear: both; */
		/* float: left; */
}

#containerMiddle { 
	background: url(/_img/flames2.png); background-repeat: repeat-y; background-position: left;
	position: relative; height: 100%; width: 100%; top: 20px; 
	z-index: 0; 
	margin-left: auto; margin-right: auto; margin-top: auto;
	padding-bottom: 40px;
	clear: both;
	float: left; 
}

#containerMidRight {
	position: relative; width: 600px; height: 100%; top: 0px;
	margin: auto 0;
  float: right;
  color: #000000;
}

#containerMidMain {
	position: relative; width: 900px; height: 100%; left: 0px; top: 0px;
	margin: 0 auto;
}

#containerMidRightPatterns {
	position: relative; width: 98%; height: 100%; right: 0px; top: 0px;
    float: right;
    color: #000000;
}
	
	
/**** LEFT ****/

	#sidebarGames { display: none; top: -50px; }
	#sidebarGamesHeader { display: none; }
	
	#sidebarKnitting { display: inline; }
	#sidebarKnittingHeader { display: inline; }

	#containerLeft { 
		position: relative; left: 30px; top: 0px; height: auto; width: 30%; 
		color: #000000;
		z-index: 100; 
		margin-right: auto; 
		clear: none; float: left; 
		padding: 0px; 
        opacity: 0.6;
	}
	
	#containerLeft2 { 
		position: relative; left: 20px; top: 0px; height: auto; width: 245px; 
		color: #000000;
		z-index: 100; 
		margin: 0 0; 
		clear: none; float: left; 
		padding: 0px; 
			/* opacity: 0.8; */
	}
	
		#containerLeft2 .smalltext { font: 8pt/10pt century gothic, arial; color: #960014; }
		#containerLeft2 a { text-decoration: none; color: #960014; font-weight: bold; }
	
	#leftTopWrap {
		position: relative; top: 0px; right: 0px; bottom: 0px; width: auto; height: auto;
		padding-top: 0px; padding-left: 0px; padding-bottom: 0px;
	}
	
	#leftBottomWrap {
		position: relative; top: 0px; right: 0px; bottom: 0px; width: auto; height: auto;
		padding-top: 10px; padding-left: 20px; padding-bottom: 10px;
		border-top-style: dashed; border-top-color: #960014; border-top-width: 1px;
	} 
		
		#leftBottomWrap a { text-decoration: none; color: #960014; font-weight: bold; }
		#leftBottomWrap a:hover { text-decoration: none; color: #000000; font-weight: bold; }
		
.knittext a { 
	display: block; 
	width: auto; height: auto;
	text-decoration: none; color: #000000;
	padding-top: 10px; padding-left: 0px; padding-bottom: 10px;
	border-top-style: dashed; border-top-color: #960014; border-top-width: 1px;
	}

.knittext a:hover { 
	background: none; background-color: #a80000;
	text-decoration: none; color: #ffffff;
	padding-top: 10px; padding-left: 0px; padding-bottom: 10px;
	border-top-style: dashed; border-top-color: #ffff99; border-top-width: 1px;
}
			
		
		
		
		
/***** BLOG *****/

.pic {
	position: relative; top: 0px; left: 70%; width: 162px; height: 122px;
}

#containerBlog { 
	position: relative; top: 0px; left: 0px; width: 100%; height: auto;
	margin: 0 auto; 
	color: #000000;
  z-index: 10; 
	clear: right; 
}
	
		#containerBlog b { text-align: center; color: #800000; }
		#containerBlog b.date { color: #BCC8C6; text-decoration: bold; }
		
		#containerBlog b.orange { color:  #ff8000; text-decoration: none; font-weight: bold; font: 2.1em/1.5em century gothic, arial; }
		#containerBlog b.red { color:  #800000; text-decoration: none; font-weight: bold; font: 2.1em/1.5em century gothic, arial; }
		
		#containerBlog a { text-decoration: none; color: #D25613; font-weight: bold; }
		#containerBlog a:hover { text-decoration: none; color: #000000; font-weight: bold; }
		
	

	
	.blogtext { padding-left: 30px; padding-right: 20px; }

	.blogextendedlink { 
		position: absolute; width: 100%; bottom: 0px;
		border-top-style: dashed; border-top-color: #574C1A; border-top-width: 1px; 
	}

		.blogextendedlink a { 
			display: block;  width: auto; height: auto; 
			text-decoration: none; color: #960014; font-weight: bold; 
			padding-top: 5px; padding-bottom: 10px; 
		}
		
		.blogextendedlink a:hover { 
			display: block;  width: auto; height: auto; 
			background-color: #a80000;
			text-decoration: none; color: #ffffff; font-weight: bold;
			padding-top: 5px; padding-bottom: 10px;
		}
		
		.blogtext { padding-left: 30px; padding-right: 20px; }

	.bloglink { 
		position: relative; width: 100%; top: 0px;
		padding: 0px; 
		border-top-style: dashed; border-top-color: #574C1A; border-top-width: 1px; 
	}

		.bloglink a { text-decoration: none; color: #960014; font-weight: bold; }
		.bloglink a:hover { color: #000000; text-decoration: none; font-weight: bold; }
		
	.bloglink2 { 
		position: relative; width: 100%; top: 0px;
		padding: 0px; 
		border-top-style: dashed; border-top-color: #574C1A; border-top-width: 1px; 
		border-bottom-style: dashed; border-bottom-color: #574C1A; border-bottom-width: 1px; 
		margin-bottom: 40px; 
	}

		.bloglink2 a { text-decoration: none; color: #960014; font-weight: bold; }
		.bloglink2 a:hover { color: #000000; text-decoration: none; font-weight: bold; }
	
	
	
	
/***** FLICKR PHOTOS *****/

#containerFlickr { 
	position: relative; left: 0px; bottom: 0px; height: auto; width: 100%;
	z-index: 10; 
	padding-bottom: 25px;
	padding-right: 10px;
	clear: both;
    float: right;
    overflow: hidden;
}

	#logoFlickr { 
		background: url(/_img/title_flickr.png); background-position: right; 
		position: relative; right: 0px; top: 0px; 
		height: 30px; width: 350px;
		}
	
	#flickr_badge_source_txt {padding:0; font: 11px Arial, Helvetica, Sans serif; color:#666666;}
	#flickr_badge_icon {display:block !important; margin:0 !important; border: 1px solid rgb(0, 0, 0) !important;}
	#flickr_icon_td {padding:0 5px 0 0 !important;}
	
		.flickr_badge_image {text-align:center !important;}
		.flickr_badge_image img {border: 1px solid black !important;}
	
	#flickr_www {display:block; padding:0 10px 0 10px !important; font: 11px Arial, Helvetica, Sans serif !important; color:#3993ff !important;}
	#flickr_badge_uber_wrapper a:hover,
	#flickr_badge_uber_wrapper a:link,
	#flickr_badge_uber_wrapper a:active,
	#flickr_badge_uber_wrapper a:visited {text-decoration:none !important; background:inherit !important;color:#3993ff;}
	#flickr_badge_wrapper {}
	#flickr_badge_source {padding:0 !important; font: 11px Arial, Helvetica, Sans serif !important; color:#666666 !important;}
	
	
	
	
/***** BOTTOM *****/

#containerBottom { 
		position: relative; top: 0px; left: 0px; width: 900px; height: auto;
		margin: 0 auto; 
		color: #000000;
}

	.bottomtext { position: relative; padding: 0px; width: 90%;}

	#gradientBottom {
		/* background-color: #390000; */
    background: #390000 url(/_img/gradient_btm.png);  background-position: top; background-repeat: repeat-x;
		position: relative; top: 0px; height: auto; width: 100%;
		z-index: 0;
		padding-bottom: 20px;
		clear: both;
		float: left;
	}
	
	#copyright {
		font: 8pt/10pt century gothic, arial;
		color: #ffff99; 
		text-align: center;
	}

	#bottomLeft {
		position: relative; top: 20px; left: 0px; height: auto; width: 160px;
		padding-bottom: 0px;
		z-index: 1;
		text-align: center;
		float: left;
		clear: none;
		margin-left: 0px; margin-right: 10px; margin-bottom: 20px;
	}

		#bottomLeft a:link { text-decoration: none; color: #ffff99; }
		#bottomLeft a:hover { text-decoration: none; color: #960014; }

		
	#bottomMid {
		position: relative; top: 20px; left: 0px; height: auto; width: 320px;
		padding-bottom: 0px;
		z-index: 1;
		clear: none;
		float: left;
		margin-left: 30px; margin-right: 30px; margin-bottom: 20px;
	}

		#bottomMid a { 
			display: block; 
			margin-left: 10px;
			width: 100%; height: auto; 
			text-decoration: none; color: #ffff99; 
			padding: 5px; 
			border-top-style: dashed; border-top-color: #574C1A; border-top-width: 1px;
			border-bottom-style: solid; border-bottom-width: 1px; border-bottom-color: #390000; 
		}
		
		#bottomMid a:hover { 
			margin-left: 10px;
			background: none; padding: 5px; background-color: #800000;
			text-decoration: none; color: #ffff99;
			border-top-style: dashed; border-top-color: #ffff99; border-top-width: 1px;
			border-bottom-style: dashed; border-bottom-color: #ffff99; border-bottom-width: 1px;
		}

	#bottomRight {
		position: relative; top: 20px; right: 0px; height: auto; width: 320px;
		padding-bottom: 0px;
		z-index: 1;
		clear: none;
		float: left;
		margin-left: 0px; margin-right: 0px; margin-bottom: 20px;
	}

		#bottomRight a {
			display: block; 
			width: 100%; height: auto;
			text-decoration: none; color: #ffff99;
			padding: 5px;
			margin-left: 10px;
			border-top-style: dashed; border-top-color: #574C1A; border-top-width: 1px;
			border-bottom-style: solid; border-bottom-width: 1px; border-bottom-color: #390000; 
		}

		#bottomRight a:hover { 
			background: none; background-color: #800000;
			text-decoration: none; color: #ffff99;
			padding: 5px; 
			margin-left: 10px;
			border-top-style: dashed; border-top-color: #ffff99; border-top-width: 1px;
			border-bottom-style: dashed; border-bottom-color: #ffff99; border-bottom-width: 1px;
		}
		
		
		
		
		
		
/* RIGHT BOX */


.rightbox {
	margin:0.5em 0; 
	position: relative; left: -10px; 
}
/* Rules for the top corners and border */
.rightbox_top {
	background:url(/_img/box.png) no-repeat 100% 0;
	margin:0 0 0 18px;
	height:17px;
}
.rightbox_top div {
	height:17px;
	width:18px;
	position:relative;
	left:-18px;
	background:url(/_img/box.png) no-repeat 0 0;
}

/* Rules for the bottom corners and border */
.rightbox_bottom {
	background:url(/_img/box.png) no-repeat 100% 100%;
	margin:0 0 0 18px;
	height:18px;
}
.rightbox_bottom div {
	height:18px;
	width:18px;
	position:relative;
	left:-18px;
	background:url(/_img/box.png) no-repeat 0 100%;
}

/* Insert the left border */
.rightbox_leftborder {
	padding:0 0 0 12px;
	background:url(/_img/borders.png) repeat-y 0 0;
}
/* Insert the right border */
.rightbox_rightborder {
	padding:0 12px 0 0;
	background:url(/_img/borders.png) repeat-y 100% 0;
}
/* Wrapper for the content. Use it to set the background colour and insert some padding between the borders and the content. */
.rightbox_content {
	background-color: #FFECB2;
	border:1px solid #FFECB2;
	border-width:1px 0;
	padding:0 10px;
}

/* CSS for the box ends here */



/* LEFT BOX */


.leftbox {
	margin:0.5em 0; 
	position: relative; left: -10px; 
}
/* Rules for the top corners and border */
.leftbox_top {
	background:url(/_img/box2.png) no-repeat 100% 0;
	margin:0 0 0 18px;
	height:17px;
}
.leftbox_top div {
	height:17px;
	width:18px;
	position:relative;
	left:-18px;
	background:url(/_img/box2.png) no-repeat 0 0;
}

/* Rules for the bottom corners and border */
.leftbox_bottom {
	background:url(/_img/box2.png) no-repeat 100% 100%;
	margin:0 0 0 18px;
	height:18px;
}
.leftbox_bottom div {
	height:18px;
	width:18px;
	position:relative;
	left:-18px;
	background:url(/_img/box2.png) no-repeat 0 100%;
}

/* Insert the left border */
.leftbox_leftborder {
	padding:0 0 0 12px;
	background:url(/_img/borders2.png) repeat-y 0 0;
}
/* Insert the right border */
.leftbox_rightborder {
	padding:0 12px 0 0;
	background:url(/_img/borders2.png) repeat-y 100% 0;
}
/* Wrapper for the content. Use it to set the background colour and insert some padding between the borders and the content. */
.leftbox_content {
	background-color: #ffffff;
	border:1px solid #ffffff;
	border-width:1px 0;
	padding-top: 0px;
	padding-left: 10px; padding-right: 10px;
}
/* CSS for the box ends here */