@charset "utf-8";
/* CSS Document */

/* 
   Reset
------------------------------------------------------------------- */

html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, code, del, dfn, em, img, q, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, textarea, input, select {margin: 0; padding: 0; border: 0; font-weight: inherit; font-style: inherit; font-size: 100%; font-family: inherit; vertical-align: baseline;}
table {border-collapse: collapse; border-spacing: 0;}
caption, th, td {text-align: left; font-weight: normal;}
table, td, th {vertical-align: middle;}
blockquote:before, blockquote:after, q:before, q:after {content: "";}
blockquote, q {quotes: "" "";}
a img {border: none;}
:focus {outline: 0;}


/* 
   General 
------------------------------------------------------------------- */

html {
	height: 100%;
	padding-bottom: 1px; /* force scrollbars */
}

body {
	background-color: #fafafa;
	color: #666;
	font: normal 12px Helvetica, Arial, sans-serif;
	line-height: 18px;
}


/* 
   Typography 
------------------------------------------------------------------- */

/* Headings */

h1,h2,h3,h4,h5,h6 {
	color: #111;
	border-bottom:1px solid #e0e0e0;
	font-weight: bold;
	line-height: 1;
	margin-bottom: 6px;
	padding-bottom: 10px;
}

h1 {font-size: 14px;}
h2 {font-size: 13px;}
h3 {font-size: 12px;}
h4 {font-size: 12px;}
h5 {font-size: 12px;}
h6 {font-size: 12px;}

h1 img, h2 img, h3 img, h4 img, h5 img, h6 img {margin: 0;}


/* Text elements */

p {margin-bottom: 18px;}

a {
	color: #3b5998;
	text-decoration: none;
}
a:focus,a:hover {
	color: #111;
	text-decoration: underline;
}


abbr, acronym {border-bottom: 1px dotted #666;}
address {margin-bottom: 1.5em;}
blockquote {margin: 1.2em; line-height: 1.4em;}
blockquote span {font-size: 1.4em; color: #000;}
del {color:#666;}
em, dfn, blockquote, address {font-style: italic;}
strong, dfn {font-weight: bold;}
sup, sub {line-height: 0;}
cite {color: #666;}

pre {
	margin: 1.5em 0;
	white-space: pre;
}
pre,code,tt {
	font: 1em monospace;
	line-height: 1.5;
}


/* Lists */

li ul, li ol {margin-left: 1.5em;}
ul, ol {margin: 0 1.5em 1.5em 1.5em;}

ul {list-style-type: disc;}
ol {list-style-type: decimal;}

ul.reset, ol.reset {margin-left:0; list-style:none;}

dl {margin: 0 0 1.5em 0;}
dl dt {font-weight: bold;}
dd {margin-left: 1.5em;}


/* Tables */

table {margin-bottom: 1.4em; width: 100%;}
th {font-weight: bold;}
thead th {background: #C3D9FF;}
th,td,caption {padding: 4px 10px 4px 5px;}
tr.even td {background: #F2F6FA;}
tfoot {font-style: italic;}
caption {background: #EEE;}

/* Misc classes */

.small {font-size: 0.9em;}
.smaller {font-size: 0.8em;}
.smallest {font-size: 0.7em;}

.large {font-size: 1.1em;}
.larger {font-size: 1.2em;}
.largest {font-size: 1.3em;}

.hidden {display: none;}

.quiet {color: #666;}
.loud {color: #000;}
.highlight {background: #FF0;}

.text-left {text-align: left;}
.text-right {text-align: right;}
.text-center {text-align: center;}

.error, .notice, .success {
	border: 1px solid #DDD;
	margin-bottom: 1em;
	padding: 0.6em 0.8em;
}
.error {background: #FBE3E4; color: #8A1F11; border-color: #FBC2C4;}
.error a {color: #8A1F11;}

.notice {background: #FFF6BF; color: #514721; border-color: #FFD324;}
.notice a {color: #514721;}

.success {background: #E6EFC2; color: #264409; border-color: #C6D880;}
.success a {color: #264409;}

div.more {padding-top: 6px;}
.more a, a.more {color: #666;}
.more a:hover, a.more:hover {color: #002;}

/* 
   Forms 
------------------------------------------------------------------- */

label {font-weight: normal; cursor: pointer; line-height:23px;}
fieldset {padding: 1.4em; margin: 0 0 1.5em 0; border: 1px solid #DDD; background: #F6F6F6;}
legend {font-weight: bold; font-size: 1.2em;}
textarea {overflow: auto;}
input.autocomplete_widget, input.text, textarea, select {
	background: #fff url(../../images/bg-textfield.gif) left top repeat-x;
	border: 1px solid #ccc;
	margin: 0;
	margin-bottom:5px;
	padding:2px;
	width:200px;
}
input.short {width:150px;}
input.shorter {width:100px;}
select.shorter {width:100px;}
select.shortest {width:50px;}

input.text:focus, textarea:focus, select:focus {background: #fffff5; border-color:#999;}

input.button {
	background: #DDD;
	border: 1px outset #AAA;
	padding: 4px 5px;
}
input.button:active {border-style: inset;}

/* 
   Alignment 
------------------------------------------------------------------- */

/* General */

.center,.aligncenter {
	display: block;
	margin-left: auto;
	margin-right: auto;
}


/* Images */
a img, a:hover img, a img:hover {text-decoration:none;}

img.bordered {
	background-color: #FFF;
	border: 5px solid #ccc;
}
	a:hover img.bordered, a img.bordered:hover { 
		border: 5px solid #aaa;
	}
img.shadowed {
	-moz-box-shadow:0 1px 5px rgba(0,0,0,0.3);
	-webkit-box-shadow:0 1px 5px rgba(0,0,0,0.3);
}
	a:hover img.shadowed, a img.shadowed:hover { 
		-moz-box-shadow:0 1px 5px #f7941e;
		-webkit-box-shadow:0 1px 5px #f7941e;
	}
	
img.outlined {outline:hidden;}
	a:hover img.outlined, a img.outlined:hover {outline:5px solid #c0c0c8;}	

img.alignleft, img.left {margin: 0 20px 20px 0;}
img.alignright, img.right {margin: 0 0 20px 20px;}
img.aligncenter, img.center {margin: 0 0 20px 0;}

/* Floats */   

.left,.alignleft {float: left;}
.right,.alignright {float: right;}

.clear,.clearer {clear: both;}
.clearer {
	display: block;
	font-size: 0;
	line-height: 0;	
}


/* Columns */

.col2 {width: 47%; margin-right: 30px;}
.col3 {width:31%; margin-right:20px;}


/* 
   Misc overriding classes
------------------------------------------------------------------- */

/* Border */

.noborder {border: 0 !important;}
.notborder {border-top: 0;}
.norborder {border-right: 0;}
.nobborder {border-bottom: 0;}
.nolborder {border-left: 0;}

/* Margin */

.nomargin {margin: 0;}
.notmargin {margin-top: 0;}
.normargin {margin-right: 0;}
.nobmargin {margin-bottom: 0;}
.nolmargin {margin-left: 0;}

/* Padding */

.nopadding {padding: 0;}
.notpadding {padding-top: 0;}
.norpadding {padding-right: 0;}
.nobpadding {padding-bottom: 0;}
.nolpadding {padding-left: 0;}

/* Layout 
------------------------------------------------------------------- */
#wrapper {
	margin:0;
	padding:0;
	width:100%;
}
/* Header */
#header-wrapper {
	
}

#header { 
	background:url(../../images/shadow-270deg.gif) center bottom no-repeat;
	min-height:75px;
	margin:0 auto;
	padding-top:7px;
	width:940px;
}

#logo {
	float:left;
	height:62px;
	padding:0 0 0 60px;
	width:186px;
}
	#logo a {
		background:url(../../images/logo.png) left top no-repeat;
		display:block;
		height: 62px;
		text-indent:-10000px;
		width: 186px;
	}
#subheader {
	border:1px solid #e0e0e0;
	margin:13px 0 10px 300px;
	padding:4px;
	width:578px;
}
#searchbar {
	border:1px solid #ccc;
	width:236px;
}
#searchbar input.text {
	border:none; 
	border-right:1px solid #ccc;
	display:inline;
	width:210px;
	margin:0;
	vertical-align:middle;
}
#searchbar input.searchbtn {
	background: url(../../images/btn-search.gif) -4px center no-repeat;
	cursor:pointer;
	display:inline;
	height:17px;
	margin:0;
	padding:0;
	width:21px;
	vertical-align:middle;
}
#textlinksarea {
	float:right;
	font-weight:bold;
	line-height:20px;
	padding:0 5px;
	text-align:right;
}
#tabs {
	margin:0 0 0 300px;
}
#tabs ul {
	margin:0;
	padding:0;
	list-style:none;
}
#tabs li {
	float:left;
	list-style:none;
	margin:0;
	margin-right:3px;
	padding:0;
}
#tabs li a {
	background:#e3e3e3;
	border:1px solid #e3e3e3;
	border-bottom:none;
	color:#666;
	display:inline-block;
	font-size:14px;
	font-weight:bold;
	padding:5px 10px;
}
#tabs li a:hover {
	background:#666;
	border-color: #666;
	color:#fff;
	text-decoration:none;
}
#tabs li a:active, #tabs li.active a {
	background:#fff;
	border-color: #e0e0e0;
	color:#111;
}

/* spotlight/big image area */
#spotlight-wrapper {
	background:url(../../images/bg-spotlight.jpg) left top repeat-x;
	height: 460px;
}
#spotlight {
	background:url(../../images/spotlight.jpg) -65px top no-repeat;
	height:145px;
	margin:auto;
	padding:315px 0 0 0;
	width:820px;
	position: relative;
	z-index: inherit;
	zoom: 1; /* For IE6 */
}
#spotlight h1 {
	border:none;
	color:#4c7807; 
	font-size:60px;
	font-weight:bold;
	padding:0;
	margin-bottom:12px;
}
#spotlight p {font-size:14px; line-height:18px;}





			
/* content area */
#contentarea-wrapper {
	background:#fff;
	clear:both;
	padding:30px 0;
	min-height:450px;
}

#contentarea {
	margin:auto;
	padding:0;
	width:940px;
}

		#content {
			float:right;
			width:580px;
			margin-right:60px;
			position: relative;
			z-index: inherit;
			zoom: 1; /* For IE6 */
		}
			

		
		#sidebar {
			float:left;
			width:180px;
			margin-left:60px;
		}
			#sidebar-photo {margin-bottom:10px; text-align:center;}
			#sidebar-charms {
				border:1px solid #e0e0e0;
				margin-bottom:10px;
				padding: 8px 10px;
				text-align:center;
			}



/* footer */
#footer-wrapper {
	background: url(../../images/shadow-90deg.gif) center top no-repeat;
	clear:both;
	font-size:12px;
	line-height:18px;
	height:110px;
	padding-top:30px;
}

	#footer {
		margin:0 auto;
		width:940px;

	}
	#footer p {text-align:center;}
	#footer a {font-weight:bold;}
	#footer a.espidesigns {font-weight:normal;}


/* Special Classes and IDs 
------------------------------------------------------------------- */
.color-wotsi {color:#ed6005;}
.color-facebook {color:#3b5998;}
.color-good {color:#4c7807;}
.color-bad {color:#d41004;}
.color-warning {color:#f8da1f;}
.score {
	font-size:24px; 
	font-weight:bold;
}

/* icons */
.good-wotsi-16x16,
.low-wotsi-16x16,
.bad-wotsi-16x16 {
	background: left center no-repeat;
	display:inline-block;
	height:16px;
	width:16px;
	vertical-align:middle;
}
.good-wotsi-16x16 {background-image: url(../../images/wotsi-green-16x16.png);}
.low-wotsi-16x16 {background-image: url(../../images/wotsi-yellow-16x16.png);}
.bad-wotsi-16x16 {background-image: url(../../images/wotsi-red-16x16.png);}

.good-wotsi-32x32,
.low-wotsi-32x32,
.bad-wotsi-32x32 {
	background: left center no-repeat;
	display:inline-block;
	line-height:inherit;
	height:32px;
	width:32px;
	vertical-align:middle;
}
.good-wotsi-32x32 {background-image: url(../../images/wotsi-green-32x32.png);}
.low-wotsi-32x32 {background-image: url(../../images/wotsi-yellow-32x32.png);}
.bad-wotsi-32x32 {background-image: url(../../images/wotsi-red-32x32.png);}

/* tabled data*/
dl.table-data {clear:both;}
dl.table-data dt {
	font-weight:normal;
	float:left;
	width:37%;
	white-space:nowrap;
}
dl.table-data dd {
	color:#111;
	float:left;
	font-weight:bold;
	margin:0;
	width:60%;
}

/* tabled form */
dl.table-form {clear:both;}
dl.table-form dt {
	font-weight:normal;
	float:left;
	width:37%;
	white-space:nowrap;
}
dl.table-form dd {
	color:#111;
	float:left;
	font-weight:normal;
	margin:0;
	width:60%;
}

/* search results/list */
#lookupresult{padding:0 0 10px;}
#lookupresult ul {margin:0;}
.element-container {padding:0 0 10px;}

.result-name .compare { visibility:hidden; padding-left:5px; font-weight:bold;}
.result-morelinks {display:none;}
.result-name:hover .compare{ visibility:visible;}
.element-container:hover .result-morelinks {display:block;}

.result-name { display:block; float: left; padding-left:10px; width:313px; font-weight:bold;}
.result-location {display:block; float: left; width:181px;}
.result-score {display:block; float: left; width:120px; text-align:right; font-weight:bold;}
.result-highschool {display:block; clear:left; float: left; padding-left:26px; width:253px;}
.result-college {display:block; float: left; width:181px;}
.result-ranking {display:block; float: left; width:120px; text-align:right; font-weight:bold;}
.result-interests {display:block; clear:left; float: left; padding-left:26px; width:253px;}
.result-morelinks {float: left; width:301px; text-align:right;}
.result-morelinks a {color:#666;}

/* special classes */
.fullwidth {width:820px !important}
#myform {width:340px; margin:auto;}

.sortfield { 
	display:inline-block; 
	float:right; 
	text-align:right;
	width:200px; 
	margin-top:-5px;
}
.sortfield select { width:100px;}

.sortfieldform {
    float:right;
    margin-top:-5px;
}

/* button styles*/
.button, button {
	background-color:#f1a00f;
	background-image:url(../../images/btn-bg-orange.gif);
	background:-webkit-gradient(
    linear,
    left bottom,
    left top,
    color-stop(0, rgb(236,75,0)),
    color-stop(0.49, rgb(238,107,7)),
    color-stop(0.51, rgb(241,135,13)),
    color-stop(1, rgb(248,223,31))
);
	background:-moz-linear-gradient(
    center bottom,
    rgb(236,75,0) 0%,
    rgb(238,107,7) 49%,
    rgb(241,135,13) 51%,
    rgb(248,223,31) 100%
);
	border:2px solid #d54316;
	box-shadow: 0 5px 5px rgba(0,0,0,0.2);
	-webkit-box-shadow: 0 5px 5px rgba(0,0,0,0.2);
	-moz-box-shadow: 0 5px 5px rgba(0,0,0,0.2);
	border-radius: 10px;
	-khtml-border-radius: 10px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	color:#111;
	cursor:pointer;
	font-size:14px;
	font-weight:bold;
	text-shadow:0 1px 0 rgba(255,255,255,0.3);
	padding:5px 10px;
}
.button-blue {
	background-color:#4863a7;
	background-image:url(../../images/btn-bg-blue.gif);
	background:-webkit-gradient(
    linear,
    left bottom,
    left top,
    color-stop(0, rgb(59,86,156)),
    color-stop(0.49, rgb(73,100,169)),
    color-stop(0.51, rgb(77,110,177)),
    color-stop(1, rgb(160,187,249))
);
	background:-moz-linear-gradient(
    center bottom,
    rgb(59,86,156) 0%,
    rgb(73,100,169) 49%,
    rgb(77,110,177) 51%,
    rgb(160,187,249) 100%
);
	border:2px solid #374d90;
	box-shadow: 0 5px 5px rgba(0,0,0,0.2);
	-webkit-box-shadow: 0 5px 5px rgba(0,0,0,0.2);
	-moz-box-shadow: 0 5px 5px rgba(0,0,0,0.2);
	border-radius: 10px;
	-khtml-border-radius: 10px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	color:#fff;
	cursor:pointer;
	font-size:14px;
	font-weight:bold;
	text-shadow:0 1px 0 rgba(255,255,255,0.3);
	padding:5px 10px;
}
.button:hover, button:hover, 
.button-blue:hover, .button-blue:active,
.button:active, button:active {	
	-moz-box-shadow: 0 0 0 #000;
	-webkit-box-shadow: 0 0 0 #000;
	box-shadow: 0 0 0 #000;
	text-decoration:none;
}


/* compare wotsi */
#content-compare {float:left; margin:0 0 0 60px; width:345px;}


.compare-left {float: left; text-align:left; width:80px;}
.compare-item {float: left; text-align:center; width:180px;}
.compare-right {float: left; text-align:right; width:80px;}
.compare-left.sub {color:#ccc;}
.compare-item.sub {color:#666;}
.compare-right.sub {color:#ccc;}

#profiler-wrapper {
	border:1px solid #e0e0e0;
	border-bottom-color:#fff;
	border-left:0;
	border-right:0;
	margin:10px 0 20px;
}
	#profiler {
		background:#f5f5f5;
		border:1px solid #e0e0e0;
		border-top-color:#fff;
		padding:15px 15px 0;
	}
#profiler-pic {position:relative;}
#profiler-pic span {position:absolute; margin-left:235px; margin-top:-10px; }

#charms {
	margin-bottom:10px;
}

/* Single Line IE Fixes */
/* for Internet Explorer */
/*\*/
* html #contentarea-wrapper { height: 450px; }
* html #header { height: 75px; }
/**/

/* new clearfix */
.clearfix:after {
	visibility: hidden;
	display: block;
	font-size: 0;
	content: " ";
	clear: both;
	height: 0;
	}
* html .clearfix             { zoom: 1; } /* IE6 */
*:first-child+html .clearfix { zoom: 1; } /* IE7 */

/* added by coriolis */
/* django stuff */
ul.errorlist { color: red; }

#facebookprofile{padding:0 0 10px;}
#facebookprofile ul {margin:0;}
#facebookprofile h2 {
    border-top:1px solid #000;
    margin-top: 6px;
    padding-top: 10px;
    }
.fp-basic { display:block; float: left; width:120px; font-weight: bold;}
.fp-basic-sex {display:block; float: left; width: 120px;}
.fp-basic-val {display:block; float: left; width: 180px; color: #000;}
.fp-basic-name {display:block; clear:left; float: left; padding-left:120px; width: 120px;}
.sortfield2 { 
	display:inline-block; 
	float:right; 
	text-align:right;
	width:300px; 
}
.sortfield2 select { width:100px;}

.sortfieldform2 {
    float:right;
}

/* for list table */
ul.listTable li {
    height:30px;
    line-height:2.5em;
}

.orange {
    color:orange;
}

.number {
    font-weight:bold;
    font-size:24px;
}

.compareTable dd {
    margin:0px;
    width:115px;
    height:30px;
}

.compareTable text-right {
    text-align: right;
}

#id-chart {
    height: 120px;
}

.autocomplete {
    width: 250px;
}
.position {
    position:relative;
    z-index:0;
}
.hoverpointer:hover {
    cursor: pointer;
    text-decoration: none;
}
.scorecharms {
    background:url(../../images/score-charms.jpg) no-repeat scroll 0 0;   
}