/*
Theme Name: bclio
Theme URI: http://www.usablewebdesigns.com/
Description: This custom theme was created from scratch for the British Columbia Law Institute, home of the Law Resource Database and the Canadian Centre of Elder Law, UBC, Vancouver, British Columbia, Canada.
Author: Alison Taylor, Usable Web Designs 
Version: 1.0
Tags: BCLI, British Columbia Law Institute, Canadian Centre of Elder Law, Law Resource Database, UBC, Vancouver, British Columbia, Canada
*/

/**************** Styles *******************/

h1 {
  color: #00aeef;
  color: #f26522;
  font-family: Questrial, Arial, Helvetica, sans-serif;
  font-weight: normal;
  font-size: 20pt;
  padding: 0px 0px 5px 0px;
  margin-bottom: 15px;
  display: inline-block;
  background-image:url("images/horizontal-line-1.png");
  background-position: 0px bottom;
  background-repeat: repeat-x;
}
h2 {
  color: #0092d8;
  font-family: Questrial, Arial, Helvetica, sans-serif;
  font-weight: normal;
  font-size: 16pt;
  margin-bottom: 20px;
}
h3 {
  color: #f26522;
  font-family: Questrial, Arial, Helvetica, sans-serif;
  font-weight: normal;
  font-size: 14pt;
  padding: 0px 0px 5px 0px;
  margin-top: 35px;
  margin-bottom: 15px;
  display: block;
  background-image:url("images/horizontal-line-1.png");
  background-position: 0px bottom;
  background-repeat: repeat-x;
}
a, a:visited {
  text-decoration: underline;
  color: #008fd5;
  color: #0072bc;
}
a:hover {
  text-decoration: underline;
}
a img {
  border-width: 0;
}
a h1, a h2, a h3, h1 a, h2 a, h3 a {
  text-decoration: none;
}
hr {
  margin-top: 20px;
  margin-bottom: 20px;
}
table tr.top_row td {
  font-weight: bold;
  text-align: center;
}
table {
  border-collapse: collapse;
}

/**************** Page Layout *******************/

body {
  background: #ffffff url('images/diagonal-stripes-grey-1.png') top left repeat;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 11pt;
  color: #58595B;
}
#background_stripe {
  margin-top: 10px;
  background: transparent url('images/background-stripe.png') 0px 190px repeat-x;
  background-image: url('images/background-stripe.png');
  background-repeat: repeat-x;
}
#background_stripe_ccel {
  margin-top: 10px;
  background: transparent url('images/background-stripe-green.png') 0px 190px repeat-x;
  background-image: url('images/background-stripe-green.png');
  background-repeat: repeat-x;
}
#container {
  width: 960px;
  margin: 0px auto;
  margin-top: 0px;
}
#page {
  width: 960px;
  border: solid 1px #999999;
  background-color: #f3f4f4;
  padding: 0px;
  -moz-box-shadow: -3px 3px 10px #333333;
  -webkit-box-shadow: -3px 3px 10px #333333;
  box-shadow: -3px 3px 10px #333333;
  /* For IE 8 */
  -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=225, Color='#333333')";
  /* For IE 5.5 - 7 */
  filter: progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=225, Color='#333333');
}
#page_home {
  width: 960px;
  background-color: #ffffff;
}
#banner {
  width: 960px;
  height: 189px;
  background-color: #ffffff;
}
#logo {
  float: left;
  width: 400px;
  margin-top: 14px;
  margin-right: 16px;
}
#top-buttons {
  height: 90px;
  width: 362px;
  float: right;
  margin-top: 20px;
}
#top-buttons a {
  text-decoration: none;
}
#blue-button {
  height: 74px;
  width: 161px;
  float: left;
  margin-left: 10px;
  margin-top: 0px;
  border: solid 1px #0082c1;
  background: transparent url('images/blue-button-slice.jpg') top left repeat-x;
  -moz-box-shadow: 3px 3px 7px #555555;
  -webkit-box-shadow: 3px 3px 7px #555555;
  box-shadow: 3px 3px 7px #555555;
  /* For IE 8 */
  -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#555555')";
  /* For IE 5.5 - 7 */
  filter: progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#555555');  
}
#green-button {
  height: 74px;
  width: 161px;
  float: right;
  margin-right: 15px;
  margin-top: 0px;
  border: solid 1px #8b9664;
  background: transparent url('images/green-button-slice.jpg') top left repeat-x;
  -moz-box-shadow: 3px 3px 7px #555555;
  -webkit-box-shadow: 3px 3px 7px #555555;
  box-shadow: 3px 3px 7px #555555;
  /* For IE 8 */
  -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#555555')";
  /* For IE 5.5 - 7 */
  filter: progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#555555');  
}
.buttontext-dark {
  display: block;
  width: 151px;
  height: 18px;
  padding: 5px 0px 0px;
  margin-left: 5px;
  margin-top: 0px;
  margin-bottom: 5px;
  text-align: center;
  color: #3f3116;
  text-transform: uppercase;
  font-family: Questrial, Arial, Helvetica, sans-serif;
  font-weight: normal;
  font-size: 20pt;

}
.buttontext-white {
  display: block;
  width: 151px;
  height: 40px;
  padding: 0px 0px;
  margin-left: 5px;
  margin-top: 10px;
  text-align: center;
  color: #ffffff;
  font-family: Questrial, Arial, Helvetica, sans-serif;
  font-weight: normal;
  font-size: 13pt;
  line-height: 13pt;
}
#social_media {
  clear: both;
  height: 30px;
  /*width: 160px;*/
  width: 950px;
  float: right;
  margin-right: 10px;
  margin-top: 0px;
}
#social_media img {
  margin-left: 5px;
}
#content_area {
  clear: both;
  width: 920px;
  margin-bottom: 0px;
  margin-left: 20px;
  background-color: #f3f4f4;
}    
#content_area_home {
  clear: both;
  width: 920px;
  margin-top: 0px;
  margin-bottom: 0px;
  margin-left: 20px;
  background-color: #ffffff;
}    
#banner_photo {
  clear: both;
  width: 960px;
  height: 275px;
  background-image: url('https://www.bcli.org/wordpress/images-temp/banner-photo-1.jpg') ;
}
#banner_photo_ccel {
  clear: both;
  width: 960px;
  height: 275px;
  background-image: url('https://www.bcli.org/wordpress/images-temp/banner-photo-ccel-1.jpg') ;
  background-position: top right;
  background-repeat: no-repeat;
}
#banner_text {
  color: #44361a;
  width: 345px;
  padding-top: 40px;
  padding-left: 110px;
}
#banner_text h2 {
  font-size: 24pt;
}

#banner_text p {
  font-size: 14pt;
}
#intro_text {
  width: 880px;
  margin-top 0px;
  margin-bottom: 40px;
  padding-top: 0px;
  padding-left: 40px;
  padding-right: 40px;
}
#main_content {
  width: 570px;
  margin-top: 20px;
  padding: 20px 15px;
  float: left;
  background-color: #ffffff;
}
#main_content_home {
  width: 582px;
  padding: 0;
  float: left;
  background-color: #ffffff;
}
#main_content_wide {
  width: 890px;
  padding: 20px 15px;
  float: left;
  background-color: #ffffff;
}
#main_content ul li {
  margin-bottom: 10px;
}
#main_content ul.archive {
  margin-left: 0;
  padding-left: 0;
}
#main_content ul.archive li {
  list-style-type: none;
  margin-top: 20px;
}
#main_content span.read_more a,
#main_content ul.archive li span.read_more a {
  color: #f26522; 
}
#highlight_box_container {
  width: 600px;
  float: left;
  background-color: #ffffff;
  margin-bottom: 10px;
}
#link_box {
  float: left;
  text-align:center;
  font-family: Questrial, Arial, Helvetica, sans-serif; 
  width: 261px;
  height: 360px;
  background-color: #ebebe4;
  
  margin-right: 9px;
  margin-bottom: 9px;
  padding-left: 5px;
  padding-right: 5px;
  border: solid 9px #f8f8f9; 
  border: solid 9px #f6f6f4; 
}

#link_box img {
  border: 5px solid #a6a7a3;
  display: block;
  margin-left: auto;
  margin-right: auto;
}
#link_box h1 {
  color: #0092d8;
}
#link_box h1 p {
  display: block;
  margin-left: auto;
  margin-right: auto;
}
#more_button {
  border: none;
}
#more_button img {
  float: right;
  padding-right: 35px;
  border: none;
}
#sidebar {
  background-color: #f3f4f4;
  background: transparent url('images/sidebar-background.png') left top repeat-y;
  width: 320px;
  float: left;
  margin-top: 20px;
}
#content_area_home #sidebar {
  margin-top: 0px;
}
#vertical-line {
  display: block;
  width: 40px;
  height: 100%;
  float: left;
  background-color: #f3f4f4;
}
#sidebar_area {
  display: block;
  background-color: #ffffff;
  width: 250px;
  padding: 20px 15px;
  height: 100%;
  float: right;
}
#sidebar h2, #sidebar h2 a {
  margin-top: 0;
  color: #f26522;
  text-decoration: none;
}
#sidebar h3 {
  color: #0092d8;
  font-family: Questrial, Arial, Helvetica, sans-serif;
  font-weight: normal;
  font-size: 12pt;
  margin-bottom: 0px;
  padding-bottom: 0px;
  background-image: none;
}
#sidebar h3 a {
  text-decoration: none;
}
#sidebar_area ul {
  margin: 0;
  padding: 0;
}
#sidebar_area ul li {
  clear: both;
  margin: 0;
  padding: 0;
  margin-bottom: 35px;
  list-style-type: none;
}
#sidebar_area ul ul li {
  margin-bottom: 10px;
  padding-left: 15px;
}
#sidebar_area ul ul li a {
  color: #58595B;
  text-decoration: none;
}
#sidebar_area ul li.widget_accesstxt ul li a {
  margin-left: 20px;
}
#sidebar_area ul li label.screen-reader-text {
  display: none;
}
#footer {  
  background-color: #958a81;
  width: 960px;
  padding-top: 50px;
  height: 350px;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 14pt;
  line-height: 18pt;
  color: #ffffff;
}
#footer_top {
  height: 100px;
  z-index: 10;
  position: relative;
  top: 50px;
}
#footer_top img {
}
#footer_left{
  width: 240px;
  padding: 0 20px 15px;
  float: left;
}
#footer_middle, #footer_right {
  width: 300px;
  padding: 0 20px 15px;
  float: left;
}
#social_media_footer {
  height: 55px;
  width: 230px;
  padding: 10px 5px 10px 15px;
  margin-left: 35px;
  margin-top: 10px;
}
#searchform input[type=text] {
  width: 160px;
  height: 20px;
  line-height: 20px;
}
#searchform input[type=submit] {
  height: 26px;
  line-height: 26px;
  background-color: #f26522; 
  color: #ffffff;
  border-width: 0;
  font-family: Questrial, Arial, Helvetica, sans-serif;
  font-size: 12pt;
}
#footer ul {
   list-style: none;
}
#footer_left ul li {
  margin:0;
  padding-top: 15px;
  padding-bottom: 15px;
  background-image: url("images/horizontal-line-brown142.png");
  background-position: 0px bottom;
  background-repeat: no-repeat;
}
#footer_left ul li:last-child {
  background-image: none;
}
#footer_left ul li a {
  color: #ffffff;
  font-family: Questrial, Arial, Helvetica, sans-serif;
  font-weight: normal;
  font-size: 14pt;
  line-height: 16pt;
  text-decoration: none;
}
#footer_left ul li a:hover {
  color: #7ad3f7;
}
#footer_middle p {
  color: #ffffff;
  font-family: Questrial, Arial, Helvetica, sans-serif;
  font-weight: normal;
  font-size: 14pt;
  line-height: 16pt;
  margin: 0;
  padding-top: 15px;
  padding-bottom: 15px;
  background-image:url("images/horizontal-line-brown240.png");
  background-position: 0px bottom;
  background-repeat: no-repeat;
}
#footer_middle p:last-child {
  background-image: none;
}
#footer_middle img {
  float: left;
}
#footer_middle a {
  text-decoration: none;
  color: #ffffff;
}
#footer_middle a:hover {
  color: #1bbcd8;
  color: #7ad3f7;
}
#footer_right {
  font-family: Questrial, Arial, Helvetica, sans-serif;
}
#footer_right div a {
  color: #ffffff;
}
#footer_right div h1 {
  float: none;
  color: #ffffff;
  font-weight: normal;
  font-size: 16pt;
  background-image: none;
  border-width: 0;
  text-transform: none;
  margin-bottom: 10px;
  font-family: Questrial, Arial, Helvetica, sans-serif;
}
#footer a.button, #sidebar a.button {
  display: block;
  margin: 0px auto;
  text-decoration: none !important;
  background-color: #f26522; 
  color: #ffffff !important;
  height: 26px;
  line-height: 26px;
  border-width: 0;
  font-family: Questrial, Arial, Helvetica, sans-serif;
  font-size: 12pt;
}
#footer a.button {
  width: 7em;
}
#sidebar a.button {
  text-align: center;
  width: 8em;
}

#credits {
  clear: both;
  height: 48px;
  font-family: Questrial, Arial, Helvetica, sans-serif;
  font-size: 11pt;
  line-height: 48px;
  color: #5c5d60;
}
#copyright {
  float: left;
  width: 417px;
  padding-left: 45px;
  text-align: left;
}
#design_by {
  float: left;
  width: 417px;
  padding-right: 45px;
  text-align: right;
}
#design_by a {
  color: #5c5d60;
  text-decoration: none;
}
#design_by a:hover {
  text-decoration: underline;
}
img.address_icon {
  margin-right: 10px;
}
img.alignleft {
  float: left;
  margin-right: 10px;
  margin-bottom: 10px;
}
img.alignright{
  float: right;
  margin-left: 10px;
  margin-bottom: 10px;
}
img.aligncenter {
  margin: 10px auto;
}
div.publication_files {
  margin-top: 20px;
}
div.annual_report_page div.publication_files 
{
  margin-top: 40px;
}
p.download_publication {
  margin-top: 10px;
  margin-bottom: 10px;
}


/**************** Styling of menu *******************/

#menu {
   clear: both;
   float: left;
   margin: 0;
   padding: 0;
   height: 53px;
   width: 960px;
   z-index: 1000; /* This makes the dropdown menus appear above the page content below */
   position: relative;
   background: transparent url('images/background-stripe.png') top left repeat-x;
   font-family: Questrial, Arial, Helvectica, sans-serif;
}
#menu.ccel_menu {
   background: transparent url('images/background-stripe-green.png') top left repeat-x;
}
#menu ul {
   margin: 0;
   padding: 0;
   list-style: none;
   float: right;
   position: relative;
   right: 50%;
}
#menu ul li {
   margin: 0 0 0 1px;
   padding: 0;
   float: left;
   position: relative;
   left: 50%;
   line-height:  53px;
}
#menu ul li a {
   display: block;
   margin: 0;
   padding: 0 17px;
   font-size: 14.5pt;
   color: #ffffff;
   text-decoration: none;
}
#menu ul li.current_page_item {
  background-color: #3aaeef;
}
#menu.ccel_menu ul li.current_page_item {
  background-color: #879261; 
}

/* .hover line is required for IE 6 and below */
#menu ul.menu li a:hover,
#menu ul.menu li:hover a,
#menu ul.menu li.hover a { 
   background-color: #f26522; 
}

/* Submenu items */
#menu ul ul {
   display: none; /* Sub menus are hidden by default */
   position: absolute;
   top: 42px;
   left: 0;
   right: auto; /*resets the right:50% on the parent ul */
   width: 19em; /* width of the drop-down menus */
   z-index: 1001; /* This makes the dropdown menus appear above the page content below */
   margin: 0;
   padding: 0;
   border: solid 1px #aaa;
}
#menu ul ul ul {
   border-width: 0px;
}
#menu ul ul li {
   left:auto;  /*resets the left:50% on the parent li */
   margin:0; /* Reset the 1px margin from the top menu */
   clear:left;
   width:100%;
}
#menu ul ul li a {
   color: #ffffff;   /* font colour on all menu items comes from here*/
   background-color: #f26522; 
   font-size: 14.5pt;
   line-height: 17pt; /* overwrite line-height value from top menu */
   border-bottom: 1px solid #aaa; /* sub menu item horizontal lines */
   padding: 7px 15px;
}
#menu ul li.active ul li a:hover,
#menu ul li.hover ul li a.hover,
#menu ul ul li a:hover,
#menu ul li:hover ul li a:hover {
   color: #ffffff;
   background: #0094d9; 
   font-weight: normal;
}
#menu.ccel_menu ul li.active ul li a:hover,
#menu.ccel_menu ul li.hover ul li a.hover,
#menu.ccel_menu ul ul li a:hover,
#menu.ccel_menu ul li:hover ul li a:hover {
   color: #ffffff;
   background: #0094d9; 
   background: #879261; 
   font-weight: normal;
}
/* Flip the last submenu so it stays within the page */
#menu ul ul.last {
   left:auto; /* reset left:0; value */
   right:0; /* Set right value instead */
}
/* Make the sub menus appear on hover */
#menu ul li:hover ul,
#menu ul li.hover ul { /* This line is required for IE 6 and below */
   display:block; /* Show the sub menus */
}
#menu ul ul ul {
  display: none;
}
#menu ul ul ul li {
  display: none;
}

/*Sidebar Menu  - Works with Menu Widget and BCLI Hand-Coded 3rd-level menu*/
#sidebar_menu_plugin, #sidebar_menu {
  color: #ffffff;
  background-color: #f26522; 
  margin-left: 10px;
  margin-bottom: 35px;
}
#sidebar_menu_plugin ul li a,
#sidebar_menu ul li a {
  color: #ffffff;
  background-color: #f26522;
  display: block;
  padding-top: 5px;
  padding-bottom: 5px;
  padding-left: 5px;
  margin: 0;
  font-size: 11pt;
  border-bottom: solid 1px #aaa;
  border-left: solid 1px #aaa;
  border-right: solid 1px #aaa;
  text-decoration: none;
}
#sidebar_menu_plugin ul.menu-widget li a,
#sidebar_menu ul.menu-widget li a {
  color: #ffffff;  
}
#sidebar_menu_plugin ul.menu-widget li,
#sidebar_menu ul li {
    margin-bottom: 0px;
    padding-left: 0px;
}
#sidebar_menu_plugin ul li:first-child,
#sidebar_menu ul li:first-child {
  border-top: solid 1px #aaa;
}       
#sidebar_menu ul li a:hover,
#sidebar_menu ul li.active ul li a:hover,
#sidebar_menu ul li:hover ul li a:hover,
#sidebar_menu ul li.hover ul li a:hover,
#sidebar_menu_plugin ul li a:hover,
#sidebar_menu_plugin ul li.active ul li a:hover,
#sidebar_menu_plugin ul li:hover ul li a:hover,
#sidebar_menu_plugin ul li.hover ul li a:hover { /* This line is required for IE 6 and below */
   background: #ffffff; /* Sub menu items background colour */
   font-weight: normal;
   color: #1cbcd8;
}
  
div.bcli_thumbnail {
  float: right;
  margin-left: 15px;
  margin-bottom: 15px;
}
div.team_member {
  float: left;
  width: 40%;
  margin-left: 5%;
  margin-right: 5%;
  padding-bottom: 2em;
}
div.team_member img {
  width: 100% !important;
}
div.team_member h3 {
  margin-top: 10px;
  margin-bottom: 0;
}
div.team_member p {
  margin: 0;
}
div.team_member span.read_more {
  float: right;
}