/*
 * Copyright (c) 2003 - 2007 OpenSubsystems s.r.o. Slovak Republic. All rights reserved.
 * 
 * Project: OpenSubsystems
 * 
 * $Id: fancywebsite.css,v 1.2 2007/01/07 06:14:08 bastafidli Exp $
 * 
 * This program is free software; you can redistribute it and/or modify
 * it under the terms of the GNU General Public License as published by
 * the Free Software Foundation; version 2 of the License. 
 * 
 * This program is distributed in the hope that it will be useful,
 * but WITHOUT ANY WARRANTY; without even the implied warranty of
 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
 * GNU General Public License for more details.
 * 
 * You should have received a copy of the GNU General Public License
 * along with this program; if not, write to the Free Software
 * Foundation, Inc., 59 Temple Place, Suite 330, Boston, MA  02111-1307  USA 
 */

/*
 * CSS file containign fancy look and feel and layout for the generic website 
 * layout. The look and feel specified in this file for classes of elements 
 * can be customized in individual pages by specifying CSS style for the IDs 
 * of the elements.
 *
 * This file can be applied on top of basicwebsite.css to provide more 
 * attractive look and feel.
 *
 * @version $Id: fancywebsite.css,v 1.2 2007/01/07 06:14:08 bastafidli Exp $
 * @author Miro Halas
 * @code.reviewer Miro Halas
 * @code.reviewed 1.5 2006/04/19 14:20:39 bastafidli
 */

/* HTML body tag. Change its color so it is not ugly white when some portion 
   of the page is loading */
#htmlbody {
   color: White;
   background-color: #0A246A; 
}

/* DIV covering entire HTML body should have image making it look
   like it is rounded. */
#wholepage {
   color: White;
   background-color: #0A246A; 
   background-image: url(/core/images/topedgebg.gif);
   background-repeat: repeat-x;
   background-position: top;   
}

/* DIV representing header of the website. Since it contains
   tabbed toolbar make it fixed height so the toolbar touches 
   it bottom portion. The border will make it look 3D.
   I want to specify color here for the whole content area so I use
   margin instead of padding to get the border around body. */
#header {
   height: 40px;

   margin-left: 5px;
   margin-right: 5px;
   padding-left: 0px;
   padding-right: 0px;

   border-bottom: 1px solid White;
}

#logo {
   position: relative;
   float: left;
   width: 110px;
   font: normal normal normal 24px "Bitstream Vera Sans", Geneva, Arial, Helvetica, sans-serif;
   
   top: 2px;
   padding-left: 5px;
}

#logohighlight {
   color: #00ccff;
}

#logonormal {
   color: white;
}

/* DIV representing body (betwen header and footer) of the website. 
   I want to specify color here for the whole content area so I use
   margin instead of padding to get the border around body.
   I want to have white border around it to make it look 3D together 
   with toolbar. */
#body {
   margin-left: 5px;
   margin-right: 5px;
   padding-left: 0px;
   padding-right: 0px;

   border-left: 1px solid White;
   border-bottom: 1px solid #999999;
   border-right: 1px solid #999999;

   color: Black;
   background-color: #99CCFF;
}
/* For Mozilla the Z index must be specified to overlap over 
   the footer since otherwise the bottom edge wouldn't be visible */
div > #body {
  z-index: 100;
}

/* DIV representing footer of the website. 
   It should have image making it look like it is rounded */
#footer {
   padding-top: 3px;
   padding-left: 5px;
   padding-bottom: 7px;
   padding-right: 5px;

   background-image: url(/core/images/bottomedgebg.gif);
   background-repeat: repeat-x;
   background-position: bottom;   
   color: White;

   text-align: left;
}
/* For Mozilla this will compensate for the one 1px border on the body */
div > #footer {
   z-index: 99;

   margin-top: -1px;
}
/* Since the body has dark color any hyperlink in it must be white */
#footer a {
   color: White;
}