
h2 { font-size: 18px;}
h3 { font-size: 14px;}

/*html {height: 100%!important;}*/
html {background: none!important;}

p {margin: 0 0 15px 0;}

td.grid_12 table {float: left;} 

/* .subnavi ul {margin: 0; padding: 0; border-top: 1px solid #cacaca;} 
.subnavi ul li {list-style-type: none; border-bottom: 1px solid #cacaca; padding: 8px 0; background: url(../img/small_arrow.gif) 10px 16px no-repeat; padding: 8px 0 8px 20px;}
.subnavi ul li.selected {background: #f6f6f6 url(../img/small_arrow.gif) 10px 16px no-repeat;}
.subnavi ul li.selected  a {font-weight: bold;}
.subnavi ul li a {color: #000; text-decoration: none;} */

.subnavi tr {margin: 0; padding: 0; border-top: 1px solid #cacaca;} 
.subnavi tr td {list-style-type: none; border-bottom: 1px solid #cacaca; padding: 8px 0; background: url(../img/small_arrow.gif) 10px 16px no-repeat; padding: 8px 0 8px 20px;}
.subnavi tr td.selected {background: #f6f6f6 url(../img/small_arrow.gif) 10px 16px no-repeat;}
.subnavi tr td.selected a {font-weight: bold;}
.subnavi tr td a {color: #000; text-decoration: none;} 

.breadcrumb {float: left; width: 100%; margin: 0 0 23px 0;}
.breadcrumb {margin: 0; padding: 0; background: none!important; }
.breadcrumb {list-style-type: none; float: left; background: right 6px no-repeat; padding: 0 8px 0 0; margin: 0 6px 0 0; font-size: 12px;}
.breadcrumb last {background: none;}

.pageHeader {float: left; width: 100%; border-bottom: 1px solid #cacaca; margin: 0 0 15px 0 ;}
.pageHeader h1 { font-size: 24px; color: #000; margin: 0 0 5px 0; float: left;}
.heading {float: left; width: 100%; border-bottom: 1px solid #cacaca; margin: 20px 0 0 0 ;}
.heading h2 {font-family: Calibri; font-size: 24px; color: #000; margin: 0 0 5px 0; float: left;}

.bottomheading {float: left; width: 100%; margin: 10px 0 0 0 ;}
.bottomheading h3 {font-family: Calibri; font-size: 14px; color: #000; margin: 0 0 5px 0; float: left;}

h1 {color: #000;}
#fatfooter strong  {font-weight: bold;}

#qsearchdiv {margin: 0 0 30px 0;}

span.big-title {float: right; font-size: 18px; font-weight: bold; text-transform: uppercase; margin: 40px 22px 0 0; color: #2a2a2a;}
span.date {float: right; font-size: 12px; margin: 11px 0 0 0;}
a.help {display: inline-block; background: url(../img/icon_help.png) top left no-repeat; height: 15px; width: 15px; text-indent: -9999px; margin: 0 0 0 5px;}

.productInfo {width: 100%; border-bottom: 1px solid #cacaca; clear: both; margin: 0 0 20px 0;}
.productInfo td {width: 50%; padding-bottom: 10px;}
.productInfo table th {font-weight: bold; width: 110px;} 
.productInfo table td {width: 240px; padding: 0.2em;}

.separator {border-bottom: 1px solid #cacaca; width: 700px; margin: 20px 0; clear: both;}

aside.left {float: left; width: 360px;}
aside.right {float: left; width: 260px;}

aside.left ul, aside.right ul {padding: 0; }
aside.left ul li, aside.right ul li  {background: url(../img/arrow.png) 0 5px no-repeat; padding: 0 0 0 15px; }
aside.left ul li a, aside.right ul li a {color: #000; text-decoration: none;}

.groups {background: #e5f5f5; border: 1px solid #00a09c; padding: 10px; margin: 0 0 30px 0; float: left; clear: both; width: 680px;}
.groups  span  { display: inline-block; width: 33%; } 
.groups ul  {float: left; padding: 0;}
.groups ul li  {background: url(../img/arrow.png) 0 5px no-repeat; padding: 0 0 0 15px; width: 200px; margin: 2px 0;}
.groups a {color: #585858; text-transform: uppercase; text-decoration: none; font-size: 12px;}
.groups selected a {font-weight: bold; }

.infobox {background: #e5f5f5; padding: 10px; margin: 0 0 30px 0; float: left; clear: both; width: 300px;}
.infobox a {color: #585858; font-size: 14px; }
.infobox ul li {list-style-type: disc;}

.productList {clear: both; width: 700px;}
.productList  strong {font-family: Calibri;}
.productList  tr.heading {float: none; border: 0;}
.productList  tr.heading th {padding: 6px 10px; background: url(../img/list_bg.png) top left repeat-x;  color: #292929; font-weight: bold;  font-size: 12px;} 
.productList  tr.heading th:first-child {background: url(../img/list_left.png) top left no-repeat; border: 0!important;}
.productList  tr.heading th:last-child {  background: url(../img/list_right.png) top right no-repeat;}
.productList  tr.heading  span {display: inline-block; margin: 0 5px 0 0;}
.productList  tr.heading img {cursor: pointer;}
.productList  tr.heading th {border-left: 1px solid #dedede!important;}

.productList  td {padding: 12px 10px; border-bottom: 1px solid #dedede;}
.productList  td img {padding: 3px; background: #fff; border: 3px solid #e7e7e7; }
.productList  td.img {width: 82px; padding: 0;}
.productList  td.sp, .productList  th.sp {border-left: 1px solid #dedede!important; background: #FFFFFF;}
.productList  tr.odd td {background: #f1f1f1;}
.productList h3 {font-weight: bold; font-size: 16px; font-family: Calibri; margin: 0 0 5px 0;}
.productList h3 a {color: #000; text-decoration: none;}




/*
    ColorBox Core Style:
    The following CSS is consistent between example themes and should not be altered.
*/
#colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; overflow:hidden;}
#cboxOverlay{position:fixed; width:100%; height:100%;}
#cboxMiddleLeft, #cboxBottomLeft{clear:left;}
#cboxContent{position:relative;}
#cboxLoadedContent{overflow:auto;}
#cboxTitle{margin:0;}
#cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%; height:100%;}
#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;}
.cboxPhoto{float:left; margin:auto; border:0; display:block; max-width:none;}
.cboxIframe{width:100%; height:100%; display:block; border:0;}
#colorbox, #cboxContent, #cboxLoadedContent{box-sizing:content-box;}

/* 
    User Style:
    Change the following styles to modify the appearance of ColorBox.  They are
    ordered & tabbed in a way that represents the nesting of the generated HTML.
*/
#cboxOverlay{background: #000; opacity: 0.7!important;}
#colorbox{}
    #cboxTopLeft{width:15px; height:15px; background: #fff; border-radius: 15px 0 0 0;}
    #cboxTopRight{width:15px; height:15px;  background: #fff; border-radius: 0 15px 0 0;}
    #cboxBottomLeft{width:15px; display: none; height:15px; background: #fff; border-radius: 0 0 0 15px;}
    #cboxBottomRight{width:15px; display: none; height:15px;  background: #fff; border-radius: 0 0 15px 0; }
    #cboxMiddleLeft{width:15px;  background: #fff; border-radius: 0 0 0 15px;}
    #cboxMiddleRight{width:15px;  background: #fff; border-radius: 0 0 15px 0;}
    #cboxTopCenter{height:15px;  background: #fff;}
    #cboxBottomCenter{height:15px; display: none; background: #fff;}
    #cboxContent{background:#fff; overflow:hidden;}
        .cboxIframe{background:#fff;}
        #cboxError{padding:50px; border:1px solid #ccc;}
        #cboxLoadedContent{margin-bottom:15px;}
        #cboxTitle{position:absolute; bottom:4px; left:0; text-align:center; width:100%; color:#949494;}
        #cboxCurrent{position:absolute; bottom:4px; left:58px; color:#949494; display: none!important;}
        #cboxSlideshow{position:absolute; bottom:4px; right:30px; color:#0092ef;}
        #cboxPrevious{position:absolute; bottom: 45px; left:5px; z-index: 10000; background:url(../img/previous_big.png) no-repeat 0  0; width:41px; height:70px; text-indent:-9999px;}
        #cboxNext{position:absolute; bottom: 45px;  right:5px; z-index: 10000; background:url(../img/next_big.png) no-repeat 0 0; width:41px; height:70px; text-indent:-9999px;}
        #cboxLoadingOverlay{background:url(../img/loading_background.png) no-repeat center center;}
        #cboxLoadingGraphic{background:url(../img/loading.gif) no-repeat center center;}
        #cboxClose{position:absolute; top: 0; right: 0; background:url(../img/close.png) no-repeat 0 0; width:35px; height:35px; text-indent:-9999px;}

/*
  The following fixes a problem where IE7 and IE8 replace a PNG's alpha transparency with a black fill
  when an alpha filter (opacity change) is set on the element or ancestor element.  This style is not applied to or needed in IE9.
  See: http://jacklmoore.com/notes/ie-transparency-problems/
*/
.cboxIE #cboxTopLeft,
.cboxIE #cboxTopCenter,
.cboxIE #cboxTopRight,
.cboxIE #cboxBottomLeft,
.cboxIE #cboxBottomCenter,
.cboxIE #cboxBottomRight,
.cboxIE #cboxMiddleLeft,
.cboxIE #cboxMiddleRight {
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF);
}

/*
  The following provides PNG transparency support for IE6
  Feel free to remove this and the /ie6/ directory if you have dropped IE6 support.
*/
.cboxIE6 #cboxTopLeft{background:url(../img/ie6/borderTopLeft.png);}
.cboxIE6 #cboxTopCenter{background:url(../img/ie6/borderTopCenter.png);}
.cboxIE6 #cboxTopRight{background:url(../img/ie6/borderTopRight.png);}
.cboxIE6 #cboxBottomLeft{background:url(../img/ie6/borderBottomLeft.png);}
.cboxIE6 #cboxBottomCenter{background:url(../img/ie6/borderBottomCenter.png);}
.cboxIE6 #cboxBottomRight{background:url(../img/ie6/borderBottomRight.png);}
.cboxIE6 #cboxMiddleLeft{background:url(../img/ie6/borderMiddleLeft.png);}
.cboxIE6 #cboxMiddleRight{background:url(../img/ie6/borderMiddleRight.png);}

.cboxIE6 #cboxTopLeft,
.cboxIE6 #cboxTopCenter,
.cboxIE6 #cboxTopRight,
.cboxIE6 #cboxBottomLeft,
.cboxIE6 #cboxBottomCenter,
.cboxIE6 #cboxBottomRight,
.cboxIE6 #cboxMiddleLeft,
.cboxIE6 #cboxMiddleRight {
    _behavior: expression(this.src = this.src ? this.src : this.currentStyle.backgroundImage.split('"')[1], this.style.background = "none", this.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src=" + this.src + ", sizingMethod='scale')");
}


.jcarousel-skin-tango {float: left;}
.jcarousel-skin-tango .jcarousel-container {float: left; 
}

.jcarousel-skin-tango .jcarousel-direction-rtl {
	direction: rtl;
}

.jcarousel-skin-tango .jcarousel-container-horizontal {
    width: 700px;
    padding: 20px 0;
}

.jcarousel-skin-tango .jcarousel-container-vertical {
    width: 75px;
    height: 245px;
    padding: 40px 20px;
}

.jcarousel-skin-tango .jcarousel-clip {
    overflow: hidden;
}

.jcarousel-skin-tango .jcarousel-clip-horizontal {
    width:  700px;
    height: 130px;
}

.jcarousel-skin-tango .jcarousel-clip-vertical {
    width:  75px;
    height: 245px;
}

.jcarousel-skin-tango .jcarousel-item {
    width: 195px;
    height: 130px;
	margin: 0 30px 0 10px!important;
	position: relative;
}

.jcarousel-skin-tango .jcarousel-item img {padding: 4px; background: #fff; border: 1px solid #d5d4d4;}

.jcarousel-skin-tango .jcarousel-item img.zoom {display: none;}
.jcarousel-skin-tango .jcarousel-item:hover img.zoom  {position: absolute; top: 0; left: 0; z-index: ; display: block; background: none; border:0; padding: 5px;}


.jcarousel-skin-tango .jcarousel-item-horizontal {
	margin-left: 0;
    margin-right: 10px;
}

.jcarousel-skin-tango .jcarousel-direction-rtl .jcarousel-item-horizontal {
	margin-left: 10px;
    margin-right: 0;
}

.jcarousel-skin-tango .jcarousel-item-vertical {
    margin-bottom: 10px;
}

.jcarousel-skin-tango .jcarousel-item-placeholder {
    background: #fff;
    color: #000;
}

/**
 *  Horizontal Buttons
 */
.jcarousel-skin-tango .jcarousel-next-horizontal {
    position: absolute;
    top: 65px;
    right: 5px;
    width: 18px;
    height: 43px;
    cursor: pointer;
    background: transparent url(../img/next.png) no-repeat 0 0;
}

.jcarousel-skin-tango .jcarousel-direction-rtl .jcarousel-next-horizontal {
    left: 5px;
    right: auto;
    background-image: url(../img/next.png);
}

.jcarousel-skin-tango .jcarousel-prev-horizontal {
    position: absolute;
    top: 65px;
    left: 5px;
    width: 18px;
    height: 43px;
    cursor: pointer;
    background: transparent url(../img/previous.png) no-repeat 0 0;
}

.jcarousel-skin-tango .jcarousel-direction-rtl .jcarousel-prev-horizontal {
    left: auto;
    right: 5px;
    background-image: url(../img/previous.png);
}




/**
 *  Vertical Buttons
 */
.jcarousel-skin-tango .jcarousel-next-vertical {
    position: absolute;
    bottom: 5px;
    left: 43px;
    width: 32px;
    height: 32px;
    cursor: pointer;
    background: transparent url(next-vertical.png) no-repeat 0 0;
}


.jcarousel-skin-tango .jcarousel-prev-vertical {
    position: absolute;
    top: 5px;
    left: 43px;
    width: 32px;
    height: 32px;
    cursor: pointer;
    background: transparent url(prev-vertical.png) no-repeat 0 0;
}

.jcarousel-next-disabled, .jcarousel-next-disabled-horizontal, .jcarousel-prev-disabled, .jcarousel-prev-disabled-horizontal {display: none!important;}



 

.productList td.img img {padding: 4px; background: #fff; border: 1px solid #d5d4d4;}
.productList td.img a {position: relative; display: block; margin-top: 5px;}
.productList td.img img.zoom {display: none;}
.productList td.img a:hover .zoom {position: absolute; top: 0; left: 0; z-index: ; display: block!important; background: none; border:0; padding: 5px;}


#hide #cboxPrevious, #hide #cboxNext {display: none!important;} 

/* File upload validation error */
.ruError {
    padding: 5px 5px 5px 20px;
    border: 1px solid #ef0000;
    background: #f9e8e8;
}

 .ruError .ruFileWrap {
    height: auto;
    overflow: visible !important;
    display: block;
}

.ruError .ruUploadProgress {
    margin-left: -18px;
    display: block;
}

.ruError .ruUploadFailure {
    background-position: 2px 80%;
}

.ruError .ruErrorMessage {
    display: block;
    font-variant: small-caps;
    text-transform: lowercase;
}

.ruError .ruErrorMessage {
    color: #ef0000;
    font-variant: small-caps;
    text-transform: lowercase;
    padding-bottom: 0;
}

