/* clearfix */
.clearthis:after
{
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}

.clearfix {display: inline-table;}

/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */





body {
	font-family: Verdana, Arial, sans-serif;
	margin: 0px;
	padding: 0px;
	position: relative;
	font-size: 10px;
	color: #333;
	background-color: #9A999A;
	text-align: center;
}

* { 
	margin: 0; 
	padding: 0;
}


/* Links */

a:link, a:visited {
	color: #fff;	
	text-decoration:none;
}

a:hover {
	color: #cc0000;
}

body#clientloginpage #side-nav a.insection,
body#contactpage #side-nav a.insection,
#side-nav li a:hover,
body#homepage div#news a:hover,
dl#about-subsubnav dt a:hover,
ul#about-subsubnav li a:hover,
div#portfolio dt a:hover,
div#portfolio dd a:hover,
body#contactpage div#maintext a:hover, 
body#contactpage div#employmenttext a:hover 
{
	color: #cc0000;
}



/* ~~ General ~~ */
.alt {
	display: none;
	visibility: hidden;
}

img { 
	border: 0; 
	display: block;
	margin-bottom: 1px;
}

img.txtimg
{
	visibility: visible;
	background-repeat: no-repeat;
	background-position: 0 0;
}



ul { list-style: none; }
p { margin-bottom: 0.7em; }

h1 { 
	position: relative;
	top: 31px;
	left: 110px;
	float: left;
	width: 137px;
	}

	
h2 {
	height: 55px;
	width: 800px;
	background-color: #aaa;
	margin: 10px 0;
}






/* COMMON LAYOUT
----------------------------------------------------- */


#wrapper {
	margin: 0 auto;
	width: 820px;
	background-color: #fff;
	position: relative;
}	

#container {
	padding: 10px;
	background-color: #fff;
	text-align: left;
}

div#header {
	width: 800px;
	height: 200px;
	background: #fff url(images/header_bkgd.gif) no-repeat top left;
}

div#footer {
	width: 800px;
	margin: 0 auto;
	font-size: 0.9em;
	text-align: right;
	padding-top: 3px;
	background-color: #9A999A;
	
}


/* NAVIGATION
----------------------------------------------------- */

#main-nav {
	position: absolute;
	top: 170px;
	left: 550px;
	width: 257px;
	height: 27px;
	background: url(images/main_nav.gif) no-repeat;
}

#main-nav li { position: absolute; top: 0; }

#main-nav li, #main-nav a {
	height: 27px;
	display: block;
}

#main-nav #home { left: 0; width: 55px; }
#main-nav #about { left: 56px; width: 55px; }
#main-nav #commercial {
	left: 111px;
	width: 66px;
}
#main-nav #game {
	left: 178px;
	width: 75px;
}

body#homepage #main-nav #home,
#main-nav #home a:hover { background: transparent url(images/main_nav.gif) 0 -27px no-repeat; }

body#aboutpage #main-nav #about,
body#profilespage #main-nav #about,
#main-nav #about a:hover { background: transparent url(images/main_nav.gif) -56px -27px no-repeat; }

body#commercialpage #main-nav #commercial,
#main-nav #commercial a:hover { background: transparent url(images/main_nav.gif) -111px -27px no-repeat; }

body#gamepage #main-nav #game,
#main-nav #game a:hover {
	background: transparent url(images/main_nav.gif) -178px -27px no-repeat;
}

#side-nav {
	position: absolute;
	top: 18px;
	left: 697px;
	text-align: right;
}

#side-nav li {
	padding-bottom: 5px;
}

#side-nav li a {
	color: #aaa;
	font-size: 0.9em;
}




/* end */



/* HOME
----------------------------------------------------- */

body#homepage h2 {
	background: #aaa url(images/hdr_welcome.gif) no-repeat 579px 50%;
}

body#homepage div#content {
	background: transparent url(images/home_bkgd.gif) no-repeat 0 0;
	width: 800px;
	height: 325px;
}

body#homepage div#maintext {
	position: relative;
	top: 40px;
	left: 124px;
	width: 345px;
	height: 120px;
	overflow: auto;
}	

body#homepage div#news {
	position: absolute;
	top: 465px;
	left: 160px;
	width: 400px;
	height: 100px;
}	

body#homepage div#news {
	color: #666;
}

body#homepage div#news .date {
	margin-bottom: 5px;
	display: block;
}

body#homepage div#news .date {
	color: #333;
}


#view-work {
	position: absolute;
	top: 328px;
	left: 604px;
	width: 1px;
	height: 1px;
	background: url(images/home_view_work.gif) no-repeat;
}



#view-work li, #view-work a {
	width: 180px;
	height: 20px;
	display: block;
}

#view-work #btn-commercial { top: 0; height: 80px; }
#view-work #btn-game{ top: 81px; height: 80px; }

#view-work #btn-commercial a:hover { background: transparent url(images/home_view_work.gif) -155px 0 no-repeat; }

#view-work #btn-game a:hover { background: transparent url(images/home_view_work.gif) -155px -81px no-repeat; }


/* ABOUT
----------------------------------------------------- */

body#aboutpage h2,
body#profilespage h2 {
	background: #aaa url(images/hdr_about_us.gif) no-repeat 579px 50%;
}

body#aboutpage h3,
body#profilespage h3 {
	color: #fff;
	font-size: 1.1em;
	font-weight: normal;
	margin-bottom: 1em;
}

body#aboutpage div#sidebar,
body#profilespage div#sidebar {
	float: left;
	width: 177px;
	display: inline;
}

body#aboutpage div#content,
body#profilespage div#content {
	background: transparent url(images/about_us_bkgd.gif) repeat-y 0 0;
	width: 800px;
	height: 350px;
}

body#aboutpage div#maintext,
body#profilespage div#maintext {
	padding-top: 17px;
	margin-left: 265px;
	width: 490px;
	line-height: 1.2;
}




#about-subnav {
	position: relative;
	width: 177px;
	height: 74px;
	background: url(images/about_subnav.gif) no-repeat;
}

#about-subnav li { position: absolute; top: 0; }


#about-subnav li, #about-subnav a {
	width: 177px;
	height: 36px;
	display: block;
}

#about-subnav #btn-about { top: 0; height: 36px;}
#about-subnav #btn-profiles{ top: 37px; height: 37px; }

body#aboutpage #about-subnav #btn-about,
#about-subnav #btn-about a:hover { background: transparent url(images/about_subnav.gif) -177px 0 no-repeat;}

body#profilespage #about-subnav #btn-profiles,
#about-subnav #btn-profiles a:hover { background: transparent url(images/about_subnav.gif) -177px -37px no-repeat; }

body#aboutpage .date {
	display: block;
	margin-bottom: 1em;
}

#about-subsubnav {
	margin: 14px;
}

dl#about-subsubnav {
	width: 157px;
}

dl#about-subsubnav dd,
ul#about-subsubnav li{
	margin-bottom: 0.5em;
}


dl#about-subsubnav dt a,
ul#about-subsubnav li a {
	color: #333;
	font-weight: bold;
}


dl#about-subsubnav dd {
	color: #fff;
	font-size: 1.1em;
	margin-bottom: 0.5em;
}	

dl#about-subsubnav dt {
	margin-bottom: 0.5em;
}

#founder { 
	width: 60px;
	height: 12px;
	background: transparent url(images/subhdr_founder.gif) 0 0 no-repeat; 
}

#profiles { 
	width: 60px;
	height: 25px;
	background: transparent url(images/subhdr_profiles.gif) 0 5px no-repeat; 
}

#profileinfo {
	width: 489px;
	height: 95px;

}
#specs {
	position: relative;
	width: 387px;
	height: 95px;
	float: left;
	display: inline;
}

#specstext {
	text-align: right;
	margin-top: 60px;
}


/* Hides from IE-mac \*/
#specstext {
	position: absolute;
	bottom: 0;
	right: 15px;
	text-align: right;
}
/* End hide from IE-mac */



#specstext a {
	color: #333;
}

#specstext a:hover {
	color: #cc0000;
}

img#photo {
	float: right;
	display: inline;
}

#biotext {
	margin-top: 25px;
	line-height: 1.3em;
	text-align: justify;
	
}
.fullname {
	font-weight: bold;
}

/* COMMERCIAL / GAMES
----------------------------------------------------- */


body#commercialpage h2 {
	background: #aaa url(images/hdr_commercial.gif) no-repeat 525px 50%;
}

body#gamepage h2 {
	background: #aaa url(images/hdr_game.gif) no-repeat 658px 50%;
}

#view-reel {
	position: absolute;
	top: 220px;
	left: 10px;
	width: 143px;
	height: 55px;
	background: url(images/view_reel.gif) no-repeat;
}

#view-reel li { position: absolute; top: 0; }

#view-reel li, 
body#commercialpage #view-reel a,
body#gamepage #view-reel a {
	height: 55px;
	display: block;
}

#view-reel #btn-view-reel { left: 0; width: 143px; }

#view-reel #btn-view-reel a:hover { background: transparent url(images/view_reel.gif) 0 -55px no-repeat; }

#col1, #col2 , #col3{
	background-color: #fff;
	width: 261px;
}


#col2 {
	position: absolute;
	top: 225px;
	left: 280px;
	height: 26px;
}
#col3 {
	position: absolute;
	top: 225px;
	left: 550px;
}


div#portfolio dl {
	margin: 0 0 10px 0;
	height: 97px;
	width: 394px;
}
#portfolio {
	margin-top: 15px;
}


div#portfolio dt {
	float: left;
	width: 66px;
	padding-top: 20px;
	font-weight: bold;
}

div#portfolio dt a,
div#portfolio dd a {
	color: #333;
}


div#portfolio dt span.smaller {
	font-size: 0.9em;
}

div#portfolio dd.desc {
	margin-left: 235px;
	padding-top: 20px;
	width: 149px;
}

div#portfolio dd.photo img {
	float: left;
	margin-right: 6px;
	height: 97px;
}

div#archive {
	font-size: 0.9em;
	background-color: #9a999a;
	color: #fff;
	padding: 10px 10px 20px 20px;
	height: 40px;

}

div#archive h3 {
	font-weight: normal;
	font-size: 1em;
}

div#archive ul {
	margin-top: 15px;
	float: left;
	position: relative;
	width: 187px;
	margin-right: 5px;
}

div#archive li {
	background: #9a999a url(images/four_dots.gif) no-repeat 0 50%;
	padding-left: 10px;
	margin-bottom: 5px;
}


/* CLIENT LOGIN 
----------------------------------------------------- */

body#clientloginpage h2 {
	padding-top: 80px;
	background: #c6c6c6 url(images/hdr_client_access.gif) no-repeat 540px 80px;
}

body#clientloginpage div#content {
	background-color: #c6c6c6;
	margin-top: -10px;
	width: 800px;
}

#loginForm {
	margin-left: 538px;
	background-color: #c6c6c6;
}


#loginForm img {
	margin-left: 147px;
}

#loginForm input.textbox
{
	width: 213px;
	margin-bottom: 20px;
	font-size: 12px;
}

#loginForm img#forgot_password {
	margin-top: -15px;
	margin-left: 50px;
	padding-bottom: 15px;
}


#loginForm #login {
	margin-left: 160px;
	padding-bottom: 30px;
}

/* CONTACT
----------------------------------------------------- */

body#contactpage h2 {
	background: #aaa url(images/hdr_contact.gif) no-repeat 540px 50%;
}

body#contactpage div#content {
	background: transparent url(images/contact_bkgd.gif) repeat-y 0 0;
	width: 800px;
}

body#contactpage div#map {
	float: left;
	padding: 10px 35px;
	height: 350px;
	text-align: center;
}

#map-links {
	position: absolute;
	top: 625px;
	left: 175px;
	width: 142px;
	height: 45px;
	background: url(images/map_links.gif) no-repeat;
}

#map-links li { position: absolute; top: 0; }

#map-links li, #map-links a {
	width: 142px;
	height: 23px;
	display: block;
}

#map-links #btn-yahoomap { top: 0; height: 23px; }
#map-links #btn-printmap { top: 24px; height: 23px; }

#map-links #btn-yahoomap a:hover { background: transparent url(images/map_links.gif) -142px 0 no-repeat; }

#map-links #btn-printmap a:hover { background: transparent url(images/map_links.gif) -142px -24px no-repeat; height: 20px;}



body#contactpage div#maintext {
	padding: 10px 0 10px 0;
	margin-left: 542px;
	width: 233px;
}

body#contactpage div#maintext a,
body#contactpage div#employmenttext a{
	color: #333;
}


body#contactpage h3 {
	font-size: 10px;
	font-weight: normal;
	margin: 20px 0 10px 0;
}

body#contactpage div#employment {
	margin-left: 480px;
	width: 255px;
	padding: 5px 0 10px 63px;
	background-color: transparent;
	background-repeat: repeat-x;
	background-position: left top;
}

body#contactpage div#employmenttext {
	width: 195px;
	padding-bottom: 1em;
}

body#map {
	background-color: #c6c6c6;
}
#texto-foto {
	left:20px;
	height:55px;
	float: right;
	width: 155px;
	padding-top: 9px;
}
#subfoto {
	display: block;
	height: 65px;
	width: 260px;
	margin-bottom: 8px;
	background-color: #c6c6c6;
	color: #333333;
}

#fotito {
	height: 64px;
	width: 94px;
}