/*  Basic  */

body {
  background:#fff;
  margin:0;
  padding:0;
  color:#035;
  font: 12px Verdana,sans-serif;
}

form {  
   margin-top: 0;
   padding-top: 0;
   margin-bottom: 0;
   padding-bottom: 0;   
}

#content, #front_content, #footer{
   padding: 0em 1.7em;
   min-width: 650px;
   max-width: 850px;
}

#footer{  
   clear: both;  
   text-align: left;
}

#content, #front_content {   
   clear: both;
   margin: .2em;
   font-size: .8em;
}

a { color: #15A; }
a:visited { color: #32A; }
a:hover { text-decoration: none; }


hr {
   border: 0px solid #D0D3D7; 
   background-color: #D0D3D7; 
   color: #D0D3D7; 
   height:1px;  
   margin: 6px 6px 6px 2px;
   padding: 0;
}

.clear { clear: both; }

/* Buttons */



.bluebutton, .whitebutton {
   cursor: pointer;
}   

.whitebutton { 
   padding: 0;
   margin: 0;
   border-width: 0 !important;  
   height:39px;
   background: #FFF center center no-repeat;
}

.bluebutton {
   padding: 2px;
   margin: 2px;
   border-width: 0 !important;  
   height:32px;
   background: center center no-repeat;   
}

.signin {
   background-image: url('/images/buttons/sign_in_sm.gif'); 
   width:100px; 
}


.submit {
   background-image: url('/images/buttons/submit_sm.gif'); 
   width:100px; 
}

.disabled_buttonlink { 
   background: #EEE;
   color: #666;
   font-weight: bold;
   cursor: default ! important;
}

.copy_button, .buttonlink, .buttonlink_right{
   background: #004D97 url(/images/buttonlink.png) top center;
   color: white;
   font-weight: bold;    
   vertical-align: middle !important;  
   white-space: nowrap;
}

a.buttonlink{
   padding: .15em .25em;
   text-decoration: none;
   color: white;
}

a.buttonlink:hover, a.buttonlink:visited, a.buttonlink:active, a.buttonlink_right:hover, a.buttonlink_right:visited, a.buttonlink_right:active {
   text-decoration: none;
   color: white;
}
input.buttonlink, input.buttonlink_right { padding: .1em .2em; }

.boxlet th .buttonlink, .boxlet td .buttonlink, .copy_button {
   padding: .1em .2em;
   font-size: .9em;  
   vertical-align: middle !important;   
}

.existing_recording .buttonlink_right, .new_recording .buttonlink_right  {
   padding: .3em;
   font-size: .88em; 
   border: 0;
}

#newContent .buttonlink, #userUpdates .buttonlink {
   padding: .3em .4em !important;  
   margin: .2em .2em .2em 2em !important;
   vertical-align: middle;
   white-space: nowrap !important;      
}


#getvoxmail_button {
   width: 275px;  
   background-image: url( /images/buttons/getvoxmail.png );  
}

#getvtag_button {
   width: 275px;  
   background-image: url( /images/buttons/getvtag.png );  
}

#signin_button {
   width: 176px;
   background-image: url( /images/buttons/signin.png );  
}


a.rollover_button {
   display:block;
   overflow:hidden;  
   border:0;
   margin: 3px 0px;
   background-position: 0 0;
   height: 49px;
}

a.rollover_button:hover {
   background-position: 0 -49px;
}

a.rollover_button:active {
   background-position: 0 -98px;
   border:0;
}


/* Layout */

.wide_margin {
   text-align: center;
   margin: 0 auto;
   width: 26em;
}

.nowrap {    
   min-width: 700px;
   max-width: 1000px;
}

.left_float, .floating_tag, #front_voxmail, #front_vtag, #col1, #col2 {
   float: left; 
   vertical-align: top;
   margin-right: 1.5em;
}

.right_content, .right_float, #col3 { 
   float:right; 
   vertical-align: top;
   margin-left: 3em;   
}

.right_float_sm { 
   float:right; 
   vertical-align: top;
}

.floating_tag {
   width: 200px;
   margin-right: 2em;
}

.floating_tag * { margin: .25em 0; }


/* Boxes */

.boxlet, .boxlet_half{
   border: 1px solid #567;
   margin: 0 0 1em;
}

.boxlet_half { width: 47% }

.boxlet .header, .boxlet .footer, .boxlet_half .header, .boxlet_half .footer{
   background:#DAE0D2;
   color: #555;
   font-weight: bold;
   font-size: 1.3em; 
   padding: .5em;     
}

.boxlet .header, .boxlet_half .header{ border-bottom: 1px solid #333; }
.boxlet .footer, .boxlet_half .footer{ border-top: 1px solid #333; }

.box_content{ padding: 1em; }

table.boxlet {
   padding: 0 !important;
   width: 90%;
}
.boxlet td {
   text-align: left;
   padding: .3em .9em;
   font-size: 1.1em;
   vertical-align: top;
}

.boxlet th {
   text-align: left;
   padding: .4em .9em;
   font-size: .95em;  
}


/* Lists */

.tag_list_code span{
   font-size: 1.2em;
   font-weight: bold;
}

ul.content_list, ul.content_list_tight, #new_tag_list{
   list-style: none none;
   margin: 0;
   padding: 0;
}

ul.content_list_bullet{
   list-style: outside;
   padding: 0;  
}

ul.content_list_bullet li, ul.content_list li, #new_tag_list li{
   margin: 0px 5px 20px 20px;
   padding: 0;
   clear: left;
}

ul.content_list_tight li{
   margin: 0px 5px 0px 25px;
}

#new_tag_list img {
   margin: 5px 7px 5px 0px;
   border:0;   
}

ul.content_list li img {
   margin: 2px 7px 2px 0px;
   border:0;
}

/* Content browsing  */

.tag_list_details, .tag_details, .tag_list_code {
   margin: .2em .3em .7em;
}

.tag_details{ 
   margin: 0; 
   padding: 0;
}

.existing_recording, .new_recording, .tag_list_details div { 
   font-size: 1.1em; 
   }
   

.tag_list_code { margin-bottom: 1em; }

.recording_info
{ 
   vertical-align: baseline;
   border: 0;
}


#newContent li, #userUpdates  {
   padding: .8em;
   font-size: 1.3em;
   vertical-align: top;
}

#newContent li {
   width: 48em;
}

.soundlink {
   margin: 0;  
   padding-left: .4em;    
   border: 0;
   white-space: nowrap !important;   
}

.tag_list_code, .tag_details, .tag_list_duration { clear:left; }


.delete_content div { 
   color: red; 
   font-weight: bold;
   font-family: Verdana,sans-serif;   
   margin-bottom: .5em;
}

.skinner_preview
{
   margin: .8em 0 1em;
   padding: .5em;
   border: 1px dashed #999;
}

#skinner_options select{ margin: .3em 0 .8em; }
#thumbnails { 
   padding: .5em 0; 
   width: 92%;
   white-space: nowrap;
 }
 
#thumbnails * {
   vertical-align: middle;     
   padding: .1em;
   border: 0;
}

/* Labels */

.label {  
   vertical-align: top;
   float: left;
   display: inline;
   }

.label_text, .label_text_hover
{
   font-size: 1.1em;
   line-height: 130%;
   padding: 3px;
   background-color: #D0E0E0;   
   font-weight: bold;
   text-decoration: underline;
   float: none;
}

.label_text {
   border: 0px;  
}

.label input { font-size: 1em; }

.tag_details, .tag_list_entry .label {
   margin: .1em;
}


/* Type */

h2, h3 { vertical-align: middle; }
h3, .h3_list, .h4span, h4, .h4_list li, h5, h6 { font-weight: normal }

h1 { 
   line-height: 130%;
   font-size: 22px;
   margin: .65em 0;
}

h2 { 
   line-height: auto;
   font-size: 13px;
   margin: .75em 0;
}

.h2span{ 
   font-size: 13px; 
   font-weight: bold;
   }

.h3_list li { 
   line-height: 125%;
   font-size: 12px;
}

h3 { 
   line-height:auto;   
   font-size: 12px;
   padding: .4em;
   margin: 0;
}

h4, .h4_list li, .h4span { 
   font-size: 10px;
   line-height:auto;   
}

h5 { 
   font-size: 9px;
}

h6 { 
   font-size: 8px;
}

 
h3 input {
 vertical-align: baseline; 
 padding-bottom: 0;
 margin-bottom: 0;
}

.med_space {
   line-height:100%;   
   margin: 0;
   padding: .4em;     
}

.right_margin_scale, .details {
   margin: 0 25% 0 0;   
}

.details { 
   padding: 0 0 .8em 2em;
   color: #668;
   font-size: 1.2em;
 }

.tight_space {
   line-height:100%;   
   margin: 0;
   padding: 0;     
}

.bott_space {
   margin-bottom: 1.5em;
}

.width_66 { width: 66%; }
.width_48 { width: 48%; }
.width_33 { width: 33%; }
.width_25 { width: 25%; }


/* Tables */

.small_table {
   padding: 0;
   margin: 0 2px;   
}

.small_table td {
   vertical-align: middle !important;
   padding: 1px 0px;
   margin: 0;
   font-size: 1.25em;
   line-height: 110%;
}


#login_table, #form_table, .form_table{
   vertical-align: middle;
   padding: 0;
   margin: 2px;
   text-align: center;
}

#form_table, .form_table, .green {
   background-color: #dfffd3;
}

.blue {
   color: #444680;
 }

.bordered{
   border: 1px solid #ABC; 
}

.borderless{
   border: 0px; 
}

#login_table th, #form_table, .form_table th  {
   font-size: 1.3em;
   padding: .2em;
}


#login_table td, #form_table, .form_table td {
   font-size: 1em;  
   padding: .2em;  
}

#login_table td, #form_table, .form_table td, #form_table, .form_table_txt td  {
   text-align: left;
   font-weight: normal;
}

#login_table th, #form_table, .form_table th, #form_table, .form_table_txt th  {
   text-align: right;
   font-weight: bold;
}

#form_table, .form_table_txt th, #form_table, .form_table_txt td  {
   padding: .5em .3em;  
   font-size: 1.2em;   
   vertical-align: middle;
}

#form_table, .form_table_txt td img {
   margin-top: 7px;  
}

#form_table, .form_table td {
   font-size: 1.3em;  
   padding: .8em .8em .2em .3em;
}

#form_table, .form_table th {
   width: 10em;
   white-space: nowrap;
   padding: 1.2em .3em .8em .8em;
   vertical-align: top;   
}

.form_detail {
   margin: 0 0 5px 10em;
   padding-top: 0;
}

#form_table, .form_table .tbl_header {
   background-color: #ABC; 
   padding:0;
   border-bottom: 1px solid #567; 
}

#form_table, .form_table .tbl_header td{
   padding:8px;
}

.error_div, .status_div {
   background-color: #FFF; 
   border: 1px solid #911; 
   padding: 12px; 
   margin: 2px 12px 10px;
   display: none;
}

.instrux_div {
   background-color: #FFF; 
   border: 1px solid #ABC; 
   padding: 6px; 
   margin: 0px 3px 12px 9px;
   display: none;
}

#recording_begin {
   padding: 5px 10px; margin-top:0;
   display: none;
}

#recording_instructions {
   font-size: .8em;  
}

#login_table input, #form_table, .form_table input, #login_table button, #form_table, .form_table button { margin: .05em .1em; }

#login_table #login_button_row {
   text-align: center;   
   padding: .8em .25em .5em 1.2em;
}

#login_table #center_button_row {
   text-align: center;   
   padding: 1.5em .5em .5em;
}

#get_voxmail_layout td {
   vertical-align: top; 
   margin-right:8px;
}

.browser_table .buttonlink, .browser_table .copy_button {
   font-size: .9em;  
   padding: .1em .2em;
   vertical-align: middle !important;   
}

.browser_table img  { border: 0; }
.browser_table button { font-size: .95em; }

.browser_table td {
   text-align: left;
   padding: .5em .9em;
   font-size: 1.1em;
   vertical-align: top;
}
.browser_table th {
   background-color: #DEF;
   color: #555;
   font-weight: bold;
   font-size: 1.3em;
   padding: .1em .5em .5em;     
}

.browser_table .header th {
   border-bottom: 1px solid #ABC;
}

.browser_table .footer th {
   border-top: 1px solid #ABC;
}

/* Special Classes */

.notification { 
   display: block;   
   margin: 2px;
   padding: 2px;
   line-height: 170%;
   vertical-align: baseline;
}

.baseline { vertical-align: baseline !important; }

.padded { padding: 1.5em .3em; }

.even_padded { padding: 1.5em; }

.margined { margin: 1em; }

.top_tight { margin-top: 0 !important;  padding-top: 0 !important; }
.bott_tight { margin-bottom: 0 !important;  padding-bottom: 0 !important; }

.top_space { margin-top: 1em; }
.bott_space { margin-bottom: 1em; }
.top_space_tiny { margin-top: .2em; }
.top_space_sm { margin-top: .5em; }
.bott_space_sm { margin-bottom: .5em; }
.side_padded { padding: 0em 1.5em; }

.nobr { white-space: nowrap;}

.padded_tbl { 
   padding: 2em;
   
}

.new_recording {
   color: #333;
   background-color: #DAE0D2;  
}

.lite_text {
   color: #889;
   font-style: italic;  
}

.hidden { display: none }

.code { vertical-align: top; }

.odd{ background-color: #FFF; }

.even{ background-color: #EAEDF5; }

.unused { color: red; }

.indent { margin-left: 1.5em; }

.indent_sm { margin-left: .5em; }

.indent_tiny { margin-left: .2em; }

.error { 
   font-weight: bold;
   color: #933;
   line-height: 120%;
 }
 
.status {    
   font-weight: bold;
   color: #11C;
   line-height: 120%;
 }

.shaded {
   background-color: #E8EEE0;
}

.paste_voxmail_instrux, .paste_vtag_instrux, .simplebox {
   background-color: #FFF; 
   border: 1px solid #ABC; 
   padding: 9px; 
   margin: 15px 6px 10px;  
   line-height:111%;
}

.paste_voxmail_instrux img, .paste_vtag_instrux img {
   border: 0px;
   padding: 5px 6px 10px;
}

.header_textimg {
   clear: both;
   border: 0px;
   padding: 12px 3px 3px;   
}

.subtitle{
   margin-top: 0px;
   padding-top: 0px;  
}

#myspace_profile { background-image: url( /images/logos/myspace_profile.png ); }
#myspace_comment { background-image: url( /images/logos/myspace_comment.png ); }
#livejournal_post { background-image: url( /images/logos/livejournal_post.png ); }
#livejournal_comment { background-image: url( /images/logos/livejournal_comment.png ); }
#friendster { background-image: url( /images/logos/friendster.png ); }
#myyearbook { background-image: url( /images/logos/myyearbook.png ); }
#myspace { background-image: url( /images/logos/myspace.png ); }
#myspacemusic { background-image: url( /images/logos/myspacemusic.png ); }
#xanga { background-image: url( /images/logos/xanga.png ); }
#tagged { background-image: url( /images/logos/tagged.png ); }
#tagworld { background-image: url( /images/logos/tagworld.png ); }
#hi5 { background-image: url( /images/logos/hi5.png ); }
#othersites { background-image: url( /images/logos/othersites.png ); }


a.logo_img_active, a.logo_img, a.logo_img:hover {
   display:block;
   margin: 6px; 
   padding: 0;
   height: 36px;
   width: 110px;
   overflow: hidden;  
   border:0;
   float:left;
}

a.logo_img {
   background-position: 0 -36px;
}

a.logo_img:hover, a.logo_img_active {
   background-position: 0 0;
}



/* Header include stuff */

#tab_bg {
    background: #e8fffb url("/images/tabs/tabs_bg.gif") repeat-x !important; 
}

#header{
   padding: .25em 1em;
   margin: 0;
   line-height: 4.3em;
   white-space: nowrap;
} 

#branding_top img {
   float:left;
   border: 0;
}

#header_nav, .rightalign {
   text-align: right;
   }
   
.header_fade { 
   background: #e8fffb url("/images/header_notabs_bg.gif") repeat-x !important;
  border-bottom: 1px solid #9cbee3;  
}
   
#header_nav a{ margin: 0 .5em; }

#tabs {
   clear: both;
   float:left;
   width:100%;
   height: 30px;
   margin: 0 0 6px;
   padding: 0;
   background-color: #e8fffb;
   vertical-align: top;
	border-bottom: #9cbee3 1px solid;
	border-top: #bcdeff 0px solid;
}

#nav {
	margin: 0;
	padding: 0 0 0 49px;
	list-style:none;
}

#nav li.on a{
   color: #3377cc;
   font-weight: bold;
}

#nav li.off a{
   color: #667788;
   font-weight: normal;
}


#nav li a:hover{
   color: #1199ee;
}

#nav li {
  /*float the main list items*/
  margin: 0;
  padding: 0;
  float: left;
  display: block;
}

#nav li a {
   /*for all links in the list*/
   display: block;
   text-decoration: none;
   width: auto;
   padding: 8px 15px 5px 12px;
}

#nav li.on a, #nav li.off a {
	float: left; /*ie doesn't inherit the float*/
	border: 0;
	width: auto;
	padding: 5px 10px;
	margin: 0 !important;
}	
	


/* front page stuff */

#front_header{
   clear:left;
   background: url(/images/frontpage_bg2.gif) repeat-x; 
   margin:0;
   padding:0;
   vertical-align: top;
}

#front_header * {
   margin:0;
   padding:0;
   border:0;
}

#front_content embed {
 margin: 2px 12px 12px 6px;
 float:left;
}

#front_padded { 
   margin: 0 25px 15px;
   width: 737px;
 }

 
 /* Hints */
 
 .hints
{ 
  display: none;
}

.hint
{ 
  width: 200px; 
  color: #000;
  font:lighter 11px/1.3 Arial,sans-serif;
  text-decoration:none;
  text-align:center;
}

.hint span.top
{
  padding: 30px 8px 0;
  background: url(/images/hints/hintbg_below.gif) no-repeat top
}

.hint span.bottom
{
  padding:3px 8px 15px;
  color: #548912;
  background: url(/images/hints/hintbg_below.gif) no-repeat bottom
}

.hint span.revTop
{
  padding: 7px 8px 0;
  background: url(/images/hints/hintbg_above.gif) no-repeat top
}

.hint span.revBottom
{
  padding:3px 8px 27px;
  color: #548912;
  background: url(/images/hints/hintbg_above.gif) no-repeat bottom
}


/* These are standard sIFR styles... do not modify */

.sIFR-flash {
	visibility: visible !important;
	margin: 0;
}

.sIFR-replaced {
	visibility: visible !important;
}

span.sIFR-alternate {
	position: absolute;
	left: 0;
	top: 0;
	width: 0;
	height: 0;
	display: block;
	overflow: hidden;
}

/* Hide Adblock Object tab: the text should show up just fine, not poorly with a tab laid over it. */
.sIFR-flash + div[adblocktab=true] {
  display: none !important;
}

/* These "decoy" styles are used to hide the browser text before it is replaced... the negative-letter spacing in this case is used to make the browser text metrics match up with the sIFR text metrics since the sIFR text in this example is so much narrower... your own settings may vary... any weird sizing issues you may run into are usually fixed by tweaking these decoy styles */

.sIFR-hasFlash .sifr1 {
	visibility: hidden;
	letter-spacing: -10px;
	font-size: 52px;
	margin: 0;
	padding: 0;
	line-height: 121%;
}

.sIFR-hasFlash .sifr2,.sIFR-hasFlash .sifr2b  {
	visibility: hidden;
	letter-spacing: -8px;
	font-size: 40px;
	margin: 9px 0 0;
	padding: 0;
	line-height: 103%;
}

.sIFR-hasFlash .sifr3 {
	visibility: hidden;
	letter-spacing: -2px;
	font-size: 36px;
	margin: 0;
	padding: 0;	
	line-height: 103%;
}

.sIFR-hasFlash .sifr3b {
	visibility: hidden;
	display: inline;
	letter-spacing: -1px;
	font-size: 24px;
	margin: 2px;
	padding: 2px;	
	text-align: center;
	line-height: 103%;
}

.sIFR-hasFlash .sifr3c {
	visibility: hidden;
	display: inline;
	letter-spacing: -1px;
	font-size: 24px;
	margin: 2px;
	padding: 2px;	
	text-align: center;
	line-height: 103%;
}

/* rounded corners, courtesy of Ryan Thrash: http://www.modxcms.com/simple-rounded-corner-css-boxes.html*/

.r1 {
   background: transparent url(/images/rounded.png) no-repeat bottom right; 
} 

.r2 { 
   background: transparent url(/images/rounded2.png) no-repeat bottom right; 
}

.r_content div, .r_content h2, .r_content table { background: transparent; background-image: none; }

.r_box { 
   width: 780px !important;
   /* intended total box width - padding-right(next) */ 
   width: 770px; 
   /* IE Win = width - padding */ 
   padding-right: 10px; 
   /* the gap on the right edge of the image (not content padding) */ 
} 

/* set the top-right image */ 

.r_header_space {
   background-position: top right; 
   margin: 0 -10px 0 0; 
   /* pull the right image over on top of border */ 
   padding: 0 15px 0 0; 
   /* right-image-gap + right-inside padding */ 
} 

/* set the top-left image */ 
.r_header_space div { 
   background-position: top left; 
   margin: 0; 
   /* reset main site styles*/ 
   border: 0; 
   /* ditto */ 
   padding: 0 0 0 15px; 
   /* padding-left = image gap + interior padding ... no padding-right */ 
   height: auto !important; 
   height: 1%; /* IE Holly Hack */ } 
   
/* set the lower-left corner image */ 
.r_content { 
   background-position: bottom left; 
   margin-right: 0px; 
   /* interior-padding right */ 
   padding: 5px 0 5px 15px; 
   /* mirror .r_header_space right/left */ 
} 