@charset "UTF-8";
/* Styles used in popinch.php */

.page {
	width: 100%;
	/*max-width:705px;*/
	/*max-width:637px;*/
	/*max-height:1024px;*/
	
	margin: 0px auto 0px auto;
	position:relative;
	/*float:left;*/
	background-color:#fff;
	height:100%;
}

.pageHeader{
	vertical-align:bottom;
	background-color:#003a70;
	
	height:50px;
}


.Social{
	width:100%;
	height:64px;
	background-color:#eee;
	text-align:center;
}

.Social img{
	padding-top: 4px;
	padding-left:20px;
	height:35px;
	width:auto;
}

.catlistSelection{
	/*float:left;*/
	/*width:623px;*/
	width:100%;
	/*height: 100%;*/  /*Item List Container, so must be 100% for Firefox*/
}

.catlistItemList{
	/*width:620px;
	height:650px;*/
	/*width:100%;*/
	/*height:650px;*/
	
	/* was 157px */
	height: -moz-calc(100% - 160px);
	height: -webkit-calc(100% - 160px);
	height: calc(100% - 160px);
	overflow: scroll;
	background-color:#fff;
}

.catlistCheckboxUOM{
	/*text-align:center;*/
	width:75px;
	/*float:left;*/
	margin-top: 20px;
	margin-left:auto;
	margin-right:auto;
	margin-bottom: 10px;
}

.catlistCheckboxTaps{
	width:75px;
	margin-left:auto;
	margin-right:auto;
	margin-bottom:3px;
}

.catlistCheckboxDies{
	width:75px;
	margin-left:auto;
	margin-right:auto;
	margin-bottom:3px;
}

.catlistCheckboxGages{
	width:75px;
	margin-left:auto;
	margin-right:auto;
	margin-bottom:5px;
}

.catlistCheckboxes{
	/*width:573px;
	height:48px;*/
	/*width: 140px;
	text-align:center;*/
	background-color:#003a70;
	color:#fff;
	/*padding-left:50px;*/
	
	
	
}

/* BEGIN .chkUOM */
.chkUOM {
	width: 80px;
	height: 26px;
	background: #333;
	

	-webkit-border-radius: 50px;
	-moz-border-radius: 50px;
	border-radius: 50px;
	position: relative;

	-webkit-box-shadow: inset 0px 1px 1px rgba(0,0,0,0.5), 0px 1px 0px rgba(255,255,255,0.2);
	-moz-box-shadow: inset 0px 1px 1px rgba(0,0,0,0.5), 0px 1px 0px rgba(255,255,255,0.2);
	box-shadow: inset 0px 1px 1px rgba(0,0,0,0.5), 0px 1px 0px rgba(255,255,255,0.2);
}

.chkUOM:after {
	content: 'MM';
	font: 12px/26px Arial, sans-serif;
	color: #fff;
	position: absolute;
	right: 10px;
	z-index: 0;
	font-weight: bold;
	text-shadow: 1px 1px 0px rgba(255,255,255,.15);
	
}

.chkUOM:before {
	content: 'IN';
	font: 12px/26px Arial, sans-serif;
	color: #fff;
	position: absolute;
	left: 10px;
	z-index: 0;
	font-weight: bold;
	
}

.chkUOM label {
	display: block;
	width: 34px;
	height: 20px;
	
	-webkit-border-radius: 50px;
	-moz-border-radius: 50px;
	border-radius: 50px;

	-webkit-transition: all .4s ease;
	-moz-transition: all .4s ease;
	-o-transition: all .4s ease;
	-ms-transition: all .4s ease;
	transition: all .4s ease;
	cursor: pointer;
	position: absolute;
	top: 3px;
	left: 3px;
	z-index: 1;

	-webkit-box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.3);
	-moz-box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.3);
	box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.3);
	background: #fcfff4;

	background: -webkit-linear-gradient(top, #f00 0%, #f00 40%, #f00 100%);
	background: -moz-linear-gradient(top, #f00 0%, #f00 40%, #f00 100%);
	background: -o-linear-gradient(top, #f00 0%, #f00 40%, #f00 100%);
	background: -ms-linear-gradient(top, #f00 0%, #f00 40%, #f00 100%);
	background: linear-gradient(top, #f00 0%, #f00 40%, #f00 100%);
	
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f00', endColorstr='#f00',GradientType=0 );
}

.chkUOM input[type=checkbox]:checked + label {
	left: 43px;
}

/* END chkUOM */



/* BEGIN .chkTaps */
.chkTaps {
	width: 80px;
	height: 26px;
	background: #333;
	

	-webkit-border-radius: 50px;
	-moz-border-radius: 50px;
	border-radius: 50px;
	position: relative;

	-webkit-box-shadow: inset 0px 1px 1px rgba(0,0,0,0.5), 0px 1px 0px rgba(255,255,255,0.2);
	-moz-box-shadow: inset 0px 1px 1px rgba(0,0,0,0.5), 0px 1px 0px rgba(255,255,255,0.2);
	box-shadow: inset 0px 1px 1px rgba(0,0,0,0.5), 0px 1px 0px rgba(255,255,255,0.2);
}

.chkTaps:after {
	content: 'OFF';
	font: 12px/26px Arial, sans-serif;
	color: #fff;
	position: absolute;
	right: 10px;
	z-index: 0;
	font-weight: bold;
	text-shadow: 1px 1px 0px rgba(255,255,255,.15);
	
}

.chkTaps:before {
	content: 'ON';
	font: 12px/26px Arial, sans-serif;
	color: #fff;
	position: absolute;
	left: 10px;
	z-index: 0;
	font-weight: bold;
	
}

.chkTaps label {
	display: block;
	width: 34px;
	height: 20px;
	
	-webkit-border-radius: 50px;
	-moz-border-radius: 50px;
	border-radius: 50px;

	-webkit-transition: all .4s ease;
	-moz-transition: all .4s ease;
	-o-transition: all .4s ease;
	-ms-transition: all .4s ease;
	transition: all .4s ease;
	cursor: pointer;
	position: absolute;
	top: 3px;
	left: 3px;
	z-index: 1;

	-webkit-box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.3);
	-moz-box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.3);
	box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.3);
	background: #fcfff4;

	background: -webkit-linear-gradient(top, #f00 0%, #f00 40%, #f00 100%);
	background: -moz-linear-gradient(top, #f00 0%, #f00 40%, #f00 100%);
	background: -o-linear-gradient(top, #f00 0%, #f00 40%, #f00 100%);
	background: -ms-linear-gradient(top, #f00 0%, #f00 40%, #f00 100%);
	background: linear-gradient(top, #f00 0%, #f00 40%, #f00 100%);
	
	/*background: -webkit-linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
	background: -moz-linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
	background: -o-linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
	background: -ms-linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
	background: linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);*/
	
	
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f00', endColorstr='#f00',GradientType=0 );
}

.chkTaps input[type=checkbox]:checked + label {
	left: 43px;
}

/* END chkTaps */

/* BEGOM chkDies */
.chkDies {
	width: 80px;
	height: 26px;
	background: #333;
	

	-webkit-border-radius: 50px;
	-moz-border-radius: 50px;
	border-radius: 50px;
	position: relative;

	-webkit-box-shadow: inset 0px 1px 1px rgba(0,0,0,0.5), 0px 1px 0px rgba(255,255,255,0.2);
	-moz-box-shadow: inset 0px 1px 1px rgba(0,0,0,0.5), 0px 1px 0px rgba(255,255,255,0.2);
	box-shadow: inset 0px 1px 1px rgba(0,0,0,0.5), 0px 1px 0px rgba(255,255,255,0.2);
}

.chkDies:after {
	content: 'OFF';
	font: 12px/26px Arial, sans-serif;
	color: #fff;
	position: absolute;
	right: 10px;
	z-index: 0;
	font-weight: bold;
	text-shadow: 1px 1px 0px rgba(255,255,255,.15);
	
}

.chkDies:before {
	content: 'ON';
	font: 12px/26px Arial, sans-serif;
	color: #fff;
	position: absolute;
	left: 10px;
	z-index: 0;
	font-weight: bold;
	
}

.chkDies label {
	display: block;
	width: 34px;
	height: 20px;
	
	-webkit-border-radius: 50px;
	-moz-border-radius: 50px;
	border-radius: 50px;

	-webkit-transition: all .4s ease;
	-moz-transition: all .4s ease;
	-o-transition: all .4s ease;
	-ms-transition: all .4s ease;
	transition: all .4s ease;
	cursor: pointer;
	position: absolute;
	top: 3px;
	left: 3px;
	z-index: 1;

	-webkit-box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.3);
	-moz-box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.3);
	box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.3);
	background: #fcfff4;

	background: -webkit-linear-gradient(top, #aaa 0%, #aaa 40%, #aaa 100%);
	background: -moz-linear-gradient(top, #aaa 0%, #aaa 40%, #aaa 100%);
	background: -o-linear-gradient(top, #aaa 0%, #aaa 40%, #aaa 100%);
	background: -ms-linear-gradient(top, #aaa 0%, #aaa 40%, #aaa 100%);
	background: linear-gradient(top, #aaa 0%, #aaa 40%, #aaa 100%);
	
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#aaa', endColorstr='#aaa',GradientType=0 );
}

.chkDies input[type=checkbox]:checked + label {
	left: 43px;
}

/* END chkDies */

/* BEGIN chkGages */
.chkGages {
	width: 80px;
	height: 26px;
	background: #333;
	

	-webkit-border-radius: 50px;
	-moz-border-radius: 50px;
	border-radius: 50px;
	position: relative;

	-webkit-box-shadow: inset 0px 1px 1px rgba(0,0,0,0.5), 0px 1px 0px rgba(255,255,255,0.2);
	-moz-box-shadow: inset 0px 1px 1px rgba(0,0,0,0.5), 0px 1px 0px rgba(255,255,255,0.2);
	box-shadow: inset 0px 1px 1px rgba(0,0,0,0.5), 0px 1px 0px rgba(255,255,255,0.2);
}

.chkGages:after {
	content: 'OFF';
	font: 12px/26px Arial, sans-serif;
	color: #fff;
	position: absolute;
	right: 10px;
	z-index: 0;
	font-weight: bold;
	text-shadow: 1px 1px 0px rgba(255,255,255,.15);
	
}

.chkGages:before {
	content: 'ON';
	font: 12px/26px Arial, sans-serif;
	color: #fff;
	position: absolute;
	left: 10px;
	z-index: 0;
	font-weight: bold;
	
}

.chkGages label {
	display: block;
	width: 34px;
	height: 20px;
	
	-webkit-border-radius: 50px;
	-moz-border-radius: 50px;
	border-radius: 50px;

	-webkit-transition: all .4s ease;
	-moz-transition: all .4s ease;
	-o-transition: all .4s ease;
	-ms-transition: all .4s ease;
	transition: all .4s ease;
	cursor: pointer;
	position: absolute;
	top: 3px;
	left: 3px;
	z-index: 1;

	-webkit-box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.3);
	-moz-box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.3);
	box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.3);
	background: #fcfff4;

	background: -webkit-linear-gradient(top, #006699 0%, #006699 40%, #006699 100%);
	background: -moz-linear-gradient(top, #006699 0%, #006699 40%, #006699 100%);
	background: -o-linear-gradient(top, #006699 0%, #006699 40%, #006699 100%);
	background: -ms-linear-gradient(top, #006699 0%, #006699 40%, #006699 100%);
	background: linear-gradient(top, #006699 0%, #006699 40%, #006699 100%);
	
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#006699', endColorstr='#006699',GradientType=0 );
}

.chkGages input[type=checkbox]:checked + label {
	left: 43px;
}

/* END chkGages */

.sizelist{
	height:55%;
	/*height:calc(100% - 220px);*/
	width:120px;
	overflow:auto;
	margin-top: 10px;
	margin-left:auto;
	margin-right:auto;
}

.sizelistitem{
	background-color:#003a70;
	border:2px;
	border-color:#aaa;
	padding-top:1px;
	padding-bottom:1px;
	text-align:center;
	height:30px;
	width:80px;
}	

.sizelistitem a{
	text-decoration:none;
	color:#fff;
}

.catlistItemList h3{
	padding-top:10px;
	padding-left:10px;
	color:#000;
	font-size: 1.25em;
}

/*.catlistItemList tr:nth-child(even){
	background-color:#ddd;
}*/

.itemrow td{
	vertical-align: middle;
}

.catlistItemList .itemrow:hover{
	cursor:pointer;
}

.catlistItemList .description{
	padding-left: 10px;
	width:225px;
	font-size:.9em;
	color:#f00;
}

.catlistItemList .descriptionDIE{
	padding-left: 10px;
	width:225px;
	font-size:.9em;
	color:#aaa;
}

.catlistItemList .descriptionGAGE{
	padding-left: 10px;
	width:225px;
	font-size:.9em;
	color:#006699;
}

.catlistItemList .gh{
	width:35px;
	font-size:.9em;
	text-align:center;
	color:#000;
}

.catlistItemList .classoffit{
	width:60px;
	font-size:.9em;
	text-align:center;
	color:#000;
	padding-left: 15px;
}

.catlistItemList .flutes{
	width:90px;
	font-size:.9em;
	text-align:center;
	color:#000;
}

.catlistItemList .edpplug{
	width:70px;
	font-size:.9em;
	text-align:center;
	color:#000;
	padding-left: 10px;
}

.catlistItemList .edpbottom{
	width:80px;
	font-size:.9em;
	text-align:center;
	color:#000;
	padding-left: 10px;
}

.catlistItemList .morearrow{
	width:35px;
	padding-left: 10px;
}

input[type=checkbox] {
	visibility: hidden;
}

@media only screen and (min-width : 781px) {
	#ctlBox {
		  /*position: fixed;*/
		  /*margin-top: -70px;*/
		  float:right;
		  z-index: 999;
		  overflow-y: auto;
		  width: 130px;
		  opacity:1;
		  height:100%;
		  display:inline-block;
		  /*right:0;
		  top:0;
		  margin:0;
		  height: calc(100% + 60px);
		  padding-bottom: 60px;*/
		  
		  
		  /*border-color: #eee;
		  border-style:solid;
		  border-width:2px;*/
		  
		  /*margin-top: Calc(-100% - 132px);*/
		  
		  
		  
		  /*top: 0px;
		  right: 0px;*/
		  
		  opacity: 1;
		  /*padding: 20px 0px;*/
		  height: 100%;
		  /*max-height: 1024px;*/
		  /*max-height:calc(100% - 200px);*/
		  background-color: #003a70;
		  color: #eeeeee;
		  transition: all 350ms cubic-bezier(0.6, 0.05, 0.28, 0.91);
		}
	
	.page{
		margin-right: 130px;
	}
}


@media only screen and (max-width : 632px) {
	.gh{
		display:none;
	}
}
@media only screen and (max-width : 568px) {
	.classoffit{
		display:none;
	}
}
@media only screen and (max-width : 504px) {
	.flutes{
		display:none;
	}
}
@media only screen and (max-width : 405px) {
	.edpplug{
		display:none;
	}
	.edpbottom{
		display:none;
	}
	.catlistItemList .morearrow{
		padding-left: 100px;
	}
}