/**********************
 AnimaNations website by Wolfgang Metzner - http://www.wolfgangmetzner.com
 COLORS: general text:#000; headings:#333; important:#7fa6ce; link background:#ccdbeb; vcard:#928e7f; divider:#dbd9d4; footer-link:#b7b4aa; 
 **********************/

/**********************
 GLOBAL ELEMENTS 
 **********************/
* {font-size:100%; margin:0; padding:0;}
html, body {height:100%;}
body {background:#fff url('../images/graphics/background.jpg') repeat-x 0 0; color:#000; font:75%/1.4 Verdana, Helvetica, Arial, sans-serif; text-align:center;}
a {color:#000; text-decoration:underline;}
a:hover, a:active {color:#666; text-decoration:none;}
abbr, acronym {border-bottom: 1px dashed #666; cursor:help;}
h1,h2,h3,h4,h5,h6 {color:#333; margin:0 0 0.25em 0; padding:0;}
h1, h2, h3, h4 {font-family:'Trebuchet MS', 'Trebuchet', Verdana, Arial, Helvetica, sans-serif; font-weight:normal;}
h2 {font-size:200%;}
h3 {font-size:165%;}
h4 {font-size:130%;}
h5 {font-size:115%;}
h6 {font-size:100%;}
img {border:none;}
fieldset {border:none; margin:0; padding:0;}
fieldset *, form * {vertical-align:middle;}
option {padding-right:0.75em;}
p, ul, ol {margin:0 0 1.25em 0;}
table {border:0; border-collapse:collapse;}
textarea {font-family:Verdana, Helvetica, Arial, sans-serif;}

/**********************
 GLOBAL STYLES 
 **********************/

.action {background:transparent url('../images/icons/icon-matrix-white.png') no-repeat 0 -143px; padding-left:20px;}
.action:hover, .action:active {background-position:0 -167px;}
.clear {clear:both;} 
.external {background:transparent url('../images/icons/external-link.gif') no-repeat 100% 2px; padding-right:12px;}
.floatLeft {float:left;}
.floatRight {float:right;}
.friend {background:transparent url('../images/icons/icon-matrix-white.png') no-repeat 0 -95px; padding-left:20px;}
.friend:hover, .friend:active {background-position:0 -119px;}
.hidden {left:-9000px; position:absolute;}
.imageLeft {float:left; margin:0 1em 1em 0;}
.imageRight {float:right; margin:0 0 1em 1em;}
.important {color:#7fa6ce;}
.join {background:transparent url('../images/icons/icon-matrix-white.png') no-repeat 0 2px; padding-left:20px;}
.join:hover, .join:active {background-position:0 -22px;}
.small {font-size:90%;}
.vote {background:transparent url('../images/icons/icon-matrix-white.png') no-repeat 0 -48px; padding-left:20px;}
.vote:hover, .vote:active {background-position:0 -72px;}


/**********************
 CONTENT
 **********************/
 
.addFriend {background:transparent url('../images/icons/add.gif') no-repeat 0 50%; display:none; margin:0 0 15px 150px; padding-left:18px;}

#additionalContent {float:right; overflow:auto; width:255px;}
#additionalContent h2 {font-size:165%}
#additionalContent h3 {font-size:130%}
#additionalContent h4 {font-size:115%}
#additionalContent p {margin-bottom:0.5em;}

#contentWrapper,
#contentWrapperHome {overflow:auto; padding:0 15px 15px 15px; width:860px;}

#contentWrapperHome {margin-top:-10px; padding-top:0;}

#mainContent {float:left; overflow:hidden; width:575px;}

.section {background:transparent url('../images/graphics/divider-large.png') no-repeat 100% 0;  margin-top:1.5em; overflow:auto; padding-top:1em; width:575px;}
.sectionFirst {overflow:hidden; width:575px;}
.section.hreview {overflow:hidden;}

#additionalContent .section,
#additionalContent .sectionFirst {width:250px; overflow:auto;}

#wrapper {background:#fff; border-left:1px solid #ededed; border-right:1px solid #ededed; margin:0 auto; overflow:auto; padding-bottom:0.5em; text-align:left; width:890px;}

.col50 {width:280px;}

.dividerTop {background:transparent url('../images/graphics/divider-large.png') no-repeat 100% 0; margin-top:1.5em; padding-top:1em; overflow:auto;}
.dividerBottom {background:transparent url('../images/graphics/divider-large.png') no-repeat 100% 100%; margin-bottom:1.5em; padding-bottom:1em; overflow:auto;}

/* HomePage List */
#featuredSections {list-style-type:none; overflow:auto; width:860px;}
#featuredSections li {float:left; width:250px;}
#featuredSections li.middle {margin:0 7px;}



/* Character Profile */
#profile dl {font-weight:bold; overflow:auto;}
#profile dt {float:left; width:110px;}
#profile dd {clear:right; float:right; width:115px;}
#profile p,
.callToAction {overflow:auto;}
.callToAction a {display:inline; margin-right:10px;}


/*Pagination*/
ul#pagination {color:#7fa6ce; font-size:90%; margin:0; overflow:auto; padding:0;}
ul#pagination li {float:left; list-style-type:none; padding-right:0; margin:0; width:20px;}
ul#pagination li.inactive {color:#928e7f}
ul#pagination li.first {margin:0 120px 0 0; width:auto;}
ul#pagination li.last {float:right; margin:0 1px 0 20px; padding-right:0; width:auto;}
ul#pagination a {padding:2px;}
ul#pagination li.first a,
ul#pagination li.last a {background:none; padding:0;}

.ratingVotes {margin-left:10px;}

.score {display:none !important;}

.socialBookmarks {list-style-type:none; overflow:auto; width:250px;}
.socialBookmarks li {float:left; margin-right:7px; width:24px;}
.socialBookmarks li.last {margin-right:0;}

.socialBookmarks a {background:transparent url('../images/icons/social-matrix.jpg') no-repeat 0 0; display:block; height:25px; text-indent:-9000px; width:24px;}
.socialBookmarks a.delicious {background-position:0 0;}
.socialBookmarks a.digg {background-position:-32px 0;}
.socialBookmarks a.reddit {background-position:-65px 0;}
.socialBookmarks a.stumbleUpon {background-position:-98px 0;}
.socialBookmarks a.magnolia {background-position:-130px 0;}
.socialBookmarks a.facebook {background-position:-163px 0;}
.socialBookmarks a.bebo {background-position:-195px 0;}
.socialBookmarks a.myspace {background-position:-227px 0;}

.subNote {font-size:80%;}

.thumbList {list-style-type:none; overflow:auto;}
.thumbList li {float:left; margin:0 81px 1em 0; overflow:hidden; width:232px;}
.thumbList li.last {margin-right:0;}

/* Sitemap */
ul#siteMap li {list-style-type:none; margin-bottom:0.4em;}
ul#siteMap li ul {margin-top:0.5em;}


/**********************
 FOOTER 
 **********************/
 
#footer {background:transparent url('../images/graphics/divider-large.png') no-repeat 0 0; font-size:80%; list-style-type:none; margin-top:1em; padding:1.5em 15px 1em 15px; width:800px;}
#footer li {background:transparent url('../images/graphics/footer-divider.png') no-repeat 0 60%; float:left; padding: 0 7px;}
#footer li.first {background:none; margin-left:0; padding-left:0;}
#footer a {background:none; color:#666; text-decoration:none;}
#footer a:hover, #footer a:active {color:#000; text-decoration:underline;}

/**********************
 FORMS 
 **********************/
 
#animationSelect label {font-family:'Trebuchet MS', 'Trebuchet', Verdana, Arial, Helvetica, sans-serif; font-size:150%;}
#animationSelect select {width:200px;}
 
/* contact us */ 
.form {width:400px;}
.form p {overflow:hidden; margin-bottom:0.5em;}
.form input,
.form textarea {
	border:1px solid #999;
	float:left; 
	height:15px;
	padding:2px;
	width: 180px;
}
.form label input {border:none; height:auto; padding:0; width:auto;}
.form textarea {height:100px; margin:0.5em 0 0; width:180px;}	
.form label {float:left; /*padding-top:1px;*/ width:150px;}
.form #optInHolder label {float:none; width:350px;}
.form input.button {border:none; float:right; height:auto; margin:1em 10px 0.5em 0; width:auto;}
.form select.dropDownMenu {
	float:right; 
	min-height:19px;
	padding:2px 1px 1px 3px; 
	width:156px;}
.form select.dropDownMenu * {float:none;}

.error {color:#cf142b;}
.error input,
.error select,
.error textarea {border-color:#cf142b;}
#content ul.error {list-style-type:none; margin:0 0 1em 0; padding:0;}

/* site search */
#ajaxSearch_form {margin:0 0 10px 5px; }
#ajaxSearch_form .textField {border:1px solid #dbdbdb; padding:1px 5px; width:200px;}
#ajaxSearch_form label {display:none;}
#ajaxSearch_form #indicator {position:absolute; top:65px; right:25px; z-index:120;}
#ajaxSearch_form #searchClose {position:absolute; top:65px; right:5px; z-index:121;}
#ajaxSearch_output {background:#fff; border:1px solid #666; padding:10px; position:absolute; top:60px; width:230px; z-index:110;}

#characterVotes div label {margin-right:6px;}


/**********************
 HEADER
 **********************/

h1 a {border:none;}

#header {background:transparent url('../images/graphics/header-background.jpg') no-repeat 0 0; overflow:visible; position:relative; width:890px;}

#globalHeader {padding:10px 0; position:absolute; left:610px; top:20px; width:255px;}


/**********************
 NAVIGATION 
 **********************/
 
#globalNav {list-style-type:none; position:relative;}
#globalNav li {float:left; padding-right:10px;}
#globalNav li a {color:#fff; font-size:90%; text-decoration:none; text-transform:uppercase;}
#globalNav li a:hover, #globaNav li a:active {text-decoration:underline;}
#globalNav .friend, #globalNav .vote, #globalNav .join {background-image:url('../images/icons/icon-matrix-black.png');}


#navigation ul#mainNav,
#navigation ul {font-family:'Trebuchet MS', 'Trebuchet', Verdana, Arial, Helvetica, sans-serif; list-style-type:none; overflow:hidden; width:890px;}
#navigation ul#mainNav li,
#navigation ul li {float:left; margin:0; padding:0;}

#navigation ul#mainNav {background:#f7f7f7 url('../images/graphics/mainnav-background.jpg') no-repeat 0 100%; font-size:150%; margin-top:22px;}
#navigation ul#mainNav li {background:transparent url('../images/graphics/mainnav-divider.jpg') no-repeat 100% 50%; /*margin-left:-6px;*/}
#navigation ul#mainNav li.first {margin-left:0;}

#navigation ul#mainNav li a {background:none; color:#333; display:inline-block; padding:5px 15px 5px 10px; text-decoration:none;}
#navigation ul#mainNav li a:hover, #navigation #mainNav li a:active, #navigation #mainNav li a.active {background:#bec7dc url('../images/graphics/mainnav-active.jpg') no-repeat 0 0;}

#navigation ul#mainNav li.first a {padding-left:15px;}
#navigation ul#mainNav li.first a:hover, #navigation #mainNav li.first a:active, #navigation #mainNav li.first a.active {background:#bec7dc url('../images/graphics/mainnav-active-first.jpg') no-repeat 0 100%;}

#navigation ul {font-size:130%; margin-top:-15px; width:880px;}
#navigation ul li {padding:0 7px 0 8px;}
#navigation ul li.first {background:none;}
#navigation ul li a {background:none; color:#333; padding:2px 7px; text-decoration:none;}
#navigation ul li a:hover, #navigation ul li a:active, #navigation ul li a.active {background:#bec7dc; color:#333;}

/* Skip Links */
#skipLinks a, #skipLinks a:hover, #skipLinks a:visited{height:1px; left:0px; overflow:hidden; position:absolute; top:-500px; width:1px;} /* hide skip link */
#skipLinks a:active, #skipLinks a:focus{color:#fff; font-weight:bold; font-size:120%; height:auto; position:static; width:auto;} /* make visible when tabbed to */


/**********************
 ADVERTISING
 **********************/
 
 #skyRight {left:50%; margin-left:455px; top:15px; position:absolute; width:120px;}