.clear
{
    clear: both;
}

/* form view control */
.form-view
{
    width: 100%; /* make the tables from these full width */
}

/* data list control */
.data-list
{
    width: 100%; /* make the tables from these full width */
}

/*********************************************************************/
/* forms                                                             */
/*********************************************************************/

.form-field
{
    width: 350px;
    margin-bottom: 5px;
}

.form-label
{
    padding-right: 5px;
}

.form-buttons
{
    margin-bottom: 5px;
}

/*********************************************************************/
/* image-picker                                                      */
/*********************************************************************/

.image-picker
{
    border: solid 1px gray;
    background-color: white;
    margin-bottom: 5px;
}

.image-picker-image-wrapper
{
    padding: 10px;
    text-align: center;
}

.image-picker-data-list
{
}

.image-picker-thumbnail
{
    text-align: center;
}

.image-picker-form
{
    margin: 10px auto;
}

.image-picker-form-field
{
    width: 300px;
}

.image-picker-form-label
{
}

.image-picker-buttons
{
    padding: 10px;
    text-align: center;
    background-color: gray;
}

/*********************************************************************/
/* elements                                                          */
/*********************************************************************/

body
{
    font-family: "Trebuchet MS" , Arial, Helvetica, sans-serif;
    background-image: url(RedBanner.png);
    background-repeat: repeat-x;
    background-color: White;
}

h2
{
    margin: 0px;
}

/* links are all shades of red */
a:link 
{ 
    color: #700000;
}

a:visited, a:active
{ 
	color: #AE0000;
} 

a:hover 
{ 
	color: #870000; 
}

/*********************************************************************/
/* header                                                            */
/*********************************************************************/

/* the header wraps the logo, title, subtitle, and menu */
#header
{
    width: 800px;
    margin: 0px auto;
}

/* this keeps the logo, title, and subtitles together */
#title-wrapper
{
    float: left;
}

#logo
{
    float: left;
    width: 112px;
    height: 128px;
}

#title
{
    margin-left: 125px;
    padding-top: 28px;
    font-size: 34px;
    text-transform: uppercase;
}

#subtitle
{
    margin-left: 125px;
    font-size: 18px;
    color: silver;
    text-transform: uppercase;
}

/*********************************************************************/
/* menu                                                              */
/*********************************************************************/

#menu-wrapper-outer
{
	margin-top: 60px;
    float: right;
	background: url(HeaderLeft.png) no-repeat scroll left top;
}

#menu-wrapper
{
    background: url(HeaderRight.png) no-repeat scroll right top;	
}

#menu
{
	margin: 0px 19px;
    height: 50px;
    background: url(HeaderMiddle.png) repeat-x scroll left top;
}

#menu ul
{
	margin: 0px 35px 0px 0px;
    padding-top: 10px;
    list-style-type: none;
}

.menu-item
{
    display: inline;
    margin: 0px 0px;
}

.menu-separator
{
	display: inline;
	margin: 0px 10px;
	background: url(divider.gif) no-repeat center center;
}

#menu a:link, #menu a:visited, #menu a:active
{
    color: White;
    text-decoration: none;
}

#menu a:hover
{
    color: Yellow;
    text-decoration: none;	
}

/*********************************************************************/
/* page                                                              */
/*********************************************************************/

/* used mainly for background tricks */
#page-wrapper-outer
{
    width: 840px;
    margin: 10px auto;
    background: url(PageLeft.png) no-repeat scroll left top;    
}

/* used mainly for background tricks */
#page-wrapper
{
    background: url(PageRight.png) no-repeat scroll right top;            
}

#page
{
    width: 800px;
    margin: 0px auto;
    background: url(PageMiddle.png) repeat-x scroll left top;            
    padding-top: 20px;
}

#leftcol
{
    float: left;
    width: 540px;
}

#rightcol
{
    float: right;
    width: 240px;   
}

/* used mainly for background tricks */
.rightcol-header-wrapper-outer
{
}

/* used mainly for background tricks */
.rightcol-header-wrapper
{
}

.rightcol-header
{   
    margin: 0px 10px;
}

.rightcol-item
{ 
    margin: 0px 10px;
}

.rightcol-separator
{
    margin: 5px 10px;
    border-bottom: gray 1px dashed;    
}

.rightcol-footer
{
    margin: 5px 10px;    
    padding: 5px 0px;
    border-top: gray 1px dashed;    
}

/*********************************************************************/
/* footer                                                            */
/*********************************************************************/

#footer
{
    height: 200px;
    padding-top: 30px;
    color: gray;
    text-align: center;
    font-size: 12px;
}

#footer a:link, #footer a:visited
{
    color: gray;
    text-decoration: none;
}

#footer a:hover, #footer a:active
{
    color: gray;
    text-decoration: underline;
}

/*********************************************************************/
/* portfolio                                                         */
/*********************************************************************/

/* the admin only form view for editing */
.portfolio-form-view
{
    width: 100%;
    border-bottom: solid 1px black;
    margin-bottom: 20px;
}

.portfolio-form-view h2
{
    display: inline;
}

.portfolio-form-view-buttons
{
    display: inline;
    float: right;
    margin: 0px 2px;
}

/* portfolio list */
.portfolio-data-list
{
    margin-top: 20px;
}

.portfolio-item
{
}

.portfolio-item-image-wrapper
{
    float: left;
    margin: 0px 10px 0px 0px;
    text-align: center;
}

.portfolio-separator
{
    height: 50px;
}

/*********************************************************************/
/* news                                                              */
/*********************************************************************/

.news-buttons
{
    margin-bottom: 20px;
}

.news-image-wrapper
{
    margin-top: 20px;
}

/*********************************************************************/
/* login                                                             */
/*********************************************************************/

.login-form
{
    margin: 0px 0px 50px;
}

.password-recovery-form
{
    margin: 0px 0px 50px;    
}

.change-password-form
{
}

.login-title
{
    font-size: 1.5em;
    font-weight: bold;
    text-align: left;
    padding-bottom: 5px;
}

.login-error
{
    margin-bottom: 5px;
}

.login-text
{
    margin-bottom: 5px;
}

.login-label
{
    text-align: left;
    padding-right: 5px;
}

.login-field
{
    width: 150px;
    margin-bottom: 5px;
}

.login-buttons
{
}

/*********************************************************************/
/* error page                                                        */
/*********************************************************************/

/* need a minimum height for the page background to look right */
.min-height
{
    height: 250px;
}