/*>>>> GLOBAL STYLES <<<< */

html, body {
margin:0px;
padding:0px;
background-color:#657E94;
}

p {
font-family:Geneva, Arial, Helvetica, sans-serif;
font-size:13px;
text-align: justify;
padding: 6px;
color: #000000;
}

h1 {
font-family: Geneva, Arial, Helvetica, sans-serif;
font-size: 36pt;
font-style: italic;
font-weight: bold;
color: #000000;
}

h2 {
font-family: Geneva, Arial, Helvetica, sans-serif;
font-size: 24pt;
font-style: italic;
font-weight: bold;
color: #000000;
}

h3 {
font-family: Geneva, Arial, Helvetica, sans-serif;
font-size: 18pt;
font-style: italic;
font-weight: bold;
color: #000000;
}

h2.updates {margin:15px 0 -5px 0;font-family: Geneva, Arial, Helvetica, sans-serif;font-size: 14px;font-weight: bold;color: #000000;padding: 0px 6px 0px 6px;}
h3.updates {margin:30px 0 -5px 0;font-family: Geneva, Arial, Helvetica, sans-serif;font-size: 13px;font-style:italic;font-weight: bold;color: #000000;padding: 0px 6px 0px 6px;}

h4 {
font-family: Geneva, Arial, Helvetica, sans-serif;
font-size: 16pt;
font-style: italic;
font-weight: bold;
color: #000000;
}

h5 {
font-family: Geneva, Arial, Helvetica, sans-serif;
font-size: 14pt;
font-weight: bold;
color: #000000;
font-style: italic;
padding:6px;
}

h6 {
font-family: Geneva, Arial, Helvetica, sans-serif;
font-size: 12pt;
font-weight: bold;
color: #000000;
text-align: center;
font-style: italic;
}

header {
position:relative;
top:0px;
right: auto;
left:auto;
width:720px;
height:185px;
text-align:center;
background-color:#667E94;
border:0px dotted #000000;
z-index:1;
}

nav {
position:absolute;
top:200px;
right: auto;
left:10px; /*WAS 5px */
width:700px; /*WAS 710px */
height:10px;
padding:0px;
background-color:#667E94;
border:0px dotted #000000;
z-index: 100;
}

img {
border:0;
}

a:link {
font-family: Geneva, Arial, Helvetica, sans-serif;
font-size: 13px;
color: #000000;
text-decoration: underline;
padding:1px;
}

a:visited {
font-family: Geneva, Arial, Helvetica, sans-serif;
font-size: 13px;
color: #003366;
text-decoration: underline;
padding:1px;
}

a:hover {
font-family: Geneva, Arial, Helvetica, sans-serif;
font-size: 13px;
font-weight: normal;
color: #657E9F;
text-decoration: none;
padding:1px;
}

a.footer:link {
font-family: Geneva, Arial, Helvetica, sans-serif;
font-size: 9px;
color: #000000;
text-decoration: underline;
padding:1px;
}

a.footer:visited {
font-family: Geneva, Arial, Helvetica, sans-serif;
font-size: 9px;
color: #003366;
text-decoration: underline;
padding:1px;
}

a.footer:hover {
font-family: Geneva, Arial, Helvetica, sans-serif;
font-size: 9px;
font-weight: normal;
color: #657E9F;
text-decoration: none;
padding:1px;
}

a.cp:link {
font-family: Geneva, Arial, Helvetica, sans-serif;
font-size: 13px;
color: #000000;
text-decoration: underline;
padding:1px;
}

a.cp:visited {
font-family: Geneva, Arial, Helvetica, sans-serif;
font-size: 13px;
color: #003366;
text-decoration: underline;
padding:1px;
}

a.cp:hover {
font-family: Geneva, Arial, Helvetica, sans-serif;
font-size: 13px;
font-weight: normal;
color: #EEEEEE;
text-decoration: underline;
padding:1px;
}


ul {
font-family: Geneva, Arial, Helvetica, sans-serif;
font-size: 13px;
color: #000000;
}

li {
font-family: Geneva, Arial, Helvetica, sans-serif;
font-size: 13px;
color: #000000;
}

/*tr {
background-color: #667E94;
}

td {
background-color: #667E94;
}*/

/*>>>> DIVISION STYLES <<<< */

#body-center {
margin:5px;
text-align:center;
border:0px solid #000000;
}

#body {
position:relative;
width:720px;
top: 0px;
margin-left:auto;
margin-right:auto;
text-align:left;
padding-bottom:10px;
background-color:#667E94;
border:solid 0px #000000;
}

#header {
position:relative;
top:0px;
right: auto;
left:auto;
width:720px;
height:185px;
text-align:center;
background-color:#667E94;
border:0px dotted #000000;
z-index:1;
}

#content-wrap {
position: relative;
top: 60px; /*WAS 60px */
left: 0px;
padding:0px 0px 10px 0px; 
width:100%; 
height: 520px;
margin:0px auto; 
background: #DDDDDD /*url(../Images/background1.gif) no-repeat*/;
color:#000;
/*border:black solid 1px;*/
border-radius: 10px;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
box-shadow:-1px 5px 10px black;
-moz-box-shadow:-1px 5px 10px black;
-webkit-box-shadow:-1px 5px 10px black;
}


#content {
position: relative;
top: 10px;
left: 0px; 
padding: 0px 5px/*5 WAS 0px */ 3px/*3 WAS 10px */ 0px; 
width:700px; 
height: 505px; /*WAS 500px*/
margin:0px auto; 
color:#000;
overflow: auto;
}

#contentB {
position: relative;
top: 65px;
left: 0px;
width: 700px;
height:540px;
padding: 10px;
background-color: #EEEEE0;
border:0px solid #000000;
overflow: auto;
}

/* OLD Properties 
#nav {
position:absolute;
top:205px;
right: auto;
left:10px; /*WAS 5px */
/*width:700px; WAS 710px 
height:10px;
padding:0px;
background-color:#667E94;
border:0px dotted #000000;
z-index: 0;
}*/

#nav {
position:absolute;
top:200px;
right: auto;
left:10px; /*WAS 5px */
width:700px; /*WAS 710px */
height:10px;
padding:0px;
background-color:#667E94;
border:0px dotted #000000;
z-index: 100;
}

/*BOX SHADOW PROPERTIES
Box shadow allows shadow effects on elements. This property takes several values:
The first value indicates the horizontal offset of the shadow. You can use a negative value to put the shadow to the left of your box.
The second value indicates the vertical offset. You can use a negative value to put the shadow above your box
The third value is the blur radius. The bigger the value, the more blurred it is.
*/

#navcontainer ul {
margin: 0px; /* originally 5px */
padding: 5px; 
list-style-type: none; 
text-align: center;
background-color: #003366;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
border-radius: 10px;
-moz-box-shadow:-1px 5px 10px black;
-webkit-box-shadow:-1px 5px 10px black;
box-shadow:-1px 5px 10px black;
}

#navcontainer ul li { 
display: inline;
}

#navcontainer ul li a { 
text-decoration: none;
padding: 0px 15px 5px 15px;
color: #CCCCCC; /* originally fff */
background-color: #036; 
border-top-right-radius: 10px;
border-top-left-radius:10px;
-moz-border-radius-topleft:10px;
-moz-border-radius-topright:10px;
-webkit-border-top-right-radius:10px;
-webkit-border-top-left-radius:10px;
}

#navcontainer ul li a:hover{
color: #fff;
background-color: #667E94;
border-top-right-radius: 10px;
border-top-left-radius:10px;
-moz-border-radius-topleft:10px;
-moz-border-radius-topright:10px;
-webkit-border-top-right-radius:10px;
-webkit-border-top-left-radius:10px;
}

body#home a#homenav,
body#updates a#updatesnav,
body#education a#educationnav,
body#music a#musicnav,
body#video a#videonav,
body#photos a#photosnav,
body#gear a#gearnav, 
body#shop a#shopnav,
body#links a#linksnav {
color: #fff;
background-color: #667E94;
border-top-right-radius: 10px;
border-top-left-radius:10px;
-moz-border-radius-topleft:10px;
-moz-border-radius-topright:10px;
-webkit-border-top-right-radius:10px;
-webkit-border-top-left-radius:10px;
}

#ctrDiv {
text-align:center;
}

#playerTable {
width:100%;
}

#playertd {
text-align:center;
}

/*>>>> CLASSES <<<< */

.tablePad {padding:0 0 0 5px;}

.pMargin0 {
margin: 0px;
}

.pHeading {
font-family: Geneva, Arial, Helvetica, sans-serif;
font-size: 14pt;
font-style: italic;
font-weight: bold;
color: #000000;
}

.video {
padding: 0 0 0 10px;
}

/*.video {
	width: 240px;
	-o-transition: all 0.5s ease-in-out;
	...
}
 
.video:hover,video:focus { width:600px; 
} */

.imgRight { 
float:right; padding: 0 0 0 8px; 
}

.imgPadTop {
border:0;
padding:5px 0 0 0;
}

.imgPadTop10 {
border:0;
padding:10px 0 0 0;
}

.imgPadTop20 {
border:0;
padding:20px 0 0 0;
}

.imgPad20 {
border:0;
padding:20px 0 20px 0;
}

.imgPad2030 {
border:0;
padding:20px 0 30px 0;
}

.centerTxt0White {
text-align:center;
margin:0px;
color: #DEDAD7;
}

.content {
width: 700px;
height:490px;
padding: 10px;
background-color: #EEEEE0;
border:0px solid #000000;
overflow: auto;
}

.shoptext {font-family:Geneva, Arial, Helvetica, sans-serif;font-size:11px;text-align:left;}

.shopPad {padding:0 0 5px 0;}

.shopMargin {margin:0 0 10px 0;}

.margin0px {
margin: 0px;
}

.margin4px {
margin: 4px;
}

.margin8px {
margin: 8px;
}

.margin20px {
margin-top: 20px;
margin-right: 10px;
margin-bottom: 10px;
margin-left: 10px;
}

.margin4pBtm {
margin: 20px 0 4px 0;
}

.margin8pBtm {
margin: 20px 0 8px 0;
}

.vertAlign {
vertical-align: middle;
}

.navText {
margin: 0px;
vertical-align: middle;
}

.copyrightStatement {
margin:0;
font-family: Geneva, Arial, Helvetica, sans-serif;
font-size: 9px;
color: #000000;
text-align: center;
font-weight: normal;
}

.smallText {
font-family: Geneva, Arial, Helvetica, sans-serif;
font-size: 10px;
}

.rightText {
text-align: right;
}

.rightTextSm {
font-family: Geneva, Arial, Helvetica, sans-serif;
font-size: 10px;
text-align: right;
}

.centerText {
text-align:center;
}

.centerText0 {
text-align:center;
margin:0px;
}

.centerText2 {
text-align:center;
margin:2px;
}

.centerText3 {
text-align:center;
margin:3px;
}

.centerText4 {
text-align:center;
margin:4px;
}

.centerText8Btm {
text-align:center;
margin:0 0 8px 0;
}

.centerText20Btm {
text-align:center;
margin:0 0 20px 0;
}

.rightText {
text-align: right;
}

.imgCenter {
text-align: center;
margin:5px 10px 5px 10px;
}

.imgCenterDiagram {
text-align: center;
margin:5px 10px 5px 10px;
background-color:#000000;
}

.h6 {
font-family: Geneva, Arial, Helvetica, sans-serif;
font-size: 12pt;
font-weight: bold;
color: #DEDAD7;
text-align: center;
}

.align-right { 
float:right; margin: 4px 0 2px 5px; 
}

.align-left { 
float:left; margin: 4px 5px 2px 0; 
}

.padLeft {
padding: 2px 0 0 5px;
}

.padRight {
padding: 2px 5px 0 0;
}

.padRightTop {padding: 5px 6px 0 0;}

.photoPadRight {
padding-right: 5px;
padding-top: 2px;
align:left;
}

.photoPadLeft {
padding-left: 5px;
padding-top: 2px;
align:right;
}

.photoPadLeftBtm {
padding: 2px 0px 2px 5px;
float:right;
}

.imgShadow{-moz-box-shadow:-1px 5px 10px black;-webkit-box-shadow:-1px 5px 10px black;box-shadow:-1px 5px 10px black;}

.imgShadow2{-moz-box-shadow:-1px 3px 10px black;-webkit-box-shadow:-1px 3px 10px black;box-shadow:-1px 3px 10px black;}