/*	Less Framework 4
	http://lessframework.com
	by Joni Korpi
	License: http://creativecommons.org/licenses/MIT/	*/

/*	Resets
	------	*/
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, hr, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figure, figcaption, hgroup, menu, footer, header, nav, section, summary, time, mark, audio, video {
    margin  : 0;
    padding : 0;
    border  : 0
}

article, aside, canvas, figure, figure img, figcaption, hgroup, footer, header, nav, section, audio, video {
    display : block
}

a img {
    border : 0
}

*, :hover, :active, :focus, a:hover img, a:active img, a:focus img, input, buton, object {
    outline            : none;
    -moz-outline-style : none
}

/* removes firefox's outline border flash on links */

/*	Typography presets
	------------------	*/
.gigantic {
    font-size      : 68px; /*68*/
    line-height    : 80px;
    letter-spacing : -2px;
}

.huge, h1, huge {
    font-size   : 36px;
    line-height : 42px;
}

.large, h2, large {
    font-size   : 27px; /*30*/
    line-height : 48px;
}

.bigger, h3, bigger {
    font-size   : 36px; /*20*/
    line-height : 36px;
}

.big, h4, big {
    font-size   : 14px;
    line-height : 18px;
}

body, h5, .normal {
    font-family : Arial, Helvetica, sans-serif; /*13*/
    font-size   : 12px; /*line-height: 24px;*/
}

.small, small, h6 {
    font-size   : 9px;
    line-height : 18px;
}

p {
    color   : #444;
    margin  : 0 5px;
    padding : 0 5px
}

p.name {
    padding-bottom : 0
}

a:link {
    color           : #444;
    text-decoration : none
}

a:visited {
    color : #888
}

a:hover {
    color : #036
}

a:active {
    color : #444
}

/*		Default Layout: 992px.
		Gutters: 24px.
		Outer margins: 48px.
		Leftover space for scrollbars @1024px: 32px.
-------------------------------------------------------------------------------
cols    1     2      3      4      5      6      7      8      9      10
px      68    160    252    344    436    528    620    712    804    896   	*/
html {
    background : rgba(95, 118, 145, 1);
    background : -moz-linear-gradient(top, rgba(95, 118, 145, 1) 0%, rgba(95, 118, 145, 1) 27%, rgba(185, 191, 202, 1) 87%, rgba(185, 191, 202, 1) 100%);
    background : -webkit-gradient(left top, left bottom, color-stop(0%, rgba(95, 118, 145, 1)), color-stop(27%, rgba(95, 118, 145, 1)), color-stop(87%, rgba(185, 191, 202, 1)), color-stop(100%, rgba(185, 191, 202, 1)));
    background : -webkit-linear-gradient(top, rgba(95, 118, 145, 1) 0%, rgba(95, 118, 145, 1) 27%, rgba(185, 191, 202, 1) 87%, rgba(185, 191, 202, 1) 100%);
    background : -o-linear-gradient(top, rgba(95, 118, 145, 1) 0%, rgba(95, 118, 145, 1) 27%, rgba(185, 191, 202, 1) 87%, rgba(185, 191, 202, 1) 100%);
    background : -ms-linear-gradient(top, rgba(95, 118, 145, 1) 0%, rgba(95, 118, 145, 1) 27%, rgba(185, 191, 202, 1) 87%, rgba(185, 191, 202, 1) 100%);
    background : linear-gradient(to bottom, rgba(95, 118, 145, 1) 0%, rgba(95, 118, 145, 1) 27%, rgba(185, 191, 202, 1) 87%, rgba(185, 191, 202, 1) 100%);
}

body {
    width      : 940px;
    color      : #fff;
    position   : relative;
    overflow   : scroll;
    overflow-x : hidden;
    width      : 100%;
}

.ind {
    padding    : 0 0 60px;
    background: #fff;
}

#home .ind {
    padding-top : 60px;
}

.wrapper {
    max-width : 940px;
    margin    : 0 auto;
    padding   : 0 15px;
}

.show-info {
    cursor : pointer;
}

.banner {
    background-position : center;
    background-size     : contain;
    background-repeat   : no-repeat;
}

/* ------ MOBILE MENU ------*/
.handle {
    display : none;
}

.slide-menu {
    display : none;
}

/* ------ Header ------	*/
#header {
    height     : 143px;
    position   : relative;
    z-index    : 1000;
    background : rgba(0, 0, 0, 1);
    background : -moz-linear-gradient(top, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 1) 30%, rgba(70, 70, 70, 1) 75%, rgba(255, 255, 255, 1) 76%, rgba(255, 255, 255, 1) 100%);
    background : -webkit-gradient(left top, left bottom, color-stop(0%, rgba(0, 0, 0, 1)), color-stop(30%, rgba(0, 0, 0, 1)), color-stop(75%, rgba(70, 70, 70, 1)), color-stop(76%, rgba(255, 255, 255, 1)), color-stop(100%, rgba(255, 255, 255, 1)));
    background : -webkit-linear-gradient(top, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 1) 30%, rgba(70, 70, 70, 1) 75%, rgba(255, 255, 255, 1) 76%, rgba(255, 255, 255, 1) 100%);
    background : -o-linear-gradient(top, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 1) 30%, rgba(70, 70, 70, 1) 75%, rgba(255, 255, 255, 1) 76%, rgba(255, 255, 255, 1) 100%);
    background : -ms-linear-gradient(top, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 1) 30%, rgba(70, 70, 70, 1) 75%, rgba(255, 255, 255, 1) 76%, rgba(255, 255, 255, 1) 100%);
    background : linear-gradient(to bottom, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 1) 30%, rgba(70, 70, 70, 1) 75%, rgba(255, 255, 255, 1) 76%, rgba(255, 255, 255, 1) 100%);
}

#header h1#logo a {
    display     : block;
    width       : 500px;
    height      : 108px;
    background  : url(img/top_logo.gif) no-repeat 0px 0px;
    text-indent : -9999px
}

#header h1#logo a:hover {
    background-position : 0px -108px
}

.search-contact-container {
    position : relative;
}

form#search {
    background                         : #617892;
    width                              : 211px;
    height                             : 33px;
    border-bottom-right-radius         : 8px;
    border-bottom-left-radius          : 8px;
    -webkit-border-bottom-right-radius : 8px;
    -webkit-border-bottom-left-radius  : 8px;
    -moz-border-radius-bottomright     : 8px;
    -moz-border-radius-bottomleft      : 8px;
    -khtml-border-radius-bottomleft    : 8px;
    -khtml-border-radius-bottomright   : 8px;
    text-align                         : center;
    padding                            : 8px 0 2px
}

.ie form#search {
    background-position : top center;
    background-image    : url(img/ie/top_searchbg.gif);
    background-repeat   : no-repeat;
}

#ehundred {
    position : absolute;
    height   : 39px;
    width    : 213px;
    top      : 60px;
    right    : 0px;
    display  : block;
    border   : none;
}

#search input {
    background : #FFF url(img/search_text_bg.gif) top right no-repeat;
    width      : 145px;
    border     : 1px solid #666;
    height     : 18px;
    padding    : 0 20px 0 3px;
    color      : #999
}

#top-nav {
    height : 40px;
    margin : 0 8px
}

#top-nav li {
    position : relative;
}

#top-nav a {
    display : block
}

#top-nav a.tab {
    color       : #787878;
    text-align  : center;
    font-size   : 14px;
    line-height : 28px;
    margin      : 3px 3px 0;
    padding     : 2px 20px 2px
}

#top-nav a.tab:hover, #top-nav a.tab.hover, #top-nav li.current a.tab {
    text-decoration                 : none;
    background                      : #7a92ac;
    border-top-right-radius         : 4px;
    border-top-left-radius          : 4px;
    -webkit-border-top-right-radius : 4px;
    -webkit-border-top-left-radius  : 4px;
    -moz-border-radius-topright     : 4px;
    -moz-border-radius-topleft      : 4px;
    -khtml-border-radius-topleft    : 4px;
    -khtml-border-radius-topright   : 4px;
    color                           : #036;
}

#top-nav li.current a.tab {
    color      : #fff;
    background : #434343
}

#top-nav li ul.sub {
    position                           : absolute;
    top                                : -999em;
    /* width: 230px; */
    z-index                            : 999;
    background                         : #7a92ac;
    border-top-right-radius            : 8px;
    border-bottom-right-radius         : 8px;
    border-bottom-left-radius          : 8px;
    -webkit-border-top-right-radius    : 8px;
    -webkit-border-bottom-right-radius : 8px;
    -webkit-border-bottom-left-radius  : 8px;
    -moz-border-radius-topright        : 8px;
    -moz-border-radius-bottomright     : 8px;
    -moz-border-radius-bottomleft      : 8px;
    -khtml-border-radius-topright      : 10px;
    -khtml-border-radius-bottomleft    : 10px;
    -khtml-border-radius-bottomright   : 10px;
}

#top-nav li:hover ul.sub {
    top      : 35px;
    left     : 3px;
    padding  : 0;
    display  : block;
    overflow : auto;
}

#top-nav li ul.sub li {
    width : 100%
}

#top-nav li ul.sub li a {
    color       : #fff;
    font-size   : 12px;
    text-align  : left;
    height      : auto;
    line-height : normal;
    padding     : 9px 7px 0 20px;
    display     : block;
    white-space : nowrap;
}

#top-nav li:hover ul.sub li a:hover {
    text-decoration : underline
}

/*ul#top-nav li#home {
	width: 105px
}
ul#top-nav li#fsi-products {
	width: 145px
}
ul#top-nav li#product-lines {
	width: 150px
}
ul#top-nav li#fsi-nsn-list {
	width: 145px
}
ul#top-nav li#resources {
	width: 130px
}
ul#top-nav li#distributors {
	width: 135px
}
ul#top-nav li#contact {
	width: 110px
}*/

/*	Home
	----	*/
h2.title {
    color       : #fff;
    margin      : 15px 5px;
    text-align  : left
}

h1.title {
    color       : #fff;
    text-shadow : 0 1px 1px rgba(0, 0, 0, .5);
    margin      : 15px 5px;
    text-align  : left
}

.ind p {
    font        : 1.2em Arial, Helvetica, sans-serif;
    margin      : 15px 0px 10px 0px;
    line-height : 1.2em;
}

#fsi-products .ind > div p {
    font        : 1.2em Arial, Helvetica, sans-serif;
    margin      : 0px 0px 10px 0px;
    line-height : 20px;
}

#slideshow {
    position : relative;
    margin   : 0 0 28px
}

.slick-slide img {
    width     : 100%;
    max-width : 950px;
    margin    : 0 auto;
}

.slick-dots li button:before {
    font-size: 15px !important;
}

#callouts {
    list-style-type : none;
    width           : 100%;
    height          : auto;
    display         : flex;
    flex-wrap       : wrap;
    border-bottom   : 1px solid #7b8da3;
}

#callouts h4 {
    color     : #333;
    font-size : 1.5em;
}

#callouts li {
    flex-basis : 50%;
}

#callouts li img {
    width     : 100%;
    max-width : 410px;
}

ul#partners li {
    width    : 195px;
    overflow : hidden
}

ul#partners li.last {
    width : 172px
}

ul#partners li#contact_us {
    width     : 350px;
    font-size : 17px;
    padding   : 12px 0 0
}

ul#partners li#contact_us h4 {
    font-size   : 16px;
    font-weight : 400
}

ul#partners li#contact_us p.small {
    color       : #fff;
    font-family : Verdana, Helvetica, sans-serif;
    line-height : 14px;
    margin      : 3px 0 0;
    padding     : 0
}

ul#partners li#contact_us p.small a {
    color : #fff
}

li#contact_us a{
    color: #fff;
}
li#contact_us p{
    margin: 3px 0;
    padding: 0;
    color: #fff;
    font-size: 15px;
}


/*	FSI Products
	------------	*/
#fsi-products .ind {
    padding : 30px 0 60px;
}

h2.left {
    height : auto;
    margin : 20px 0 19px !important
}

h3.product_title {
    margin : 15px 0
}

#fsi-products img.header_img {
    border-top-right-radius         : 8px;
    border-top-left-radius          : 8px;
    -webkit-border-top-right-radius : 8px;
    -webkit-border-top-left-radius  : 8px;
    -moz-border-radius-topright     : 8px;
    -moz-border-radius-topleft      : 8px;
    -khtml-border-radius-topleft    : 8px;
    -khtml-border-radius-topright   : 8px
}

.product_list {
    background : #fff;
}

.products-section {
    color  : #333;
    margin : 20px 0;
}

.product_list .containit {
    border     : 1px solid #b6c1ce;
    position   : relative;
    list-style : none;
}

.product_list .hidden-content {
    display         : flex;
    flex-wrap       : wrap;
    justify-content : space-around;
    margin-top      : 30px;
}

.product_list .li {
    width      : 210px;
    height     : 120px;
    text-align : center;
    padding    : 5px 5px 15px
}

.product_list .containit div.title h4 {
    color      : #617892;
    background : #eee;
    font-size  : 20px;
    padding    : 20px
}

.product_list .containit div.title h4:after, .other-tools-wrap h4.show-info:after, #fsi-nsn-list .content h4.show-info:after {
    content         : '';
    background      : url(img/blue-arrow.png) no-repeat;
    background-size : 100%;
    position        : absolute;
    right           : 15px;
    margin-top      : 1px;
    width           : 35px;
    height          : 20px;
}

.product_list .containit.pbam div.title h4:after {
    display : none;
}

.product_list .li a img {
    box-shadow         : 0 0 5px rgba(255, 255, 255, 1);
    -webkit-box-shadow : 0 0 5px rgba(255, 255, 255, 1);
    -moz-box-shadow    : 0 0 5px rgba(255, 255, 255, 1)
}

.product_list .li a:hover img {
    border-radius         : 5px;
    -webkit-border-radius : 5px;
    -moz-border-radius    : 5px;
    -khtml-border-radius  : 5px;
    box-shadow            : 0 0 5px rgba(0, 0, 0, 1);
    -webkit-box-shadow    : 0 0 5px rgba(0, 0, 0, 1);
    -moz-box-shadow       : 0 0 5px rgba(0, 0, 0, 1)
}

.product_list .containit a {
    text-align  : center;
    color       : #777;
    font-family : Arial, Helvetica, sans-serif;
    font-size   : 11px;
    font-weight : bold;
}

.rivet-line-wrapper {
    display   : flex;
    flex-wrap : wrap;
}

/*	FSI Products Detail
	-------------------	*/
.product-info {
    position : relative;
    margin: 55px 0;
}

.product-details {
    padding    : 30px 0;
    margin-top : 30px;
    background : #fff;
}

.product-details h1.huge.title {
    color       : #333;
    text-shadow : none;
    height      : auto;
}

.product-image {
    width      : 40%;
    height     : auto;
    min-height : 150px;
    min-width: 200px;
    display    : inline-block;
    margin     : 0 auto;
    background: #EAE8EC;
    text-align: center;
    vertical-align: middle;
    position: relative;
}
.product-overview {
    position  : absolute;
    top       : 50%;
    transform : translateY(-50%);
    display   : inline-block;
    width     : 45%;
    color     : #333;
}

.bullet-points {
    padding : 0 15px;
}

.more-information {
    margin : 30px 0;
}

.other-tools-wrap {
    border : 1px solid #b6c1ce;
}

.other-tools-wrap h4.show-info, h4.kitsTitle {
    position   : relative;
    color      : #617892;
    background : #fff;
    font-size  : 20px;
    padding    : 20px 20px;
}

.other-tools-wrap .hidden-content {
    display         : flex;
    flex-wrap       : wrap;
    justify-content : space-around;
    margin-top      : 30px;
}

.product-wrapper {
    width      : 95px;
    margin     : 30px 50px;
    text-align : center;
}

img.pic {
    width : 100%;
}

/*	Product Lines
	-------------	*/
#product-lines .ind {
    padding : 30px 0;
}

h3.download-catalog {
    color     : #333;
    font-size : 1.7em;
}

p.intro {
    margin : 15px 0;
}

#product-lines .col.left {
    width           : 100%;
    background      : #e6e7e9;
    list-style-type : none;
    overflow        : hidden;
}

#product-lines .col.left li {
    height : 77px
}

#product-lines .col.left li a {
    display : inline-block;
    border  : 1px solid #6f839b;
}

#product-lines .col.left li a:hover, #product-lines .col.left li a.on {
    background-position : 0 -75px !important
}

.pdf_company_cntr {
    margin-left  : 20px;
    margin-right : 20px
}

.pdf_company_cntr ul {
    display         : flex;
    flex-wrap       : wrap;

}

li.pdf-container {
    position   : relative;
    border     : 1px solid #5f7691;
    background : #e6e7e9;
}

.product-line-link:after {
    content         : '';
    background      : url(img/blue-arrow.png) no-repeat;
    background-size : 100%;
    position        : absolute;
    right           : 15px;
    margin-top      : 32px;
    width           : 35px;
    height          : 20px;
}

.pdf_header {
    border-bottom : 1px solid #ccc;
    padding       : 20px 0 0
}

.pdf_heading {
    font-size   : 30px;
    color       : #062947;
    line-height : 40px
}

.pdf_cntr {
    box-sizing: border-box;
    width  : 150px;
    margin : 0.5rem;
    height     : 115px;

}

.pdf_size {
    font-size  : 11px;
    color      : #999;
    background : url(img/pdf_white.gif) no-repeat top center;
    height     : 15px;
    padding    : 20px 0 0;
    margin     : 45px 0 0 10px;
    width      : 50px;
    text-align : center
}

.pdf_link {
    padding-top : 4px;
    display     : block
}

/*	FSI NSN List
	------------	*/
#fsi-nsn-list .ind {
    width  : calc(100% - 8px);
    margin : 0 auto;
}

.content {
    background : #fff;
    color      : #333;
    padding    : 30px 10px 0;
}

.price_heading h4.show-info {
    position   : relative;
    font-size  : 16px;
    padding    : 20px;
    background : #eee;
    color      : #617892;
}

.contact-for-more a {
    font-size : 1.2em;
}

.price {
    color        : #333;
    font-family  : Arial, Helvetica, sans-serif;
    font-size    : 12px;
    font-weight  : 700;
    line-height  : 12px;
    border-color : #eee;
    border-style : solid;
    border-width : thin;
    padding      : 5px 10px
}

.price_heading .hidden-info {
    display : block;
}

.nsn_list {
    display         : flex;
    flex-wrap       : wrap;
    justify-content : space-between;
    padding         : 20px;
    border          : 1px solid #b6c1ce;
}

.price_heading {
    color          : #121212;
    font-size      : 14px;
    font-weight    : 700;
    text-transform : uppercase;
    border         : 1px solid #b6c1ce;
}

.nsn-info-container {
    max-width : 450px;
}

.nsn-info-container div {
    font-weight : lighter;
}

.nsn-info-container div:first-child, .nsn-info-container div:nth-child(2) {
    margin-right  : 30px;
    margin-bottom : 15px;
    display       : inline-block;
    font-weight   : bold;
}

.contact-for-more {
    margin : 30px 0;
}

.contact-for-more h4 {
    margin-bottom : 15px;
}

/*	Resources
	---------	*/
#resources .ind {
    padding : 30px 0;
}

#resources #special_header .big {
    height  : 31px;
    padding : 10px 7px 5px 30px
}

#resources #resources-nav li {
    height : 26px;
    margin : 0 5px
}

#resources #resources-nav li a {
    color   : #768aa1;
    display : block;
    height  : 26px;
    padding : 5px 25px
}

#resources #resources-nav li a:hover, #resources #resources-nav li a.current {
    background                      : #fff;
    color                           : #036;
    border-top-right-radius         : 4px;
    border-top-left-radius          : 4px;
    -webkit-border-top-right-radius : 4px;
    -webkit-border-top-left-radius  : 4px;
    -moz-border-radius-topright     : 4px;
    -moz-border-radius-topleft      : 4px;
    -khtml-border-radius-topleft    : 4px;
    -khtml-border-radius-topright   : 4px
}

#resources-list {
    background                         : #fff;
    color                              : #ccc;
    border-bottom-right-radius         : 8px;
    border-bottom-left-radius          : 8px;
    -webkit-border-bottom-right-radius : 8px;
    -webkit-border-bottom-left-radius  : 8px;
    -moz-border-radius-bottomright     : 8px;
    -moz-border-radius-bottomleft      : 8px;
    -khtml-border-radius-bottomleft    : 8px;
    -khtml-border-radius-bottomright   : 8px;
    padding                            : 30px 0;
}

#resources-list li {
    margin : 0 0 20px
}

#resources .col.left {
    width                             : 235px;
    background                        : #e6e7e9;
    list-style-type                   : none;
    border-bottom-left-radius         : 14px;
    -webkit-border-bottom-left-radius : 14px;
    -moz-border-radius-bottomleft     : 14px;
    -khtml-border-radius-bottomleft   : 14px;
    overflow                          : hidden;
}

#resources .col.left li {
    height : 77px
}

#resources .col.left li a {
    height      : 75px;
    display     : block;
    font-size   : 16px;
    text-align  : center;
    line-height : 77px;
}

#resources .col.left li a:hover, #resources .col.left li a.on {
    background : #FFF;
}

#resources .col.right {
    background                         : #fff;
    color                              : #777;
    overflow                           : hidden;
    border-bottom-right-radius         : 14px;
    -webkit-border-bottom-right-radius : 14px;
    -moz-border-radius-bottomright     : 14px;
    -khtml-border-radius-bottomright   : 14px;
}

/*	Distributors
	------------	*/
#distributors .ind {
    padding : 60px 0;
}

#distributors-list {
    border     : 1px solid #b6c1ce;
    background : #fff;
    border     : 1px solid #b6c1ce;
}

#distributors-list ul {
    list-style : none;
    width      : 100%;
    margin     : 0 40px 0 0;
}

#distributors-list li {
    color       : #55555;
    font-size   : 11px;
    line-height : 14px;
    margin      : 5px 0 38px
}

#distributors-list li p {
    font-size   : 1.2em;
    line-height : 1.3em;
    padding     : 0 20px;
    margin      : 30px 0;
}

#distributors-list li.title {
    position      : relative;
    background    : #f3f3f3;
    color         : #121212;
    font-size     : 19px;
    font-weight   : 700;
    line-height   : 20px;
    margin-top    : 0;
    margin-bottom : 0;
    padding       : 20px;
    border-bottom : 1px solid #b6c1ce;
    color         : #617892;
}

#distributors-list li.title:after {
    content         : '';
    background      : url(img/blue-arrow.png) no-repeat;
    background-size : 100%;
    position        : absolute;
    right           : 15px;
    margin-top      : 1px;
    width           : 35px;
    height          : 20px;
}

.wrapper .content h3 {
    font  : 700 22px Arial, Helvetica, sans-serif;
    color : #062947;
    width : 230px;
}

/* --------	Contact -------	*/
#contact .content {
    display         : flex;
    flex-wrap       : wrap;
    justify-content : space-between;
    padding         : 24px 0
}

.fancybox-skin {
    height : 600px !important;
}

.fancybox-outer {
    height : 100%;
}

.fancybox-inner {
    width  : auto !important;
    height : 100% !important;
}
.fancybox-slide--iframe .fancybox-content {
    width  : 760px;
    height : 500px;
    max-width  : 80%;
    max-height : 80%;
    margin: 0;
}
#contact .content .left {
    padding : 10px;
}

#contact .content .left .ind {
    padding : 10px
}

#contact .content ul.nav li {
    width : 190px;
}

#contact .content ul.nav li p {
    margin        : 0;
    padding       : 0;
    margin-left   : 5px;
    margin-right  : 5px;
    padding       : 5px;
    margin-top    : 15px;
    margin-bottom : 15px;
    font-size     : 1.2em;
    line-height   : 1.3em;
}

#contact .content .name {
    color     : #55555;
    font-size : 1.1em
}

#contact .content .title {
    color     : #036;
    font-size : 1em
}

#contact .content p {
    color        : #444;
    font-family  : Arial, Helvetica, sans-serif;
    font-size    : 1.2em;
    margin-left  : 5px;
    margin-right : 5px;
    padding      : 5px;
    border       : 0;
}

#contact hr {
    border-bottom : 1px solid #ccc;
    padding       : 20px 0 0;
    margin        : 0 0 10px
}

/*	Events
	------	*/
#events #special_header {
    height : 51px
}

#event-list {
    background            : #fff;
    border-radius         : 8px;
    -webkit-border-radius : 8px;
    -moz-border-radius    : 8px;
    -khtml-border-radius  : 10px;
    color                 : #6e6e6e
}

#event-list li {
    padding : 20px
}

.content_title {
    font-size      : 20px;
    color          : #6e8eaf;
    text-transform : uppercase;
    line-height    : 20px
}

.date {
    color          : #2f5582;
    text-transform : uppercase;
    font-size      : 12px;
    margin-bottom  : 10px;
    font-weight    : 400
}

#events p.left {
    width  : 440px;
    color  : #666;
    margin : 0 0 10px 40px
}

#events .readmore {
    background  : url(img/btn_readmore.gif) no-repeat;
    width       : 80px;
    height      : 16px;
    text-indent : -9999px;
    margin      : 10px
}

/*	Events
	------	*/
#service-for {
    list-style-type : none;
    font-weight     : 700
}

#service-for li {
    height : 16px
}

#tool-repair p {
    margin  : 0;
    padding : 0
}

/*	Search
	------	*/
#search .content {
    padding : 24px 30px
}
#search h2.left {
    color: #627f9d;
}
#search h3 {
    color                           : #768aa2;
    line-height                     : 20px;
    font-size                       : 20px;
    padding                         : 15px 7px 11px 30px;
    height                          : 20px
}

#search .results li {
    float      : left;
    width      : 135px;
    height     : 120px;
    text-align : center;
    padding    : 5px 5px 15px
}

#search .results li.title {
    position   : absolute;
    left       : 20px;
    top        : -12px;
    text-align : left;
    width      : auto;
    height     : auto;
    margin     : 0
}

.product_list ul li.title h4 {
    color      : #617892;
    background : #fff;
    font-size  : 20px;
    padding    : 0 20px
}

#search .results li a img {
    box-shadow         : 0 0 5px rgba(255, 255, 255, 1);
    -webkit-box-shadow : 0 0 5px rgba(255, 255, 255, 1);
    -moz-box-shadow    : 0 0 5px rgba(255, 255, 255, 1)
}

#search .results li a:hover img {
    border-radius         : 5px;
    -webkit-border-radius : 5px;
    -moz-border-radius    : 5px;
    -khtml-border-radius  : 5px;
    box-shadow            : 0 0 5px rgba(0, 0, 0, 1);
    -webkit-box-shadow    : 0 0 5px rgba(0, 0, 0, 1);
    -moz-box-shadow       : 0 0 5px rgba(0, 0, 0, 1)
}

/*	Sitemap
	-------	*/

/*
#sitemap .content{padding:24px}#sitemap .content ul{width:200px;border-left:1px solid;list-style-type:none;position:relative;margin:0 0 20px;padding:35px 0 0 10px;min-height:140px}#sitemap .content ul li{margin:5px 0}#sitemap .content ul li.title{background:#fff;position:absolute;top:0;left:-10px;margin:0}
*/

#sitemap .content {
    padding               : 24px;
    border-radius         : 8px;
    -webkit-border-radius : 8px;
    -moz-border-radius    : 8px;
    -khtml-border-radius  : 8px
}

#sitemap .content ul {
    width           : 200px;
    border-left     : 1px solid #ccc;
    list-style-type : none;
    position        : relative;
    min-height      : 180px;
    margin          : 0 0 20px;
    padding         : 25px 0 0
}

#sitemap .content ul li {
    border-bottom : 1px solid #ccc;
    position      : relative;
    height        : 12px;
    margin        : 10px 0
}

#sitemap .content ul li a {
    position     : absolute;
    top          : 5px;
    background   : #fff;
    left         : 10px;
    display      : block;
    width        : 100%;
    padding-left : 5px
}

#sitemap .content ul li.title {
    background : #fff;
    position   : absolute;
    top        : 0;
    left       : -10px;
    border     : none;
    margin     : 0
}

#sitemap .content ul li.title a {
    position : relative;
    top      : -5px
}

/*	Footer
	------	*/
#partners {
    width   : 100%;
    display : inline-block;
    margin  : 30px 0;
}

#bottom-nav {
    margin         : 50px 0 5px;
    padding-bottom : 50px;
}

#bottom-nav li {
    margin-left : 20px;
    position    : relative;
}

#bottom-nav li#fsi-products {
    width : 180px
}

#bottom-nav li#resources {
    width : 120px
}

#bottom-nav li#contact {
    width : 95px
}

#bottom-nav li#events {
    width : 105px
}

#bottom-nav li ul {
    position : absolute;
    width    : 200px;
    left     : 0px;
}

#bottom-nav li a {
    color : #FFF;
}

#bottom-nav li li {
    margin-left : 3px;
}

#bottom-nav li li a {
    font-size       : 10px;
    line-height     : 18px;
    display         : block;
    text-decoration : none;
    color           : #FFF;
    font-weight     : 400;
    height          : 18px;
    overflow        : hidden;
    margin          : 0;
}

#bottom-nav li#product-lines, #bottom-nav li#fsi-nsn-list, #bottom-nav li#distributors {
    width : 115px
}

/*	NK Footer
	---------	*/
#footer-nk {
    position : relative;
    height   : 98px;
    width    : 100%
}

#footer-nk .block {
    overflow : auto;
    width    : 100%;
    padding  : 10px 0
}

#footer-nk #nk {
    color          : #ccc;
    text-shadow    : #999 1px 1px 0;
    line-height    : 18px;
    vertical-align : top;
    width          : 100px;
    text-align     : center;
    margin         : 0 auto
}

#footer-nk #nk a#nk-logo {
    display     : block;
    width       : 80px;
    height      : 0;
    background  : url(http://nikkelkrome.com/_images/logos/nk-footer-logo.png) no-repeat 0 0;
    padding-top : 57px;
    overflow    : hidden;
    margin-top  : 3px;
    text-align  : center
}

#footer-nk #nk a#nk-logo:hover {
    background : url(http://nikkelkrome.com/_images/logos/nk-footer-logo.png) no-repeat 0 -57px
}

#footer-nk .block #copyright {
    color : #999;
    float : right
}

/*		Tablet Layout: 768px.
		Gutters: 24px.
		Outer margins: 28px.
		Inherits styles from: Default Layout.
-----------------------------------------------------------------
cols    1     2      3      4      5      6      7      8
px      68    160    252    344    436    528    620    712

@media only screen and (min-width: 768px) and (max-width: 991px) {

	body {
		width: 712px;
		padding: 48px 28px 60px;
	}
} 		Mobile Layout: 320px.
		Gutters: 24px.
		Outer margins: 34px.
		Inherits styles from: Default Layout.
---------------------------------------------
cols    1     2      3
px      68    160    252

@media only screen and (max-width: 767px) {

	body {
		width: 252px;
		padding: 48px 34px 60px;
	}

} 		Wide Mobile Layout: 480px.
		Gutters: 24px.
		Outer margins: 22px.
		Inherits styles from: Default Layout, Mobile Layout.
------------------------------------------------------------
cols    1     2      3      4      5
px      68    160    252    344    436

@media only screen and (min-width: 480px) and (max-width: 767px) {

	body {
		width: 436px;
		padding: 36px 22px 48px;
	}

} 	Rules
	-----	*/
.border9 {
    border-radius         : 9px;
    -webkit-border-radius : 9px;
    -moz-border-radius    : 9px;
    -khtml-border-radius  : 9px;
}

.center {
    margin : 0 auto
}

.nav li {
    float           : left;
    list-style-type : none
}

.left {
    float : left
}

.right {
    float : right
}

.clear {
    clear : both
}

/* new clearfix */
.clearfix:after {
    visibility : hidden;
    display    : block;
    font-size  : 0;
    content    : " ";
    clear      : both;
    height     : 0;
}

* html .clearfix {
    zoom : 1;
}

/* IE6 */
*:first-child + html .clearfix {
    zoom : 1;
}

/* IE7 */
.hide {
    display : none
}

/* -- CONTENT
  __________________________________________________*/
#content .title {
    color        : #ffffff;
    font-family  : Arial, Helvetica, sans-serif;
    font-size    : 22px;
    font-weight  : bold;
    font-style   : italic;
    padding-left : 10px;
    border       : 0;
    display      : block;
}

#content .numbers {
    color         : #003366;
    font-family   : Arial, Helvetica, sans-serif;
    font-size     : 12px;
    font-weight   : bold;
    margin-left   : 5px;
    margin-bottom : 12px;
    border        : 0;
    line-height   : 1.6em;
    display       : block;
}

#content .bullets {
    color         : #336699;
    font-family   : Arial, Helvetica, sans-serif;
    font-size     : 12px;
    font-weight   : bold;
    margin-bottom : 12px;
    padding       : 0 15px;
}

#content .bullets ul:first-child {
    padding-left : 40px;
}

#content .bullets ul:first-child li {
    color           : #336699;
    font            : 12px Arial, Helvetica, sans-serif;
    font-weight     : 700;
    margin          : 0px;
    padding         : 0px;
    background      : none;
    list-style-type : disc;
}

#content .bullets ul {
    color       : #000;
    font        : 11px Arial, Helvetica, sans-serif;
    font-weight : normal;
}

#content .bullets ul li {
    background-image    : url(/_images/bullet_spec.gif);
    background-repeat   : no-repeat;
    background-position : 0 .1em;
    padding-left        : 1.2em;
    margin              : .5em 0;
    margin-right        : .5em;
    list-style          : none;
}

#content .bullets p {
    color       : #000000;
    font-family : Arial, Helvetica, sans-serif;
    font-size   : 11px;
    font-weight : none;
    padding     : 15px 5px 5px 5px;
}

#content .specs {
    color       : #000000;
    font-family : Arial, Helvetica, sans-serif;
    font-size   : 11px;
    font-weight : none;
    padding     : 5px;
}

#content .kitsTitle {
    color       : #777777;
    font-family : Arial, Helvetica, sans-serif;
    font-size   : 16px;
    font-weight : bold;
    margin-left : 5px;
    border      : 0;
}

#content .kits {
    color       : #222222;
    font-family : Arial, Helvetica, sans-serif;
    font-size   : 11px;
    font-weight : bold;
    margin-left : 5px;
    border      : 0;
    align       : center;
}

#content .tools {
    color       : #222222;
    font-family : Arial, Helvetica, sans-serif;
    font-size   : 11px;
    font-weight : bold;
    margin-left : -3px;
    padding     : 3px;
    border      : 0;
}

#content .links ul {
    color       : #222222;
    font-family : Arial, Helvetica, sans-serif;
    font-size   : 11px;
    font-weight : bold;
    margin-left : 10px;
    border      : 0;
    line-height : 16px;
}

#content .links li {
    background-image    : url(img/bullet_spec.gif);
    background-repeat   : no-repeat;
    background-position : 0 .1em;
    padding-left        : 1.2em;
    margin              : .5em 0;
    margin-right        : .5em;
}

#content .sats {
    color       : #222222;
    font-family : Arial, Helvetica, sans-serif;
    font-size   : 11px;
    font-weight : bold;
    margin-left : 5px;
    border      : 0;
    line-height : 16px;
}

#content .specs ul {
    list-style-type : none;
    padding         : 0;
    margin          : 0;
    margin-left     : .2em;
}

#content .specs li {
    background-image    : url(img/bullet_spec.gif);
    background-repeat   : no-repeat;
    background-position : 0 .1em;
    padding-left        : 1.2em;
    margin              : .5em 0;
    margin-right        : .5em;
}

#content img.pic {
    padding            : 5px;
    box-shadow         : 0 0 5px rgba(255, 255, 255, 1);
    -webkit-box-shadow : 0 0 5px rgba(255, 255, 255, 1);
    -moz-box-shadow    : 0 0 5px rgba(255, 255, 255, 1);
}

#content a:hover img.pic {
    border-radius      : 5px;
    box-shadow         : 0 0 5px rgba(0, 0, 0, 1);
    -webkit-box-shadow : 0 0 5px rgba(0, 0, 0, 1);
    -moz-box-shadow    : 0 0 5px rgba(0, 0, 0, 1);
}

#content a.pic:active img.pic {

    /*background: #ffffff;
				border: 1px solid #ffffff;*/
}

#content a.pic:hover img.pic {

    /*background: #ffffff;
					border: 1px solid #336699;*/
}

/*  ---------  End CONTENT --------
   ------------------------------- */

/* CONTACT ################################# */

#home div.float {
    padding       : 5px;
    float         : left;
    width         : 200px;
    margin-bottom : 10px;
}

#home div.float a {
    text-align  : center;
    color       : #777777;
    font-family : Arial, Helvetica, sans-serif;
    font-size   : 11px;
    font-weight : bold;
}

.quote {
    color        : #444444;
    font-family  : Arial, Helvetica, sans-serif;
    font-size    : 12px;
    margin-left  : 10px;
    margin-right : 10px;
    padding      : 10px;
    font-style   : italic;
}

.qa {
    color        : #666666;
    font-family  : Arial, Helvetica, sans-serif;
    font-size    : 11px;
    margin-left  : 40px;
    margin-right : 30px;
    padding      : 5px;
    border       : 0;
}

.headline {
    color       : #0000FF;
    font-family : Arial, Helvetica, sans-serif;
    font-size   : 18px;
    font-weight : bold;
    display     : block;
}

#byline {
    color       : #fff;
    display     : inline;
    font-family : Verdana, Helvetica, sans-serif;
    font-size   : 9px;
}

#projectnav {
    padding          : 0px 10px 0px 20px;
    margin-bottom    : 7px;
    background-color : #eee;
    color            : #999;
    font-size        : 12px; /*background:url(../img/left/bg_leftnav.gif) top repeat-x #eeeeee;*/
}

#projectnav a {
    background      : url(../img/left/bullet.gif) no-repeat;
    padding-left    : 8px;
    padding-right   : 8px;
    text-decoration : none;
    display         : block;
    color           : #666;
    font-family     : Helvetica, Verdana, Arial, sans-serif;
    font-size       : 10px;
}

#serviceNav {
    padding          : 0px 10px 0px 20px;
    margin-top       : 4px;
    background-color : #eee;
    color            : #999;
    font-size        : 11px; /*background:url(../img/left/bg_leftnav.gif) top repeat-x #eeeeee;*/
}

#serviceNav a {
    background      : url(../img/left/bullet.gif) no-repeat;
    padding-left    : 8px;
    padding-right   : 8px;
    text-decoration : none; /*  display: block; */
    color           : #666;
    font-family     : Helvetica, Verdana, Arial, sans-serif;
    font-size       : 11px;
}

/* Matt styles */
.manuals-table {
    width : 700px;
}

.manuals-table td {
    vertical-align : top;
    text-align     : left;
    padding-top    : 12px;
    padding-bottom : 12px;
    width          : 35%;
}

.manual-list {
    font-size : 10px;
}

#fsi-products p {
    color       : #444;
    font-family : Arial, Helvetica, sans-serif;
    font-size   : 1.2em;
    line-height : 1.4em;
    padding     : 0;
    margin      : 0;
    border      : 0;
}

.manual-container {
    width      : 100%;
    padding    : 10px;
    margin-top : 10px;
}

.manual-container img {
    float : left;
}

.manual-content {
    float : right;
    width : 585px;
}

.product_list .pbam {
    padding-left : 40px;
}

.product_list .plinesli {
    width         : 238px;
    height        : 76px;
    overflow      : hidden;
    padding       : 0;
    margin-right  : 40px;
    margin-bottom : 20px;
}

.product_list .plinesli a:hover {
    opacity : 0.6;
}

@media only screen and (max-width : 1010px) {
    .banner {
        background-position : center;
        background-size     : cover;
    }

    /* ---- MOBILE MENU SLIDE ---- */
    body {
        -moz-transition    : all 0.5s cubic-bezier(0.75, -0.25, 0.25, 0.75);
        -o-transition      : all 0.5s cubic-bezier(0.75, -0.25, 0.25, 0.75);
        -webkit-transition : all 0.5s cubic-bezier(0.75, -0.25, 0.25, 0.75);
        transition         : all 0.5s cubic-bezier(0.75, -0.25, 0.25, 0.75);
        position           : relative;
    }

    body.slide {
        transform : translateX(300px);
    }

    .handle {
        display : inline-block;
        color   : #627f9d;
        float   : left;
    }

    .handle:after {
        content     : "\2261";
        position    : absolute;
        bottom      : -1px;
        left        : 20px;
        display     : table-cell;
        line-height : 3.7rem;
        font-size   : 4em;
        color       : #d1d1d1;
    }

    .slide-menu {
        display    : block;
        background : #607791;
        box-shadow : -10px 0px 40px rgba(0, 0, 0, 0.4) inset;
        width      : 300px;
        height     : 100%;
        position   : absolute;
        transform  : translateX(-300px);
        transition : ease-in-out .25s all;
    }

    .slide-menu ul {
        margin     : 0;
        padding    : 0;
        list-style : none
    }

    .slide-menu ul li a {
        text-decoration : none;
        font-weight     : 100;
        font-size       : 1.3em;
        color           : #fefefe;
        display         : block;
        padding         : 15px;
        text-align      : left;
        border-bottom   : 1px solid #d1d1d1;
    }

    ul.sub.hidden-content-nav {
        background : #6a85a5;
        box-shadow : 0px 0px 40px rgba(0, 0, 0, 0.4) inset;
    }

    .sub.hidden-content-nav li a {
        border : none;
    }

    .sub.hidden-content-nav li {
        padding : 0;
    }

    #top-nav {
        display : none;
    }

    /* ---- MOBILE SEARCH ---- */
    #search {
        display : none;
    }

    #ehundred {
        display : none;
    }

    #mobile-search {
        background                 : #b9bfc9;
        width                      : 100%;
        border-bottom-right-radius : 0;
        border-bottom-left-radius  : 0;
        height                     : 50px;
        text-align                 : center;
        padding                    : 8px 0 2px;
    }

    #mobile-search input {
        background    : #FFF url(img/search_text_bg.gif) top 8px right 10px no-repeat;
        width         : 80%;
        border        : none;
        height        : 35px;
        padding       : 0 20px 0 3px;
        margin-top    : 4px;
        color         : #999;
        font-size     : 1.5em;
        border-radius : 5px;
    }

    .show-info-nav:after {
        content         : '';
        background      : url(img/down-arrow.png) no-repeat;
        background-size : 100%;
        position        : absolute;
        right           : 30px;
        margin-top      : 6px;
        width           : 15px;
        height          : 8px;
    }

    .show-info-nav.active.rotate:after {
        content         : '';
        background      : url(img/down-arrow.png) no-repeat;
        background-size : 100%;
        position        : absolute;
        right           : 30px;
        margin-top      : 6px;
        width           : 15px;
        height          : 8px;
        transform       : rotate(180deg);
    }

    .social-contact {
        padding : 15px 10px;
    }

    .social-contact a {
        font-size   : 1.3em;
        line-height : 1.6em;
        color       : #fff;
    }

    .facebook-icon {
        width : 25px;
        float : right;
    }

    /* ---- MOBILE HEADER ---- */
    h1#logo {
        float : right;
    }

    #header {
        height     : 58px;
        background : rgba(0, 0, 0, 1);
        background : -moz-linear-gradient(top, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 1) 30%, rgba(70, 70, 70, 1) 75%);
        background : -webkit-gradient(left top, left bottom, color-stop(0%, rgba(0, 0, 0, 1)), color-stop(30%, rgba(0, 0, 0, 1)), color-stop(75%, rgba(70, 70, 70, 1)), color-stop(76%, rgba(255, 255, 255, 1)), color-stop(100%, rgba(255, 255, 255, 1)));
        background : -webkit-linear-gradient(top, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 1) 30%, rgba(70, 70, 70, 1) 75%);
        background : -o-linear-gradient(top, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 1) 30%, rgba(70, 70, 70, 1) 75%);
        background : -ms-linear-gradient(top, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 1) 30%, rgba(70, 70, 70, 1) 75%);
        background : linear-gradient(to bottom, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 1) 30%, rgba(70, 70, 70, 1) 75%);
    }

    h1#logo {
        display : inline-block;
        float   : right;
        width   : 250px;
        height  : 58px;
    }

    #header h1#logo a {
        background      : url(img/fsi-logo.png) no-repeat 0px 10px;
        background-size : contain;
        height          : 58px;
        width           : auto;
    }

    #header h1#logo a:hover {
        background-position : 0px 0px;
    }

    /* ---- MOBILE FOOTER ---- */
    ul#partners li {
        width         : 100%;
        text-align    : center;
        margin-bottom : 30px;
    }

    ul#partners li#contact_us {
        width         : 100%;
        text-align    : center;
        margin-bottom : 0;
    }

    .product_list .containit div.title h4:after, #distributors-list li.title:after, .other-tools-wrap h4.show-info:after, #fsi-nsn-list .content h4.show-info:after {
        width      : 20px;
        margin-top : 5px;
    }

    /* ---- RESOURCES PAGE ---- */
    #special_header {
        display : none;
    }

    .huge {
        font-size : 26px;
    }

    /* ---- PRODUCT DETAILS PAGE ---- */
    .product-wrapper {
        margin : 30px 15px;
    }
}

@media only screen and (max-width : 675px) {
    /* HOME CALLOUT */
    #callouts li {
        flex-basis : 100%;
    }

    /* ---- PRODUCT PAGE ---- */
    .rivet-line-wrapper {
        justify-content : space-around;
    }

    /* ---- PRODUCT DETAIL PAGE ---- */
    .product-overview {
        width     : 95%;
        position  : relative;
        left      : 50%;
        transform : translateX(-50%);
        padding   : 0 0 30px 0;
    }

    .product_list .li {
        width : 109px;
    }

    .product-image {
        width : 100%;
    }

    /* ---- NSN PAGE ---- */
    .price_heading h4.show-info {
        padding : 20px 50px 20px 20px;
    }

    /* ---- PRODUCT LINE PAGE ---- */
    .pdf_cntr {
        width : 140px;
    }
}

/*Store*/
body#shop{
    padding-bottom: 80px;
}
.main {
    margin        : 10px auto;
    background    : #eaeaea;
    padding       : 20px 1px;
    max-width     : 932px;
    border-radius : 10px;
    color         : #000;
}
.main-copy {
    margin        : 10px auto;
    background    : #fff;
    padding       : 20px;
    max-width     : 932px;
    border-radius : 10px;
    color         : #000;
}
.product {
    background : #fff;
    padding    : 15px 30px;
    margin     : 10px 4px;
}

.product-banner {
    position : relative;
}

.product-banner,
.product-banner *,
.product-banner *:hover {
    cursor : pointer;
}

.product-title {
    text-align        : right;
    position          : absolute;
    right             : 0;
    top               : 50%;
    -webkit-transform : translateY(-50%);
    -ms-transform     : translateY(-50%);
    transform         : translateY(-50%);
    max-width         : 70%
}

.product-banner .note{
    background: #d6ff04;
    padding: 6px;
    display: inline-block;
}

.product-image {
    max-width : 230px;
    margin: 7px 0;
}

.product-title .brand {
    font-weight : bold;
    color       : #6e8eaf;
    font-size   : 20px;
    margin      : 5px 0;
    line-height : 1.15;
}

.product-title .type {
    font-size   : 48px;
    color       : #000;
    margin      : 5px 0;
    line-height : 1.1;
}

.order-table {
    font-family : 'Roboto Condensed', sans-serif;
    font-size   : 14px;
    width       : 100%;
    line-height : 1.2;
}

.order-table,
.order-table th,
.order-table td {
    border          : 1px solid #898989;
    border-collapse : collapse;
}

.order-table th {
    background : #e6e6e6;
    text-align : left;
}

.order-table th,
.order-table td {
    padding : 6px 5px;
}

.order-table .product-qty {
    border : 1px solid #ccc;
    padding: 2px 5px;
    max-width: 60px;
}

.button,
a.button,
button,
input[type='button'],
input[type='reset'],
input[type='submit'] {
    font-family      : 'Roboto Condensed', sans-serif;
    background-color : #617892;
    border           : 1px solid #617892;
    border-radius    : 0;
    color            : #fff;
    cursor           : pointer;
    display          : inline-block;
    font-size        : .8rem;
    font-weight      : 700;
    /* height: 2.3rem; */
    /* letter-spacing: -0.01rem; */
    line-height      : 2.1rem;
    padding: 0 2%;
    text-align       : center;
    text-decoration  : none;
    text-transform   : uppercase;
    white-space      : nowrap;
    box-sizing       : border-box;
}

.button:focus, .button:hover,
a.button:focus, a.button:hover,
button:focus,
button:hover,
input[type='button']:focus,
input[type='button']:hover,
input[type='reset']:focus,
input[type='reset']:hover,
input[type='submit']:focus,
input[type='submit']:hover {
    background-color : #606c76;
    border-color     : #606c76;
    color            : #fff;
    outline          : 0;
}

.button[disabled],
a.button[disabled],
button[disabled],
input[type='button'][disabled],
input[type='reset'][disabled],
input[type='submit'][disabled] {
    cursor  : default;
    opacity : .5;
}

.button[disabled]:focus, .button[disabled]:hover,
a.button[disabled]:focus, a.button[disabled]:hover,
button[disabled]:focus,
button[disabled]:hover,
input[type='button'][disabled]:focus,
input[type='button'][disabled]:hover,
input[type='reset'][disabled]:focus,
input[type='reset'][disabled]:hover,
input[type='submit'][disabled]:focus,
input[type='submit'][disabled]:hover {
    background-color : #6e8eaf;
    border-color     : #6e8eaf;
}

.button.button-outline,
a.button.button-outline,
button.button-outline,
input[type='button'].button-outline,
input[type='reset'].button-outline,
input[type='submit'].button-outline {
    background-color : transparent;
    color            : #FFF;
}

.button.button-outline:focus, .button.button-outline:hover,
a.button.button-outline:focus, .button.button-outline:hover,
button.button-outline:focus,
button.button-outline:hover,
input[type='button'].button-outline:focus,
input[type='button'].button-outline:hover,
input[type='reset'].button-outline:focus,
input[type='reset'].button-outline:hover,
input[type='submit'].button-outline:focus,
input[type='submit'].button-outline:hover {
    background-color : transparent;
    border-color     : #6e8eaf;
    color            : #6e8eaf;
}

.button.button-outline[disabled]:focus, .button.button-outline[disabled]:hover,
a.button.button-outline[disabled]:focus, .button.button-outline[disabled]:hover,
button.button-outline[disabled]:focus,
button.button-outline[disabled]:hover,
input[type='button'].button-outline[disabled]:focus,
input[type='button'].button-outline[disabled]:hover,
input[type='reset'].button-outline[disabled]:focus,
input[type='reset'].button-outline[disabled]:hover,
input[type='submit'].button-outline[disabled]:focus,
input[type='submit'].button-outline[disabled]:hover {
    border-color : inherit;
    color        : #6e8eaf;
}

.button.button-clear,
a.button.button-clear,
button.button-clear,
input[type='button'].button-clear,
input[type='reset'].button-clear,
input[type='submit'].button-clear {
    background-color : transparent;
    border-color     : transparent;
    color            : #6e8eaf;
}

.button.button-clear:focus, .button.button-clear:hover,
a.button.button-clear:focus, .button.button-clear:hover,
button.button-clear:focus,
button.button-clear:hover,
input[type='button'].button-clear:focus,
input[type='button'].button-clear:hover,
input[type='reset'].button-clear:focus,
input[type='reset'].button-clear:hover,
input[type='submit'].button-clear:focus,
input[type='submit'].button-clear:hover {
    background-color : transparent;
    border-color     : transparent;
    color            : #606c76;
}

.button.button-clear[disabled]:focus, .button.button-clear[disabled]:hover,
a.button.button-clear[disabled]:focus, a.button.button-clear[disabled]:hover,
button.button-clear[disabled]:focus,
button.button-clear[disabled]:hover,
input[type='button'].button-clear[disabled]:focus,
input[type='button'].button-clear[disabled]:hover,
input[type='reset'].button-clear[disabled]:focus,
input[type='reset'].button-clear[disabled]:hover,
input[type='submit'].button-clear[disabled]:focus,
input[type='submit'].button-clear[disabled]:hover {
    color : #6e8eaf;
}

.button-black,
a.button-black {
    background-color : black;
    border-color     : black;
}

.button-black.button-clear,
.button-black.button-outline,
a.button-black.button-clear,
a.button-black.button-outline {
    background-color : transparent;
    color            : black;
}

.button-black.button-clear,
a.button-black.button-clear {
    border-color : transparent;
}

/* Custom size */
.button-small,
a.button-small {
    font-size   : .8rem;
    height      : 1.7rem;
    line-height : 1.8rem;
    padding     : 0 1rem;
}

.button-large,
a.button-large {
    font-size   : 1.4rem;
    height      : 4.5rem;
    line-height : 4.5rem;
    padding     : 0 2rem;
}

.button-search,
a.button-search {
    width: 23%;
    position: relative;
    top: 1px;
    background: #01ab87;
    border: 1px solid #149770;
}



.sticky-footer-buttons{
    /*display: inline-block;*/
    padding: 15px 18px;
    position: fixed;
    /*bottom: 10px;*/
    /*right: 10px;*/
    /*background: #f2f2f2;*/
    border: 1px solid #CDCED1;
    box-shadow: 0 0 8px rgba(20,0,40,.4);
    z-index: 999;
    transition: all .2s;
}
.sticky-footer-buttons:hover{
    box-shadow: 0 0 12px rgba(45,40,50,.55);
    transition: all .2s;
}

/* ORIGINALLY MOBILE STYLING */
.sticky-footer-buttons{
    display: block;
    bottom: 0;
    right: 0;
    width: calc(100% - 30px);
    text-align: center;
    background: rgba(75,77,80,.9);
    border: 0px;
    border-top: 2px solid #01ab87;
}
/* END */


.floating-cart {
    font-family : 'Roboto Condensed', sans-serif;
    position    : relative;
    background  : rgba(251, 250, 252, 0.95);
    width       : 100%;
    /* height: 55px; */
    padding     : 10px 10px 5px 10px;
    margin      : 0 auto;
    box-sizing  : border-box;
    border-top: 4px solid #01ab87;
}
.addItemsContainer {
    width: auto;
    display: inline-block;
}
.button.addItemsButton {
    width  : auto;
    height : 35px;
    background: #1c9e70;
    border-color: #149770;
    color: #fff;
    transition: background .3s;
    font-size: 1rem;
}
.button.addItemsButton:hover{
    background: #16BC83;
    border-color: #15A570;
    transition: background .2s;
    color: #fff;
}

.top-bar-inner{
    max-width: 932px;
    margin: 0 auto;
}
.floating-cart.stick {
    /*background : rgba(0, 0, 0, 0.8);*/
    margin-top : 0 !important;
    position   : fixed;
    top        : 0;
    z-index    : 10000;
    box-shadow: 0px 2px 7px rgba(10,0,30,.4);
}

.search-form {
    float: left;
    margin: 0;
    width  : auto;
    margin-top: 3px;
    position: relative;
}
.search-form input {
    font-family : 'Roboto', sans-serif;
    height: 2.2rem;
    /* padding     : 0.33rem 1rem; */
    width: 230px;
    box-sizing: border-box;
    padding: 5px;
    border: 1px solid #ccc;
}
.search-form .button-search{
    width: 75px;
}


button.close-icon {
    border:1px solid transparent;
    background-color: transparent;
    display: inline-block;
    vertical-align: middle;
    outline: 0;
    cursor: pointer;
}
.close-icon:after {
    content: "X";
    font-family: 'Arial', sans-serif;
    display: block;
    width: 15px;
    height: 15px;
    position: absolute;
    background-color: #FA9595;
    z-index:1;
    right: 102px;
    top: 9px;
    bottom: 0;
    margin: 0 auto;
    padding: 2px;
    border-radius: 50%;
    text-align: center;
    color: white;
    font-weight: normal;
    font-size: 11px;
    box-shadow: 0 0 2px #E50F0F;
    cursor: pointer;
    line-height: 1.5;
}
.search-box:not(:valid) ~ .close-icon {
    display: none;
}



#my-cart-11595439 {
    /*width    : 33.3333%;*/
    float: right;
    text-align: right;
}

.customCart {
    text-align : right;
    cursor     : pointer;
    height     : 100%;
    box-sizing : border-box;
    color: #617892;
    display: inline-block;
    padding-left: 45px;
    background: url('img/cart-icon-blue.png') no-repeat;
    background-position: left top 6px;
    background-size: 32px auto;
}

.customCart span {
    font-family : 'Roboto Condensed', sans-serif;
    font-weight : 300;
    /* font-size: 0.8rem; */
    color       : #7A7B7B;
    line-height : 0.8rem;
    display     : inline-block;
}

.customCart span.items {
    font-size   : 1.2rem;
    color       : #596F88;
    /* line-height: 0rem; */
    font-weight : 100;
    display     : inline-block;
    padding: 0 5px;
}

.customCart span.total {
    font-size   : 1.2rem;
    font-weight : 700;
    color       : #596F88;
    line-height : 2rem;
    display     : inline-block;
    margin: 0 3px;
}

html#ecwid_html body#shop div.ecwid-minicart-mini-rolloverContainer,
div.ecwid-productBrowser-cart div.ecwid-productBrowser-sku {
    display : block !important;
}

.customCart:hover span.items,
.customCart:hover span.total{
    color: #314A8E;
    text-decoration: underline;
}


div.ecwid-minicart {
    display : none !important;
}

div.pdf-download {
    float : right;
    position: relative;
    top: -10px;
}
.button.pdf-button{
    padding: 4px 12px;
    font-weight: 600;
    margin-bottom: 5px;
}
.four-oh-four {
    position: relative;
    width: 100%;
    height: 70vh;
    background-image: url("../_images/rivets.gif");
    background-repeat: no-repeat;
    background-size: cover;
}
.four-oh-four-container {
    width: 100%;
    text-align: center;
    position: absolute;
    display: inline-block;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}
.four-oh-four-container a {
    cursor: pointer;
}
.four-oh-four-container h1.title.huge {
    font-size: 4em;
    text-align: center;
}
.four-oh-four-container h4 {
    font-size: 2.5em;
}
.four-oh-four-container a {
    color: #fff;
    text-shadow: 0 1px 1px rgba(0, 0, 0, .5);
}
.four-oh-four-container a:hover {
    text-decoration: underline;
}
/*-------------------------------------------------------------------------------*\

                                RESPONSIVE

\*-------------------------------------------------------------------------------*/

@media only screen and (max-width : 992px) {
    /* Small Laptop */
    .product-image {
        max-width : 190px;
    }

    .product-title .brand {
        font-size : 19px;
    }

    .product-title .type {
        font-size : 40px;
    }

}

@media only screen and (max-width : 768px) {
    /* Tablets */


    /* SHOP PAGE */
    .top-bar-inner{
        padding: 0 15px;
    }
    /*.search-form{
        width: 45%;
    }*/

}

@media only screen and (max-width : 670px) {
    /* Mobile */


    /* SHOP PAGE */
    /*.search-form{
        width: 51%;
    }
    #my-cart-11595439{
        width: 46%;
    }*/

}

@media only screen and (max-width : 590px) {
    /* Mobile */

    /* SHOP PAGE */


    .search-form input{
        width: 150px;
    }
    .search-form .button-search {
        width: 60px;
    }
    .close-icon:after{
        right: 82px;
    }

    .product{
        padding: 10px 20px;
    }
    .product-image {
        max-width : 160px;
    }


    .order-table {
        font-size : 16px;
        padding: 10px 0;
    }

    .order-table,
    .order-table tbody,
    .order-table tr,
    .order-table td {
        display : block;
    }

    .order-table th {
        display : none;
    }

    .order-table,
    .order-table td {
        border : none;
    }

    .order-table tr {
        margin         : 10px 0;
        padding-bottom : 10px;
        border-bottom  : 1px solid #ccc;
    }

    .order-table td:nth-child(1):before,
    .order-table td:nth-child(2):before,
    .order-table td:nth-child(3):before,
    .order-table td:nth-child(4):before,
    .order-table td:nth-child(5):before {
        display       : inline-block;
        padding-right : 6px;
        color         : #A0A2A2;
        font-weight   : 600;
    }

    .order-table td:nth-child(1):before {
        content : 'Part Number:';
    }

    .order-table td:nth-child(2):before {
        content : 'Description:';
    }

    .order-table td:nth-child(3):before {
        content : 'Technical:';
    }

    .order-table td:nth-child(4):before {
        content : 'Price Per Bag:';
    }

    .order-table td:nth-child(5):before {
        content : 'Quantity:';
    }

}

@media only screen and (max-width : 480px) {

    iframe {
        width: 100%;
    }

    /* SHOP PAGE */
    .floating-cart.stick{
        padding-top: 6px;
        padding-bottom: 3px;
    }
    .top-bar-inner{
        padding: 0 5px;
    }
    .search-form,
    #my-cart-11595439{
        width: 100%;
        float: none;
    }
    #my-cart-11595439{
        text-align: left;
    }
    .search-form input,
    .button-search{
        height: 2rem;
        vertical-align: top;
        top: 0;
        margin-bottom: 2px;
    }
    .search-form input{
        width: 74%;
    }
    .search-form .button-search {
        width: 24%;
    }
    .close-icon:after{
        right: 28%;
        top: 6px;
    }



    .customCart{
        text-align: left;
        font-size: .7rem;
        padding-left: 20px;
        background-size: 16px auto;
        background-position: left top 8px;
    }
    .customCart > div{
        display: inline-block;
    }
    .customCart span{
        font-size: .7rem;
    }
    .customCart span.items,
    .customCart span.total{
        font-size: .8rem;
        padding: 0 2px;
    }

    .sticky-footer-buttons{
        padding: 10px;
    }

    .product-title {
        text-align        : left;
        position          : relative;
        right             : auto;
        top               : auto;
        -webkit-transform : none;
        -ms-transform     : none;
        transform         : none;
        max-width         : 100%;
    }

    .product-image {
        max-width : 100%;
    }

    .product-title .brand {
        font-size : 18px;
    }

    .product-title .type {
        font-size : 32px;
    }

    div.pdf-download{
        float: none;
        top: 0;
        margin-left: 10px;
        margin-top: 15px;
    }
    div.pdf-download .button-small{
        padding: 7px 1rem;
        line-height: 1.2;
        height: auto;
    }

    .order-table .product-qty{
        padding: 5px;
    }
}
