/* =Reset - http://meyerweb.com/eric/thoughts/2007/05/01/reset-reloaded/

-------------------------------------------------------------- */

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,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0; 
	font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	font-family: inherit;
	vertical-align: baseline;
	direction:ltr;
	text-align:left;
}
/* remember to define focus styles! */
:focus {
	outline: 0;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: collapse;
	border-spacing: 0;
}
caption, th, td {
	text-align: left;
	font-weight: normal;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: "";
}
blockquote, q {
	quotes: "" "";
}


/* =element definitions 

-------------------------------------------------------------- */

th {white-space:nowrap}
	
	
	/* Headings
	-------------------------------------------------------------- */
	
	h1 { font-size: 2.2em; font-weight: bold; line-height: 1.2; margin-bottom: .5em; }
	h2,
	body.profile p.langsSpoken { font-size: 1.8em; line-height: 1.2; margin-bottom: .25em; }
	h3,h4,h5 { font-size: 1.2em; line-height: 1; margin: 0 0 .75em; font-weight: normal; }
	 
	 
	h1 img, h2 img, h3 img, 
	h4 img, h5 img, h6 img {
	  margin: 0;
	}
	
	
	/* Text elements
	-------------------------------------------------------------- */
	
	p           { margin: 0 0 .75em; max-width: 50em; }
	
	strong      { font-weight: bold; }
	em,dfn      { font-style: italic; }
	dfn         { font-weight: bold; }
	sup, sub    { line-height: 0; }
	
	abbr, 
	acronym     { border-bottom: 1px dotted #666; }
	address     { margin: 0 0 1.5em;  }
	
	pre,code    { margin: 1.5em 0; white-space: pre; } 
	
	
	/* Lists =ul
	-------------------------------------------------------------- */
	 
	#colWrap ul, #colWrap ol { margin: 0 1.5em 1.5em 20px; }
	#colWrap ul { list-style:none; }  
	#colWrap ul.copyBlock {margin-left:0; max-width: 50em/* see p above */; position:relative;}
	#colWrap ul.copyBlock li, #colWrap div li.bulleted {background: url(/i/icons/bullet_green.png) 0 0 no-repeat; list-style-position: outside; padding-left: 22px; position:relative; }
	#colWrap div.alerts ul.copyBlock {margin-bottom: 0;}
	#colWrap div.fyi ul.copyBlock li,
	#colWrap div.noResults ul.copyBlock li { background-image: url(/i/icons/bullet_orange.png) !important; }
	#colWrap div.alerts ul.copyBlock li{ background-image: url(/i/icons/bullet_go.png) !important;}
	#colWrap ul.errorList li { background-image: url(/i/icons/bullet_red.png) !important; }

	
	#colWrap ol          { list-style-type: none; list-style-position: outside; }
	#colWrap dl          { margin: 0 0 2em 0; }
	#colWrap dl dt       { font-weight: bold; }
	#colWrap dd          { margin-left: 1em;} 
	
	
	/* Tables
	-------------------------------------------------------------- */
	
	table       { width:100%; }
	th,td       { padding: .5em 1em .5em 0; }
	 
	
	
	/* Misc classes
	-------------------------------------------------------------- */
	 
	.hide       { display: none; }
	
/*	.first      { margin-left:0; padding-left:0; }
	.last       { margin-right:0; padding-right:0; }
	.top        { margin-top:0; padding-top:0; }
	.bottom     { margin-bottom:0; padding-bottom:0; }*/
	



/* =Layout

-------------------------------------------------------------- */
	
body { width:100%; }

#container { margin: 0 auto; padding-bottom:1.5em; position: relative; width: 950px; }

#colWrap { float:left; clear:both; min-height: 300px; text-align:left; width: 100%;
	border-style: solid; border-width: 1px; border-top: none; border-bottom-width: 2px;}

#colMain { float:left; min-height: 300px; padding: 1.25em 10px 4em; width: 540px;}

#colSub { float: left; min-height: 300px; margin-bottom: 1em; padding: 1.25em 10px 1em 10px; width: 210px; /*border-left-width: 1px; border-left-style: solid; border-bottom-width: 1px; border-bottom-style: solid;*/}

#colSub2 { float: left; min-height: 300px; margin-bottom: 1em; padding: 1.25em 0 0; width: 160px; /*border-bottom-width: 1px; border-bottom-style: solid;*/}

/* =Basic page - NO utility nav, no nav1 or 2, nor search. 
					Logic for turning those OFF is in Header.php */

/* =colMainOnly - if you want one big column with regular navigation & masthead */

body.basicPage #colMain,
body.colMainOnly #colMain { width: 930px; }

/* =noColSub - One skyscrapper on the right */

body.noColSub #colMain { width: 770px; }

/* =noColSub2 - Main and sub */

body.noColSub2 #colMain { width: 600px; }
body.noColSub2 #colSub { width: 310px; }


/* =Masthead 

-----------------------------------------------------------*/

#masthead { clear:both; display:block; float:left; position:relative; text-align:left; width:100%; }

/* Discrete "skip to content" link - Thank you Molly.com */

#access { cursor: text; display:block; overflow: hidden; font-weight: bold; text-indent: -600em; background: transparent; margin: 0 0 0 25px; padding: .5em; width: 11.5em; }
#access:focus, #access:active { text-indent: 1em; background: #f2f2f2; color: #111; }

/* =Logo */

#logo { float:left; clear:both; line-height: 0; z-index:1 }
#logo:hover { background: url(/i/house.png) no-repeat 365px 50px; }

/* =Utility Nav */

#navUtility a.register {background:none;padding-left:none;}
#navUtility {float:right; position:relative;top:-1em;}
#navUtility li { float:left; }
#navUtility li a { float:left; clear:none; padding: .5em .7em; }


/*=msg confirmations, warnings, errors*/

.msg, .alerts {border-width:1px;border-style:solid;padding:1em;}

div.error { background-image: url(/i/exclamation.png); background-repeat: no-repeat;background-position: 10px 1em; clear:both; padding-left: 35px !important;}
 
div.success {background-repeat: no-repeat ;background-position:10px 1em; clear:both; padding-left: 35px !important;}


/* =Icons */

.emailGo { background-image: url(/i/icons/email_go.png); background-position: 98% 50%; background-repeat:no-repeat; padding-right: 1.2em !important;}

.pgPrev { background: url(/i/icons/resultset_previous.png) no-repeat 0 50% !important; padding-left: 18px !important;} /* link or span*/
.pgNext { background: url(/i/icons/resultset_next.png) no-repeat 100% 50% !important; padding-right: 18px !important;}
.pgFirst { background: url(/i/icons/resultset_first.png) no-repeat 0 50% !important; padding-left: 21px !important;}
.pgLast { background: url(/i/icons/resultset_last.png) no-repeat 100% 50% !important; padding-right: 21px !important;}


/* =right side icons */
.newWindow,
.logout, 
.homeLink, 
.remove, 
.login { background-color:transparent; background-repeat: no-repeat ; background-position:100% 50%; padding-right: 20px !important;}

.logout {background-image: url(/i/icons/door_open.png)}
.remove, .removeVideo {background-image: url(/i/delete.png)}
.login {background-image: url(/i/door_in.png)}
.homeLink {background-image: url(/i/house.png);}

/* =left side icons */
.noPhoto strong,
body blockquote,
.translator,  
.addFavorite,
.online,
.ajaxSuccess,
.ajaxError,
.sendMessage,
.addFriend, 
.add,
.removeFriend, 
.removeVideo,
.offline,
.edit,
.register,
.updateSelection,
.refresh,
.accept { padding-left:20px !important; padding-bottom: 2px /* so the icon doesn't get it's bottom couple pixels cut if the line-height is short. */; background-position:0 0; background-repeat:no-repeat;}

/*some icons need position adjustment */
.sendMsg { font-size:1em !important; padding-left: 24px !important; background-repeat:no-repeat; background-position: 4px 50%; white-space:nowrap;}

#siteMessage { padding-left: 3em !important; background-repeat:no-repeat; background-position: 1.25em 50%;}

.chatNow, .chatNowG { font-size:1em !important; padding-bottom: 2px; padding-left: 20px !important; background-repeat:no-repeat; background-position: 2px 50%; white-space:nowrap;}

.noPhoto strong {background-image: url(/i/icons/photo.png);}
#siteMessage {background-image: url(/i/icons/comments.png)}
.sendMsg {background-image: url(/i/icons/email_go_green.png)} /*green border*/
.chatNowG {background-image: url(/i/icons/comment_green.png) !important} /*green border*/
.chatNow {background-image: url(/i/icons/comment.png)}
.addFavorite {background-image: url(/i/icons/heart_add.png)}
.translator, .newWindow {background-image: url(/i/icons/application_double.png); }
.ajaxError { background-image: url(/i/exclamation.png); }
.refresh { background-image: url(/i/icons/arrow_rotate_anticlockwise.png); }
.updateSelection { background-image: url(/i/icons/arrow_up.png); background-position: 3px 0; margin-left: 5px; }
.register { background-image: url(/i/icons/application_form_edit.png)}
body blockquote {background-image:url(/i/icons/user_comment.png);}
.online {background-image:url(/i/icons/status_online.png)}
.offline {background-image: url(/i/icons/status_offline.png)}
.sendMessage {background-image: url(/i/icons/email_go.png)} /*white border*/
.addFriend {background-image: url(/i/icons/user_add.png)}
.add {background-image: url(/i/icons/add.png)}
.removeFriend {background-image: url(/i/icons/user_delete.png); }
.edit {background-image: url(/i/icons/page_edit.png)}

div.success, .ajaxSuccess, .accept { background-image: url(/i/accept.png); }

.comments a.remove {display:inline;padding-right:0;position:static;right:0;background:none;}


/* =Search 

-------------------------------------------------------------- */

#siteSearch { float:right; clear:both; display: block; padding-bottom: .3em; position:relative; text-align: right; width:35%; z-index:200; }
#siteSearch input { margin:0;}


/* =Footer 

-------------------------------------------------------------- */

#footer { clear:both; margin: 1em 0 1em; text-align:left; width: 100%;}
#corporate {margin-bottom:1em}
#footer ul li {  display:inline;  }
#footer ul li a {  margin: 0 .25em}
#addThis {  float:right; margin:.5em; }
#copyright { margin-left:.25em; max-width:none; width:auto}


/* =Navigation

-------------------------------------------------------------- */
	
/* No blue line on top of basicPage */
body.noNav2 #colWrap { padding-top:0; border-top-width: 1px; border-top-style: solid; }

#colWrap { padding-top: 2.2em; /* This makes room for the nav2 */ margin-bottom:1em }

#nav {
	clear:both;
	position: relative;
	width: 950px;/* 
	width: 1000px; a width is required for Opera, older Mozilla browsers, and Konqueror browsers */
}

#nav1 {
	position: absolute;
	bottom: 0;
	left: 1px;
	width: 950px;
}

#nav1 li  {
	display: inline;
	float: left; 
	list-style: none;
	margin-right: 3px;
}

#nav1 li a, #nav1 li strong {
	display: block;
	padding: .5em 1.1em;
}

#nav1 li.active strong a { background:none; margin:0; padding:0; border:none }
 
#nav1 li a, #nav1 li strong {
	width: auto;
	display: block;
	float: left;
	position: relative;
	text-align: center;
}

#nav2 {
	border-bottom-style: solid;
	border-bottom-width: 1px;
	bottom: -2.1em;
	margin: 0;
	padding: 0;
	position: absolute;
	left: 0;
	right: 0;
	width: 950px;
}

#nav2 li a, #nav2 li strong {
	border: none;
	background: none;
	display: block;
	float: left;
	margin: 0;
	padding: .3em .7em .35em;
	width: auto;
}

div #nav2 li a, 
div #nav2 li strong,
div #nav2 li.active { background-image: none; }

#nav2 li:last-child a,
#nav2 li:last-child strong { border: none; }

/* =nav3 */

.inviteFriends .nav3 {
	border-top-style: solid;
	border-top-width: 1px;
	}

.nav3 {
	border-bottom-style: solid; 
	border-bottom-width: 1px; 
	float:left;
	margin:0 0 1em 0 !important;
	width:100%;
	list-style:none;
	}

.inviteFriends .nav3 li {
	margin: 1em 0 -1px 1em;
	}
	
.nav3 li {
	float:left;
	margin: 0 0 -1px .5em;
	list-style:none;
	}

.inviteFriends .nav3 a {padding:.5em 1em;}

.nav3 a {
	border-style: solid;
	border-width: 1px;
	border-bottom: none;
	float:left;
	display:block;
	margin-bottom:1px;
	padding:.25em .5em;
	}
	
.nav3 .current a:hover { cursor:default; }

/* =Components and =Classes

-------------------------------------------------------------- */
	
	/* =bottom margins - primary vertical white space stored here. */
	.primaryInfo,
	.profile .personalInfo, 
	.profile .secondaryInfo,
	.profile .secondaryInfo table,
	.profile .contactInfo, 
	.profileSubCol .personalInfo, 
	.profileSubCol .secondaryInfo,
	.profileSubCol .secondaryInfo table,
	.profileSubCol .contactInfo, 
	#colMain .contForm,
	#colSub .contForm, 
	div.ad468x60,
	.ad300x250,
	.profile #friendsdiv,
	div.commentContainer,
	.syndicationOptions,
	div.lessonBody,
	.levelGuide,
	.relatedItems,
	.alerts,
	.rookie {margin-bottom:2em}
	
	
	#show_comment_div li.buttons, 
	div.pagination, 
	.serp li.result,  
	#colWrap .comments li {margin-bottom:1.5em}
	
	#selfriends,
	.wufoo .buttons, 
	#colWrap .comments li ul.linkControls,
	.detail #selfriends,
	.levelGuide dd,
	.rateIt, div.sortControl, 
	div.paginatedTable, 
	.msg, 
	#record_div, #alert_div, 
	.serp .result p, body blockquote, 
	form .controlHeader  p, 
	#colSub form p,
	#myHome table.mailbox,
	li.info,
	.addToFavorites,
	#flash_player_msg,
	#friendslist,
	.inviteFriends .pagingLinks {margin-bottom:1em !important}
	
	/* =pagination*/ 
	.currentView {} /*i.e. 'display rows 1-10 of 140' */
	.pagingLinks {} /*container for links*/
	.pagingLinks a, .pagingLinks strong {padding:.2em .6em .3em; margin-right:.35em; border-width: 1px; border-style:solid; } /*a link*/
	.pagingLinks strong { border: none;}
	.pagingLabel {} /*markup is unused right now*/
	.pgPrev { border: none !important; } /*link or span*/
	.pgNext { border: none !important; }
	.pgFirst {}
	.pgLast {}
	.pagination {margin-top:1em;clear:both;}
	.pagination .more {float:right; background:none; padding:0; margin:-1.5em 0 0 2em; }
	.relatedItems .pagination .more {background:none!important;float:none;margin:1em 0 0 0;display:block;clear:both;}
	#colWrap div.relatedItems div.pagination {padding:0 0 1em 0;margin: 0; clear:both;}
	div.pagination strong {font-weight:bold} /*the active page number*/
	
	/* =controlHeader - the search form at the top of most SERP pages*/
	.controlHeader .add {float:right;margin:.5em 4em 0 0;}
	
	/* =SERP*/ 
	.serp .results .result ul.actions li {background:none;list-style:none;}
	#colWrap #colMain ul.results, #colWrap #colMain ul.actions {margin:0} 
	.serp #colWrap .results .result {clear:both; list-style:none;display:block; padding:1.5em 0 0 0; border-top-width:1px;border-top-style: dotted; min-height:13em;}
	.serp .result .lastOnline {display:block}
	.serp .results .snippet {float:right;width:160px;margin: 0 0 1em 1em; }
	body.videos #colWrap div ul.results li.result {min-height:16em;}
	.serp .results .snippet img {margin-bottom: 1em;display:block}
	
	.serp .results li.result .details blockquote, .msgDetail blockquote, .comments li blockquote { padding: 1em 1em 1em 3em !important; background-position:1em 1.2em;}
	
	.serp #colWrap .results .details {width:410px;min-height:100px; } 
	#colWrap .results .details h2 {line-height:1em;margin-top:0;}  
	
	/* Do we need this still? this is here because jason wrote a too generic rule around floated spans inside forms. Did not...*/
	.serp form li span {float:none}
	
	/*=visibility hack until we have display:none being used everywhere with ajax*/
	.visibilityHack {position:relative}
	.visibilityHack div {position:absolute;top:1.5em;left:0;width:220px}
	
	/*=action links*/ 
	#colWrap .results .actions li {margin-bottom:.25em;}

	/*=chat */
	.tkUBuserBar { width: 95% !important; margin-left: 2.5%; border-left: 1px solid #aaa; border-right: 1px solid #888; }

	/*=site wide message */
	#siteMessage { padding: 2em; border-bottom: 1px solid;}

	/*=comments*/ 
 	.comments ol { margin: 0 0 0 1.5em; }
	ul.thread {margin: 0}
	.comments li,
	ul.thread li {padding: 0} 
	.comments ol li,
	ul.thread li {position: relative} 
	.comments ol li li {position: static} 
	.comments ol li .snippet,
	ul.thread .snippet {position:absolute;right:0;top:0;width:120px;}
	.comments ol li .snippet a,
	ul.thread .snippet a {display:block;}
	.comments blockquote,
	ul.thread blockquote {min-height:61px;margin-right:130px;}
	#colWrap .comments ol li ul {padding-top:1em}
	
	/* =snippet - ul.snippets or .snippet used inside a .result*/ 
	#colWrap ul.snippets {margin-right:0;margin-left:0;}
	.snippet img, .snippets img {padding:8px;border-width:1px;border-style: solid; line-height:1.7em;}
	#colWrap .snippets li {clear:none; float:left; border:none; padding:90px 0 3em 0; list-style:none;padding-right:10px;width:135px; margin:0;  position:relative;}
	#colWrap div .thumb-medium li {padding-top:114px}
	
	.snippets li img {position:absolute;top:0;left:0;display:block}
	
	#myHome table.mailbox td .snippet img {position:static;float:left; margin-right: .5em;} 
	.snippets .langsSpoken, .snippets .langTag, .snippet .numberViews, #myHome .snippets li a, .snippets li label {display:block}
	
	/*=related items - on the right side of videos and lessons detail page, lists out the additional related videos and lessons*/
	.relatedItems { width: 97%; }
	.relatedItems .mediaTitle {height:4.5em;display:block; clear:both;}
	.relatedItems .results { clear:both;height:32em;margin-bottom: 1em; overflow:auto; position:relative; } 
	#colWrap .relatedItems .snippets li { padding-top:70px; padding-bottom:1em; width:110px; margin-right:10px;}
	
	/* =detail =video =lesson*/ 
	#flash_player_msg  { float:left;margin-right:10px;}
	div.lessonBody { }
	.lessonBody img.supportPic {float:left;margin: 0 1em 1em 0}
	.detail #colSub {padding-top:14px}
	.detail #colSub .snippet {float:right;width:100px;margin:0 1em 1em 1em;}
	.detail #colSub h2 {clear:both} 
	.detail .lessonActions {float:right;width:160px;margin: 0 0 1em 1em;padding:1em;}
	.detail .lessonActions  .snippet {float:right;margin:0 0 1em 1em}
	.detail .lessonActions p { }
	#colSub .edit {margin-right: 1em;}
	
	 /*=add this social bookmarks thing:*/
	.detail .snap_noshots {float:right;margin:10px 0 1em 1em;}
	.detail #addfav, .detail #sendemail {float:left;width:160px;}
	.detail #colSub .textarea, .detail #colSub .wufoo li {width:97% !important; padding-right:0; }
	#colWrap ul.tags li, #colWrap ul.linkControls li {background:none;padding:0;display:inline;margin:0 1em 0 0; position:relative; width: auto;}
	#colWrap ul.tags, #colWrap ul.linkControls {margin-left:0;margin-right:0; position:relative;}

	/*=share video - currently only on detail pages*/ 
	.shareVideo {position:relative}
	#sharevideo a.close {position:absolute;top:12px;right:1em;}
	#sharevideo {position:absolute;width:480px; border-width:3px;border-style: solid;padding:10px;top:0;margin-top:-11em;left:430px; z-index:100;}
	.lessonActions #sharevideo { margin-top:-10em;left:0;} 
	 
	/*=rate it */
	.rateIt {clear:left}
	.rateIt , .rateFluency { float:left;width:50%;margin-right:0} 
	#container div div.currentRating img {border:none;padding:0;margin: 0 2px 0 0;display:inline !important;}
	
	/*=myProfile*/
	#colSub .myProfile .snippet ul {list-style:none; position:relative; width:auto;float:left;}
	.myProfile .snippet a img {position:relative;} 
	.myProfile .snippet img {float:left;margin:0 1em 2em 0;list-style:none; position:relative; clear:left;}
	.myProfile h2 {clear:both}
	.myProfile li a {margin-right:1em}
	
	/*=Mem profile chat, message, friend links */
	#frmLabelOptions #send_smile { display: block; margin-top: 1em;}
	#frmLabelOptions a {margin-bottom: .5em; margin-right: 1em;}
	
	
	/*=mailbox */  

	table.mailbox td.sender * {display:block} 
	table.mailbox th a { } /* Sort arrows */
	table.mailbox tr td {padding-top:.5em;padding-bottom:.5em;border-top-width:1px;border-top-style: dotted ;border-bottom-width:1px;border-bottom-style: dotted ;}
	table.mailbox tr.delete td {border-top:none}
	table.mailbox td {vertical-align:top}
	table.mailbox td.subject { padding: 0 !important; }
	table.mailbox td a.aunreadmsg, 
	table.mailbox td a.areadmsg {display:block; min-height: 2em; padding: .5em 1em .5em 0; }
	.messages .actions { clear: both; display: block; margin-bottom: 1.5em !important; margin-top: 1em; position: relative; text-align: right; width: 100%; }
	.messages .actions p { display: inline; padding: .5em; left: 0; top: -.5em; position:absolute; }
	.messages .actions p select { margin-right: .5em;}
	.messages .actions a { margin: 0 0 0 .5em;}
	.msgDetail h1 {margin:.5em 0  }
	.msgDetail ul.linkControls {padding:.5em 0;border-bottom-width:1px;border-bottom-style: dotted; border-top-width:1px ;border-top-style:dotted;}
	.msgDetail .pagination .pgPrev {float:left; margin-right:1em}
	.msgDetail .pagination {text-align:right}
	
	.spam { position: absolute; top:0; right:130px; padding:.25em .5em; }
	.spamFried { position:absolute; top:0; right:130px; padding:.25em .5em; }
	
	/*=Create and reply to messages */
	
	.msgTrans {margin-right: 1em;} /* adds space to left of icon. */
	.contForm h1 {margin-top: 0;} /* removes the 1.25em of extra space. */
	.profileSubCol .primaryInfo table,
	.profileSubCol .personalInfo table, { width: 100% !important;}
	.profileSubCol table th { width: 30% !important; white-space: normal;}
	
	.messageTo .snippet {float:left; margin-right: 1em;}
	
	.noPhoto { border-top: 1px dotted #eee9b9; padding: 1em 10px 10px !important; background-color: #FFFACA}
	
	/*=ads =advertisements
	#colMain div.ad468x60 {clear:both;height:70px;padding-left:56px;padding-top:10px;width:544px}*/
	div.ad728x90 {width:728ppx; margin:1em 111px;padding:10px 0;}
	div.ad160x600 {border:none !important;}
	div.ad img {display:block}
	div.ad { border-bottom: 1px dotted #ddd; border-top: 1px dotted #ddd; }
	div.ad a:link, div.ad a:visited { color:#555 !important; }
	
	/*=openx */
	iframe.openx {/*border-bottom-style:dotted; border-bottom-width:1px; border-top-style:dotted; border-top-width:1px;*/}
	div.openx { /*border-bottom-style:dotted; border-bottom-width:1px; border-top-style:dotted; border-top-width:1px;*/ display: block; clear:both;}
	div.openx h2 {font-size: 1.5em; line-height: 1.2; padding: .5em 0 0; }
	div.openx h3 { font-size:1em; margin-top: 10px; margin-bottom: .25em !important; }
	div.openx h3 a {color:#0087e5 !important; }
	div.openx p { margin-bottom:0;}
	div.openx p a {display: block; color: #222 !important; text-decoration: none;}
	img.trackingPixel { margin:0 !important; border:none !important; }
	
	.url, .adType { color: #222; font-size: .9em; margin-bottom: 10px;}
	.url a { color: #666 !important; text-decoration: none; }

	.openx300x250 { height: 250px; overflow:hidden; }

	.openx468x60 {clear:both;height:70px;padding-left:56px;padding-top:10px;width:544px;font-size:.9em; }
	.openx468x60 .left { margin: 10px 2% 0; width: 46%; float:left; font-weight: normal; }
	.openx468x60 .right { margin: 10px 2% 0; width: 46%; float:right; font-weight: normal;}
	.openx468x60 .adType { margin-left: 2%; font-weight: bold; clear:both;}
	.openx468x60 .adType .right {margin-top: -1.5em; text-align:right;}
	
	.openx234x60 { padding: 5px 0;}
	
	/*=Tribal Fusion ads */
	.leaderBoardAd { text-align: center; padding: 10px 0; width: 100%;}
	
	/*=misc */
	html code {white-space:normal}
	.help h1 {margin: 1em 0}
	div p.loading {padding-left: 26px; padding-top:1em;padding-bottom:1em; background:url(/images/loading.gif) 0 1em no-repeat;margin:4em auto;width: 200px;}
	#colSub p.loading, .myPicture p.loading { padding-bottom:0;margin:2em auto;width: 120px;}
	.serp li li p.loading { padding-top:0;background-position:0 0 ;padding-bottom:0;margin:0;width:120px;}
	.levelGuide a {display:block}
	
	/*=forms (specific ones and general classes)*/
	
	/*=form classes and general rules */
	.forgotPassword, .fieldError {display:block}
	#colSub form legend {margin-bottom:.5em}
		
	/*=IDs of specific forms, beginning with f- */
		 
		
/* =Pages

-------------------------------------------------------------- */	
	
	/* =myHome

	-----------------------------------------------------------*/
	
	#myHome #colMain h2 { clear:both; }
	
	#myHome .rookie { position: relative; }
	
	#myHome #colMain .alerts h2 { border: none;}
	
	#myHome #colMain .more { float:left; margin:-3.6em 0 0 290px; width: 290px;  }
	#myHome #colMain .more a { padding-right: .75em}
	
	#myHome .lessMargins h2 { margin-bottom: .5em !important; }
	#myHome .lessMargins .more { margin-top: -2.7em !important; }

	#myHome .snippets li a.name { display:inline;}
	
	/* =homePage

	-----------------------------------------------------------*/	
	
	#homePage #colMain { width: 530px; }
	#homePage #colSub { width: 380px; }
	
	/*#homePage h1 { border: 1px solid #666; background: url(/i/home-h1-jump.jpg) no-repeat 0 0; height: 287px; text-indent:-9999px; margin-left: -10px; margin-top: -.48em; margin-right: -10px;}*/
	
	/* Bigger call out to sign up for homePage */
	#homePage h2 a.register { background-position: 0 50% !important; }
	
	/* Popular members on home page AKA "Members online now" */
	
	.popularMembers ul { float:left; clear: both; list-style:none !important; margin:0 0 2em 0 !important; }
	.popularMembers li { display: block; clear:both; margin: 0 !important; position:relative; width:100%; }
	.popularMembers li a { border-bottom-width: 1px; border-bottom-style:dotted; display: block; float: left; clear:both; height: 5.5em; margin: 0; padding: .5em 0; width: 100%; }
	.popularMembers img { border: 1px solid #999; float: left; clear:both; height: 65px; margin: 0 1em .25em .25em; vertical-align:top; width: 65px; }
	
	/* =Friends

	-----------------------------------------------------------*/
	
	.searchBar { border: 1px solid #f2f2f2; background-color: #f8f8f8; padding-top: 5px; margin-bottom: .5em; position:relative; clear:both; width: 100%;}
	#searchBasic { margin: 0 !important; height:4em; position:relative; width: 100% !important; }
	#searchBasic li { display:block; height:4em; }
	#searchBasic li.topLabel { width: 190px; padding-left: 10px;}
	#searchBasic li.button { width: 90px; padding-left: 10px;}
	#searchBasic li.topLabel,
	#searchBasic li.button, 
	.moreOptions {float:left; position:relative; display:block;}
	#searchBasic li.topLabel label {display: block;}
	#searchBasic li.button input { margin:1em 0;}
	
	.moreOptions { height:2.6em !important; display:inline; padding: 1.4em 0 0; position:relative; width: 90px;}
	#moreSearch, #lessSearch { padding: 1em 0;}
	#moreSearchIE, #lessSearchIE { padding: 1em 0;}
	
	#searchAdvanced { padding: 0 10px 10px; clear:both; position:relative; }
	#searchAdvanced .keyword { margin: 0 1em;}
	#searchAdvanced .row { display: block; clear:both; margin: 0 0 1em; height: 3em;}
	#searchAdvanced .row div { float: left; display: inline; width: 190px; margin-right: 10px;}
	#searchAdvanced .row .city {width: 160px;}
	#searchAdvanced .row div span { display: block; }
	#searchBasic .topLabel .select,
	#searchAdvanced .row div span select { width: 165px;}
	
	.friends .sortControl { clear:both; }
	.friends .sortControl label {margin-right: 12px;}
	
	/* =Lessons

	-----------------------------------------------------------*/
	
	span.columns { padding-bottom:0 !important; width: 30% !important; }
	
	/* =Videos

	-----------------------------------------------------------*/
	
	/* =profile

	-----------------------------------------------------------*/
	
	.profile .primaryInfo {clear:both;position:relative;} 
	.profileSubCol .primaryInfo {clear:both;position:relative;} 
	.profile .primaryInfo table { width: 365px;} 
	.profile .primaryInfo div.snippet {float: right; clear:both; width: 220px;}
	.profile .primaryInfo div.snippet img {float: left; clear:both;}
	.profile .primaryInfo div.snippet a.more {float: left; clear:both;}

	div .online, div .offline {display:block; }
	span.online .chatNow { margin-left: .5em;}
	
	.profile table img {margin-right:4px }
	.profile table .online, .profile table .offline  {margin-bottom:.5em}
	.profile table #send_smile img  {position:relative;top:-2px}
	.profile h2 {clear:both}
	.profileSubCol h2 {clear:both}
	.profile #colMain .edit {float:right;margin-top:-2.25em}
	.profile p.langsSpoken { margin-top:0 }
	.profileSubCol p.langsSpoken span, 
	.profileSubCol span.langLearning,	
	.profile p.langsSpoken span, 
	.profile span.langLearning {float:left;margin:0 .6em .25em 0; }
	.profileSubCol div span.langLearning,
	.profile div span.langLearning {margin-right:1em;margin-top:-.8em; margin-bottom:1em;}
	.profileSubCol span.fluency,
	.profile span.fluency {display:block;line-height:6px}
	.profileSubCol .langLearning span.fluency,
	.profile .langLearning span.fluency {margin-left:-5px !important;} /* Yea, I'm being picky. JTR */
	.profileSubCol span.fluency,
	.profile span.fluency {margin-left:-3px !important;}
	.profile td {width:100%}
	.profileSubCol tr th, .profileSubCol tr td,
	.profile tr th, .profile tr td {border-top-width:1px;border-top-style: dotted; border-bottom-width:1px;border-bottom-style: dotted; }  
	
	.profile .countryClear { display: block; }
	.profile .countryClear span { clear: both; width: 100%; padding-left: 32%; } /* Adjust this if you change form widths or use noI on contForm */
	
	.myPicture .snippets a.removeSubtle {margin-left:1.6em;display:block;margin-top:.4em}
	
	/* =selfriends is the container for the entire dialog. #selectFriends is the actual div surrounding the checkbox list - selecting friends is used on share video and COmpose. the importants are in here due to the WUFOO selectors being important.  */
	 
	#selfriends #selectFriends ul li, #selfriends #selectFriends ul li label { float:left;  } 
	#selfriends #selectFriends ul li { width:9.2em !important;clear:none !important } 
	#selfriends #selectFriends ul li label { white-space:nowrap;cursor: pointer;  }
	#selfriends #selectFriends {min-height:4em;max-height:12em;overflow:auto;}
	   
	
	#sharevideo #selectFriends {position:relative;   }
	#sharevideo #selectFriends .close {top:1em}
	#sharevideo #selectFriends a.btn {display:block;width:10em;}
	#friend_data_div { padding: 0 0 1em; }
	/* =accounts =login =signup  =prospect

	-----------------------------------------------------------*/
	
	body#login #colMain { width: 410px; }
	body#login #colSub { width: 500px; }


	/* =Invite Friends
	
	-----------------------------------------------------------*/
	
	/* =inviteFriends forms */
	
	.socialNetworkView2 .contForm,
	.socialNetworkView2Errors .contForm { float: left; width: 49%; }
	
	p.checkUncheck { border-top: 1px solid; border-bottom: 1px solid; padding: .5em; width: 90%; }
	p.checkUncheck label { cursor:pointer; }
	
	/* List of friends on the left side of Email and Social contacts */
	.inviteFriends div .friends li { border-style:solid; border-top-width:1px; margin-left: 0 !important; overflow: hidden; padding-left: .5em; padding-right: 8px; width: 90%; }
	.inviteFriends div .friends li label { float: left; cursor:pointer; clear: none; display: block; padding: .5em 1em .5em 0; width: 100%; }
	.inviteFriends div .friends li input { float: left; clear: none; display: block; margin-right: .5em; }
	.inviteFriends div .friends li img { position: absolute; right:10px; top: 5px; vertical-align: middle; border: 1px solid;}
	
	/* Send to section of Invite friends */
	#sendTo { display: block; width: 100%; }
	#sendTo li { display: inline; margin-right: 1em; margin-left: 0 !important; padding:0; }  
	#sendTo li a { display: inline; }
	
	
	/* =privacyPolicy

	-----------------------------------------------------------*/	
	

	
	
	
	
	
	
/* =Wufoo

Title : Wufoo Form Structure
Author : Infinity Box Inc.
URL : http://wufoo.com

Last Updated : September 30, 2007

------------------------------------------------------ */


.wufoo ul li{
width:62%;
}
form.wufoo ul{
margin:0 !important;
padding:0;
list-style-type:none;
width:100%;
font-size:100%;
}
form.wufoo ul li{
margin:0 0 0 -10px;
padding:.5em 12px 0 10px;
position:relative;
clear:both;
}
form.wufoo ul li:after, .buttons:after{
content:"."; 
display:block;
height:0; 
clear:both; 
visibility:hidden;
}

form.wufoo ul li, .buttons{display: inline-block;}
* html form ul li, * html .buttons{height: 1%;}
form.wufoo ul li, .buttons{display: block;}

* html form.wufoo ul li div{
display:inline-block;
}
form.wufoo ul li div, form.wufoo ul li span{
margin:0;
padding:0 0 .5em 0;
}
form.wufoo ul li span{
float:left;
}

form.wufoo ul li div.address{
padding-bottom:0;
}

form.wufoo ul li div.left{
display:inline;
float:left;
width:47%;
}
form.wufoo ul li div.right{
display:inline;
float:right;
width:47%;
}

.clear{
clear:both !important;
}

/* ----- INFO ----- */

.info{
display:inline-block; 
clear:both;
border-bottom-width:1px;
border-bottom-style:dotted;
margin:0 0 1em 0;
}
.info[class]{
display:block;
}
.info h2{
font-weight:normal;
font-size:160%;
margin-bottom: 0;
clear:left;
}
.info p{
font-size:95%;
line-height:135%;
margin:0 0 .25em 0;
}

/* ----- SECTIONS ----- */

form.wufoo hr{
display:none;
}
form.wufoo li.section{
border-top:1px dotted #ccc;
margin-top:2em;
padding-top:.5em;
padding-bottom:0;
width:95% !important;
}
form.wufoo ul li.first{
border-top:none !important;
margin-top:0 !important;
padding-top:0 !important;
}

/* ----- FIELDS AND LABELS ----- */

.readonly{ /* create_msg.php - for the select friends input. A text cursor is inappriopriate. */
cursor: default;
}
label.desc{
padding: 0;
border:none;
display:block;
font-size:100%;
}
form.wufoo li div label, form.wufoo li span label{
margin:0;
padding-top:.1em;
clear:both;
display:block;
}
div input.text, div input.file, div textarea.textarea, div select.select,
span input.text, span input.file, span textarea.textarea, span select.select {
margin-top:0;
}
input.text, textarea.textarea, select.select, input.file {
border-top:1px solid #7c7c7c;
border-left:1px solid #c3c3c3;
border-right:1px solid #c3c3c3;
border-bottom:1px solid #ddd;
background:#fff url(/i/fieldbg.gif) repeat-x top;
}
input.text, input.file, textarea.textarea, input.file{
padding:2px;
}
label.choice{
font-size:100%;
display:block;
line-height:1.5em;
margin:-1.5em 0 0 25px !important;
padding:.5em 1em 0 0;
width:auto;
}
input.checkbox, input.radio{
display:inline;
line-height:1.5em;
margin:.5em 0 0 5px;
width:1.2em;
height:1.2em;
}
select.select{
margin:1px 0;
padding:1px 0 0 0;
}
select.select[class]{
margin:0;
padding:1px 0 1px 0;
}
*:first-child+html select.select[class]{
margin:1px 0;
}
.safari select.select{
margin-bottom:1px;
font-size:100% !important;
}
span.symbol{
font-size:115%;
line-height:130%;
}
form.wufoo ul li .datepicker{
float:left;
margin:.1em 5px 0 0;
padding:0;
width: 16px;
height: 16px;
cursor:pointer !important;
}

/* ----- BUTTONS ----- */

.btn,
.btn2,
.btn3,
.btTxt, 
a.btn {
border: 2px outset #ccc;
cursor: pointer;
padding:.3em;
position:relative;
width:auto;
overflow:visible;
}
a.btn {text-decoration:none; }

a.btn,
.btn,
.btn2,
.btn3,
.btTxt {
margin-right: 1em;
}
.btn3 {
background: transparent;
border: none;
cursor: pointer;
color:#0087E5;
}
a.btn4,.btn4 {
background: transparent;
border: none;
cursor: pointer;
color: #666 !important;
}
.buttons{
clear:right;
margin-top: .5em !important;
padding-right:0 !important;
padding-bottom: 1em !important;
position:relative;
text-align:left;
}
.buttons input, a.btn {
font-size:120%;
}
.buttons a {
padding-left: 1em;
}

/* ----- TEXT DIRECTION ----- */

.rtl .info h2, .rtl .info p, .rtl label.desc, .rtl label.choice, 
.rtl div label, .rtl span label, .rtl input.text, 
.rtl textarea.textarea, .rtl select.select, .rtl p.instruct, 
.rtl .section h3, .rtl .section p, .rtl input.btTxt{
direction:rtl;
}

/* ----- SIZES ----- */

.third{
width:32% !important;
}
.twoFifths{
width:39% !important;
}
.half{
width:48% !important;
}
.threeFifths{
width:59% !important;
}
.twoThirds{
width:65% !important;
}
.full{
width:100% !important;
}

input.small, select.small{
width:25%;
}
input.medium, select.medium{
width:50%;
}
input.large, select.large, textarea.textarea{
width:97%;
}

textarea.reply{
width: 97% !important;
}

textarea.small{
height:5.5em;
}
textarea.medium{
height:10.5em;
}
textarea.large{
height:20.5em;
}

/* ----- ERRORS ----- */

#errorLi{
background-image:none !important;
width:99%;
margin:0 0 1em -1em !important;
padding: .5em 0 !important;
text-align:center;
}
#errorMsgLbl{
margin:7px 0 5px 0;
padding:0;
font-size:125%;
color:#DF0000;
}
#errorMsg{
margin:0 0 .8em 0;
color:#000;
font-size:100%;
}
#errorMsg strong{
background-color: #FFDFDF;
padding:2px 3px;
}
form.wufoo ul li.error{
display:block !important;
background-color: #FFDFDF !important;
margin:3px 0;
}
form.wufoo ul li.error label{
color:#DF0000 !important;
}
form.wufoo div.error {
background-color: inherit;
}
form.wufoo p.error,
form.wufoo div.error {
display:none; /* =error change to display:none if we ever get this working -JTR 2008-6-8 */
font-weight:bold;
font-size:100%;
margin:-2px 0 5px 0;
padding-bottom:0;
clear:both;
}
form.wufoo ul li.error p.error,
form.wufoo ul li.error div.error{
display:block;
}
.leftLabel p.error, .rightLabel p.error,
.leftLabel div.error, .rightLabel div.error,
.myLanguages #div_lang_speak_data,
.myLanguages #div_lang_learn_data {
margin-left:30%;
padding-left:15px;
}
.leftLabel .noI p.error, .rightLabel .noI p.error,
.leftLabel .noI div.error, .rightLabel .noI div.error,
.noI #div_lang_speak_data,
.noI #div_lang_learn_data {
margin-left:35%;
padding-left:15px;
}

/* ----- REQUIRED ----- */

form.wufoo .req{
float:none;
color:red !important;
font-weight:bold;
margin:0;
}

/* ----- INSTRUCTIONS ----- */

form.wufoo ul li.focused {
background-color:#fffaca;
}
form.wufoo .instruct{
position:absolute;
top:0;
left:100%;
z-index:1000;
width:42%;
margin:0 0 0 8px;
padding:8px 10px 9px 10px;
border:1px solid #e6e6e6;
background:#f5f5f5;
line-height:130%;
font-size:100%;
color:#444;
visibility:hidden;
}
form.wufoo .instruct small{
font-size:100%;
}
form.wufoo ul li.focused .instruct, form.wufoo ul li:hover .instruct{
visibility:visible;
}

/* ----- ALT INSTRUCTIONS ----- */

li.altInstruct .instruct, li.leftHalf .instruct, li.rightHalf .instruct{
visibility:visible;
position:static;
margin:-2px 0 0 0;
padding:0 0 7px 0;
background:none;
border:none;
width:100%;
font-size:9px;
clear:left;
}

/* ----- LABEL LAYOUT ----- */

.leftLabel li, .rightLabel li, li.leftLabel, li.rightLabel{
width:74% !important;
}

.leftLabel .small, .rightLabel .small{
width:17%;
}
.leftLabel .medium, .rightLabel .medium{
width:35%;
}
.leftLabel .large, .leftLabel textarea.textarea,
.rightLabel .large, .rightLabel textarea.textarea,
.leftLabel .address, .rightLabel .address{
width:64%;
}

* html .leftLabel .small, * html .rightLabel .small{
width:23%;
}
* html .leftLabel .medium, * html .rightLabel .medium{
width:55%;
}
* html .leftLabel .large, * html .leftLabel textarea.textarea,
* html .rightLabel .large, * html .rightLabel textarea.textarea{
width:95%;
}

.leftLabel label.desc, .rightLabel label.desc{
float:left;
width:30%;
margin:0 15px 0 0;
}
.rightLabel label.desc{
text-align:right;
}
.leftLabel .address, .rightLabel .address{
float:left;
}

.leftLabel p.instruct, .rightLabel p.instruct{
width:27%;
margin-left:5px;
}
.leftLabel .altInstruct .instruct, .rightLabel .altInstruct .instruct{
margin-left:30% !important;
padding-left:15px;
width:65%;
}
.leftLabel .buttons, .rightLabel .buttons{
margin-left: 22.5%;
text-align:left;
}

/* ----- NO INSTRUCTIONS ----- */

.noI .instruct{
display:none !important;
}
form.wufoo .noI ul li, form.wufoo .noI ul li.buttons{
width:95% !important;
}

/* ----- NO INSTRUCTIONS LABEL LAYOUT ----- */

.leftLabel .noI .large, .leftLabel .noI textarea.textarea,
.rightLabel .noI .large, .rightLabel .noI textarea.textarea,
.leftLabel .noI .address, .rightLabel .noI .address{
width:60%;
}

* html .leftLabel .noI .small, * html .rightLabel .noI .small{
width:23%;
}
* html .leftLabel .noI .medium, * html .rightLabel .noI .medium{
width:55%;
}
* html .leftLabel .noI .large, * html .leftLabel .noI textarea.textarea,
* html .rightLabel .noI .large, * html .rightLabel .noI textarea.textarea{
width:95%;
}

.leftLabel .noI label.desc, .rightLabel .noI label.desc{
width:35%;
}
.leftLabel .noI .buttons, .rightLabel .noI .buttons{
margin-left:35%;
}

/* ----- FIELD FLOATING ----- */

form.wufoo ul li.leftHalf, form.wufoo ul li.rightHalf{
width:46% !important;
}
li.leftHalf{
clear:left;
float:left;
}
li.rightHalf{
clear:none;
float:right;
}
li.leftHalf .medium, li.rightHalf .medium,
li.leftHalf .small, li.rightHalf .small{
width:100%;
}