/* -----------------------------------*/
/* --- Style sheet for homepage javascripts ------*/
/* -----------------------------------*/


/* -----------------------------------*/
/* ------->>> IMAGE SLIDER <<<--------*/
/* -----------------------------------*/
a img{
   border: none;
}

#imageSlider{
   margin: 0;
   padding: 0;
   height: 122px;
   width: 1000px;
   background: url(/slider/slider-bg-rpt.gif) repeat-x;
   clear:both;
}
#isLeftBtn{
   width: 27px;
   height: 122px;
   float: left;
}
#sliderMask{
   float: left;
   height: 122px;
   width: 946px;
   overflow: hidden;
   position: relative;
}
#isRightBtn{
   width: 27px;
   height: 122px;
   float: left;
}
#isLeftBtn a{
   display: block;
   width: 100%;
   height: 100%;
   background: url(/slider/slider-left-btn.gif) no-repeat;
   text-indent: -5000px;
   overflow: hidden;
   outline: none;
}

#isRightBtn a{
   display: block;
   width: 100%;
   height: 100%;
   background: url(/slider/slider-right-btn.gif) no-repeat;
   text-indent: -5000px;
   overflow: hidden;
   outline: none;
}


#imagesToSlide{
   width: 5000px;
}
#isLeftBtn a:hover, #isRightBtn a:hover{
   background-position: top right;
}


a.kids 	{display: block;
				overflow: hidden;
				height: 0px;
				background-repeat: no-repeat;
				width: 181px;
				padding-top: 118px;
				background-image: url(/slider/kids2.gif);
}



   /*
   
   you might have to adjust the padding and margins here
   depending on how you cut out your images
   
   each image needs to take up 236 px of horizontal space (4 images X 988px(width of the mask))
   
   */
#imagesToSlide a{
   display: block;
   float: left;
   margin-top: 2px;
   margin-left: 24px;
   margin-right: 24px;
}

/* -----------------------------------*/
/* -------->>> IMAGE FADER <<<--------*/
/* -----------------------------------*/
#headerFader{
   position: relative;
   width: 745px;
   height: 300px;
   padding: 3px;
   border: solid 2px #ccc;
}
#headerIndex{
   margin: 0;
   padding: 0;
   position: absolute;
   z-index: 10;
   top: 3px;
   right: 3px;
   height: 19px;
}

#headerIndex .key{
   display: block;
   width: 19px;
   height: 19px;
   text-indent: -9000px;
   overflow: hidden;
   background: url(/images/header-key.gif) top right no-repeat;
   float: left;
   outline: none;
}

#headerIndex .activeKey{
   background-position: left;  
}

a.fadeImage{
   display: block;
   position: absolute;
}

/* -----------------------------------*/
/* ------------->>> TABS <<<----------*/
/* -----------------------------------*/

#tabSection{
   width: 988px;
   
}
#tabButtons{
   height: 49px;
   position: relative;
}
a.tabBtn{
   display: block;
   float: left;
   width: 322px;
   height: 49px;
   text-indent: -9000px;
   overflow: hidden;
   outline: none;
}

#tabButtons a.activeTab{
   background-position: top left;
}
a.lastTab{
   float: right;
}
a.tabBtnCurrent{
   background: url(/images/tab-sunday.jpg) top right;
}
a.tabBtnNewToSugarCreek{
   background: url(/images/tab-new.jpg) top right;
}
a.tabBtnUpcoming{
   background: url(/images/tab-news.jpg) top right;
}
#tabContent{
   background: url(/images/tab-content-bgv.jpg) repeat-x;
   line-height:1em;
   height: 300px;
   padding: 20px;
   a.link: text-decoration:none;
   a.hover: color:#660000 
   ul.font-family: Verdana, Arial, Helvetica, sans-serif;
	ul.font-size: 12px;
	ul.font-style: normal;
	line-height: 1em;
	ul.color: #00CC33;
ul.background-color: #CCCCCC;
ul.text-indent: 5px;
	list-style-position: outside;
	list-style-type: square;
}

a:link {
color: #000066;    /*#760e10 */
 text-decoration: none;
}
a:visited {
 text-decoration: none;
}
a:active {
  text-decoration: none;
}
a:hover {
 text-decoration:underline;
}

/* -----------------------------------*/
/* -------->>> HEADLINE LOOP <<<------*/
/* -----------------------------------*/

#headlineLoop{
   width: 994px;
   height: 29px;
   border: solid 2px #ccc;
   padding: 2px;
}
#headLineBody{
   /* border: solid 2px #ccc; */
   padding: 2px;
   height: 21px;
}
#headlineLoop span{
   color: #6c4d30;
   font-weight: bold;
   line-height: 21px;
   font-family: Arial, "MS Trebuchet", sans-serif;
   font-size: 15px;
   padding-left: 2px;
   float: left;
   margin-right: 10px;
}
#headlineLoopContent{
   float: left;
   height: 21px;
   position: relative;
   overflow: hidden;
   width: 750px;
}
   
#headlineLoopContent ul{
   list-style: none;
   margin: 0;
   padding: 0;
   position: absolute;
   top: 0;
   width: 700px;
   z-index: 10;
}

#headlineLoopContent ul li{
   color: #6c4d30;
   line-height: 21px;
   font-family: Arial, "MS Trebuchet", sans-serif;
   font-size: 15px;
}

#headlineLoopContent ul li a{
   color: #6c4d30;
   line-height: 21px;
   font-family: Arial, "MS Trebuchet", sans-serif;
   font-size: 15px;
   text-decoration: none;
}

#headlineLoopContent ul li a:hover{
   text-decoration: underline;
}


