/******************************************************************************
 * OpenTerracotta 0.7 (ANASTACIA) (c) 2003 Eternity Technologies
 * http://terracotta.sourceforge.net/
 * Created by: Devraj Mukherjee (devraj@eternitytechnologies.com)
 *
 * This software is published under the GNU/GPL and is free for commercial and
 * non-commercial use. This software comes with absolutely no warranty at all.
 * Any modifications made by the users of this software must be contributed 
 * back to the OpenTerracotta project.
 *
 * For information about the GNU/GPL please read the the license file included
 * this software bundle or visit http://www.gnu.org/licenses/gpl.txt
 * 
 * Filename:     screen.css
 * Created on:   12th December 2003
 * Author:       Devraj Mukherjee (devraj@eternitytechnologies.com)
 *               Peter Swan (pswan@eternitytechnologies.com)
 * 
 ******************************************************************************/

/******************************************************************************
 * Body tag definitions
 ******************************************************************************/

 body {

     background: #FFF9DF;
     background-image: url(images/background.jpg);
     color: #000000;
     font-family: Verdana, Arial, Sans-Serif;
     font-size: 10pt;
     margin: 0px;
     padding: 0px;
     text-align: center;

 }

/******************************************************************************
 * Management toolbar
 ******************************************************************************/

 #management {

     background-image: url(images/management_background.jpg);
     width: 100%;
     height: 30px;
     margin-top: 0px;
     text-align: left;
     font-size: 8pt;

 }

 #management ul { padding: 0px; margin: 0px; padding-top: 6px; }
 #management li { display: inline; padding: 4px; }
 #management a { color: #000000; text-decoration:none; font-weight: bold; }
 #management a:hover { text-decoration: underline; }

/******************************************************************************
 * Forms is a layer that allows you to uniformly format forms in tables
 ******************************************************************************/

 #dataform {

     font-family: Verdana, Arial, Sans-Serif;
     font-size: 8pt;
     padding: 10px;
     text-align: center;

 }

 #content #dataform h1 { font-size: 11pt; }
 #dataform option.objecttype { background-color: #DDDDDD; color: #000000; font-weight: bold; }
 #dataform p { font-weight: bold; }
 #dataform table { width: 100%;  }
 #dataform td { font-size: 8pt; width: 50%; }
 #dataform td.left { text-align: right; }
 #dataform td.right { text-align: left; }
 #dataform select { font-size: 8pt; border: solid thin #DE6300; background-color: #FFF0E3; }
 #dataform select.delete { height: 180px; width: 400px; }
 #dataform textarea { height: 200px; width: 500px; background-color: #FFF0E3; border: solid thin #DE6300; }
 #dataform textarea { border: solid 2px #DE6300; }
 #dataform input { width: 200px; font-size: 8pt; border: solid thin #DE6300; background-color: #FFF0E3; }
 #dataform input.mandatory { border: solid 2px #DE6300; }
 #dataform input.button { width: auto;color: #FFE79E; font-weight: bold; background-image: url(images/button_background.jpg); padding: 2px; }

/******************************************************************************
 * A container DIV that allows us center things for Internet Explorer
 ******************************************************************************/

 #container { 
    
	width: 700px; 
	margin-left: auto; 
	margin-right: auto; 
	padding-left: 0px;
	padding-bottom: 10px; 
	text-align: center; 

 } 

/******************************************************************************
 * Header Layer which displays the OpenTerracotta logo image
 ******************************************************************************/

 #header {

     background: url(images/openterracotta_titlebar.gif) no-repeat top right;
     position: relative;
     height: 76px;
     padding: 0px
     margin: 0px;
     margin-top: 10px;

 }

/******************************************************************************
 * The layer just below the header, that presents the navigation toolbar
 ******************************************************************************/

 #navigation {

     background: url(images/gradient.jpg);
     position: relative;
     height: 25px;
     width: 700px;
     margin-left: auto;
     margin-right: auto;
     font-size: 8pt;
     text-align: left;
 }
 
 #navigation ul { padding: 0px; margin: 0px; padding-top: 4px; }
 #navigation li { display: inline; padding: 4px; }
 #navigation li.current { color: #E36B00; font-weight: bold; }
 #navigation a { color: #000000; text-decoration:none; }

/******************************************************************************
 * Page number formatting
 * for the default theme most other properties are inherited from the the
 * navigation layer that this layers exists inside
 ******************************************************************************/

 #pagenumbers {
     position: absolute;
     top: 0px;
     right: 0px;
     font-size: 7pt;
 }

 #pagenumbers a { font-weight: bold; }
 #pagenumbers li { padding: 2px; }

/******************************************************************************
 * The main layer where all the content appears. Objects are displayed 
 * inside this in their own layers so that they can look different depending
 * on the OBJECT TYPE
 ******************************************************************************/

 #content {

     position: relative;
     background-color: #FFE79E;
     font-family: Verdana, Arial, Sans-Serif;
     font-size: 8pt;
     width: 698px;
     margin-right: auto;
     margin-left: auto;
     border: thin solid #FB5E00;
     text-align: left;

 }

 #content img { border: 0px; }
 #content a { text-decoration: none; font-size: 8pt; color: #777777; }
 #content a:hover { text-decoration: underline; color: #000000; }
 #content table { margin-bottom: 10px; padding: 2px; margin-top: 10px; width: 100%; text-align: center; }
 #content h1, #content h2, #content h3, #content h4 { margin: 0px; padding: 0px; }
 #content h1, #content h2, #content h3, #content h4 { margin-left: 4px; }
 #content h1 { margin-top: 4px; }
 #content h1 { font-size: 9pt; color: #000000; }
 #content h2 { font-size: 8pt; color: #000000; }
 #content h3 { font-size: 6pt; color: #000000; }
 #content h4 { font-size: 6pt; color: #000000; }
 #content h1.search { text-align: center; font-size: 12pt; padding-top: 4px; }
 #content p { margin-left: 4px; }
 #content p.error { margin: 0px; font-size: 8pt; font-weight: bold; text-align: center; padding: 15px; }
 #content img.thumbnail { padding: 2px; border: solid thin #FB5E00; }
 
 #content input { font-size: 8pt; }
 #content input.button { font-weight: bold; background-image: url(images/button_background.jpg); padding: 2px; border-style: outset; }


/******************************************************************************
 * Object specific layer definitions
 ******************************************************************************/

 #image, #article, #document { padding: 4px; }

 #image { padding: 8px; }
 #image h1 { font-size: 12pt; }
 #image h2 { font-size: 10pt; }
 #image h3 { font-size: 8pt; margin-bottom: 10px; }
 #image img { border: thin solid #FB5E00; padding: 2px;}

 #article {

     color:       #000000;
     border:      none;
     font-family: Verdana, Arial, Sans-Serif;
     font-size:   10pt;
     padding:     5px;
     margin-top:  8px;
     margin-bottom: 8px;
 }

 #article h1 { margin: 0px; font-weight: bold; font-size: 12pt;  }
 #article h2 { margin: 0px; font-weight: bold; font-size: 10pt; padding-bottom: 4px; padding-top: 4px; }
 #article h3 { margin: 0px; font-size: 8pt; padding-bottom: 4px; padding-top: 4px; }

 #article a { text-decoration: none; font-weight: bold; color: #000000; }
 #article a:hover { text-decoration: underline; }

/******************************************************************************
 * The layer that presents the back, return and next buttons, this appears 
 * below the contents
 ******************************************************************************/

 #toolbox {

     background: url(images/gradient_reverse.jpg);
     position: relative;
     height: 25px;
     width: 700px;
     margin-left: auto;
     margin-right: auto;
	 
     font-family: Verdana, Arial, Sans-Serif;
     font-size: 8pt;
     font-weight: bold;
     text-align: center;

 }

 #toolbox ul { padding: 0px; margin: 0px; padding-top: 2px; }
 #toolbox li { display: inline; padding: 4px; }
 #toolbox a { color: #000000; text-decoration: none;}
 #toolbox a:hover { color: #000000; text-decoration: underline; }

/******************************************************************************
 * Footer layer, it contains all the copyright information etc
 ******************************************************************************/

 #footer {

     width: 700px;
     margin-left: auto;
     margin-right: auto;
     font-family: Verdana, Arial, Sans-Serif;
     font-size: 8pt;
     padding: 8px;
     text-align: left;
     position: relative;

 }

 #footer p { padding: 0px; margin: 0px; }

 #footer img.mozilla {

     position: absolute;
     top: 7px;
     right: 30px;
     border: 0px;
     width: 88px;
     height: 31px;

 }

 #footer a { color: #000000; font-weight: bold; text-decoration: none; }
 #footer a:hover { color: #000000; text-decoration: underline; }

/******************************************************************************
 * End of file
 ******************************************************************************/