@import 'reset.css';
@import 'fonts.css';
@import 'base.css';

/*
===============
 COMMON STYLES
===============
	BACKGROUNDS
		light taupe: #e6e3dc
	BORDERS
		border:1px solid #afafaf;
	SHADOWS
		gray drop shadow
			-webkit-box-shadow:2px 2px #ccc;
			-moz-box-shadow:2px 2px #ccc;
			box-shadow:2px 2px #ccc;
			filter:progid:DXImageTransform.Microsoft.Shadow('Color=#CCCCCC, Direction=135, Strenght=2');
	FONT-SIZES
		We're using a font-normalizing stylesheet. The following are the % equivalents for pixels. Use them!
			px	11  12   13   14   15     16   17     18     19     20     21   22   23   24   25   26    28
			%	85  93  100  108  116  123.1  131  138.5  146.5  153.9  161.6  167  174  182  189  197 215.4

*/

/* Header */
.header { height:100px; margin:10px 0 10px; position:relative; }
.header .logo,
.header .logo .overlay { width:141px; height:79px; top:0; left:0; }
.header .logo { position:relative; margin-right:14px; float:left; margin-top:20px; }
.header .logo .overlay { position:absolute; background:#e6e3dc url(../../images/sprites/nav_sprite.png); z-index:1; }
.header .logo a:hover .overlay { background-position:0 -81px; }
.header .navigation,
.header .popular,
.header .page-title { float:left; }
.header .navigation { width:815px; }
.header .popular,
.header .page-title { width:540px; }

/* Popular header links */
.header .popular { color:#999; border-bottom:#000 1px dotted; }
.header .popular dt,
.header .popular dd { text-transform:uppercase; line-height:20px; font-size:77%; float:left; }
.header .popular dt { margin-right:7px; }
.header .popular dd span { padding:0 7px; }
.header .popular dd:last-child span { display:none; }

/* Profile area */
.header #profile_area { position:absolute; top:0; left:750px; width:178px; padding:30px 0 0 42px; font-size:13px; }
.header #profile_area a { margin-left:12px; position:relative; z-index:1; }
.header #profile_area .sticker { position:absolute; top:-30px; left:-6px; }

/* Page title */
.header .page-title { font-family:georgia,serif; font-style:italic; font-size:20px; line-height:29px; height:25px; padding-top:3px; }

/* Search form */
.header form.search { float:right; width:254px; height:25px; padding:20px 0 0 20px; border-left:#000 1px dotted; }
.header form.search input.text { padding:5px; width:210px; float:left; }
.header form.search .button { width:25px; height:25px; float:right; background:url(../../images/sprites/nav_sprite.png) no-repeat -962px -158px; text-indent:5000px; border:0; padding:0; }
.header form.search .button:hover { background-position:-962px -127px; }

/* General navigation */
.navigation { overflow:visible; }
.navigation li { display:block; float:left; overflow:hidden; }
.navigation li ul { display:none; }
.navigation li ul li { float:none; }
.navigation li ul li a { display:block; }
.navigation li:hover ul { display:block; }

/* Site navigation */
.navigation.site { height:32px; margin-top:10px; padding-bottom:10px; position:relative; z-index:1; font-size:12px; line-height:20px; border-bottom:1px #000 dotted; }
.navigation.site li { padding:10px 10px 0; }
.navigation.site li li { padding:0; }
.navigation.site li ul { padding:10px 0; }
.navigation.site li:hover { background:#000; -webkit-box-shadow:2px 2px rgba(0,0,0,0.2); -moz-box-shadow:2px 2px rgba(0,0,0,0.2); box-shadow:2px 2px rgba(0,0,0,0.2); filter:progid:DXImageTransform.Microsoft.Shadow(Color=#00000033,Direction=135,Strength=2); }
.navigation.site li:hover a,
.navigation.site li:hover a:link,
.navigation.site li:hover a:visited { color:#fff; }
.navigation.site li:hover a:hover { color:#09f; }
.navigation.site h3,
.navigation.site h3 .overlay { height:22px; width:100%; top:0; left:0; display:block; }
.navigation.site h3 { position:relative; margin-right:5px; }
.navigation.site h3 .overlay { background:#e6e3dc url(../../images/sprites/nav_sprite.png); position:absolute; z-index:1; }
.navigation.site li:hover h3 .overlay { background-color:#000; }
.navigation.site .contributors li:last-child,
/*.navigation.site .participate li:last-child,*/
.navigation.site .you li:last-child { margin-top:8px; border-top:#333 1px dotted; padding-top:5px; }

.navigation.site .topics { width:85px; margin-left:-10px; }
.navigation.site .topics h3 .overlay { background-position:-167px -44px; }
.navigation.site .topics:hover h3 .overlay { background-position:-167px 0; }
.navigation.site .contributors { width:172px; }
.navigation.site .contributors h3 .overlay { background-position:-280px -44px; }
.navigation.site .contributors:hover h3 .overlay { background-position:-280px 0; }
.navigation.site .fun-stuff { width:126px; }
.navigation.site .fun-stuff h3 .overlay { background-position:-475px -44px; }
.navigation.site .fun-stuff:hover h3 .overlay { background-position:-475px 0; }
.navigation.site .participate { width:146px; }
.navigation.site .participate h3 .overlay { background-position:-630px -44px; }
.navigation.site .participate:hover h3 .overlay { background-position:-630px 0; }

/* Logged in YOU dropdown */
.navigation.site .you { width:100px; float:right; margin-right:-10px; margin-top:-14px; }
.navigation.site .you h3 { height:39px; }
.navigation.site .you h3 .overlay { background-position:-805px -44px; margin-top:14px; }
.navigation.site .you h3 img { width:32px; height:32px; position:relative; top:1px; left:0; z-index:2; padding:2px; background:#fff; -webkit-box-shadow:2px 2px rgba(0,0,0,0.2); -moz-box-shadow:2px 2px rgba(0,0,0,0.2); box-shadow:2px 2px rgba(0,0,0,0.2); filter:progid:DXImageTransform.Microsoft.Shadow(Color=#00000033,Direction=135,Strength=2); border:0; }
.navigation.site .you:hover h3 .overlay { background-position:-805px 0; }
.navigation.site .you ul { padding-top:7px; }

/* Admin navigation */
.navigation.admin { border-top:1px #000 dotted; border-bottom:10px #000 solid; height:30px; margin:20px 0 30px; font-size:12px; }
.navigation.admin li { border-top:2px transparent solid; margin-top:-1px; cursor:pointer; }
.navigation.admin li:hover a { color:#09f; }
.navigation.admin li:hover ul { -webkit-box-shadow:2px 2px rgba(0,0,0,0.2); -moz-box-shadow:2px 2px rgba(0,0,0,0.2); box-shadow:2px 2px rgba(0,0,0,0.2); filter:progid:DXImageTransform.Microsoft.Shadow(Color=#00000033,Direction=135,Strength=2); }
.navigation.admin li h3 { font-weight:bold; line-height:29px; vertical-align:middle; }
.navigation.admin li h3 a { padding:0 14px; border-right:1px #888 solid; }
.navigation.admin li.maintenance h3 a { border:0; }
.navigation.admin li h3 sup { font-size:8px; vertical-align:middle; }
.navigation.admin li ul { position:absolute; background:#000; padding:10px; line-height:30px; z-index:1; }
.navigation.admin li ul a,
.navigation.admin li ul a:link,
.navigation.admin li ul a:visited { color:#fff; }
.navigation.admin li ul a:hover { color:#09f; }
.navigation.admin .posts:hover,
.CONTROLLER-posts .navigation.admin .posts,
.navigation.admin .features:hover,
.CONTROLLER-features .navigation.admin .features,
.navigation.admin .categories:hover,
.CONTROLLER-categories .navigation.admin .categories,
.navigation.admin .comments:hover,
.CONTROLLER-comments .navigation.admin .comments,
.navigation.admin .users:hover,
.CONTROLLER-users .navigation.admin .users,
.navigation.admin .maintenance:hover,
.CONTROLLER-install .navigation.admin .maintenance { border-top-color:#000; }

/* Sidebar modules */
.sidebar .module { padding:20px; font-size:12px; }

/* Edit image form */
.edit-image { font-size:12px; padding:15px 0 30px; }
.edit-image fieldset { clear:both; }
.edit-image fieldset label { margin-right:30px; }
.edit-image fieldset legend,
.edit-image .title,
.edit-image .caption,
.edit-image .citation { line-height:30px; }
.edit-image fieldset legend,
.edit-image .title,
.edit-image .caption,
.edit-image .citation { font-weight:bold; font-size:14px; }
.edit-image .thumb-info { height:90px; }
.edit-image .thumb-info .thumb { float:left; margin:0 14px 14px 0; position:relative; }
.edit-image .thumb-info .thumb img,
.edit-image .thumb-info .thumb canvas { display:block; }
.edit-image .thumb-info .thumb canvas { position:absolute; top:0; left:0; z-index:1; }
.edit-image .thumb-info .is-main,
.edit-image .thumb-info .recrop { float:left; }
.edit-image .thumb-info .is-main { width:270px; border-bottom:#888 1px dotted; padding-bottom:14px; margin-bottom:10px; }
.edit-image .thumb-info .recrop { color:#09f; width:249px; line-height:17px; padding-left:21px; background:url(../../images/icons/recrop.png) no-repeat 0 50%; }
.edit-image .cropper { clear:both; overflow: hidden; margin:20px 0 14px; border-top:1px #888 dotted; border-bottom:1px #888 dotted; }
.edit-image .cropper h3 { font-size:14px; font-weight:bold; padding:14px 0; }
.edit-image .cropper .submit,
.edit-image .cropper .reset { padding-top:20px; padding-bottom:20px; }
.edit-image .size,
.edit-image .title,
.edit-image .caption,
.edit-image .citation { margin:14px 0; }
.edit-image .title label,
.edit-image .caption label,
.edit-image .citation label { float:left; clear:left; }
.edit-image .title input,
.edit-image .caption textarea,
.edit-image .citation input { width:540px; padding:5px; display:block; clear:left; }
.edit-image .caption textarea { height:50px; }
.edit-image .submit { clear:left; padding:11px 14px 20px 0; float:left; }
.edit-image .reset { float:left; padding-top:11px; }

.js .edit-image .cropper { display: none; }

form .privacy { font-size: 12px; float: left; line-height: 26px; font-style: italic; font-family: georgia, serif; padding-left:14px; border-left:#000 1px dotted; }
