
/* global elements
 * ------------------------------------------------------------------------- */
 
body {
	background: #fff url("../images/bg-body.jpg") top left repeat-x;
	font: normal 16px/110% Verdana, Arial, Helvetica, sans-serif;
	color: #000;
	margin: 0;
	padding: 0;
}

.hidden { display: none; }

.clear { 
	clear: both; 
	height: 1em; 
	overflow: hidden; 
}

.backtop {
	text-align:right;
}

h1, h2, h3 {
	margin-bottom: 0.75em; line-height: 1.2em;
}

h1	{ font-size: 2.00em; color: #AF3A59; } /* old #AF3A59*/
h2	{ font-size: 1.83em; color: #A42146; } /* old #A63754 */
h3	{ font-size: 1.50em; color: #7C1E3E; } /* old #721C2F */
h4	{ font-size: 1.33em; color: #000000; }

a:link, a:visited {
	color: #AA3353;
	text-decoration: underline;
}

a:hover, a:active { color:#FF0000; }

p.button {
	margin: 32px 0;
}

p.button a {
	margin: 1em 0;
	padding: 7px 12px 7px 32px;
	color: #ffffff;
	font: 15px Georgia,"Times New Roman",Times,serif;
	font-weight: bold;
	line-height: 1.2em;
	background: #A33653 url("../images/apt-icon.png") 0% 50% no-repeat;
	border-color: #CF406B #CF406B #66192B;
	border-style: solid;
	border-width: 1px 1px 1px 0;
	text-decoration: none;
}

p.button a:hover {
	background-color: #66192B;
	text-decoration: underline;
}

p.button a:active {
	color: #ffa500;
}

blockquote.testimonial {
	display: block;
	padding: 0 30px;
	margin-bottom: 1em;
}

blockquote.testimonial p {
	padding: 0 auto;
	margin-top: -1.5em;
	margin-bottom: 1.5em;
}

blockquote.testimonial:before, blockquote.testimonial:after {
	color: #CF406B;
	display: block;
	font-size: 700%;
	width: 50px;
}

blockquote.testimonial:before {
	font-family: Georgia, "Times New Roman", Times, serif;
	content: open-quote;
	height: 0;
	margin-left: -0.55em;
	margin-top: .55em;
}

hr {
	height: 2px;
	width: 100%;
	background-color: #BF5579;
	border-width: 0 0 1px 0;
	border-style: solid;
	border-color: #EDD6DE;
	margin: 2em auto 2em;
	text-align: center;
}

img.left, img.img-left { 
	float:left; 
	margin:2px 10px 10px 0; 
}
	
img.right, img.img-right { 
	float: right; 
	margin: 2px 0 10px 10px; 
}

abbr, acronym, .help {
	border-bottom: 1px dotted #333;
	cursor: help;
}

img.border {
	border: 3px solid #711C33;
}

img.noborder {
	border: none;
}



/* framework
 * ------------------------------------------------------------------------- */

#phonelist {
	background-color: #D7C0C6;
	width: 769px;
	height: 18px;
	margin: 0 auto;
	text-align: right;
	font-size: 0.69em;
	font-weight: bold;
}

#phonelist ul {
	margin: 0;
	padding: 0;
}

#phonelist li {
	display: inline;
	list-style-type: none;
	margin: 0;
	padding: 0 6px;
}

#wrap { 
	background: url("../images/bg-wrap-inside.jpg") repeat-y; 
	width: 769px;
	margin: 0 auto; 
	text-align: center;
}
	
#masthead {
	display: block;
	background: url("../images/masthead.jpg") left top no-repeat;
	width: 769px;
	height: 247px;
}

	/* home link within header */		
	#masthead a {
		position: relative;
		display: block;
		left:0px;
		width:211px;
		top:13px;
		height:137px;
	}

#container {
	width: 767px;
	padding: 0 1px;
	border-bottom: 1px solid #A4A4A4;
	text-align: left;
}

#column-left {
	width:187px;
	float: left;
	padding-right: 1px;
	margin-bottom: 266px;
}

	#service-boxes {
		position: relative;
		list-style: none;
		margin: 0;
		padding: 0;
	}
	
		#service-boxes a {
			display: block;
		}
		
		#service-boxes a.childarea  {
			background: url("../images/sidebar-childarea.jpg") top no-repeat;
			width: 187px;
			height: 220px;
		}
		
		#service-boxes a.office-tour {
			background: url("../images/sidebar-tour-bergen.png") no-repeat;
			width: 187px;
			height: 143px;
		}
		
		#services-boxes a.logo-aacd {
			width: 189px;
			height: px;
			background: url("../images/.png") no-repeat;
		}

ul#nav {
	font-size: .75em;
}

#column-main {
	position: relative;
	width: 579px;
	float: left;
}

	#subhead {
		height: 60px; /* sets height for all subheads */
		margin-bottom: -20px;
	}

	#content {
		font-size: 0.75em;
		padding: 20px 20px 0;
	}
	
#column-main #associatons  {
	position:relative;
	background:url("../images/logos-welcome-sub.jpg") left top no-repeat;
	width:391px;
	height:83px;
}

	/* home link within header */		
	#associatons  a.ald {
		position:absolute;
		left:37px;
		width:162px;
		top:7px;
		height:65px;
	}
	
	#associatons  a.aacd {
		position:absolute;
		left:251px;
		width:104px;
		top:4px;
		height:75px;
	}
		
#column-right { 
	width:189px; 
	float:right;
}

#footer {
	display: block;
	background: url("../images/bg-footer-locations.jpg") no-repeat;
	padding-top: 75px;
	width: 769px;
	margin: 0 auto;
	text-align: center;
	font-size: 0.75em;
}

#footer a img {
	border: 0;
}

#footer div.locations {
	text-align: center;
	margin: 0;
	padding: 0;
}

	#footer div.locations {
		float: left;
		display: inline;
	}
	
	#footer div.locations div {
		width: 256px;
		float: left;
	}
	
	#footer div.locations div h3 {
		margin: 0 0 1em;
	}
	
	#footer div.locations div.river-edge h3 {
		background: transparent url("../images/river-edge-h3.gif") center no-repeat;
		height: 15px;
	}
	
	#footer div.locations div.nutley h3 {
		background: transparent url("../images/nutley-h3.gif") center no-repeat;
		height: 15px;
	}
	
	#footer div.locations div.wanaque h3 {
		background: transparent url("../images/wanaque-h3.gif") center no-repeat;
		height: 19px;
	}

#footer ul.nav {
	list-style: none;
	margin: 1em 0 -.75em 0;
	padding: 0;
	text-align: center;
}

	#footer ul.nav li {
		padding: 0 5px 2px 8px;
		margin: 0;
		display: inline;
		border-left: 1px solid #A4A4A4;
	}
	
	#footer ul.nav li.first {
		border: none;
		margin: 0;
		padding: 0 5px 2px 0;
	}
	
	#footer ul.nav li a {
		line-height: 2em;
	}
	
#footer p {
	margin-top: .75em;
	font-size: 0.83em;
}

/* page specific
 * ------------------------------------------------------------------------- */

#container.about,
#container.invisalign,
#container.hygiene {
	background: transparent url("../images/bg-01.jpg") left bottom no-repeat;
}

#container.procedures,
#container.periodontics,
#container.eforms {
	background: transparent url("../images/bg-02.jpg") bottom left no-repeat;
}

#container.cosmetic,
#container.implants {
	background: transparent url("../images/bg-03.jpg") bottom left no-repeat;
}

#container.techno,
#container.sleep {
	background: transparent url("../images/bg-04.jpg") bottom left no-repeat;
}

#container.locations,
#container.childres-dent{
	background: transparent url("../images/bg-05.jpg") bottom left no-repeat;
}

/* Subheadings */

	#container.about #subhead {
		background: transparent url("../images/subheads/subhead-about.jpg") no-repeat; 
	}
	
	#container.welcome #subhead {
		background: transparent url("../images/subheads/subhead-welcome.jpg") no-repeat; 
	}
		
	#container.hygienists #subhead {
		background: transparent url("../images/subheads/subhead-hygienists.jpg") no-repeat; 
	}
	
	#container.procedures #subhead {
		background: transparent url("../images/subheads/subhead-procedures.jpg") no-repeat; 
	}
	
	#container.cosmetic #subhead {
		background: transparent url("../images/subheads/subhead-cosmetic.jpg") no-repeat; 
	}
	
	#container.techno #subhead {
		background: transparent url("../images/subheads/subhead-technology.jpg") no-repeat;
	}
	
	#container.locations #subhead {
		background: transparent url("../images/subheads/subhead-locations.jpg") no-repeat; 
	}
	
	#container.thankyou #subhead {
		background: transparent url("../images/subheads/subhead-thankyou.jpg") no-repeat; 
	}
		
	#container.results #subhead {
		background: transparent url("../images/subheads/subhead-results.jpg") no-repeat; 
	}
	
	#container.childres-dent #subhead {
		background: transparent url("../images/subheads/subhead-childrens-dentistry.jpg") no-repeat; 
	}
	
	#container.invisalign #subhead {
		background: transparent url("../images/subheads/subhead-invisalign.jpg") no-repeat; 
	}
	
	#container.periodontics #subhead {
		background: transparent url("../images/subheads/subhead-periodontics.jpg") no-repeat; 
	}
	
	#container.implants #subhead {
		background: transparent url("../images/subheads/subhead-implants.jpg") no-repeat;
	}
	
	#container.orthodontics #subhead {
		background: transparent url("../images/subheads/subhead-orthodontics.jpg") no-repeat;
	}
	
	#container.sleep #subhead {
		background: transparent url("../images/subheads/subhead-sleep.jpg") no-repeat;
	}
	
	#container.hygiene #subhead {
		background: transparent url("../images/subheads/subhead-hygiene.jpg") no-repeat; 
	}
	
	#container.eforms #subhead {
		background: transparent url("../images/subheads/subhead-eforms.jpg") no-repeat;
	}


/* inside framework
 * ------------------------------------------------------------------------- */
	
.teethwhitening-sd-nav{ 
	margin-top: 16px;
}

#offic-photos {
	width:580px;
}
	#office-photos-one {
		width:194px;
		float:left;
		padding:0 0 0 24px;
	}
		#office-photos-one h3 {
			margin:10px 0 0 0;
		}
		 #office-photos-one p {
			margin:0 0 10px 0;
		}
	#office-photos-two {
		width:180px;
		float:left;
	}
		#office-photos-two h3 {
			margin:10px 0 0 0;
		}
		 #office-photos-two p {
			margin:0 0 10px 0;
		}
	#office-photos-three {
		width:180px;
		float:left;
	}
		#office-photos-three h3 {
			margin:10px 0 0 0;
		}
		 #office-photos-three p {
			margin:0 0 10px 0;
		}

/* -- images -- */
	
#img-welcome {
	width:196px;
	height:248px;
	float:right;
	background:url("../images/bg-welcome.jpg") right top no-repeat;
}

#welcome-sub {
	width: 197px;
	height: 199px;
	float: left;
	background:url("../images/img-welcome-sub.jpg"); 
}

/* Vertical Sprite Nav - Buttons
 * ------------------------------------------------------------------------- */

#buttons {
	position: relative;
	background: url("../images/buttons.jpg") top left no-repeat;					
	width: 189px;		/* Width of buttons, not entite image (or half of entire image) */
	height: 465px;		/* Height of entire image */
	margin-bottom:0;
	}

#buttons li span { display: none; }

#buttons li {
	float: left;
	list-style: none;
	}

#buttons li, #buttons a { 
	height: 156px;			/* Each button must have the same height, define it here */
	display: block;
	}

/* margin-top to set where the nav should begin */
#buttons-01 { margin-top:0px; width:189px; }

/* margin-top if there is a spacing between each nav button */
#buttons-02, #buttons-03 { margin-top:0; width:189px; }

#buttons-01 a:hover { background: transparent url("../images/buttons.jpg") -189px  -0px no-repeat; }
#buttons-02 a:hover { background: transparent url("../images/buttons.jpg") -189px  -156px no-repeat; }
#buttons-03 a:hover { background: transparent url("../images/buttons.jpg") -189px  -312px no-repeat; }


/* ----- global form elements ----- */ 

form { padding: 0; margin: 0; }

form label	{
	font-size: 1em;
}

form fieldset {
	border: none;
	margin: 0;
	padding: 0;
}

input, textarea, select { 
	background-color: #fff; 
	border: 1px solid #000;
	color: #AA3353;
	width:  145px; /* 5 pixles smaller than form width !important */
	font-family: Verdana, Arial, Helvetica, sans-serif; 
	font-size: 1.2em;
}
	
select { 
	width:150px; /* same width as form !important */
}

textarea { 
	height:70px; 
	overflow:auto; 
}


/* ----- main contact form ----- */ 
	
#contact-main label { 
	width:220px; 
	position:relative; 
	display:block; 
	text-align:right; 
	font-size: 1em;
	line-height: 1.2em;
}
	
#contact-main label input, #contact-main label textarea, #contact-main label select { 
	width:200px;
	position: relative; 
	left:110%; 
	top: -1.2em;
}
	
#contact-main label select {
	width:205px;
}
	
#contact-main label textarea { height:100px; }

input.submit, input.submit-contact-main { 
	cursor:pointer; 
	padding:0;
	color: #ffffff;
	background-color: #66192B;
}

input.submit-contact-main {
	margin:0 0 0 260px;
}


/* patient results button
 * ------------------------------------------------------------------------- */
#patient-results-button {
	margin-top:50px;
	}
#patient-results-button a {
	display:block;
	width:189px;
	height:68px;
	margin:0px;
	padding:0px;
	line-height:32px;
	text-align:center;
	background:url("../images/patient-results-button.jpg") 0px 0px no-repeat;
	}
	#patient-results-button a:hover, #patient-results-button a:active {
		background-position:0px -68px;
		}.asd {
	color: #AA3353;
}
.Blackinsidetext {
	color: #000;
}

#flash2 {
	width:100%;
	height:300px;
	background-color:#fff;
	border: 1px solid #AF3A59;
	text-align:center;
	cursor:pointer;
	background: transparent url("../images/bg-invisalign-video.jpg") no-repeat;
}

#flash2 h2 {
	font-size:26px;
	color:#AF3A59;
	margin-top:114px;
}
