/**
 * responsive.css
 *
 * @package templateSystem
 * @copyright Copyright 2003-2007 Zen Cart Development Team
 * @copyright Portions Copyright 2003 osCommerce
 * @license http://www.zen-cart.com/license/2_0.txt GNU Public License V2.0
 * Added by rbarbour (ZCAdditions.com), Responsive DIY Template Default for 1.5.x (65)
 */

/* This is used to re-size images */
img {
    max-width: 100%;
    max-height:100%;
    height: auto;
    border: 0;
}

/* Added for responsive view () */
.leftBoxContainer {
    margin-left: 0.5em;
}

/* The responsive grid is now made up of 98 columns with a total width of 980 pixels */
/* The responsive grid columns (col) followed by its # increment (ie. col150, col180 , col220) represent the columns actual width not (width:XXXpx) */
/* No reason to edit the below pixel calculations */
[class*="col"] {
    float: left;
    margin-left: 5px;
}

.col10 {
    width: 10px;
}

.col20 {
    width: 25px;
}

.col30 {
    width: 40px;
}

.col40 {
    width: 55px;
}

.col50 {
    width: 70px;
}

.col60 {
    width: 85px;
}

.col70 {
    width: 100px;
}

.col80 {
    width: 115px;
}

.col90 {
    width: 130px;
}

.col100 {
    width: 145px;
}

.col110 {
    width: 160px;
}

.col120 {
    width: 175px;
}

.col130 {
    width: 190px;
}

.col140 {
    width: 205px;
}

.col150 {
    width: 220px;
}

.col160 {
    width: 235px;
}

.col170 {
    width: 250px;
}

.col180 {
    width: 265px;
}

.col190 {
    width: 280px;
}

.col200 {
    width: 295px;
}

.col210 {
    width: 310px;
}

.col220 {
    width: 325px;
}

.col230 {
    width: 340px;
}

.col240 {
    width: 355px;
}

.col250 {
    width: 370px;
}

.col260 {
    width: 385px;
}

.col270 {
    width: 400px;
}

.col280 {
    width: 415px;
}

.col290 {
    width: 430px;
}

.col300 {
    width: 445px;
}

.col310 {
    width: 460px;
}

.col320 {
    width: 475px;
}

.col330 {
    width: 490px;
}

.col340 {
    width: 505px;
}

.col350 {
    width: 520px;
}

.col360 {
    width: 535px;
}

.col370 {
    width: 550px;
}

.col380 {
    width: 565px;
}

.col390 {
    width: 580px;
}

.col400 {
    width: 595px;
}

.col410 {
    width: 610px;
}

.col420 {
    width: 625px;
}

.col430 {
    width: 640px;
}

.col440 {
    width: 655px;
}

.col450 {
    width: 670px;
}

.col460 {
    width: 685px;
}

.col470 {
    width: 700px;
}

.col480 {
    width: 715px;
}

.col490 {
    width: 730px;
}

.col500 {
    width: 745px;
}

.col510 {
    width: 760px;
}

.col520 {
    width: 775px;
}

.col530 {
    width: 790px;
}

.col540 {
    width: 805px;
}

.col550 {
    width: 820px;
}

.col560 {
    width: 835px;
}

.col570 {
    width: 850px;
}

.col580 {
    width: 865px;
}

.col590 {
    width: 880px;
}

.col600 {
    width: 895px;
}

.col610 {
    width: 910px;
}

.col620 {
    width: 925px;
}

.col630 {
    width: 940px;
}

.col640 {
    width: 955px;
}

.col650 {
    width: 970px;
}

.col660 {
    width: 985px;
}

.col670 {
    width: 1000px;
}

.col680 {
    width: 1015px;
}

.col690 {
    width: 1030px;
}

.col700 {
    width: 1045px;
}

.col710 {
    width: 1060px;
}

.col720 {
    width: 1075px;
}

.col730 {
    width: 1090px;
}

.col740 {
    width: 1105px;
}

.col750 {
    width: 1120px;
}

.col760 {
    width: 1135px;
}

.col770 {
    width: 1150px;
}

.col780 {
    width: 1165px;
}

.col790 {
    width: 1180px;
}

.col800 {
    width: 1195px;
}

.col810 {
    width: 1210px;
}

.col820 {
    width: 1225px;
}

.col830 {
    width: 1240px;
}

.col840 {
    width: 1255px;
}

.col850 {
    width: 1270px;
}

.col860 {
    width: 1285px;
}

.col870 {
    width: 1300px;
}

.col880 {
    width: 1315px;
}

.col890 {
    width: 1330px;
}

.col900 {
    width: 1345px;
}

.col910 {
    width: 1360px;
}

.col920 {
    width: 1375px;
}

.col930 {
    width: 1390px;
}

.col940 {
    width: 1405px;
}

.col950 {
    width: 1420px;
}

.col960 {
    width: 1435px;
}

.col970 {
    width: 1450px;
}

.col980 {
    width: 1465px;
}

/* onerow-fluid uses percentage-based calculations on its child div;s (above col;s). Both will still tile down, adjusting to the width of the browser as it shrinks or grows. But onerow-fluid will continuously try to re-size, while (col) will tile down only after a certain width is reached. */
/* No reason to edit below percentage calculations */
.onerow-fluid {
    width: 100%;
    zoom: 1;
}

.onerow-fluid:before,
.onerow-fluid:after {
    display: table;
    content: "";
}

.onerow-fluid:after {
    clear: both;
}

.onerow-fluid>[class*="col"] {
    float: left;
    margin-left: 0.5208%;
}

.onerow-fluid>[class*="col"]:first-child {
    margin-left: 0%;
}

.onerow-fluid>.col10 {
    width: 0.6826%;
}

.onerow-fluid>.col20 {
    width: 1.7065%;
}

.onerow-fluid>.col30 {
    width: 2.7304%;
}

.onerow-fluid>.col40 {
    width: 3.7543%;
}

.onerow-fluid>.col50 {
    width: 4.7782%;
}

.onerow-fluid>.col60 {
    width: 5.802%;
}

.onerow-fluid>.col70 {
    width: 6.8259%;
}

.onerow-fluid>.col80 {
    width: 7.8498%;
}

.onerow-fluid>.col90 {
    width: 8.8737%;
}

.onerow-fluid>.col100 {
    width: 9.8976%;
}

.onerow-fluid>.col110 {
    width: 10.9215%;
}

.onerow-fluid>.col120 {
    width: 11.9454%;
}

.onerow-fluid>.col130 {
    width: 12.9693%;
}

.onerow-fluid>.col140 {
    width: 13.9932%;
}

.onerow-fluid>.col150 {
    width: 15.0171%;
}

.onerow-fluid>.col160 {
    width: 16.041%;
}

.onerow-fluid>.col170 {
    width: 17.0648%;
}

.onerow-fluid>.col180 {
    width: 18.0887%;
}

.onerow-fluid>.col190 {
    width: 19.1126%;
}

.onerow-fluid>.col200 {
    width: 20.1365%;
}

.onerow-fluid>.col210 {
    width: 21.1604%;
}

.onerow-fluid>.col220 {
    width: 22.1843%;
}

.onerow-fluid>.col230 {
    width: 23.2082%;
}

.onerow-fluid>.col240 {
    width: 24.2321%;
}

.onerow-fluid>.col250 {
    width: 25%;
    margin-left: 0;
}

.onerow-fluid>.col260 {
    width: 26.2799%;
}

.onerow-fluid>.col270 {
    width: 27.3038%;
}

.onerow-fluid>.col280 {
    width: 28.3276%;
}

.onerow-fluid>.col290 {
    width: 29.3515%;
}

.onerow-fluid>.col300 {
    width: 30.3754%;
}

.onerow-fluid>.col310 {
    width: 31.3993%;
}

.onerow-fluid>.col320 {
    width: 32.4232%;
}

.onerow-fluid>.col330 {
    width: 33.4471%;
}

.onerow-fluid>.col340 {
    width: 34.471%;
}

.onerow-fluid>.col350 {
    width: 35.4949%;
}

.onerow-fluid>.col360 {
    width: 36.5188%;
}

.onerow-fluid>.col370 {
    width: 37.5427%;
}

.onerow-fluid>.col380 {
    width: 38.5666%;
}

.onerow-fluid>.col390 {
    width: 39.5904%;
}

.onerow-fluid>.col400 {
    width: 40.6143%;
}

.onerow-fluid>.col410 {
    width: 41.6382%;
}

.onerow-fluid>.col420 {
    width: 42.6621%;
}

.onerow-fluid>.col430 {
    width: 43.686%;
}

.onerow-fluid>.col440 {
    width: 44.7099%;
}

.onerow-fluid>.col450 {
    width: 45.7338%;
}

.onerow-fluid>.col460 {
    width: 46.7577%;
}

.onerow-fluid>.col470 {
    width: 47.7816%;
}

.onerow-fluid>.col480 {
    width: 48.8055%;
}

.onerow-fluid>.col490 {
    width: 49.8294%;
}

.onerow-fluid>.col500 {
    width: 50.8532%;
}

.onerow-fluid>.col510 {
    width: 51.8771%;
}

.onerow-fluid>.col520 {
    width: 52.901%;
}

.onerow-fluid>.col530 {
    width: 53.9249%;
}

.onerow-fluid>.col540 {
    width: 54.9488%;
}

.onerow-fluid>.col550 {
    width: 55.9727%;
}

.onerow-fluid>.col560 {
    width: 56.9966%;
}

.onerow-fluid>.col570 {
    width: 58.0205%;
}

.onerow-fluid>.col580 {
    width: 59.0444%;
}

.onerow-fluid>.col590 {
    width: 60.0683%;
}

.onerow-fluid>.col600 {
    width: 61.0922%;
}

.onerow-fluid>.col610 {
    width: 62.116%;
}

.onerow-fluid>.col620 {
    width: 63.1399%;
}

.onerow-fluid>.col630 {
    width: 64.1638%;
}

.onerow-fluid>.col640 {
    width: 65.1877%;
}

.onerow-fluid>.col650 {
    width: 66.2116%;
}

.onerow-fluid>.col660 {
    width: 67.2355%;
}

.onerow-fluid>.col670 {
    width: 68.2594%;
}

.onerow-fluid>.col680 {
    width: 69.2833%;
}

.onerow-fluid>.col690 {
    width: 70.3072%;
}

.onerow-fluid>.col700 {
    width: 71.3311%;
}

.onerow-fluid>.col710 {
    width: 72.3549%;
}

.onerow-fluid>.col720 {
    width: 73.3788%;
}

.onerow-fluid>.col730 {
    width: 74.4027%;
}

.onerow-fluid>.col740 {
    width: 75.4266%;
}

.onerow-fluid>.col750 {
    width: 76.4505%;
}

.onerow-fluid>.col760 {
    width: 77.4744%;
}

.onerow-fluid>.col770 {
    width: 78.4983%;
}

.onerow-fluid>.col780 {
    width: 79.5222%;
}

.onerow-fluid>.col790 {
    width: 80.5461%;
}

.onerow-fluid>.col800 {
    width: 81.57%;
}

.onerow-fluid>.col810 {
    width: 82.5939%;
}

.onerow-fluid>.col820 {
    width: 83.6177%;
}

.onerow-fluid>.col830 {
    width: 84.6416%;
}

.onerow-fluid>.col840 {
    width: 85.6655%;
}

.onerow-fluid>.col850 {
    width: 86.6894%;
}

.onerow-fluid>.col860 {
    width: 87.7133%;
}

.onerow-fluid>.col870 {
    width: 88.7372%;
}

.onerow-fluid>.col880 {
    width: 89.7611%;
}

.onerow-fluid>.col890 {
    width: 90.785%;
}

.onerow-fluid>.col900 {
    width: 91.8089%;
}

.onerow-fluid>.col910 {
    width: 92.8328%;
}

.onerow-fluid>.col920 {
    width: 93.8567%;
}

.onerow-fluid>.col930 {
    width: 94.8805%;
}

.onerow-fluid>.col940 {
    width: 95.9044%;
}

.onerow-fluid>.col950 {
    width: 96.9283%;
}

.onerow-fluid>.col960 {
    width: 97.9522%;
}

.onerow-fluid>.col970 {
    width: 98.9761%;
}

.onerow-fluid>.col980 {
    width: 100%;
}

/* This is the background color added to .onerow-fluid (change at will), comment out to inherit the body background from stylesheet.css */
.onerow-fluid {
    background: transparent;
}

/* This class rule was added in 2.1 to maintain full width for mobile, tablet and nonresponsive modes */
div.onerow-fluid.fluidIsFixed {
    width: 980px !important;
    zoom: 1;
    margin: auto;
}

div#headerWrapper.fluidIsFixed,
div#navSuppWrapper.fluidIsFixed {
    width: 980px !important;
    margin: auto;
}

div#mobile-nav1.hidenav1 {
    display: none;
}

/* No Media queries should be present in this file */