@charset "utf-8";
/* CSS Document */


/* btn style with drop shadow */
.shadow {
	-webkit-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
 	 box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
}
/* btn reset styles */
.sharp { border-radius: 0 !important }
.flat { border: none !important }

/* fp_carousel arrow override */
#fp_carousel .carousel-control.right, #fp_carousel .carousel-control.left { background: none }

/*section headers style modified*/
.section-title {
	font-size: 24pt !important;
    text-align: center;
    margin: 20px 0 20px;
    /* padding-top: 10px; */
    padding-bottom: 10px;
    background: none;
    border-top: none;
    text-align: center;
    color: #212128 !important;
    font-family: 'Open Sans','Helvetica Condensed','Helvetica Narrow','Arial Narrow','Open Sans';
}
.section-title > .fa {font-size:80%}

#homePage .section-title {
  margin-top:120px;
}

.navbar-toggle.tight { margin-right: 0 }

/* overriding the nav-right and social margins to compensate for container-fluid */
@media (min-width: 768px) {
.navbar-right,.social {
    margin-right: 0;
	margin-right: 10px;
	}
}
/* adding a border to the navbar-header to compensate for removing the #mobileborder 
@media (max-width: 991px) {
.navbar-header {
    border-bottom: 2px solid #8c9295;
	}
}*/

#smartsearch {
	padding:20px 40px;
	width:100%;
	min-height:150px;
	margin-right:20px;
	border: none ;
	border-bottom:3px solid #cadb37;
	position:absolute;
	max-height:440px;
	/*background:#8c9295;*/
	background:#ffffff;
	top: 6px;
	left: 0
}
#smartsearch h4 {
	/* color: white */
}

/* adding some padding to search bar */



a.btn-searchbar {
	font-weight: 700
}

.button-bar-flex {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}

/* moving the "advanced" search button in the nav away from the other links */
#b_search { /*margin: 0 15px 0 10px*/ }

/*adjust the default height for featured products for mobile version */
@media screen and (max-width: 480px) {
	.products-item { min-height: 400px }

    .button-bar-flex {
        flex-direction: column-reverse;
    }

    .button-bar-flex .btn {
        display: block;
        display: inline-block;
        margin-bottom: 10px;
    }
}




/* styles for home intro including buttons */
.home-intro {
	background: url(../images/home-about-section-bg.jpg) no-repeat center center;
	background-size: cover
}
.home-intro .btn-default {
    color: white;
	background: rgba(55,55,55,0.8);
	padding: 10px 15px;
}
.home-intro .btn-default:hover {
	background: (94,217,255,1.00);
	-webkit-transition: all .2s ease-in-out;
    -moz-transition: all .2s ease-in-out;
    -ms-transition: all .2s ease-in-out;
    -o-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;
}
/* styles to control the search results, page and results, etc. */
.form-control-filters {
	width: auto !important ;
	display:inline-block !important
}

/* control items in the #filterbar */
#filterbar .well { padding: 9px }

/* control the count badge in filters */
.filter-link > .badge, .badge.includes {
	background-color: #eee;
	color: #555;
	padding: 2px 5px
}
x.badge.includes { font-size: 12pt }

.panel-heading.filter-header > a { color:black }

/* modal window for latest devices off of homepage, outside of prodSlider */
.prodSliders .modal-dialog, .quick-browse .modal-dialog, #footer .modal-dialog {
    width: 80%;
    margin: 30px auto;
}
.modal-header h1 { text-align: center }




/* modify footer and control style of components inside */
#footer { margin-top: 0 !important;padding: 20px 0 0 !important}
#footer h2 {
	color: white;
}
#footer .col-md-4 { padding: 0 40px }

@media screen and (min-width: 480px) {
	#footer .col-md-4 { padding: 0 inherit }
}
.blog-feed h3 {  color: rgba(94,217,255,1.00) }
.blog-feed h4 { color: rgba(94,217,255,0.8) }
.blog-feed .excerpt p { color: #eee; font-size: 9pt; line-height: 14pt }

/* quick browsing list-group styles */

.quick-browse { margin-bottom: 10px }
.quick-browse .list-group-item:first-child,
.quick-browse .list-group-item:last-child {
	border-radius: 0 !important
}
@media screen and (max-width: 1100px) {
	.quick-browse .list-group-item { padding: 10px 5px }
}

.list-group-item {
	transition:         0.08s ease-in;
  	-o-transition:      0.08s ease-in;
  	-ms-transition:     0.08s ease-in;
  	-moz-transition:    0.08s ease-in;
  	-webkit-transition: 0.08s ease-in;

}
.list-group-item.grn 		{ border-left: 4px solid #cadb37 }
	.list-group-item.grn:hover 		{ background-color: #cadb37; -webkit-transition: top 0.09s ease-in }
	.list-group-item.grn:hover a, .list-group-item.grn:hover a:hover { color: white }
.list-group-item.cyan 		{ border-left: 4px solid #05b1cc }
	.list-group-item.cyan:hover 		{ background-color: #06c5e3; -webkit-transition: top 0.09s ease-in }
	.list-group-item.cyan:hover a, .list-group-item.cyan:hover a:hover { color: white }
.list-group-item.orange 	{ border-left: 4px solid #fcb040 }
	.list-group-item.orange:hover 		{ background-color: #fcb040; -webkit-transition: top 0.09s ease-in }
	.list-group-item.orange:hover a, .list-group-item.orange:hover a:hover { color: white }

.quick-browse .list-group-item a {
  text-align:left;
  padding-left:17px;
}

.quick-browse .list-group-item a:before{
  content:"→";
  position:absolute;
  color:white;
  left: 83%;
  opacity: 0;
  -webkit-transition: all 250ms cubic-bezier(0.680, -0.550, 0.265, 1.550);
}

.quick-browse .list-group-item a:hover:before{
  left:84%;
  opacity:1;
}

.quick-browse .list-group-item a:hover {
  width:170px;
}




/* adjust the formatting for green background with emarketing subscription */

/*Green Background*/
.green-bkgd {
    background-color: #cadb37;
    width: 100%;
    padding: 45px 0;
    text-align: center;
    margin: 50px 0 0 0;
    height: auto;

}
.green-bkgd label { 	font-size: 16pt; font-weight: normal;}

.green-bkgd .form-control{
    height: auto;
    border: 1px solid #fff;
    border-radius: 4px;
    box-shadow: none;
	margin-left: 10px
}

.green-bkgd .btn {
    color: #fff;
    background-color: #23baed;
    border-color: #23baed;
    height: auto;
	font-size: inherit
}

/* styles for blog feed in footer */
.blog-feed .badge {
	background-color:cyan
}
.blog-feed .feature-img { width:70% }

@media screen and (max-width: 480px) {
	.blog-feed .feature-img { width:100%; text-align:center }
}

/* turn off caps of prod detial h4 */
.prodinfo h4 {
	text-transform: none
}

/* turn down font size for smaller screens in sorting dropdowns */
@media screen and (max-width: 480px) {
	.input-sm { font-size:8pt;padding:3px 5px }
}

/* control brand logo size on home page and brand landing pages */
.featured-brand-logo { max-width: 300px;}

/*update carousel indicators */
.carousel-indicators { bottom: -10px }
.carousel-indicators li { border: 1px solid #eee; background-color: rgba(200,200,200,0.5) }
.carousel-indicators .active { border: 1px solid #eee; background-color: rgba(200,200,200,1.0) }

/* control styles of searchbar smart search input */
.searchbarcontainer .input-group {
	position: relative;
    display: table;
    border-collapse: separate;
    /*
	width: 90%;
    margin: auto;
	*/
}
#smartsearch {
    padding: 20px 40px;
    width: 100%;
    min-height: 150px;
    margin-right: 20px;
    border: none;
    border-bottom: none;
    position: absolute;
    max-height: none;
    background: #ffffff;
    top: -5px;
    left: 15px;
	-webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
    box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
}

@media screen and (max-width: 1000px) {
	.searchbarcontainer .input-group {
		width: 100%;
	}
}



/* match mobile border to color of nav */
#mobileborder { border-bottom: 2px solid #8c9295; }
/* giving mobile search a gray background same as full view container */
#mobilesearch {
    padding: 10px;
    background-color: #8c9295;
}
/*taking off the green border from mobile search box */
@media (max-width: 991px) {
.searchbarsearch {
    color: #535353;
    border: 1px solid #CCC;
	}
.searchbaraddon {
    border: 1px solid #CCC;
	}
}
/* modify the breadcrumb to inlcude and bottom border */
.breadcrumb {
    padding: 0 0 10px;
    border-bottom: 1px solid #eee;
	margin: 5px 0
}
/* .breadcrumb > li > a:focus { text-decoration: line-through} */

@media screen and (max-width: 768px) {
	.breadcrumb > li { line-height: 2 }
}

/* style the filter-set breadcrumbs */
.livecrumb {
	border: 1px solid #ebebeb;
	margin-bottom:5px;
    padding: 3px 10px;
    background: #f5f5f5;
    border-radius: 20px;
    font-size: 11pt;
}
.livecrumb > a, .itemsfound {
	display: inline-block;
	padding: 2px 3px;
	background: #ee3d71;
	border-radius: 10px;
	line-height: .01;
	color: white;
    min-width: 10px;
    font-size: 12px;
    font-weight: 700;
    color: #fff;
    text-align: center;
    vertical-align: middle;
    margin-bottom:3px
}
.itemsfound { line-height: inherit}

.breadcrumb>li+li:before {
    padding: 0 5px;
    color: #ccc;
    content: "/\00a0";
}

/* styles for services list */
.services > .list-group-item:first-child,
.services > .list-group-item:last-child,
.services > .list-group-item {
	padding: 5px 10px;
	font-size: 10pt
}
.services > .list-group-item:first-child { border-bottom: 1px solid #efefef; border-top: none; border-left: none; border-right:none }
.services > .list-group-item:last-child  { border-bottom: 1px solid #efefef; border-left: none; border-right:none }
.services > .list-group-item {
	border-top: none; border-left: none; border-right:none;
	border-bottom: 1px solid #efefef
}

.services-lv2 { float: left; text-align: center; width: 33%; margin-bottom: 20px }
.services-lv2 img { width: 100px }
@media screen and (max-width: 768px) {
	.services-lv2 { width: 50% }

}
/* style setcrumb */
.btn-sm .setcrumb {
	font-family: 'Open Sans','Arial Narrow','Open Sans', sans-serif;
	margin-right:10px;
	margin-bottom:5px;
    font-weight: 700;
	border: none;
	border-bottom: 2px soild black !important;
	color: inherit
}
/* div containing device thumbnail and item count */



/* control pagination */

.pagination {
  display: -ms-flexbox;
  display: flex;
  padding-left: 0;
  list-style: none;
  border-radius: 0.25rem;
  margin: 10px 0
}
.pagination>li>a, .pagination>li>span { color: inherit;  }

.page-item:first-child .page-link {
  margin-left: 0;
  border-top-left-radius: 0.25rem;
  border-bottom-left-radius: 0.25rem;
}

.page-item:last-child .page-link {
  border-top-right-radius: 0.25rem;
  border-bottom-right-radius: 0.25rem;
}

.page-item.active .page-link {
  z-index: 2;
  color: #fff;
  background-color: #007bff;
  border-color: #007bff;
}

.page-item.disabled .page-link {
  color: inherit;
  pointer-events: none;
  background-color: #fff;
  border-color: #ddd;
}

.page-link {
  position: relative;
  display: block;
  padding: 5px 10px !important;
  margin-left: -1px;
  line-height: 1.25;
  color: #007bff;
  background-color: #fff;
  border: 1px solid #ddd;
}
.page-link.steptoend, .page-link.stepby1 {

}
	.page-link.steptoend { padding: 5px 5px !important; background-color: #f5f5f5 !important }
	.page-link.stepby1   { padding: 5px 7px !important; background-color: #eee !important }

.page-link:focus, .page-link:hover {
  color: #0056b3;
  text-decoration: none;
  background-color: #e9ecef;
  border-color: #ddd;
}

.pagination-lg .page-link {
  padding: 0.75rem 1.5rem;
  font-size: 1.25rem;
  line-height: 1.5;
}

.pagination-lg .page-item:first-child .page-link {
  border-top-left-radius: 0.3rem;
  border-bottom-left-radius: 0.3rem;
}

.pagination-lg .page-item:last-child .page-link {
  border-top-right-radius: 0.3rem;
  border-bottom-right-radius: 0.3rem;
}

.pagination-sm .page-link {
  padding: 0.25rem 0.5rem;
  font-size: 0.875rem;
  line-height: 1.5;
}

.pagination-sm .page-item:first-child .page-link {
  border-top-left-radius: 0.2rem;
  border-bottom-left-radius: 0.2rem;
}

.pagination-sm .page-item:last-child .page-link {
  border-top-right-radius: 0.2rem;
  border-bottom-right-radius: 0.2rem;
}

/* pagination */
.pagination .active .page-link {
  -webkit-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12); }

.pagination .page-link {
  background-color: transparent;
  font-size: 1.2rem; }

.pagination .active .page-link {
  border-radius: 2px;
  -webkit-transition: all 0.2s linear;
  transition: all 0.2s linear; }
  .pagination .active .page-link:hover {
    color: #fff; }

.pagination.pagination-circle .page-link {
  border-radius: 50%;
  margin-left: 2px;
  margin-right: 2px; }
  .pagination.pagination-circle .page-link:hover {
    border-radius: 50%; }

.pagination.pagination-circle .active .page-link {
  border-radius: 50%; }

.pagination .page-link {
  border: 0;
  -webkit-transition: all 0.3s linear;
  transition: all 0.3s linear; }
  .pagination .page-link:hover {
    -webkit-transition: all 0.3s linear;
    transition: all 0.3s linear;
    background-color: #eee; }
  .pagination .page-link:focus {
    background-color: transparent; }

.pagination.pg-blue .active .page-link {
  background-color: #4285F4; }

.pagination.pg-red .active .page-link {
  background-color: #ff3547; }

.pagination.pg-teal .active .page-link {
  background-color: #05B1CC; }

.pagination.pg-darkgrey .active .page-link {
  background-color: #37474F; }

.pagination.pg-dark .active .page-link {
  background-color: #2E2E2E; }

.pagination.pg-bluegrey .active .page-link {
  background-color: #3F729B; }

.pagination.pg-amber .active .page-link {
  background-color: #ff6f00; }

.pagination.pg-purple .active .page-link {
  background-color: #5e35b1; }

/* control Advanced Search from Nav */
.advanced-filters {
	margin-left: 0;
	/*
	border: 1px solid #899999;
	border-radius: 10px
	*/
}
.advanced-filters > .checkbox {
	float:left;
	margin: 10px;
}
.advanced-filters > .checkbox:first-child { margin: 10px 10px 10px 0 }
.advanced-filters > .checkbox > .badge { line-height: 20px;font-size:11px }
.badge.count {
	background-color: white !important;
	color: #878787 !important;
	margin-top: -3px
}
@media screen and (max-width: 1100px) {
	.advanced-filters > .checkbox > .badge > label, .badge.count { font-size: 9px }
	.advanced-filters > .checkbox { margin: 10px 5px 10px 0 }
}
.advanced-filters > .checkbox:first-child > label {
	padding-left: 0
}

/* button style for PDF generator */
.pdf {
	padding-left: 50px;
	background: url(../images/PDF-icon.png) no-repeat 3px 2px white !important;
	height:55px;
	border-radius: 0;
}

/* adjust margin on menu items */
.account-menu .panel-body li { margin-left: 10px }
/* turn off the border around panel-body */
.account-menu .panel-body { border: none }



/* ETA and Special Order styles in product results */
.rule {
	clear: both;
	border:0;
	border-bottom:2px solid black;
	margin: 0 0 15px 0;
    padding: 15px 0 0 0;
}
.rule.thin {
	border-bottom:1px solid #eee;
}
.eta-box {}
.special-order-box {}
.eta-box p,.special-order-box p {
	margin: 0 0 5px;
	font: 12pt 'Open Sans',Helvetica Condensed,Arial Narrow,Arial;
	font-weight: 700
}
.eta-box label small,.special-order-box label small {
	margin: 0;
	font-family: 'Open Sans',Helvetica,Arial,Arial;
}
.eta-box > .btn > i, .orange { color: orange }
.eta-box > .btn,.special-order-box > .btn {
    background-color: rgba(255,255,255,1.0);
    border: none;
	padding: 5px 10px;
    font-size: 12px;
    line-height: 1.5;
	white-space: inherit;
	border: none !important;
	border-radius: 0 !important;
	-webkit-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
 	 box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
}
.eta-box > .btn.btn2 { margin-top: 5px }

@media screen and (max-width:768px) {
	.eta-box > .btn.btn2 { margin-top: 0 }
}
	.eta-box > .btn:hover {
		color: white;
		background-color: rgba(255,165,0,1.0);
		border:none;
	}
	.eta-box > .btn:hover > i { color: white }

.special-order-box > .btn > i, .cyan { color: #00bfdf }

	.special-order-box > .btn:hover {
		color: white;
		background-color: rgba(0,191,223,1.0);
		border:none;
	}
	.special-order-box > .btn:hover > i { color: white }

.prodinfo .special-order-box .btn,
.prodinfo .eta-box .btn { font-size: 14px !important }
.prodinfo .eta-box .btn { float: left }
.prodinfo .eta-box .btn2 { margin-top: 0; margin-left: 20px }


/*controls for sliding feedback box*/
#feedbackModal {
	z-index: 9998;
	bottom:20px;
	position:fixed;
	padding:18px 10px 5px;
	background-color: #fefefe;
	width: 120px;

	-webkit-transition: all .2s ease-in-out;
    -moz-transition: all .2s ease-in-out;
    -ms-transition: all .2s ease-in-out;
    -o-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;
}
#feedbackModal.open 	{ right:0; }
#feedbackModal.hidden 	{ display:block !important; right:-90px; font-size:12pt }

.dontShow {
	font-size: 9pt;
	xpadding-top: 5px;
	margin-top: 5px;
	border-top:1px solid #eee;
	color:Gray;
}
.dontShow .badge {
	cursor:pointer;
	background: #eee;
	color:gray;
	padding:2px 3px
}

.slideOut {
	padding: 0 5px;
    background: cyan;
    color: white;
    position: absolute;
    top: 5px;
    left: 0;
    float: left;
    display: block;
    min-width: 30px;
    font-size: 8pt;
}

#feedbackModal.open .slideOut::before 	{ content: "HIDE"  }
#feedbackModal.hidden .slideOut::before { content: "←"  }


/*
  Controls for sliding feedback bar at top of website
*/
#feedbackModalTop {
	z-index: 9998;
	position:relative;
	background-color: rgba(44,196,243,0.2);
	padding:2px 0;
	font-size: 12px;
	color: black;

	-webkit-transition: all .2s ease-in-out;
    -moz-transition: all .2s ease-in-out;
    -ms-transition: all .2s ease-in-out;
    -o-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;
}
@media screen and (max-width: 480px) {
	#feedbackModalTop { font-size:9px }
}
#feedbackModalTop.open 	    { top:-5px; }
#feedbackModalTop.hidden 	{ display:none }

.dontShow {
	font-size: 9pt;
	xpadding-top: 5px;
	margin-top: 5px;
	border-top:1px solid #eee;
	color:Gray;
}
#feedbackModalTop a { color: rgba(44,196,243,1.0) !important }
#feedbackModalTop .badge {
	cursor:pointer;
	background: white;
	color:#00bfdf;
	padding:2px 3px
}

.dontShowTop /* to hide */ {
	padding: 0 5px;
    position: absolute;
    top: 0;
    right: 0;
	float:right;
    display: block;
    min-width: 30px;
    font-size: 14pt;
	cursor:pointer;
	color: rgba(44,196,243,1.0) !important
}

#feedbackModalTop.open .slideOut::before 	{ content: "HIDE"  }
#feedbackModalTop.hidden .slideOut::before { content: "←"  }

/*
  Controls for sliding feedback bar at top of website
*/



/* HIDING TO OVERRIDE WIDTH
#nav-browse-inner .img-thumbnail, #nav-browse-inner .thumbnail,
.searchform .thumbnail > a > img,
.searchform .thumbnail img.image-responsive {
	width: 80% !important;

}
*/