/* CSS LAST UPDATED 10/30/2006 - BILL D.*/


/* ---------------------------------------------------------------------------------------------------------------------*/
/* |   ************************************************************************************************************    |*/
/* |    START OF MAIN INTERFACE CSS TAGS -     |*/
/* |   ************************************************************************************************************    |*/
/* -----------------------------------------------------------------------------------------------------------*/
* {
margin: 0;
padding: 0;
}

/*html {
		background: #0285ff url(images/mainTemplateHeader2.jpg) 50% 0 no-repeat;

}*/

body, html { /*WARNING - DO NOT TOUCH/CHANGE - ANY CHANGES WILL ALTER THE WEBSITE*/
margin: 0;
zpadding: 50px 15px 5px 15px;
font: normal 11px Verdana, Arial, Georgia, sans-serif; 
background: #0285ff url(images/mainTemplateBkgrnd.gif) repeat-x;
line-height: 14pt;
text-align: center;
overflow-x: hidden;
}

.movie {
	width: 100%;
	height: 100%;
}
div.movie {
	width: 688px;
	height: 350px;
	text-align: center;
	border-bottom : 1px solid #0285ff;
	margin: 10px auto;
}

#header { 
margin: 0px auto;
text-align: left;
padding-bottom: 90px;
width:900px;
background: #0285ff url(images/mainTemplateHeader2.jpg) no-repeat left top;
height:417px;

}
#header2 {
z-index: 0;
left:auto; 
right:auto; 
margin: 0px auto;
padding: 0;
width: 779px;
top: 0;
background: transparent url(file:///H|/images/sitetemplate/mainTemplateHeader2.gif) no-repeat center top;
text-align: left;
background-position: 0 0;
padding-bottom: 90px;
padding-top: 10px;
}

#container { /*WARNING - DO NOT TOUCH/CHANGE - ANY CHANGES WILL ALTER THE WEBSITE*/
left:auto; 
right:auto; 
margin: 0 auto;
padding: 0;
height: auto;
width: 900px;
top: 138px;
border: 0;
text-align: left;
padding-bottom: 20px;
}

#leftcolumn{
position: absolute;
margin: 0 auto; 
top: 417px;
height: auto;
margin-left: 700px;
width: 200px;
border: 0;
text-align: justify;
background-image:  url(images/rightbkgrnd.gif);
background-repeat: repeat-y;
background-position: 0% 0%;
padding-left: 0px;
padding-right: 0px;
bottom: auto;
}

#leftcolumnfooter{
position: relative;
top: 0;
left: auto; 
right: auto; 
margin-left: 0;
width: 200px;
background:  url(images/mainTempRightbottCol.gif) no-repeat 100% 100%;
margin-top: 9px;
padding-left: 0;
padding-right: 0px;
height: 26px;	
text-align: justify;	
}

#rightcolumn{
	position: absolute;
	margin: 0 auto;
	top: 417px;
	height: auto;
	zmargin-left: 0px;
/*	margin-bottom: 70px; */
	width: 688px;
	background:  url(images/mainbkgrnd.gif) repeat-y 0 0;
	padding-left: 0px;
	padding-right: 0px;
}

#rightcolumnfooter{
	position: relative;
	top: 0;
	left: auto; 
	right:auto; 
	margin-left: 0;
	width: 688px;
	background:  url(images/mainTempRightCol.gif) no-repeat 0 0;
	padding-left: 0px;
	padding-right: 5px;
	height: 49px;	
	text-align: justify;	
}

#mainBody{ /*this header css is for pages within IBs website */
	position: absolute;
	left:auto; 
	right:auto; 
	top: 134px;
	height: auto;
	margin-left: 0;
	width: 779px;
	background-image:   url(images/sitetemplate/mainTempBodMid.gif);
	background-repeat: repeat-y;
	background-position: 0 0;
	padding-left: 0;
	padding-right: 10px;
}

#mainBodyBottom{
	position: relative;
	top: 0;
	left: auto; 
	right:auto; 
	margin-left: 0;
	width: 779px;
	background-image:   url(images/sitetemplate/mainTempBodBot.gif);
	background-repeat: no-repeat;
	background-position: 0 0;
	padding-left: 0px;
	padding-right: 5px;
	
	height: 20px;	
	text-align: justify;	
}

#googsearch{
	position: relative;
	z-index: 10;
	left:710px; 
	right:auto; 
	top: 255px;
}

#backtohome{
	position: absolute;
	z-index: 10;
	left:auto; 
	right:auto; 
	top: 20px;
}

.rightcolspacer{
	background:  url(images/rightcolspacer.gif) no-repeat 0 0;
	padding:15px 0px;
	margin-top:15px;
	height: 41px;
	width: 200px
	}

#mainmenu{
	position: absolute;
	z-index: 90000;
	margin: 0 auto;
	top: 385px;
}



/* ---------------------------------------------------------------------------------------------------------------------*/
/* |                              CSS TAGS BELOW CONTROL MAIN HYPERLINKS THROUGHOUT WEBSITE                            |*/
/* ---------------------------------------------------------------------------------------------------------------------*/

a, a:focus, a:visited {
	text-decoration: underline;
	color: #9900FF;
	outline:0;
}

a:hover {
	text-decoration: none;
	color: #666666;
}

a img, a:visited img, a:hover img, a:link img, a:active img, a:focus img {
	text-decoration: none;
	border: none;
	outline:0;
}

/* 

----------------------------------------------------------------------------------------------------------

-----------*/
/* |                                 END OF TAG FOR MAIN HYPERLINKS THROUGHOUT WEBSITE                     

            |*/
/* 

----------------------------------------------------------------------------------------------------------

-----------*/


/* 

----------------------------------------------------------------------------------------------------------

-----------*/
/* |                                            START OF TAGS FOR GUTS OF WEBSITE                          

            |*/
/* 

----------------------------------------------------------------------------------------------------------

-----------*/


.Title, h1{
	font: normal 18px Verdana, Arial, Helvetica, sans-serif; 
	color: #0285ff;
	margin: 5px;
	padding: 10px 0px 0px 10px;
	/*top   right  bottom left*/
}
h2{
	font: bold 12px Lucidia Grande, Verdana, Arial, Helvetica, sans-serif; 
	color: #000000;
	margin: 10px 0px 5px 10px;
	/*top   right  bottom left*/
}
h3{
	font: bold 14px Lucidia Grande, Verdana, Arial, Helvetica, sans-serif; 
	color: #000000;
		margin: 5px;
	margin: 10px 0px 5px 10px;
	/*top   right  bottom left*/
}

hr
{
	height: 1px;
	border: 0;
	color: #0285ff;
	background-color: #0285ff;
}


.instructions {
	font: bold 11px Arial, Verdana, Georgia, sans-serif; 
	background: #FFFFCC;
	border: 1px dotted #999999;
	color: #000000;
	margin: 0px 20px 0px 20px;
	padding: 5px 10px 5px 10px;
	/*top   right  bottom left*/

}
p {
	margin-bottom: 10px;
	font: normal 11px  Verdana, Arial, Georgia, sans-serif; 
	line-height: 14pt;
	text-align: justify;
	color: #000000;
	padding: 5px 15px;
	/*top   right  bottom left*/
}


.code {
	margin-bottom: 10px;
	font: normal 11px  Courier New, Courier, mono; 
	line-height: 14pt;
        /*text-align: left;*/
	color: #000000;
	/*padding: 5px 40px 5px 20px;*/
	/*top   right  bottom left*/
}


/*used for testimonials and comments*/
.commentbox{
background-color: #ffffcc;
zwidth: 450px;
padding: 10px;
margin: 0px 15px;
color: #000;
text-align:justify;
border:1px solid #ff9900
}

.commentfooter{
background: url(images/comment_arrow.gif) 80px 0 no-repeat; /*20px 0 equals horizontal and vertical position of arrow. Adjust as desired (ie: 20px -5px).*/
padding-left: 120px;
padding-top: 1px;
margin-bottom: 2em;
font-size: 90%;
color: #666666;
margin-top:-1px
}
.commentfooter2{
background: url(images/comment_arrow2.gif) 570px 0 no-repeat; /*20px 0 equals horizontal and vertical position of arrow. Adjust as desired (ie: 20px -5px).*/
padding-left: 335px;
padding-top: 1px;
margin-bottom: 2em;
font-size: 90%;
color: #666666;
margin-top:-1px
}

blockquote {padding:2px; margin:0px 20px}
p.cite {display:list-item; padding:0 5px; list-style-image: url(images/open_quotes.png); background: url(images/close_quotes.png) bottom right no-repeat;}
blockquote[cite]:after {content: "Quote taken from: " attr(cite); display: block; font-size:0.8em; color:#888; text-align:right;}

/*END used for testimonials and comments*/

.TableOutline { /* used on dropdowns for accounts - advisors individiuals institutions brokers */
        font-family: Verdana, Arial, Helvetica, sans-serif;
        font-size: 11px;
        line-height: 14px;
        border: 1px solid #999999;
        padding: 0;
		left:auto; 
		right:auto; 
		margin: 5px 15px;
		width: 658px;
}

.NoTableOutline { /* used on dropdowns for accounts - advisors individiuals institutions brokers */
        font-family: Verdana, Arial, Helvetica, sans-serif;
        font-size: 11px;
        line-height: 14px;
        border: 0;
        padding: 0px;
		left:auto; 
		right:auto; 
		margin: 0px auto;
}

.CellOn, .cellon {
	font-family: normal Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	line-height: 14px;
	color: #000000;
	background: transparent url(interface_images/mainTemplateBkgrnd.gif) repeat-x;
	margin: 5px 15px;
	padding: 5px;
		/*top   right  bottom left*/
	border-bottom: 1px solid #999999;
}

.CellOff, .celloff {
	font-family: normal Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	line-height: 14px;
	color: #000000;
	background-color: #FFFFFF;
	margin: 5px 15px;
	padding: 5px;
		/*top   right  bottom left*/
	border-bottom: 1px solid #999999;
}

.CellSubTitle {
	font: bold 12px Arial, Verdana, Georgia, sans-serif; 
	color: #FFF;
	text-align: inherit;
	background:  #0285ff;
	margin: 5px 15px;
	padding: 5px;
		/*top   right  bottom left*/
	width: auto;
	height: 25px;
}
.instructions, .instructionsgreen, .instructionsred{
	font: bold 11px Arial, Verdana, Georgia, sans-serif; 
	border: 1px dotted #999999;
	color: #000000;
	margin: 5px 15px;
	padding: 5px;
	/*top   right  bottom left*/
}

.instructions {
	background: #FFFFCC;
}
.instructionsgreen {
	background: #CCFFCC;
}
.instructionsred{
	background: #FF9999;
}

ul, ol {
	font: normal 11px Verdana, Arial, Helvetica, sans-serif; 
	line-height: 14pt;
	text-align: left;
	color: #000000;
	margin: 5px 15px 10px 15px;
	margin-left: 50px;
		list-style-type: square;
}





/* ---------------------------------------------------------------------------------------------------------------------*/
/* |                                            CSS TAGS FOR FORMS                                                     |*/
/* ---------------------------------------------------------------------------------------------------------------------*/


input, select {
font-family: Arial, Helvetica, Verdnan, sans-serif;
font-size: 10px;
padding: 1px 1px 1px 1px
}

Textarea {
font-family: Arial, Helvetica, Verdnan, sans-serif;
font-size: 10px;
padding: 1px 1px 1px 1px
}

input.submitleft, input.submitright, input.submitleft a:focus, input.submitright a:focus{
border: 0px;
padding: 0;
background: url(images/btnleft.gif) no-repeat 0 0;
width:35px;
height:27px;
outline:0px
}

input.submitright{
background: url(images/btnright.gif) no-repeat 0 0;
width:34px;
height:27px;
margin-left:-2px;
}








/* Navigation -----------------------------------------------------------------*/
ul#navigation{
display:inline;
list-style:none;
position:absolute;
bottom:0px;left:0;
margin:0px 0px 0px 0px;
	/*top   right  bottom left*/
padding:0;
height:26px;
width:900px;
z-index:1000;
font-family:Lucidia Grande, Verdana, Arial, Helvetica, sans-serif; 
/*border: 1px solid #ff0000;*/
}
ul#navigation li{
display:inline;
float:left;
margin:0;padding:0;
position:relative;
}
ul#navigation li a{
zdisplay:block;
height:30px;
text-indent:-9000px;
outline:none;
}

/*li.home{zbackground:url(images/nav_home_over.gif) 0 0 no-repeat;}
li.home a{zwidth:81px;background:url(images/nav_home_up.gif) 0 0 no-repeat;}
li.home a:hover{zbackground:url(images/nav_home_over.gif) 0 0 no-repeat;}*/

li.home, li.home a, li.home a:hover {
font: bold 14px Lucidia Grande, Verdana, Arial, Helvetica, sans-serif; width:181px; color:ff0000; line-height:24px
}

li.products{background:url(images/nav_products_over.gif) 0 0 no-repeat;}
li.products a{width:117px;background:url(images/nav_products_up.gif) 0 0 no-repeat;}
li.products a:hover{background:url(iamges/nav_products_over.gif) 0 0 no-repeat;}

li.aftercare{background:url(images/nav_aftercare_over.gif) 0 0 no-repeat;}
li.aftercare a{width:117px;background:url(images/nav_aftercare_up.gif) 0 0 no-repeat;}
li.aftercare a:hover{background:url(images/nav_aftercare_over.gif) 0 0 no-repeat;}

li.order{background:url(images/nav_order_over.gif) 0 0 no-repeat;}
li.order a{width:117px;background:url(images/nav_order_up.gif) 0 0 no-repeat;}
li.order a:hover{background:url(images/nav_order_over.gif) 0 0 no-repeat;}

li.faq{background:url(images/nav_faq_over.gif) 0 0 no-repeat;}
li.faq a{width:117px;background:url(images/nav_faq_up.gif) 0 0 no-repeat;}
li.faq a:hover{background:url(images/nav_faq_over.gif) 0 0 no-repeat;}

li.events{background:url(images/nav_events_over.gif) 0 0 no-repeat;}
li.events a{width:117px;background:url(images/nav_events_up.gif) 0 0 no-repeat;}
li.events a:hover{background:url(images/nav_events_over.gif) 0 0 no-repeat;}

li.distributors{background:url(images/nav_distributors_over.gif) 0 0 no-repeat;}
li.distributors a{width:117px;background:url(images/nav_distributors_up.gif) 0 0 no-repeat;}
li.distributors a:hover{background:url(images/nav_distributors_over.gif) 0 0 no-repeat;}

li.contact{background:url(images/nav_contact_over.gif) 0 0 no-repeat;}
li.contact a{width:117px;background:url(images/nav_contact_up.gif) 0 0 no-repeat;}
li.contact a:hover{background:url(images/nav_contact_over.gif) 0 0 no-repeat;}

/*li.contact{background:url(http://www.tattooz.net/assets/templates/main2/nav_contact_f2.png) 0 0 no-repeat;}
li.contact a{width:99px;background:url(http://www.tattooz.net/assets/templates/main2/nav_contact.png) 0 0 no-repeat;}
li.contact a:hover{background:url(http://www.tattooz.net/assets/templates/main2/nav_contact_f2.png) 0 0 no-repeat;}*/

ul#navigation li ul { /* second-level lists */
position: absolute;
background: #ccc;
border:1px solid #333;
top:0px;
width: 200px;
left: -999em; /* using left instead of display to hide menus because display: none isn't read by screen readers */
list-style:none;
z-index:1000;
padding:0;
}

ul#navigation li ul li{float:none;backgoround:transparent;}
ul#navigation li:hover ul, ul#navigation li.over ul { /* lists nested under hovered list items */
left: -50px;top:20px;
}
ul#navigation li ul li a{
background:transparent; 
width:100%; 
font-size:1.2em; 
height:1em;
padding:6px 0; 
color:black; 
text-decoration:none;
border-bottom:1px solid #999;
border-top:1px solid #eee;
font-weight:normal;
text-indent:5px;
z-index:1000;
}
ul#navigation li ul li a:hover{background:white;}


/* test */
#footer{ /*footer continer*/
zclear:both;
zcolor:#fff;
zline-height: 18px;
zfont-size:10px;

	font: normal 10px Verdana, Arial, Helvetica, sans-serif; 
	color: #0285ff;
	margin: 5px;
	padding: 0;


}
#footer h2{
font-size: 14px;
text-align:center;
color:#FFFFFF;
}
#footer a{color:#9cf;}
#footer a, #footer a:visited {
	text-decoration: underline;
	color: #330066;
}

#footer a:hover {
	text-decoration: none;
	color: #666666;
}



z#footer div.liner{width:688px;margin:0 auto;padding:0;} /*container for footer*/
#foothighlight{
width:220px;
padding:15px 5px;/*0 20px*/
float:left;
background:url(images/footerbkgrnd.gif) 5px 0 repeat-x;
min-height:200px;
}
* html #foothighlight{ height:200px;}

#foothighlight a img{padding:3px;border:1px solid #ccc;}
#about{
width:218px;
padding:15px 5px; /*0 20px*/
float:left;
background:url(images/footerbkgrnd.gif) 8px 0 repeat-x;
min-height:200px;
}
* html #about{ height:200px;}

#subscribe{
width:220px;
float:left;
padding:15px 5px; /*0 15px*/
background:url(images/footerbkgrnd.gif) 8px 0 repeat-x;
min-height:200px;
position:relative;
}
* html #subscribe{ height:200px;}
.credit{
/*position:absolute;*/
left:10px;
right:10px;
text-align:left;
color:#000000;

}
.credit a{color:#FFFFFF;}

.animatedcollapse { /*used to style the animated DIV tags on the products pages*/
background: #000000;
padding:3px;
padding-left: -10px;
}

/*tabs for ingredients on products pages*/


/*Credits: Dynamic Drive CSS Library */
/*URL: http://www.dynamicdrive.com/style/ */

.ddoverlap{
border-bottom: 1px solid #bbb8a9;
margin: 10px;
}

.ddoverlap ul{
padding: 0;
margin: 0;
font: bold 90% default;
list-style-type: none;
}

.ddoverlap li{
display: inline;
margin: 0;
}

.ddoverlap li a{
font: bold 12px Verdana, Arial, Helvetica, sans-serif; 
padding: 3px 7px;
text-decoration: none;
padding-right: 32px; /*extra right padding to account for curved right edge of tab image*/
color: #9900FF;
background: transparent url(images/righttabdefault.gif) 100% 1px no-repeat; /*give illusion of shifting 1px down vertically*/
border-left: 1px solid #dbdbd5;
position: relative;
display: block;
float: left;
margin-left: -20px; /*shift tabs 20px to the left so they overlap*/
left: 20px;
}

.ddoverlap li a:visited{
color: #9900FF;
}

.ddoverlap li a:hover{
color: #000000;
}

.ddoverlap li.selected a{ /*selected tab style*/
color: black;
z-index: 100; /*higher z-index so selected tab is topmost*/
top: 1px; /*Shift tab 1px down so the border beneath it is covered*/
background: transparent url(imgages/righttabselected.gif) 100% 0 no-repeat;
}

.ddoverlap li.selected a:hover{
text-decoration: none;
}



/* remove the bullets, padding and margins from the lists */
.menu ul{
list-style-type:none;
padding:0;
margin:0;
}
/* make the top level links horizontal and position relative so that we can position the sub level */
.menu li{
float:left;
position:relative;
z-index:100;
}

/* use the table to position the dropdown list */
.menu table{
position:absolute;
border-collapse:collapse;
z-index:80;
left:-1px;
top:20px;
}

/* style all the links */
.menu a, .menu :visited {
display:block;
font: normal 12px Verdana, Arial, Georgia, sans-serif;
width:127px;
padding:3px 0;
color:#fff;
zzzbackground:#949e7c;
zbackground: transparent url(images/FFFmenubkgrnd.png) repeat 0 0;
text-decoration:none;
margin-right:1px;
text-align:center;
}
/* style the links hover */
.menu :hover{
color:#003399;
background: transparent url(images/FFFmenubkgrnd.png) repeat 0 0;
}


.menu  ul li ul li a:link, .menu  ul li ul li a:visited{
color:#000;
background:#fff;
width:150px;
text-align:left;
padding:5px;
border-bottom: 1px solid #ccc
}

.menu ul li ul li a:hover{
color:#fff;
background:#000;
}

/* hide the sub level links */
.menu ul ul {
visibility:hidden;
position:absolute;
width:149px;
height:0;
}
/* make the sub level visible on hover list or link */
.menu ul li:hover ul,
.menu ul a:hover ul{
visibility:visible;
}