/* CSS Document by csspixel.com - Roger Ledergerber - 2008 Copyright 
   Two Column and Three Column Fixed Width Centered Layouts 
   with Horizontal Navigation and Vertical Navigation with Sub-Menus
   NOTE: Three Column Layout has been left out intentionally in this file
   NOTE: Menu Options have been stripped intentionally - Only Horizontal Dropdown
   Cross-Browser and Cross-Platform tested and W3C Standards Compliant 
   Safari 3.0.4 - 3.1.2, Firefox 2.0.0.14 - 3.0.1, Netscape 7.0.2, 
   Camino Mozilla 1.6, Opera 9.0 - 9.5, Flock 1.0.2 - 2.0
   Internet Explorer 5.5, IE 6, IE 7, Sea Monkey Mozilla
   also renders fine in IE 8 when Doctype Switching is included on html page - 
   <meta http-equiv="X-UA-Compatible" content="IE=7;IE=8;FF=3;OtherUA=4" />
   Validates as CSS Level 2.1 with Doctype XHTML Transitional 
   Validates as CSS Level 2.1 with Doctype XHTML Strict */

html > body {
font-size : 12px;
}
body {
font-size : 12px;
}
body {
font-family : Arial, Tahoma, Verdana, Helvetica, sans-serif;
color : #000;
background : #ccc url(../images/bodybg.gif) repeat-y center top;
}
body {
text-align : center;
}
img {
border : none;
}
#content img {
border : 1px solid #000;/*ccc*/
}
.thumbs img {
border : 1px solid #ccc;
}
#content h2 {
color : #a00;/*793A02;f39*/
}
h1.fancy {
margin-top : 0;
margin-bottom : 0;/* if above movie-box only */
font-size : 18px;/*28 38*/
text-align : center;
line-height : 22px;/*30 34*/
color : #000;/*fff*/
}
h2.fancy {
/*margin : 10px 0;*/
margin : 0 0 10px 0;/* if in movie-box only */
font-size : 16px;/*22*/
line-height : 22px;/*24*/
color : #f39;
}
h1.fancy, h2.fancy {
font-family : Arial, "Trebuchet MS", Verdana, sans-serif;
font-weight : lighter;
letter-spacing : 1px;
}
/*
h1.fancy, h2.fancy {
font-family : Baskerville, "Times New Roman", Times, serif;
font-weight : lighter;
letter-spacing : 1px;
color : #f39;
}
*/
h1 {
font-size : 20px;
color : #f39;
}
h2 {
margin-bottom : -5px;
font-size : 16px;
}
h3 {
font-size : 14px;
}
h1, h2, h3 {
/*margin-bottom : -5px;*/
font-family : Arial, "Trebuchet MS", Verdana, sans-serif;
}
p {
	line-height : 115%;
}
#content-left-logos p, #content-right-logos p {
padding : 0 5px 5px 5px;
}
#content-left-logos h1, #content-right-logos h1, #content-left-logos h2, #content-right-logos h2 {
margin : 8px 0 -8px 0;
padding : 0 5px;
color : #f39;
}
#content ul, #content p {
	font-size : 110%;
}
#content ul, #content-left-column ul, #content-right-column ul {
margin-left : 10px;
padding-left : 10px;
}
#content ul {
margin-top : 20px;
margin-bottom : 20px;
}
ul#categories-menu {
margin-left : 0;
padding-left : 0;
}
ul#categories-menu li {
margin : 0px;
padding : 2px 0 1px 0;
list-style-position : inside;
border-bottom : 1px solid #ccc;
}
#content li, #content-left-column li, #content-right-column li {
margin-bottom : 5px;
line-height : 130%;
list-style : url(../images/listicon.gif);
}
#content div.box-content ul {
/*margin-top : 0;*/
margin-bottom : 12px;
}
#content div.box-content ul li {
/*margin-bottom : 0;*/
margin-bottom : 5px;
line-height : normal;
list-style : url(../images/listicon.gif);
}
/* --------------------------------------------------- 
*/

/* LINKS */

#content a:link, #content-left-logos p a:link, #content-right-logos p a:link, #content-right-column td a:link {
color : #00f;
}
#content a:visited, #content-left-logos p a:visited, #content-right-logos p a:visited, #content-right-column td a:visited {
color : #00f;
}
#content a:hover, #content-left-logos p a:hover, #content-right-logos p a:hover, #content-right-column td a:hover {
text-decoration : none;
color : #f00;
}
#content a:active, #content-left-logos p a:active, #content-right-logos p a:active, #content-right-column td a:active {
text-decoration : none;
color : #090;
}
#content-footer a:link, #content-footer a:visited {
color : #000;
}
#content-footer a:hover {
text-decoration : none;
color : #f00;
}
#content-footer a:active {
text-decoration : none;
color : #090;
}
/* --------------------------------------------------- 
*/

/* GENERAL CLASSES */

.align-center {
text-align : center;
}
.align-left {
text-align : left;
}
.align-right {
text-align : right;
}
.img-right, .img-left {
padding : 5px;
background : #fff;
}
.img-right {
float : right;
margin-bottom : 8px;
margin-left : 5px;
}
.img-left {
float : left;
margin-bottom : 8px;
margin-right : 5px;
}
.movie-box {
margin : 10px 0;
padding : 10px;
text-align : center;
background : #fff;
border : 1px solid #ccc;
}
.highlight-box {
margin : 10px 0;
/*padding : 0 10px; normal*/
padding : 0;
background : #fff;/*eee*/
border : 1px solid #9ec6de;/*000;ccc*/
}
.footnote {
font-size : 9px;
font-style : italic;
color : #000;/*f39*/
}
#content .footnote {
font-size : 95%;
font-style : italic;
color : #000;/*f39*/
}
.verysmall {
font-size : 9px;
color : #333;
}
.clearing {
clear : both;
}
.rule {
border-top : 1px solid #ccc;
}
/* --------------------------------------------------- 
*/

/* SPECIAL SPREADSHEETS PRICELISTS GOOGLE DOCS */
/* depending on page width - adjust widths */
/* disabled css - not used - html must be inserted first */
/*
.frame-container {
display : block;
width : 880px;
margin : 0 auto;
background : #eee;
}
.frame-title-border {
display : block;
width : 870px;
margin : 0 auto 10px auto;
padding : 0 10px 20px 10px;
color : #000;
background : #fff;
border : 1px solid #ccc;
}
.frame-title {
display : block;
width : 870px;
margin : 0 auto;
padding : 0 0 10px 0;
}
.frame-title h1 {
color : #fff;
}
.frame-title h2 {
font-size : 12px;
color : #fff;
}
.frame-title h2 a {
font-size : 12px;
color : #eee;
}
.frame-title h2 a:hover {
font-size : 12px;
color : #0ff;
}
*/
/* --------------------------------------------------- 
*/

/* LAYOUT */

#wrapper {
margin-right : auto;
margin-left : auto;
text-align : left;
}
#wrapper {
background : #fff;/**/
}
#header {
display : block;
/*background : #fff url(../images/top_gradient4646.gif) repeat-x left 122px;*/
background : #f39;/*new*/
}
#logo {
display : block;
height : 140px;
text-align : left;
background : url(../images/pc-banner.jpg) no-repeat top right;
}
#poster-img-top {
display : block;
height : 140px;
/*background : url(../images/anim-window-a160102.jpg) no-repeat 10px 2px;*/
}
#static-img-bar {
display : block;
height : 140px;
/*background : url(../images/static-anibg.jpg) no-repeat 10px bottom;*/
}
#bannerlink {
cursor : wait;
display : block;
height : 140px;
/*padding : 10px 0 0 10px;*/
padding : 0 0 0 10px;/*new*/
/*border-bottom: 1px solid #f39;new*/
}
/* --------------------------------------------------- 
*/

/* SEARCH BAR */

#search {
display : none;
clear : both;
}
#content-search {
padding : 2px 15px;
text-align : center;
color : #fff;
background : #f39;
}
div.floater {background : #f39;/* Netscape needs this - IE ? */
float : left; 
display : block; 
width : 33%;/*new*/
}
div.floater50 {
float : left; 
display : block; 
width : 50%;/*new*/
}
span.text-in-float {
display : block;
padding-left : 5px;
}
form {
margin : 0; 
padding : 0;
}
fieldset {
margin : 0; 
padding : 2px 0 3px 0; 
border : none;
}
select {
width : 255px; 
}
input, textarea, .radiotext, .checktext {
padding : 2px; 
color : #000;
}
input.searchpad {
width : 150px; 
/*margin-top : 2px;*/
border : 1px solid #eee;
}
input.submitpad {
cursor : pointer;
width : 105px; 
padding : 3px; 
font-size : 10px; 
font-weight : bold; 
color : #fff; 
background : #f93; 
border : 1px solid #eee;
}
/* --------------------------------------------------- 
*/

/* 2 or 3 COLUMN LAYOUT - later make separate css for import */
/*
2 cols = 770 total-wide - 532 right-col = 208 left-col (3 x 10 col-gaps)
2 cols = 940 total-wide - 702 right-col = 208 left-col (3 x 10 col-gaps)
2 cols = 1010 total-wide - 772 right-col = 208 left-col (3 x 10 col-gaps)
3 cols = 1010 total-wide - 554 middle-col = 208 left-right-col (4 x 10 col-gaps)
*/

html > body {
margin : 0 auto;
/*min-width : 770px;*/
/*min-width : 940px;*/
min-width : 1010px;/*new*/
}
#wrapper, #content-wrapper, #nav-h {
/*width : 770px;*/
/*width : 940px;*/
width : 1010px;/*new*/
}
#content-search {
display : block;
}
/* -----------------------2 col-------------------- */ 
/*
#content-right-column {
display : none;
}
*/
/* -----------------------3 col-------------------- */ 
#content-right-column {
float : left;
display : inline;
width : 208px;
/*margin-left : 10px;*/
}
#content-right-logos {
display : block;
width : 208px;
margin-bottom : 10px;
background : #fff;
} 
/* --------------------------------------------------- 
*/

/* CONTENT STUFF - need to sort in order */

#content-wrapper {
display : inline;
}
#content-left-column {
float : left;
display : inline;
width : 208px;
/*margin-right : 10px; normal for 2 col*/
margin-left : 10px;
}
#content-left-logos {
display : block;
width : 208px;
margin-bottom : 10px;
background : #fff;/**/
}
div.floatleft {
float : left; 
}
div.floatright {
float : right; 
}
.box-planfloat {
display : block;
width : 440px;
margin-top : 10px;
background : #fff;
border : 1px solid #ccc;/*339*/
}
.plan-injection {
display : block;
height : 100%;
text-align : center;
}
.box-floated {
display : block;
width : 206px;
margin-top : 10px;
background : #fff;
border : 1px solid #ccc;/*339*/
}
.box {
display : block;
width : 206px;
margin-bottom : 10px;
background : #fcf6ea;/*fff;eee*/
border : 1px solid #5f94c0;/*f39 339*//*9ec6de;*/
}
.box-header h1.small {
font-size : 12px;/*new*/
}
.box-header h3, .box-header h1 {
display : block;
margin : 0;
/*margin : 1px;*/
padding : 6px 5px;
font-size : 12px;
color : #000;
background : #f39 url(../images/menu_bg.gif) repeat-x left bottom;
/*dialog_bg.gif*/
border-bottom : 1px solid #5f94c0;/*ccc;339*/
}
.box-header-middle-col h3, .box-header-middle-col h1 {
display : block;
margin : 0;
padding : 7px 6px;
font-size : 14px;
color : #253161;/*000*/
background : #eee url(../images/dialog_bg.gif) repeat-x left bottom;
/*border-top : 1px solid #ccc;339*/
border-bottom : 1px solid #ccc;
}
.box-content {
padding : 0 10px;
}
div.box-content ul li {
list-style : url(../images/listicon.gif);
}
div.box-content ul li a:hover {
text-decoration : none;
color : #f00;
}
div.box-content ul li a:active {
text-decoration : none;
color : #090;
}

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

/* TABLES */

table.listtables {
border : 1px solid #ccc;
border-collapse : collapse;
}
.listtables td {
text-align : center;
border : 1px dotted #ccc;
border-collapse : collapse;
}
.listhead td {
height : 16px;
text-align : center;
color : #fff;/*000*/
/*background : #f39;*/
background : #f39 url(../images/head_linebg.gif) repeat-x left center;
}
/*
.listtables td img, #content .listtables td img {
margin : 3px 3px 0px 3px;
border : 1px solid #ccc;
}*/

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

/* TABLE BACKGROUND PICTURES - DOUBLE LAYERED */

.gel,
.gel-tomi, 
.gel-pigm, 
.gel-perm, 
.gel-need, 
.gel-tint, 
.gel-train, 
.gel-class, 
.gel-pclas, 
.gel-lclas, 
.gel-eclas, 
.gel-anes, 
.gel-lash, 
.gel-viso, 
.gel-case, 
.gel-glove
{
	padding:3px;
	width:176px;
	height:140px;
	text-align:center;
	font-weight:bold;
}

.gel {background:#fff url("../images/companyname_small.gif") no-repeat 6px bottom;}
.gel-tomi {
	background:#fff url("../images/gel-tomi2.jpg") no-repeat 6px bottom;
}
.gel-pigm {background:#fff url("../images/gel-pigm.jpg") no-repeat 6px bottom;}
.gel-perm {
	background:#fff url("../images/gel-perm2.jpg") no-repeat 6px bottom;
}
.gel-need {background:#fff url("../images/gel-need.jpg") no-repeat 6px bottom;}
.gel-tint {background:#fff url("../images/gel-tint.jpg") no-repeat 6px bottom;}
.gel-train {background:#fff url("../images/gel-train.jpg") no-repeat 6px bottom;}
.gel-class {background:#fff url("../images/gel-class.jpg") no-repeat 6px bottom;}
.gel-pclas {background:#fff url("../images/gel-pclas.jpg") no-repeat 6px bottom;}
.gel-lclas {
	background-color: #fff;
	background-image: url(../images/gel-lclas2.jpg);
	background-repeat: no-repeat;
	background-position: 1px bottom;
}
.gel-eclas {background:#fff url("../images/gel-eclas.jpg") no-repeat 6px bottom;}
.gel-anes {background:#fff url("../images/gel-anes.jpg") no-repeat 6px bottom;}
.gel-lash {background:#fff url("../images/gel-lash.jpg") no-repeat 6px bottom;}
.gel-viso {background:#fff url("../images/gel-viso.jpg") no-repeat 6px bottom;}
.gel-case {background:#fff url("../images/gel-case.jpg") no-repeat 6px bottom;}
.gel-glove {background:#fff url("../images/gel-glove.jpg") no-repeat 6px bottom;}

.gelimg {display:block;margin:3px;padding-top:5px;height:140px;background: url("../images/gel.jpg") no-repeat bottom right;border:1px solid #ccc;}
.gel-noimg {
	display:block;
	margin:2px;
	padding-top:3px;
	border:1px solid #ccc;
}

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

/* MORE CONTENT-STUFF */

#wrapper {
background : #fff;/*399 9cc eee*/
/*background : #eee url(../images/companyname_small.gif) no-repeat 2% 91%;*/
}
address {
font-size : 9px;
}
/*
2 cols = 770 total-wide - 532 right-col = 208 left-col (3 x 10 col-gaps)
2 cols = 940 total-wide - 702 right-col = 208 left-col (3 x 10 col-gaps)
2 cols = 1010 total-wide - 772 right-col = 208 left-col (3 x 10 col-gaps)
3 cols = 1010 total-wide - 554 middle-col = 208 left-right-col (4 x 10 col-gaps)
*/
#content-main {
float : left;
display : inline;
/*width : 532px;*/
/*width : 702px;*/
/*width : 772px;*/
/*width : 554px;*/
width : 574px;/*new*/ 
/*background : #eee;*/
}
#content {
display : block;
padding : 10px;
/*background : #eee;*//*fff*/
/* -----------------------2 col-------------------- */ 
/*border-right : 1px solid #ccc;
border-left : 1px solid #ccc;*/
}
#content {
min-height : 500px;
}
#footer {
display : block;
clear : both;
}
#content-footer {
display : block;
padding : 10px;
text-align : center;
color : #000;
background : #fff url(../images/dialog_bg.gif) repeat-x bottom left;
}
/* --------------------------------------------------- 
*/

/* HORIZONTAL MENU - no Dropdowns - just Tabs */
/* disabled css - not used - disabled html */

/*
#nav-h {
display : inline;
white-space : nowrap;
}
#nav-h .navlist {
display : block;
margin-top : 0;
margin-bottom : 0;
margin-left : 0;
padding : 0 1px 1px 1px;
font : bold 12px Arial, Verdana, sans-serif;
}
#nav-h .navlist li {
float : left;
margin : 0;
padding : 1px 1px 1px 0;
list-style : none;
}
#nav-h .navlist li a {
display : block;
padding : 6px 4px;
text-decoration : none;
background : #ccd url(../images/gradientbar_top.jpg) repeat-x;
border-top : 1px solid gray;
border-right : 1px solid gray;
border-bottom : 3px solid #aab;
border-left : 9px solid #aab;
}
#nav-h .navlist li a:link {
color : #fff;
}
#nav-h .navlist li a:visited {
color : #ff0;
}
#nav-h .navlist li a:hover {
color : #fff;
background : #332;
border-top-color : gray;
border-right-color : gray;
border-bottom-color : #fe3;
border-left-color : #fe3;
}
#nav-h .navlist li a:active {
text-decoration : none;
color : #ff0;
}
*/
/* --------------------------------------------------- 
*/

/* VERTICAL MENU - VERSION 2 */
/* activated as Horizontal Dropdown Menu only */

#navlist li {
float : left;
margin-right : 1px;
}
#navlist li:hover .navlist-sub1 {
left : 0;
}
#navlist li {
width : auto;
}
#navlist li:hover .navlist-sub1 li a {
width : 208px;
}
#menu-box {
float : left;
}
#menu-box {
width : 100%;
height : 39px;
background : #fff url(../images/head_linebg.gif) repeat-x;
/*background : #fff url(../images/dialog_bg.gif) repeat-x;*//*new*/
}
#menu-box ul {
margin-top : 0;
margin-bottom : 0;
}
#menu-box li {
margin-bottom : 0;
}
#navlist, .navlist-sub1 {
margin : 0;
padding : 0;
list-style-type : none;
}
/*
#navlist, .navlist-sub1 li:first-child {
border-top : 1px solid #fff;
}
*/
#navlist li .navlist-sub1 {
display : none;
position : absolute;
left : -5000px;
}
#navlist li {
display : block;
position : relative;
height : 39px;
}
#navlist li a {
cursor : pointer;
font-weight : bold;
} 

#navlist li .navlist-sub1 li {
display : block;
height : 23px;
border-top: 1px solid #ccc;
}

#navlist li .navlist-sub1 li a {
display : block;
height : 15px;/*if 15 does not work on IE then go back to 23 box-model*/
padding-top : 4px;
padding-right : 10px;
padding-bottom : 4px;
padding-left : 10px;
}

#navlist li .navlist-sub1 li a {
cursor : pointer;
font-weight : normal;
}

#navlist li a, #navlist li a:visited {
display : block;
/*height : 39px;height : auto;*/
padding-top:12px;/*new*/
/*padding-right : 4px;*/
padding-right : 10px;/*new*/
padding-bottom:12px;/*new*/
/*padding-left : 4px;*/
padding-left : 10px;/*new*/
text-align : left;
text-decoration : none;
/*line-height : 20px;*/
color : #fff;
/*background : #eee url(../images/dialog_bg.gif) repeat-x;*/
background : #eee url(../images/head_linebg.gif) repeat-x;
border-right : 1px solid #f39;
/*border-bottom : 1px solid #f39;
border-left : 1px solid #f39;*/
}
#navlist li:hover a {
color : #fff;
background : #f39;
}
#navlist li:hover .navlist-sub1 {width:208px;/* Mac Netscape needs this - check for PC IE as well - still OK ? */
display : block;
position : absolute;
z-index : 5000;
}
#navlist li:hover .navlist-sub1 li a {
display : block;
color : #000;
/*background : #eee url(../images/dialog_bg.gif) repeat-x;*/
background : #fee;/*new*/
border-bottom : 1px solid #f39;/*new*/
border-left : 1px solid #f39;/*new*/
}
#navlist li:hover .navlist-sub1 li a:hover {
color : #fff;
background : #f39;
}
#navlist li a:active,
#navlist li:hover .navlist-sub1 li a:active {
color : yellow;
}