/* Start of CMSMS style sheet 'Layout: CBC' */
/*****************************************************************************/
/* Common styles.                                                            */
/*****************************************************************************/

/*****************************************************************************/
/* General styles.                                                           */
/*****************************************************************************/
body
{
  margin:          0;
  padding:         0;
  border:          0;        /* This removes the border around the viewport in old versions of IE */

/*  width:           100%; */
  width: 97%;
  margin: 15px auto 0 auto;
  background: url(/uploads/images/icons/gradient.png) repeat-x #E2E8FF;

  min-width:       900px;
                             /* The min-width property does not work in old versions of Internet Explorer */
  font-family:     arial,sans-serif;
  font-size:       100.01%;
}
h1
{
  display:         none;
}
h1, h2, h3
{
  margin:          0.2em 0 0.2em 0;
  padding:         0;
  color:           #0000B5;
  clear:           both;
}
h1.flow, h2.flow, h3.flow
{
  clear:           none;
}
p
{
  margin:          0.4em 0 0.8em 0;
  padding:         0;
}
img
{
  margin:          0 1em 0.2em 1em;
  border:          none;
}
table
{
  font-size:       100%;
}
li
{
  padding:         0 0 0.5em 0;
}
.img-shadow
{
  float:           left;
  background:      url(uploads/images/icons/shadowAlpha.png) no-repeat bottom right !important;
  background:      url(uploads/images/icons/shadow.gif) no-repeat bottom right;
  margin:          10px 0 0 10px !important;
  margin:          10px 0 0 5px;
}
.img-shadow img
{
  display:         block;
  position:        relative;
  background:      #FFFFFF;
  border-right:    1px solid #a9a9a9;
  border-bottom:   1px solid #a9a9a9;
  margin:          -6px 6px 6px -6px;
  padding:         4px;
}
.warning
{
  font-weight:     bold;
  color:           #FF0000;
}

/*****************************************************************************/
/* Pre-header styles.                                                        */
/*****************************************************************************/
#header #statictext
{
  padding: 0 1em 0 1em;
  position: relative;
  font-size: 90%;
  background:      #FFFFFF;
}
#header #statictext #left
{
  float: left;
  position: relative;
  top: 0.25em;
}
#header #statictext #right
{
  float: right;
  position: relative;
}
#header #statictext a
{
  color:           #000000;
  text-decoration: none;
}
#header #statictext a:hover
{
  color:           #000000;
  text-decoration: underline;
}

/*****************************************************************************/
/* Text resizer styles.                                                      */
/*****************************************************************************/
#aaa span#large
{
  font-size: 1.0em;
}
#aaa span#medium
{
  font-size: 0.8em;
}
#aaa span#small
{
  font-size: 0.6em;
}

/*****************************************************************************/
/* Search styles.                                                            */
/*****************************************************************************/
div#search
{
  float:           right;
  width:           27em;
  text-align:      right;
  padding:         0.5em 0 0.2em 0;
  margin:          0 1em;
  font-size:       70%;
}
input.search-input
{
  border:          1px solid #000000;
}
input.search-button
{
  margin-left:     0.5em;
  border:          1px solid #000000;
  background:      #E2E8FF;
  cursor:          pointer;
}

/*****************************************************************************/
/* Header styles.                                                            */
/*****************************************************************************/
#header
{
  clear:           both;
  float:           left;
  width:           100%;
  background:      #FFFFFF;
  margin-top:      5px;
}
#header
{
  border-bottom:   3px solid #0000FF;
}
#header #banner
{
  border-top:      3px solid #0000FF;
}
#header #banner #name
{
  margin-top:      0.75em;
  margin-left:     20px;
  float:           left;
}
#header #banner #logo
{
  margin-top:      0.25em;
  margin-right:    20px;
  float:           right;
}

/*****************************************************************************/
/* Breadcrumb styles.                                                        */
/*****************************************************************************/
div.breadcrumbs
{
  padding:         1em 0em 1em 1em;
  font-size:       70%;
  margin:          0 0 0 0;
}
div.breadcrumbs span.lastitem
{
  font-weight:     bold;
}

/*****************************************************************************/
/* Column container.                                                         */
/*****************************************************************************/
.colmask
{
  position:        relative; /* This fixes the IE7 overflow hidden bug and stops the layout jumping out of place */
  clear:           both;
  float:           left;
  width:           100%;     /* width of whole page */
  overflow:        hidden;   /* This chops off any overhanging divs */
}

/*****************************************************************************/
/* 3-column layout.                                                          */
/*                                                                           */
/* -  0.5em padding at the left and right of every column.                   */
/* -  Left column is 12em wide (incl. padding).                              */
/* -  Right column is 20em wide (incl. padding).                             */
/* -  Centre column is variable width.                                       */
/*                                                                           */
/* .5em, 11em, .5em    .5em, variable, .5em   .5em, 19em, .5em               */
/*                                                                           */
/*****************************************************************************/
.threecol
{
  background:      #FFFFFF;  /* Right column background colour */
}
.threecol .colmid
{
  float:           left;
  width:           200%;
  margin-left:     -20em;    /* Width of right column (incl. left + right padding) */
  position:        relative;
  right:           100%;
  background:      #FFFFFF;  /* Centre column background colour */
}
.threecol .colleft
{
  float:           left;
  width:           100%;
  margin-left:     -50%;
  position:        relative;
  left:            32em;     /* Left column width + right column width (incl. all padding) */
  background:      #FFFFFF;  /* Left column background colour */
}
.threecol .col1wrap
{
  float:           left;
  width:           50%;
  position:        relative;
  right:           12em;     /* Width of left column (incl. left + right padding) */
  padding-bottom:  1em;      /* Centre column bottom padding. Leave it out if it's zero */
}
.threecol .col1              /* CENTRE column */
{
  margin:          0 20.5em 0 12.5em;
                             /* Centre column side padding:
                                  Right padding = right column width + centre column right padding width
                                  Left padding = left column width + centre column left padding width  */
  position:        relative;
  left:            200%;
  overflow:        hidden;
}
.threecol .col2              /* LEFT column */
{
  float:           left;
  float:           right;    /* This overrides the float: left above */
  width:           11em;     /* Width of left column content (left column width minus left and right padding) */
  position:        relative;
  right:           0.5em;    /* Width of the left-had side padding on the left column */
}
.threecol .col3              /* RIGHT column */
{
  float:           left;
  float:           right;    /* This overrides the float: left above */
  width:           19em;     /* Width of right column content (right column width minus left and right padding) */
  margin-right:    1.5em;    /* Width of right column right-hand padding + left column left and right padding */
  position:        relative;
  left:            50%;
}

/*****************************************************************************/
/* Left and right columns to have smaller text.                              */
/*****************************************************************************/
.col2 p     { font-size: 80%; }
.col3 p     { font-size: 80%; }
.col2 table { font-size: 80%; }
.col3 table { font-size: 80%; }

/*****************************************************************************/
/* Menu styles.                                                              */
/*****************************************************************************/
#menuwrapper ul
{
  margin:          0;
  padding:         0;
  list-style-type: none;
}
#menuwrapper li
{
  margin:          0.25em 0 0.25em 0;
  padding:         0;
}
#menuwrapper ul li.menutop
{
  padding-left:    40px;
  padding-top:     10px;
  padding-bottom:  10px;
  margin:          0;
}
#menuwrapper ul li.menutop li
{
  padding-left:    0.6em;
  list-style-image:url(uploads/images/icons/icon_bullet.png);
  list-style-position: outside;
}
#menuwrapper ul li.menutop li ul li
{
  list-style-image:url(uploads/images/icons/icon_bullet_l3.png);
}
#menuwrapper li.separator
{
  display:         none;
}

#menuwrapper a
{
  display:         block;
  color:           #000000;
  text-decoration: none;
  border:          1px solid #E2E8FF;
  padding-left:    0.5em;
}
* html #menuwrapper a
{
  display:         inline;
  padding-left:    0;
}
#menuwrapper a:hover
{
  color:           #000000;
  text-decoration: underline;
  background:      #B0B0FF;
  border:          1px solid #333333;
}
#menuwrapper a.menutop
{
  display:         block;
  margin-bottom:   0.5em;
}

#menuwrapper li.mpage-home
{
  background:      url(uploads/images/icons/icon_home_36.png) 0 0 no-repeat;
}
#menuwrapper li.mpage-who-we-are
{
  background:      url(uploads/images/icons/icon_cross_36.png) 0 0 no-repeat;
}
#menuwrapper li.mpage-what-we-do
{
  background:      url(uploads/images/icons/icon_participate_36.png) 0 0 no-repeat;
}
#menuwrapper li.mpage-calendar
{
  background:      url(uploads/images/icons/icon_calendar_36.png) 0 0 no-repeat;
}
#menuwrapper li.mpage-contact
{
  background:      url(uploads/images/icons/icon_email_36.png) 0 0 no-repeat;
}
#menuwrapper li.mpage-members
{
  background:      url(uploads/images/icons/icon_cbc_36.png) 0 0 no-repeat;
}

/*****************************************************************************/
/* Footer styles.                                                            */
/*****************************************************************************/
#footer
{
  clear:           both;
  float:           left;
  width:           100%;
  border-top:      1px solid #000000;
}

#footer p
{
  padding:         2em;
  margin:          0;
}

#footer #strip
{
  width:           100%;
  min-width:       750px;
  height:          80px;
  padding:         5px 0 0 0;
  background:      url(uploads/images/address_strip.png) left top no-repeat #000000;
  text-align:      center;
  position:        relative;
  clear:           both;
  display:         block;
  font-size:       0.8em;
}

/*****************************************************************************/
/* Box styles.                                                               */
/*****************************************************************************/
.BoxItem
{
  margin:          0.5em 0 0.5em 0;
}
.BoxItemTitle
{
  background:      url(uploads/images/icons/icon_corner_36.png) no-repeat #000000;
  color:           #FFFFFF;
  font-weight:     bold;
  padding:         0.5em 1em 0.5em 1em;
  border-bottom:   3px solid #0000FF;
}
.BoxItemContent
{
  background:      #E2E8FF;
  color:           #000000;
  padding:         0.5em 1em 0.5em 1em;
}
.BoxItem td
{
  vertical-align:  top;
}
.BoxItemContent hr
{
  position:        static;
}

/*****************************************************************************/
/*                                                                           */
/* Home-page-specific styles.                                                */
/*                                                                           */
/*****************************************************************************/

.Sermons ul
{
  margin:          0;
  padding:         0;
  list-style-type: none;
}
.Sermons li
{
  list-style:      none;
}

#footer #images img
{
  width:           5em;
  height:          5em;
  margin-left:     0.5em;
  border:          0.25em solid #000000;
}

/*****************************************************************************/
/*                                                                           */
/* Member-specific styles.                                                   */
/*                                                                           */
/*****************************************************************************/
.members .member
{
  margin:          0 0 1em 0;
}
.members .member .name
{
  font-weight:     bold;
}
.members .member img
{
  float:           left;
  width:           100px;
  height:          100px;
}

/* For 9 Marks.  Can be removed after February 12th 2010 */

table#marks
{
  width: 100%;
}

tr.field th
{
  text-align: left;
  width: 15%
}

tr.field td
{
  width: 85%;
}

tr.field td input
{
  width: 100%;
}
/* End of 'Layout: CBC' */