@charset "utf-8";
/* CSS Document for EasyFamilyReunion.com */

/* -- Logo colors 
   -- orange: #fc9200
   -- maroon: #5f0023
   -- green:  #7fc41c
*/

/* -- Reset standard elements */
body { 
  background: url(images/bg.jpg) repeat-x #fff;
  padding: 0; 
  margin: 0; 
  font: normal 12px/16px arial; 
  color: #252525;
}

/**html{ height: 105%;}*/

h1, h2, h3, h4, h5, h6, p, div, img, ul, li, form, span { 
  padding: 0; 
  margin: 0;
}

p { 
  padding-bottom: 10px;
  padding-bottom: 7px;
  padding-bottom: 7px;
}

img { 
  border: 0; 
  vertical-align: middle;
}

ul { 
  list-style: none;
}

h1 { 
  font: normal 16px/32px arial;
  color: #fff;
  background: #5f0023;
  display: block;
  padding: 0 16px;
}

.h1 {
  font: normal 24px/34px arial;
  color: #fff;
  background: #5f0023; 
  display: block;
  padding: 0 16px;
}

h2 { 
  font: normal 28px arial;
  color: #681b37;
  padding-bottom: 10px;
}

h3 {
  font: normal 16px arial;
  color: #595959;
  padding-top: 10px;
  padding-bottom: 10px;
}

h4 {
  font: normal 19px/31px arial;
  color: #fff;
  background: url(images/button_bg.jpg) repeat-x #758b0e;
  display: block;
  border: 1px solid #6c8201;
  padding-bottom: .6em}

h5 {
  font: normal 16px arial;
  color: #fc9200;
  padding-bottom: .8em;
}

h6 { font: normal 20px/32px arial;
  background: url(images/arrow2.gif) no-repeat 16px 10px;
  color: #0c0004;
  padding: 0 0 0 36px;
}

.resource {
  font: bold 1.3em arial;
  color: #0c0004;
  color: #5f0023;
  color: #595959;
  padding: 8px 0 8px 14px;
}

.resource p {
  color: #595959;
  font: normal .8em arial;
  padding: 0px 0px 4px 14px;
}

a:link {color: #7fc41c; text-decoration: none;}
a:visited {color: #6eb30b; text-decoration: none;}
a:hover {color: #5f0023; text-decoration: underline;}

h4 a:link {color: #ffffff; text-decoration: none;}
h4 a:visited {color: #ffffff; text-decoration: none;}
h4 a:hover {color: #5f0023; text-decoration: underline;}

.img {
  padding: 0 12px 0 0;
}

.orange { 
  color: #d57c01;
}

.brown { 
  color: #5f0023;
  font: normal 19px arial;
}

/* b,strong{ color: #fc9200;} */
b, strong { 
  color: #666;
}

#wrap { 
  width: 976px;
  margin: 0 auto;
}

/*.........Start Header............*/
#header {
  width: 547px;
  margin: 0 auto;
  padding: 0 16px 0 0;
  height: 49px;
  float: left;
  font: normal 20px/49px arial;
  color: #fff;
  display: block;
}

#logo {
  width: 585px;
  padding-right: 15px;
  float: left;
}

/*.........Start Nav (Nav at top right hand side of page)............*/
#nav {
  height: 49px;
  width: 413px;
  float: left;
  font: normal 14px/49px arial;
  color: #fff;
  text-transform: uppercase;
}

#nav ul {}
#nav ul li {
  list-style: none;
  float: left;
}
#nav ul li a {
  padding: 0 17px; color: #fff;
  text-decoration: none;
  display: block;
}
#nav ul li a:hover {
  background: url(images/nav_hover.jpg) repeat-x;
  padding: 0 17px;
  color: #5f0023; /* maroon */
  text-decoration: underline;
  display: block;
}
#nav ul li span {
  background: url(images/nav_hover.jpg) repeat-x;
  padding: 0 17px;
  color: #001c29;
  text-decoration: none;
  display: block;
}

/*.........Start Banner (contains logo)............*/
#banner {
  background: url(images/banner_bg.jpg) no-repeat left top;
  width: 962px;
  height: 208px;
  float: left;
  display: block;
  margin-top: 10px;
  padding: 0 0 0 14px;
  clear: both;
}

/*.........Start Heading (top left hand side of page) ............*/
#content_top {
  width: 976px;
  height: 16px;
  padding: 0;
  background: url(images/top_spacer.jpg) no-repeat #fff;
  float: left;
}

#content_main {
  width: 944px;
  padding: 0 16px;
  background: url(images/content_bg.jpg) repeat-y;
  /*background: url(images/top_spacer.jpg) no-repeat #fff; */
  float: left;
}

/* -- left panel (left hand navigation and/or resource boxes) */
#left_panel {
  width: 264px;
  float: left;
  background: #ddf1ff;
  margin-right: 28px;
}
#left_panel ul { 
  list-style: none; 
  padding: 0 16px 0px 16px;
}
#left_panel ul li { 
/*
  background: url(images/arrow.gif) no-repeat left 9px; 
*/
  padding-left: 20px;
  padding-left: 12px;
  font: bold 14px/26px arial; 
  color: #5f0023; /* maroon */
}
#left_panel ul li a{color: #5f0023; text-decoration: none;}
#left_panel ul li a:hover {
  color: #fc9200; /* orange */
  text-decoration: underline; 
}
/*
#left_panel li a:hover li { display: block;}
*/

/*
#left_panel ul { list-style: none; padding: 0 16px 16px 16px;}
#left_panel ul li { background: url(images/arrow.gif) no-repeat left 9px; padding-left: 20px; font: bold 14px/26px arial; color: #5f0023;}
#left_panel ul li a{color: #5f0023; text-decoration: none;}
#left_panel ul li a:hover{color: #000; text-decoration: underline;}
#left_panel li a:hover li{ display: block;}
*/
/*
#left_panel ul {
  list-style: none;
  padding: 0 16px 16px 16px;
  margin: 0;
}

#left_panel li {
  display: block;
  padding: 0;
  margin: 0;
  font: bold 14px/26px arial;
}

#left_panel li a, #left_panel li a:visited {
  display: block;
  background: url(images/arrow.gif) no-repeat left 9px;
  padding-left: 20px;
  color: #5f0023;
  text-decoration: none;
}

#left_panel li ul {
  padding: 0;
  margin: 0 0 0 10px;
}

#left_panel li li {
  display: none;
}

#left_panel li:hover, #left_panel li a:hover {
  border: 0;
  color: #000;
}

#left_panel li:hover li a , #left_panel li a:hover li a {
  color: #fc9200;
  visibility: visible;
  font: bold 14px/26px arial;
}
#left_panel li:hover li, #left_panel li a:hover li { 
  display: block;
}
#left_panel li:hover li a:hover {
  color: #5f0023;
  text-decoration: underline;
}

#left_panel table {
  padding: 0;
}

#left_panel_article {
  width: 264px;
  float: left;
  background: #ddf1ff;
  margin-right: 28px;
}

#left_panel_article ul {
  list-style: none;
  padding: 10px 16px 0 16px; 
}

#left_panel_article ul li {
  background: url(images/arrow.gif) no-repeat 20px 4px;
  padding-left: 36px;
  padding-bottom: 16px;
  font: normal 14px/16px arial;
}

#left_panel_article ul li a {
  color: #7c2c00;
  text-decoration: none;
}

#left_panel_article ul li a:hover {
  color: #000;
  text-decoration: underline;
}

#left_panel ul li ul a {
  visibility: hidden;
}

#left_panel ul li ul a:hover {
  visibility: visible;
}
*/
/* -- main content of page */
#right_panel {
  width: 652px;
  float: left;
}

.box { background: url(images/photo_frame.jpg) no-repeat;
  width: 204px;
  height: 200px;
  padding: 4px 3px 3px 3px;
  float: left;
  display: block;
  margin: 0 11px 11px 0;
  text-align: center;
  vertical-align: bottom;
}

.box1 {
  background: url(images/photo_frame.jpg) no-repeat;
  width: 204px;
  height: 200px;
  padding: 4px 3px 3px 3px;
  float: left;
  display: block;
  margin: 0 0 11px 0;
  text-align: center;
  vertical-align: bottom;
}

#img_left {
  width: 164px;
  float: left;
}

#content_right {
  font: normal 14px/18px arial;
  color: #000;
  float: right;
  width: 488px;
}

#content_right a {
  color: #fc9200;
  text-decoration: none;
}

#content_right a {
  color: #3b8008;
  text-decoration: none;
}

#content_right a:hover {
  color: #5f0023;
  text-decoration: underline;
}

.ul ul {
  list-style: none;
}

.ul li {
  background: url(images/arrow1.gif) no-repeat left 10px; 
  padding: 4px 0 4px 20px;
}

.ul1 li {
  /*padding: 4px 0 8px 20px;*/
  margin-bottom: 0px;
}

.ul1 li a {
  background: url(images/bullet_square.gif) no-repeat left 4px;
  padding: 0 0 0 20px;
}

.ul1 li a:visited {
  background: url(images/bullet_square_hover.gif) no-repeat left 4px;
  padding: 0 0 0 20px;
}

.shift {
  padding: 0px 0 16px 20px;
}

ol li {
  padding-bottom: 1em;
  padding-right: .5em;
}

#planner_box {
  width: 612px;
  height: 325px;
  padding: 28px 20px;
  float: left;
  background: url(images/planner_box_bg.gif) no-repeat left top;
}

.textfield { 
  width: 397px;
  border: 1px solid #e4e5e5;
  padding: 2px; 
  background: #fff;
  float: right;
  margin-right: 90px;
}

.textarea { 
  width: 397px;
  border: 1px solid #e4e5e5;
  padding: 2px; 
  background: #fff;
  float: right;
  margin-right: 90px;
  margin-bottom: 10px;
}

/*.........Start Footer............*/
#footer {
  width: 100%;
  height: 45px;
  margin-top: 32px;
  background: #5f0023;
  float: left;
}

#footer_main {
  width: 976px;
  margin: 0 auto;
}

#footer_main a {
  color: #fff;
  text-decoration: none;
}

#footer_main a:hover {
  color: #fc9200;
  text-decoration: underline;
}

#footer_left {
  width: 312px;
  font: normal 12px/45px arial;
  color: #fff;
  float: left;
  padding: 0 16px;
}

#footer_right {
  width: 600px;
  font: normal 12px/45px arial;
  color: #fff;
  float: left;
  padding: 0 16px;
}

#footer_content a {
  color: #504f4f;
  text-decoration: none;
  padding: 0 5px;
}

#footer_content
  a:hover {
  color: #000;
  text-decoration: underline;
  padding: 0 5px;
}

.copyright {
  color: #9d9d9d;
}

/* Self-clearing Containers */
#wrap: after, #nav: after, #content_main: after, #left_panel: after, #left_panel_article: after, #right_panel: after,/* #footer: after*/ {
  content: ".";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
}

/*#left_panel, #right_panel {display: inline-block;}*/
/* Force IE7 to respect generated content */

/* -- Sidebar */
#sidebar {
  background-color: #fff866;
  background-color: #fbdf67;
  padding: .8em;
  width: 30%;
  float: right;
  margin-left: 10px;
  border: 1px;
  border-color: gray;
  border-style: solid;
}

/* -- Summary */
.summary { 
  font: normal 1.15em arial;
  color: #fc9200;
  padding-bottom: .8em;
}

/* -- checklist */
.checklist li { 
  background: url(images/bullet_square.gif) no-repeat left 4px;
  padding-left: 2em;
  padding-right: 0;
  padding-bottom: .6em;
  padding-top: .2em;
}

/* -- Footnote */
.footnote { 
  font: normal .6em arial;
  color: #656565;
  margin-top: 1.4em;
  padding-top: .8em;
  border-top: 1px;
  border-top-color: gray;
  border-top-style: solid;
}

/* -- Superscripts */
sup {
  font-size: 0.3em;
}

/* -- Buttons */
.submit_button {
  font: bold 1.2em arial;
  color: #fff;
  background-color: #fc9200;
/*
  background: url(images/button_bg.jpg) repeat-x #758b0e;
  border: 1px solid #6c8201;
  padding-bottom: .6em;
*/
}

.cancel_button {
  font: bold 1.2em arial;
  color: #fff;
  background-color: #999999;
/*
  background: url(images/button_bg.jpg) repeat-x #758b0e;
  border: 1px solid #6c8201;
  padding-bottom: .6em;
*/
}