h1 {font-size: 138.5%;}
h2 {font-size: 131%;}
h3 {font-size: 123.1%;}
h4 {font-size: 116%;}
h5 {font-size: 108%;}
h6 {font-size: 100%;}

a.tinyText:active,
a.tinyText:link,
a.tinyText:visited,
.tinyText
{
font-size: 10px !important;
text-decoration: none;
font-style: normal;
font-weight: normal;
}

.imageReplace
{
display: block;
text-indent: -9999px;
overflow: hidden;
}

p.error
{
padding: 0.75em;
margin-bottom: 1.5em;
background-color: #FF0000;
font-size: 131%;
color: #FFF;
}

input.opInput
{
padding: 5px;
}

input.opButton
{
padding: 4px;
}

select.opSelect
{
padding: 4px 1px;
}

.allCaps
{
text-transform: uppercase;
}

div#opColumnWrapper
{
padding-bottom: 2em;
}

div#opColumnOne
{
float: left;
width: 600px;
margin-right: 90px;
}

div#opColumnTwo
{
float: left;
width: 268px;
}

ul.normalUL
{
padding-left: 3em;
list-style: disc outside;
}

ol.normalOL
{
padding-left: 3em;
list-style: decimal outside;
}

ul.normalUL li,
ol.normalOL li
{
margin-bottom: 1em;
line-height: 1.5em;
}

/* ----------------------------------------------------------
BREADCRUMB
---------------------------------------------------------- */

div#opBreadcrumb
{
margin-bottom: 2em;
}

div#opBreadcrumb ul li
{
float: left;
margin-right: 1em;
}

div#opBreadcrumb ol li.last
{
margin-right: 0;
}

div#opBreadcrumb li.optionNA a:active,
div#opBreadcrumb li.optionNA a:link,
div#opBreadcrumb li.optionNA a:visited
{
color: #999;
text-decoration: none;
cursor: default;
}

/* ----------------------------------------------------------
EXAMPLE STYLES
---------------------------------------------------------- */
div#preview_div
{
display: none;
position: absolute;
padding: 10px 0 0 30px;
z-index:110;
background-color: #FFF;
border: 2px solid #DDD;
}

div#loader
{
text-decoration: blink;
}

h2.stylePreviewTitle
{
margin-bottom: 0.75em;
}

div#exampleStyles div#opColumnOne
{
width: 630px;
margin-right: 60px;
}

div#search
{
margin-bottom: 1.5em;
}

div.styleInfo
{
float: left;
padding: 10px 10px 16px 10px;
margin: 0 30px 30px 0;
background: #F1F1F1;
}

a.styleThumbnail:active,
a.styleThumbnail:link,
a.styleThumbnail:visited
{
display: block;
height: 140px;
margin-bottom: 6px;
}

a.styleThumbnail img
{
border: 5px solid #CCC;
}

div.styleInfo h5
{
border-bottom: 1px dotted #999;
margin-bottom: 0.25em;
}

div.styleInfo ul li
{
line-height: 1.35em;
}

li.viewLiveExample a:active,
li.viewLiveExample a:link,
li.viewLiveExample a:visited
{
width: 160px;
height: 30px;
margin-top: 0.5em;
background: transparent url(/includes/orderProcess/images/opStyleNav.jpg) no-repeat 0 0;
}

li.viewLiveExample a:focus,
li.viewLiveExample a:hover
{
width: 160px;
height: 30px;
background: transparent url(/includes/orderProcess/images/opStyleNav.jpg) no-repeat 0 -30px;
}

li.selectStyle a:active,
li.selectStyle a:link,
li.selectStyle a:visited
{
width: 160px;
height: 30px;
background: transparent url(/includes/orderProcess/images/opStyleNav.jpg) no-repeat -160px 0;
}

li.selectStyle a:focus,
li.selectStyle a:hover
{
width: 160px;
height: 30px;
background: transparent url(/includes/orderProcess/images/opStyleNav.jpg) no-repeat -160px -30px;
}

.lightBox-styleKey p
{
margin-bottom: 1em;
line-height: 1.5em;
}

/* ----------------------------------------------------------
HELP SIDEBAR
---------------------------------------------------------- */
div#helpSidebar
{
color: #777;
}

div#helpSidebar ul
{
margin: 0.5em 0;
}

div.sidebarSet
{
padding: 1.25em 0 1.75em 0;
border-top: 1px dotted;
}

div#helpSidebar h4
{
margin-bottom: 0.5em;
color: #333;
}

div#quickFAQs li,
div#helpContact li
{
margin: 0 0 1.75em 0;
}

div#quickFAQs ul,
div#quickFAQs li.last,
div#helpContact li.last
{
margin: 0;
}

div#helpContact
{
border-bottom: 1px dotted;
}

div#helpPaymentOptions ul
{
width: 268px;
height: 58px;
margin-top: 1.5em;
text-indent: -9999px;
background: transparent url(/includes/orderProcess/images/opCreditCards.jpg) no-repeat 0 0;
}

div#helpPaymentOptions ul li
{
display: none;
}

/* ----------------------------------------------------------
LIGHTBOX
---------------------------------------------------------- */
div#lightBox
{
display: none;
position: absolute;
top: 0%;
left: 0%;
width: 100%;
height: 3000px;
background-color: black;
z-index:1001;
-moz-opacity: 0.8;
opacity:.80;
filter: alpha(opacity=80);
}

.lightBox-styleKey,
#lightBox-componentDescription,
.keyDescrip
{
display: none;
position: absolute;
top: 50%;
left: 50%;
width: 640px;
height: auto;
padding: 30px;
border: 6px solid #111;
margin-top: -200px;
margin-left: -346px; /* 1/2 the width (692 total) */
z-index:1002;
overflow: auto;
background-color: #FFF;
text-align: left;
}

a.closeLightBox:active,
a.closeLightBox:link,
a.closeLightBox:visited
{
float: right;
display: block;
width: 24px;
height: 24px;
text-indent: -9999px;
background: transparent url(/includes/orderProcess/images/closeLightBox.jpg) no-repeat 0 0;
overflow: hidden;
}

div#lightBox-componentDescription h4,
div#lightBox-componentDescription h6
{
padding-bottom: 0.25em;
border-bottom: 1px solid;
margin-bottom: 0.5em;
}

div#lightBox-componentDescription p,
div#lightBox-componentDescription ul,
.keyDescrip p
{
margin-bottom: 1em;
}

div#lightBox-componentDescription ul
{
padding-left: 2em;
list-style: disc inside;
}

div#lightBox-componentDescription ul li
{
margin-bottom: 0.5em;
}

div#lightBox-componentDescription h6
{
border-bottom: 1px dashed;
margin-top: 1.5em;
}

div#lightBox-componentDescription a.closeLightBox
{
margin-top: 30px;
}

h3.styleTitle
{
font-size: 138.5%;
}

div.styleDescripColWrap
{
padding: 14px 0;
border-top: 1px solid;
border-bottom: 1px solid;
margin: 10px 0;
}

div.styleDescripColOne
{
float: left;
width: 160px;
margin-right: 30px;
}

div.styleDescripColOne img
{
border: 5px solid #CCC;
}

div.styleDescripColTwo
{
float: left;
width: 430px;
line-height: 1.5em;
}

/* ----------------------------------------------------------
MODIFY COMPONENTS
---------------------------------------------------------- */
div#pageTitle
{
padding-bottom: 2.25em;
}

div#pageTitle p.tinyText
{
padding-top: 0.5em;
border-top: 1px dotted #999;
margin-top: 0.25em;
font-style: italic;
}

div#compBreadcrumb ul li
{
float: left;
margin-right: 3px;
}

div#compBreadcrumb ul li.iAmHere
{
padding: 10px 16px;
border: 1px solid #DDD;
border-bottom: 1px solid #FFF;
margin-bottom: -1px;
}

div#compBreadcrumb ul li.NA a:active,
div#compBreadcrumb ul li.NA a:link,
div#compBreadcrumb ul li.NA a:visited
{
display: block;
padding: 10px 16px;
background-color: #EEE;
color: #555;
text-decoration: none;
}

div#compBreadcrumb ul li.NA a:focus,
div#compBreadcrumb ul li.NA a:hover
{
background-color: #FF6600;
color: #FFF;
text-decoration: none;
}

div#compBreadcrumb ul li.NA span.tinyText
{
color: #0036FF;
}

div#compBreadcrumb ul li.NA a:focus span.tinyText,
div#compBreadcrumb ul li.NA a:hover span.tinyText
{
color: #FFF;
}

div#compAreaShortDescrip
{
padding: 0.5em 1em;
border: 1px solid #DDD;
border-bottom: none;
text-align: right;
}

div#compAreaShortDescrip p span.tinyText
{
font-style: italic;
}

.keyDescrip h3
{
font-size: 138.5%;
}

.keyDescrip p.first
{
padding-top: 14px;
border-top: 1px solid;
margin-top: 10px;
}

.keyDescrip ul
{
margin: 0 0 1em 3em;
list-style: disc outside;
}

.keyDescrip ol
{
margin: 0 0 1em 3em;
list-style: decimal outside;
}

.keyDescrip li
{
margin-bottom: 0.5em;
}

.keyDescrip h6
{
margin: 1.5em 0 0.5em 0;
}

a.closeLightBox.last
{
margin-top: 30px;
}

div#modCompsWrapper
{
margin-top: 2em;
}

div#modCompsColOne
{
float: left;
width: 270px;
margin-right: 60px;
}

div#modCompsColTwo
{
float: right;
width: 270px;
}

div#alsoGet
{
padding-top: 2.15em;
border-top: 2px solid #0036FF;
margin-top: 1.5em;
}

div#alsoGet h2
{
padding-bottom: 0.15em;
border-bottom: 1px dotted #999;
margin-bottom: 0.5em;
}

/* -------------- modCompColumnOne -------------- */
div.compListSet
{
padding-bottom: 0.25em;
border-bottom: 1px dotted;
margin-bottom: 1.25em;
}

span.compName
{
float: left;
}

span.multiSized:after
{
content: " (MultiSized)";
font-size: 77%;
color: #FF6600;
}

a.editComp:active,
a.editComp:link,
a.editComp:visited,
a.removeComp:active,
a.removeComp:link,
a.removeComp:visited,
a.questionComp:active,
a.questionComp:link,
a.questionComp:visited
{
float: right;
width: 24px;
height: 24px;
margin-right: 10px;
background: transparent url(/includes/orderProcess/images/opEditTrash.jpg) no-repeat 0 0;
}

a.editComp:focus,
a.editComp:hover
{
background: transparent url(/includes/orderProcess/images/opEditTrash.jpg) no-repeat 0 -24px;
}

a.removeComp:active,
a.removeComp:link,
a.removeComp:visited
{
width: 18px;
background: transparent url(/includes/orderProcess/images/opEditTrash.jpg) no-repeat -24px 0;
}

a.removeComp:focus,
a.removeComp:hover
{
background: transparent url(/includes/orderProcess/images/opEditTrash.jpg) no-repeat -24px -24px;
}

a.questionComp:active,
a.questionComp:link,
a.questionComp:visited
{
margin-right: 0;
background: transparent url(/includes/orderProcess/images/opEditTrash.jpg) no-repeat -42px 0;
}

a.questionComp:focus,
a.questionComp:hover
{
background: transparent url(/includes/orderProcess/images/opEditTrash.jpg) no-repeat -42px -24px;
}

div.compItemFormWrap
{
padding-top: 0.25em;
border-top: 1px dotted;
}

div#modCompsColOne form
{
padding: 0.75em;
background-color: #DEE7F6;
}

div.compItemFormSet
{
margin-bottom: 0.5em;
}

div.compItemFormSet label
{
display: block;
margin-bottom: 0.15em;
color: #777;
font-style: italic;
}

div.compListSet input.opButton
{
display: block;
margin-top: 1em;
}

/* -------------- modCompColumnTwo -------------- */
div.addCompsMsg h4
{
margin-bottom: 0.15em;
}

div.addCompsMsg p,
div#addComps
{
padding: 15px;
margin-bottom: 1.25em;
background-color: #EEE;
}

div#belowDefaultComps h4
{
color: #FF0000;
}

div#belowDefaultComps p
{
background-color: #FF0000;
color: #FFF;
}

div.addCompsSet
{
margin-bottom: 0.75em;
}

div#addToGetFreeComp p#oneLeftForFree,
div#addToGetFreeComp p#addFreeComp
{
font-weight: bold;
background-color: #FF6600;
color: #FFF;
}

div#addToGetFreeComp p#addFreeComp
{
text-decoration: blink;
background-color: #009900;
text-align: center;
}

div#addComps label
{
display: block;
margin-bottom: 0.15em;
font-style: italic;
color: #555;
}

div#addComps input.opButton
{
margin-top: 1.5em;
text-transform: uppercase;
font-weight: bold;
}

div.opMiniNav
{
background-color: #0036FF;
}

a#chooseCompNext:active,
a#chooseCompNext:link,
a#chooseCompNext:visited
{
float: left;
width: 80px;
height: 36px;
background: transparent url(/includes/orderProcess/images/opMiniNav.jpg) no-repeat -80px 0;
}

a#chooseCompNext:focus,
a#chooseCompNext:hover
{
background: transparent url(/includes/orderProcess/images/opMiniNav.jpg) no-repeat -80px -36px;
}

a#chooseCompPrev:active,
a#chooseCompPrev:link,
a#chooseCompPrev:visited
{
float: left;
width: 80px;
height: 36px;
background: transparent url(/includes/orderProcess/images/opMiniNav.jpg) no-repeat 0 0;
}

a#chooseCompPrev:focus,
a#chooseCompPrev:hover
{
background: transparent url(/includes/orderProcess/images/opMiniNav.jpg) no-repeat 0 -36px;
}

a#skipToProfile:active,
a#skipToProfile:link,
a#skipToProfile:visited
{
float: right;
width: 90px;
height: 36px;
background: transparent url(/includes/orderProcess/images/opMiniNav.jpg) no-repeat -160px 0;
}

a#skipToProfile:focus,
a#skipToProfile:hover
{
background: transparent url(/includes/orderProcess/images/opMiniNav.jpg) no-repeat -160px -36px;
}

a#continueOrderLink:active,
a#continueOrderLink:link,
a#continueOrderLink:visited
{
float: right;
width: 160px;
height: 36px;
background: transparent url(/includes/orderProcess/images/opMiniNav.jpg) no-repeat -250px 0;
}

a#continueOrderLink:focus,
a#continueOrderLink:hover
{
background: transparent url(/includes/orderProcess/images/opMiniNav.jpg) no-repeat -250px -36px;
}

/* -------------- helpSidebar -------------- */
div#styleSynopsis
{
padding-top: 0;
border-top: 0;
}

div#styleSynopsis img
{
border: 5px solid #CCC;
margin-bottom: 0.25em;
}

div#yourCostsToday ul li
{
line-height: 1.5em;
}

li.discountAmount
{
padding: 4px 0;
color: #333;
background-color: #DDF5D8;
}

li#totalCostToday
{
padding-top: 0.25em;
border-top: 1px dashed #CCC;
margin-top: 0.25em;
}

div#couponCode label
{
display: block;
margin-bottom: 0.15em;
}

div#startOver a:active,
div#startOver a:link,
div#startOver a:visited
{
color: #FF0000;
}

div#startOver a:focus,
div#startOver a:hover
{
text-decoration: none;
}

/* ----------------------------------------------------------
CREATE PROFILE
---------------------------------------------------------- */
div#enterProfile fieldset
{
margin-bottom: 2em;
}

p.formPreface
{
margin-bottom: 1em;
font-size: 85%;
color: #FF0000;
}

div.formItem
{
padding: 2px 0;
border-top: 1px dotted;
}

div.formItem.last
{
border-bottom: 1px dotted;
}

div.formItem p
{
padding: 0.75em;
}

div.formItem.focusItem
{
background-color: #DEE7F6;
}

div.formItem label
{
display: block;
float: left;
width: 200px;
padding-right: 20px;
}

div.formItem input.opInput
{
padding: 3px;
}

div.formItem select.opSelect
{
padding: 2px 1px;
}

input.opContinueOrderButton,
input.opProcessOrderButton
{
width: 160px;
height: 36px;
border: 0;
margin-top: 1.5em;
text-indent: -9999px;
cursor: pointer;
background: transparent url(/includes/orderProcess/images/opMiniNav.jpg) no-repeat -250px 0;
}

input.opContinueOrderButton:focus,
input.opContinueOrderButton:hover
{
background: transparent url(/includes/orderProcess/images/opMiniNav.jpg) no-repeat -250px -36px;
}

input.opProcessOrderButton
{
background: transparent url(/includes/orderProcess/images/opMiniNav.jpg) no-repeat -410px 0;
}

input.opProcessOrderButton:focus,
input.opProcessOrderButton:hover
{
background: transparent url(/includes/orderProcess/images/opMiniNav.jpg) no-repeat -410px -36px;
}

div#enterCCInfo div.formItem span.tinyText,
div#enterProfile div.formItem span.tinyText
{
display: block;
line-height: 1.25em;
}

/* ----------------------------------------------------------
ENTER CC INFO
---------------------------------------------------------- */
div#legalStuffWrapper
{
height: 300px;
padding: 10px;
border: 5px solid #999;
margin-bottom: 2em;
background: #FFFFFF;
color: #222;
overflow: auto;
}

p#sameAsOwnerInfo
{
padding: 1em;
margin-bottom: 2em;
background-color: #F1F1F1;
}

p#sameAsOwnerInfo input
{
width: 20px;
height: 20px;
margin-right: 10px;
}

div.formItem label span.tinyText
{
font-style: italic;
color: #777;
}

a#sslLink:active,
a#sslLink:link,
a#sslLink:visited
{
width: 85px;
height: 51px;
margin-top: 1.5em;
background: transparent url(/includes/orderProcess/images/opSSLSeal.gif) no-repeat 0 0;
}

/* -------------- LEGAL STUFF -------------- */

div#legalStuffWrapper h1
{
margin-bottom: 1em;
}

div#legalStuff p,
div#legalFullPgContent p
{
padding: 0.5em 0;
line-height: 1.5em;
}

span.legalHeading
{
font-weight: bold;
text-transform: capitalize;
}

/* ----------------------------------------------------------
ORDER COMPLETE
---------------------------------------------------------- */
div#orderComplete h1
{
margin-bottom: 1.5em;
}

p.verbiage,
div#orderComplete h4,
div#orderComplete ol
{
margin-bottom: 1em;
}

div#orderComplete ol
{
margin-left: 3em;
list-style: decimal outside;
}

div#orderComplete ol li
{
padding: 0.25em 0;
}

div#orderComplete ol ul
{
margin: 0.5em 0 0 1em;
list-style: disc inside;
}

div#orderCompleteConversionCode
{
display: none;
}

/* -------------- PRINT RECEIPT -------------- */
div#printReceiptPaymentAccepted
{
padding: 40px 60px;
}

div.receiptSection
{
margin-bottom: 2em;
}

div.receiptSection h1
{
margin-bottom: 0.5em;
}

div.receiptSection div.formItem
{
padding: 0.5em 0;
}

div.receiptSection label
{
margin-right: -200px;
}

div.receiptSection p.labelContent
{
padding: 0 0 0 205px;
}

div#printReceiptPackageDetails img
{
padding: 1px;
border: 5px solid #CCC;
}

div.receiptSection h5
{
margin-bottom: 0.25em;
}

div#printReceiptCompsPurchased ul
{
margin: 1em 0 0.5em 3em;
list-style: disc outside;
}

div#printReceiptCompsPurchased li
{
margin-bottom: 0.5em;
}

li.totalAmount
{
padding: 0.25em 0;
border-top: 1px dashed #CCC;
margin-top: 0.25em;
font-weight: bold;
}

/* ----------------------------------------------------------
PAYMENT DECLINED
---------------------------------------------------------- */
div#googleAdwords
{
display: none;
}

div#paymentDeclined h1,
div#paymentDeclined h4,
div#paymentDeclined ul,
div#paymentDeclined li
{
margin-bottom: 1em;
}

div#paymentDeclined ul
{
margin-left: 3em;
list-style: disc outside;
}

div#paymentDeclined p.verbiage
{
padding-bottom: 3em;
margin: 0;
}