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

/******************************************************************
 DEFAULT /  font-size: see CSS Mastery p144
******************************************************************/
* {
	margin:0;
	border:0;
	padding:0;
	font-family:Arial, Helvetica, sans-serif;
/*	color:DimGray;*/
	line-height:1.3em;}
	
body {
	font-size:62.5%;}

em {
	font-style:normal;
	color:#FF9933;}

table {
	border-spacing:none;
	text-align:left;}

p {
	font-size:1.2em;
	padding-top:0.5em;
	padding-left:0.5em;}

li {
	font-size:1em;}
	
blockquote {
	font-size:1em;
	font-style:italic;
	padding-top:0.5em;
	padding-left:1em;}

a:hover {
	color:#00CCFF;}

div.clear {
	padding-top:2em;
	clear:both;}

div.clearnospace {
	clear:both;}

.hidden {
	display:none;}

.tooltip {
	position:relative;}

.spantip {
	position:relative;}

	.tooltip div,
	.spantip span {
		display:none;
		text-align:left;
		color:#708090;
		padding:0;
		background-color:#FFFFFF;
/*		border:solid thin #FFE4B5; */
/*		border:solid 0.4em #FFFF99; */
		border:solid 0.4em #669999;		
		z-index:1000;
		box-shadow: 5px 5px 8px #C0C0C0;
		-webkit-box-shadow: 5px 5px 8px #C0C0C0;
		-moz-box-shadow: 5px 5px 8px #C0C0C0;
		filter: progid:DXImageTransform.Microsoft.dropShadow(color=#C0C0C0, offX=5, offY=5, positive=true);}

	.tooltip div h3,
	.tooltip div p,
	.tooltip div ul {
		text-align:left;
		margin:0;
		padding:0.2em;}

	.spantip span {
		font-size:1.2em;
		padding:0.2em;}

	.tooltip div h3 {
		font-size:1.5em;
		color:#FFFFFF;
/*		color:#669999; */
/*		background-color:#FFE4B5; */
		background-color: #669999}

	.tooltip:hover div,
	.spantip:hover span {
		display: block;
		position:absolute;
		width:16em;
		top:6em;
		left:-4em;}


/******************************************************************
INDEX.PHP
******************************************************************/
body#background {
	background:#CFCFCF url(/img/back-gradient.jpg) repeat-x;
	text-align:center;
	min-width:80em;}

#wrapper {
	width:80em;
	margin:0 auto;
	text-align:left;
	margin-top:1em;}


#wrapheader {
	clear:both;
	width:80em;}

#wraptranslate {
	width:80em;
	height:0.2em;
	text-align:right;}

	#wraplogo {
		width:13em;
		float:left;}
		
		#wraplogo img {
			width:12em;
			height:9em;} 
				
		/* See book BFW page 18 */
/*		#wraplogo h1 {
			text-indent:-999em;
			background: url(/images/tmanco-logo-img43s.png) no-repeat center;
			width:16em;
			height:12em;}
*/
	
	#wraptmanco {
		width:15em;
		float:left;
		text-align:left;
		margin-top:0.7em;}
				
		h2#wraptmanco1,
		h2#wraptmanco2,
		h2#wraptmanco3 {
			font-size:1.3em;
			line-height:1.5em;
			font-weight:normal;
			color:#669999;
			vertical-align:middle;}

		h2#wraptmanco1 {
			letter-spacing:1em;}

		h2#wraptmanco2 {
			letter-spacing:0.5em;}

		h2#wraptmanco3 {
			letter-spacing:0.5em;}
						
		#wraptmanco * span {
			color:#FF6600;}
	
	#wrapchat {
		width:8em;
		float:left;
		color:#669999;
		font-size:1em;
		text-align:center;}
		
		#wrapchat img {
			width:5em;
			height:5em;}

		#wrapchat:hover span {
			text-align:center;
			top:6.5em;
			left:-4em;
			width:22em;
			left:-8em;}
			
			#wrapchat:hover span img {
				width:10em;
				height:12em;}
	
	#wrapscreensharing {
		width:8em;
		float:left;
		color:#669999;
		font-size:1em;
		text-align:center;}

		#wrapscreensharing img {
			width:5em;
			height:5em;}

		#wrapscreensharing:hover div {
			width:25em;
			top:8em;
			left:-8em;}

	#wrapfacebook {
		width:8em;
		float:left;
		color:#669999;
		font-size:1em;
		text-align:center;}
		
		#wrapfacebook img {
			margin-top:0.5em;
			width:5em;
			height:5em;}
			
		#wrapfacebook:hover div {
			width:25em;
			top:8em;
			left:-8em;}
		
	#wrapsearch {
		margin-top:3em;
		width:15em;
		float:left;
		color:#669999;
		font-size:1em;
		text-align:center;}
				
	#wraplang {
		margin-top:4.5em;
		width:12em;
		float:right;
		text-align:right;}
		
/*		#wraplang p {
			margin:none;
			color:Red;
			font-size:1.2em;}
*/		
		#wraplang ul {
			list-style:none;
			padding:0;
			font-size:1.2em;
			color:#669999;
			margin-top:1em;}

			#wraplang li {
				display:inline;}

			#wraplang a:hover {
				background-color:#CCCCCC;
				padding:0.4em;}

			#wraplang a:link,
			#wraplang a:visited {
				text-decoration:none;
				color:#669999;
				padding:0.4em;}

			#wraplang em {
				background-color:#FFFFFF;
				color:#669999;
				font-weight:bold;
				padding:0.4em;}
			
			#wraplang:hover span {
				top:3em;
				left:-10em;
				font-size:1em;}
		

#wrapcontmenu {
/*	clear:both;*/
	width:inherit;
	height:auto;
	float:left;
	background:url(/img/back-contmenu.jpg) repeat-y;}

	#wrapbanner {
/*		clear:both;*/
		width:inherit;
		float:left;}
	
		#wrapbanner img {
			width:100%;}


	/******************************************************************
	MENU
	******************************************************************/
		
	#wrapmenu {
		width:15em;
		height:inherit;
		float:right;
		margin-top:6.3em;
		color:#669999;}

		.parent_menu_out,
		.parent_menu_over,
		.parent_menu_active,
		.parent_menu_child_active{
			font-size:1.2em;
			height:2em;
			cursor:pointer;}
	
		.child_menu_out, 
		.child_menu_over, 
		.child_menu_active {
			padding-left:1em;
			font-size:1.2em;
			height:2em;
			cursor:pointer;}
	
	
		.child_menu_over,
		.parent_menu_over{
			background:#CCCCCC;}
			
		.child_menu_active,
		.parent_menu_active{
			background: #FFFFFF;
			color:#FF9933;}
		
		#wrapmenu address, #wrapmenu address a {
			font-size:1em;
			color:#669999;}
		
		#wrapmenu address {
			padding:5em 1em 1em 1em;}

		#wrapmenu p>a{
			color:#669999;
			text-decoration:none;}
	
		#wrapmenu p:hover span{
			font-size:1em;
			width:20em;
			text-align:left;
			top:3em;
			left:-5em;}

			/*-----------------------------------------------------------------
			vipmenu
			------------------------------------------------------------------*/
/*
			#vipmenu div {
				width:15em;
				height:inherit;
				float:right;
				margin-top:0.8em;
				color:#669999;}			

			#vipmenu div>a{
				font-size:1.2em;
				color:#669999;
				text-decoration:none;}

				#vipmenu:hover div {
					width:20em;
					text-align:left;
					top:0em;
					left:-5em;}
*/
		
	#wrapcontent {
		width:65em;
		height:inherit;
		float:left;
		background-color:White;}

	#wrapfooter {
/*		clear:both;*/
		width:inherit;
		float:left;}

#wrapcopyright {
/*	clear:both;*/
	width:inherit;
	float:right;
	text-align:right;
	padding-top:0.3em;}
	
	#wrapcopyright p,
	#wrapcopyright a {
		color:#669999;}

/******************************************************************
CONTENT
******************************************************************/
body#con {
	margin:0;
	border:0;
	padding:0;}

div#content {
	width:65em;
	float:left;
	margin:0;
	border:0;
	padding:0;
	font-size:1em;
	color:DimGray;
	font-family:Geneva, Arial, Helvetica, sans-serif;}
	
	div#tagline {
		width:65em;
		height:7em;
		padding-top:0.3em;
		padding-bottom:0.3em;
		text-align:center;
		color:#669999;
		background-color:#E8E8E8;}
		
	#tagline h1 {
		font-size:2.2em;}

	#content h2 {
		padding-top:1em;
		font-size:1.5em;
		color:#669999;
		text-align:left;}
	
	#content img {
		text-align:center;
		padding-top: 1em;}
	
	#content ul {
		margin-left: 2em;}
	
	#content li {
		font-size:1.2em;}
		
	#content ul.doclang {
		list-style:none;
		padding:0;
		font-size:1em;
		margin-left:0;}

	#content ul.doclang li {
			display:inline;
			padding:0.2em;}


/*-----------------------------------------------------------------
content 2 columns, medium image column left, text column right
------------------------------------------------------------------*/
.content-ful {
	width:61em;
	text-align:left;}

	.content-ful img[src*="img21s"] {
		padding-left:40em;
		width:10em;
		height:5em;}

	.content-ful img[src*="img41"] {
		width:40em;
		height:10em;}
			
.content-txt {
	width:39em;
	float:right;
	padding:0.3em;}
	

.content-img {
	width:24em;
	float:left;
	padding:0.3em;
	margin-bottom:2em;
	text-align:center;}
	
	.content-img p {
		padding-left:0.5em;
		padding-top:0.5em;
		text-align:left;}

	.content-img address {
		padding-left:5em;
		padding-top:2em;
		text-align:left;}

	.content-img:hover div {
		width:60em;
		text-align:center;
		top:-15em;
		left:15em;}

	.content-img img[src*="img11"] {
		width:24em;
		height:24em;}

		.content-img:hover div img[src*="img11"] {
			width:60em;
			height:60em;}

	.content-img img[src*="img11s"] {
		width:12em;
		height:12em;}

	.content-img img[src*="img21"] {
		width:24em;
		height:12em;}

		.content-img:hover div img[src*="img21"] {
			width:60em;
			height:30em;}

	.content-img img[src*="img23"] {
		width:24em;
		height:36em;}

		.content-img:hover div img[src*="img23"] {
			width:60em;
			height:90em;}

	.content-img img[src*="img23s"] {
		width:16em;
		height:24em;}

	.content-img img[src*="img31"] {
		width:24em;
		height:8em;}

	.content-img img[src*="img32"] {
		width:24em;
		height:16em;}

		.content-img:hover div img[src*="img32"] {
			width:60em;
			height:40em;}
	
	.content-img img[src*="img34"] {
		width:24em;
		height:32em;}

		.content-img:hover div img[src*="img34"] {
			width:60em;
			height:80em;}		

	.content-img img[src*="img43"] {
		width:24em;
		height:18em;}

		.content-img:hover div img[src*="img43"] {
			width:60em;
			height:40em;}

	.content-img img[src*="img54"] {
		width:24em;
		height:20em;}

/*-----------------------------------------------------------------
content 2 columns, small image column left, text column right
------------------------------------------------------------------*/
.content-s-txt {
	width:51em;
	float:right;
	padding:0.3em;
	margin-bottom:2em;}
	
.content-s-img {
	width:12em;
	float:left;
	padding:0.3em;
	text-align:center;}

	.content-s-img img {
		margin-top:1.5em;}
		
	.content-s-img img[src*="img21s"] {
		width:8em;
		height:4em;}

	.content-s-img img[src*="img23s"] {
		width:8em;
		height:12em;}

	.content-s-img img[src*="img43s"] {
		width:8em;
		height:6em;}	


/******************************************************************
CONTACT FORM
******************************************************************/

form.contact div {
	font-size: 1.2em;
	clear: left;
	margin: 0;
	padding: 0;
	padding-top: 0.6em;}

form.contact div label {
	color: #FF9933;
	float: left;
	width: 12em;
	margin-right:1em;
	text-align:right;}

form.contact input[type="text"], form.contact textarea{
	color: #333333;
	background-color: #F0F0F0;
	width:30em;}

form.contact input[type="checkbox"]{
	width:2em;}

form.contact input[type="radio"] {
	width:2em;}

form.contact div input[type="submit"] {
	float:left;
	margin-left:25em;
	width:5em;
	color: dimgray;
	background-color: #F0F0F0;
	border: 0.1em outset dimgray;}


/******************************************************************
LINK
******************************************************************/
		
div#link {
	clear:both;
	width:78em;
	float:left;
	padding:1em;
	margin:1em;}
	
	#linkitem {
		max-width:25em;
		float:left;
		text-align:center;}
	
	#linkblank {
		height:5em;}