/* Stylesheet for Central Oregon Bend Boys and Girls Club */

/* Reset */
html, 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,
fieldset, form, label, legend,
caption {
    margin:0;
    padding:0;
    outline:0;
    font-size:100%;
    vertical-align:baseline;
    border:0;
}

header, footer, section, nav, article {display:block;}
body {font:normal normal 13px verdana, Arial, Helvetica, sans-serif; color:#000;}
body.pixelsilk {text-align:center; padding:0px; background:#E9F6FB;}

p {margin: 0 0 0.75em 0;}
a img {border: 0;}
hr {height: 1px; color: #000; background-color: #000; border: 0;}
object {outline: none;}
sub {font-size: 10px; vertical-align: sub;}
sup {font-size: 10px; vertical-align: super;}

a, a:link, a:visited {color: #0090c1; text-decoration: underline; outline: none;}
a:active, a:hover, a:focus {color: #0090c1; text-decoration: none; outline: none;}
a[name] {color: #000; text-decoration: none;}

/* Setup the Sprites */
.spriteTheme {background-image:url('/bgcco-sprite-theme.png'); background-repeat:no-repeat;}
.spriteThemeHoriz {background-image:url('/bgcco-sprite-horz.png'); background-repeat:repeat-x;}


/* Heading Styles */
h1, h2, h3, h4, h5 {margin: 0 0 15px 0; font-weight: normal; color: #d40000;}
h1 {font-size: 25px; color:#8eb525;} /* 2em */
h2 {font-size: 20px;}
h3 {font-size: 18px;}
h4 {font-size: 16px;}
h5 {font-size: 14px;}

h1 span{color: #34353B; font-size: 16px;}

p span.colorRed{color: #D40000; font-size: 17px;}

.headingBgs{ padding:2px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
-khtml-border-radius: 5px;
 border-radius: 5px;
  color:#fff;
}
span.brown{background:#D09A0F;}
span.green{background:#ACC42A;}
span.blue{background:#00AEEF;}
span.red{background:#EE3033;}
span.pink{background:#F17192;}
span.purple{background:#5A4099;}

.groupHeading{margin:10px 0;}

/* Image alignment/spacing classes */
img.alignleft {margin: 5px 20px 20px 0; float: left;}
img.alignright {margin: 5px 0 20px 20px; float: right;}

/* Theme Styles */
#theme {position: relative; margin: 0 auto; text-align: left; width: 100%; background-position:0 -367px; z-index: 2; min-height: 235px;}
#theme .inner{width:1044px; margin:0 auto; height:auto; position:relative; z-index:1;}

/* Header styles */
#header {position: relative; margin: 0 auto; width: 100%; height: 108px; z-index: 100;}
#header .spacer{height:23px;}
#logo {position: absolute; left: 40px; top: 37px; width: 110px; height: 60px; z-index: 200;}
#phoneWrapper{width:157px; height:50px; position: absolute; z-index:200; top:0px; right:135px;}
#phoneNumber{width:157px; height:25px; background:#cecece; text-align:center;}
#phoneNumber p{color:#000; font-size:12px; margin:0px; padding:5px 0 1px;}
#phoneNumber h2{color:#000; font-size:19px; margin:0px; padding:0px; font-weight:bold;}

/* Search box/form */
#search {position: absolute; right: 40px; top: 51px; width: 169px; height: 28px; background-position: -130px 0;}
.txtSearch {position: absolute; left: 35px; top: 3px; width: 125px; margin: 0; padding: 0 !important; height: 21px; font-size: 12px; color: #fff; line-height: 21px; border-width: 0 !important; background:none;}
.btnSearch {position: absolute; left: 8px; top: 6px; width: 20px; height: 16px; background-color: transparent; border:none; background-position: -110px 0;}

/* Menu styles */
.navEnds{float:left; width:7px; height:85px;}
.navEnds.left{background-position: 0 -60px; width: 6px;}
.navEnds.right{background-position: -7px -60px;}
#siteMenu {z-index: 100; float:left; background-position:0 0; width:1031px; height:82px;}
ul#topMenu {list-style: none; margin: 0 0 0 170px; padding: 0; width:650px; border-left: 1px solid #AED4E0; height: 82px;}
ul#topMenu li {display: inline; float: left; position: relative; height: 82px; line-height: 82px; color:#fff; font-size:19px; z-index: 100;}
ul#topMenu li a, ul#topMenu li a:link, ul#topMenu li a:visited {display: block; padding: 0 20px; height: 82px; line-height: 82px; color: #fff; text-decoration: none;}
ul#topMenu>li:hover, ul#topMenu>li:active {}
ul#topMenu li a:hover, ul#topMenu li a:active {color: #fff; }
ul#topMenu li.current a {color: #fff;}
ul#topMenu li.separator {width:1px; height:25px; margin:30px 0 0 0; background:#AED4E0;}
div#subNavigation {display: none;}

ul#topMenu>li.currentFade {background-image:url('/bgcco-sprite-horz.png'); background-repeat:repeat-x; background-position:0 -82px;}
ul#topMenu>li.current {background-image:url('/bgcco-sprite-horz.png'); background-repeat:repeat-x; background-position:0 -82px;}

/* Submenu styles */
ul#topMenu li ul {display: none; position:absolute; left: 0; top: 82px; list-style: none; margin:0; padding:0; min-width:200px; text-align: left; /* Match UL 'left' attribute below */ background:#37a6cc;
opacity:0.9; filter:alpha(opacity=90);}
ul#topMenu li ul * {list-style-position:outside;}
ul#topMenu li ul li {position:relative; height: auto; margin:0; padding:0; width: 325px;}
ul#topMenu li ul li a, ul#topMenu li ul li a:link, ul#topMenu li ul li a:visited {border-top: 1px solid #0693C2; display:block; padding: 0 25px; height:auto; line-height: 42px; color:#fff; font-size: 19px; text-decoration: none; white-space: nowrap; text-align: left;}
ul#topMenu li ul li a:hover, ul#topMenu li ul li a:active, ul#topMenu li ul li a:focus {text-decoration: none; color: #fedc68;}
ul#topMenu li ul li.separator {}
ul#topMenu li ul li ul {position:absolute; top:0; left:325px; width: auto; min-width: 325px; /* Match UL width above */}
ul#topMenu li ul li ul li {}
ul#topMenu li ul li ul li a {white-space: nowrap;}

span.menu-sub-indicator {float:right;}

/* Main content area styles */
#content {margin: 0 auto; width: 1044px; text-align: left; background:#fff;}
#mainColumn{padding:20px 30px 20px 20px; width:650px; float:left;}


/* Homepage-specific styles */
#homeSlideShowWrapper{width:100%; height:345px; position:relative; z-index:1;}
#homeSlideShow{width:1022px; height:345px; margin:0 auto; position:relative; z-index:2; overflow:hidden; background:url("/town-bg.jpg") no-repeat scroll 0 122px transparent;}
#homeSlideShowbackground{width: 100%; position: absolute; z-index: 0; bottom: 0; left:0px; height: 158px;}
#homeSlideShowbackground .leftBg{background: none repeat scroll 0 0 #ACCE4B; float: left; height: 88px; margin-top: 70px; width: 45%;}
#homeSlideShowbackground .rightBg{width: 50%; float: right; height: 158px; background: none repeat scroll 0pt 0pt rgb(153, 205, 54);}
.slides{width:1022px; height:308px; background:none !important; position:absolute; bottom:0px; right:0px; z-index:2; padding-top: 37px;}
.slides .slideImg{float: right;}
.slidesTxt{left:65px;position:absolute;top:60px;width:205px; display:none;}
.slidesTxt h2{font-size:20px; line-height:20px;}
.slidesTxt p{font-size:14px;margin:0;}

#nav-1{position:absolute; bottom:35px; left:460px; z-index:11;}
#nav-1 a{display:block; width:15px; height:15px; border:1px solid #779652; margin:0 3px; background:#dce9cd; color:#dce9cd; font-size:1px; overflow:hidden; float:left;}
#nav-1 a:hover{background:#fff; color:#fff;}
#nav-1 a.activeSlide{background:#fff; color:#fff;}

#newsBar{display:block; width:1022px; height:38px; background-position:0 -164px; float:left;}
.newsBarEndLeft{float:left; display:block; width:7px; height:38px; background-position: -14px -60px;}
.newsBarEndRight{float:left; display:block; width:5px; height:38px; background-position: -23px -60px;}
#newsBar span{display:block; float:left; width:1px; background:#d3a919; height:13px; margin:13px 10px 0 0;}
#newsBar h3{display: block; float: left; line-height: 38px; font-size: 17px; font-weight: normal; margin: 0px; padding:0 12px 0 25px; width: 128px;}
#newsBar h3 a{color:#d40000; text-decoration:none;}
#newsBar p, #newsBar p a{color:#4d4d4d; font-size: 12px; line-height: 38px; float: left; margin: 0px; display: block; text-decoration:none;}

.homeContentArea{float: right; width: 525px;}

#socialArea{width:176px; height:54px; position:absolute; z-index:90; top: 105px; right:30px; padding: 8px 0 0 23px;}
#socialAreaBg{background:#fff; position:absolute; z-index:90; top:0; left:0; height:62px; width:199px;
opacity: 0.5; filter:alpha(opacity=50);
-moz-border-radius: 0 0 5px 5px;
-webkit-border-radius: 0 0 5px 5px;
-khtml-border-radius: 0 0 5px 5px;
border-radius: 0 0 5px 5px;
}
#socialArea a{display:block; float:left; margin:0 10px 0 0; width:45px; height:46px; position: relative; z-index: 210;}
#socialArea a.youtube{background-position:-110px -29px;}
#socialArea a.twitter{background-position:-155px -29px;}
#socialArea a.facebook{background-position:-200px -29px;}

/* Second Column Styles */
#secondColumn{float:right; width:320px; min-height:320px; padding:10px;}

/* (Flash) Header H1 text */

/* Subpage styles */
#breadcrumbs {margin: 5px 0 0 19px; font-size: 10px;}
#breadcrumbs a {font-size: 10px; color: #000;}
#breadcrumbs .separator {padding: 0 3px; font-size: 12px;}

/* Lower Link styles */
#lowerLinks{height:80px; margin:30px 0;}
#lowerLinks ul{margin:0px; padding:0px;}
#lowerLinks ul li{list-style-type:none; float:left; margin-right:10px;}

/* Footer styles */
#footer {position: relative; text-align: left; width: 100%; clear: both; z-index: 10;}
#footer {font-size: 12px; line-height: 25px; background:#444;}

#preFooter{height:152px; background-position:0 -201px; padding-top: 15px;}
#preFooter h3{color:#fff;}
#preFooter h3 span{color:#ACCE4B; font-size: 21px;}
#footerAddresses{}
 #footerAddresses ul{list-style-type:none; float:left; margin:0 25px 0 0; padding:0px; width:165px; border-right:1px solid #9cbb44;}
 #footerAddresses ul.last{margin:0; border:none;}
#footerAddresses ul li{color: #FFFFFF; line-height: 21px;}
#faceBookArea{float: left; height: 25px; overflow: hidden; width: 48px; margin: 0 10px 0 0;}
#sponsors{float:right;}
#subFooter{height:24px; background:#3995b3;}

#footerLeft {float: left; margin: 0; width: 450px; height: 24px; line-height: 24px; color: #fff; font-size: 12px;}
#footerLeft a, #footerLeft a:link, #footerLeft a:visited{color:#fff; text-decoration:underline;} 
#footerLeft a:hover, #footerLeft a:active { text-decoration:none;}
#smartzLink {float: right; width: 340px; height: 24px; text-align: right; color: #7a562e; font-size: 10px; line-height: 24px;}
#smartzLink a, #smartzLink a:link, #smartzLink a:visited {font-size: 10px; text-decoration: none; color: #b4d7e3; line-height: 24px;}
#smartzLink a:hover, #smartzLink a:active {font-size: 10px; text-decoration: none; color: #b4d7e3;}
#smartzLink a img {padding-top: expression(3 + "px"); vertical-align: middle; text-decoration: none;}

/* Social Styles */
#addThisButton{}

/* General form styles */
.editForm div {clear: both; margin: 0 0 10px 0;}
.editForm label {display: block; margin: 0 10px 0 0;}
.editForm span {display: inline-block; width: 60%; vertical-align: top;}
.editForm span input[type=text] {width: 60%;}
.required {font-weight: bold;}
.editForm span > p {display: block; width: 49%; float: left; line-height: normal; margin: 0 0 7px 0; padding: 0; white-space: nowrap;}
.editForm textarea {width: 100%; height: 150px;}
.editForm fieldset {clear: both; float: left; margin: 0 0 10px 0; width: 100%; height: 300px; border: 1px #ccc solid;}
.editForm fieldset .inner {padding: 5px 10px 0 10px; height: 273px !important; overflow: auto;}
.editForm legend {margin: 0 0 0 10px;}
.editForm .radioGroup span {display: block; width: 369px; line-height: normal; margin: 0; padding: 0;}
.editForm .radioGroup span label{display: inline-block; width: 88%;}

/* General admin form items style */
.divEditBlock div {margin: 0 0 20px;}
.divEditBlock label {background: none repeat scroll 0 0 #CCCCCC; color: #000000; display: block; font-weight: bold; line-height: 18px; margin: 0 0 10px; padding: 0 10px;}
.divEditBlock input, .divEditBlock textarea {width: 300px;}
.divEditBlock .submit {width:auto;}

/* Misc form field styles */
.width100 > input {width: 100px;}
.width150 > input {width: 150px;}
.width200 > input {width: 200px;}
.width300 > input {width: 300px;}

/* General List Item styles */
.listItem {clear: both; margin: 0 0 20px 0;}
.listItemImage {float: left; margin: 0 15px 15px 0;}
#listItemImage {float: left; margin: 0 20px 15px 0;}

/* Article styles */
.articleItem {clear: both; margin: 0 0 20px 0;}
.articleItemTitle {margin: 0 0 5px 0;}
.articleItemDate {font-style: italic;}
.articleItemImage {float: left; margin: 0 15px 15px 0;}
.articleItemBody {}
#articleDate {margin: 0 0 15px 0; font-style: italic;}
#articleImage {float: left; margin: 0 20px 15px 0;}

/* Staff styles */
.staffItem {float: left; margin: 0 40px 30px 0; width: 40%;}
.staffImage {float: left; margin: 0 20px 20px 0;}
.staffItemName {font-weight: bold;}
.staffItemTitle {font-style: italic;}
#staffDetailImage {float: left; margin: 0 20px 20px 0;}
#staffDetailBody {}
#staffName {}
#staffJobTitle {}

/* Default Gallery Styles */
p.desc{display:none;}
#photoLargeImage{margin: 0 auto 10px; width: 400px; height: 370px;}
#photoItems{margin: 0 auto; width: 600px;}
.photoItem{float: left; width: 110px; margin: 5px;}
.photoItem .title{overflow: auto; height: 40px;}
#imageDescription{margin:0 auto 10px; width:400px; height:55px; overflow: auto;}
.photoItemDescription{display:none;}

/* Enhanced Photo gallery styles
#photoLargeImage {position:relative; width:665px; height:500px; text-align:center;}
#photoLargeImage img {margin: 0 auto;}
#photoItems {margin: 20px 0 10px 0;}
.photoItem {float:left; margin:0 15px 15px 0; width: 110px; cursor:pointer; position:relative; text-align: center;}
#photoItems img {position:relative; z-index:10;}
#photoItems a img:hover {opacity:0.85;}
#photoImageTitle {position: relative; height: 24px;}
#photoImageDescription {position: relative; height: 35px;}
.photoItemTitle {display: none;}
.photoItemDescription {display: none;}
.loading {background-image:url('/loadingIcon.gif'); background-repeat:no-repeat; background-position: center 33%;} */

/* Basic events styles */
.eventList {}
.eventListItems {}
.eventListItems h2 a {}
.eventItemDate {}
.eventItemLocation {}
#eventDetail {}
#eventDetail h1 {}
#eventDetailDate {}
#eventDuration {}

/* Event calendar styles */
.calendarList {}
.calendarListItems {float: left; width: 231px;}
.calendarListItems h2 a {font-size: 16px;}
#caledarDetail {}
#caledarDetail h1 {}
#calendarDetailDate {}
#calendarImage {float: right; margin: 0 0 10px 20px;}
.calendarPicker {float: left; display: inline; margin: 0 0 0 -22px; width: 285px} /* Flash calendar */

/* Pagination */
.pagination {display: block; margin: 0; text-align: right;}
.pagination ul {list-style: none; margin: 0; padding: 0;}
.pagination ul li {margin: 0; padding: 0; font-size: 10px; display: inline;}
.pagination ul li a, .pagination ul li a:link, .pagination ul li a:visited {font-size: 10px; padding: 0 3px; line-height: 18px; text-decoration: none;}
.pagination ul li a:hover, .pagination ul li a:active {font-size: 10px; padding: 0 3px; line-height: 18px; text-decoration: none; font-weight: bold;}
.pagination ul li.current {margin: 0; padding: 0 3px; font-size: 10px; display: inline; line-height: 18px; font-weight: bold;}
.pagination ul li.previous a, .pagination ul li.previous a:link, .pagination ul li.previous a:visited {font-family: Tahoma, Geneva, sans-serif; font-size: 16px; padding: 0 5px 0 0; line-height: 18px; text-decoration: none;}
.pagination ul li.previous a:hover, .pagination ul li.previous a:active {font-family: Tahoma, Geneva, sans-serif; font-size: 16px; padding: 0 5px 0 0; line-height: 18px; text-decoration: none; font-weight: bold;}
.pagination ul li.next a, .pagination ul li.next a:link, .pagination ul li.next a:visited {font-family: Tahoma, Geneva, sans-serif; font-size: 16px; padding: 0 0 0 5px; line-height: 18px; text-decoration: none;}
.pagination ul li.next a:hover, .pagination ul li.next a:active {font-family: Tahoma, Geneva, sans-serif; font-size: 16px; padding: 0 0 0 5px; line-height: 18px; text-decoration: none; font-weight: bold;}

/* Misc styles */
.clear {clear: both; float:none !important;}
.hidden {display: none;}
.divAddControl {margin: 25px 0 0 0;}
.divEditDeleteControls {margin: 25px 0 0 0;}
.errorMsg, .error {color: #cc0000;text-decoration:none;}
.briefDesError{display:block;}
span.error {color: #cc0000; width:125px}
label.error {margin: 0 0 0 5px; color: #cc0000;}
#cse-search-results iframe {width: 450px;}
.PayPalDonateImage {background-image:url("/onlinedonation2.gif");background-repeat:no-repeat; widht:161px; height:51px;}
#PayPal{display:block; width:161px; height:51px;}

#locationsMap {margin: 0 auto 20px; width: 600px; height: 500px; color:#000;}
.locationBox {width: 50%; float: left;}

/* Content Editor Styles */
.floatLeft {float:left;}
.floatRight {float:right;}
.noMargin {margin:0;}
.noPadding {padding:0;}
.replaceVideo{display:block;}

/* Donation Form Styles */
.donateBox h3{color:#000;}
#donateOptions{}
#donateOptions .donateBox{width:300px; float:left; margin:0 0 10px 10px;}
.pixelsilkTrialFormArea{}
.pixelsilkTrialFormArea > div, .pixelsilkTrialFormArea fieldset > div {float:left; width:300px; margin: 0 20px 10px 0;}
.pixelsilkTrialFormArea .briefDes {width: 95%;}
.pixelsilkTrialFormArea .city{width: 220px;}
.pixelsilkTrialFormArea .state{width: 220px;}
.pixelsilkTrialFormArea .zip{width: 140px;}
.pixelsilkTrialFormArea label {display: block; margin: 0 10px 0 0; width:100%;}
.pixelsilkTrialFormArea input[type=text] {width: 100%;}
.pixelsilkTrialFormArea .required {font-weight: bold;}
.pixelsilkTrialFormArea span > p {display: block; width: 49%; float: left; line-height: normal; margin: 0 0 7px 0; padding: 0; white-space: nowrap;}
.pixelsilkTrialFormArea textarea {width: 100%; height: 150px;}
.pixelsilkTrialFormArea fieldset {clear: both; float: left; margin: 0 0 10px 0; width: 100%; border: 1px #ccc solid; height:auto; padding: 10px;}
.pixelsilkTrialFormArea fieldset .inner {padding: 5px 10px 0 10px; height: 273px; overflow: auto;}
.pixelsilkTrialFormArea .securityCode{width: 162px;}
.pixelsilkTrialFormArea #expiration{margin: 0; padding: 0; width: 135px;}
.pixelsilkTrialFormArea #expiration div{float: left; height: 50px; width: 50px;}
.pixelsilkTrialFormArea #expiration label{padding: 0;}
.pixelsilkTrialFormArea #expiration .inner{height: auto;}
.pixelsilkTrialFormArea legend {margin: 0 0 0 10px;}
#PaymentAmount{width: 210px;}
#amountRadios label{display: inline;}
#amountRadios{width: 100%;}
