@charset "UTF-8";

/*************
* defaultCSS *
**************/
/*
Version: 2.001
*/
/* ////////////////////////////////////////////////// */
/* -===== Typography =====- */
/* Default */
body {
	overflow-x: hidden;
	font-family: Avenir;
}

html {

	line-height: 145%;
	color: #2a2a2a;
}

h1,
.h1,
h2,
.h2,
h3,
.h3 {}

h4,
.h4,
h5,
.h5,
h6,
.h6 {}

body .oc-main-sam-calculator {}


/* Sizes */
@media only screen {

	/* small */
	h1,
	.h1 {
		font-size: 2em;
	}

	h2,
	.h2 {
		font-size: 1.8em;
	}

	h3,
	.h3 {
		font-size: 1.6em;
	}

	h4,
	.h4 {
		font-size: 1.4em;
	}

	h5,
	.h5 {
		font-size: 1.2em;
	}

	h6,
	.h6 {
		font-size: 1em;
		text-decoration: none;
	}

	b .sliderCTA {
		font-size: 1.25em;
		text-transform: uppercase;
		font-weight: 700;
	}

	p,
	a {
		font-size: 1em;
		text-decoration: none;
	}

	p {
		padding-bottom: 7px;
	}
}

@media only screen and (min-width: 40.063em) {

	/* medium */
	h1,
	.h1 {
		font-size: 2.25em;
	}

	h2,
	.h2 {
		font-size: 2.025em;
	}

	h3,
	.h3 {
		font-size: 1.8em;
	}

	h4,
	.h4 {
		font-size: 1.575em;
	}

	h5,
	.h5 {
		font-size: 1.35em;
	}

	h6,
	.h6 {
		font-size: 1.125em;
	}

	.sliderCTA {
		font-size: 2em;
		text-transform: uppercase;
		font-weight: 700;
	}

	p,
	a {
		font-size: 1em;
		text-decoration: none;
	}

	p {
		padding-bottom: 12px;
	}
}

@media only screen and (min-width: 64.063em) {

	/* large */
	h1,
	.h1 {
		font-size: 2.5em;
	}

	h2,
	.h2 {
		font-size: 2em;
	}

	h3,
	.h3 {
		font-size: 1.75em;
	}

	h4,
	.h4 {
		font-size: 1.5em;
	}

	h5,
	.h5 {
		font-size: 1.25em;
	}

	h6,
	.h6 {
		font-size: 1.25em;
	}

	.sliderCTA {
		font-size: 2.5em;
		text-transform: uppercase;
		font-weight: 700;
	}

	p,
	a {
		font-size: 1em;
		text-decoration: none;
	}

	p {
		padding-bottom: 12px;
	}

}

p:last-child {
	padding-bottom: 0
}

/* Styles */
.bold {
	font-weight: 700;
}

.italic {
	font-style: italic;
}

.uc {
	text-transform: uppercase;
}

.underline {
	text-decoration: underline;
}

em {
	font-style: italic;
}

sub,
sup {
	font-size: .75%;
	line-height: 0;
	position: relative;
	vertical-align: baseline;
}

sub {
	bottom: -0.25em;
}

sup {
	top: -0.5em;
}

.sliderDiv {
	background-color: #1A1A1A;
	padding: 15px 25px 15px 25px;
	display: inline-block;
	opacity: .75;
}

.linkStyle {
	color: #C80000;
}

.linkStyle:hover {
	color: #000000;
}

.rubik {}

/* ////////////////////////////////////////////////// */
/* -===== Colors =====- */
/* Default */
html {
	color: #333333;
}

.whiteHex {
	list-style-image: url(/wp-content/uploads/2017/09/white-hexagon-bullet.png);
	padding-right: 5px;
}

.whiteHex li a {
	color: #ffffff;
	text-decoration: none;

	-webkit-transition: .5s all;
	-o-transition: .5s all;
	transition: .5s all;
}

.whiteHex li a:hover {
	color: #C80000;
}

.redHex {
	list-style-image: url(/wp-content/uploads/2017/09/red-hexagon-bullet.png);
	padding-right: 5px;
}

.before-arrow {
	position: relative;
	padding-left: 30px;
}

.before-arrow::before {
	content: "";
	height: 20px;
	width: 20px;
	position: absolute;
	left: 0;
	top: 10px;
	background-image: url('/wp-content/uploads/2017/09/right-point.png');
	background-repeat: no-repeat;
	margin-left: 12px;
}

/* Text */
.white {
	color: #ffffff;
}

.lGray,
.lGrey {
	color: #cccccc;
}

.gray,
.grey {
	color: rgba(0, 0, 0, .382);
}

.dGray,
.dGrey {
	color: rgba(0, 0, 0, .618);
}

.black {
	color: #000000;
}

.red {
	color: #C80000;
}

/* Background */
.bgWhite {
	background-color: #ffffff;
}

.bgLGray,
.bgLGrey {
	background-color: #cccccc;
}

.bgGray,
.bgGrey {
	background-color: #777777;
}

.bgGray2,
.bgGrey2 {
	background-color: #CFCFCF;
}

.bgDGray,
.bgDGrey {
	background-color: #333333;
}

.bgBlack {
	background-color: #000000;
}

.bgRed {
	background-color: #C80000;
}

.sheetMetalBg {
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center center;
	background-attachment: fixed;
}

.whiteTrans {
	background-color: #ffffff;
	opacity: .9;
	padding: 25px;
}

#header.whiteTrans {
	padding-top: 0px;
	padding-bottom: 5px;
}

@media (max-width:625px) {
	#header.whiteTrans {
		padding: 0px;
	}
}

#header.solid-header {
	background-color: #ffffff;
	opacity: 1;
	border-bottom: 2px solid #C80000;
	-webkit-transition: .25s all;
	-o-transition: .25s all;
	transition: .25s all;
}

.metalMesh {
	background-size: cover;
	background-position: center center;
	background-repeat: no-repeat;
}

.subPgHero {
	background-size: cover;
	background-position: center center;
	background-repeat: no-repeat;
	min-height: 200px;
}

.subPgHero-fast {
	/*background-size: cover;*/
	/*background-position:  center center;
	background-repeat: no-repeat;
	min-height: 200px;*/
}

.titlePad {
	padding-top: 170px;
	padding-bottom: 50px;
}

@media (max-width: 1024px) {
	.titlePad {
		padding-top: 220px;
	}
}

@media (max-width: 420px) {
	.titlePad {
		padding-top: 130px;
	}
}

.bgMetalTexture {
	background-size: cover;
	background-position: center center;
	background-repeat: no-repeat;
	background-attachment: fixed;
}

.ctaBg {
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center center;
}

.thank-you {
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center center;
}

/* ////////////////////////////////////////////////// */
/* -===== Buttons =====- */
/* Default */
/*a {color:rgba(11,111,222,.8);}
a:visited {color:rgba(11,111,222,.618)}
a:hover {color:rgba(11,111,222,1);}
/* Solid */
a.btnSolidWhite {
	display: inline-block;
	color: #333333;
	background-color: #ffffff;
	margin: .25em;
	padding: .75em 1.5em;
	-webkit-transition: .25s all;
	-o-transition: .25s all;
	transition: .25s all;
}

a.btnSolidWhite:hover {
	color: #ffffff;
	background-color: #333333;
}

/**/
a.btnSolidBlack {
	display: inline-block;
	color: #ffffff;
	background-color: #000000;
	margin: .25em;
	padding: .75em 1.5em;
	text-decoration: none;
	-webkit-transition: .25s all;
	-webkit-transition: .5s all;
	-o-transition: .5s all;
	transition: .5s all;
}

a.btnSolidBlack:hover {
	color: #000000;
	background-color: #ffffff;
}

/**/
a.btnSolidBlue {
	display: inline-block;
	color: #ffffff;
	background-color: #0020E1;
	margin: .25em;
	padding: .75em 1.5em;
	text-decoration: none;
	-webkit-transition: .25s all;
	-webkit-transition: .5s all;
	-o-transition: .5s all;
	transition: .5s all;
}

a.btnSolidBlue:hover {
	color: #ffffff;
	background-color: #C80000;
}

/**/
a.btnSolidRed {
	display: inline-block;
	color: #ffffff;
	background-color: #C80000;
	margin: .25em;
	padding: .75em 1.5em;
	text-decoration: none;
	-webkit-transition: .25s all;
	-webkit-transition: .5s all;
	-o-transition: .5s all;
	transition: .5s all;
}

a.btnSolidRed:hover {
	color: #C80000;
	background-color: #ffffff;
}

/**/
a.btnSolidDGray,
a.btnSolidDGrey {
	display: inline-block;
	color: #ffffff;
	background-color: #333333;
	margin: .25em;
	padding: .75em 1.5em;
	-webkit-transition: .25s all;
	-o-transition: .25s all;
	transition: .25s all;
}

a.btnSolidDGray:hover,
a.btnSolidDGrey:hover {
	color: #333333;
	background-color: #ffffff;
}

/* Ghost */
a.btnGhostWhite {
	display: inline-block;
	color: #ffffff;
	background-color: transparent;
	border: 1px solid #ffffff;
	margin: .25em;
	padding: .75em 1.5em;
	-webkit-transition: .25s all;
	-o-transition: .25s all;
	transition: .25s all;
}

a.btnGhostWhite:hover {
	color: #333333;
	background-color: #ffffff;
	-webkit-transition: .25s all;
	-o-transition: .25s all;
	transition: .25s all;
}

/**/
a.btnGhostDGray,
a.btnGhostDGrey {
	display: inline-block;
	color: #333333;
	background-color: transparent;
	border: 1px solid #333333;
	margin: .25em;
	padding: .75em 1.5em;
	-webkit-transition: .25s all;
	-o-transition: .25s all;
	transition: .25s all;
}

a.btnGhostDGray:hover,
a.btnGhostDGrey:hover {
	color: #ffffff;
	background-color: #333333;
	-webkit-transition: .25s all;
	-o-transition: .25s all;
	transition: .25s all;
}

/* /////////// alignmnet ////////////// */
@media (max-width:1024px) {
	.med-text-left {
		text-align: left;
	}
}

/* ////////////////////////////////////////////////// */
/* -===== Header =====- */
#header {
	position: fixed;
	top: 0;
	height: auto;
	width: 100%;
	z-index: 15;
}

.topInformation {
	text-align: right;
}

#topBar {
	display: inherit;
}

@media (max-width:1024px) {
	.topInformation {
		text-align: center;
	}
}

a.topTele {
	color: #C80000;
	font-size: 1.25em;
	text-decoration: none;
	padding-right: 10px;
	-webkit-transition: .5s all;
	-o-transition: .5s all;
	transition: .5s all;
}

a.topTele:hover {
	color: #000000;
}

a.btnQuote span.icon {
	padding-left: 50px;
	padding-right: 5px;
	background-image: url(/wp-content/uploads/2017/09/mail-icon.png);
	background-repeat: no-repeat;
}

a.btnQuote {
	display: inline-block;
	color: #ffffff;
	background-color: #0020E1;
	margin: .25em;
	padding: .75em 1.5em;
	text-decoration: none;
	-webkit-transition: .25s all;
	-webkit-transition: .5s all;
	-o-transition: .5s all;
	transition: .5s all;
}

a.btnQuote:hover {
	color: #ffffff;
	background-color: #000000;
}

@media (max-width: 645px) {
	a.btnQuote {
		margin-bottom: 10px;
	}
}

/* ////////////////////////////////////////////////// */
/* -===== Slider =====- */
.slideContainer {
	position: relative;
	z-index: 1;
}

.slideContainer .slideBG {
	position: relative;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
}

.mobileSlideBg {
	display: none;
}

@media (max-width:645px) {
	.slideBg {
		display: none;
	}

	.mobileSlideBg {
		display: inherit;
		position: relative;
		background-size: cover;
		background-position: center center;
		background-repeat: no-repeat;
		height: 350px;
	}

	.mobile-table {
		overflow-x: auto;
	}
}

.slideContainer .slideContent {
	position: relative;
	-webkit-transform: translateY(20%);
	-ms-transform: translateY(20%);
	transform: translateY(20%);
	padding: 100px 0;
}

@media (max-width: 645px) {
	.slideContainer .slideContent {
		-webkit-transform: translateY(46%);
		-ms-transform: translateY(46%);
		transform: translateY(46%);
	}
}

@media (max-width: 395px) {
	.slideContainer .slideContent {
		-webkit-transform: translateY(40%);
		-ms-transform: translateY(40%);
		transform: translateY(40%);
	}
}

.sa_owl_theme .owl-nav div {
	top: 60% !important;
}

/* ///// main content area //////////// */
.blackBrdr {
	border: 2px solid #000000;
}

.periodicBadge {
	max-width: 65%;
}

@media (max-width: 645px) {
	.periodicBadge {
		max-width: 40%;
		padding-top: 10px;
		padding-bottom: 10px;
	}
}

a.materialTitle {
	font-size: 1.5em;
	color: #ffffff;
	text-shadow: 0px 0px 4px #000000;
	text-transform: uppercase;
	text-decoration: none !important;
	-webkit-transition: .5s all;
	-o-transition: .5s all;
	transition: .5s all;
}

a.materialTitle:hover {
	color: #000000;
}

@media (max-width: 1024px) {
	a.materialTitle {
		font-size: 1em;
	}
}

.badgeHover {
	opacity: 1;
	-webkit-transition: .5s all;
	-o-transition: .5s all;
	transition: .5s all;
}

.badgeHover:hover {
	opacity: .7;
}

/* /////// industries /////////// */
#industries ul.redHex a {
	color: #000000;
	-webkit-transition: .5s all;
	-o-transition: .5s all;
	transition: .5s all;
}

#industries ul.redHex a:hover {
	color: #C80000;
}

/* ///////// cta //////////// */
.cta {
	padding-top: 30px;
	padding-bottom: 30px;
}

.metalGdnt {
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#dbdbdb+0,878787+23,aaaaaa+49,d6d6d6+78,a8a8a8+100 */
	background: #dbdbdb;
	/* Old browsers */
	/* FF3.6-15 */
	/* Chrome10-25,Safari5.1-6 */
	background: -webkit-gradient(linear, left top, right top, from(#dbdbdb), color-stop(23%, #878787), color-stop(49%, #aaaaaa), color-stop(78%, #d6d6d6), to(#a8a8a8));
	background: -o-linear-gradient(left, #dbdbdb 0%, #878787 23%, #aaaaaa 49%, #d6d6d6 78%, #a8a8a8 100%);
	background: linear-gradient(to right, #dbdbdb 0%, #878787 23%, #aaaaaa 49%, #d6d6d6 78%, #a8a8a8 100%);
	/* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#dbdbdb', endColorstr='#a8a8a8', GradientType=1);
	/* IE6-9 */
	width: 100%;
	height: 5px;
}

/* /////// stock pages /////// */
.stockSupplyTitle {
	color: #ffffff;
	text-transform: uppercase;
	font-size: 1.25em;

}

div.stockSupply {
	background-color: #C80000;
	padding: 20px;
}

@media (max-width: 800px) {
	div.stockSupply {
		height: auto !important;
	}
}

ul.stockSupplies {
	list-style-type: none !important;
	line-height: 2em;
	color: #ffffff;

}

ul.stockSupplies li {
	padding-top: 2px;
	padding-bottom: 2px;
	border-bottom: 1px solid #ffffff;
	font-size: .85em;
}

ul.stockSupplies li:last-child {
	border-bottom: none;
}

.material-stock-supplies {
	display: none;
}

@media (max-width: 800px) {
	.material-stock-supplies {
		display: block;
	}

	#sheet,
	#plate,
	#wire,
	#rod,
	#tubing {
		display: none;
	}
}

.dropbtn {
	background-color: #4CAF50;
	color: white;
	padding: 16px;
	font-size: 16px;
	border: none;
	cursor: pointer;
}

/* Dropdown button on hover & focus */
.dropbtn:hover,
.dropbtn:focus {
	background-color: #3e8e41;
}

/* The container <div> - needed to position the dropdown content */
.dropdown {
	position: relative;
	display: inline-block;
}

/* Dropdown Content (Hidden by Default) */
.dropdown-content {
	display: none;
	position: absolute;
	background-color: #f9f9f9;
	min-width: 160px;
	-webkit-box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
	box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
	z-index: 1;
}

/* Links inside the dropdown */
.dropdown-content a {
	color: black;
	padding: 12px 16px;
	text-decoration: none;
	display: block;
}

/* Change color of dropdown links on hover */
.dropdown-content a:hover {
	background-color: #f1f1f1
}

/* Show the dropdown menu (use JS to add this class to the .dropdown-content container when the user clicks on the dropdown button) */
.show {
	display: block;
}

/* ///////// footer /////////// */
.copyright p {
	color: #ffffff !important;
	font-size: 1em;

}

.footerLink {
	color: #ffffff;
	text-decoration: none;
	font-size: 1em;

	-webkit-transition: .25s all;
	-o-transition: .25s all;
	transition: .25s all;
}

.footerLink:hover {
	color: #C80000;
}

.hoverOpc {
	opacity: 1;
	-webkit-transition: .5s all;
	-o-transition: .5s all;
	transition: .5s all;
}

.hoverOpc:hover {
	opacity: .75;
}

.ctaBtns {
	display: inline-block;
}

@media (max-width: 645px) {
	.ctaBtns {
		display: block;
	}
}

/* ///////// sub pgs ///////////// */
.titleSquare {
	background-color: #000000;
	opacity: .7;
	padding: 17px 35px 5px 35px;
	display: inline-block;
}

@media (max-width: 420px) {
	.titleSquare {
		padding: 17px 10px 5px 10px;
	}
}

.mission {
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center center;
}

.missionQuote {
	font-size: 1.55em;
	font-style: italic;
	font-weight: 700;
	line-height: 1.25em;
	color: #C80000;
}

.card {
	background-color: #ffffff;
	padding: 25px;
	opacity: .8;
	-webkit-box-shadow: 0px 0px 10px #000000;
	box-shadow: 0px 0px 10px #000000;
	border-bottom: 5px solid #000000;
}

/* /////// blog /////// */
.blog-border {
	-webkit-box-shadow: 0 5px 12px rgba(0, 0, 0, .20), 5px 0 12px rgba(0, 0, 0, .15);
	box-shadow: 0 5px 12px rgba(0, 0, 0, .20), 5px 0 12px rgba(0, 0, 0, .15);
	padding: 30px;
}

.blogDate {

	color: #C80000;
}

.blogTitle {

	font-weight: 700;
	text-transform: uppercase;
}

.blogImg {
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center center;
	margin-top: 15px;
	margin-bottom: 5px;
}

#nav-below .nav-next,
.nav-previous {
	display: inline-block;
	text-transform: uppercase;
	font-style: italic;
	color: #333333;
	background-color: transparent;
	border: 1px solid #333333;
	margin: .25em;
	padding: .75em 1.5em;
	-webkit-transition: .25s all;
	-o-transition: .25s all;
	transition: .25s all;
}

#nav-below .nav-next:hover,
.nav-previous:hover {
	color: #ffffff;
	background-color: #333333;
	-webkit-transition: .25s all;
	-o-transition: .25s all;
	transition: .25s all;
}

.entry-title {
	display: none;
}

.entry-date {

	font-style: italic;
	color: #4A4A4A !important;
}

.entry-date::before {
	content: url(/wp-content/uploads/2017/09/red-hexagon-bullet.png);
	margin-right: 5px;
}

.entry-content {
	margin-top: 15px;
	margin-bottom: 20px;
}

.anchor {
	color: #000000;
}

.anchor:hover {
	color: #C80000;
}

/* ////// form ///////// */
.btnSubmit {
	display: inline-block;
	color: #ffffff;
	background-color: #C80000;
	margin: .25em;
	padding: .75em 1.5em;
	text-decoration: none;
	text-transform: uppercase;
	font-style: italic;
	border: 1px solid #C80000;
	-webkit-transition: .25s all;
	-webkit-transition: .5s all;
	-o-transition: .5s all;
	transition: .5s all;
}

.btnSubmit:hover {
	color: #C80000;
	background-color: #ffffff;
	border: 1px solid #C80000;
}

/* ///// tabbed content ///// */
#tab_container {}

/* ///////// custom hidden classes ////////// */
@media (max-width: 1024px) {
	.med-pad-top {
		padding-top: 10px;
	}

	.med-padT20 {
		padding-top: 20px;
	}

	ul {
		margin-bottom: 0px;
	}
}

@media (max-width:645px) {
	.hide-mobile {
		display: none;
	}

	.med-padT20 {
		padding-top: 0px;
	}

	.small-text-center {
		text-align: center;
	}
}

.nopad th {
	padding: 0 !important;
}

.nopad div {
	padding: 10px 0;
}

.bdr-left {
	border-left: 1px solid #ccc;
}

.bdr-right {
	border-right: 1px solid #ccc;
}

.small {
	font-size: .8em
}

@media (max-width: 1024px) {
	.table-wrap {
		width: 100%;
		overflow-x: scroll;
	}

	/*.responsive-table td {
		display:block;	
	}*/
}

@media (max-width: 768px) {
	.responsive-table td:first-child {
		padding: 20px 0 0 0;
	}

	.responsive-table td:last-child {
		padding: 0 0 20px 0;
	}

	.responsive-table .table-title {
		padding: 20px 0 !important;
	}

	.responsive-table .hide-for-small-only {
		display: none !important;
	}

	.responsive-table td {
		display: block;
		text-align: center;
	}

}

/* ///////// other custom items ////////// */
@media (min-width: 600px) and (max-width: 768px) {
	.reveal {
		margin-top: 80px;
	}
}

@media (max-width: 600px) {
	.logo {
		margin-bottom: 10px;
	}
}

body>#alert-bar-msg {
	display: none;
}

/* ///////// chromebook menu and video fix ////////// */
@media (min-width: 800px) and (max-width: 1550px) {
	.navContainer ul.navTemplate a {
		padding: 10px 12px;
		font-size: .9rem;

	}
}

@media (min-width: 600px) and (max-width: 799px) {
	.navContainer ul.navTemplate a {
		padding: 10px 8px;
		font-size: .76rem;

	}
}

.home .reveal {
	top: 120px !important;
}

/* Alert Bar -=-=-=-==-=-=-=-=-=-= */
.alert-bar {
	position: fixed;
	bottom: 0;
	right: 15px;
	width: 400px;
	border-radius: 5px 5px 0 0;
	height: 300px;
	padding: 5px 0;
	font-size: 1.1rem;
	font-weight: 600;
	background: tomato;
	text-align: center;
	display: none;
}

.rem-button {
	padding: 10px 15px;
	display: inline-block;
	color: #fff;
	background: #C80000;
	margin-top: 15px;
}

.rem-button--blue {
	background: #0622D0;
}

@media (max-width: 1024px) {
	.button-row {
		display: none;
	}
}

#fld_548765_1,
#fld_6791303_1 {
	background: url(https://www.rembar.com/wp-content/uploads/2018/03/down-arrow.png);
	background-position: center right 15px;
	background-repeat: no-repeat;
}

#fld_2143863Label::after {
	content: '(Domestic and imported available)';
	font-style: italic;
	color: #666;
}

.hero-bg {
	padding: 140px 0 60px 0;
}

.hero-section {
	background: rgba(26, 26, 26, .5);
	padding: 15px;
	color: #fff;
}

.hero-title {
	padding: 20px;
	color: #fff;
}

.hero-item {
	padding: 10px 0 30px 0;
}

@media (max-width: 1024px) and (min-width: 601px) {
	.hero-bg {
		padding: 165px 0 0 0;
	}
}

@media (max-width: 600px) {
	.hero-bg {
		padding: 74px 0 0 0;
	}

	#video {
		padding-top: 130px;
	}

	.vid-button {
		display: none;
	}
}

@media (max-width: 420px) {
	.hero-bg {
		padding: 74px 0 0 0;
	}
}

/* Calculator =-=-=-=-=-=-=- */
.calculator__materials input[type="radio"],
.calculator__format input[type="radio"] {
	height: 0;
	width: 0;
	opacity: 0;
}

.calculator__materials label,
.calculator__format label {
	font-size: 0.2rem;

	border: 1px solid #B7B7B7;
	background-color: #F9F9F9;
	box-shadow: 0px 1px 4px 0px rgba(0, 0, 0, 0.25) inset, 0px 1px 4px 0px rgba(0, 0, 0, 0.25);
	color: #333;
	font-weight: 900;
	padding: 5px 30px;
	margin: 0 10px 0 0;
	border-radius: 4px;
}

.calculator__materials,
.calculator__format {
	font-size: 0;
	/* margin-top: -0.8rem; */
}

.calculator__materials input:checked+label,
.calculator__format input:checked+label {
	color: #fff;
	border: 1px solid hsla(0, 0%, 100%, .2);
	background-color: hsla(0, 0%, 100%, .2);
	color: #fff;
	-webkit-box-shadow: 0 0 14px hsla(0, 0%, 100%, .25);
	box-shadow: 0 0 14px hsla(0, 0%, 100%, .25);
	background-color: #2F67B3;
	box-shadow: 0px 3px 4px 0px rgba(255, 255, 255, 0.25) inset, 0px 1px 4px 0px rgba(0, 0, 0, 0.25);
}

#calc {
	/* background: rgb(29,0,19);
	background: -webkit-gradient(linear, left top, right top, from(rgba(29,0,19,1)), color-stop(35%, rgba(223,34,34,1)), to(rgba(82,0,0,1)));
	background: -o-linear-gradient(left, rgba(29,0,19,1) 0%, rgba(223,34,34,1) 35%, rgba(82,0,0,1) 100%);
	background: linear-gradient(90deg, rgba(29,0,19,1) 0%, rgba(223,34,34,1) 35%, rgba(82,0,0,1) 100%); */
}

.calculator .title {
	font-size: 28px;
	/* letter-spacing: 1px; */
	color: #333;
	font-weight: 500;

	margin: 0.2rem 0;
}

.input-calc {
	height: 48px;
	width: 146px;
	font-size: 0.24rem;
	border-radius: 3px 0 0 3px;
	display: inline-block;
	vertical-align: top;
}

.calc__units {
	display: inline-block;
	height: 48px;
	width: 62px;
	border-radius: 0 3px 3px 0;
	color: #333;
	opacity: .9;

}

.input-calc::-webkit-input-placeholder {
	color: #D3D3D3;
	opacity: .9;

}

.input-calc:-ms-input-placeholder {
	color: #D3D3D3;
	opacity: .9;

}

.input-calc::-ms-input-placeholder {
	color: #D3D3D3;
	opacity: .9;

}

.input-calc::placeholder {
	color: #D3D3D3;
	opacity: .9;

}

.calc-times {
	font-size: 24px;
	color: #2F67B3;
	font-weight: 600;
	margin: 0 0.1rem;
	vertical-align: middle;
}

.hide-calc {
	display: none !important;
}

.calc__unit-choice {
	height: 0;
	width: 0;
	opacity: 0;
}

.calculator__metric {
	margin-bottom: 15px;
}

.calculator__metric label {
	font-size: .95rem;
	color: #cfcfcf;
}

.calculator__metric label:first-of-type {
	margin-left: -4px;
}

.calculator__results {
	background: #EAF4FF;
	border-radius: 3px 3px 0 0;
	padding: 30px;
	margin-top: 1rem;
	position: relative;
	z-index: 10;
	overflow: hidden;
}

.weight__title {
	font-size: .28rem;
	color: #555;
	display: inline-block;
	text-decoration: none;
	margin-right: 10px;
}

.title--small {
	color: #555;
	font-size: .16rem;
	margin-top: 15px;
}

.results__metal,
.results__format {
	font-size: .2rem;
}

.rehash__text {
	text-transform: capitalize;
}

.rehash__text,
.rehash__svg {
	display: inline-block;
	vertical-align: top;
	width: 40%;
}

.calc-contact {
	display: inline-block;
	margin-top: 60px;
	color: red;
	text-decoration: underline;
}

.reset {
	text-decoration: underline;
	color: #2F67B3;
	display: inline-block;
	padding-top: 10px;
}

.calculator__cta {
	border-radius: 0 0 3px 3px;
	background: #ededed;
	padding: 38px 20px;
	text-align: center;
	position: relative;
	z-index: 5;
	-webkit-transform: translateY(-89px);
	-ms-transform: translateY(-89px);
	transform: translateY(-89px);
	-webkit-transition: .65s;
	-o-transition: .65s;
	transition: .65s;
}

.calculator__cta.cta-open {
	-webkit-animation: slideDown;
	animation: slideDown;
	-webkit-animation-delay: 1s;
	animation-delay: 1s;
	-webkit-animation-fill-mode: forwards;
	animation-fill-mode: forwards;
	-webkit-animation-duration: .66s;
	animation-duration: .66s;
	-webkit-animation-timing-function: ease-in-out;
	animation-timing-function: ease-in-out;
}

.calculator__cta.cta-open .link__wrap {
	background: red;
	width: 60%;
	padding: 10px;
	border-radius: 4px;
	margin: 0 auto;
	transition: .5s all;
}

.calculator__cta.cta-open .link__wrap:hover {
	background: #000000;
}

.calculator__cta.cta-open a {
	color: #ffffff;
	transition: .5s all;
}


@-webkit-keyframes slideDown {
	0% {
		-webkit-transform: translateY(-89px);
		transform: translateY(-89px);
	}

	100% {
		-webkit-transform: translateY(0);
		transform: translateY(0);
	}
}

@keyframes slideDown {
	0% {
		-webkit-transform: translateY(-89px);
		transform: translateY(-89px);
	}

	100% {
		-webkit-transform: translateY(0);
		transform: translateY(0);
	}
}

.calculator__cta a {
	color: red;
	text-decoration: underline;
	font-size: 1.2rem;
}

#total-units:focus {
	-webkit-box-shadow: none;
	box-shadow: none;
}

label[for="total-units"] {
	color: #333;
}

label[for="total-units"],
#total-units {
	display: inline-block;
	letter-spacing: 1px;


	font-size: 1.2rem;
	vertical-align: middle;
}

#total-units {
	width: 90px;
	font-size: 0.2rem;
	background: transparent;
	border: none;
	border-bottom: 1px solid #000;
	box-shadow: none;
	margin-bottom: 0 !important;
}

#total-units::placeholder {
	color: #fff !important;
}

.large-text-right {
	text-align: right;
}

.large-text-left {
	text-align: left;
}

.logo {
	margin-top: -9px;
}

@media (max-width: 600px) {
	.logo {
		margin-top: 0;
		margin-bottom: 0;
		padding: 3px;
		max-height: 45px;
	}

	#topBar {
		padding-top: 0;
		background: #ccc;
	}

	.topInformation {
		position: relative;
		margin: 6px 0;
	}

	a.topTele,
	.topInformation .btnQuote {
		display: inline-block;
		width: calc(50% - 4px);
		margin: 0;
		padding: 0;
		font-size: 1rem;
	}

	.topInformation .btnQuote {
		text-decoration: underline;
		background: transparent;
		color: #111;
	}

	.topInformation .btnQuote .icon {
		display: none;
	}
}

.input__item {
	display: inline-block;
}

.input__item label {
	color: #333;

	margin-bottom: 10px;
}

.hidden-unit {
	display: none;
}

.weight {
	font-size: 48px;
	background: rgba(255, 255, 255, 1);
	/* Old browsers */
	/* background: -webkit-gradient(linear, right top, left top, color-stop(50%, white), color-stop(50%, rgba(255,0,0,.75))); */
	background: -webkit-gradient(linear, right top, left top, color-stop(50%, white), color-stop(50%, #2F67B3));
	background: -o-linear-gradient(right, white 50%, #2F67B3 50%);
	background: linear-gradient(to left, white 50%, #2F67B3);
	background-size: 200% 100%;
	background-position: right bottom;
	-webkit-transition: all 2s ease-in;
	-o-transition: all 2s ease-in;
	transition: all 2s ease-in;
}

.weight.animateWeight {
	-webkit-animation: underlined;
	animation: underlined;
	-webkit-animation-timing-function: ease-in-out;
	animation-timing-function: ease-in-out;
	-webkit-animation-iteration-count: 1;
	animation-iteration-count: 1;
	-webkit-animation-duration: 1s;
	animation-duration: 1s;
	/*animation-fill-mode: forwards;*/
}

@-webkit-keyframes underlined {
	0% {
		background-position: right bottom;
	}

	100% {
		background-position: left bottom;
	}
}

@keyframes underlined {
	0% {
		background-position: right bottom;
	}

	100% {
		background-position: left bottom;
	}
}

/*.toggle__item {
	font-size: 0;
}
.toggle-input:checked + label {
	background: hsla(0,0%,100%,0.2);
	border: 1px solid hsla(0,0%,100%,0.35);
	color: #fff;
}
.toggle__item.toggle--inline {
	display: inline-block;
}
.toggle__item.toggle--inline label {
	color: #333;
	background: hsla(0, 100%, 0%, .1);
	box-shadow: inset 0px 0px 3px 0px hsla(0,100%,0%,.2);
}
.toggle--inline .toggle-input:checked + label {
	background: hsla(0,100%,0%,.3);
}
label.toggle__label {
	margin: 0;
	background: hsla(0,0%,100%,0);
	border: 1px solid hsla(0,0%,100%,0.35);
}
.toggle__item .toggle__label:first-of-type {
	border-radius: 4px 0 0 4px;
	padding: 0 7px;
}
.toggle__item .toggle__label:last-of-type {
	border-radius: 0 4px 4px 0;
	padding: 0 7px;
}*/
/*.toggle__switch {
	height: 20px;
	width: 20px;
	margin: 2px;
	border-radius: 20px;
	background: red;
}
div.toggle {
	padding-left: 20px;
	-webkit-transition: .35s;
	-o-transition: .35s;
	transition: .35s;
}
.toggle {
	display: inline-block;
	width: 44px;
	height: 24px;
	border-radius: 24px;
	background: #fff;
	vertical-align: middle;
}
label[for="imperial"],
label[for="metric"],
label[for="lbs"],
label[for="kgs"] {
	display: inline-block;
	cursor: pointer;
	padding: 3px;
	
}
.toggle label:first-of-type {
	border-radius: 3px 0 0 3px;
}
.toggle label:nth-of-type(2) {
	border-radius: 0 3px 3px 0;
}

.toggle-input {
	display: none;
}*/
.tog__item {
	padding-bottom: 15px;
}

.tog__item.tog--inline {
	display: inline-block;
	padding-bottom: 0;
}

.tog__item label,
.tog__item input {
	display: inline-block;
	vertical-align: middle;
	cursor: pointer;

	color: #555;
}

.tog__item input {
	display: none;
}

.tog__item .tog__switch-bg {
	background: #f2f2f2;
	box-shadow: 0px 3px 4px 0px #E6E6E6 inset, 0px 1px 4px 0px rgba(0, 0, 0, 0.25);
	border-radius: 10px;
	height: 20px;
	width: 40px;
	padding: 2px;
	margin: 0 5px;
}

.tog__switch {
	height: 16px;
	width: 16px;
	border-radius: 8px;
	background: #2F67B3;
	transition: .35s;
	transition-timing-function: ease;
	margin-left: 20px;
}

input.tog__checkbox:checked+label.tog__switch-bg .tog__switch {
	margin-left: 0px;
}

.tog__item--light .tog__switch-bg {
	background: #f2f2f2;
	box-shadow: 0px 3px 4px 0px #E6E6E6 inset, 0px 1px 4px 0px rgba(0, 0, 0, 0.25);
}

.tog__item--light label {
	color: #333;
}

@media (max-width: 1350px) {
	.calculator {
		/* padding: 0 1em; */
	}
}

@media (max-width: 1250px) {
	.input-calc {
		width: 105px;
	}

	#calc-box text.calc1,
	#calc-box text.calc2,
	#calc-box text.calc3 {
		font-size: 24px;
	}
}

@media (max-width: 1023px) and (min-width: 750px) {
	.input-calc {
		width: 146px;
	}
}

@media (max-width: 749px) {
	.input-calc {
		width: 170px;
	}

	.calc-times {
		display: none;
	}

	.tog__label {
		font-size: 12px;
	}

	.rehash__text {
		padding-bottom: 20px;
	}

	.rehash__text,
	.rehash__svg {
		width: 100%;
	}

	.calculator__materials label,
	.calculator__format label {
		font-size: 1rem;
		margin-bottom: 10px;
	}

	.calculator__cta a {
		font-size: 12px;
	}
}

@media (max-width: 768px) {
	.small-margin {
		margin-bottom: 30px;
	}
}

.video-responsive {
	overflow: hidden;
	padding-bottom: 56.25%;
	position: relative;
	height: 0;
}

.video-responsive iframe {
	left: 0;
	top: 0;
	height: 100%;
	width: 100%;
	position: absolute;
}

a.stock,
a.stock:visited {
	color: #FFF;
	transition: color .25s ease-in-out;
}

a.stock:hover {
	color: #bf2026;
}

a.stock2,
a.stock2:visited {
	color: #FFF;
	transition: color .25s ease-in-out;
}

a.stock2:hover {
	color: #bf2026;
}

.view-more-overflow {
	max-height: 450px;
	position: relative;
	overflow: hidden;
}

.view-more-overflow .read-more {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	text-align: center;
	margin: 0;
	background-image: -webkit-gradient(linear,
			left top,
			left bottom,
			color-stop(0, rgba(255, 0, 0, 0)),
			color-stop(1, rgba(255, 0, 0, 100)));

}

@media only screen and (min-width: 760px),
(max-device-width: 768px) and (min-device-width: 1024px) {

	table {
		table-layout: fixed
	}
}

/* Using 800px as mobile screen in this example */
@media(max-width: 800px) {
	table {
		min-width: 800px;
		/* Set your desired min-width here */
	}
}

.svg-link-icon {
	fill: #C80000;
	width: 1rem;
	margin-left: 5px;
}

.oc-main-sam-calculator {
	padding: 0 2.15rem;
}

.oc-main-sam-calculator label {
	font-size: 0.2rem;
}

.oc-main-sam-calculator [type=number] {
	padding: 0.05rem;
}

.oc-main-sam-calculator select {
	padding: 0.1rem;
	font-size: 0.2rem;
	background-position: right 0.05rem center
}

.oc-main-sam-calculator .oc-main-sam-calculator-title {
	text-align: center;
	font-weight: 800;
	font-size: 0.48rem;
	font-family: Avenir;
}

.calculator__dimensions {
	/* margin-top: -0.8rem; */
}

.oc-main-sam-calculator-total {
	margin-top: -0.8rem;
}

.oc-main-sam-calculator-bottom {
	border-top: 1px solid #B7B7B7;
}

.oc-main-sam-calculator-bottom {
	margin-top: 0.3rem;
	padding-top: 0.3rem;
}

.oc-main-sam-calculator-bottom h3 {
	margin-bottom: 0.2rem;
	font-weight: 600;
}

.oc-main-sam-calculator-bottom p {
	color: #666;
}

.oc-main-sam-search-contact {
	margin-top: 0.4rem;
	display: flex;
	align-items: center;
	gap: 0.2rem;
	margin-bottom: 0.5rem;
}

.oc-main-sam-search-contact .contact-text {
	font-size: 0.16rem;
	color: #333;
}

.oc-main-sam-search-contact .contact-icon {
	background-color: var(--Color);
	font-size: 0.2rem;
	color: #fff;
	font-weight: 700;
	min-width: 2rem;
    width:fit-content;
    white-space: nowrap;
	height: 0.6rem;
	border-radius: 0.33rem;
	display: flex;
	justify-content: space-around;
	align-items: center;
	padding: 0 0.2rem;
	cursor: pointer;
	border: 1px solid var(--Color);
}
.oc-main-sam-search-contact .contact-icon span{
    padding-left: 0.1rem;
}
.oc-main-sam-search-contact .contact-icon:hover {
	color: var(--Color);
	background-color: #fff;
}

.oc-main-sam-search-contact .contact-icon:hover svg path {
	fill: var(--Color);
}
.column, .columns {
	padding-right: 0;
	padding-left: 0;
}
.row .row {
	width: 100%;
	margin-right: 0;
	margin-left: 0;
}
.scrollable-list{
    margin-left: 0;
}

/* 小屏pc */
@media screen and (max-width: 1400px) {

	.oc-main-sam-calculator {
		padding: 0.2rem 1.2rem
	}

	.input-calc {
		width: 85px;
	}

	.oc-main-sam-calculator label {
		font-size: 16px;
	}

	.oc-main-sam-calculator select {
		font-size: 15px;
	}

	.oc-main-sam-calculator .oc-main-sam-calculator-title {
		margin-bottom: 10px;
	}

	.oc-main-sam-calculator-bottom p,
	.oc-main-sam-search-contact .contact-text {
		font-size: 15px;
	}
	
	.oc-main-sam-search-contact .contact-icon svg {
        width: 0.4rem;
    }
}
/* ipad和mobile */
@media screen and (max-width: 1025px) {
	.oc-main-sam-calculator {
		padding: 0.3rem; 
	}
	.oc-main-sam-calculator .oc-main-sam-calculator-title {
		text-align: left;
		font-size: 0.36rem;
	}
	.calculator .title {
		font-size: 0.36rem;
	}
	.calculator__materials label,.oc-main-sam-calculator .input-calc-radio{
		width: 47%;
		box-shadow: none;
	}
	.sheet-plate__calcs .input__item {
		width: 100%;
	}
	.sheet-plate__calcs .input__item .input-calc {
		width: 80%;
		margin-bottom: 0;
		font-size: 16px;
	}
	.oc-main-sam-calculator select {
		width: 70px;
		margin-bottom: 0;
		font-size: 16px;
		padding: 10px;
	}
	.oc-main-sam-calculator-total {
		margin-top: 0.3rem;
	}
	.oc-main-sam-calculator-bottom h3 {
		font-size: 16px;
	}
	.calculator__results {
		margin-top: 0.4rem;
		padding: 0.3rem;
	}
	.large-text-left {
		padding-left: 0!important;
	}
	.results__metal ,.results__format{
		font-size: 0.3rem;
	}
	.reset {
		font-size: 0.3rem;
		padding-bottom: 0.2rem;
	}
	.oc-main-sam-search-contact {
        flex-direction: column;
    }

    .oc-main-sam-search-contact .contact-text {
        font-size: 0.2rem;
    }

    .oc-main-sam-search-contact .contact-icon {
        padding: 0.1rem 0.2rem;
        width: 100%;
        border-radius: 0.1rem;
        justify-content: start;
        gap: 0.2rem;
        font-size: 0.2rem;
    }

    .oc-main-sam-search-contact .contact-icon svg {
        width: 0.5rem;
    }
	#total-units {
		font-size: 16px;
	}

}