/* ----------------------------------------------------------------------
 *                                                              = utility
 * ---------------------------------------------------------------------- */
.hide {display:none;}

/* ----------------------------------------------------------------------
 *                                                               = layout
 * ---------------------------------------------------------------------- */
body {
    text-align:center;
    }
#module-wrap {
    width:342px;
    text-align:left;
    margin:238px auto auto;
    background:#2E94D4 url(Images/panelTile.jpg) bottom center repeat-y;
    position:relative;
    }

#module-wrap2 {
    background:url(Images/panelFootBg.jpg) bottom center no-repeat;
    }
#module {
    background:url(Images/panelBg.jpg) top center no-repeat;
    /*height:450px; /* HACK: this is actually a min-height requirement to properly show off the gradients and the leaves */
    overflow:hidden;
    width:100%;
    }
#ie6 #module 
{
    height:350px;
    overflow:visible;
    }
#ie6 #module-wrap,
#ie6 #module-wrap2,
#ie6 #module,
#ie6 #results,
#ie6 #results p,
#ie6 #results img {
	zoom:1;
}

#leaves {
    position:absolute;
    top:-212px;
    left:142px;
    }
img#wordmark {
    position:absolute;
    left:0; top:19px;
    margin-left:-44px;
}
#content {
    position:relative;
    z-index:100;
}
#content li {
	clear:right;
}
#ie6 #content li,
#ie6 #content li span.commands 
{
    position:relative;
    z-index:100;
}
#content li span.commands {
	float:right;
	width:auto;
}
h1 {
	margin:10px;
}
#generate,
#results p {
	text-align:center;
	cursor:pointer;
}
ul {
	margin:10px 15px;
}
li {
	margin:15px 0;
}
li.add {display:none;}
input {
	width:250px;
}
a,
a:visited {
	color:white;
	text-decoration:none;
}

a:hover,
a:active {
	text-decoration:underline;
}

#results {
	margin:15px;
	display:none;
}
#results ul {
	margin:0 0;
}
#results li {
	margin:0;
}
#results p#capsule {display:none;}
#results p.commands {
	font-size:80%;
	text-align:right;
	color:white;
}
#content #preview,
#content #preview img 
{
    height: 300px;
    width:300px;
    margin:20px auto 0;
    position: relative;
    color:White;
    line-height:200px;
    text-align:center;
}
#pagination 
{
background:transparent url(Images/pagination.png) no-repeat scroll 32px 0;
height:42px;
left:28px;
position:absolute;
top:261px;
width:244px;
display:block;
}
.notext {
font-size:0;
line-height:0;
text-indent:-4000px;
}
#pagination span.prev {
background:transparent url(images/prev.png) no-repeat scroll 0 0;
float:left;
height:42px;
width:32px;
}
#pagination span.next {
background:transparent url(images/next.png) no-repeat scroll 0 0;
float:right;
height:42px;
width:
32px;
}
.cl { font-size: 0; line-height: 0; height: 0; clear: both; }
#thumbs {padding: 5px; margin: 10px auto; width: 302px;}
.thumb {width: 96px; height: 96px; margin-right: 4px; float: left; padding: 1px; margin-bottom: 4px; overflow:hidden;}

.third {margin-right: 0;}

#error-notification {background:#FE7A15;color:white; text-align:center;margin:0 10px; width:272px; padding:10px;} #ie #error-notification {margin:0;width:308px}
#error-notification h2 {font-weight:bold; font-size:150%;} #ie #error-notification h2 {margin:10px 10px 0;}
#error-notification p {margin:0 10px 10px;}