jquery-ui/demos/real-world/photo-manager/theme/css/screen.css

body {
	padding: 0;
	margin: 0;
	line-height: 1.5em;
	font-size: 75%; /* gives us 12px in most browsers */
	font-family: "Helvetica Neue", "Lucida Grande", Helvetica, Arial, Verdana, sans-serif;
	background: #aefe05 url('../img/side_top.jpg') repeat-x top; /* body background from ui.jquery.com */
	color: 222;
}

/*
================================
=LAYOUT
================================ */
h1 {
	padding: 0 0 0 52px;
	margin: 0;
	font-size: 1.5em; /* 18px */
	line-height: 2em; /* 36px */
	background: url('../img/photos_gold_32.gif') no-repeat 8px 50%; /* Thanks to Iconbuffet.com */
	color: #fff;
}
#body_wrap {
	width: 960px;
	margin: 0 auto;
	background: #fff url('../img/body_wrap_bg.gif') repeat-y;
}
#content {
	float: left;
	width: 632px;
}
#sidebar {
	float: right;
	width: 320px;
}
#footer {
	clear: both;
	background: #32342f;
	color: #fff;
}

/*
================================
=SECTIONS
================================ */
/*
----------------
=HEADER
---------------- */
/*
----------------
=CONTENT
---------------- */
#content h2 {
	padding-left: 25px;
}
/*
=gallery
-------- */
.gallery {
	min-height: 108px;
	padding: 0;
	margin: 18px 0;
	list-style: none;
}
* html .gallery {
	height: 108px; /* min-height for lte IE6 */
}
.gallery.active {
	background: #eee;
}
.gallery li {
	float: left;
	width: 160px;
	padding: 0 25px;
	margin: 0 0 8px;
}
.gallery img {
	display: block;
	padding: 7px;
	border: 1px solid #ccc;
	background: #fff;
}
.displayBox img {
	border: 25px solid #222;
}
/* img title */
.gallery p {
	float: left;
	padding: 0;
	margin: 0;
}
/* img toolbar */
.gallery div {
	float: right;
}
.gallery div a {
	float: left;
	width: 24px;
	height: 24px;
	background-repeat: no-repeat;
	background-position: center;
	text-indent: -9999px; /* Phark revisited image replacement */
}
.gallery div a:focus {
	outline: 0;
}
.tb_supersize {
	background-image: url('../img/search_16.gif'); /* Thanks to Iconbuffet.com */
}
.tb_trash {
	background-image: url('../img/trash_16.gif'); /* Thanks to Iconbuffet.com */
}

/*
----------------
=SIDEBAR
---------------- */
.box {
	margin: 18px;
	border: 1px solid #ccc;
	background: #fff;
}
.box h2 {
	padding: 0 8px;
	margin: 0;
	font-size: 1.5em;
	line-height: 2em;
	background: #525252 url('../img/header_bg.png') repeat-x bottom;
	color: #fff;
}
.box div {
	min-height: 128px;
	border: 2px solid #fff;
}
* html #sidebar .box div {
	height: 128px; /* min-height for lte IE6 */
}
#trash div.active {
	border-color: green;
}
#shred div.active {
	border-color: red;
}
#trash div img {
	float: left;
	margin: 4px;
}

/*
----------------
=FOOTER
---------------- */
#footer p {
	margin: 0;
	text-align: right;
}


/*
================================
=FLOAT CLEARING
================================ */
#body_wrap, ul.gallery, #trash div {
	display: inline-block;
}
#body_wrap:after, ul.gallery:after, #trash div:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}
* html #body_wrap, * html ul.gallery, * html #trash div {
	height: 1%;
}
#body_wrap, ul.gallery, #trash div {
	display: block;
}