/*----------------------------------------------------------------------

UNIVERSAL MIND - Master Styles

DEVELOPED BY: MIGHTY // MIGHTYINTHEMIDWEST.COM
DESIGN BY: JASON SIX

Author:			Andrew Philpott
Date Created:	09/24/2009
Last Modified:	11/16/2009

Copyright 2009, All Rights Reserved.

----------------------------------------------------------------------*/
@import url('http://www.jupitermedicalaesthetics.com/assets/css/reset.css');




/* UNIVERSAL STYLES
  ==============================================*/

body {
	color: #808285;
	font-family: 'Trebuchet MS', 'Tahoma', 'Arial', sans-serif;
	font-size: 62.5%;
}
#services, #specials, #team {
	background: url(http://www.jupitermedicalaesthetics.com/assets/images/bg-blue.png) repeat-x 0 120px;
}
#products, #contact, #location, #error {
	background: url(http://www.jupitermedicalaesthetics.com/assets/images/bg-green.png) repeat-x 0 120px;
}
#header, #content {
	margin: 0 auto;
	width: 965px;
}
#wrapper {
	width: 100%;
	min-height: 100%;
	position: absolute;
}
a {
	color: #87a4b7;
}
a:hover {
	color: #808285;
}
em {
	font-style: italic;
}



/* HEADER
  ==============================================*/

#brand {
	display: block;
	margin: 21px 0 0 8px;
	width: 289px;
}
#header ul {
	float: right;
	font-size: 1.4em;
	margin: -80px 0 0 0;
	position: relative;
	left: -10px;
}
#header ul li {
	float: left;
	margin-right: 28px;
}
#header ul a {
	color: #666767;
	padding-bottom: 3px;
	text-decoration: none;
}
#header ul a:hover {
	border-bottom: 2px solid #c1c0c0;
}
#header ol {
	float: right;
	font-size: 1.1em;
	line-height: 1.4545em;
	margin: -21px 0 0 -482px;
	position: relative;
	left: -183px;
}
#header ol li {
	color: #989a96;
	text-decoration: underline;
	width: 130px;
}
#header ol a {
	color: #989a96;
}
#header ol .phone, #header ol .hours {
	margin-left: 164px;
	text-decoration: none;
}
#header ol .reset {
	margin-top: -32px;
}
#header ol .org {
	display: none;
}
#header ol strong {
	color: #6e7071;
	font-weight: bold;
}
#fam-med {
	background: url(http://www.jupitermedicalaesthetics.com/assets/images/btn-fam-med.png) no-repeat;
	color: #fff;
	display: block;
	float: right;
	font-size: 1.1em;
	font-weight: bold;
	height: 25px;
	margin-top: -16px;
	padding: 11px 0 0 28px;
	position: relative;
	top: 2px;
	text-decoration: none;
	width: 163px;
}
#fam-med:hover {
	background-position: 0 -36px;
}




/* CONTENT
  ==============================================*/


#content p, #content ol, #content ul {
	font-size: 1.4em;
	line-height: 1.4286em;
}
#content p {
	margin-bottom: 1.4286em;
}
#content li p {
	font-size: inherit;
}
#banner {
	float: left;
	height: 180px;
	margin-top: 1px;
	padding: 40px 17px 0 0;
	position: relative;
	width: 100%;
}
.banner-image {
	position: absolute;
	right: -5px;
	top: 0;
}
#banner blockquote {
	width: 280px;
}
#services blockquote, #specials blockquote, #team blockquote {
	color: #7e9eb2;
}
#products blockquote, #contact blockquote, #location blockquote, #error blockquote {
	color: #8b8666;
}
#banner blockquote p {
	font-size: 2em;
	position: relative;
	left: 12px;
}
#primary {
	clear: left;
	position: relative;
	left: 12px;
	z-index: 2;
}
.subpg #primary {
	padding-top: 37px;
	float: left;
	width: 100%;
}
.subpg h1 {
	clear: left;
	font-size: 2.2em;
	margin: 55px 0 23px;
	line-height: 0.9091em;
}
#primary ol li {
	color: #636467;
	float: left;
	font-size: 0.7857em;
}
#primary ol li a {
	border-right: 1px solid #636467;
	color: #636467;
	margin-right: 9px;
	padding-right: 9px;
}
#primary ol li a:hover {
	color: #87a4b7;
}




/* PRIMARY CONTENT
  ==============================================*/

.col-2 #primary {
	float: left;
	width: 536px!important;
	margin-bottom: 95px;
}



/* SECONDARY CONTENT
  ==============================================*/

.col-2 #secondary {
	float: left;
	margin-left: 116px;
	margin-bottom: 70px;
	padding-top: 94px;
	width: 313px;
	position: relative;
	z-index: 2;
}
.col-2 #secondary h2 {
	font-size: 0.7857em;
	margin-bottom: 5px;
}
.col-2 #secondary ol li {
	display: block;
	margin-bottom: 20px;
}
.col-2 #secondary ol li + li {
	margin-bottom: 0;
}



/* FOOTER
  ==============================================*/

#footer {
	width: 100%;
	height: 120px;
	clear: both;
	position: absolute;
	bottom: -100px;
}
#home #footer, #services #footer, #specials #footer, #team #footer {
	background: url(http://www.jupitermedicalaesthetics.com/assets/images/bg-footer-blue.gif) repeat-x 0 0;
}
#products #footer, #contact #footer, #location #footer, #error #footer {
	background: url(http://www.jupitermedicalaesthetics.com/assets/images/bg-footer-green.gif) repeat-x 0 0;
}




/* HOME
  ==============================================*/

#home {
	background: url(http://www.jupitermedicalaesthetics.com/assets/images/bg-home.png) repeat-x 0 120px;
}
#home #primary {
	float: left;
	padding-top: 66px;
	position: relative;
	left: 12px;
	width: 597px;
}
#home #primary p {
	font-size: 1.5em;
	line-height: 1.55em;
}
#home #secondary {
	float: left;
	margin-left: 55px;
	padding-top: 44px;
	width: 313px;
	position: relative;
	z-index: 2;
}
#home #secondary ul {
	font-size: 1.8em;
	line-height: 1.2222em;
}
#home #secondary li {
	margin-bottom: 18px;
}
#home #secondary li + li {
	border-top: 1px solid #e0e4e6;
	padding-top: 18px;
}
#home h1 {
	float: none;
	color: #7698ad;
	font-size: 4.8em;
	margin-bottom: 13px;
}
#subnav {
	float: left;
	margin: 53px 0 104px 8px;
	width: 100%;
}
#subnav li {
	border: 2px solid #fff;
	float: left;
	margin-bottom: 12px;
	padding: 2px;
}
#subnav li:hover, #subnav li.hover {
	border: 2px solid #a7a9ac;
}
#subnav a {
	color: #fff;
	display: block;
	font-size: 1.5714em;
	height: 32px;
	overflow: hidden;
	padding: 67px 0 0 16px;
	text-decoration: none;
	width: 284px;
	position: relative;
}
.subnav-image {
	position: absolute;
	top: 0px;
	left: 0px;
	z-index: 1;
}
#subnav span {
	position: relative;
	z-index: 2;
}
#products-btn, #specials-btn, #team-btn, #location-btn {
	margin-left: 12px;
}




/* SERVICES
  ==============================================*/

#services #primary {
	margin-bottom: 100px;
}
#services #primary ul li {
	float: left;
	line-height: 32px;
	width: 241px;
}
.col-one {
	clear: left;
}
#services #primary ul a {
	color: #808285;
	text-decoration: none;
}
#services #primary ul a:hover {
	text-decoration: underline;
}




/* PRODUCTS/TEAM LIST
  ==============================================*/

#products #primary ul,
#team #primary #members {
	float: left;
	margin: 17px 0 75px -14px;
}
#products #primary ul li,
#team #primary #members li {
	float: left;
	font-size: 0.8571em;
	height: 255px;
	overflow: hidden;
	margin: 0 12px 24px;
	width: 302px;
}
#products #primary ul li img,
#team #primary #members li img {
	border: 1px solid #fff;
}
#products #primary ul li img:hover {
	border: 1px solid #c1c0c0;
}
#products #primary p,
#team #primary p {
	line-height: 1.3333em;
}
#products #primary ul h2,
#team #primary ol h2 {
	color: #333;
}
.newrow {
	clear: both;
}


/* LOCATION
  ==============================================*/

#location #secondary ol li,
#services #secondary ol li {
	margin-bottom: 45px;
}


/* CONTACT
  ==============================================*/

#contact-form {
	width: 600px;
	margin-top: 47px;
}
#form-col-1 {
	width: 220px;
	margin-right: 80px;
	float: left;
}
#form-col-2 {
	width: 270px;
	float: left;
}
#contact-form label {
	color: #333;
	font-size: 12px;
	display: block;
}
#contact-form span {
	color: #df3800;
	font-size: 12px;
	line-height: normal;
}
#contact-form input {
	width: 215px;
}
#contact-form #contact-state {
	width: 92px;
}
#contact-form .state-zip label {
	width: 88px;
}
#contact-form .state-zip {
	float: left;
}
#contact-form #zip {
	margin-left: 29px;
}
#contact-form #contact-zip {
	width: 88px;
}
#contact-form #contact-eblast, #contact-form #contact-prefer {
	margin-left: -1px;
	width: auto;
}
#contact-form #form-col-2 .prefer-email {
	margin-left: 19px;
}
#contact-form p {
	color: #333;
	font-size: 12px;
	margin-bottom: 11px;
}
#form-col-2 p {
	margin-bottom: 31px;
}
#contact-form textarea {
	width: 230px;
	height: 40px;
}
#contact-form select {
	margin: 2px 0 0 -2px;
}
#contact-form button {
	position: relative;
	top: 3px;
}
#contact #primary ol li #thanks-contact {
	border: 0!important;
}


/* ERROR
  ==============================================*/

#error #primary ul {
	margin: 0 0 1.5em 20px;
	list-style-type: disc;
}
