@import "cart.css";

/*------------------------------------------------------------------------------
    Global Styles
*/
html, body {
    padding: 0;
    margin: 0;
}
html {
    overflow-y:scroll;
}

body {
    font-family: "Helvetica LT Std", Helvetica, Arial, sans-serif;
    font-size:14px;
    background:#B2E1F8;
}
a img {
    border:none;
}
a {
    color:#104BFF;
}
a:hover {
    color:#25CF0D;
}
a:visited {
    color:#FF7420;
}
.js {
    display:none;
}
form {
    margin:0;
    padding:0;
}

/*------------------------------------------------------------------------------
    IE6 PNG fix. Enable if needed.
*/
/*
* html img {
    behavior: url('/css/pngfix.htc');
}
*/


/*------------------------------------------------------------------------------
    Primary Layout Containers
*/
#Container {
    width:789px;
    margin:0 auto;
    background:white;
}
#Content {
    float:left;
    width:594px;
    border:2px solid #44C6F3;
    padding:0 10px;
    margin:6px 10px 6px 5px;
}
#Header {
    width:789px;
    height:108px;
    background:url(/img/layout/header_bg.jpg) top left no-repeat;
}
#Header h1.logo {
    text-indent:-9999px;
    overflow:hidden;
    width:251px;
    height:108px;
    margin:0;
    background:url(/img/layout/logo.jpg) top left no-repeat;
}

#RedHead {
    background-color:#EC1C24;
    color:white;
    text-align:center;
    font-weight:bold;
    padding:7px 0;
}
#RedHead .big {
    font-size:25px;
    text-transform:uppercase;
}
#RedHead .small {
    font-size:15px;
}

h2 {
    color:#28A9E1;
    text-transform:uppercase;
    letter-spacing:0.05em;
    font-size:18px;
    margin:1em 0 0.25em;
}
#ContentHeader {
    position:relative;
}
#ContentHeader h2,
#ContentHeader .breadCrumbs {
    padding:0 10px;
}
#ContentHeader .breadCrumbs {
    margin:0.5em 0;
    font-size:10px;
}
#ContentHeader .spacer {
    background:#E5E5E6;
    height:6px;
    border-top:1px solid #626366;
    border-bottom:1px solid #626366;
}
#ContentHeader .download {
    font-size:10px;
    padding:0 10px;
    margin:-0.5em 0 0.5em 0;
}
#ContentHeader .pagination {
    position:absolute;
    bottom:10px;
    right:10px;
}

/*------------------------------------------------------------------------------
    Navigation - Top and Left
*/
#TopNav {
    border-top:2px solid #44C6F3;
    border-bottom:2px solid #44C6F3;
}
#TopNav .item a {
    display:block;
    float:left;
    padding:7px 15px;
    font-size:11px;
    font-weight:bold;
    text-transform:uppercase;
    text-decoration:none;
    color:black;
}


#LeftNav {
    float:left;
    font-weight:bold;
    width:146px;
    padding-left:10px;
}
#LeftNav a {
    color:black;
    text-decoration:none;
    cursor:pointer;
}
#LeftNav .item {
    background:#E3F1FA;
    border:2px solid #44C6F3;
    margin:6px 0;
    padding:8px 0;
}
#LeftNav .first {
    display:block;
    padding-left:0.5em;
       
    text-transform:uppercase;
    font-size:13px;
}
#LeftNav .second {
    font-size:12px;
    display:block;
    padding-left:1.5em;
    margin-top:0.5em;
}
#LeftNav .third {
    font-size:11px;
    display:block;
    padding-left:3em;
    margin-top:0.5em;
}
#LeftNav .fourth {
    font-size:11px;
    font-weight:normal;
    padding-left:4em;
}

#LeftNav .item.darkBlue {
    background:#44C6F3;
    border-color:#44C6F3;    
    text-align:center;
}
#LeftNav .item.darkBlue a {
    color:#EC1C24;
    text-transform:uppercase;
    font-size:13px;
}

/*------------------------------------------------------------------------------
    Home, etc
*/
#Home {
    position:relative;
}
#Home p {
    font-size:16px;
    margin:0.8em 0;
}
#Home p.strong {
    font-weight:bold;
}
#Home p.larger {
    font-size:18px;
}
#Home p.red {
    color:#EC1C24;
    font-style:italic;
    font-weight:bold;
    margin-bottom:0.5em;
}
#Home p.blueBig {
    color:#44C6F3;
    font-size:24px;
    font-family:Verdana, sans-serif;
    font-weight:bold;
    margin:0;
    padding:0 0 10px;
}
#Home .logo {
    background:url(/img/layout/logo_mark.png);
    position:absolute;
    bottom:0;
    right:0;
    width:127px;
    height:127px;
}
#HomeBottom .darkBlue {    
    background:#44C6F3;  
    text-align:center;
    border:2px solid #44C6F3;    
    float:left;
}

#HomeBottom .darkBlue.specials {
    width:142px;
    height:15px;
    padding:8px 0;
    margin-left:10px;
    _margin-left:5px!important;
    font-size:13px;
    text-transform:uppercase;   
    font-weight:bold; 
}
#HomeBottom .darkBlue.specials a {
    color:#EC1C24;
    text-decoration:none;    
}


#HomeBottom .darkBlue.callQuote {
    width:614px;
    line-height:0px;
    padding:15px 0;    
    height:1px;    
    argin-right:10px;
    margin-left:5px;
    font-size:26px;
    color:black;
    font-weight:bold;
}

/*------------------------------------------------------------------------------
    Info Pages
*/
div.infoPage p {
    margin:1em;
}
div.infoPage h3 {
    margin:1em;
}
div.infoPage ul {
    margin:1em;
}

/*------------------------------------------------------------------------------
    Font Selector
*/
#FontSelector .fontBox  {
    border-top:1px solid #999;
    width:530px;
    
    margin:1em auto;
}
#FontSelector .number {
    float:left;
    line-height:0px;
    width:22px;
    padding:11px 0;
    font-size:12px;
    font-family:Consolas, "Courier New", monospace;
    text-align:center;
    background:#E7EFF3;
}
#FontSelector .image {
    float:left;
}
#FontSelector .name {
    display:none;
}


/*------------------------------------------------------------------------------
    Product Listing
*/
#Products .product {
    float:left;
    width:150px;
    height:190px;
    text-align:center;
    padding:14px 22px;
    
}
#Products .product .image {
    padding-bottom:6px;
}
#Products .product .name {
    font-size:10px;
    text-transform:uppercase;    
}
#Products .product .name a {
    display:block;
    padding:4px 0;
    color:black;
    font-weight:bold;
    text-decoration:none;
    background:white;
}
#Products .product:hover .name a {
    background:#44C6F3;
    color:white;
}

/*------------------------------------------------------------------------------
    Product Detail
*/

#Product {
    padding:0 10px;
}
#Product #Image {
    float:left;
    width:300px;
    height:300px;
    overflow:hidden;
}
#Product #Details {
    color:black;
    width:275px;
    padding-left:15px;
    float:left;
}
#Product #Details h3 {
    font-size:12px;
    letter-spacing:0.1em;
    text-transform:uppercase;
}
#Product #Details .item_number {    
    font-style:italic;
}
#Product #Details ul {
    margin:0;
    padding-left:1em;
}
#Product #Details li {
    margin:0.25em 0;
    font-size:11px;
    font-family:sans-serif;
}
#Product #Details li a {
    color:#EC1C24;
    font-weight:bold;
}
#Product #PriceTable {
    margin:1.7em auto;
    width:352px;
    color:black;
}
#Product #PriceTable h3 {
    font-size:12px;
    text-transform:uppercase;
    margin:0.5em 0;
    text-align:center;
}
#Product #PriceTable #TableShell {
    width:350px;
    height:90px;
    background:url(/img/layout/price_table_bg.png) top left no-repeat;
    overflow:hidden;
}
#Product #PriceTable #TableShell.short {
    height:65px;
    background:url(/img/layout/price_table_bg_s.png) top left no-repeat;
}
#Product #PriceTable #TableShell.short table {
    height:63px;
}
#Product #PriceTable table {
    width:350px;
    height:88px;
    border-collapse:collapse;
    border:2px solid transparent;
}
#Product #PriceTable table th,
#Product #PriceTable table td {
    border:1px solid black;
    padding:0 6px;
}
#Product #PriceTable table th {
    font-size:11px;
    text-transform:uppercase;
    border-bottom-width:2px;
}
#Product #PriceTable table td {
    border:1px solid black;
    font-size:10px;
    text-align:center;
}
#Product #PriceTable table .rowHeader { 
    border-right-width:2px;
    text-align:center;
    text-transform:uppercase;
}



#Product .swatch {
    border:1px solid white;
}
#Product .swatch.active {
    border-color:#0E5E9D;
}
#Product #product_image {
    float:left;
}
#Product .desc,
#Product .options {
    float:right;
    width:350px;
    clear:right;
}
#Product #ProductImage {
    border:1px dashed #efefef;
}
#Product #FaceToggle {
    text-align:center;
    font-size:12px;
    padding:8px 0;
}
#Product #FaceToggle a {
    cursor:pointer;
    padding:2px 4px;
    border:1px solid white;
}
#Product #FaceToggle a:hover {
    text-decoration:none;
}
#Product #FaceToggle a.active {
    background-color:#FFFFCC;
    color:black;
    border:1px solid #999966;
}
#Product #FaceToggle a.disabled {
    color:#999999;
    cursor:default;
}



/** 
    Contact Page
**/
#Contact {
    margin:0 10px;
}
#Contact div.input input {
    padding:0.15em 0.25em;
    width:18em;
}
#Contact textarea {
    font-family:"Verdana", sans-serif;
    width:22em;
    padding:0.15em 0.25em;
}
#Contact select {
    width:18em;
}
#Contact div.input.date select {
    width:auto!important;
}
#Contact div.input {
    margin:0.25em 0;
}
#Contact div.checkbox {
    margin:0.5em 0;
}
#Contact div.input label {
    display:block;
    font-size:11px;
}
#Contact div.checkbox label {
    font-size:80%;
}
#Contact div.input.radio {
    margin:1em 0;
}
#Contact div.input.radio label {
    display:inline;
    font-size:12px;
}
#Contact div.input.radio input {
    width:auto;
}

#Contact fieldset{
    border:1px solid #c9c9c9;
    background:#fbfbfb;
    padding-left:1em;
    padding-right:1em;
    margin:1em 0;
}
#Contact legend {
    font-size:115%;
    color:#EC1C24;
}
#Contact div.submit {
    margin:1em 0;
}
#Contact div.submit input {
    
}
#Contact span.reqStar {
    color:#CC0000;
    font-weight:bold;
}
#Contact .error-message {
    color:#CC0000;
    font-size:90%;
    font-weight:bold;
}
#contactMessage {
    color:#CC0000;
    font-size:120%;
    font-weight:bold;
    text-align:center;
    background:#FFFFCC;
}

#ContactTable {
    width:100%;
}
#ContactTable th {
    text-align:left;
    background:#000044;
    color:white;
    padding:0.2em 0.5em;
}

.contactBox {
    float:left;
    font-size:10px;
    padding:0 1em;
    margin:0.5em;
}
.contactBox h5 {
    margin:0.5em 0;
    font-size:11px;
    color:#005183;
}



/*------------------------------------------------------------------------------
    La Pagination
*/
#pagination {
    font-size:85%;
    padding:6px;
}
#pagination .pages {
    background-color:#efefef;
    border-top:1px solid #dfdfdf;
    border-bottom:1px solid #dfdfdf;
    margin:3px 0;
}
#pagination a,
#pagination .pages .current,
#pagination .pagingNav {
    padding:3px 3px;
    display:block;
    float:left;
    text-decoration:none;
}
#pagination a:hover {
    background-color:#ccc;
}
#pagination .pages .current {
    color:black;
}

#pagination .pagingNav {
    width:45px;
    text-align:center;
}
#pagination a.pagingNav {
    color:#FF4B0F;
}

#pagination .number,
#pagination .current {
    padding-left:8px!important;
    padding-right:8px!important;
}
#pagination .limit {
    font-size:85%;
}


/*------------------------------------------------------------------------------
    About Personalization
*/
#about_personalization {
    padding:10px;
    line-height:140%;
    font-size:90%;
}
#about_personalization .close {
    float:right;
    cursor:pointer;
}
#about_personalization h2,
#about_personalization h4 {
    border-bottom:2px solid #444444;
    padding-bottom:0.15em;
}
#about_personalization .body {
    padding:0 25px 0 50px;
}
#about_personalization .legend img {
    vertical-align:middle;
    margin-right:5px;
}
#about_personalization .note strong {
    color:red;
}
#about_personalization .contact {
    border-top:2px solid #444444;
    font-size:90%;
}


/*------------------------------------------------------------------------------
    Browser Links
*/
#browserLinks {
    text-align:right;
    margin:5px;
}


/*------------------------------------------------------------------------------
    Flash Messages
*/
#flashMessage div.message {
    display:inline;
}
#flashMessage {
    background-color:#FFFFCC;
    border-bottom:1px solid #808080;
    border-top:1px solid #808080;
    padding:0.3em 0;
    font-size:115%;
}