@charset "UTF-8";
/* CSS Document */

#jfhome, 
#jfbio,
#jfcontact,
#jftrain,
#jfmedia,
#jfnews,
#jftesti {
	margin: 0;
	padding: 0;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10pt;
	color: #ABB2A0;
	text-align: center;
	background: url(images/BkGrad.png) repeat-x left top #000000;
}

#wrap {
	background-color: #000;
	width: 800px;
	height: 600px;
	margin: 0 auto;
	position: relative;
	border: 1px solid #FFFFFF;
	border-top: none;
}

#wrap img.base {
	position:absolute;
	top:0;
	left:0;
}

#jfcontact #wrap, 
#jftrain #wrap,
#jfbio #wrap,
#jfmedia #wrap,
#jfnews #wrap,
#jftesti #wrap {
	height:auto;
}

#jfnews #wrap {
	padding-bottom:10px;

}

#jftesti #wrap {
	width:700px;
}

#logo {
	background1: url(images/logo2_ie.png) no-repeat center 260px;
	position: relative;
	top:0;
	left:0;
	width:800px;
	height: 360px;
	z-index:10;
}

#jfnews #logo,
#jftesti #logo {
	height:70px;
	width:auto;
}

#logo img.base {
	position:absolute;
	top:260px;
	left:22px;
}

#jfnews img.base,
#jftesti img.base {
	top:10px;
	width:500px;
	left:100px;
}

.footer {
	height: 50px;
	position: relative;
	top:200px;
}

#jftrain .footer,
#jfcontact .footer,
#jfbio .footer,
#jfmedia .footer,
#jfnews .footer,
#jftesti .footer {
	top:50px;
}

/* rollover big images */

#gallery {
	width:600px;
	margin:0 auto;
	position: absolute;
	top:0;
	left:0;
}

#gallery ul {
	background:url(images/shine.gif) no-repeat right top;
	list-style:none; 
	padding-left:83px; 
	margin:550px 0 0 0; 
	position:relative;
	width:640px;
	float:left;
}

#gallery ul li {
	display:inline; 
	width:32px; 
	height:32px; 
	float:left; 
	margin:3px 0 3px 5px;
}

#gallery ul li a {
	display:block; 
	width:30px; 
	height:30px; 
	text-decoration:none; 
	border:1px solid #bfc3b5;
}

#gallery ul li a img {
	display:block; 
	width:30px; 
	height:30px; 
	border:0;
}

#gallery ul li a:hover {
	white-space:normal; 
	border-color:#BFC3B5;
}

#gallery ul li a:hover img {
	position:absolute; 
	left:0; 
	top:-560px;
	width:auto; 
	height:auto; 
}

/* ------nav------ */
.menu,
.menusub {
	width: 530px;
	height:40px;
	margin: 0 auto;
	z-index:8;
	position:relative;
}

#jftesti .menu {
	left:14px;
}

a, 
a:link, 
a:active, 
a:visited {
	height: 20px;
	text-transform:uppercase;
	text-align:right;
}

a:hover {
	
	
}

.roll1, 
.roll2, 
.roll3, 
.roll4, 
.roll5,
.roll6,
.roll7,
.roll8,
.roll9,
.roll10,
.roll11 {
	background: url(images/menu2.png) no-repeat left top;
	width: 90px;
	display:block;
	float: left;
	position: relative;
}

.roll1{
}

.roll1:hover,
.roll1:active, 
#jfhome .roll1 {
	background-position:left -20px;
}

.roll2{
	width: 75px;
	background-position:-90px top;
}

.roll2:hover,
.roll2:active, 
#jfbio .roll2 {
	background-position:-90px -20px;
}

.roll3{
	width:135px;
	background-position:-165px top;
}

.roll3:hover,
.roll3:active,
#jftrain .roll3 {
	background-position:-165px -20px;
}

.roll4 {
	width: 100px;
	background-position: -300px top;
}

.roll4:hover,
.roll4:active,
#jfmedia .roll4 {
	background-position:-300px -20px;
}

.roll5 {
	width: 120px;
	background-position: -400px top;
}

.roll5:hover,
.roll5:active, 
#jfcontact .roll5 {
	background-position:-400px -20px;
}

.roll6 {
	width: 100px;
	background-position:0 -40px;
}

.roll6:hover,
.roll6:active {
	background-position:0 -60px;
}

.roll7 {
	width: 180px;
	background-position:-100px -40px;
}

.roll7:hover,
.roll7:active {
	background-position:-100px -60px;
}

.roll8 {
	width: 140px;
	margin-left:10px;
	background-position: -280px -40px;
}

.roll8:hover,
.roll8:active {
	background-position:-280px -60px;
}

.roll9 {
	width:235px;
	background-position:-420px -40px;
}

.roll9:hover,
.roll9:active {
	background-position:-420px -60px;
}

.roll10 {
	width:200px;
	margin-left:10px;	
	background-position:0px -80px;
}

.roll10:hover,
.roll10:active {
	background-position:0px -100px;
}

.roll11 {
	width:200px;
	background-position:200px -80px;
}

.roll11:hover,
.roll11:active {
	background-position:200px -100px;
}

/* to use picture gallery menu, make roll11 background-postion:-200px -80;... i have hidden this link until we get some images*/



.main {
	position:absolute;
	left:82px;
	width: 750px;
	height:130px;
	margin: 0px auto;
	padding: 0;
	clear:both;
	z-index:20;

}

#jfbio .main,
#jftrain .main,
#jfmedia .main,
#jfnews .main {
	overflow:scroll;
	overflow-y:hidden;
	overflow-x:hidden;
	height:280px;
	margin-top:20px;
	position:relative;
	left:0;
}

#jfhome .main {
	width:640px;
}

#jfcontact .main {
	position:relative;
	left:0;
	height:auto;
	margin-bottom:0;
	width:640px;

}

#jfnews .main {
	width:760px;
	height:500px;
	margin-top:0;

} 

#jftesti .main {
	top:-70px;
	left:0;
	height:500px;
	width:650px;
	overflow:hidden;
	position:relative;
}

#jfbio .main {
	height:400px;
}

#jfmedia .main {
	height:300px;
}



.txt {
	position:relative;
	overflow:scroll;
	overflow-x:hidden;
	height:280px;
	margin-bottom:100px;
}

#jftesti .txt {
	height:480px;
	overflow: hidden;
	top:80px;
}

#jftesti .txt2 {
	top:80px;
}

#jfnews .txt {
	height:540px;
}

#jfbio .txt {
	height:450px;
	overflow:hidden;
}

#jfmedia .txt {
	height:290px;
}

.txt img {
	display:block;
	position:relative;
	width:50px;
	height:50px;
	float:left;
	margin-right:10px;
	margin-bottom:10px;
	border: solid #fff 1px;
}

#jfnews .txt img {
	width:150px;
	height:150px;

}

#jftrain .txt img,
#jfbio .txt img{
	width:80px;
	height:80px;
	margin:0 30px 5px 0px;
}

#jfbio .txt img.sml1 {
	height:120px;
	
}

.pics1,
.pics2 {
	width:100px;
	height:450px;
	float:left;
}

.pics2 {
	margin-left:110px;
}

hr {
	margin:5px;
	clear:both;
}

.tsmnav {
	text-align:right;
	text-transform:uppercase;
	margin:20px;
	color:#FFFFFF;
	
}

p, h2, h3, li, ul {
	margin:0;
	padding:0;
	text-align: left;

}

ul {
	padding-left:130px;
}

#jfbio .txt h2 {
	clear:;
}

h2, h3 {
	padding-bottom: 1ex;
	font-size: 12pt;
	font-style:italic;
}

h3 {
	color:#0000FF;
	text-align: center;
}

h2.contact {
	text-align:center;
	margin-top:30px;
	color:#FFF;
}

p {
	padding-bottom: 0.5em;
	line-height: 1.3em;
}

.txt p {
	width:730px;
}

#jftesti .txt p {
	width:auto;
}

#jfnews .txt p {
	width:750px;

}

#contform {
	text-align:left;
	margin:0;
	padding:0;

}

.details {
	margin: 0 0 15px 0;
	padding: 0 0 5px 0;
	border-bottom: 1px;
	border-bottom-color: #FFFFFF;
	height:auto;
	clear:both;

}

.right1 {
	display:block;
	float:left;
	width: 18em;
	margin:5px 15px 0 50px;
	padding:0px;
	text-align:right;
	clear:both
}

input, radio, textarea {
	margin:5px 0;

}

form {
	margin:0;
	padding:0;

}

form div {
	height:auto;
	clear:left;

}

.hsp3 {
	padding-left:1em;

}

img {
	position:relative;

}

.pad {
	height:300px;
	overflow:hidden;
	display:block;
	
}