@charset "utf-8";

/*------ begin collapsible panels and tabs ------------------------------------------------*/

/*begin collapsible panel tabs */

.CollapsiblePanelTabs {
    /*--styles--*/
}
#CollapsiblePanelTabs1 {
    /*--styles--*/
}
.CollapsiblePanelTab {
    display: inline;
    cursor: pointer;
    color: #090;
    padding: 7px 10px 8px 10px;
    height: auto;
    border-top: 1px solid #999;
    border-right: 1px solid #999;
    border-left: 1px solid #999;
    border-top-left-radius: 7px;
    border-top-right-radius: 7px;
    overflow: hidden;
    margin-left: 1.6%;
    text-align: center;
}
.CollapsiblePanelTab.active {
    border-top: 3px solid #090;
}
#CollapsiblePanelTab1 {
    /*--styles--*/
}
#CollapsiblePanelTab2 {
    /*--styles--*/
}
#CollapsiblePanelTab3 {
    /*--styles--*/
}
#CollapsiblePanelTab4 {
    /*--styles--*/
}
#CollapsiblePanelTab5 {
    /*--styles--*/
}
#CollapsiblePanelTab6 {
    /*--styles--*/
}
#CollapsiblePanelTab7 {
    /*--styles--*/
}
#CollapsiblePanelTab8 {
    /*--styles--*/
}

/* An anchor tag can be used inside of a CollapsiblePanelTab so that the
* keyboard focus ring appears *inside* the tab instead of around the tab.
* This is an example of how to make the text within the anchor tag look
* like non-anchor (normal) text.
*/
.CollapsiblePanelTab a {
    color: #000;
    text-decoration: none;
}
/* This is an example of how to change the appearance of the panel tab that is
* currently open. The class "CollapsiblePanelOpen" is programatically added and removed
* from panels as the user clicks on the tabs within the CollapsiblePanel.
*/
.CollapsiblePanelOpen .CollapsiblePanelTab {
    text-align: center;
    background-color: #999;
}
/* This is an example of how to change the appearance of the panel tab when the
* CollapsiblePanel is closed. The "CollapsiblePanelClosed" class is programatically added and removed
* whenever the CollapsiblePanel is closed.
*/
.CollapsiblePanelClosed .CollapsiblePanelTab {
    text-align: center;
    background-color: #EFEFEF;
}
/* This is an example of how to change the appearance of the panel tab as the
* mouse hovers over it. The class "CollapsiblePanelTabHover" is programatically added
* and removed from panel tab containers as the mouse enters and exits the tab container.
*/
.CollapsiblePanelTabHover,  .CollapsiblePanelOpen .CollapsiblePanelTabHover {
    /* style */
}
/* This is an example of how to change the appearance of all the panel tabs when the
* CollapsiblePanel has focus. The "CollapsiblePanelFocused" class is programatically added and removed
* whenever the CollapsiblePanel gains or loses keyboard focus.
*/
.CollapsiblePanelFocused .CollapsiblePanelTab {
    text-align: center;
}

/*begin collapsible panel content
* never put any padding on the content area element if you plan to
* use the CollapsiblePanel's open/close animations. Placing a non-zero padding on the content
* element can cause the CollapsiblePanel to abruptly grow in height while the panels animate.
*/

.CollapsiblePanel {
    width: 100%;
    margin-top: 2px;
    margin-bottom: 5px;
    position: relative;
    border: 1px solid #999;
    border-radius: 7px;
    padding: 0;
    background-color: #fff;
}
#CollapsiblePanel1 {
    /*--styles--*/
}
.CollapsiblePanelContent {
    /*--styles--*/
}
.CollapsiblePanel #CollapsiblePanelContent_details {
    display: block;
}
.CollapsiblePanel #CollapsiblePanelContent_accessories {
    display: none;
}
.CollapsiblePanel #CollapsiblePanelContent_replacement_parts {
    display: none;
}
.CollapsiblePanel #CollapsiblePanelContent_shipping {
    display: none;
}

.CollapsiblePanel #CollapsiblePanelContent_panel5 {
    display: none;
    padding: 0 4% 0 4%;
}

.CollapsiblePanel #CollapsiblePanelContent_panel6 {
    display: none;
    padding: 0 0 0 0;
}

.CollapsiblePanel #CollapsiblePanelContent_panel7 {
    display: none;
    padding: 0 4% 0 4%;
}

.CollapsiblePanel #CollapsiblePanelContent_panel8 {
    display: none;
    padding: 0 4% 0 4%;
}

/*- begin specifications table -*/

.item_details {
    width:100%;
    border-collapse: collapse;
}
.item_details td {
    padding: 1.25% 7px 1.25% 7px;
    border-bottom: 1px solid #999;
}
/*- end specifications table -*/

.collapsiblePanelBlock {
    /* style */
}

.accessories_panelBlock_description {
    /*- style -*/
}
.accessories_panelBlock {
    float: left;
    text-align: center;
    width: 100%;
    height: auto;
    border-bottom: 1px solid #ccc;
    padding: 2% 0 2% 0;
}
@media only screen 
and (max-width : 992px) {
.replacementParts_panelBlock {
    height: auto;
}
}
@media only screen 
and (max-width : 768px) {
.replacementParts_panelBlock {
    height: auto;
}
}
@media only screen 
and (max-width : 600px) {
.replacementParts_panelBlock {
    width: 100%;
    height: auto;
}
}

.replacementParts_panelBlock_description {
    /*- style -*/
}
.replacementParts_panelBlock {
    float: left;
    text-align: center;
    width: 100%;
    height: auto;
    border-bottom: 1px solid #ccc;
    padding: 2% 0 2% 0;
}
@media only screen 
and (max-width : 992px) {
.replacementParts_panelBlock {
    height: auto;
}
}
@media only screen 
and (max-width : 768px) {
.replacementParts_panelBlock {
    height: auto;
}
}
@media only screen 
and (max-width : 600px) {
.replacementParts_panelBlock {
    width: 100%;
    height: auto;
}
}

.shipping_panel_content {
    margin: 2%;
}
.panel5_panel_content {
    margin: 2%;
}
.panel6_panel_content {
    margin: 2%;
}
.panel7_panel_content {
    margin: 2%;
}
.panel8_panel_content {
    margin: 2%;
}

.crimp_guidePanelBlock {
    float: left;
    text-align: center;
    width: 47%;
    height: auto;
    border: 1px solid #ccc;
    border-radius: 7px;
    margin: 1%;
    padding-top: 2%;
}
@media only screen 
and (max-width : 992px) {
.crimp_guidePanelBlock {
    height: 280px;
}
}
@media only screen 
and (max-width : 768px) {
.crimp_guidePanelBlock {
    min-height: 275px;
}
}
@media only screen 
and (max-width : 600px) {
.crimp_guidePanelBlock {
    height: auto;
}
}
/*-------- end collapsible panels and tabs ------------------------------------------------*/

/*-------------------------------- begin Product Change Notification ----------------------------------------*/

#pcn_link {
    /*--styles--*/
}

.product_change_notification_link {
    text-align: center;
    margin-top: 2%;
    margin-bottom: 2%;
    margin-left: auto;
    margin-right: auto;
}

#pcn {
    margin-top: -1px;
}

.pcn_heading {
    /*--styles--*/
}

.pcn_dates {
    text-align: right;
}

.pcn_info {
    text-align: left;
}

.product_change_notification_body {
    width: 90%;
    padding-top: 2%;
    margin-bottom: 2%;
    margin-left: auto;
    margin-right: auto;
}

/*-------------------------------- end Product Change Notification ----------------------------------------*/

/* ---------------------------- begin media queries ----------------------------- */
@media only screen 
and (max-width : 600px) { /* -- this may need to be adjusted depending on number of tabs and their width */

.CollapsiblePanel {
    margin: 0;
    border-radius: 0;
}
.CollapsiblePanelTab {
    display: block;
    margin: auto;
    width: 80%;
    line-height: 1.6;
}
.CollapsiblePanelTab.active {
    border-bottom: 3px solid #090;
    padding: 5px 10px 5px 10px;
}
#CollapsiblePanelTab1 {
    /* style */
}
#CollapsiblePanelTab2 {
    border-radius: 0;
}
#CollapsiblePanelTab3 {
    border-radius: 0;
}
#CollapsiblePanelTab4 {
    border-radius: 0;
}
#CollapsiblePanelTab5 {
    border-radius: 0;
}
#CollapsiblePanelTab6 {
    border-radius: 0;
}
#CollapsiblePanelTab7 {
    border-radius: 0;
}
#CollapsiblePanelTab8 {
    border-radius: 0;
}
.crimp_guidePanelBlock {
    width: 100%;
    min-height: 90px;
}

}

