/*
** aardvark.legs reset
**
** links to discogs X members have this (I have this)
*/

/* 
  Reset first. Modified version of Eric Meyer and Paul Chaplin reset 
  from http://meyerweb.com/eric/tools/css/reset/
  
  This ver from Aardvark.legs: http://aardvark.fecklessmind.com/aal.css.txt
*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
header, nav, section, article, aside, footer
{border: 0; margin: 0; outline: 0; padding: 0; background: transparent; vertical-align: baseline;}

blockquote, q {quotes: none;}
blockquote:before,blockquote:after,q:before,q:after {content: ''; content: none;}

header, nav, section, article, aside, footer {display: block;}

/* end reset */

/* global color classes */
.black { color: #000; }
.dblrbl-orange  { color: #FF9432; }
.ltblue { color: #32CCFF; }
.ltgreen { color: #72fd01; }
.tan { color: #fce75a; }
a.tan:hover { color: #fce75a; }
a.ltgreen:hover { color: white; }
a.ltgreen:visited { color: #5ac701 }
.ltgray { color: #DDD; }
.midltgray { color: #BBB; }
.midgray { color: #888; }
.heightauto { height: auto!important; }

/* jQuery UI classes */
.ui-effects-transfer { border: 2px dotted #32CCFF; z-index: 40; opacity: 0.8; /* border-top-style: solid; border-bottom-style: solid; */ padding: 8px 0 8px 8px; margin: -8px 0 0 -8px; }

/* l: 18w top: 16h r: 27w b: 28px (charcoal) */
/* Schillmania dialog CSS -- Even more rounded corners with CSS: Base stylesheet -- */
.dialog { position:relative; margin:0px auto; min-width:8em; max-width:567px; max-height: 680px; /* based on image dimensions - not quite consistent with drip styles yet */ color:#fff; z-index:1; margin-left:18px; /* default, width of left corner */ margin-bottom:0.5em; /* spacing under dialog */ }
	.dialog .content, .dialog .tl, .dialog .tr, .dialog .l, .dialog .bl, .dialog .br { background:transparent url(http://www.doublerebel.com/images/dialog_charcoal.png) no-repeat top right; _display:none; _background: #222; }
	.dialog .content { position:relative; top: 0; left: 0; zoom:1; _overflow-y: visible /* hidden */; background-position: center right; margin: 16px 0 0 18px; padding: 0 27px 0 0; _display: block; min-height: 150px; _height: 150px; }
	.dialog .tl, .dialog .tr { /* top+left vertical slice */ position:absolute; top:0; height:16px; /* top slice height */ margin-top:-16px; width:18px; background-position:top left; }
	.dialog .tl { left:0; margin-bottom: -27px; }
	.dialog .tr { right: 0; width: 100%; background-position: top right; clip: rect(0px 1600px 18px 16px); }
	.dialog .l { position: absolute; top: 16px; left: 0; margin: -16px 0 0 -18px; height: 100%; width: 18px; background-position: center left; }
	.dialog .bl, .dialog .br { position:absolute; bottom: -28px; height:28px; /* height of bottom cap/shade */ margin-top: 0px; font-size: 1px; background-position:bottom right; }
	.dialog .bl { left: 0; width: 18px; /* bottom corner width */ background-position:bottom left; }
	.dialog .br { right: 0; width: 100%; clip: rect(0px 1600px 28px 18px); }
	.dialog .hd, .dialog .bd, .dialog .ft { position:relative; }
	.dialog .wrapper { /* extra content protector - preventing vertical overflow (past background) */ position:static; max-height:1000px; overflow:auto; /* note that overflow:auto causes a rather annoying redraw "lag" in Firefox 2, and may degrade performance. Might be worth trying without if you aren't worried about height/overflow issues. */ }
	.dialog h1, .dialog p { margin:0px; /* margins will blow out backgrounds, leaving whitespace. */ padding:0.5em 0px 0.5em 0px; }
	.dialog h1 { padding-bottom:0px; }

.green .content, .green .tl, .green .tr, .green .l, .green .bl, .green .br { background-image:url(http://www.doublerebel.com/images/dialog_green.png); _display:none; _background: black; }
.green .content { _display: block; }
/* end the mania */

/* Todo: shrink the bg so it sharpens, tweak the folder onmouseover, sketch a portfolio setup, spanish translation -> do a character by character replacement to 'traduce', recenter spanish text, fix code button lower right spec, proper :after for clearing floats*/

html, body { position: relative; top: 0; left: 0; z-index: -10; min-width: 990px; height: 100%; font: 100% Georgia,"Times New Roman",Times,serif; color: #444; background: #df9c08 url(http://www.doublerebel.com/images/orange-hounds-v3.png) repeat; background-color: #FFF; }
* html, * html body { height: 100%; }
	img { border: 0px; }
	a { color: rgb(51,51,153); color: #FF9432; text-decoration: none; }
	a:visited { color: #FF9432; }
	a:hover { color: black; }
	a:active { color: rgb(51,51,153); padding: 0px; }
	br.clearfloat { clear: both; height: 1%; line-height: 1%; }
/* main section */
	#bglayer { position: absolute; top: 0; left: 0; width: 100%; height: 100%; overflow: hidden; z-index: -1; background: url(http://www.doublerebel.com/images/bgfade_brown.png) repeat-x top left; }
	#wrapper { position: relative; width: 960px; min-height: 100%; height: auto; z-index: 10; text-align: left; margin: 0 auto; /* padding-bottom: 55px; */ }
	* html #wrapper { height: 100%; }
	/* .wrapper-shifted { margin-left: -600px; } */
		#sub_btns { position: relative; top: 90px; right: -670px; margin-bottom: -160px; height: 160px; width: 150px; z-index: 11; }
			#sub_btns a { margin: 0 4px; width: 135px; height: 80px; background: url(/images/btn_white-shadow.png) top left no-repeat; }
			#sub_btns img { position: relative; }
			#btn_www { display: none; opacity: 0; }
			#btn_code, #btn_whois { display: block; }
		#space_1 { height: 85px; width: 400px; }
		#header { margin: 0px 0 0 100px; opacity: 1; }
		* html #header { width: 510px; }
		/* .header-shifted { opacity: 0; } */
			#dblrbl { display: block; width: 232px; height: 103px; margin: 0 -232px -103px 0; position: relative; top: -56px; left: -45px; z-index: 122; background: url(/images/dblrbl_v2_head.png) top left no-repeat; }
			#dblrbl_logo { opacity: 0; display: block; cursor: pointer; }
			#is_circle { display: none; position: absolute; top: -63px; top: 0; left: 158px; z-index: 120; margin: 0 -33px -35px 0; margin-top: -46px; }
			#btnholder { position: absolute; top: -45px; right: 30px; width: 180px; z-index: 125; }
			.btnholder-shifted { opacity: 0; }
				#btnholder img { position: absolute; top: 0; }
				.btn0 { right: 0; z-index: 130; }
				.btn1 { right: 50px; z-index: 129; }
				.btn2 { right: 100px; z-index: 128; }
				.btn0, .btn1, .btn2 { float: right; }
			.main_content { padding: 30px; font-size: 1em; margin: 0; letter-spacing: -0.04em; line-height: 1.2em; }
				.main_content h3 { font-size: 2em; font-weight: normal; }
		#welcomebox { margin: 40px 0 70px 100px; width: 500px; }
		* html #welcomebox { width: 475px!important; overflow: hidden; }
			.sub_content { width: 500px; max-width: 520px; padding: 10px 10px 15px 20px; line-height: 0.8em; font-size: 1.2em; min-height: 150px; }
			.sub_content ul { list-style-type: none; }
		#crate { position: absolute; top: 370px; right: 130px; width: 208px; height: 184px; background: transparent url(/images/crate.png) top left no-repeat; z-index: 15; }
			#crate img { position: absolute; z-index: 20; cursor: pointer; }
			#front { top: 16px; left: 0; z-index: 30; }
			.rec1 { top: -12px; left: 57px; z-index: 28; }
			.rec2 { top: -20px; left: 40px; z-index: 26; }
			.rec3 { top: -35px; left: 26px; z-index: 24; }
			.rec4 { top: -40px; left: 0; z-index: 22; }
		#margin-collapse_fix { display: inline-block; width: 960px; height: 1px; position: relative; }
		*:first-child+html #margin-collapse_fix { margin-bottom: 17px; }
	#footer { position: relative; letter-spacing: -0.5pt; font-size: 0.8em; width: 100%; min-width: 960px; color: #114c00; height: 55px; z-index: 10; margin: -55px 0 0; }
		#lr_corner { display: none; position: absolute; right: 0; top: -55px; background: url(/images/lr_corner.png) top left no-repeat; width: 0; height: 110px; z-index: 9; }
		#footer_text { position: relative; width: 100%; height: 50px; background: transparent url(http://www.doublerebel.com/images/bg_footer_green.png) repeat top left; border-top: 5px solid #114c00; }
			#footer a, #footer a:visited { color: #092800; }
			#footer a:hover { color: black; }
			#byline, #copyleft { float: right; padding: 24px 8px 4px 8px; z-index: 11; position: relative; }
                        #byline a.new { display: block; float: right; height: 35px; margin: 0 0 0 -3px; }
                        #byline a img { float:right; margin: -16px 0 0 -8px; }
			#copyleft { float: left; /* font: 8pt "Franklin Gothic Demi","Helvetica Neue Condensed Bold","Arial Black",Arial,Helvetica,sans-serif; */ font-size: 8pt; width: 200px; }
.vinylCap { padding: 8px; margin: 30px 0 0 0; background: #555; color: white; z-index: 35; position: absolute; display: none; border: 2px solid #333; /* border-color: #32CCFF; */ font: inherit; letter-spacing: -0.03em; font-size: 0.9em; cursor: pointer; }
.vinylCap:hover { color: #fce75a; }

/* welcome section 0 */
			#welcome { font-size: 1.2em; line-height: 1.5em; padding: 50px 0px 0px 20px; letter-spacing: -0.05em; }
			* html #welcome { width: 450px; padding-bottom: 15px; }
				#welcome div div, #welcome ul { float: left; }
					#welcome div div { margin: 1em 0 2em 16px; }
				#welcome ul { width: 200px; list-style-type: none; }
					#welcome li a { color: inherit; }
						a.green:hover { color: #72fd01!important; }
					#welcome li span { display: none; }
						#welcome ul li.active span { display: inline; }
						*:first-child+html #welcome ul li.active a { color: white; }
					*:first-child+html #welcome li { margin-bottom: -0.27em; height: 1em; }
					.stepone, .stepone a { color: #444; }
					.steptwo, .steptwo a { color: #222; }
					.stepthree { display: none; color: #111; height: 0; }
					.stepthree a { color: #111; }
				.head1 { font-size: 23pt; font-size: 1.5em; }
				.head2 { vertical-align: text-top; font-size: 25.5pt; font-size: 1.8em; }
					.head2 a, .head2 a:visited { color: white; }
					.head2 a:hover { color: black; }
				.bienvenido, .bienvenido a { width: 100%; text-align: center; color: #600; margin: 0; padding: 1em 0 10px; clear: both; }
					.bienvenido a { display: none; }
					.bienvenido a:hover { color: #900; }
/* welcome section 1 */
			#welcome2 { width: 500px; padding: 10px 10px 15px 20px; line-height: 0.8em; font-size: 1.2em; min-height: 150px; }
				#welcome2 ul ul { margin-top: 10px; color: #999; _width: 120px; }
				#welcome2 ul ul:hover { margin-top: 10px; color: white; _width: 120px; }
				#welcome2 > ul > li { float: left; display: inline; width: 120px; margin: 8px 0 0 5px; color: #FF9432; color: #72fd01; }
				* html #welcome2 li { float: left; display: inline; width: 120px; margin: 8px 0 0 5px; color: #72fd01; }
					.webdev { width: 200px!important; }
					.webdev li { margin-bottom: 5px; width: 190px!important; }
					#welcome2 li li { font-size: 0.8em; font: 0.6em "Segoe UI",Myriad,Tahoma,Helvetica,Arial,sans-serif; cursor: pointer; margin: 0; }
					* html #welcome2 li li { float: none; display: block; width: auto; cursor: default; color: white; }
					#welcome2 li li span { color: #32CCFF; }
						.bright { color: black; cursor: pointer; }
			#welcome3 { width: 400px; margin: 50px 0 0 200px; }
				#welcome3 .content { padding: 0 16px 12px; }
					#welcome3 .content img.header { position: absolute; margin: -24px -5px -36px -130px; }
				#welcome3 li { margin-left: 10px; font-size: 80%; line-height: 1.1em; }
					.rssfeed { list-style-type: square; font-size: 18px; line-height: 14px; margin-left: 18px; width: 350px; }
					* html .rssfeed { margin-left: 0px; }
					* html .rssfeed li { margin-left: 18px!important; }
						.rssfeed span { font-size: 11px; }
					.whois { text-transform: uppercase; font: 10px Arial,Helvetica,sans-serif; list-style-type: none!important; font-weight: bold; margin: 0px 0px 10px -10px; padding: 3px 6px 3px 6px; width: 350px; }
					* html .whois { margin-left: 0px; }
						.whois a { color: white; }
						.whois a:visited { color: white; }
/* about section 0 */
			#about_0 { line-height: 1.4em; }
				#about_0 h3 { padding-bottom: 8px; }
				#about_0 ul { list-style-type: none; font-size: 90%; margin-top: 10px; }
					#about_0 li { padding-left: 22px; margin-left: 20px; background: transparent url(/images/checkedbox.png) 0px 1px no-repeat; }
					li.clocked { background: transparent url(/images/clockbox.png) 0px 4px no-repeat !important; }
/* about section 1 */
			#about_1, #about_2  { letter-spacing: -0.04em; width: 420px; }
			#about_1 { line-height: 1.4em; font-size: 1em; }
				#about_1 h4 { font-weight: normal; font-size: 1.65em; padding: 0.4em 0 0.5em; }
				#about_1 p, #about_2 p { font-family: "Segoe UI",Myriad,Tahoma,Helvetica,Arial,sans-serif; }
/* about section 2 */
		#about_c { margin: -30px 0 70px 100px; width: 500px; }
			#about_2 { line-height: 1.4em; font-size: 0.8em; }
			*:first-child+html #about_2.long { height: auto; }
			#about_2.short { height: 12em; overflow: hidden; }
				#about_2 h4 { font-weight: normal; font-size: 1.8em; line-height: 1.4em; padding-bottom: 0.5em; }
				#headshot { float: right; margin: 10px 3px 5px 3px; border: 3px solid #888; }
				#more_btn { height: 30px; width: 282px; position: absolute; right: 195px; bottom: 0; text-align: right; background: transparent url(/images/about_more-bg.png) top left repeat-x; }
				#more_btn img { cursor: pointer; }
				#teaser { position: absolute; bottom: -7px; right: -230px; width: 230px; }
					#teaser .content { margin-top: -10px; min-height: 30px!important; }
					#teaser a:hover { color: yellow; }
					.teasertxt { padding: 10px; margin-top: 10px; font-size: 0.9em; }
				.smaller { font-size: 0.9em; }

/* contact section 0 */
				.main_content .emailspan { display: block; margin: 8px 0 30px; font-size: 1.2em; }
/* contact section 1 */
			#formwrapper { padding: 0; }
				#contactform { padding: 5px 10px 10px; font-size: 0.9em; line-height: 1.4em; }
					#contactform fieldset { padding: 0 20px; }
					*:first-child+html #contactform fieldset { line-height: 150%; }
					#contactform legend { font:1.2em 'Segoe UI',Segoe,Helvetica,Tahoma,Arial,sans-serif; font-weight: bold; color: #111; padding: 2px; margin-left: -20px; }
					* html #contactform legend { color: #777; }
					.contacthead { text-transform: uppercase; font-size: 1.1em!important; }
					#contactline { font-size: 0.9em; margin: 10px 0 0 10px; color: #a4b6c7; }
					#contactform .txtlbl { font-size: 1em; height: 25px; display: inline-block; width: 90px; text-align: right; margin-right: 5px; }
					*:first-child+html .txtlbl { vertical-align: 0.2em; }
					.lbl { color: #E2E2E2; }
					#contactform input { margin: 2px; color: black; background: #CCC; height: 1.4em; border: 2px solid #DDD; max-width: 268px; }
					#contactform input:focus { background: white; }
					#contactform .fs_prefer { margin: 12px 0 10px; font-size: 0.9em; }
						.fs_prefer input { vertical-align: -0.3em; background: transparent!important; border: none!important; }
					.messagelbl { margin: 2px 0px 4px; display: inline-block; font-family: 'Segoe UI',Segoe,Helvetica,Tahoma,Arial,sans-serif; }
					#message { margin: 0 0 10px; color: black; max-width: 370px; background: #CCC; }
					#message:focus { background: white; }
					* html #message { width: 400px; }
					#contactform .btn { margin: 0 0 10px 14px; height: auto!important; }
					#prevent { display: none; }
					
/* portfolio section 0 */
			#portfolio_0 { padding: 30px 30px 10px; line-height: 1.4em; }
			#folio_thumbwrap { position: relative; width: 460px; height: 104px; margin: 20px 0 0; overflow: hidden; }
				#folio_thumbs { position: absolute; top: 0; left: 0; width: 1000px; height: 104px; clip: rect(0px 434px 104px 0px); }
					.thumb { height: 100px; width: 100px; border: 2px solid black; overflow: hidden; float: left; margin-right: -2px; }
					.thumb:hover { border-top-color: #32CCFF; border-bottom-color: #32CCFF; }
						.folio { cursor: url(http://www.doublerebel.com/images/zoom-in.cur),pointer; } /* cursor url must be absolute reference!!! */
				#thumb_cover { position: absolute; right: 26px; top: 0; }
				#folio_arrow { position: absolute; right: 0; top: 0; opacity: 0.92; }
					#folio_arrow img { position: relative; }
/* portfolio section 1 */
				#folio_window { position: relative; border: 3px solid #333; max-width: 400px; border-width: 0; margin: 0 6px; padding: 4px; letter-spacing: -0.02em; }
					#folio_window dt { padding: 0 0 8px; }
						#folio_window dt span { font-size: 0.7em; }
						#folio_window dd { font-size: 0.55em; color: white; }
							#folio_window dd span { border-bottom: 2px solid #72fd01; border-color: #DDD; border-width: 0; display: block; padding-bottom: 4px; margin-bottom: 12px; }

/* whois section */
#whois_head { display: none; position: absolute; top: 0; left: 0; z-index: 30; }
#whois_wrap { display: none; position: relative; right: -850px; top: 0; width: 690px; min-height: 100%; height: auto; z-index: 11; margin-bottom: -18px; }
	#backbar { position: relative; top: 0px; left: 50px; height: 100%; width: 516px; z-index: 12; background: url('/whois/images/barback_blue.gif') repeat-y; }
	*:first-child+html #backbar { margin-bottom: -17px; }
	#backbar_shadow-l, #backbar_shadow-r { position: absolute; top: 0px; width: 12px; height: 100%; z-index: 11; background: url('/whois/images/whois-bargrad.png') top left repeat-y; }
	* html #backbar_shadow-l, * html #backbar_shadow-r { display: none; }
	#backbar_shadow-l { left: -12px; }
	#backbar_shadow-r {	background-position: top right; right: -15px; width: 15px; }
	#blogbar { position: relative; left: -50px; top: 0; width: 550px; border-color: gray; z-index: 15; padding: 40px 0 60px; /* background: url('images/leafback.gif') 23px 150px no-repeat; */ }
		.entry { margin-top: 30px; font: 12px Georgia,Times,serif; color: black; background: transparent; }
			a.titleline, a.titleline:visited { color: rgb(51,51,153); }
			.e_head_wrap { height: 24px; margin-bottom: 8px; }
			.e_head { border-bottom: 1px solid rgb(51,51,153); font-size: 18px; color: rgb(51,51,153); width: auto; float: left; padding-right: 1px; }
			.titleline { margin-left: 75px; }
			.e_head a { position: relative; top: 5px; }
			.meta { float: right; width: 50px }
			.entry div.date { border: 1px solid gray; margin: 2px 8px 8px 26px; background: white; font: 12px 'Segoe UI',Segoe,Helvetica,Tahoma,Arial,sans-serif; color: gray; width: 60px; float: left; text-align: right; vertical-align: middle; letter-spacing: -1px; display: inline; }
				.entry div.date span { margin: 4px; display: block; }
				.entry div.date span.permlink a { color: gray; font-size: 85%; }
				.entry div.date span.permlink a { color: rgb(51,51,153); background: transparent; padding: 0px; }
			.entrytext { float: left; width: 405px; line-height: 18px; margin-left: 22px }
				.entrytext img { margin: 0px 5px 0px 5px; }
			.tb_paw { }
			.comments { background: url('/whois/images/comment.png') no-repeat; }
			.icons { height: 23px; width: 20px; margin: -1px 2px 2px 2px; text-align: center; vertical-align: middle; float: right; }
				.icons a { color: white; background: transparent !important; }
				.icons a:visited { color: white; }
				.icons a:hover { color: orange; }
			.entryfooter { bottom: 0px; margin: 2px 5px 2px 0px; padding: 8px 0px 0px 0px; color: #444; display: block; }
			.entryfooter span { border-bottom: 1px dashed rgb(51,51,153); }