/* 
Description: Reusable components stylesheet for Specifi site
Author: James Diacono (jd@thefarmdigital.com.au)
Date created: 18th of June, 2010
*/

/* buttons */
a.button,
.buttons a 
{
    display:inline-block;
    *float:left;
    text-indent:-999em;
    overflow:hidden;
    height:21px;
    width:70px;
    background-repeat:no-repeat;
    position:relative;
}

a.button.search,
.buttons a.search 
{
    background-image:url(../images/button-search.png);
}

a.button.clear,
.buttons a.clear 
{
    background-image:url(../images/button-clear.png);
}

a.button.backToSearch,
.buttons a.backToSearch 
{
    background-image:url(../images/button-back_to_search.png);
    width:113px;
}


a.button.backToSpecification,
.buttons a.backToSpecification 
{
    background-image:url(../images/button-back_to_specification.png);
    width:161px;
}

/* Radio box */
.radioBox label
{
    display:inline-block !important;
    padding:0 !important;
    margin:0 0.5em 0 0 !important;
}

/* Tables */
table
{
    width:100%;
    margin-bottom:1em;
}

table td
{
    background-color:white;
    padding:0.2em 0.6em;
}

table .alternate td
{
    background-color:#f8f7f4;
}

/* Sidebar */
.sidebar
{
    padding-top: 18px;
    padding-bottom:30px;
}

.sidebar a.pdf
{
    border-bottom: 1px solid #b3a48a;
    padding: 0.5em 0;
}

.sidebar a.pdf:hover
{
    background-color: #e7e2d9;
}

.sidebar #FormFieldDataSheetLink
{
    border-top: 1px solid #b3a48a;
}

.sidebar img.brand
{
    display:block;
    margin:0 0 1em auto;
}

.sidebar label,
.sidebar .radioBox
{
    display:block;
    padding-left:26px;
    margin-bottom:0.7em;
}

.sidebar label .title,
.sidebar .radioBox .title
{
    display:block;
    font-weight:bold;
    font-size:1.3em;
    line-height:1.2;
}

.sidebar label select 
{
    width:13em;
}

.sidebar .buttons 
{
    margin-left:26px;
    margin-bottom:1em;
    *height:21px;
}

.sidebar .backToSearch,
.sidebar .backToSpecification
{
    margin-top:1.6em;
}

/* Results */
.content.results
{
    border-left: 2px solid #947f5c;
    margin: 18px 0;
    padding-left: 8px;
}
.downloads .content
{
    border-left:0 none !important;
    margin-left:0 !important;
    padding-left:0 !important;
}
.content.results h1
{
    margin: 1em 0;
}

/* Page list */
.content.results .pageList
{
    border-top: 1px solid #947f5c;
    border-bottom: 1px solid #947f5c;
    text-align: right;
    font-weight: bold;
    margin-bottom:1.6em;
}

.content.results .pageList a
{
    text-decoration: none;
    color: #cbba9e;
}

.content.results .pageList a.current
{
    color: #947f5c;
}

.content.results .pageList a.next,
.content.results .pageList a.previous
{
    color: #947f5c;
}

.content.results .pageList input
{
    width:2em;
}

/* Quality legend */
.qualityLegend
{
    list-style: none none outside;
    float: right;
    margin:0.3em 0 0;
    padding: 0;
}
.qualityLegend li
{
    background-repeat: no-repeat;
    background-position: left center;
    padding-left: 16px;
    margin-left: 4px;
    margin-right: 4px;
    float: left;
}

/* Results table */
.content.results table td
{
    border-top: 1px solid #f1eee8;
    border-bottom: 1px solid #f1eee8;
}
.content.results table thead td
{
    border-top: 1px solid #947f5c;
    border-bottom: 1px solid #947f5c;
    background-color:transparent;
}
.content.results table a
{
    text-decoration:none;
    display:block;
    color:#3F2807;
}
.content.results table a:hover
{
    color:#3F2807;
}
.content.results table tr:hover td
{
    background-color:#f7f5f2;
}

/* Texture results */
.content.results .textures 
{
    background:white;
    padding:8px 0 8px 8px;
}
.content.results .textures>a
{
    float:left;
    width:20em;
    padding:1em 1.4em 1em;
    margin:0 8px 0 0;
    text-decoration:none;
}
.content.results .textures>a:hover
{
    background-color:#F4F4F2;
}
.content.results .textures>a img
{
    float:left;
    padding:2px;
    border:1px solid #947f5c;
    margin-right:1em;
}
.content.results .textures>a:hover img
{
    padding:0;
    border:3px solid #947f5c;
}
.content.results .textures>a .title
{
    font-weight:bold;
    text-decoration:none;
}

/* Info page (Specifications and Datasheets) */
.content.info
{
    background-color:White;
    padding:8px;
}

.content.info,
.content.info a,
.content.info a:hover
{
    color:#3F2807;
}

.content.info h1 
{
    background-color:#f8f7f4;
    border-bottom:1px solid #947f5c;
    padding-left:0.5em;
    padding-top:0.1em;
    margin-bottom:1em;
}

.content.info h2,
.content.info p
{
    margin-left:2%;
}

.content.info .datasheetNumber,
.content.info .specificationNumber 
{
    float:right;
    font-size:1.2em;
    line-height:2.1em;
    font-weight:bold;
}

.content.info .datasheetNumber span,
.content.info .specificationNumber span
{
    background-color:#4c4c4c;
    padding:0 0.4em;
    display:inline-block;
    color:White;
    font-weight:normal;
}
.content.info table
{
    margin-bottom:1.6em;
    width:98%;
    margin-left:2%;
}
.content.info table td
{
    border-top: 1px solid #947f5c;
    border-bottom: 1px solid #947f5c;
}
.content.info table td.key
{
    font-weight:bold;
    vertical-align:top;
    text-align:right;
    width:20%;
}

.content.info h2.specificationDetail a
{
    text-decoration:none;
    display:block;
    background:url(../images/button-view_datasheet.png) no-repeat right center;
}

.content.info .backToTop 
{
    display:block;
    text-align:right;
    font-weight:bold;
    margin-bottom:0.5em;
}

/* Texture detail page */
.content.info.texture .textureDetail 
{
    float:left;
    margin-right:0.8em;
}
.content.info.texture .text 
{
    float:left;
}

.content.info.texture table
{
    width:auto;
}

.content.info.texture table td.key
{
    width:12em;
}

.content.info.texture table td.value
{
    width:30em;
}

/* Generic horizontal menu */
ul.menu 
{
    border-left:1px solid #d6d6d6;
    line-height:1.9em;
    height:1.9em;
    list-style:none;
    padding:0;
    margin:1em 0;
}
ul.menu li
{
    float:left;
    border-right:1px solid #d6d6d6;
}
ul.menu li a
{
    color:#666666;
    text-transform:uppercase;
    text-decoration:none;
    display:block;
    padding:0 1em;
}
ul.menu li a:hover
{
    background-color:#f5f5f5;
}