﻿/* -------------------------------------------------- */
/* Bruce101 CSS                                          */
/* Designed by Bruce Etzcorn                        */
/* www.pmtadvertising.com                          */
/* info@pmtads.com                                     */
/* -------------------------------------------------- */

body {
background-color: #8FA4D3;
background-image: url("background.jpg"/*tpa=http://www.strongarmmobility.com/images/background.jpg*/);
background-repeat: repeat-x;
padding: 0px;
margin: 0 auto;
text-align: left;
}

.clearer {
height: 0;
line-height: 0px;
clear:both;
}

/* -------------------------------------------------- */
/* Site Elements                                           */
/* -------------------------------------------------- */
h1 {
font-family: "Verdana", Airal, Helvetica, sans-serif;
font-size: 1.00em;
line-height: 1.85em;*/
color: #2F4574;
border-bottom: 1px solid #999;
padding: 5px;
}

h2 {
font-family: "Verdana", Airal, Helvetica, sans-serif;
font-size: 1.70em;
}

.constraint {
/* constrains your website to the width defined below */
width: 820px;
margin: 0 auto;
}

.fullWidth {
/* does not contrain website and takes up full width of browser window */
width: 98%;
margin: 0 auto;
}

.leftRail {
/* shadow area on the left side */
background-image: url("borderLeft.png"/*tpa=http://www.strongarmmobility.com/images/borderLeft.png*/);
background-repeat: repeat-y;
background-position: top left;
padding-left: 15px;
}

.rightRail {
/* shadow area on the right side */
background-image: url("borderRight.png"/*tpa=http://www.strongarmmobility.com/images/borderRight.png*/);
background-repeat: repeat-y;
background-position: top right;
padding-right: 15px;
}

.header {
/* contains the logo */
height: 148px;
background-color: #FFFFFF;
}

.logo {
/* company logo */
/*background-image: url('../images/logo.gif');*/
/*background-repeat: no-repeat;*/
height: 55px;
padding: 35px;
padding-top: 5px;
width: 325px;
}

.slideshow{
font-size: 80%;
font-family: verdana;
text-align: center;
}

.flashArea {
height: 400px;
background-color: #CCCCCC;
}

.contentArea {
/* content area holder */
border: 1px solid #FFFFFF;
background-color: #F1F3F9;
}

.left {
/* float left */
float: left;
}

.right {
/* float right */
float: right;
}

.small, .medium, .large {
/* content areas sometimes share common elements such as padding, size etc. Put those elements here. */
padding: 10px;
}

.small {
/* small area holder */
width: 220px;
_width: 215px;
}

.medium {
/* small area holder, used with the .small class to fill the rest of .small class space */
width: 520px;
}

.large {
/* large area holder will use all of available width from .constraint or .fullWidth classes */
}

.footer {
/* this is the "This Site Designed, Developed & Hosted by PMT Advertising" holder. */
border: 1px solid #CCCCCC;
background-color: #5878BB;
margin: 0 auto;
text-align: center;
padding-top: 5px;
padding-bottom: 5px;
color: #333333;
}

.sideBar {
/* sidebar area of website */
background-image: url("sideBar.jpg"/*tpa=http://www.strongarmmobility.com/images/sideBar.jpg*/);
background-repeat: repeat-y;
background-position: top right;
height: 600px;
}

.photoHolder {
/* class holds photos on website */

}

.headerContent {
font-family: "Verdana", Airal, Helvetica, sans-serif;
font-size: 1.00em;
line-height: 1.85em;*/
color: #2F4574;
float: right;
padding: 10px 10px 0 0;
_padding: -20px 10px -10px 0;
width: 375px;
}

/* -------------------------------------------------- */
/* Navigation                                                */
/* -------------------------------------------------- */

.navigation {
/* website navigation container, on most sites this is a flash container holder */
height: 36px;
background-color: #212121;
border-top: 1px solid #999999;
border-bottom: 1px solid #999999;
margin: 0 auto;
_margin: 0;
}

.navigation .subHeadline {
/* styles the text links in the navigation */
font-family: "Helvetica Neue", Airal, Helvetica, sans-serif;
font-size: .9em;
font-weight: normal;
line-height: 5px;
}

.button{
margin: 4px 0 0 8px;
_margin: 4px 0 0 6px;
float: left;
height: 10px;
background-image: url("btn_bg.jpg"/*tpa=http://www.strongarmmobility.com/images/btn_bg.jpg*/);
padding: 12px 10px 2px 10px;
border-right: 1px solid #ccc;
border-bottom: 1px solid #ccc;
border-left: 1px solid #999;
border-top: 1px solid #999;
}

.button a{
color: #5A677C;
}

.button a:hover{
color: #660000;
}

a img {border: 0;}

.consumerSalesButton a, .consumerSalesButton a:hover {
display: block; height: 60px; background: url("consumerSalesBtn.jpg"/*tpa=http://www.strongarmmobility.com/images/consumerSalesBtn.jpg*/) no-repeat top left; margin: 10px 0 0 0;
}

.consumerSalesButton a {
background: url("consumerSalesBtn.jpg"/*tpa=http://www.strongarmmobility.com/images/consumerSalesBtn.jpg*/) no-repeat top left;
}

.consumerSalesButton a:hover {
background: url("consumerSalesBtnHover.jpg"/*tpa=http://www.strongarmmobility.com/images/consumerSalesBtnHover.jpg*/) no-repeat top left;
}

/* -------------------------------------------------- */
/* Text Elements                                          */
/* -------------------------------------------------- */

.siteText, .disclaimer, .headline, .subHeadline {
/* text classes sometimes share common elements such as padding, size etc. Put those elements here. */
font-family: Verdana, Tahoma, Airal, Helvetica, sans-serif;
}

.siteText {
/* this is the class for the text on most of your website. Think of this as the default text class */
font-size: .75em;
line-height: 1.85em;
color: #2F4574;
}

#reviews .siteText {
width: 100%;
}

.headerText {
/* this is the class for the text on most of your website. Think of this as the default text class */
font-size: .75em;
line-height: 1.85em;
color: #2F4574;
padding: 0px 0 0 0;
}

.headerText a, .headerText a:visited{
color: #CC0000;
}

.visitUs {
width: 360px;
background-color: #cc0000;
color: #fff;
padding: 2px 0;
font-size: 11px;
text-align: center;
margin: 5px 0 0 0;
}

.visitUs b {
display: block;
float: left;
width: 250px;
}

.visitUs img {
display: block;
float: left;
width: 108px;
}

.disclaimer {
/* this class will contain text that is smaller than the .siteText class above */
font-size: .65em;
}

.headline {
/* this class will contain text that is larger than the .siteText class above */
font-size: .75em;
font-weight: bold;
color: #2F4574;

}

h4{
/* this class will contain text that is larger than the .siteText class above */
/*
width: 530px;
float: left;
*/
}

.flashCane #contactSlides {
width: 200px;
float: right;
}

.subHeadline {
/* this class is just and extra text class for elements */
font-size: .75em;
font-weight: bold;
}

p {
/* the p tag will style paragraphs */
}

.highlight {
/* this colors any of the text that this class wrapped around */
color: #C11016;
}

ul {
/* styles unorder list items */
}

li {
/* styles list items */
padding-bottom: 5px;
}

.textImage{
	float: left;
	padding: 10px;
}


/* -------------------------------------------------- */
/* Table Elements                                         */
/* -------------------------------------------------- */

.content {
/* wraps around the content */
}

.content table {
/* table properties within content area */
width: 100%;
}

.content td {
/* td properties of the content area */
}

.smallTable, .largeTable {
/* class defines the shared elements of both large and small tables */
margin: 0;
}

.smallTable {
/* class to define the smallest portion of the table */
width: 275px;
}

.largeTable {
/* class to define the largest portion of the table */
}

/* -------------------------------------------------- */
/* Features                                                  */
/* -------------------------------------------------- */

.featuresContent {
position: relative;
padding: 0px;
margin: 0 auto;
text-align: center;
background-color: #F1F3F9;
}

.featuresContent .headline {
border-bottom: 0px;
}

.foreArmBracing {
text-align: left;
/*border: 1px solid #CCCCCC;*/
position: absolute;
width: 225px;
top: 45px;
right: 60px;
}

.ergonomicGrip  {
text-align: left;
/*border: 1px solid #CCCCCC;*/
position: absolute;
width: 250px;
top: 260px;
right: 110px;
}

.offsetBend  {
text-align: left;
/*border: 1px solid #CCCCCC;*/
position: absolute;
width: 240px;
top: 370px;
right: 460px;
}

.series  {
text-align: left;
/*border: 1px solid #CCCCCC;*/
position: absolute;
width: 315px;
top: 590px;
right: 5px;
}

.floorTip  {
text-align: left;
/*border: 1px solid #CCCCCC;*/
position: absolute;
width: 325px;
top: 640px;
right: 410px;
}

.nutLobes  {
text-align: left;
/*border: 1px solid #CCCCCC;*/
position: absolute;
width: 200px;
top: 460px;
right: 125px;
}

.foamGrip  {
text-align: left;
/*border: 1px solid #CCCCCC;*/
position: absolute;
width: 255px;
top: 120px;
right: 500px;
}

.headerImages {
position: relative;
}

.leaf {
z-index: 10;
position: absolute;
height: 180px;
width: 200px;
top: -15px;
right: 12px;
background-image: url("leaf.png"/*tpa=http://www.strongarmmobility.com/images/leaf.png*/);
background-repeat: no-repeat;
}

.compass {
z-index: 10;
position: absolute;
height: 128px;
width: 128px;
top: -10px;
right: 15px;
background-image: url("compass.png"/*tpa=http://www.strongarmmobility.com/images/compass.png*/);
background-repeat: no-repeat;
}

.wholesale {
z-index: 10;
position: absolute;
height: 160px;
width: 250px;
top: 2px;
right: -21px;
background-image: url("wholesale.jpg"/*tpa=http://www.strongarmmobility.com/images/wholesale.jpg*/);
background-repeat: no-repeat;
}

.couple {
z-index: 10;
position: absolute;
height: 160px;
width: 250px;
top: 2px;
right: 15px;
background-image: url("couple.jpg"/*tpa=http://www.strongarmmobility.com/images/couple.jpg*/);
background-repeat: no-repeat;
}

.certificate {
z-index: 10;
position: absolute;
height: 160px;
width: 250px;
top: 2px;
right: 15px;
background-image: url("certificate.jpg"/*tpa=http://www.strongarmmobility.com/images/certificate.jpg*/);
background-repeat: no-repeat;
}

.people {
z-index: 10;
position: absolute;
height: 137px;
width: 305px;
top: 30px;
right: 30px;
background-image: url("about_header.jpg"/*tpa=http://www.strongarmmobility.com/images/about_header.jpg*/);
background-repeat: no-repeat;
}

.leaf {
z-index: 10;
position: absolute;
height: 180px;
width: 200px;
top: -15px;
right: 12px;
background-image: url("leaf.png"/*tpa=http://www.strongarmmobility.com/images/leaf.png*/);
background-repeat: no-repeat;
}

.clipboard {
z-index: 10;
position: absolute;
height: 125px;
width: 165px;
top: 10px;
right: 15px;
background-image: url("clipboard.jpg"/*tpa=http://www.strongarmmobility.com/images/clipboard.jpg*/);
background-repeat: no-repeat;
}

.binocular {
z-index: 10;
position: absolute;
height: 107px;
width: 213px;
top: 40px;
right: 15px;
background-image: url("binocular.png"/*tpa=http://www.strongarmmobility.com/images/binocular.png*/);
background-repeat: no-repeat;
}

/* -------------------------------------------------- */
/* Home                                                       */
/* -------------------------------------------------- */
.largeHome {
background-image: url("home_bg.jpg"/*tpa=http://www.strongarmmobility.com/images/home_bg.jpg*/);
background-position: absolute;
background-repeat: no-repeat;
padding: 10px 10px 0 10px;
}

.homeImages{
text-align: center;
}

.homeImages img{
margin: 4px 2px 4px 2px;
border: 1px solid #fff;
}

.homeImages a:hover img{
border: 1px solid #666;
}

.topImage{
margin: 0 auto;
padding: 0 0 0 15px;
}
/* -------------------------------------------------- */
/* About                                                        */
/* -------------------------------------------------- */
.largeAbout {
background-image: url("content_bg.jpg"/*tpa=http://www.strongarmmobility.com/images/content_bg.jpg*/);
background-repeat: no-repeat;
padding: 10px;
}

div.photoHolder{
	
}

div.quote{
	float: right;
	width: 360px;
	font-size: 14px;
	margin: 30px 20px 0 0;
	color: #990000;
	font-family: "Arial", Helvetica, sans-serif;
	line-height: 16px;
}

.tradeShowImage{
float: right;
margin: 0 0 0 10px;
}

/* -------------------------------------------------- */
/* Reviews                                                       */
/* -------------------------------------------------- */
.largeReviews {
background-image: url("reviews_bg.jpg"/*tpa=http://www.strongarmmobility.com/images/reviews_bg.jpg*/);
background-repeat: no-repeat;
background-position: center top;
padding: 10px;
}

.videoNav{
	text-align: center;
	margin: 0 20px 0 0;
}

.videoNav a{
	margin: 0 0 0 20px;
}

.topReview img{
	float: left;
	padding: 5px;
	cursor: pointer;
}

.letter{
	margin: 20px;
}


/* -------------------------------------------------- */
/* Contact                                                     */
/* -------------------------------------------------- */

#contactInfo{
font-family: "Verdana", Arial, Helvetica, sans-serif;
font-size: 12px;
color: #2F4574;
}

#contactInfo dd{
margin: 7px 0;
padding: 0;
font-weight: bold;
font-size: 155%;
}

#contactInfo dd a{
text-decoration: underline;
}

.reimbursement {
font-family: "Verdana", Arial, Helvetica, sans-serif;
font-size: 12px;
color: #2F4574;
}

/* -------------------------------------------------- */
/* Links                                                        */
/* -------------------------------------------------- */

a  {
/* this class styles all link elements on the site */
color: #cc6600;
text-decoration: none;
}

a:hover {
/* this class styles all link hover elements on the site */
color: #999;
/*text-decoration: underline;*/
}


.navigation a  {
/* this class styles all link elements in the navigation */
}

.navigation a:hover {
/* this class styles all link hover elements in the navigation */
}

.disclaimer a {
color: #ccc;
}

.disclaimer a:hover {
color: #e0e000;
}

body#wholesale dl dd a {
color: blue;
}

body#wholesale dl {
border: 1px solid #d3d7e4;
padding: 1px 0 9px 20px;
background-color: #fafbfe;
}

body#wholesale dl dd {
padding: 8px 0;
}