/*layout CSS 

grey #a8a7a7;
dark grey #5d5e5e;
aqua #38a7a1;
darkblue #1e3662;

/******************/

html {margin: 0px; padding: 0px;
}

body {color: #636363;
font-family: "trebuchet MS", verdana, helvetica, arial, sans-serif;
font-size: 100%;
margin: 0px; padding: 0px;
background: transparent url(../images/grey_bg.png) top repeat-x;
}

#container {
width: 900px;
margin: 0 auto;}



/***********************************
TOP MENU
***********************************/

#topmenucontainer {padding-top: 20px;}

#topmenucontainer {width: auto;
float: right;}

#topmenu {
float: left;}

#topmenu ul {margin: 0px;
padding: 0px;
padding-bottom: 10px;}

#topmenu li {display: inline;
padding-left: 7px;
padding-right: 7px;
border-right: 1px solid #a8a7a7; 
padding-top: 0px;
padding-bottom: 0px;
}

#topmenu a:link{color: #a8a7a7; 
font-size: 70%;
text-decoration: none;}

#topmenu a:visited {color: #a8a7a7;
font-size: 70%;
text-decoration: none;}

#topmenu a:hover {text-decoration: underline;}

/***********************************
BANNER
***********************************/


#banner {
clear: both;
position: relative;
}

#bannerimagerc {height: 237px;
width: 8px;
background: transparent url(../images/roundcorners.png) top no-repeat;
position: absolute;
z-index: 100;
}

#bannerimage {
position: relative;
float: left;
z-index: 5;}

#sitetitle {
background: transparent url(../images/title_banner.png) no-repeat;
color: #fff;
position: absolute;
float: right;
z-index: 50;
left: 303px;
width: 597px;
height: 237px;
text-align: center;}

#sitetitle h1 {font-weight: normal;
margin-top: 80px;
font-size: 160%;}

#pty { font-size: 60%;}
/***********************************
MAIN MENU
***********************************/

#mainmenu {clear: both;
width: auto;
float: right;}

#mainmenu {
float: right;}


#mainmenu li {
padding-left: 7px;
padding-right: 7px;
background: transparent url(../images/mainmenubg.png) top left no-repeat;
padding-top: 5px;
padding-bottom: 2px;
}

#mainmenu a:link {color: #38a7a1; 
font-size: 80%;
text-decoration: none;}

#mainmenu a:visited {color: #38a7a1;
font-size: 80%;
text-decoration: none;}

#mainmenu a:hover {text-decoration: underline;}

#mainmenu .item2 {background: none;}

/***********************************
BREADCRUMBS
***********************************/

#breadcrumbs {clear: both;
font-size: 70%;
margin-bottom: 0px;
margin-top: 10px;
padding-bottom:5px;
padding-top:15px;
}


/***********************************
PEOPLE
***********************************/

.name {font-weight: bold;
padding-top: 10px;}

#people a:link, #people a:visited {color: #636363; text-decoration: none;}
#people a:hover {color: #1e3662;}


.position {text-transform: italic;
color: #38a7a1;}

#people {padding: 0px;
margin: 0px;}

#people td{vertical-align: top;
text-align: left;
padding-right: 10px;
padding-top: 10px;}

/***********************************
CONTENT
***********************************/


#contentcontainer {float: left;
width: 640px;
margin-right: 20px;
margin-top: 5px;
padding-bottom: 30px;
font-size: 80%;
text-align: left;}


#contentcontainer h1, .contentheading, .componentheading, .componentheading_section,
.contentheading_section,
.contentheading_links,
.componentheading_links{font-weight: bold;
color: #1e3662;
font-size: 170%;}

#contentcontainer h1 {margin-top: 0px;
padding-top: 0px;}

#contentcontainer td {line-height: 1.2em;}

.clientname { color: #38a7a1;
text-transform: italics;}


.visionbox {background: url(../images/visionrp.jpg) repeat-y;
border-collapse: collapse;
}

.visiontext {padding: 10px;
color: #3E8F88;}

.visionbox img {position: relative;
left: -1px;
top: -1px;
}

.visionboxbottom {position: relative !important;
top: 1px !important;} 


.vision {border: 1px solid #38a7a1;
background-color: #EFFFFD;
padding: 10px;
color: #3E8F88;
}

 h2, h3 {
 color: #1e3662;}

h2 {font-size: 130%;
color: #38a7a1;
padding-bottom: 5px;
margin: 0px;}

h3 {font-size: 100%;
font-weight: bold;
}

p {padding-top: 0px;
margin-top: 0px;}

a:link, a:visited {color: #1e3662;}

a:hover {color: #38a7a1;}


.contentpane_links a:link, 
.contentpane_links a:visited {color: #38a7a1;}

.contentpane_links a:hover{color: #1e3662;}


/***********************************
FONT SIZE
***********************************/


#fontsizebox {
float: left;
padding-top: 5px;
padding-right: 20px;
padding-left: 2px;
}

#fontsizebox a:link {color: #a8a7a7 !important; 
font-size: 70%;
text-decoration: none;
padding-left: 5px;
vertical-align: top;
}


#fontsizebox a:visited{color: #a8a7a7 !important; 
font-size: 70%;
text-decoration: none;
padding-left: 5px;
}

#fontsizebox a:hover{color: #1e3662 !important; 
font-size: 70%;
text-decoration: none;
padding-left: 5px;
}



/***********************************
SECTIONS
***********************************/

.section {padding-top: 0px;}

.contentpane_section form .section a{display: block;
font-size: 130%;
padding-top: 20px;}

a.category {display: block;
color: #38a7a1;
font-size: 130%;
padding-top: 10px;}

ul.category_list {list-style-type: none;
padding: 0px;
margin: 0px !important;}

.category_list li {padding-top: 10px;}



/***********************************
LINKS
***********************************/

.contentpane_links .section a {display: block;
font-size: 130%;
padding-top: 10px;}

/************
BLOG FORMAT
*************/

.blog .contentheading {font-size: 130%;
color: #38a7a1;
padding-bottom: 5px;
margin: 0px;}


/*********************************
DOCUMENTS
**********************************/


#documents .sectiontableheader a img {display: none;}

#documents .sectiontableheader a{display: block;
font-size: 130%;
padding-top: 10px;
padding-bottom: 10px;}

#documents .category {display: block;
font-size: 100%;
padding-top: 5px;
position: relative;
left: -10px;} 


/*********************************
CONTACT
**********************************/
#artforms-box {position: relative;
top: -25px;
border: 0px solid red;}

#office {height: 100px;
position: relative;
left: -105px;}


#artforms-box p, #af-emailcopy, .affieldname{font-size: 120%;
line-height: 1.2em;}


#artforms-text h1 {position: relative;
left: -105px;
font-size: 130%;
color: #38a7a1;
padding-bottom: 5px;
margin: 0px;
margin-top: 20px;}

#office td{ padding-right: 30px;
vertical-align: top;}

#office h3{font-size: 120%;
padding: 0px; margin-bottom: 5px;}

/***********************************
RIGHT COL
***********************************/

#rightcol {
width: 210px;
padding-bottom: 30px;
float: left;
font-size: 70%;
COLOR: #a8a7a7;
margin-top: 20px;
} 

#rightcol a:link {color: #38a7a1;}

#rightcol a: visited {color: #38a7a1;}

#rightcol a:hover {color: #38a7a1;}

#rightcol h3 {padding-top: 5px;
font-weight: normal;
color: #1e3662;
margin-bottom: 2px;
font-size: 120%;}

#rightcol div{background:  url(../images/bottombox.png) bottom no-repeat;}

#rightcol .contentpaneopen .contentheading a {
color: #38a7a1;
font-size: 70%;}

#rightcol div div {background:  url(../images/topbox.png) top no-repeat;
padding: 0px 10px 10px}

#mailinglist {}

#dyk {background:  url(../images/bottombox.png) bottom no-repeat;}

#dyk .moduletable div{background: none;
padding: 0px;
margin: 0px;}

#dyk .moduletable .contentpaneopen {position: relative; top: -7px; padding: 0px; margin: 0px;}

.buttonheading a:link, .buttonheading a:visited, .buttonheading a:hover  {color: #a8a7a7; 
font-size: 80%;
text-decoration: none;}

.buttonheading a:hover {text-decoration: underline;}

#logo {padding-top: 16px;
background: none !important;}

/***********************************
FORM
***********************************/

form div {background: none !important;
text-align: left;}

/***********************************
FOOTER
***********************************/

#footer {clear: both;
text-align: center;
background: #38a7a1 url(../images/footer.png) top no-repeat;
width: 899px;
height: 37px;
}

#footer ul {margin: 0px;
padding: 0px;
padding-bottom: 10px;
padding-top: 10px;}

#footer li {display: inline;
padding-left: 7px;
padding-right: 7px;
padding-top: 0px;
padding-bottom: 0px;
border-left: 1px solid #fff;

}

#footer a:link {color: #fff; 
font-size: 80%;
text-decoration: none;}

#footer a:visited {color: #fff;
font-size: 80%;
text-decoration: none;}

#footer a:hover {text-decoration: underline;}

#footer .item13 {background: none;
border: none;}

a.site {color: #38a7a1;
font-family: trebuchet MS;
font-size: 70%;}

/****
CREDIT
*****/

#site {text-align: center;
background: #50B5AC;
width: 899px;}

a.site {color: #81CFC6;
font-family: trebuchet MS;
font-size: 60%;
text-decoration: none;
padding-top: 2px;
}

#site a:visited {color: #81CFC6;}

#site a:hover {color: #1e3662; }

/*************************
SUCKERFISH
*************************/

/** IE bugs: a:link, a:visited, a:hover need to be styled as well; does not display separator... workaround? */
/** customize colors here */
a.mainlevel-son-of-suckerfish-horizontal, a.mainlevel_active-son-of-suckerfish-horizontal, a.mainlevel_current-son-of-suckerfish-horizontal,
a.mainlevel-son-of-suckerfish-horizontal:link, a.mainlevel_active-son-of-suckerfish-horizontal:link, a.mainlevel_current-son-of-suckerfish-horizontal:link,
a.mainlevel-son-of-suckerfish-horizontal:visited, a.mainlevel_active-son-of-suckerfish-horizontal:visited, a.mainlevel_current-son-of-suckerfish-horizontal:visited {
}

a.mainlevel-son-of-suckerfish-horizontal:hover, a.mainlevel_active-son-of-suckerfish-horizontal:hover, a.mainlevel_current-son-of-suckerfish-horizontal:hover {
text-decoration: underline;
}

a.sublevel-son-of-suckerfish-horizontal, a.sublevel_active-son-of-suckerfish-horizontal, a.sublevel_current-son-of-suckerfish-horizontal,
a.sublevel-son-of-suckerfish-horizontal:link, a.sublevel_active-son-of-suckerfish-horizontal:link, a.sublevel_current-son-of-suckerfish-horizontal:link,
a.sublevel-son-of-suckerfish-horizontal:visited, a.sublevel_active-son-of-suckerfish-horizontal:visited, a.sublevel_current-son-of-suckerfish-horizontal:visited {
	background-color: #fff;
	color:  #38a7a1;;
	background-image: none;
}

a.sublevel-son-of-suckerfish-horizontal:hover, a.sublevel_active-son-of-suckerfish-horizontal:hover, a.sublevel_current-son-of-suckerfish-horizontal:hover {
	background-color: #fff;
	color: #38a7a1;
}


ul.mainlevel-son-of-suckerfish-horizontal ul ul a.sublevel-son-of-suckerfish-horizontal, ul.mainlevel-son-of-suckerfish-horizontal ul ul a.sublevel_active-son-of-suckerfish-horizontal, ul.mainlevel-son-of-suckerfish-horizontal ul ul a.sublevel_current-son-of-suckerfish-horizontal,
ul.mainlevel-son-of-suckerfish-horizontal ul ul a.sublevel-son-of-suckerfish-horizontal:link, ul.mainlevel-son-of-suckerfish-horizontal ul ul a.sublevel_active-son-of-suckerfish-horizontal:link, ul.mainlevel-son-of-suckerfish-horizontal ul ul a.sublevel_current-son-of-suckerfish-horizontal:link,
ul.mainlevel-son-of-suckerfish-horizontal ul ul a.sublevel-son-of-suckerfish-horizontal:visited, ul.mainlevel-son-of-suckerfish-horizontal ul ul a.sublevel_active-son-of-suckerfish-horizontal:visited, ul.mainlevel-son-of-suckerfish-horizontal ul ul a.sublevel_current-son-of-suckerfish-horizontal:visited {
	background-color: #FFFF;
	color: #38a7a1;
}

ul.mainlevel-son-of-suckerfish-horizontal ul ul a.sublevel-son-of-suckerfish-horizontal:hover, ul.mainlevel-son-of-suckerfish-horizontal ul ul a.sublevel_active-son-of-suckerfish-horizontal:hover, ul.mainlevel-son-of-suckerfish-horizontal ul ul a.sublevel_current-son-of-suckerfish-horizontal:hover {
	background-color: #fff;
text-decoration: underline;
}

ul.mainlevel-son-of-suckerfish-horizontal .expanded {
	display: block;
	background-image: url() !important;
	background-position: right center;
	background-repeat: no-repeat;
	
}

ul.mainlevel-son-of-suckerfish-horizontal ul .expanded {
	background-image: url("../images/arrow_right.gif");
}

/** customize style / layout here */

a.mainlevel-son-of-suckerfish-horizontal, a.mainlevel_active-son-of-suckerfish-horizontal, a.mainlevel_current-son-of-suckerfish-horizontal, span.mainlevel-son-of-suckerfish-horizontal,
a.mainlevel-son-of-suckerfish-horizontal:link, a.mainlevel_active-son-of-suckerfish-horizontal:link, a.mainlevel_current-son-of-suckerfish-horizontal:link,
a.mainlevel-son-of-suckerfish-horizontal:visited, a.mainlevel_active-son-of-suckerfish-horizontal:visited, a.mainlevel_current-son-of-suckerfish-horizontal:visited,
a.mainlevel-son-of-suckerfish-horizontal:hover, a.mainlevel_active-son-of-suckerfish-horizontal:hover, a.mainlevel_current-son-of-suckerfish-horizontal:hover,
a.sublevel-son-of-suckerfish-horizontal, a.sublevel_active-son-of-suckerfish-horizontal, a.sublevel_current-son-of-suckerfish-horizontal, span.sublevel-son-of-suckerfish-horizontal,
a.sublevel-son-of-suckerfish-horizontal:link, a.sublevel_active-son-of-suckerfish-horizontal:link, a.sublevel_current-son-of-suckerfish-horizontal:link,
a.sublevel-son-of-suckerfish-horizontal:visited, a.sublevel_active-son-of-suckerfish-horizontal:visited, a.sublevel_current-son-of-suckerfish-horizontal:visited,
a.sublevel-son-of-suckerfish-horizontal:hover, a.sublevel_active-son-of-suckerfish-horizontal:hover, a.sublevel_current-son-of-suckerfish-horizontal:hover {
	font-weight: normal;
	font-size: 100%;
	text-align: left;
	text-decoration: none;
	display: block;
	border: 0px solid silver;
	padding: 0.3em 0.5em 0.3em 0.5em;	/* top, right, bottom, left */
}

a.mainlevel-son-of-suckerfish-horizontal, a.mainlevel_active-son-of-suckerfish-horizontal, a.mainlevel_current-son-of-suckerfish-horizontal, span.mainlevel-son-of-suckerfish-horizontal {
}

a.sublevel-son-of-suckerfish-horizontal, a.sublevel_active-son-of-suckerfish-horizontal, a.sublevel_current-son-of-suckerfish-horizontal, span.sublevel-son-of-suckerfish-horizontal {
	font-size: 90%;
	border-top: none;
	height: 1%;	/* this is required for the IE to cause the "hasLayout" property and make the whole anchor clickable - "Holly Hack" */
}

#active_menu-son-of-suckerfish-horizontal,
a.mainlevel_active-son-of-suckerfish-horizontal, a.mainlevel_current-son-of-suckerfish-horizontal,
a.mainlevel_active-son-of-suckerfish-horizontal:link, a.mainlevel_current-son-of-suckerfish-horizontal:link,
a.mainlevel_active-son-of-suckerfish-horizontal:visited, a.mainlevel_current-son-of-suckerfish-horizontal:visited,
a.mainlevel_active-son-of-suckerfish-horizontal:hover, a.mainlevel_current-son-of-suckerfish-horizontal:hover,
a.sublevel_active-son-of-suckerfish-horizontal, a.sublevel_current-son-of-suckerfish-horizontal,
a.sublevel_active-son-of-suckerfish-horizontal:link, a.sublevel_current-son-of-suckerfish-horizontal:link,
a.sublevel_active-son-of-suckerfish-horizontal:visited, a.sublevel_current-son-of-suckerfish-horizontal:visited,
a.sublevel_active-son-of-suckerfish-horizontal:hover, a.sublevel_current-son-of-suckerfish-horizontal:hover {
	font-weight: bold;
	color: #5d5e5e !important;
}

ul.mainlevel-son-of-suckerfish-horizontal, .mainlevel-son-of-suckerfish-horizontal ul {
	padding: 0;
	margin: 0;
	list-style: none;
	line-height: 1;
	z-index: 100;
}

ul.mainlevel-son-of-suckerfish-horizontal li {
	padding: 0;
	margin: 0;
	float: left;
}

ul.mainlevel-son-of-suckerfish-horizontal li li {
	position: relative;
	display: block;
	width: 10em;
	
}


ul.mainlevel-son-of-suckerfish-horizontal ul {
border: 1px solid silver;
	display: block;
	position: absolute;
	left: -999em;
	/*margin: -0.2em 0 0 0em; */
	width: auto;
	height: auto;
	z-index: 101;
	background-color: #fff;
	
}


ul.mainlevel-son-of-suckerfish-horizontal li li ul {
	margin: -1.8em 0 0 10em;
	z-index: 102;
}


/** IE7.0 workaround */
ul.mainlevel-son-of-suckerfish-horizontal li:hover, ul.mainlevel-son-of-suckerfish-horizontal li.hover {
	position: static;
}


/** general on-mouse-over display */

ul.mainlevel-son-of-suckerfish-horizontal li:hover ul,
ul.mainlevel-son-of-suckerfish-horizontal li.hover ul {
	left: auto;
}

ul.mainlevel-son-of-suckerfish-horizontal li:hover ul ul,
ul.mainlevel-son-of-suckerfish-horizontal li.hover ul ul {
	left: -999em;
}

ul.mainlevel-son-of-suckerfish-horizontal li:hover ul li:hover ul,
ul.mainlevel-son-of-suckerfish-horizontal li.hover ul li.hover ul {
	left: auto;
}


ul.mainlevel-son-of-suckerfish-horizontal, ul.mainlevel-son-of-suckerfish-horizontal li li {
	clear: left;
	background:transparent none repeat scroll 0 0 !important;
}

/** separator */
span.mainlevel-son-of-suckerfish-horizontal, span.sublevel-son-of-suckerfish-horizontal {
	display: block;
	width: 1em;
	border-width: 0px;
	margin-left: 1em;
	padding: 0;
	padding-top: 1px;
}

/** IE5.0/win workaround: the ">" is handled like a "," */
ul.mainlevel-son-of-suckerfish-horizontal > ul.mainlevel-son-of-suckerfish-horizontal {
	position: absolute;
	top: 5em;	/* change the absolute position for IE5.0 here */
}
ul.mainlevel-son-of-suckerfish-horizontal > ul.mainlevel-son-of-suckerfish-horizontal li.hover ul {
	margin: 0.1em 0 0 0em;	/* top, right, bottom, left */
}
ul.mainlevel-son-of-suckerfish-horizontal > ul.mainlevel-son-of-suckerfish-horizontal li.hover ul ul {
	margin: -1.6em 0 0 10em;	/* top, right, bottom, left */
}

/* ---------------- Template Layout ----------------------*/

.level0{
margin-left :0px;
}

.level0:hover{
}

.level1{
  margin-left :30px;
}

.level1:hover{
}

.level2{
  margin-left :60px;
}

.level2:hover{

}

.level3{
  margin-left :90px;
}

.level3:hover{

}

.level4{
  margin-left :120px;
}

.level4:hover{

}

.level5{
  margin-left :150px;
}

.level5:hover{

}

.level6{
  margin-left :180px;
}

.level6:hover{

}

.level7{
  margin-left :210px;
}

.level7:hover{

}

.level8{
  margin-left :240px;
}

.level8:hover{

}

.level9{
  margin-left :270px;
}

.level9:hover{

}

.levelx{
  margin-left :300px;
}

.levelx:hover{

}

.description
{
  margin-left :40px;
  font-size: 10px;
  color: #999966;
}

.sponsor, .sponsor a:hover, .sponsor a:link, .sponsor a:visited
{
  text-align:center;
  font-size: 9px;
  color: #999966;
}