﻿/* These rules are consolidated for jPlayer page*/
/* z-index hierarchy:
* Working from the bottom up:
* play controls have ZI 1 to ensure coverage of control box when it is in use;
* seek bar (.jp-progress) has ZI 2 to ensure coverage of play controls;
* volume bar and mute/unmute/max-volume controls have ZI 3 to ensure coverage of seek bar and play controls;
* track list (2 types) have ZI 4 to ensure coverage of all the other things.
* NB z-index does nothing if applied to sub-elements of links or selectors containing :hover
* This might need modifying for touch-screens where displayed info will be above controls.  But perhaps not. */

html {
	background-color: #FEFDE5;  /* "Antique ivory!" *//* #F6E3CE if no-touch */
	border: 0;
	border-color: #3A91BC; /* dull sky blue */
	border-width: 2px 0 0 0;
	border-style: solid;
}

body {
	margin: 0;
	padding: 0;
}

a {
	color: #0000FF; /* blue, blue */
}

a.no_line {
	/* text-decoration:none; */
}

#container_page {
	position: relative; /* Set to absolute before 2014-07-21 */
	max-width: 1000px; /* Set to 1000px before 2014-07-21 */
	min-width: 630px; /* Set to 630px before 2014-07-21 */
	font-family:"Times New Roman", Times, serif;
}

#page_area_1_top {
	text-align: center;
	padding: 0px 0px 25px 0px;
}

#page_area_1_top a {
	color: #FEFDE5; /* "Antique ivory!" */
}

.column_main_area_1_left {
	top: 0;
	left: 0;
	height: auto;
	width: 150px;
	position: relative;
	float: left;
	padding: 10px 0 1px 0;
	margin: 0 10px 0 25px;
	font-size: inherit;
	font-size:.9em;
	line-height: 18px;
}

#no-script-text { /* relevant only if javascript disabled in browser */
	border: none;
	padding: 3px 2px 1px 2px;
	margin: 0 1px 2px 1px;
	width: 144px;
	font-size:.9em;
	display: none;
}

/* ===================================================================================================== */
								/* JPLAYER SECTION */
/* ===================================================================================================== */

/*
 * Skin for jPlayer Plugin (jQuery JavaScript Library)
 * http://www.happyworm.com/jquery/jplayer
 *
 * Skin Name: Custom_skin
 *
 * Copyright (c) 2010-2011 Happyworm Ltd
 * Dual licensed under the MIT and GPL licenses.
 *  - http://www.opensource.org/licenses/mit-license.php
 *  - http://www.gnu.org/copyleft/gpl.html
 *
 * Author: Silvia Benvenuti - adapted and edited by RH
 * Skin Version: 4.0 (jPlayer 2.1.0)
 * Date: 1st September 2011 - April 2012
 */

#jp_container {
	top: 0;
	left: 0;
	width: 100%;
	height: auto;
	min-height: 60px;
	position:relative;
	margin: 0;
	padding: 0 0 1px 0; */
	/* border: none; */
	/* padding:3px 2px 1px 2px; */
	/* font-family: "Myriad Pro Regular","Trebuchet MS"; */
}

.intro-phrase { /* This is now a div which appears within the editable section */
	top: 1px;
	left: 0;
	height: 30px;
	width:115px;
	float:left;
	padding:0;
	margin: 0;
	position: relative;
	font-style:italic;
}

/* ======================================== Trackslist portions ====================================== */

.trackslist {
	list-style-type:none;
	top: 3px;
	left: 10px; /* works like a left-margin for the list */
	position: relative;
	width:130px;
	padding:0 0 0 0; /* seems to have no effect */
	margin: 0 0 0 0; /* seems to have no effect */
}

.tk-li {
	top: 0px;
	height:26px;
	width:16px;
	margin: 1px 0 0 0; /* affects gap above boxes and also between rows */
	padding: 7px 3px 3px 3px; /* affect the height and width of the boxes */
	line-height: 16px;
	position:relative; /* was static */
	float:left; /*  Without the float property the list appears as a vertical column instead of an array */
	margin-right:15px;
}

/* ================================== Old-style tracks ============================================= */

/* no-touch is included in this rule, even though it is not a hover rule, because it affects only the mouse pointer style */

a.tp1 {
    cursor: default; /* this sets the pointer style in the trackslist area */
}

.no-touch a.tp1:hover {
	position: relative;
	text-decoration:none; /* This rule seems needed only for Safari */
}

a.tp1 abbr { /* new selector added 2014-07-24 - affects old-style ts-li links as initialized - OK*/
    text-decoration: underline; /* */
    color: #009BE3; /* lightish blue */
}

/*
The following rule gives the display property one of several values.  All the various options suggested by Expression Web as possible values have been tested and no difference in result has been found between them, regardless of whether an image is included or not, or whether the box-width is derived from the target text or disconnected from it - as commented-upon below at the place where the elements are inserted in the HTML.  The only forbidden value here is "none".   The default value supposedly is "inline".  Expression Web mentions a value "box" in the Help documentation but does not allow it to be used.  According to Expression Web, in theory the following applies to the main settings:

	"block" causes a new line to be added after the element.  Object is rendered as a block element.

	"inline" causes a line to be removed from the element.  Object is rendered as an inline element sized by the dimensions of the content.

	"inline-block" causes an object to be rendered inline, but the contents of the object are rendered as a block element. Adjacent inline elements are rendered on the same line, space permitting.

	"none" causes the data for the element to be hidden.

Regarding the "top" property, if this is set to less than 18px the hovering will stick until the cursor is moved out of the hover box.  Better is 20px or more.  35px allows the "hand" cursor itself to not occlude the box.  The left side of the hover box is set with the properties "left" and "margin".  The right side of the box aligns with the right end of the target text, but is disconnected from this behavior by introducing a line-break element as described later.

The white-space property is set to nowrap:  this is the means by which control is gained over line breaks within the hover content box.

*/

a.tp1 span {
	top: 35px; /* valid */ /* Use bottom instead with touchscreens */	
    left: 15px; /* valid */
    position: absolute; /* valid */
	padding: 5px 8px 5px 10px; /* valid */
    background-color: #FEFDE5; /* "Antique ivory!" */ /* valid */
	border: solid 1px #C6C6C6; /* #C6C6C6 grey; #FAAC58 orange */ /* valid, but set back to grey when done */
    z-index: 4; /* see ZI hierarchy note at top of document */
	line-height: 16px; /* valid */
    white-space: nowrap; /* valid */
	color:#000099; /* dark blue */ /* valid */
	display: block; /* valid */
	visibility: hidden; /* valid */
}	

.no-touch a.tp1:hover span { /* including .no-touch class prevents operation on pc */
    visibility: visible;
}

/* ================================== New-style tracks ============================================= */

.no-touch a.tp2 {
    cursor: default; /* this sets the pointer style in the trackslist area */
}

.ts-ul {
	top: 0;
	left: 0;
	height:13px; /* tk-li has padding, therefore this reveals the height of tk-li with no padding */
	width:17px; /* tk-li has padding, therefore this reveals the width of tk-li with no padding */
	list-style-type:none;
	padding:0 0 3px 0; /* 1px enables edges to be seen by shrinking ts-li */
	margin:0 0 0 0;
	position: relative;
}

/* WORK ON GETTING CORRECT RESULTS FOR .ts-li */
.ts-li { /* This element is deliberately hidden behind a.tp2 because it is also hover sensitive */
			/* The line height of .tk-li - not .tk-li span -determines whether any of it shows above a.tp2 */
	/* top: 0;
	left: 0; */
	padding: 0;
	margin: 0 0 3px 0;
	height:16px;
	width:14px;
	position: relative; */ /* */
	/* display: none; */ /* Seems to have no effect */
	/* visibility:hidden;
	border-right: 1px #F00 solid; */ /* red */
}

a.tp2 { /* positioning of this element seems to be relative to .ts-ul, not to .ts-li */
	top: 0;
	left: 0;
	height: 26px;
	width: 16px;
	padding:0;
	margin:0;
	position: relative;
    /* cursor: default; */ /* this sets the pointer style in the trackslist area */
    z-index: 1; /* added to see if it improves touchscreen operation - might be better deleted??? */
}

/* This sets the color of the links in the track-listing area */

a.tp2:link,
a.tp2:visited,
.no-touch a.tp2:hover,
a.tp2:focus,
a.tp2:active {
	color: #009BE3; /* lightish blue */
	border: none; /* intended to prevent a border, usually dotted, from showing under some circumstances */
}

.ts-dv {
	/* top: 38px;
    left: 17px;
    position: absolute; */
    top: 25px;
    left: 25px;
    position: fixed;
	padding: 5px 7px 5px 10px;
	display: inline-block; /* "None" turns off only children li, not "span" */
	background-color:#FEFDE5; /* "Antique ivory!" */
	border: 1px #C6C6C6 solid; /* medium-light grey */
	text-decoration: none;
    z-index: 4; /* the minimum to cover autohide_box is 1 */
    line-height: 16px;
	white-space: nowrap;
	color:#000099; /* dark blue */
	visibility: hidden; /* This is the point of control for description panel - div version */
}	

.no-touch a.tp2:hover .ts-dv  { /* Control of .ts-dv seems redundant */
    /* display: block; */
    /* visibility: visible; */
}	

.no-touch a.tp2:hover .ts-dv {
	/* display: block;
	visibility: visible; */
	/* z-index: 0; */
}

/* This rule probably superfluous */
.no-touch a.tp2:hover .ts-dv  strong {
/* 	visibility: visible;
	padding: 0;
	margin: 0; */
}

a.tp3 { /* - *** Note sure if these rules do anything:  perhaps they are later overridden. *** - */
	top: 0;
	left: 0;
	position: absolute;
	height: auto;
	width: auto; /* */
	padding: 5px 7px 5px 10px;
  	margin:  0 -3px -3px -3px; /* This changed to get correct location when set to load with page - without hovering */
    text-decoration: none;
	display: inline-block;
/*  background-color: #FEFDE5;  /* "Antique ivory!" */
    background-color: #F3E2A9;  /* "Light gold" */
	border: solid 1px #C6C6C6; */ /* #FAAC58 orange; #C6C6C6 medium-light grey */
	visibility: hidden;
}

/* This sets the color of the information about each track */
a.tp3:link,
a.tp3:visited,
.no-touch a.tp3:hover,
a.tp3:focus,
a.tp3:active {
	color: #000099; /* dark blue */
}

.no-touch .ts-li:hover a.tp3 { /* check for whether a is needed */
    /* display: block; */
    visibility: visible;
}	

/* .no-touch a.tp2:hover a.tp3 {
	display: block;
	visibility: visible;
	z-index: 4;
} */

/* ==================================== End of trackslist portions ===================================== */
/* ========================================= No-solution portion ======================================= */

/* .go-over_2 a { 
    text-decoration: none;
} */


.jp-no-solution {
	position: absolute;
	width:140px;
	margin:0px 0px 0px -1px;
	padding: 2px 3px 2px 3px;
	font-size:.9em;
	background-color: #FEFDE5; /* "Antique ivory!" */ 
	border:1px solid #7f7f7f; /* medium-dark grey */
	display:none;
	z-index:1; /* Brings the "no-solution" announcement to the top, stackwise */
}

.jp-no-solution span {
	font-size: 1em;
	display: block;
	text-align: center;
	font-weight: bold;
}

.jp-no-solution a {
	color: blue;
}

/* ==================================== End of No-soltuion portion ===================================== */
/* ========================================= Autohidebox portion ======================================= */

.autohidebox { /* contains ul.base-play-info, div.jp-controls, ul.jp-monitor */ 
	top: 7px; /* together with position: relative, this is measured from the end of ul.trackslist */
	left: 0;
	position: relative; /* added 2014-07-21 */
	width: 148px;
/* height: 82px; */
	padding: 0 0 3px 0;
/*		margin: 2px 0px 0px 0px;
	overflow: visible; */
	margin: 0 0 30px 0;
	display:inline-block;
	font-size: inherit;
	font-family:/* Verdana, Arial, */ sans-serif;
	color: #3A91BC; /* dull sky blue */
}

.state_1 {
	visibility:hidden;
}

.state_2 {
	visibility:inherit; /* changed from inherit */
}

/* ==================================== End of Autohidebox portion ===================================== */
/* ========================================= Read-back portion ======================================= */

.base-play-info {
	list-style-type:none;
	padding:0 0 0 0;
	margin:0;
	position: relative; /* to .autohidebox */
}

.readback {
	height:20px;
	width:140px;
	position:static; /* to: base-play-info */
/*	font-size: .75em; */
	padding:0 0 0 0;
	margin: 0 0 0 4px;
	font-size:10pt;
	font-style:oblique;
	/* visibility: visible; */
	visibility: inherit;
}

.play-state {
	top: 0;
	height:15px;
	position: relative;
	line-height: 14px;
}

.track-name {
	top: 2px;
	height: 15px;
	position: relative;
	margin-left: 3px;
	font-weight:bold;
	font-size:larger;
	line-height: 20px;
}

/* ====================================== End of Read-back portion ====================================== */
/* ======================================== jp-controls portion ========================================= */

.jp-controls { /* Contains percent/extra-play-info, jp-mute, jp-unmute, jp-volume-max, & now jp-volume-bar, jp-gui, div.jp-timeholder, 6 divs for play-buttons */
	/* list-style-type:none; */
	top: 0;
	left: 0;
/*	height: 66px; */
	width: 147px;
	padding:0;
	margin: 0 0 20px 0;
	position: relative;
/*	display: block; */
	visibility: inherit;
/*	visibility: visible; */
}

/* ==================================== End of jp-controls portion ==================================== */
/* ========================================== Percent portion ========================================= */

.percent_1 {
	top: 0;
	left: 4px; /* 3px if a left-border of 1px is used for .jp-controls */
	position: relative;
	height:13px;
	width:40px;
	padding: 0;
	margin: 8px 0 0 0;
	line-height: 12px;
	font-size:9pt;
	font-style:oblique;
	/* visibility: visible; */
	visibility: inherit;
}

/* ======================================= End of Percent portion ===================================== */
/* ==================================== Sound control portion ======================================== */

a.jp-mute,
a.jp-unmute,
a.jp-volume-max {
	top:1px;
	margin: -8px 0 0 0; /* If jp-controls has a top border the top margin needs to be 0 */
	height:15px;
	width:18px;
	position: absolute;
	z-index: 3;
}

/*  style="right: 0px; position:absolute Note: with relative, only top and left can be used */
a.jp-mute {
	left: 53px; /* 52px if a left-border of 1px is used for .jp-controls */	
	background: url("../player/skinpallette.png") -60px -170px no-repeat;
}

a.jp-unmute {
	left: 53px; /* 52px if a left-border of 1px is used for .jp-controls */
	background: url("../player/skinpallette.png") 0 -170px no-repeat;
}

a.jp-volume-max {
	left: 126px; /* 125px if a left-border of 1px is used for .jp-controls */	
	background: url("../player/skinpallette.png") 0 -186px no-repeat;
}

.no-touch a.jp-mute:hover {
	background: url("../player/skinpallette.png") -79px -170px no-repeat;
}

.no-touch a.jp-unmute:hover {
	background: url("../player/skinpallette.png") -19px -170px no-repeat;
}

.no-touch a.jp-volume-max:hover {
 	background: url("../player/skinpallette.png") -19px -186px no-repeat;
}

a.jp-mute span,
a.jp-unmute span,
a.jp-volume-max span { /* the hover text */
    top: 30px;
	left: 17px; /* 16px if a left-border of 1px is used for .jp-controls */
	position: absolute;
	height:auto;
	width:auto;
	margin: 0;
	padding: 2px 3px 3px 3px;
	display: none; /* Setting this to block makes the text appear but not in the right layer.  It also makes
    	the words Play Cancel Max-volume etc appear, also formatted wrongly. */
    overflow: visible;
	background-color: #FEFDE5; /* "Antique ivory!" */
	border: 1px solid #666; /* slate grey */
	font-size: 9pt;
	line-height:15px;
	font-style: normal;
	color:black;
	text-decoration: none;
	white-space: nowrap;
}

.no-touch a.jp-mute:hover span,
.no-touch a.jp-unmute:hover span,
.no-touch a.jp-volume-max:hover span {
    display: inline-block;
}

.jp-volume-bar {
	top: 6px;
	left:76px; /* 75px if a left-border of 1px is used for .jp-controls */
	position: absolute;
	margin: -8px 0 0 0; /* If jp-controls has a top border the top margin needs to be 0 */
	height:5px;
	width:46px;
	overflow:visible;
	background: url("../player/skinpallette.png") 0 -250px repeat-x;
	cursor: default;
	/* visibility: visible; */
	visibility: inherit;
	z-index: 3;
}

.jp-volume-bar span { /* used for volume and progress bars */
    top: 22px;
    left: 12px;
    position: absolute;
    width: auto;
	padding: 3px 3px 4px 3px;
    margin: 0px;
    background-color: #FEFDE5; /* "Antique ivory!" */
	border: solid 1px #ccc; /* fairly light grey */
    white-space: nowrap;
	font-size: 9pt;
	line-height:15px;
    font-style: normal;
	color:black;
	display: none;
}

.no-touch .jp-volume-bar:hover span {
    display: inline-block;
}

.jp-volume-bar-value {
	background: url("../player/skinpallette.png") 0 -256px repeat-x;
	width:46px;
	height:5px;
}

/* ================================ End of Sound-control portion ===================================== */
/* ================================ Play position gui portion ======================================== */

.jp-gui {
	top: 0;
	left: 4px; /* 3px if a left-border of 1px is used for .jp-controls */
	height:8px;
	width:144px;
	position: relative; */ /* Relative to .jp-controls */
	margin: 4px 0 0 0;
}
 
/* .jp-interface {
	height:8px;
} */

.jp-progress { /* the grey bar upon which the seek-bar rides */
	top:0;
	left:0;
	position: relative;
	height:100%;
	width:100%;
	overflow:visible;
	background-color: #ddd; /* light grey */
	z-index: 2;
	/* visibility: visible; */
	visibility: inherit;
	display: inline-block;
}

.jp-progress span {
    top: 22px;
    left: 12px;
    position: absolute;
	height: auto;
	width: auto;
	padding: 3px 3px 4px 3px;
    margin: 0px;
    background-color: #FEFDE5; /* "Antique ivory!" */
	border: solid 1px #ccc; /* fairly light grey */
    white-space: nowrap;
	font-family: sans-serif;
    font-style: normal;
	font-size: 9pt;
	line-height:15px;
	color:black;
	display: none;
}

.no-touch .jp-progress:hover span {
        display: inline-block;
}

.jp-seek-bar {
	background: url("../player/skinpallette.png") 0 -202px repeat-x;
	width:0px;
	height:100%;
	cursor: pointer;
	visibility: visible;
	display: inline-block;
}

.jp-play-bar {
	background: url("../player/skinpallette.png") 0 -218px repeat-x ;
	width:0px;
	height:100%;
	visibility: visible;
	display: inline-block;
}

.jp-seeking-bg { /* Not quite sure what this relates to.  It's probably controlled in jPlayer jS */
	background: url("../player/seekpallette.gif");
}

/* ================================= End of Play position gui portion ================================= */
/* =========================== Position and duration numerics portion ================================ */

.jp-time-holder { /* holds played-time and track-duration numerical readouts */
	top: 0px;
	left: 4px; /* 3px if a left-border of 1px is used for .jp-controls */
	width: 140px;
	height: 11px;
	position: relative;
	font-size:9pt;
	line-height: 10px;
	font-style:oblique;
	/* visibility: visible; */
	visibility: inherit;
	display: inline-block;
}

.jp-current-time,
.jp-duration {
	width:60px;
	height: 11px;
	font-size:9pt;
	line-height:inherit;
	font-style:oblique;
}

.jp-current-time {
	float: left;
}

.jp-duration {
	float: right;
	text-align: right;
}

/* ======================= End of Position and duration numerics portion ============================= */
/* ==================================== Play-buttons portion ========================================= */

/* .jp-controls-playxxx {
	list-style-type:none;
	top: 42px;
	left: 0;
	min-height: 108px;
	padding:0;
	margin:0;
	position: relative;
} */

.state_3,
.state_5 {
	visibility:inherit; /* changed from inherit */
}

.state_4 {
	visibility:hidden;
}

a.play1,
a.jp-pause,
a.unpause1,
a.jp-stopx,
a.stopped1,
a.cancel_1 {
	top:45px;
	position: absolute;
	margin: -8px 0 0 0; /* If jp-controls has a top border the top margin needs to be 0 */
	height:15px;
	width:42px;
	z-index: 1;
}

a.play1,
a.jp-pause,
a.unpause1 {
	left: 3px;	
}

a.jp-stopx,
a.stopped1 {
	left: 52px;	
}

a.cancel_1 {
	left: 101px;	
}

a.play1 {
	background: url("../player/skinpallette.png") 0 0 no-repeat;
}

a.jp-pause {
	background: url("../player/skinpallette.png") 0 -17px no-repeat;
	display: none;
}

a.unpause1 {
	background: url("../player/skinpallette.png") 0 -68px no-repeat;
}

a.jp-stopx {
	background: url("../player/skinpallette.png") 0 -34px no-repeat;
}

a.stopped1 {
	background: url("../player/skinpallette.png") -86px -17px no-repeat;
}

a.cancel_1 {
	background: url("../player/skinpallette.png") 0 -51px no-repeat;
}

a.play1 span,
a.jp-pause span,
a.unpause1 span,
a.jp-stopx span,
a.cancel_1 span { /* the hover text */
    top: 30px;
	left: 15px;
	position: absolute;
	height:auto;
	width:auto;
	margin: 0;
	padding: 2px 3px 3px 3px;
	display: none; /* Setting this to block makes the text appear but not in the right layer.  It also makes
    	the words Play Cancel Max-volume etc appear, also formatted wrongly. */
    overflow: visible;
	background-color: #FEFDE5; /* "Antique ivory!" */
	border: 1px solid #666; /* slate grey */
	font-size: 9pt;
	line-height:15px;
	font-style: normal;
	color:black;
	text-decoration: none;
	white-space: nowrap;
}
/*
.no-touch .go-over_2 a.state_3:hover span {
    display: inline-block;
}
*/

.no-touch a.play1:hover {
	background: url("../player/skinpallette.png") -43px 0 no-repeat;
}

.no-touch a.jp-pause:hover {
	background: url("../player/skinpallette.png") -43px -17px no-repeat;
}

.no-touch a.unpause1:hover {
	background: url("../player/skinpallette.png") -43px -68px no-repeat;
}

.no-touch a.jp-stopx:hover {
	background: url("../player/skinpallette.png") -43px -34px no-repeat;
}

.no-touch a.stopped1:hover {
	background: url("../player/skinpallette.png") -86px -17px no-repeat;
}

.no-touch a.cancel_1:hover {
	background: url("../player/skinpallette.png") -43px -51px no-repeat;
}

.no-touch a.play1:hover span,
.no-touch a.jp-pause:hover span,
.no-touch a.unpause1:hover span,
.no-touch a.jp-stopx:hover span,
.no-touch a.stopped1:hover span,
.no-touch a.cancel_1:hover span {
    display: inline-block;
}

/* ================================== End of Play-buttons portion ==================================== */
/* =========================== Play control-parameters monitoring portion ============================ */

.jp-monitor {
	list-style-type:none;
	top: 5px;
	top: 0px;
	left: 0;
/*	display: inline-block; */
	display: none; 
	visibility: hidden;
	min-height: 220px;
	padding: 0 0 5px 20px;
	margin:1px 2px 0 2px;
	position:relative;
	line-height:13px;
	font-size:10px;
}

.show_control_1,
.show_control_2,
.show_control_3,
.show_control_4,
.show_control_5,
.show_control_6,
.show_control_9,
.show_control_7,
.show_control_8,
.show_control_10 {
	left: 0;
	padding: 0 10px 0 0;
	margin: 0 0 0 -20px;
	display:none;
	width:22px;
	height:13px;
	color:#00008B
}

/* =========================== End of Play control-parameters monitoring portion ===================== */
/* =========================================== Floater portion ======================================= */


.floater1 { /* Formatting here intended to match that used in the hover boxes */
	top: 138px;
	left: 235px;
	height: auto;
	width: auto;
	/* max-width: 700px; */ /* inserted to study html in testing other code */
	position: absolute;
	padding: 5px 6px 5px 9px;
	margin: 0 0 0 0;
	overflow:visible;
	display: block;
	line-height: 16px;
	white-space: nowrap; /* turned off to study html in testing other code */
	text-decoration: none;
	z-index: 1; /* Could be 0, but 1 is safer. */
	font-family:"Times New Roman", Times, serif;
	/* font-family:monospace; */ /* inserted only for html study */
	font-size: .9em;
	color: #000099; /* dark blue */
	background-color:#FEFDE5; /* "Antique ivory!" */
	border: 1px #C6C6C6 solid; /* medium-light grey */
	visibility: hidden;
}

/* ===================================================================================================== */
								/* END OF JPLAYER SECTION */
/* ===================================================================================================== */


.column_main_area_2_balance {
	top: 0;
	width: auto;
	min-height: 400px;
	padding: 25px 25px 25px 25px;
	margin: 0 0 0 200px;
}

#page_area_3_foot {
	padding: 10px 25px 10px 25px;
	font-size: 83%;
}

.footer_box_1_left {
	top: 0;
	width: 200px;
	float: left;
}

.footer_box_2_right {
	top: 0;
	width: 200px;
	float: right;
	text-align: right;
}

.footer_box_3_center {
	top: 0;
	/* max-width: 196px; */
	padding: 0 30px 0 30px;
	margin: 0 200px 0 200px;
	text-align: center;
	line-height: 20px;
}

.imaginary_line {
	top: 0;
	position: relative;
	height: 0;
	clear: both;
	width: 100%;
}

hr {
	color:#7F7F7F; /* medium-dark grey */
}

/* The next group tightens-up left-column divs */
.tight {
	margin-top:-5px;
	margin-bottom:-5px;
} 
.imaginary_line2 {
	top: 0;
	position: relative;
	height: 2px; /* differs from .imaginary_line, which is 0 */
	clear: both;
/* 	width: 100%; */
	width: 144px;
	display: inline-block;
}
