/* ==== Scroll down to find where to put your styles :) ==== */

/*  HTML5 ? Boilerplate  */

html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
	margin: 0 auto;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}

article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
  display: block;
}

blockquote, q { quotes: none; }
blockquote:before, blockquote:after,
q:before, q:after { content: ''; content: none; }
ins { background-color: #ff9; color: #000; text-decoration: none; }
mark { background-color: #ff9; color: #000; font-style: italic; font-weight: bold; }
del { text-decoration: line-through; }
abbr[title], dfn[title] { border-bottom: 1px dotted; cursor: help; }
table { border-collapse: collapse; border-spacing: 0; }
hr { display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0; }
input, select { vertical-align: middle; }

body {
	font:13px/1.231 sans-serif;
	*font-size:small; 		
	background-image: none;
	background-repeat: no-repeat;
}
select, input, textarea, button { font:99% sans-serif; }
pre, code, kbd, samp { font-family: monospace, sans-serif; }

html { overflow-y: scroll; }
a:hover, a:active { outline: none; }
ul, ol { margin-left: 2em; }
ol { list-style-type: decimal; }
nav ul, nav li { margin: 0; list-style:none; list-style-image: none; }
small { font-size: 85%; }
strong, th { font-weight: bold; }
td { vertical-align: top; }

sub, sup { font-size: 75%; line-height: 0; position: relative; }
sup { top: -0.5em; }
sub { bottom: -0.25em; }

pre { white-space: pre; white-space: pre-wrap; word-wrap: break-word; padding: 15px; }
textarea { overflow: auto; }
.ie6 legend, .ie7 legend { margin-left: -7px; }
input[type="radio"] { vertical-align: text-bottom; }
input[type="checkbox"] { vertical-align: bottom; }
.ie7 input[type="checkbox"] { vertical-align: baseline; }
.ie6 input { vertical-align: text-bottom; }
label, input[type="button"], input[type="submit"], input[type="image"], button { cursor: pointer; }
button, input, select, textarea {
	margin: 0;
	color: #000;
}
input:valid, textarea:valid   {  }
input:invalid, textarea:invalid { border-radius: 1px; -moz-box-shadow: 0px 0px 5px red; -webkit-box-shadow: 0px 0px 5px red; box-shadow: 0px 0px 5px red; }
.no-boxshadow input:invalid, .no-boxshadow textarea:invalid { background-color: #f0dddd; }

::-moz-selection{ background: #FF5E99; color:#fff; text-shadow: none; }
::selection { background:#FF5E99; color:#fff; text-shadow: none; }
a:link { -webkit-tap-highlight-color: #FF5E99; }

button {  width: auto; overflow: visible; }
.ie7 img { -ms-interpolation-mode: bicubic; }

body, select, input, textarea {
	color: #fff;
}
/*
h1, h2, h3, h4, h5, h6 {
	font-weight: bold;
	color: #FFF;
	font-size: large;
}
*/
a, a:active, a:visited {
	color: #0FF;
}
a:hover { color: #66CCFF; }


body{
	background-attachment: scroll;
	background-image: none;
	background-repeat: no-repeat;
	background-position: center top;
}

.ttw-video-player {
    top: 73px;
}
/*
.navbar {
	position: absolute;
	top: 116px;
	left: 400px;
	text-align: center;
	width: 680px;
	height: 45px;
	font-size: 10px;
	background-attachment: local;
	background-position: center top;
	padding: 0px;
	margin-top: 50px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	visibility: visible;
	background-image: url(../images/menu_back.png);
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
}
*/
#subtitle{
	width:200px;
	text-align:center;
	font-style:italic;
	color:#666;
	margin-bottom: 20px;
	background-color: #FFF;
}

#thumb-container-outer{
	margin:0 auto;
	padding-top: 20px;
	height:480px;
	width:100%;
	background:transparent url(../images/static/video-container-outer-bg.jpg) repeat-x left bottom scroll;
}

#thumb-container-inner{
	height:1200px;
	width:1200px;
	margin-top: 200;
	margin-right: auto;
	margin-bottom: 200;
	margin-left: auto;
	background-attachment: scroll;
	background-color: transparent;
	background-image: none;
	background-repeat: no-repeat;
	background-position: left bottom;
	padding-top: 50px;
}

.container {
	position: relative;
	top: 0px;
	left: auto;
	text-align: center;
	width: 1200px;
/*	
	font-size: 10px;
*/
	background-attachment: fixed;
	background-position: center top;
	padding: 0px;
	margin-top: 0px;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;
	background-repeat: no-repeat;
	background-image: none;
}

.content {
	position: relative;
	top: 0px;
	left: auto;
	text-align: center;
	width: 1200px;
/*	
	font-size: 10px;
*/
	background-image: none;
	background-attachment: local;
	background-position: center top;
	margin-top: 0px;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;
	visibility: visible;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
}
.content .video_selection {
	float: left;
}
.content .video_selection img {
	margin: 0 10px; padding: 2px; background-color: #DDD; border: 1px solid #BBB;
	width: 132px; height: 75px; cursor: pointer;
}
.content .video_selection img:hover {
	border: 2px solid #638EBC; padding: 1px;
}
.content .video_selection .video_source, .content  .video_selection .video_subtitles {
	display: none;
}

.main_container{
    background:#cccccc url(../images/static/bg.jpg) repeat 0 0 scroll;
}

        .home-btn, 
        .home-btn span {
          background-image: url(imgages/buttons/homeNorm.png); 
          height: 50px;                /* Set this to the height of the image */
        }
        .home-btn {
          line-height: 50px;        /* Adjust this so the text is vertically aligned in the middle of the button */
          padding-left: 20px;        /* Can be any value. It's the distance of the button text from left side */
          margin-right: 30px;        /* Make this as wide as the width of the span */
          color: white;                /* The color of the button text */
          text-decoration: none;
          background-image: url(imgages/buttons/homeNorm.png); 
		  
        }
        a.home-btn:hover {
          color: black;                /* The color of the button text when hovering */
          font-weight: bold;        /* This example has a bold text when hovering. Can be anything, really */
		  background-image: url(imgages/buttons/homeHover.png); 
        }
		a.home-btn:down {
		  background-image: url(imgages/buttons/homeDown.png); 
		
		}
        .home-btn span {
          margin-right: -30px;         /* Make this as wide as the witdh of the span */    
          width: 30px;                /* The width of the right edge of the button */
        }

        /* These .btn classes are generic for all button styles and should not be changed */

        .btn, 
        .btn span {
          display: block;
          background-position: left top;
          background-repeat: no-repeat;  
        }
        .btn {
          white-space: nowrap;
          float: left;
          position: relative;
          text-align: center;
        }
        .btn span {
          position: absolute;
          background-position: right top;  
          top: 0;
          right: 0;
          *right: auto;                /* IE 6 and 7 hack - right does not work correctly in IE6 and7 */
          float: right;                /* IE 6 and 7 hack - alternative for right, works only in IE6 and IE7 */           
        }
        a.btn span {
          cursor: hand;                /* IE hack - To make the mouse pointer change in IE on hover as well */
        }            
 
	.HafHeader 
	{
	position: absolute;
	height: 265px;
	width: 100%;
	margin: 0px;
	padding: 0px;
	vertical-align: top;
	
	}

	#title
	{
	width:1200px;
	height:265px;
	background-attachment: scroll;
	background-image: url(../images/Header-Lime-Green2.png);
	background-repeat: no-repeat;
	background-position: 0 0;
	border: medium none #666;
	margin-top: 0px;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;
	padding-top: 0px;
	}
	
	.titleBG
	{
	width:1200px;
	height:265px;
	background-attachment: scroll;
	background-image: url(../images/seamless_tile3.png);
	background-repeat: repeat;
	background-position: 0 0;
	border: medium none #666;
	margin-top: auto;
	margin-right: auto;
	margin-bottom: 0;
	margin-left: auto;
	padding-top: 0px;
	}
	
 	#HafMenu 
	{
	height: 50px;
	width: 1200px;
	margin-top: 0px;
	margin-right: auto;
	margin-left: auto;
	padding-top: 270px;
 	}
 
 	#menuBar
	{
	width: 800px;
	padding-left: 0px;
 	}
 
 	.homeBtn
  	{
		width: 107px;
		height: 45px;
		/*background: url(../images/buttons/homeNorm.png);
		*/
			background-repeat: no-repeat;
		background-position: 0 0;
		display: inline-block;
  	}
	.homeBtn a 
	{
		width: 107px;
		height: 45px;
		cursor:pointer;
    	margin: auto auto auto auto;
	}
	.homeBtn:hover
	{ 
		background: url(../images/buttons/homeHover.png);
	}
  
	.homeBtn:down
	{ 
		background: url(../images/buttons/homeDown.png);
	}
	
	a.homeBtn span {
		cursor: hand;                /* IE hack - To make the mouse pointer change in IE on hover as well */
	}            

 	
	.portBtn
  	{
	width: 117px;
	height: 45px;
	/*background: url(../images/buttons/homeNorm.png);
	*/
		background-repeat: no-repeat;
	background-position: 0 0;
	display: inline-block;
  	}
	.portBtn a 
	{
		width: 117px;
		height: 45px;
		cursor:pointer;
    	margin: auto auto auto auto;
	}
	.portBtn:hover
	{ 
		background: url(../images/buttons/portfolioHover.png);
	}
  
	.portBtn:down
	{ 
		background: url(../images/buttons/portfolioDown.png);
	}
	
	a.portBtn span {
		cursor: hand;                /* IE hack - To make the mouse pointer change in IE on hover as well */
	}            

	.aboutBtn
  	{
	width: 147px;
	height: 45px;
	/*background: url(../images/buttons/homeNorm.png);
	*/
		background-repeat: no-repeat;
	background-position: 0 0;
	display: inline-block;
  	}
	.aboutBtn a 
	{
		width: 147px;
		height: 45px;
		cursor:pointer;
    	margin: auto auto auto auto;
	}
	.aboutBtn:hover
	{
	background-image: url(../images/buttons/artistsHover.png);
	}
  
	.aboutBtn:down
	{ 
		background: url(../images/buttons/aboutDown.png);
	}
	
	a.aboutBtn span {
		cursor: hand;                /* IE hack - To make the mouse pointer change in IE on hover as well */
	}            

	.contactBtn
  	{
	width: 104px;
	height: 45px;
	/*background: url(../images/buttons/homeNorm.png);
	*/
	background-repeat: no-repeat;
	background-position: 0 0;
	display: inline-block;
	color: #000;
  	}
	.contactBtn a 
	{
		width: 104px;
		height: 45px;
		cursor:pointer;
    	margin: auto auto auto auto;
	}
	.contactBtn:hover
	{ 
		background: url(../images/buttons/contactHover.png);
	}
  
	.contactBtn:down
	{ 
		background: url(../images/buttons/contactDown.png);
	}
	
	a.contactBtn span {
		cursor: hand;                /* IE hack - To make the mouse pointer change in IE on hover as well */
	}            

	
	.guestBtn
  	{
	width: 160px;
	height: 45px;
	/*background: url(../images/buttons/homeNorm.png);
	*/
		background-repeat: no-repeat;
	background-position: 0 0;
	display: inline-block;
  	}
	.guestBtn a 
	{
		width: 160px;
		height: 45px;
		cursor:pointer;
    	margin: auto auto auto auto;
	}
	.guestBtn:hover
	{ 
		background: url(../images/buttons/guestHover.png);
	}
  
	.guestBtn:down
	{ 
		background: url(../images/buttons/guestDown.png);
	}
	
	a.guestBtn span {
		cursor: hand;                /* IE hack - To make the mouse pointer change in IE on hover as well */
	}            
 	
	#events, #webaddress, #contacviaemail, #likeus, #paypalpref, #exhibitloc
	{
		position: relative;
		width: 1200px;
		height: 50px;
		margin:0px 0px;
 	}
 


 	#eventsLbl
	{
	text-align: left;
	line-height: 25px;
	font-weight: bolder;
	font-size: medium;
 	}
 
  	#webaddressLbl, #likeusLbl, #paypalprefLbl
	{
		height: 20px;
		width: 190px;
		padding-top: 15px;
		padding-bottom: 15px;
		text-align: right;
		padding-right: 10px;
		position: absolute;
		left: 0px;
		top: 0px;
 	}
 

 	#webaddressData, #likeusData, #paypalprefData
	{
		height: 20px;
		width: 990px;
		padding-top: 15px;
		padding-bottom: 15px;
		text-align: left;
		padding-left: 10px;
		position: absolute;
		left: 200px;
		top: 0px;
 	}
 
 	#eventsData
	{
	text-align: center;
 	}
 
 
 	#paypalprefData
	{
	height: 20px;
	width: 990px;
	padding-top: 5px;
	padding-bottom: 0px;
	text-align: left;
	padding-left: 10px;
	position: absolute;
	left: 200px;
	top: -0px;
 	}
 
	#albums, #exhibitloc
	{
		position: relative;
		width: 1200px;
		height: 80px;
		margin:0px 0px;
 	}
 

 	#albumLbl, #exhibitlocLbl
	{
	height: 30px;
	width: 1200px;
	padding-top: 5px;
	padding-bottom: 0px;
	text-align: center;
	position: absolute;
	left: 0px;
	top: 0px;
 	}
 
 	#albumData4, #exhibitlocData4
	{
	left: 700px;
 	}
 
 	#albumData5, #exhibitlocData5
	{
	left: 910px;
 	}
 
 	#info_box
	{
		position: relative;
		width: 700px;	
		margin:0px auto;
 	}
 

 	#info_title
	{
	height: 75px;
	width: 700px;
	padding-top: 5px;
	padding-bottom: 0px;
	text-align: center;
	padding-left: 10px;
	position: absolute;
	left: 0px;
	top: 0px;
	font-family: "Comic Sans MS", cursive;
	font-size: 24px;
	font-weight: bold;
	color: #000;
 	}

 	#the_info
	{
	height: 50px;
	width: 700px;
	padding-top: 5px;
	padding-bottom: 0px;
	text-align: center;
	padding-left: 10px;
	position: absolute;
	left: 0px;
	top: 80px;
	font-family: "Comic Sans MS", cursive;
	font-size: 18px;
	color: #000;
 	}
#container #content #tabs ul li a {
}
#container #content #tabs ul li a {
}
