/***********************************************************************/
/* Defines the body and the box containing the content of the web site */
/***********************************************************************/

/* Sets the body of the page so that thre is a grey background and aligns
 everything central*/
body
    {
	 font-family: Georgia, "Times New Roman", Times, serif;
	 font-size: 1.0em;
	 color: rgb(75,102,102);
	 background-color: rgb(197,204,204);
	 margin: 10px 0px;
	 text-align: center;
    }

/* Creates a large white rectangel in the middle of the page to put all the
 content in */
#pageContent
    {
     width: 830px;
     position: relative;
     margin: auto;
     color: rgb(75,102,102);
     background-color: rgb(255,255,255);
     border: 1px solid rgb(75,102,102);
     text-align: left;
     display: block;
    }

/***************************************************************************/





/******************************************************************************/
/* Defines the heading styles and the header block at the top of the web site */
/******************************************************************************/

#header
     {
      margin: 0;
      padding: 0px;
      background: url(http://www.sigweb.org/ht07/images/header.jpg) no-repeat center;
      width: 830px;
	 height: 165px;
      display: block;
     }

/***************************************************************************/




/***************************************************************/
/* Defines the location guide that sits at the top of the page */
/***************************************************************/

/* creates a grey box where the hanko and page title will go */
#location
    {
     height: 1.5em;
     display: block;
     margin: 0px;
     padding: 0px;
     color: rgb(75,102,102);
     background-color: rgb(53,69,74);
    }

 .locationPlace,  .locationTitle
    {
     margin: 0px;
     margin-left: 10px;
     padding: 0px;
     color: rgb(219,222,224);
     background-color: rgb(53,69,74);
     font-size: 0.8em;
    }
    
 .locationTitle
     {font-weight: bold;}
     
/* the link text should be dark with no text decroation */
.locationPlace a
    {
     margin: 0px;
     padding: 0px;
     text-decoration: none;
     color: rgb(219,222,224);
     background-color: rgb(53,69,74);
     border-bottom: 0;
    }

/* links that are hovered over should change colour */
.locationPlace a:hover
    {
     color: rgb(192,48,0);
     background-color: rgb(53,69,74);
     text-decoration: none;
     border-bottom: 0;
    }


/***************************************************************/






/****************************************************************/
/* Defines the navigation menu that sits at the top of the page */
/****************************************************************/

/* a wrapper to put the navigation menu in. */
#navigationMenuWrapper
    {
     height: 1.1em;
     padding: 0px;
     margin: 0px;
     background-color: rgb(53,69,74);
    }


/* the navigation menu is a list which we want to be inline and have
   no bullet points */
#navigationMenu
    {
     height: 1.1em;
     padding: 0px;
     margin: 0px;
     list-style: none;
     display: inline;
     background-color: rgb(53,69,74);
    }

/* The list elements of the navigation menu that contain the links.  These
   should be in one long line and have a dark background to match the header */
#navigationMenu li
    {
     height: 1.1em;
     font-size: 1.0em;
     float: left;
     margin-top: 0px;
     border: 0px;
     padding: 0px;
     font-weight: bold;
     background-color: rgb(53,69,74);
     text-decoration: none;
     display: block;
    }

/* the link text should be dark with no text decroation */
#navigationMenu a
    {
     margin: 0px;
     padding: 0px 13px;
     text-decoration: none;
     color: rgb(219,222,224);
     background-color: rgb(53,69,74);
     border-bottom: 0;
    }

/* links that are hovered over should change colour */
#navigationMenu a:hover
    {
     color: rgb(192,48,0);
     background-color: rgb(53,69,74);
     text-decoration: none;
     border-bottom: 0;
    }

/* changes the selected link so it has a white background and different coloured text
   The link is discovered by putting an id sttribute in the body tag eg <body id=section-home> */
body#section-home #navigationMenu li#home a,
body#section-news #navigationMenu li#news a,
body#section-call #navigationMenu li#call a,
body#section-submission #navigationMenu li#submission a,
body#section-programme #navigationMenu li#programme a,
body#section-information #navigationMenu li#information a
    {
     color: rgb(192,48,0);
     font-weight: bold;
     background: rgb(255,255,255);

    }
/***************************************************************************/






/***************************************************************************/
/* Defines the Sub navigation menu that sits just below the top navigation */
/***************************************************************************/

/* a wrapper to put the navigation menu in. */
.navigationSubMenuWrapper
    {
     clear: both;
     margin-bottom: 10px;
     padding-bottom: 6px;
     padding-left: 20px;
     letter-spacing: 0em;
     font-size: 0.9em;
     font-weight: bold;
    }

/* Creates a wrapper for the navigation sub menu box and defines the text style */
#navigationSubMenu
    {
     padding: 0px;
     margin: 0px;
     list-style: none;
     display: inline;
     float: left;
    }

/* The list elements of the navigation menu that contain the links.  These
   should be in one long line and have a dark background to match the header */
#navigationSubMenu li
    {
     float: left;
     margin-top: 10px;
     border: 0px;
     border-left: 1px solid rgb(53,69,74);
     padding: 5px;
     padding-left: 10px;
     padding-right: 10px;
     text-decoration: none;
    }


#navigationSubMenu li.endNavigationItem
    {border: 0px;}

.selectedSubMenu a
    {
     background: rgb(255,255,255);
     color: rgb(53,69,74);
      border-bottom: 1px solid rgb(255,255,255);
      font-weight: bold;

    }
    
.nonSelectedSubMenu a
    {
     color: rgb(192,48,0);
     background-color: transparent;
     border-bottom: 1px dotted rgb(192,48,0);
     font-weight: bold;
    }
/***************************************************************************/








/**************************************************************************/
/* DEFINES THE HOW THE MAIN CONTENT OF THE PAGE SHOULD LOOK.  HERE WE ARE */
/* MAINLY OVERRIDING THE STANDARD TAGS USED IN XHTML                      */
/**************************************************************************/

/* A wrapper for themain content of the page, complete with text alignment and borders */
#mainContent
    {
     margin: auto;
     padding: 10px 10px 10px 10px;
     font-size: 0.9em;
     text-align: justify;
     color: rgb(75,102,102);
     background-color: rgb(255,255,255);
     display: block;
    }



/* Defines how the anchors should look, both before being clicked and when hovered over */
a
    {
     color: rgb(192,48,0);
     background-color: transparent;
     text-decoration: none;
     margin-bottom: 1px;
     border-bottom: 1px dotted rgb(192,48,0);
    }

a:hover
    {border-bottom: 1px solid;}





/* Defines how an image should look */
img
    {border: 0px;}

img.leftimage
    {
     vertical-align: top;
     float: left;
     margin-top:5px;
     margin-bottom:5px;
     margin-right:15px;
     text-decoration: none;
    }

img.rightimage
     {
      vertical-align: top;
      float: right;
      margin-top:5px;
      margin-bottom:5px;
      margin-left:15px;
      margin-right:15px;
      text-decoration: none;
     }

.centreimage
     {
      vertical-align: top;
      margin-top:5px;
      margin-bottom:5px;
      margin-left:15px;
      margin-right:15px;
      text-decoration: none;
      display: block;
     }

.centreimage p
     {text-align:center;}





/* defines the text for heading styles 1,2 and 3 */
h1, h2, h3
    {
     font-family: Georgia, "Times New Roman", Times, serif;
     text-align: left;
     color: rgb(53,69,74);
     }

/* heading one is used ith the header hox.  It sits to the right of the header */
h1
    {font-size: 2.0em;}


/* h2 and h3 are used with text.  this just defines their sizes */
h2
    {font-size: 1.5em;}

h3
    {
     font-size: 1.2em;
     font-style:italic;
     }



/*Defines the definition list layout */
dt
    {font-weight: bold;}

dl
    {padding-left: 20px;}





/************************************************************/
/* Defines the how the main content of the page should look */
/************************************************************/

/* Creates a padded area to improve layout of the content.
   These areas typically have no content and act as a way
   of "cleaning" up the layout. */
.cleaner, .halfCleaner, .quarterCleaner
     {
	 height: 4em;
	 border: none;
	 margin: 0;
	 padding:  0;
	 background: transparent;
	}

.halfCleaner
     {height: 2em;}

.quarterCleaner
     {height: 1em;}
     


/* Some areas have specific content.  Here we define
   the divisions with the document and create a suitable
   layout for the content held within */
.hotels, .schedule
    {
     padding: 0px;
     padding-left: 20px;
     padding-bottom: 20px;
     margin: auto;
     display: block;
     }

.fieldsetWrapper
     {
	 float: left;
	 margin: auto;
	 padding: 0px;
	 width: 500px;
	}

.paperCategories
    {
     padding: 0px;
     padding-left: 20px;
     padding-bottom: 20px;
     margin: auto;
     display: block;
     }

.committee
    {
     padding: 0px;
     padding-left: 20px;
     padding-bottom: 20px;
     margin: auto;
     display: block;
     }

/************************************************************/






/* ================================================================== */
/*  DEFINES THE LAYOUT FOR THE RIGHT FLOATING SECTION MENU            */
/* ================================================================== */
#right
     {
	 float: right;
	 margin-top: 35px;
      margin-right: 5px;
      margin-left: 20px;
      margin-bottom: 5px;
	 padding: 0px;
	 width: 245px;
	}

#right div.sectionBar,	div.left div.sectionBar
     {
	 background-color: rgb(53,69,74);
	 background-repeat: no-repeat;
	 border-right: 1px solid rgb(53,69,74);
	 border-bottom: 1px solid rgb(53,69,74);
	 display: block;
	 padding: 1px;
     }

#right div.sectionBar p, div.right div.sectionBar p
     {
	 color: rgb(219,222,224);
	 font-weight: bold;
	 font-style: italic;
	 font-size: 0.9em;
	 margin: 0 0 0 0;
	 padding: 0;
	 vertical-align: middle;
	 text-align: center;
     }

#right div.sectionBar p a, div.right div.sectionBar p a
     {
	 color: #ffffff;
	 text-decoration: none;
	}

#right div.sectionNavigation, div.right div.sectionNavigation
     {
	 border: none;
	 margin: 1px 0 0 0;
	 padding: 0;
	}

#right div.sectionNavigation ul,	div.right div.sectionNavigation ul 
     {
	 margin: 0;
	 padding: 0;
	 font-size: 0.9em;
	}

#right div.sectionNavigation ul li, div.right div.sectionNavigation ul li 
     {
	 border-top: 0;
	 border-right: 1px solid #999999;
	 border-bottom: 1px solid #999999;
	 border-left: 1px solid #999999;
	 color: rgb(192,48,0);
	 list-style: none;
	 margin: 0;
	 padding: 4px 4px 5px 4px;
	 text-align: right;
	}
	
#right div.sectionNavigation ul li a,	div.right div.sectionNavigation ul li a 
     {text-decoration: none;}

#right div.sectionNavigation ul li a:hover, div.right div.sectionNavigation ul li a:hover
     {color: rgb(192,48,0);}

.sectionMenuItem
     {color: rgb(192,48,0);}

a.sponsorLogo
     {border: 0px;}

a:link.sectionMenuItem, a:visited.sectionMenuItem
     {color: rgb(192,48,0);}

a:hover.sectionMenuItem, a:active.sectionMenuItem
     {color: rgb(192,48,0);}

/* ================================================================== */



/* ================================================================== */
/*  DEFINES THE LAYOUT FOR THE FOOTER
/* ================================================================== */

#footer 
     {
	 border-top: 1px solid #999999;
	 font-size: 0.6em;
	 margin: auto;
	 padding: 5px;
      bottom: 0;
	 width: 810px;
	 display: block;
	 text-align: left;
      clear: right;
     }

#footer div.navigation
     {
	 text-align: left;
	 margin: 0;
	 padding: 6px 0 6px 6px;
	}

#footer div.navigation p 
     {
	 margin-top: 3px;
	 margin-bottom: 8px;
	}

#footer div.pagestatus 
     {
	 border-top: 1px solid #999999;
	 margin-bottom: 5px;
	 padding: 6px 5px 10px 6px;
	 text-align: right;
	}

#footer div.pagestatus p 
     {
      margin-top: 3px;
 	 margin-bottom: 0px;
	}





/* ================================================================== */
/*  DEFINES THE LAYOUT FOR THE SUBMISSION AND FEES TABLES
/* ================================================================== */

.tableWrapper
    {
     text-align: center; 
     position: relative;
     display: block;
     width: 530px;
    }


table
     {
      border-spacing:1px;
      background:#E7E7E7;
      color: rgb(75,102,102);
      margin: 0 auto;
     }

caption
     {
      border:#666666;
      border-bottom:2px solid #666666;
      text-transform:uppercase;
      padding:10px;
      font-style:italic;
      font-weight:bold;
      margin: 0 auto;
     }

td, th
     {
      padding-left:5px;
      padding-left:5px;
      padding-top:10px;
      padding-bottom:10px;
     }

thead th
     {
      text-align:center;
      background:#F5F5F5;
      color: rgb(53,69,74);
      border:1px solid #ffffff;

     }

tbody th
     {font-weight:bold;}

tbody tr
     {
      background:#EBF8FE;
      text-align:left;
     }

tbody tr.odd
     {
      background:#ffffff;
      border-top:1px solid #ffffff;
     }

tbody tr td
     {
      height:50px;
      background:#EBF8FE;
      border:1px solid #ffffff;
     }

tbody tr.odd td
     {
      background:#ffffff;
      border-top:1px solid #ffffff;
     }

tfoot th, tfoot td
     {
      padding:10px;
      text-align:center;
      font-weight:bold;
      border-bottom:3px solid #cccccc;
      border-top:1px solid #DFDFDF;
     }
/* ================================================================== */







/* ================================================================== */
/*  DEFINES THE STYLE OF TAGS THAT HIGHLIGHT IMPORTANT INFORMATION    */
/* ================================================================== */

/* Through the text are pices of information that are highlighted with a
   simple inline header and next to it the information.  
      eg Date: 4th May 2007.
   We want Date: to have a different style to draw attention to it.  These
   classes all represent pieces of such information and how to highlight 
   it */
.length, .submission, .notification, .camera, .age, .posted, .comments,
.name, .date, .time, .location, .address, .tel, .fax, .directions,
.price, .chair, .email, .institution, .url, .deadline, .title, .pages, .author,
.text, .additional, .notes
    {
     font-weight: bold;
    }


     
/* Makes additional information slightly paler so it is there but not predominant*/
.institutionLocation, .programme
     {font-style:italic;}

/* Makes closed dates look more pale */
.closed
     {font-style:italic;}

/* Hides text.  used primarily for accessibility */
.hide
     {
	 position: absolute;
	 left: 0px;
	 top: -500px;
 	 width: 1px;
 	 height: 1px;
     }

/* Highlights the Tagline of the confefnece */
p.tagline
    {     
     font-size: 1.2em;
     font-style:italic;
     text-align:center;
    }

.currency
     {font-style:italic; font-size: 0.8em;}


.pounds
    {font-size: 1.1em;}
/* ================================================================== */







/* ================================================================== */
/*  DEFINES THE STYLE FOR THE OVERLIB BOX THAT WILL SHOW THE LINKS    */
/*  THAT REFER TO THIS PAGE                                           */
/* ================================================================== */
#mainBox
    {
	 font-family: Georgia, "Times New Roman", Times, serif;
	 font-size: 1.0em;
	 color: rgb(75,102,102);
	 background-color: white;
	 margin: 10px 0px;
	 text-align: left;
	 border: 1px solid rgb(53,69,74);
	 width:450px;
    }

#boxTitle
     {
	 font-family: Georgia, "Times New Roman", Times, serif;
	 font-size: 1.0em;
	 color: white;
	 background-color: rgb(53,69,74);
	 margin: 0px 0px;
	 text-align: left;
	 padding-top:6px;
	 padding-bottom:6px;
     }

#linkList
     {
      margin-left:4px;
     }

#boxClose
     {right:0;position:absolute;margin:0;z-index:5000}

/* ================================================================== */

/* Makes quotations look slightly diferent */
.quote,
     {
       font-style:italic;
       color: rgb(202,216,216);
       font-weight:lighter;
     }