/*
 * #01 - Columns
 * #02 - Sections
 * #03 - Lists
 * #04 - Forms
 * #05 - Tables
 * #06 - Other
 */

/* #01 - COLUMNS **************************************************************/

.section { clear: both; overflow: hidden; }

/* 2 COLUMNS */
/* 330 25 330 + sidebar*/

.col-af {
	float: left;
	width: 330px;
	margin-right: 25px;
}
.col-gl {
	float: left;
	width: 330px;
	margin-right: 0px;
}

/* 2 COLUMNS WITHOUT SIDEBAR */
/* 441 48 441 */

.full-2col-af, .full-2col-gl {
	float: left;
	width: 441px;
}
.full-2col-af { margin-right: 48px; }

body#index .full-2col-af { width: 441px; margin: 0 0 0 20px; }
body#index .full-2col-gl { float: right; width: 357px; }

/* 3 COLUMNS */
/* 215 20 215 20 215 + sidebar */

.col-ad, .col-eh, .col-il {
	float: left;
	width: 215px;
	margin-right: 20px;
}
.col-ah { float: left; width: 450px; margin-right: 20px; }
.col-il { margin-right: 0px; }

/* 3 COLUMNS - PHOTO GALLERIES */
/* 450 30 95 15 95 + sidebar */
body.gallery .col-a {
	float: left;
	width: 450px;
}
body.gallery .col-bc {
	float: right;
	width: 205px;
	position: relative; /* these two lines required for IE7 to properly hide ALL overflow */
	overflow: hidden;
}
body.gallery .col-b,
body.gallery .col-c {
	float: left;
	width: 95px;
	margin-right: 15px;
}
body.gallery .nextprev .col-c { margin-right: 0; }

/* 4 COLUMNS */
/* 163 11 163 11 163 11 163 + sidebar*/

.col-ac, .col-df, .col-gi, .col-jl {
	float: left;
	width: 163px;
	margin-right: 11px;
}
.col-jl { margin-right: 0px; }
.col-ai { float: left; width: 511px; margin-right: 11px; }
.col-dl { float: left; width: 511px; margin-right: 0; }

/* 4 COLUMNS WITHOUT SIDEBAR */
/* 196 49 196 49 196 48 196*/

.full-4col-a, .full-4col-b, .full-4col-c, .full-4col-d {
	float: left;
	width: 196px;
	margin-right: 49px;
}
.full-4col-c { margin-right: 48px; }
.full-4col-d { margin-right: 0; }
.full-4col-ad { width: 930px; }

.full-4col-ab { float: left; width: 441px; margin-right: 49px; }
.full-4col-cd { float: left; width: 440px; margin-right: 0; }

/* 5 COLUMNS WITHOUT SIDEBAR */
/* 166 25 166 25 166 25 166 25 166 */

.full-5col-a, .full-5col-b, .full-5col-c, .full-5col-d, .full-5col-e {
	float: left;
	width: 166px;
	margin-right: 25px;
}
.full-5col-e { margin-right: 0; }
.full-5col-ae { width: 930px; }

/* 5 COLUMNS - FOOTER */

#footer .col-a {
	float: left;
	margin-left: 12px;
	width: 232px;
}
#footer .col-b {
	float: left;
	width: 230px;
}
#footer .col-cd {
	float: left;
	width: 230px;
}
#footer .col-e {
	float: right;
	width: 276px;
	margin-right: 10px;
	text-align: right;
}


/* #02 - SECTIONS *************************************************************/

/* GENERAL */

#content { width: 685px; float: left; overflow: hidden; }
#content-wide { width: 930px; float: left; }
#sidebar {
	width: 215px;
	float: right;
	margin-right: 30px;
}

p { margin-bottom: 12px; }
p.quote { margin: 0 40px 12px; padding-top: 12px; }
body#index p.quote { margin: 0 0 24px 0; }

.boxed, .round-boxed, .narrow-round-boxed {
	background: #888f93;
	overflow: hidden; /* contain floats or otherwise */
	padding: 18px 18px 0 24px;
}
.round-boxed { padding-bottom: 12px; background: #888f93 url('../images/bg_boxed.gif') 0 100% no-repeat; }
.narrow-round-boxed { padding-bottom: 12px; background: #888f93 url('../images/bg_narrow-boxed.gif') 0 100% no-repeat; }

/* SIDE BAR */

.call-out {
	width: 197px;
	background: #fff url('../images/bg_call-out.jpg') 0 100% no-repeat;
	padding: 6px 9px 24px;
	margin-bottom: 18px;
}
a.btn-book {
	display: block;
	width: 215px;
	height: 76px;
	text-indent: -9999px;
	overflow: hidden;
	background: transparent url('../images/btn-book.gif') 0 0 no-repeat;
	margin-bottom: 18px;
}
a.btn-book:hover { background-position: 0 -76px; }

div.video-link img { margin: 0 auto; }

/* SIDE BAR - SOCIAL */

#social { overflow: hidden; margin-bottom: 18px; } /* contain floats */
body#ecofriendly #social { margin-bottom: 8px; }
body#experience #social, body#inlays #social { margin-bottom: 54px; }
body#testimonials #social,
body#dentistry #social,
body#about #social,
body#team-landing #social,
body#galleries #social { float: right; width: 215px; }
body#index #social { float: none; }
#social #fblike { width: 89px; overflow: hidden; float: left; margin-right: 6px; } /* hide Facebook like count */
#social #tweet { float: left; margin-right: 4px; }
#social #linkin { float: left; }
span.IN-widget { height: 32px; } /* fixed vertical alignment */

/* FOOTER */

#footer .col-d a { 	margin-right: 5px; }

a#payment-options {
	display: block;
	width: 79px;
	height: 55px;
	text-indent: -9999px;
	overflow: hidden;
	background: transparent url('../images/payment-options.jpg') 0 0 no-repeat;
}
a#payment-options:hover { background-position: 0 -55px; }

#social-icons { margin-bottom: 4px; }
#social-icons a { margin-right: 9px; }
#social-icons a#social-twitter { margin-right: 7px; }


/* HOME PAGE */

body#index img#before { float: left; margin-left: 29px; }
body#index img#after { float: left; }
body#index #quote {
	float: left;
	width: 203px;
	text-align: center;
	margin-top: 188px;
}

a#home-work, a#home-service, a#home-location, a#home-team, a#home-galleries {
	display: block;
	width: 166px;
	height: 57px;
	text-indent: -9999px;
	overflow: hidden;
	background: transparent url('../images/btn-home.gif') 0 0 no-repeat;
}
a#home-work:hover { background-position: 0 -57px; }
a#home-service { background-position: -166px 0; }
a#home-service:hover { background-position: -166px -57px; }
a#home-location { background-position: -332px 0; }
a#home-location:hover { background-position: -332px -57px; }
a#home-team { background-position: -498px 0; }
a#home-team:hover { background-position: -498px -57px; }
a#home-galleries { background-position: -664px 0; }
a#home-galleries:hover { background-position: -664px -57px; }

/* GALLERIES LANDING PAGE */

body#galleries a#galleries-smile,
body#galleries a#galleries-tour,
body#galleries a#galleries-vid,
body#galleries a#galleries-personal {
	display: block;
	width: 196px;
	height: 356px;
	overflow: hidden;
	text-indent: -9999px;
	float: left;
	margin-right: 48px;
	background: transparent url('../images/btn-galleries.jpg') 0 0 no-repeat;
}
body#galleries a#galleries-smile { background-position: 0 0; }
body#galleries a#galleries-smile:hover { background-position: 0 -356px; }
body#galleries a#galleries-tour { background-position: -196px 0; }
body#galleries a#galleries-tour:hover { background-position: -196px -356px; }
body#galleries a#galleries-vid { background-position: -392px 0; margin-right: 50px;}
body#galleries a#galleries-vid:hover { background-position: -392px -356px; }
body#galleries a#galleries-personal { background-position: -588px 0; margin-right: 0; }
body#galleries a#galleries-personal:hover { background-position: -588px -356px; }

/* SMILE GALLERY */

#sg-gallery { width: 17750px; overflow: hidden; } /* width = (685px wide + 25px margin between) * 2 pictures */ /* Update when adding new photos to gallery */
.sg-pics { float: left; position: relative; }
.sg-pics .col-gl { margin-right: 25px; }

body#smile-gallery .col-af span { margin-left: 12px; }
body#smile-gallery .col-gl span { margin-right: 12px; }
body#smile-gallery .col-af p span,
body#smile-gallery .col-gl p span { color: #ffa700; cursor: pointer; }

/* PHOTO TOUR / DR. WASIK'S PHOTOGRAPHY */

body.gallery .col-b p span,
body.gallery .col-c p span { color: #ffa700; cursor: pointer; }

body#photo-tour .thumb-sets { width: 440px; overflow: hidden; } /* width = (205px wide + 15px margin between) * 2 sets of thumbs */ /* Update when adding new photos to gallery */
body#photography .thumb-sets { width: 1320px; overflow: hidden; }
.thumb-set { float: left; position: relative; }

span.thumb {
	display: block;
	width: 95px;
	height: 88px;
	text-indent: -9999px;
	overflow: hidden;
}
body#photography #thumb-set1 span { background: transparent url('../images/photography/thumbs-01.jpg') 0 0 no-repeat; }
body#photography #thumb-set2 span { background: transparent url('../images/photography/thumbs-02.jpg') 0 0 no-repeat; }
body#photography #thumb-set3 span { background: transparent url('../images/photography/thumbs-03.jpg') 0 0 no-repeat; }
body#photography #thumb-set4 span { background: transparent url('../images/photography/thumbs-04.jpg') 0 0 no-repeat; }
body#photography #thumb-set5 span { background: transparent url('../images/photography/thumbs-05.jpg') 0 0 no-repeat; }
body#photography #thumb-set6 span { background: transparent url('../images/photography/thumbs-06.jpg') 0 0 no-repeat; }
body#photo-tour #thumb-set1 span { background: transparent url('../images/photo-tour/thumbs-01.jpg') 0 0 no-repeat; }
body#photo-tour #thumb-set2 span { background: transparent url('../images/photo-tour/thumbs-02.jpg') 0 0 no-repeat; }

body#photo-tour #wrapper .thumb-left2,
body#photography #wrapper .thumb-left2 { background-position: 0 -88px; } /* odd selector, the specificity is important */
body#photo-tour #wrapper .thumb-left3,
body#photography #wrapper .thumb-left3 { background-position: 0 -176px; }
body#photo-tour #wrapper .thumb-left4,
body#photography #wrapper .thumb-left4 { background-position: 0 -264px; }
body#photo-tour #wrapper .thumb-right1,
body#photography #wrapper .thumb-right1 { background-position: -110px 0; }
body#photo-tour #wrapper .thumb-right2,
body#photography #wrapper .thumb-right2 { background-position: -110px -88px; }
body#photo-tour #wrapper .thumb-right3,
body#photography #wrapper .thumb-right3 { background-position: -110px -176px; }
body#photo-tour #wrapper .thumb-right4,
body#photography #wrapper .thumb-right4 { background-position: -110px -264px; }

/* TESTIMONIALS */

.testimonial-name { float: right; margin-right: 60px; }
.testimonial { margin-bottom: 24px; }

/* ASSORTED */

#h1-leaf { float: left; margin-right: 6px; }
a#btn-forms {
	display: block;
	width: 315px;
	height: 76px;
	text-indent: -9999px;
	overflow: hidden;
	margin: 0 auto 18px;
	background: transparent url('../images/btn-forms.gif') 0 0 no-repeat
}
a#btn-forms:hover { background-position: 0 -76px; }

/* #03 - LISTS ****************************************************************/

#content ul.link-list, #content-wide ul.link-list,
#sidebar ul.link-list { list-style: none; padding: 12px 0 0 0; }
#content ul.link-list li, #content-wide ul.link-list li,
#sidebar ul.link-list li { margin-bottom: 12px; line-height: 0.95em;}

#content ul, #content-wide ul { padding-left: 30px; margin-bottom: 24px; }
#content ul li, #content-wide ul li { margin-bottom: 8px; line-height: 0.95em; }
#content ul ul, #content-wide ul ul { margin: 8px 0; }

/* #04 - FORMS ****************************************************************/

/* GENERAL */

body#location form p { margin-bottom: 0; }
body#book-appt form p { float: left; margin-right: 24px; }
body#book-appt form p.last { margin-right: 0; }

fieldset {
	border: 2px solid #63696e;
	padding: 8px;
	margin-bottom: 24px;
}
body#location fieldset { margin-top: 8px; }

/* FORM ELEMENTS */

label { display: block; margin-bottom: 4px; }

input.input-text {
	border: none;
	background: url('../images/bg_input.gif') 0 0 repeat-x;
	height: 28px;
	padding: 0 8px 4px;
	font: 15px arial, helvetica, verdana, sans-serif;
	float: left;
}
.input-text { width: 290px; }
body#book-appt .input-text { width: 302px; }

select.input-select {
	width: 318px;
	height: 25px;
	padding-top: 1px;
	font: 15px arial, helvetica, verdana, sans-serif;
}

textarea {
	width: 310px;
	padding: 8px 8px 4px;
	font: 15px arial, helvetica, verdana, sans-serif;
}

#recaptcha_widget_div { float: right; margin-right: 15px; }

body#location input#submit { float: left; margin-left: 12px; width: 107px; }
body#book-appt input#submit { float: left; margin-top: 36px; margin-left: 220px; }

/* ERRORS / VALIDATION */
.errorbox {
	border: 2px solid #b84649;
    background: #887579;
	padding: 12px;
	margin-bottom: 12px;
	overflow: hidden; /* contain floats */
}
.errorbox .icon {
	float: left;
	width: 64px;
}
.errorbox .message {
	float: left;
	margin-left: 24px;
	margin-top: 12px;
	width: 560px;
}
body#book-appt .invalid-field { background: url('../images/bg_input-invalid.gif') 0 0 repeat-x; }
body#book-appt .invalid-select { color: red; }
body#book-appt .invalid-label { color: #ffa700; }

/* OUR LOCATION */
#directions-form { width: 450px; } /* required to stop jquery from jumping */

/* #05 - TABLES ***************************************************************/

table { border: none; }
#contact-hours { width: 215px; }
#contact-hours td { width: 107px; } 

/* #06 - OTHER ****************************************************************/

.align-l { text-align: left; }
.align-c { text-align: center; }
.align-r { text-align: right; }

.float-l-img { float: left; margin-right: 24px; }
.float-r { float: right; margin-left: 36px; }

.clear-left { clear: left; }
.clear-both { clear: both; }
.relative { position: relative; } /* needed for hiding overflow in jquery slide */

.top-sm { margin-top: 6px; }
.top-med { margin-top: 12px; }
.top-lg { margin-top: 18px; }
.top-xl { margin-top: 24px; }
.top-xxl { margin-top: 48px; }
.top-xxxl { margin-top: 56px; }
.top-xxxxl { margin-top: 64px; }
.top-xxxxxl { margin-top: 96px; }

.end-zero { margin-bottom: 0; }
.end-sm { margin-bottom: 6px; }
.end-med { margin-bottom: 12px; }
.end-lg { margin-bottom: 18px; }
.end-xl { margin-bottom: 24px; }
.end-xxl { margin-bottom: 48px; }
.end-xxxl { margin-bottom: 56px; }