/* CSS Document */

/************************************************************************

	Site:		atwaterplace.com

	Author:		eROI		[www.eroi.com]  

	Client:		Atwater		[http://www.atwaterplace.com]

	Listing Order:
	==============

	1 - Global
	2 - Structure/Layout
	3 - Footer Navigation
	

************************************************************************/

/***********************************************************************
	1 - GLOBAL STYLES
************************************************************************/

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, 
blockquote, pre, a, abbr, acronym, address, big, cite, code,del, dfn, em, 
font, img, ins, kbd, q, s, samp,small, strike, strong, sub, sup, tt, var, 
b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, 
table, caption, tbody, tfoot, thead, tr, th, td {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-size: 100%;
    font-weight: inherit;
    font-style: inherit;
    vertical-align: baseline;
    background: transparent;
}

body {
    line-height: 1.0;
    background:#000000 url(../images/background-body-tile2.gif) top center repeat-y;
    color: #666666;
	text-align:center;
	font-size:11px;
	font-family:Helvetica, verdana, sans-serif, arial;
	/*background:url(../images/background-template.jpg) top no-repeat;  FPO background  */
	height:100%;
}

ol, ul {
    list-style: none;
}

/* tables still need 'cellspacing="0"' in the markup */
table {
    border-collapse: separate;
    border-spacing: 0;
}

a{
	color:#ffffff;
	font-family:Helvetica, verdana, sans-serif, arial;
	font-size:11px;
	text-decoration:none;
}

a:hover{
	color:#dad9d9;
}

/**************** -- GLOBAL CLASSES -- ****************/

.invisible{
	display:none;
}

.italic{
	font-style:italic;
	padding-right:3px;
}

.whiteLink{
	color:#ffffff;
	font-size:12px;
}

.bucketLink{
	margin-left:6px;
}

/***********************************************************************
	2 - STRUCTURE/LAYOUT STYLES
************************************************************************/

#container{
	width:962px;
	background:#000000;
	margin-top:10px;
	margin-right:auto;
	margin-left:auto;
	overflow:hidden;
	padding-bottom:20px;
}

/**************** -- HEADER UPPER / NAVIGATION -- ****************/

#header{
	width:962px;
	height:68px;
	background:url(../images/header-background-tile.jpg) repeat-x;	
	/*border:1px solid #fff;*/
	position:relative;
}

#logo{
	width:171px;
	height:65px;
	background:url(../images/wacom-logo-over.jpg)  no-repeat;
	float:left;
}

#logo_link{
	display:block;
	width:71px;
	height:65px;
	background:url(../images/wacom-logo.jpg) no-repeat;
	float:left;	
}

#logo_link:hover{
	background:none;
}

#header_right{
	width:380px;
	height:65px;
	background:url(../images/header-background-right.jpg) top right no-repeat;	
	float:right;
}

#navigation{
	font-family:Helvetica, verdana, sans-serif, arial;	
	width:380px;
	padding-top:10px;
	padding-bottom:8px;
}

#navigation ul{
	margin-top:25px;
}

#navigation ul li{
	display:inline;
	padding-right:15px;
}

#navigation ul li a{
	font-size:15px;
	padding-top:8px;
	padding-bottom:8px;
}

#nav_bar{
	position:absolute;
	top:64px;
}

#pink_arrow{
	position:absolute;
	top:66px;
	left:30px;
}

/**************** -- SUBNAV DROPDOWN -- ****************/
#dropdown{
	width:962px;
	height:79px;
	background:#000000 url(../images/dropdown-background-tile.jpg) repeat-x;   
	display:none;
}

#dropdown ul li{
	width:142px;
	height:48px;
	float:left;
	margin-top:16px;
	margin-left:42px;
	cursor:pointer;
}

#dropdown ul li a{
	display:block;
	width:142px;
	height:48px;
	float:left;
}

#express_key_displays{
	background:url(../images/subnav_1_btn.jpg) top no-repeat;	
}
#touch_ring{
	background:url(../images/subnav_2_btn.jpg) top no-repeat;	
}
#ambidextrous_design{
	background:url(../images/subnav_3_btn.jpg) top no-repeat;	
}
#new_grip_pen{
	background:url(../images/subnav_4_btn.jpg) top no-repeat;	
}
#pen_tip_sensor{
	background:url(../images/subnav_5_btn.jpg) top no-repeat;	
}

#express_key_displays_over{
	background:url(../images/subnav_1_btn_over.jpg) top no-repeat;	
}
#touch_ring_over{
	background:url(../images/subnav_2_btn_over.jpg) top no-repeat;	
}
#ambidextrous_design_over{
	background:url(../images/subnav_3_btn_over.jpg) top no-repeat;	
}
#new_grip_pen_over{
	background:url(../images/subnav_4_btn_over.jpg) top no-repeat;	
}
#pen_tip_sensor_over{
	background:url(../images/subnav_5_btn_over.jpg) top no-repeat;	
}

/*   -------------THIS SECTION IS KNOW BEING HANDLED BY JQUERY FADE EFFECT
#express_key_displays:hover{   
	background:none;	
}
#touch_ring:hover{
	background:none;	
}
#ambidextrous_design:hover{
	background:none;	
}
#new_grip_pen:hover{
	background:none;	
}
#pen_tip_sensor:hover{
	background:none;	
}

*/
/**************** -- MAIN CONTENT -- ****************/

/*  -->Home Page<--  */

#content_flash{	
	position:relative;
	margin:10px auto;
	display:block;
	width:926px;
	height:450px;
	background:#000000;
}

#content_lower ul{
	margin-top:10px;
}

#content_lower{
	text-align:left;
}

#content_lower img{
	position:relative;
	top:1px;
}

#content_lower ul li{
	float:left;
	padding-left:17px;

}

#content_lower ul li a{
	display:block;
	float:left;
	width:300px;
	height:198px;	
}

#content_lower ul li a span span{
	color:#ffffff;
}

#order_link{
	background:url(../images/bucket_1_background.jpg) top no-repeat;	
}

#size_link{
	background:url(../images/bucket_2_background.jpg) top no-repeat;	
}

#profiles_link{
	background:url(../images/bucket_3_background.jpg) top no-repeat;	
}

.bucketTitle{
	font-size:18px;
	position:relative;
	top:20px;
	left:5px;
}

.bucketContent{
	font-size:12px;
	display:block;
	width:166px;
	position:relative;
	top:80px;
	color:#aeaeae;
	padding-left:8px;
	line-height:15px;
}

.bucketContent1{
	font-size:12px;
	display:block;
	width:166px;
	position:relative;
	top:65px;
	color:#aeaeae;
	padding-left:8px;
	line-height:15px;	
}

/***********************************************************************
	3 - FOOTER
************************************************************************/

#footer{
	width:100%;
	min-height:203px;
	height:auto !important;
	height:203px;
	background:#ffffff;
	margin-left:0px;
	background:#000000 url(../images/footer-tile.jpg) top repeat-x;
	clear:both;
}

#footer_content{
	width:962px;
	margin:0px auto;
	text-align:left;
}

#footer_content ul{
	padding-top:30px;
}

#footer_content ul li {
	padding-left:12px;
	display:inline;
}

#footer_content ul li a{
	color:#7c7c7c;
}

#footer_content ul li a:hover{
	color:#ffffff;
}

#footer_content div{
	padding-left:12px;
	margin-top:15px;
}

/* CSS Document */

/************************************************************************

	Site:		atwaterplace.com

	Author:		eROI		[www.eroi.com]  

	Client:		Atwater		[http://www.atwaterplace.com]

	Listing Order:
	==============

	1 - Global
	2 - Structure/Layout
	3 - Footer Navigation
	

************************************************************************/

/***********************************************************************
	1 - GLOBAL STYLES
************************************************************************/

div#content_static:after,
div#designerInfo:after
{
	clear: both;
	content: ".";
	display: block;
	height: 0;
	visibility: hidden;
}

a.r_arrow {
	background: url(../images/icon_right-arrow.gif) 100% 50% no-repeat;
	padding: 0 13px 0 0;
	font-size:12px;
	color:#ffffff;
}

.buyLink{
	margin-bottom:20px;

}

.specsSizeLink{
	float:left;
	position:relative;
	margin-right:16px;
	margin-bottom:20px;
}

.specsSizeLink a{
	font-size:14px;
	color:#AEAEAE;
}

.specsSizeLink a:hover{
	color:#ffffff;
}


/***********************************************************************
	2 - STRUCTURE/LAYOUT STYLES
************************************************************************/

div#content_static {
	background: url(../images/bg_content.gif) left top repeat-x;
	color: #aeaeae;
	font: 14px Helvetica, Arial, sans-serif;
	margin-left: auto;
	margin-right: auto;
	padding: 47px 33px 0 30px;
	text-align: left;
	width: 883px;
	overflow:hidden;
	position:relative;
}

div#content_static2, div#content_static3{
	background: url(../images/bg_content.gif) left top repeat-x;
	color: #aeaeae;
	font: 14px Helvetica, Arial, sans-serif;
	margin-left: auto;
	margin-right: auto;
	padding:0px;
	text-align: left;
	width: 943px;
	overflow:hidden;
}


.featuresPage div#content_static, .featuresPage div#content_static2{
	min-height:600px;
	height:auto !important;
	height:600px;
}

.featuresPage div#content_static3{
	min-height:700px;
	height:auto !important;
	height:700px;
}

div#lColumn {
	float: left;
	margin: 0 36px 0 0;
	width: 432px;
	overflow:visible;
}

div#rColumn {
	float: left; 
	width: 414px;
}

div#lColumn2 {
	float: left;
	margin: 0 16px 0 0;
	width: 462px;
}

div#rColumn2{
	float: left; 
	width: 390px;
}


div#lColumn3{
	float: left;
	margin: 0 16px 0 0;
	width: 390px;
}

div#rColumn3{
	float: left; 
	width: 462px;
}

div#lColumn4{
	float: left;
	margin: 0 16px 0 0;
	width: 434px;
	/*background:url(../images/features_touch_ring_header_img.jpg) top right no-repeat;*/
}

div#rColumn4{
	float: left; 
	width: 372px;
}

div#designerInfo {
	padding: 0 0 25px 0;
}

div#content_profile_galler {
	background: url(../images/flash_background.jpg) left top repeat-x;
	color: #aeaeae;
	font: 14px Helvetica, Arial, sans-serif;
	margin-left: auto;
	margin-right: auto;
	text-align: left;
	width: 946px;
	height:458px;
}

/*  -->features touch ring page<--  */

#features_content_touch_ring, #features_content_grip_pen, #specs_size_description{
	width:340px;
}

#content_touch_ring{
	background: url(../images/features_touch_ring_img.gif) top right no-repeat;
	color: #aeaeae;
	font: 14px Helvetica, Arial, sans-serif;
	margin-left: auto;
	margin-right: auto;
	padding: 47px 33px 0 30px;
	text-align: left;
	width: 883px;
	overflow:hidden;
}

#touch_ring_animation{
	position:relative;
	top:115px;
	left:54px;
}

/*  -->features grip pen page<--  */

#content_grip_pen{
	color: #aeaeae;
	font: 14px Helvetica, Arial, sans-serif;
	margin-left: auto;
	margin-right: auto;
	padding: 47px 33px 0 30px;
	text-align: left;
	width: 883px;
	overflow:hidden;
	min-height:700px;	
	height:auto !important;
	height:700px;
}

#content_pen_grip_dynamic{
	margin-top:70px;
}

h2{  /*#content_pen_grip_dynamic */
	color:#ffffff;
	font-size:18px;
	margin-bottom:20px;
	clear:both;
}

#content_pen_grip_dynamic p{
	font-size:14px;
	line-height:18px;
	margin-bottom:20px;
	width:390px;
}

/*  -->specs page<--  */

#content_specs{
	background: url(../images/specs_img.gif) top right no-repeat;
	color: #aeaeae;
	font: 14px Helvetica, Arial, sans-serif;
	margin-left: auto;
	margin-right: auto;
	padding: 47px 33px 0 30px;
	text-align: left;
	width: 883px;
	overflow:hidden;
	min-height:900px;	
	height:auto !important;
	height:900px;
}

#specs_size_img{
	display:block;
	width:441px;
	height:429px;
	background: url(../images/specs_size_small_img.jpg) top left no-repeat;
	margin-top:20px;
	margin-bottom:40px;
	clear:both;
}

#specs_info{
	position:relative;
	top:460px;
	left:40px;
	overflow:hidden;
	margin-bottom:20px;
}

#specs_package_list{
	width:360px;
	margin-bottom:40px;
}

#specs_requirements{
	width:340px;	
}

#specs_package_list li{
	list-style:disc;
	margin-left:15px;
	line-height:20px;
}


/***********************************************************************
	3 - MAIN CONTENT
************************************************************************/

/*  -->profile pages<--  */

div#lColumn h1, div#lColumn2 h1, div#lColumn3 h1, div#lColumn4 h1{
	color: #c90062;
	font-size: 40px;
	font-weight: normal;
	padding: 0 0 28px 0;
}

div#lColumn4 h1{
	width:300px;
}

div#lColumn div#bioContent p {
	line-height: 150%;
	padding: 0 0 20px 0;
}

div#designerInfo img {
	float: left;
	margin: 0 14px 0 0;
}

div#designerInfo p {
	line-height: 150%;
}

div#rColumn img {
	border: 1px solid #484848;
}

/*  -->gallery page<--  */

.profileContent img{
	position:relative;
	top:1px;
}

.profileContent div.whiteLink{
	color:#ffffff;
	font-size:12px;
}


#bulb_link{
	display:block;
	width:30px;
	height:30px;
	background:url(../images/features-orb-small.gif) top no-repeat;
	position:relative;
	left:50px;
	top:120px;
	cursor:pointer;
}

#bulb_link_over{
	display:block;
	width:30px;
	height:30px;
	background:url(../images/features-orb-big.gif) top no-repeat;
	cursor:pointer;
}

#bulb_link2{
	display:block;
	width:30px;
	height:30px;
	background:url(../images/features-orb-small.gif) top no-repeat;
	position:relative;
	left:325px;
	top:-110px;
	cursor:pointer;
}

#bulb_link_over2{
	display:block;
	width:30px;
	height:30px;
	background:url(../images/features-orb-big.gif) top no-repeat;
	cursor:pointer;
}

#bulb_link3{
	display:block;
	width:30px;
	height:30px;
	background:url(../images/features-orb-small.gif) top no-repeat;
	position:relative;
	left:10px;
	top:120px;
	cursor:pointer;
}

#bulb_link_over3{
	display:block;
	width:30px;
	height:30px;
	background:url(../images/features-orb-big.gif) top no-repeat;
	cursor:pointer;
}

.featuresContent{
	line-height:18px;
	margin-bottom:20px;
}

#features_key_displays_img{
	width:339px;
	height:526px;
	background:url(../images/features-key-displays-img.jpg) top no-repeat;	
	left:688px;
	position:absolute;
}

#features_tip_sensors_img{
	position:absolute;
	width:469px;
	height:443px;
	background:url(../images/features-tip-sensor-img.gif) top no-repeat;	
	left:624px;	
	top:45px;
}

#video_player{
	margin-top:36px;
	margin-bottom:30px;
}

#site_map{
	margin-bottom:30px;
}

#site_map ul li{
	margin-left:25px;
	list-style:disc;
}

#pen_grip_flash{
	display:block;
	width:463px;
	height:679px;
	position:relative;
	top:-47px;
}

#rColumn4{
	width:463px;
	float:right;
}

/* Slider Parts */

.sliderGallery {
    overflow: hidden;
    position: relative;
    padding: 10px;
    height: 458px;
    width: 900px;
	margin:0px auto;
	top:20px;
	clear:both;
}

.sliderGallery ul {
    position: absolute;
    list-style: none;
    overflow: none;
    white-space: nowrap;
    padding: 0;
    margin: 0;
	height:420px;
	width:2840px;

}

.sliderGallery ul li {
	float:left;
	height:371px;
	position:relative;
	top:0;
	overflow:visible;
	cursor: pointer;
	margin-right:18px;
}

.sliderGallery ul li ul li{
	display:block;
	float:none;
}

.sliderGallery ul li a{
    display: block;
	float:left;
	width:453px;
	height:371px;
}

.slider{
	position: absolute;
	cursor: pointer;
	top:400px;
	width:886px;
	height:23px;
	margin:0px auto;
	background:url(../images/slider-holder.jpg) top no-repeat;
}

.handle {
    position: absolute;
    cursor: pointer;
    top: 1px;
    z-index: 1000;
    height: 21px;
    width: 100px;
	/* border:solid 1px red; */
	background:url(../images/clear.gif) repeat;
}

.handleUnder {
    position: absolute;
    cursor: pointer;
    top: 1px;
    z-index: 10;
    height: 21px;
    width: 100px;
	background:url(../images/slider-handle.gif) top no-repeat;
}

.slider-lb1{
    position: absolute;
    top: 4px;
    z-index: 100;	
	left:30px;
}

.slider-lb2{
    position: absolute;
    top: 4px;
    z-index: 100;
	left:190px;
}

.slider-lb3{
    position: absolute;
    top: 4px;
    z-index: 100;
	left:370px;
}

.slider-lb4{
    position: absolute;
    top: 4px;
    z-index: 100;
	left:520px;
}

.slider-lb5{
    position: absolute;
    top: 4px;
    z-index: 100;
	left:675px;
}

.slider-lb6{
    position: absolute;
    top: 4px;
    z-index: 100;
	left:820px;
}


/* Slider Profile */

.profile{
	width:453px;
	height:371px;
}

.profileContent{
	position:relative;
	left:8px;
	top:20px;
	width:190px !important;
}

.profileContent div{
	line-height:18px;
	color:#aeaeae;
	font-size:12px;
	margin-bottom:4px;
	
}

.profileContent div.profileName{
	color:#ffffff;
	font-size:18px;
	margin-bottom:20px;
}

#profile_david_carron{
	background:url(../images/slider-david-carron.jpg) bottom no-repeat;	
}

#profile_julieanne_kost{
	background:url(../images/slider-julieanne-kost.jpg) bottom no-repeat;	
}
#profile_marc_burnet{
	background:url(../images/slider-marc-burnet.jpg) bottom no-repeat;	
}
#profile_rodrigo_e{
	background:url(../images/slider-rodrigo-e.jpg) bottom no-repeat;	
}
#profile_david_mejias{
	background:url(../images/slider-david-mejias.jpg) bottom no-repeat;	
}
#profile_ryan_roche{
	background:url(../images/slider-ryan-roche.jpg) bottom no-repeat;	
}
#profile_david_carron{
	background:url(../images/slider-david-carron.jpg) bottom no-repeat;	
}

.profile_1 span{
	/*position:relative;
	left:10px;*/
}

#content_static{
	min-height:500px;
	height:auto !important;
	height:500px;
}

#express_key_displays:hover{   
	background:none;	
}
#touch_ring:hover{
	background:none;	
}
#ambidextrous_design:hover{
	background:none;	
}
#new_grip_pen:hover{
	background:none;	
}
#pen_tip_sensor:hover{
	background:none;	
}
