/*------------------------------------------------------------------
[Screen Stylesheet]

Project: Saint Joseph Academy - Catholic school in Adrian, Michigan
Version: 1.2
Last change:   08/06/08 [css image maps for tagline links]
Assigned to:   Karl Kasischke
Primary use:   Page Layouts - one, two & three column layouts
-------------------------------------------------------------------*/



/*------------------------------------------------------------------
[Table of contents]
A. Global Reset

B. Typography

C. Layout
   1. Body 
   2. Skip to content / #skip
   3. Layout wrapper / #wrapper
      3.1. Header / #header
         3.1.1. Logo / <h1> 
         3.1.2. Global navigation / #globalNav
      3.2. Banner / #banner
         3.2.1. Banner picture / #pic
         3.2.2. Search Box / #searchbox
         3.2.3. Video box / #vid
      3.3. Middle section / #middle     
         3.3.1. Primary column / #primeCol
            3.3.1.1. Breadcrumbs or Favorites / #breadcrumbs || #favorites
            3.3.1.2. Main content / #mainContent
            3.3.1.3. Secondary content / #secondContent
         3.3.2. Second column / #secondCol
            3.3.2.1. Sidebar / #sidebar
         3.3.3. Third column / #thirdCol
            3.3.3.1. Local Subnavigation / #subNav
      3.4. Footer / #footer
         3.4.1. Footer navigation / #footNav
         3.4.2. Copyright & information / #copy

D. sIFR

E. Sphider search results
-------------------------------------------------------------------*/



/*------------------------------------------------------------------
[Color codes]

#fff     white: (middle section background, global nav text)
#000     black: (page text)
#666     gray: (footer navigation text)
#369     blue: (links, breadcrumbs)
#0054a6  blue 2: (dotted borders)
#09416b  blue 3: (h2, go button background)
#6fa7d4  blue 4: (local subnav background, search background)
#c5dcee  blue 5: (local subnav li background)
#3e7eb1  blue 6: (global nav dropdown background)
#0c1f37  blue 7: (global nav background)
#86adce  blue 8: (favorites background)
#c5ddf3  light blue: (page background)
#ccddec  light blue 2: (breadcrumbs background)
#c8e6ff1  light blue 3: (banner pic border)
#fffec8  light yellow: (sidebar background, current local subnav li)
-------------------------------------------------------------------*/



/*------------------------------------------------------------------
A. GLOBAL RESET 
-------------------------------------------------------------------*/

body {font: 62.5%/1.4 arial,verdana,geneva,lucida,sans-serif; background: #fff; color: #000; margin: 0; padding: 0;}
p, h1, h2, h3, h4, h5, h6, /*fieldset,*/ form, label, input, textarea, /*legend,*/ dl, dt, dd, table, caption, th, td, blockquote, cite {margin: 0; padding: 0; font-size: 1em;}
ul, ol, li, ul *, ol *  {font-size: 1em;}

input, textarea {font-family: arial,verdana,geneva,lucida,sans-serif;}
textarea {overflow: auto;}
/*fieldset {border: solid 0 transparent;}*/
table {border-collapse: collapse;}
img {border: 0;}
acronym, abbr {border-bottom: 1px dotted; cursor: help;}
cite {font-style: normal;}
:focus {outline: 0;}

.nav, .dropdown, #subNav ul {margin: 0; padding: 0; list-style: none;}
.clear {clear: both;}
.left {float: left; display: inline;}
.right {float: right; display: inline;}
.center, .txt_center {text-align: center;}
.block {display: block;}

#footNav .nav li:last-child {border: none;}
ul.circle_blue {list-style-image: url(../images/circle_blue.gif); padding: 0px 0 1px 5px; margin-left: 10px; margin-top: 0px; list-style-type: none;}
ul.circle_blue li {padding-bottom: 8px;}
.txt_right, .back_top {text-align: right !important;}
.back_top a{font-weight: normal; text-align: right;}
fieldset {border: 3px double #7CA0C2; padding: 5px; margin-bottom: 10px;}
fieldset td, .theForm td {vertical-align: top;}
fieldset td input, fieldset td select, .theForm td input, .theForm td select  {margin-bottom: 5px;}
legend {font-size: 11px; color:#fff; background: #003D7E; padding: 4px; font-weight: bold; letter-spacing: 1px;}
.warning {font-size: 1.1em; color: #FF0033; font-weight: bold; }
.asterisk {color: #FF0033;}
.submit {border:  1px solid #003D7E; color: #003D7E; font-weight: bold; text-align: center; padding: 2px;}


/*------------------------------------------------------------------
B. TYPOGRAPHY  
-------------------------------------------------------------------*/
strong, .b {font-weight: bold;}
a, #breadcrumbs, #footNav .current a, #footNav a:hover {color: #369; text-decoration: none;}
a:hover {text-decoration: underline;}
#searchbox input {font-size: 12px;}
#goButton {font-weight: bold;}
#primeCol, #secondCol, #home #thirdCol {font-size: 1.2em;}
h2 {font-size: 1.5em; color: #09416b;}
#home h2 {font-size: 1.3333em; font-family: georgia,"times new roman",serif; text-transform: uppercase; color: #000;}
h3 {font-size: 1.25em;}
#home h4 {font-size: 1.1667em; text-transform: uppercase; margin: 0;}
#home #middle a {font-weight: bold;}
#breadcrumbs {font-size: 0.9167em; font-weight: bold;}
#globalNav a {color: #fff; font-size: 1.3em; font-weight: bold; text-decoration: none;}
#globalNav .dropdown a {font-size: 1.2em; color: #fff; font-weight: normal; text-decoration: none;}
.dropdown a:hover {} 
#subNav {font-size: 1.3em; font-weight: bold;}
#subNav {font-size: 1.2em; line-height: 1.75em;}
#subNav a {color: #000; text-decoration: none;}
#subNav .current a, #subNav h3 a, #subNav a:hover, #subNav .current .current a, #subNav .current li a:hover {color: #000;}
#subNav .current li a {color: #000;}
#footer {font-size: 1.1em;}
#footNav, #footNav a {font-weight: bold; color: #666;}




/*------------------------------------------------------------------
C. LAYOUT 
-------------------------------------------------------------------*/

/* 1. Body */
body {background: #c5ddf3 url(../images/body_bg.jpg) repeat-x top;}

/* 2. Skip to content */
#skip {position: absolute; top: -1000px;}

/* 3. Layout wrapper */
#wrapper {position: relative; left: 50%; margin-left: -473px; width: 946px;}

   /* 3.1. Header */
   #header {height: 134px; width: 100%; position: relative; z-index: 90;}

      /* 3.1.1. Logo */
      h1#top {height: 78px; width: 385px; background: url(../images/logo.gif) no-repeat; text-indent: -9000px; z-index:3; position: absolute; left: -8px; top: 0;}
      h1#top a {display: block; height: 78px; width: 385px; background: url(../images/logo.gif) no-repeat;}
      #tagline {height: 78px; width: 519px; background: url(../images/tagline.gif) no-repeat; position: absolute; left: 377px; top: 0;}
      #tagline a {display: block; height: 40px; position: absolute; top: 45px; text-indent: -9000px;}
      #tagline .montessori {width: 230px; left: 0;}
      #tagline .elementary {width: 162px; left: 232px;}
      #tagline .middle_school {width: 130px; left: 397px;}

      /* 3.1.2. Global navigation */
      #globalNav {width: 100%; margin-bottom: 12px; position: absolute; top: 92px;}
      #globalNav ul {background: #0c1f37; overflow: hidden;}
      #globalNav li {float: left;}
      #globalNav a {display: block; height: 30px; line-height: 30px; background: #0c1f37 url(../images/blue-arrow.gif) no-repeat 20px; padding-left: 32px; width: 130px; w\idth: 118px;}
      #globalNav a:hover, #globalNav .current {background-color: #3e7eb1;}    
      #globalNav li:hover a, #globalNav li.sfhover a {background-color: #3e7eb1;}

      #globalNav .our_school {width: 138px; w\idth: 106px;}
      #globalNav .our_school:hover, #globalNav .current .our_school {background-color: #3e7eb1;}
      #globalNav .admissions {width: 129px; w\idth: 97px;}
      #globalNav .admissions:hover, #globalNav .current .admissions {background-color: #3e7eb1;}
      #globalNav .news_calendar {width: 169px; w\idth: 137px;}
      #globalNav .news_calendar:hover, #globalNav .current .news_calendar {background-color: #3e7eb1;}
      #globalNav .current_families {width: 159px; w\idth: 127px;}
      #globalNav .current_families:hover, #globalNav .current .current_families {background-color: #3e7eb1;}
      #globalNav .giving {width: 95px; w\idth: 63px;}
      #globalNav .giving:hover, #globalNav .current .giving {background-color: #3e7eb1;}
      #globalNav .alumni {width: 114px; w\idth: 82px;}
      #globalNav .alumni:hover, #globalNav .current .alumni {background-color: #3e7eb1;}
      #globalNav .contact_us {width: 142px; w\idth: 96px; background-image: url(../images/phone.gif); padding-left: 46px;}
      #globalNav .contact_us:hover, #globalNav .current .contact_us {background-color: #3e7eb1;}

      .dropdown {position: absolute; width: 240px; left: -999em; background: #3e7eb1 url(../images/dropdown_bg.gif) no-repeat top left; filter:alpha(opacity=90); opacity: .90; -moz-opacity:.90; z-index: 99;}
      #globalNav .dropdown li {float: none; border-bottom: 1px solid #fff;}
      #globalNav .dropdown a {height: auto; width: 100%; margin: 0; background: none; text-indent: 0; border: 0; line-height: 1.4;}
      #globalNav .dropdown a:hover, #globalNav .dropdown .current a {background: #0c1f37;}
      #globalNav li:hover .dropdown, #globalNav li.sfhover .dropdown {left: auto;}

   /* 3.2. Banner */
   #banner {margin: 0 0 11px; clear: both; overflow: hidden; margin-bottom: 9px; position: relative; _height: 1%;}

      /* 3.2.1. Banner picture */
      #pic {float: left; display: inline; border: 9px solid #c8e6ff; width: 693px; height: 153px; w\idth: 675px; he\ight: 135px; overflow: hidden;}
      #home #pic {height: 245px; he\ight: 236px;}

      /* 3.2.2. Search Box */
      #searchbox {float: left; display: inline; background: #6fa7d4; margin-bottom: 15px; margin-left: 15px; padding: 8px 10px; width: 238px; w\idth: 218px; height: 38px; he\ight: 22px;}
      #searchbox input {border: 0; height: 22px; line-height: 22px; vertical-align: middle;}
      #query {width: 193px; background: #fff;}
      #goButton {cursor: pointer; width: 25px; background: #09416b; color: #fff;}

      /* 3.2.3. Video box */
      #vid {float: right; display: inline; border: 10px solid #fff; margin-left: 15px;}
      #vid a {display: block; width: 218px; height: 80px;}
      #home #vid a {height: 161px;}
      #home #watch {clear: right;}
      #home #watch a {float: right; display: block; width: 238px; height: 21px;}


   /* 3.3. Middle section */
   #middle {clear: both; overflow: hidden; width: 100%; background: #fff; border: 11px solid #fff; border-left: 0; border-right: 0; margin-top: 9px;}
   .threeCol #middle {background: #fff url(../images/3col_bg.gif) repeat-y;}
   #home.threeCol #middle {background-image: none;}

   h2, #home h3 {border-bottom: 1px dotted #0054a6; padding: 0 10px 3px; margin-bottom: 3px;}
   #home h2, #home h3 {padding: 0}
   #home h3 {padding-bottom: 8px; margin-bottom: 1em;}
   #home dl {border-bottom: 1px dotted #0054a6; padding-bottom: 1em; margin-bottom: 1.5em;}
   #home dt {margin-top: 1em;}

      /* 3.3.1. Primary column */
      #primeCol {float: left; display: inline; width: 50%;}
      #primeCol p, #primeCol ul {margin-bottom: 1.5em;}
      #primeCol img.left {margin: 0 25px 10px 0;}
      #primeCol img.right {margin: 0 0 10px 25px;}

      .oneCol #primeCol {float: none; width: 100%; margin: 0;}
      .twoCol #primeCol {float: left; width: 727px; margin-left: 209px;}
	  .threeCol #primeCol {float: left; width: 488px; margin-left: 209px;}
      #home.threeCol #primeCol {float: right; width: 277px; margin: 0 20px 0 63px;}
      
         /* 3.3.1.1. Breadcrumbs or Favorites */
         #breadcrumbs {background: #ccddec; margin-bottom: 20px; padding: 5px 10px;}
         #favorites {background: #86adce; padding: 10px 10px 15px; margin-bottom: 30px;}
         #favorites select {width: 259px; w\idth: 100%;}
   
         /* 3.3.1.2. Main content */
         #mainContent {padding: 0 10px 20px; overflow: hidden;}
         .oneCol #mainContent {}
         .twoCol #mainContent {float: right; display: inline; width: 727px; w\idth: 707px;}
	     .threeCol #mainContent {float: right; display: inline; width: 488px; w\idth: 468px;}
         #home.threeCol #mainContent {float: none; display: block; width: auto;}
         #container {text-align: center;}
		 #googleCalendar  iframe{width: 715px;}
		 ul#events {list-style: none; margin: 10px 0 10px 0;padding: 0; border-bottom: 1px dotted #0054a6;}
		 ul#events li {list-style: none; margin: 0; padding:  0 0 10px 0;}
		 ul#events .event {margin-bottom: 10px;}
		 ul#events .eventTitle {text-transform: uppercase; margin-bottom: 5px;}
		         
         /* 3.3.1.3. Secondary content */
         #secondContent {float: right; display: inline;}
   
      /* 3.3.2. Second column */
      #secondCol {float: right; display: inline;}
      .oneCol #secondCol {display: none;}
      .twoCol #secondCol {display: none;}
	  .threeCol #secondCol {width: 227px; margin-right: 11px; background: #fffec8;}
      #home.threeCol #secondCol {float: left; width: 256px; w\idth: 257px; margin: 0 52px 0 20px; background: none;}

         /* 3.3.2.1. Sidebar */
         #sidebar {margin: 30px 15px;}
         #sidebar h3 {border-bottom: 1px dotted #0054a6; padding-bottom: 3px; margin-bottom: 5px;}
         #sidebar img {margin: 0 auto 1em;}
         #sidebar p {margin-top: 1em;} 

      /* 3.3.3. Third column */
      #thirdCol {float: left; display: inline; width: 25%;}
      .oneCol #thirdCol {display: none;}
      .twoCol #thirdCol {width: 185px; margin-left: -924px;}
	  .twoColCalendar #thirdCol {width: 112px; margin-left: -924px;}
      .threeCol #thirdCol {width: 185px; margin-left: -685px;}
      #home.threeCol #thirdCol {float: left; width: 256px; w\idth: 257px; margin: 0;}

         /* 3.3.3.1. Local Subnavigation */
         #subNav {background: #6fa7d4; border: 1px solid #fff; margin-bottom: 45px;}
         #subNav h3 {padding: 5px 9px;}
         #subNav ul {padding-bottom: 25px;}
         #subNav li {margin-bottom: 1px;}
         #subNav li a {display: block; /* width: 183px; w\idth: 163px;*/ background: #c5dcee url(../images/gray-arrow.gif) no-repeat 6px; padding-left: 20px;}
         #subNav li a:hover, #subNav .current a {background: #fffec8 url(../images/red-arrow.gif) no-repeat 6px;}

         #subNav ul ul {padding: 0 0 0 15px; background: #fff;}
         #subNav ul ul a {width: 168px; w\idth: 148px;}
         #subNav .current li a {background: #fff url(../images/gray-arrow.gif) no-repeat 6px;}
         #subNav .current .current a, #subNav .current li a:hover {background: #fffec8 url(../images/red-arrow.gif) no-repeat 6px;}
   
   /* 3.4. Footer */
   #footer {margin-top: 12px; border-top: 10px solid #a6c5e0; overflow: hidden; padding: 20px 0 45px;}
   
      /* 3.4.1. Footer navigation */
      #footNav {float: left; width: 33%;}
      #footNav ul {}
      #footNav li {display: inline; border-right: 1px solid #666;}
      #footNav li a {margin-right: 10px; padding-left: 10px;}
  
      /* 3.4.2. Copyright & information */
      #copy {float: right; width: 66%; text-align: center;}



/*------------------------------------------------------------------
D. sIFR 
-------------------------------------------------------------------*/

/* These are standard sIFR styles... do not modify */

.sIFR-flash {
	visibility: visible !important;
	margin: 0;
}

.sIFR-replaced {
	visibility: visible !important;
}

span.sIFR-alternate {
	position: absolute;
	left: 0;
	top: 0;
	width: 0;
	height: 0;
	display: block;
	overflow: hidden;
}

/* Hide Adblock Object tab: the text should show up just fine, not poorly with a tab laid over it. */
.sIFR-flash + div[adblocktab=true] {
  display: none !important;
}

/* These "decoy" styles are used to hide the browser text before it is replaced... the negative-letter spacing in this case is used to make the browser text metrics match up with the sIFR text metrics since the sIFR text in this example is so much narrower... your own settings may vary... any weird sizing issues you may run into are usually fixed by tweaking these decoy styles */
/*
.sIFR-hasFlash h1 {
	visibility: hidden;
}

.sIFR-hasFlash h2 {
	visibility: hidden;
	letter-spacing: -9px;
	font-size: 55px;
}

.sIFR-hasFlash h3 {
	visibility: hidden;
	letter-spacing: -6px;
	font-size: 25px;
}

.sIFR-hasFlash h4 {
	visibility: hidden;
	letter-spacing: -5px;
	font-size: 21px;
}

.sIFR-hasFlash h5#pullquote {
	letter-spacing: -4px;
	visibility: hidden;
	font-size: 24px;
}
*/

#home.sIFR-hasFlash h2 span {font-size: 20px; font-weight: normal; visibility: hidden;}

#home.sIFR-hasFlash h4 {font-size: 12px; visibility: hidden;}

/*.sIFR-hasFlash #globalNav a {visibility: hidden;}*/ 




/*------------------------------------------------------------------
E. Sphider search results
-------------------------------------------------------------------*/

/*Top categories*/
.main_cat1 {font-size: 16px; font-weight: bold; color:#0000FF}
.main_cat2 {font-size: 12px; font-weight: bold; color:#0000FF}
.cat1:visited {font-size: 16px; font-weight: bold; color:#5555AA}

/*Small urls*/
.url {color: #777}


#search #middle a:visited{color:#258}
#search hr{color:#000066}

/*Page descriptions*/
.description{font-size: 13px;}


#search #middle td {font-family:arial,sans-serif; font-size: 13px; }

/* Title/link of pages */
.title{/*color:#0000FF;*/ font-size:15px}




#result_report {
	text-align:center ;
	padding:3px;
	background-color:#e5ecf9; 
	font-weight: bold;
	margin-bottom:14px;
}

.catBanner {
	padding:3px;
	margin-top:15px;
	background-color:#e5ecf9; 
	font-weight: bold
}
.webPageBanner {
	padding:3px;
	margin-top:20px;
	background-color:#e5ecf9; 
	font-weight: bold
}

#search hr{color:#000066;}
hr.powered{width:550; color: #000066}

/*main results table */
#results{width: 780;}


#other_pages {
	text-align:center;
}

#powered_by {
	margin:0 auto;
	margin-top:20px;
	padding-top:10px;
	font-size:10px;
	text-align:center;
	vertical-align: center;
}

#common_report {
		text-align:center;
}

#cat_table {
		width:600px;
		margin-top:20px;
		padding-top:10px;
		padding-bottom:20px;
		border-top:1px solid #AAAAAA;
		border-bottom:1px solid #AAAAAA;

}

#cat_main {
	font-weight: bold;
}

.divline{
	margin-top:20px;
	margin-bottom:-5px;
	border-bottom:1px solid #DDDDDD;
}

#sub_cat {
	font-size:12px;
}

.idented {
	margin-left:30px;
}

#did_you_mean {
	font-size: 14px; 
	text-align:center ;
	margin:10px;

}