/*************************************************************
 * description: css for all media types
 *************************************************************/
@media screen,projection {
   /* reset
    * based on Eric Meyer's reset.css
    * http://meyerweb.com/
    *************************************************************/
   body, div, span, applet, object, iframe,
   h1, h2, h3, h4, h5, h6, p, blockquote, pre,
   a, abbr, acronym, address, big, cite, code,
   del, dfn, em, font, img, ins, kbd, q, s, samp,
   small, strike, strong, sub, sup, tt, var,
   b, u, i, center,
   dl, dt, dd, ol, ul, li,
   fieldset, form, label, legend, button,
   table, caption, tbody, tfoot {
       margin: 0;
       padding: 0;
       border: 0;
       outline: 0;
       font-size: 100%;
       vertical-align: baseline;
       background: transparent;
   }
   body { line-height: 1; }
   ol, ul { list-style: none; }
   blockquote, q { quotes: none; }
   /* remember to define focus styles! */
   :focus { outline: 0; }
   
   /* remember to highlight inserts somehow! */
   ins { text-decoration: none; }
   del { text-decoration: line-through; }
   
   /* tables still need 'cellspacing="0"' in the markup */
   table {
       border-collapse: collapse;
       border-spacing: 0;
   }
   /* /reset
    *****************************************************/
   
   /* global elements
    *****************************************************/
   html { height: 100%; }
   body {
       background: #eeede7 url(../images2010/bg-content.png) repeat 50% 0;
       color: #463d3c;
       font: 14px/1.5 "Droid Sans", Arial, sans-serif;
       height: 100%;
   }
   a { text-decoration: none; }
   a:hover { text-decoration: underline; }
   
   /* /global elements
    *****************************************************/
   
   /* common elements
    *****************************************************/
   .cols, form .item, form .button { overflow: hidden; }
   .col { float: left; }
   .l { float: left; }
   .r { float: right; }
   .print { display: none; }
   .ir {
       display: block;
       overflow: hidden;
       position: relative;
   }
   .ir span {
       cursor: pointer;
       left: 0;
       height: 100%;
       position: absolute;
       top: 0;
       width: 100%;
   }
   
   th {height: auto; margin: 0 0 0 0; padding: 2px;}
   
   
   /* /common elements
    *****************************************************/
   
   /* base layout
    *****************************************************/
   .wrap {
      width: 960px;
      min-height: 100%;
	height: auto !important;
	height: 100%;
      margin: 0 auto -82px; /* the bottom margin is the negative value of the footer's height */
   }
   #header {
      background: #53463e url(../images2010/bg-header2.png) repeat 50% 0;
      border-bottom: 1px solid #b4b2a9;
      height: 127px;
   }
   #content {
      background: #eeede7 url(../images2010/bg-content.png) repeat 50% 0;
      padding: 0px 0;
   }
   #primary {
      float: left;
      padding: 15px;
      width: 550px;
   }
   #secondary {
      float: right;
      padding: 15px 15px 0 0;
      width: 360px;
   }
   #footer {
      font-size: 12px;
      background: url(../images2010/bg-footer.png) repeat-x bottom;
      
   }
   /* /base layout
    *****************************************************/
   
   /* branding elements
    *****************************************************/
   #site {
      display: inline;
      float: left;
      height: 65px;
      margin: 26px 0 0 11px;
      width: 311px;
   }
   #site a {
      background: transparent url(../images2010/logo-northrock-church.jpg) no-repeat 0 0;
      display: block;
      height: 100%;
      text-indent: -1000em;
      width: 100%;
   }
   /* /branding elements
    *****************************************************/
   
   /* nav elements
    *****************************************************/
   #main-menu {
      float: right;
      font: 16px/1 "Trebuchet MS", Arial, sans-serif;
      margin: 50px 0px 0 0;
      text-transform: uppercase;
      font-weight: 100;
      z-index: 100;
   }
   #main-menu li {
      display: inline;
      float: left;
      margin: 0 0px 0 0;
   }
   #main-menu a {
      color: #f0efe9;
   }
   /* /nav elements
    *****************************************************/
   
   /* content elements
    *****************************************************/
   .sub #content .bg {
      background: transparent url(../images2010/bg-content-inner.png) no-repeat 50% 0;
      margin: -18px 0 0;
      padding: 23px 0 0;
   }
   .sub #content .wrap {
      overflow: hidden;
   }
   
   #banner {
   	float: left;
   	width: 629px;
   	padding: 0 0 0 0;
   	margin: 0 0 0 0;
   	z-index: 10;}
   	
   #featured {
      background: #d0cfc1 url(../images2010/bg-featured.png) repeat 50% 0;
      overflow: hidden;
      z-index: 10;
      
   }
   #featured img {
      float: left;
   }
   #featured ul.main {
      float: right;
      width: 311px;
   }
   #featured ul.main li {
      background: transparent url(../images2010/bg-featured-list-item.png) repeat-x 0 0;
      min-height: 135px;
      padding: 8px 6px 6px;

   }
   #featured ul.main li.first {
      background: none;
      padding: 6px 6px 14px 6px;
   }
   
      #featured ul.main li.middle {
      padding: 30px 6px 14px 6px;
      min-height: 85px;
   	}
   	
   	#featured ul.main li.highlighted {
      padding: 20px 6px 6px 6px;
      min-height: 85px;
   	}
   
   #featured h2 {
      color: #b23615;
      font-size: 24px;
      font-weight: normal;
      line-height: 26px;
   }
   #featured .highlighted p {
      background: #b23615;
      color: #e1e0da;
      margin: 5px -6px 0;
      padding: 6px;
   }
   #featured .highlighted a {
      color: #e1e0da
   }
   #content a {
      color: #463d3c;
      text-decoration: underline;
   }
   #content a:hover {
      text-decoration: none;
   }
   #primary h1 {
      color: #b23615;
      font-size: 34px;
      font-weight: normal;
      margin: 0 0 -0.589em;
   }
   #primary h2 {
      color: #4d504f;
      font-size: 20px;
      font-weight: normal;
      margin: 1.05em 0 .35em;
   }
   #primary p {
      margin: 0 0 1em;
   }
   #primary ul {
      margin: 0 0 1em 1.5em;
      list-style: disc;
   }
   .widecontent h3 {margin: 0 0 0 0;}
   .widecontent td {height: auto;}
   
   .mediatable {margin: 0 0 30px 0; width: 650px;}
   
   .mediatable a:hover {
		text-decoration: underline;
		}
		
		.mediatable h3 {
		padding: 0;
		margin: 0;
		}
		
		.mediatable td {
		border-bottom: 1px #444 solid;
		padding: 5px 0;
		}
		
		.mediatable th {
		padding: 0 0 6px 0;
		border-bottom: 2px #444 solid;
		}
		
		#maincontentdiv table {
		padding: 0 0 10px 0;
		}
		
		.mediatable .listen {
		width: 90px;
		}
		
		
   
   /* /content elements
    *****************************************************/
    
    #volunteer .volcontent {
    	background: #d0cfc1;
    	padding: 25px;
    	}
    
    #volunteer h2 {
    	color: #d0cfc1;
    	background: #b23615;
      text-decoration: none;
      padding: 10px;
    	cursor: pointer;}
    
   
   /* footer elements
    *****************************************************/
.push {
height: 0px;
margin-top: 0px;
}

   #footer .wrap {
      min-height: 43px;
      padding: 6px 0 50px;
      position: relative;
      
   }
   #footer ul {
      overflow: visible;
   }
   #footer li {
      display: inline;
      float: left;
      margin: 0 6px 20px 0px;
      width: 316px;

	}
	
	#footer li:last-child {
		margin-right: 0px;
		}
		
		
		
   #footer li a {
      display: block;
      height: 100%;
      width: 100%;
   }

   #footer p {
      bottom: 20px;
      position: absolute;
   }
   #copyright {
      left: 6px;
   }
   #site-by {
      right: 6px;
      text-align: right;
   }
   #site-by a {
      color: #463d3c;
      font-weight: bold;
   }
   /* /footer elements
    *****************************************************/
}
@media print {
    body {
        color: #000;
        font: 12pt/1.5 Verdana,sans-serif;
    }
    a { color: #000; }
    #mainMenu, #secondary { display: none; }
    #siteName { font-size: 120%; }
    .print { display: block; }
}



/***** Global Classes *****/

.clear 			{ clear:both; }

.float-left 	{ float:left; }
.float-right 	{ float:right; }

.text-left 		{ text-align:left; }
.text-right 	{ text-align:right; }
.text-center 	{ text-align:center; }
.text-justify 	{ text-align:justify; }

.bold 			{ font-weight:bold; }
.italic 		{ font-style:italic; }
.underline 		{ border-bottom:1px solid; }
.highlight 		{ background:#ffc; }

.wrap 			{ width:960px;margin:0 auto; }

.img-left 		{ float:left;margin:4px 10px 4px 0; }
.img-right 		{ float:right;margin:4px 0 4px 10px; }

.nopadding 		{ padding:0; }
.noindent 		{ margin-left:0;padding-left:0; }
.nobullet 		{ list-style:none;list-style-image:none; }
