@charset "UTF-8";
/* 
Title:     One Creative Branding - brandSubpage.css
Author:    Darrin Waterbury, darrin@darrinscottstudios.com
*/

/* Common Styles
========================================================================================== */
h1 {
	margin: 0;
	padding: 0;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 120%;
	color: #000;
}
h2 {
	margin: 0;
	padding: 0;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 100%;
}
p {
	margin: 0;
	padding: .5em 0;
	font-size: 85%;
	line-height: 1.3em;
}
form {
	margin: 0;
	padding: 0;
}
#ocg-services h1 {
	color: #73a49e;
}
#ocg-casestudies h1 {
	color: #d73a32;
}
#ocg-philosophy h1 {
	color: #7a4fb6;
}
#ocg-clients h1 {
	color: #aac168;
}
#ocg-aboutus h1 {
	color: #cc6600;
}
#ocg-extranet h1 {
	color: #7f9ef5;
}
#ocg-contactus h1 {
	color: #e95679;
}

/* Page Layout
========================================================================================== */
#contentContainer {
	float: left;
	width: 100%;
}
#logo {
	float: left;
	width: 240px;
}
#logo img {
	padding: 15px 20px;
}
#primaryContent {
	float: left;
	width: 425px;
}
#primaryContent .gutter {
	padding: 35px 20px 0 20px;
}
#sidebar {
	float: right;
	position: relative;
	margin: 0;
	padding: 50px 10px;
	width: 210px;
	text-align: center;
}

/* Casestudies
============================================================================================== */
#ocg-casestudies .SlidingPanels, #ocg-philosophy .SlidingPanels {
	position: relative;
	width: 100%;
	height: 320px;
	padding: 0px;
	border: none;
	/*float: left;*/
}
#ocg-casestudies .SlidingPanelsContentGroup, #ocg-philosophy .SlidingPanelsContentGroup {
	position: relative;
	margin: 0px;
	padding: 0px;
	min-height:0;
	border: none;
	width: 385px;
	/*float: left;*/
}
#ocg-casestudies .SlidingPanelsContent, #ocg-philosophy .SlidingPanelsContent {
	width: 100%;
	height: 320px;
	overflow: hidden;
	margin: 0px;
	padding: 0px;
	border: none;
	/*float: left;*/
}

#ocg-casestudies .SlidingPanelsAnimating *, #ocg-casestudies .SlidingPanelsAnimating *{
	overflow: hidden !important;
}

/* The class used in this selector is programatically added to the SlindingPanelsContent
 * container that is currently visible in the view port. The class is automatically removed
 * when the widget switches to a different panel.
 */
#ocg-casestudies .SlidingPanelsCurrentPanel {
}

/* The class used in this selector is programatically added to the SlidingPanels container
 * anytime the SlidingPanels container is given focus. The class is automatically removed
 * once the SlidingPanels container loses focus.
 */
#ocg-casestudies .SlidingPanelsFocused {
}
#ocg-casestudies #primaryContent {
	margin-right: 10px;
	width: 410px;
}
#ocg-casestudies .companyLogo {
	padding: 0 0 20px 0;
}

/* Clients
============================================================================================== */
#ocg-clients #primaryContent {
	float: left;
	width: 600px;
}
#ocg-clients #primaryContent .gutter {
	padding: 40px 0;
}

/* About Us
============================================================================================== */
#teamgrid {
	position: absolute;
	top: 0px;
	left: 0px;
	width: 901px;
	height: 400px;
	background: url(../images/team_member_grid.png) no-repeat top left !important;
	background: url(../images/team_member_grid.gif) no-repeat top left;
}
#teamgrid p {
	margin: 0;
	padding: 0;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10px;
	text-transform: uppercase;
}
#teamgrid a {
	color: #000;
	text-decoration: none;
}
#teamgrid a:hover {
	color: #000;
}
#teamgrid span {
	color: #666;
}
#t-keyMembers {
	position: absolute;
	top: 206px;
	left: 319px;
	width: 70px;
	text-align: center;
}
#JCP a {
	position: absolute;
	left: 305px;
	top: 47px;
	margin: 0;
	padding: 14px 0 14px 43px;
	background: url(../images/dashed_circle.gif) no-repeat center left;
}
#RD a {
	position: absolute;
	left: 441px;
	top: 94px;
	margin: 0;
	padding: 14px 0 14px 43px;
	background: url(../images/dashed_circle.gif) no-repeat center left;
}
#LH a {
	position: absolute;
	left: 589px;
	top: 140px;
	margin: 0;
	padding: 14px 0 14px 43px;
	background: url(../images/dashed_circle.gif) no-repeat center left;
}
#AN a {
	position: absolute;
	left: 557px;
	top: 217px;
	margin: 0;
	padding: 14px 0 14px 43px;
	background: url(../images/dashed_circle.gif) no-repeat center left;
}
#SS a {
	position: absolute;
	left: 614px;
	top: 316px;
	margin: 0;
	padding: 14px 0 14px 43px;
	background: url(../images/dashed_circle.gif) no-repeat center left;
}
#MM a {
	position: absolute;
	left: 388px;
	top: 302px;
	margin: 0;
	padding: 14px 0 14px 43px;
	background: url(../images/dashed_circle.gif) no-repeat center left;
}
#NP a {
	position: absolute;
	left: 198px;
	top: 297px;
	margin: 0;
	padding: 14px 0 14px 43px;
	background: url(../images/dashed_circle.gif) no-repeat center left;
}
#JCP a:hover, #RD a:hover, #LH a:hover, #AN a:hover, #SS a:hover, #MM a:hover, #NP a:hover{
	background: url(../images/dashed_circle_hover.gif) no-repeat center left;
}

/* Contact Us
============================================================================================== */
#ocg-workwithus #primaryContent {
	float: left;
	margin: 0;
	padding: 0;
	width: 640px;
}

/* Sliding Panels Styles
============================================================================================== */
.SlidingPanels {
	position: relative;
	width: 605px;
	height: 285px;
	padding: 0px;
	border: none;
	float: left;
}
.SlidingPanelsContentGroup {
	position: relative;
	margin: 0px;
	padding: 0px;
	min-height:0;
	border: none;
	width: 1000em;
	float: left;
}
.SlidingPanelsContent {
	width: 605px;
	height: 285px;
	overflow: hidden;
	margin: 0px;
	padding: 0px;
	border: none;
	float: left;
}

.SlidingPanelsAnimating * {
	overflow: hidden !important;
}

/* The class used in this selector is programatically added to the SlindingPanelsContent
 * container that is currently visible in the view port. The class is automatically removed
 * when the widget switches to a different panel.
 */
.SlidingPanelsCurrentPanel {
}

/* The class used in this selector is programatically added to the SlidingPanels container
 * anytime the SlidingPanels container is given focus. The class is automatically removed
 * once the SlidingPanels container loses focus.
 */
.SlidingPanelsFocused {
}

/* Advertising
==================================================================================================*/
.logoTable {
	border-top: 1px dotted #666;
	/*border-right: 1px dotted #666;*/
}
.logoTable td {
	text-align: center;
	width: 150px;
	height: 60px;
	border-bottom: 1px dotted #666;
	/*border-left: 1px dotted #666;*/
}

/* Page Specific Styles
========================================================================================== */
/*#aboutus #primaryContent {
	float: left;
	width: 650px;
}*/

/* About Us - Employees Grid
========================================================================================== */
#p7GP_1 {
	position: relative;
}
#p7GPt_1 {
	position: absolute;
	top: 20px;
	left: 0;
	width: 292px;
	height: 230px;
	background: url(../images/employee_grid.gif) no-repeat top left;
}
p7GPt_1 p {
	margin: 0;
	padding: 0;
	font-family: Arial, Helvetica, sans-serif;
	/*font-size: 85%;*/
	text-transform: uppercase;
}
#p7GPt_1 a {
	color: #666;
	text-decoration: none;
}
#p7GPt_1 a:hover {
	color: #000;
}
.p7GP01 #p7GPt_1 p a.down, #p7GPt_1 .p7GPtwrapper p a.down:hover {
	color: #000 !important;
	background: url(../images/dashed_circle_on.gif) no-repeat center left;
}
#employee1 a {
	position: absolute;
	left: 0px;
	top: -7px;
	padding: 15px 0 18px 43px;
	background: url(../images/dashed_circle_off.gif) no-repeat center left;
}
#employee2 a {
	position: absolute;
	left: 255px;
	top: 5px;
	padding: 18px 0 18px 43px;
	width: 60px;
	background:  url(../images/dashed_circle_off.gif) no-repeat center left;
}
#employee3 a {
	position: absolute;
	left: 78px;
	top: 187px;
	padding: 18px 43px 18px 0;
	background:  url(../images/dashed_circle_off.gif) no-repeat center right;
}
#employee4 a {
	position: absolute;
	left: -14px;
	top: 90px;
	text-align: right;
	padding: 18px 43px 18px 0;
	background:  url(../images/dashed_circle_off.gif) no-repeat center right;
}
#employee1 a:hover, #employee2 a:hover {
	background: url(../images/dashed_circle_on.gif) no-repeat center left;
}
#employee3 a:hover, #employee4 a:hover {
	background: url(../images/dashed_circle_on.gif) no-repeat center right;
}
.p7GP01 #p7GPt_1 #employee3 a.down, #p7GPt_1 .p7GPtwrapper #employee3 a.down:hover {
	color: #000 !important;
	background: url(../images/dashed_circle_on.gif) no-repeat center right;
}
.p7GP01 #p7GPt_1 #employee4 a.down, #p7GPt_1 .p7GPtwrapper #employee4 a.down:hover {
	color: #000 !important;
	background: url(../images/dashed_circle_on.gif) no-repeat center right;
}
.p7GPcwrapper {
	position: absolute;
	top: 100px;
	left: 275px;
	width: 325px;
}

/* In the News
========================================================================================== */
#news {
	display: inline;
	float: left;
	margin: 28px 28px 0 28px;
	padding: 10px 10px 0 10px;
	width: 885px;
	color: #fff;
	text-align: left;
	background: #000;
}
#news img {
	float: left;
	margin-right: 10px;
}
#news h2 {
	font-size: 80%;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}
#news p {
	line-height: 1.3em;
}
#news a:hover {
	color: #666;
	text-decoration: underline;
}

/* Testimonials
========================================================================================== */
#testimonials {
	display: inline;
	float: left;
	margin: 28px 28px 0 28px;
	padding: 10px 0 0 0;
	width: 905px;
	color: #fff;
	text-align: left;
	background: #000;
}
#testimonials .gutter {
	margin: 0 auto;
	padding: 20px 0;
	width: 650px;
}
#testimonials h1 {
	font-size: 24px;
	font-weight: normal;
	color: #fff;
}
#testimonials p {
	text-align: left;
	color: #666;
}

#testimonials blockquote p {
	margin: 0 auto;
	padding: .1em 0;
	font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif;
	font-size: 20px;
	color: #fff;
	text-indent: -0.5em;
}
#testimonials .author {
	font-size: 14px;
	font-style: italic;
	color: #666;
}

#ocg-services #testimonials {
	background: #000 url(../images/servicesTab-bg.gif) repeat-x top left;
}
#ocg-casestudies #testimonials {
	background: #000 url(../images/casestudiesTab-bg.gif) repeat-x top left;
}
#ocg-philosophy #testimonials {
	background: #000 url(../images/philosophyTab-bg.gif) repeat-x top left;
}
#ocg-philosophy #testimonials {
	background: #000 url(../images/philosophyTab-bg.gif) repeat-x top left;
}
#ocg-clients #testimonials {
	background: #000 url(../images/clientsTab-bg.gif) repeat-x top left;
}
#ocg-aboutus #testimonials, #jcp-bio #testimonials, #rd-bio #testimonials, #lh-bio #testimonials, #an-bio #testimonials, #lm-bio #testimonials, #mm-bio #testimonials, #np-bio #testimonials {
	background: #000 url(../images/aboutusTab-bg.gif) repeat-x top left;
}
#ocg-extranet #testimonials {
	background: #000 url(../images/extranetTab-bg.gif) repeat-x top left;
}
#ocg-workwithus #testimonials, #ocg-joinourteam #testimonials {
	background: #000 url(../images/contactusTab-bg.gif) repeat-x top left;
}
