body { 
	background:#FBF7FA ;
	width:98%;
}

.bigger {    /* to enlarge the font on the whole page*/
font-size:150%;
}


.thinborder {
	clear:both;
	border-bottom: 1px #990066 solid;
}

.lightborder {
      border:gray thin solid;
}

.thinline {
      height:1px;
      width:65%;
      color:#666;
      position:relative; 
      left:-15%;
}

h1 { 
	display:inline;
	font-weight:lighter;
	font-size:1.5em; 
}

h2 {
	font-weight:bold;
	font-size:1.4em; 
}


h3, h4 {
        margin-top:0;
        padding-top:0;
        margin-bottom:0;
        padding-bottom:0;
	font-weight:bold;
}

h3 {
	font-size:1.2em; 
}

h4 {
	font-size:1.1em; 
        margin-bottom:-0.5em;
}

#topofpage { /* top of page anchor is outside the weblog area */
	font-family:verdana,helvetica,arial,sans serif;
	font-size:0.7em; 
	position:relative;   /* relative to the horizontal line at the foot of the page */
	top:-1em;
	left:20%;
	text-decoration:none;
        color:#0561A5;
}

/* ######## STYLES FOR THE WEBLOG AREA ############*/

#weblog_container {   /* see IE css */
	float:left;
	font-family:verdana,helvetica,arial,sans serif;
	font-size:0.8em; 
        padding-bottom:3em;
}
.weblog_container_normal {   
	width:73%;
	padding-left:3em;
	padding-top:1.7em;
}

.weblog_container_narrower {   /* when user switches to big text */
	width:62%;
	padding-left:2em;
	padding-top:1.2em;
}

#weblog_container h1 ,
#weblog_container h2 ,
#weblog_container h3 ,
#weblog_container h4 ,
#weblog_container p ,
 {
        padding:0;
        margin-top:0;
        margin-bottom:0.5em;
}

#weblog_container ul {
        margin-top:0;
        margin-bottom:0.5em;
}


#weblog_container a {
/* 	font-size:0.8em;  */
	text-decoration:none;
}

#weblog_container li a,
#weblog_container p a { /*anchor in <p> */
	font-size:1em; 
	text-decoration:none;
        color:#0561A5;
}

#weblog_container p a:visited {
        color:navy;
}

#weblog_container p a:hover{ 
border-bottom:thin #0561A5 solid;
}

#weblog_container p a:active { 
       color:red;
}


#weblog_container .portrait_right , 
#weblog_container .landscape_right {   /* for photos at right  */
	float:right;
	margin:0.5em 0 0.5em 5%;
}

#weblog_container .portrait_left, 
#weblog_container .landscape_left {   /* for photos at left  */
	float:left;
	margin:0.5em 5% 0.5em 0;
}

#weblog_container .portrait_right , 
#weblog_container .portrait_left {
	width:20%;
}

#weblog_container .landscape_right, 
#weblog_container .landscape_left {   
	width:28%;
}

#weblog_container .landscape_left img, 
#weblog_container .landscape_right img ,
#weblog_container .portrait_right img ,
#weblog_container .portrait_left img
{
	width:100%;
}

#weblog_container .picture_caption {
	font-size:0.8em;
	margin-top:-0.1em;
	width:100%;
}


#weblog_container td p {
	margin-bottom:0;
}

/* ### FOR TinyMCE fields within weblog_container because tinyMCE inserts unwanted spacing to P */
#weblog_container .tinyMCE ul,
#weblog_container .tinyMCE ol,
#weblog_container .tinyMCE p,
#weblog_container .tinyMCE h4 {
margin-top:0 !important;
margin-bottom:0 !important;
padding-top:0 !important;
padding-bottom:0 !important;
}



/* ######## STYLES FOR HEADER ############*/

#logo_container {
	float:left; 
	width:6em;
	margin-right:2em;
	margin-left:2.2em;
	margin-top:0.1em;
	margin-bottom:1em;
	width:85px;
	height:100px;
	background:url(http://www.stmaryswarwick.org.uk/images/uploads/stmarys_logo_small.gif) no-repeat;
}
#stmary_logo {
}
#header_text {   /* see IE css */
  position:absolute;
  left:20%;
width:80%;
}

.header_text_normal {
  top:3em; }
.header_text_bigtext {
  top:1em; }

/* ######## STYLES FOR THE MENUBAR ############*/

#menu_container {    /* see IE css */
	float:left;
	width: 12em;
	padding-top:1em;
	font-family:verdana,helvetica,arial,sans serif;
	font-size:0.8em;
}


#menu_container a {
	margin-left: 0;
	display: block;
	text-align: left;
	font-size: 0.85em;
	text-decoration: none;
	padding-left: 3px;
	padding-bottom: 0;
	padding-right: 0;
	padding-top: 0;
	position:relative; /* for flyout menus */
	z-index:1000;

}

#menu_container a:link {
	color:white;
	background-color: transparent;
}

#menu_container a:visited {
	color:#ddd;
	background-color:#6F4545;
}

#menu_container a:focus {
	color:white;
	background-color: transparent;
}

#menu_container a:hover {
	color:white;
	background-color: #5E9EB7;
}

#menu_container a:active {
	color:red;
	background-color: white;
}

#current_page {
  background:url(images/menu_pointer.gif) no-repeat right;
}

/* ####### The following are to give the fly-out menus ####### */

/* remove all the bullets, borders and padding from the default list styling */
#menu_container ul {
	padding-left:0;
	margin-left:0;
	width:12em;                                                        /* 100%; */
}

/* position relative so that you can position the sub levels */
#menu_container li {     /* see IE css */
	position:relative;
	list-style-type: none;
	display:block;
 	background:#990066;
	margin:0 0 1px 1em;
	padding-bottom:0;
	padding-top:0; 
	width:100%; /* otherwise IE increases the height of the item */
	border :  1px solid #906;
}

/* get rid of the table - i.e. it takes no space (otherwise it introduces spaces between the menu items to the left) */
#menu_container	table {
       position:absolute; 
	top:0; 
	left:0; 
	z-index:100; 
	font-size:1em;
}

/* hide the sub levels and give them a position absolute so that they take up no room */
#menu_container ul ul {
	visibility:hidden;
	position:absolute;
	top:0;
	left:11.2em;                                 /*   94% ; */
}
/* make the second level visible when hover on first level list OR link  i.e. when hovering over a UL within .MENU, make the next UL visible*/
#menu_container ul :hover ul{
	visibility:visible;
}
