/* Style: Reset
------------------------------------------------------------------------------*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	font-family: inherit;
	vertical-align: baseline;
}
/* remember to define focus styles! */
:focus {
	outline: 0;
}
body {
	line-height: 1;
	color: black;
	background: white;
}
ol, ul {
	list-style: none;
}
/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: separate;
	border-spacing: 0;
}
caption, th, td {
	text-align: left;
	font-weight: normal;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: "";
}
blockquote, q {
	quotes: "" "";
}
/* Style: Elements
------------------------------------------------------------------------------*/
html {
    overflow-y: scroll;
}
body {
	background-color: #fff;
	font-family: helvetica,arial,sans-serif;
	font-size: 11px;
	color: #000;
}
p {
    margin: 0 0 14px 0;
    line-height: 14px;
}
p.list {
    margin: 0 0 2px 0;
}
table p {
    margin: 0;
}
a {
    text-decoration: none;
}
a:link {
    color: #000;
    font-weight: bold;
}
a:visited {
	color: #000;
	font-weight: bold;
}
a:active {
    color: #cc0000;
}
a:hover {
	color: #cc0000;
}
a img {
    border: none;
}
h1, h2, h3, h4, fieldset legend {
    margin: 0 0 0 0;
    padding: 0 0 0px 0;
    text-align: left;
}
/* all view and form titles: */
h1, fieldset legend {
    color: #cc0000;
    font-size: 18px;
	font-weight: bold;
}
h2 {
	color: #cc0000;
	padding-bottom: 11px;
	font-size: 14px;
	font-weight: bold;
}
h3 {
    color: #666;
    font-size: 14px;
    margin: 11px 0 0 0;
    padding: 0 0 11px 0;
}
h4 {
	color: #993;
}
ul, li {
    margin: 0;
}

/* Style: Layout Elements
------------------------------------------------------------------------------*/
#wrapper {
	margin: 0 auto 0 auto;
	padding: 0;
	width: 960px;
	text-align: left;
}
#container {
	z-index: 1;
	overflow: hidden;
	margin: 0 auto 0 auto;
	padding: 0;
	width: 100%;
	min-height: 445px;
}
#flash_container {
	z-index: 1;
	overflow: auto;
	background: #fff;
	margin: 100px auto 0 auto;
	padding: 0;
	width: 100%;
	min-height: 445px;
}
#header {
	z-index: 1;
	clear: both;
	padding: 18px 0 0px 0;
	width: 100%;
	height: 54px;
	border-bottom: 2px #000 solid;
}
#header.blank {
    padding-top: 18px;
	border-bottom: 2px #000 solid;
}

#footer {
	z-index: 1;
	clear: both;
	margin: 0;
	width: 100%;
/*
	min-height: 24px;
*/
	border-top: 2px #000 solid;
}

/* Style: Header Elements
------------------------------------------------------------------------------*/
#logo_bar {
	float: left;
	clear: left;
	width: 280px;
	text-align: left;
}
#nav_bar {
	float: right;
	clear: right;
	padding: 25px 0 0 0;
    font-size: 13px;
	text-align: right;
}
#nav_bar:hover {

}
#nav_bar_admin {
    float: right;
	clear: right;
	margin: 1px 0 1px 0;
}
a.menu_item {
    display: inline-block;
    float: left;
    font-size: 15px;
	height: 17px;
	background-repeat: no-repeat;
	background-position: 0 -38px;
	padding-bottom: 0px;
}
#nav_bar a.menu_item {
    margin: 0 0 0 16px;    
}
#nav_bar_admin a.menu_item {
	font-size: 8px;
	margin: -1px 0 0 9px;
	height: 9px;
	text-transform: capitalize;
	color: #666;
}
#nav_bar_admin a.menu_item:hover {
    color: #cc0000;
}
a.menu_item:hover {
	background-position: 0 -19px;
}
a.menu_item.home, a.menu_item.web, a.menu_item.print, a.menu_item.apps, a.menu_item.my_projects, a.menu_item.labs, a.menu_item.domains, a.menu_item.clients, a.menu_item.users, a.menu_item.about, a.menu_item.contact {
	border-bottom: 2px #cc0000 solid;
	background-position: 0 -38px;
}
#nav_home
{
	background-image: url('../img/nav/home.gif');
	width: 35px;
}
#nav_web
{
	background-image: url('../img/nav/web.gif');
	width: 26px;
}
#nav_print
{
	background-image: url('../img/nav/print.gif');
	width: 30px;
}
#nav_apps
{
	background-image: url('../img/nav/apps.gif');
	width: 31px;
}
#nav_my_projects
{
	background-image: url('../img/nav/my_projects.gif');
	width: 73px;
}
#nav_labs
{
	background-image: url('../img/nav/labs.gif');
	width: 27px;
}
#nav_domains
{
	background-image: url('../img/nav/domains.gif');
	width: 54px;
}
#nav_clients
{
	background-image: url('../img/nav/clients.gif');
	width: 43px;
}
#nav_users
{
	background-image: url('../img/nav/users.gif');
	width: 32px;
}
#nav_about
{
	background-image: url('../img/nav/about.gif');
	width: 39px;
}
#nav_contact
{
	background-image: url('../img/nav/contact.gif');
	width: 48px;
}
#nav_news
{
	background-image: url('../img/nav/news.gif');
	width: 31px;
}
#nav_philosophy
{
	background-image: url('../img/nav/philosophy.gif');
	width: 69px;
}

/* Style: Content Elements
------------------------------------------------------------------------------*/
#content {
    padding-top: 20px;
    min-height: 600px;
}
.index {
    width: 700px;
	margin: 0px auto 0 auto;
}
.view {
    width: 500px;
	margin: 18px auto 0 auto;
	overflow: auto;
}
.form {
    width: 500px;
	margin: 18px auto 0 auto;
}
.filter_menu_bar
{
	margin: 2px 0 2px 0;
	text-align: left;
}
.filter_menu_bar a.menu_item
{
    margin: 3px 12px 3px 0;
    font-size: 12px;
	text-align: left;
}
a.menu_item.selected {
    border-bottom: 1px #cc0000 solid;
}
#admin_links {
    clear: both;
    padding: 24px 0 12px 0;
    color: #666;
    margin-left: -6px;
}
.ellipsis {
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	-o-text-overflow: ellipsis;
	-ms-text-overflow: ellipsis;
	-moz-binding: url('../files/xml/ellipsis.xml#ellipsis');
}
#metadata {
    clear: both;
    padding: 12px 0 10px 0;
    font-size: 90%;
    color: #333;
    text-align: center;
}

#text_cols {
    border-bottom: 2px #000 solid;
    padding-top: 18px;
    height: 196px;
}
.text_col {
    float: left;
    width: 222px;
    padding-right: 18px;
}
.text_col_heading {
    height: 32px;
}
.text_col_heading.col_1, .text_col_heading.col_2, .text_col_heading.col_3 {
    margin-right: -240px;
}
.text_col_text {
    min-height: 148px;
    padding-left: 1px;
}
#img_rows, #img_rows_print {
    height: 424px;
}
.img_row {
    height: 167px;
    padding-top: 30px;
}
.img_row_cell {
    float: left;
    width: 240px;
    text-align: center;
}
.img_row_cell img {
    border: 1px #999 solid;
    cursor: pointer;
}
/* This way the imgs for print don't have opacity set: */
#img_rows .img_row_cell img {
}
.img_row_cell_tag
{
/*
	background-color: #FFF;
	color: #cc0000;
	border: 1px #999 solid;
*/
/*
	background-color: #cc0000;
	color: #fff;
	border: 1px #cc0000 solid;
*/
/*
	background-color: #FF9;
	color: #000;
	border: 1px #FC3 solid;
*/
/*
	background-color: #FF6;
	color: #000;
	border: 1px #FC3 solid;
*/
/*
	background-color: #fff;
	color: #000;
	border: 1px #666 solid;
	font-size: 10px;
	width: 210px;
	height: 20px;
	margin-top: -28px;
	margin-bottom: 2px;
	margin-left: 9px;
	padding: 3px 5px 1px 5px;
	text-align: left;
*/
	background-color: #fff;
	color: #000;
	border: 1px #999 solid;
	font-size: 10px;
	width: 210px;
	height: 20px;
	margin-top: -25px;
	margin-bottom: -1px;
	margin-left: 9px;
	padding: 3px 5px 1px 5px;
	text-align: left;
}

/* Style: Width Classes
------------------------------------------------------------------------------*/
.w960 {
    width: 960px;
}
.w900 {
    width: 900px;
}
.w800 {
    width: 800px;
}
.w700 {
    width: 700px;
}
.w600 {
    width: 600px;
}
.w500 {
    width: 500px;
}
.w400 {
    width: 400px;
}
.w300 {
    width: 300px;
}
.w200 {
    width: 200px;
}
.w120 {
    width: 120px;
}
.w100 {
    width: 100px;
}
.w80 {
    width: 80px;
}

/* Style: Scaffold View
------------------------------------------------------------------------------*/
dl {
	margin: 0em 0em;
	line-height: 2em;
}
dl.altrow {
	background: #f4f4f4;
}
dt {
	margin: 0 366px 0 0;
	padding: 0 0 0 4px;
	vertical-align: top;
	text-align: right;
	font-weight: bold;
	color: #666;
}
dd {
	margin: -2em 0 0 140px;
	vertical-align: top;
}

/* Style: Footer Elements
------------------------------------------------------------------------------*/
#login_bar {
    color: #ccc;
	padding: 10px 0 0 0;
	font-size: 9px;
	text-align: left;
}
#login_bar .col_2, #login_bar .col_3 {
    padding-top: 5px;
}

/* Style: ColorBox
------------------------------------------------------------------------------*/
/*
    ColorBox Core Style
    The following rules are the styles that are consistant between all ColorBox themes
*/
#colorbox, #cboxOverlay, #cboxWrapper {
    position:absolute;
    top:0;
    left:0;
    z-index:9999;
    overflow:hidden;
}
#cboxOverlay {
    position:fixed;
    width:100%;
    height:100%;
}
#cboxMiddleLeft, #cboxBottomLeft {
    clear:left;
}
#cboxContent {
    position:relative;
    overflow:visible;
}
#cboxLoadedContent {
    overflow:auto;
}
#cboxLoadedContent iframe {
    display:block;
    width:100%;
    height:100%;
    border:0;
}
#cboxTitle {
    margin:0;
}
#cboxLoadingOverlay, #cboxLoadingGraphic {
    position:absolute;
    top:0;
    left:0;
    width:100%;
}
#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow {
    cursor:pointer;
}

/* 
	ColorBox example user style
	These rules are ordered and tabbed in a way that represents the order/nesting of the generated HTML, 
	in hope that this will make the relationship easier to understand. Thanks, jack@colorpowered.com
*/
#cboxOverlay {
    background:#333;
}

#colorbox {
    position: absolute;
    top: 0px;
    margin: 0 auto 0 auto;
}
#cboxContent {
    margin-top: 0px;
}
#cboxLoadedContent {
    background:#000;
    padding:1px;
}
#cboxLoadingGraphic {
    background:url('../img/colorbox/loader.gif') center center no-repeat;
}
#cboxLoadingOverlay {
    background:#cc0000;
/*
    background-image: url('../img/dada_tile.png');
*/
}
#cboxTitle {
    position:absolute;
    top:-22px;
    left:0;
    color:#000;
}
#cboxCurrent {
    position:absolute;
    top:-22px;
    right:205px;
    text-indent:-9999px;
}               
#cboxSlideshow, #cboxPrevious, #cboxNext, #cboxClose {
    text-indent:-9999px;
    width:19px;
    height:19px;
    position:absolute;
    top:2px;
    background:url('../img/colorbox/controls.png') 0 0 no-repeat;
}
#cboxPrevious {
    background-position:0px 0px;
    right:44px;
}
#cboxPrevious.hover {
    background-position:0px -25px;
}
#cboxNext {
    background-position:-25px 0px;
    right:22px;
}
#cboxNext.hover {
    background-position:-25px -25px;
}
#cboxClose {
    background-position:-51px -1px;
    right:2px;
}
#cboxClose.hover {
    background-position:-51px -26px;
}
.cboxSlideshow_on #cboxPrevious, .cboxSlideshow_off #cboxPrevious {
    right:66px;
}
.cboxSlideshow_on #cboxSlideshow {
    background-position:-75px -25px;
    right:44px;
}
.cboxSlideshow_on #cboxSlideshow.hover {
    background-position:-100px -25px;
}
.cboxSlideshow_off #cboxSlideshow {
    background-position:-100px 0px;
    right:44px;
}
.cboxSlideshow_off #cboxSlideshow.hover {
    background-position:-75px -25px;
}

/* Style: Presentation Panel
------------------------------------------------------------------------------*/
.presentation_panel {
    height: 562px;
    background: #fff;
    padding: 40px;
}
.presentation_panel_content {
    height: 550px;
    border-top: 2px #000 solid;
    border-bottom: 2px #000 solid;
}
#contact_panel .presentation_panel_content {
    padding-top: 40px;
    height: 522px;
}
.presentation_panel_content_left {
    float: left;
}
.presentation_panel_content_right {
    float: right;
}
#contact_panel .presentation_panel_content_left {
    width: 400px;
}
#contact_panel .presentation_panel_content_right {
    width: 220px;
    padding-right: 220px;
}
#logo_hello {
    margin-left: 47px;
}
#contact_panel img, #contact_panel canvas {
}
#contact_panel form {
/* Use following if NOT adding reflection: */
/*
    padding: 30px 0 0 10px;
*/
    padding: 14px 0 0 10px;
}
/* also see contact_panel.ctp */
.ie6 #contact_panel form, .ie7 #contact_panel form, .ie8 #contact_panel form {
    padding: 30px 0 0 10px;
}
#presentation_panel {
}
#presentation_panel .presentation_panel_content_left {
    width: 624px;
    padding-top: 40px;
}
#presentation_panel .presentation_panel_content_right {
    float: left;
    width: 234px;
    padding: 40px 0 0 20px;
    text-align: left;
}
#presentation_panel img {
    border: 1px #999 solid;
}
div.presentation_note {
    color: #999;
}
div.presentation_note a:link, div.presentation_note a:visited {
    color: #666;
    font-weight: bold;
}
a.panel, span.panel {
    font-family: courier new, courier;
/*
    opacity: .5;
	filter:alpha(opacity=50);
*/
    color: #cc0000;
    text-indent: -9999px;
}
a.panel {
    display: inline-block;
    height: 12px;
    width: 18px;
}
.gecko a.panel {
    vertical-align: -2px;
}
a.panel.prev
{
	background-image: url('../img/prev.gif');
	background-repeat: no-repeat;
	background-position: 0 -12px;
}
a.panel.next {
    background-image: url('../img/next.gif');
	background-repeat: no-repeat;
	background-position: 0 -12px;
}
span.panel {
    color: #000;
    text-indent: -9999px;
}
.gecko span.panel {
    display: inline-block;
    height: 12px;
    width: 18px;
    vertical-align: -1px;
}
.safari span.panel {
    display: inline-block;
    height: 12px;
    width: 18px;
    vertical-align: -1px;
}
a.panel:hover
{
	/*
    opacity: 1.0;
	filter:alpha(opacity=100);
*/
	background-position: 0 0px;
}

/* Style: ScrollTo Panel
------------------------------------------------------------------------------*/
#sliding_wrapper {
	width: 100%;
/*
review how we got to this number
*/
	height: 510px;
	/* relative allows us to position this in a div, but breaks
	the top of the thing in Safari unless we remove top from .content: */
	position: relative;
	top: 0;
	left: 0;
	overflow: hidden;
}
/* #mask width and .item width are bound together, stupidly,
so in order to have 10 elements horizontal withing diagonally scrolling,
#mask width has to be 1000% and .item widths has to be 1/10th of that */
#mask {
    width: 1000%;
    height: 100%;
    background-color: #fff;
}
/* item is the entire visible ground at any given time: */
.item {
    width: 10%;
    height: 100%;
    float: left;
    background-color: #fff;
}
.panel_nav {
    text-align: center;
    padding: 0px 0 0px 0;
    margin-top: -20px;
    margin-bottom: 6px;
    font-size: 18px;
}
#panel_nav_left {
    position: absolute;
    left: 10px;
}
#panel_nav_counter
{
	color: #000;
	font-size: 13px;
	vertical-align: 1px;
}
#panel_nav_right {
    position: absolute;
    right: 10px;
}
.content {
    /* width & height must be at max width & height of any possible image: */
	width: 880px;
	height: 470px;
	top: 0;
	margin: 0 auto;
	background-color: #fff;
	position: relative;
	text-align: center;
}
.selected {
    background: #fff;
    font-weight: 700;
}
.clear {
    clear:both;
}

/* Style: Main Page Edit Presentations
------------------------------------------------------------------------------*/
#edit_presentations {
    clear: both;
    width: 266px;
    margin: 0 auto 10px auto;
    padding: 20px 0 0 34px;
}
.edit_presentations_presentation {
	margin: 10px;
	padding: 10px;
	border: 1px #999 solid;
    text-align: center;
}
.edit_presentations_presentation:hover {
    cursor: pointer;
    border: 1px #cc0000 solid;
}
.reorder_item {
    cursor: pointer;
}
.reorder_item.hidden {
    opacity: .5;
}
.reorder_item.featured, .reorder_item.exemplary {
	border: 1px #C00 dashed;
}
.reorder_item.featured:hover, .reorder_item.exemplary:hover {
	border: 1px #C00 solid;
}
.edit_image {
    margin: 42px 0 8px 132px;
}
.edit_image img {
    border: 1px #999 solid;
}
.input.text.file input {
    float: left;
}