@font-face {
	font-family: 'icomoon';
	src:url('/assets/fonts/icomoon.eot?8qynif');
	src:url('/assets/fonts/icomoon.eot?#iefix8qynif') format('embedded-opentype'),
		url('/assets/fonts/icomoon.woff?8qynif') format('woff'),
		url('/assets/fonts/icomoon.ttf?8qynif') format('truetype'),
		url('/assets/fonts/icomoon.svg?8qynif#icomoon') format('svg');
	font-weight: normal;
	font-style: normal;
}

[class^="icon-"], [class*=" icon-"] {
	font-family: 'icomoon';
	speak: none;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	line-height: 1;

	/* Better Font Rendering =========== */
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

.icon-home:before {
	content: "\e600";
}
.icon-barcode:before {
	content: "\e601";
}
.icon-cart:before {
	content: "\e602";
}
.icon-envelope:before {
	content: "\e603";
}
.icon-user:before {
	content: "\e604";
}
.icon-meter:before {
	content: "\e605";
}
.icon-checkmark:before {
	content: "\e606";
}
.icon-cross:before {
	content: "\e607";
}
.icon-minus:before {
	content: "\e608";
}
.icon-plus:before {
	content: "\e609";
}
.icon-download:before {
	content: "\e60a";
}
.icon-disk:before {
	content: "\e60b";
}
.icon-pencil:before {
	content: "\e60c";
}
.icon-trash:before {
	content: "\e60d";
}

/* Page Styles
================================ */

* {
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
body {
	font-family: 'Open Sans', 'sans-serif';
	color: #222;
	background-color: #edeff0;
}
ul {
	list-style: none;
}
a, a:hover, a:link {
	text-decoration: none;
	transition: all 0.2s ease-in-out;
}
.clearfix:before, .clearfix:after {
    content: "";
    display: table;
}
.clearfix:after {
    clear: both;
}
.clearfix {
    zoom: 1; /* For IE 6/7 (trigger hasLayout) */
}
/* Global
================================ */
p, h1, h2, h3, h4, h5, h6 {
	margin: 0;
	padding: 0;
	outline: none;
}
.grid-container {
	padding-left: 10px;
	padding-right: 10px;
	margin-left: auto;
	margin-right: auto;
}
.btn {
	display: inline-block;
	padding: 6px 12px;
	margin-bottom: 0;
	font-size: 0.875em;
	font-weight: 400;
	line-height: 1.4em;
	text-align: center;
	white-space: nowrap;
	vertical-align: middle;
	cursor: pointer;
	background-image: none;
	border: 1px solid transparent;
	transition: all 0.2s ease-in-out;
	-webkit-border-radius: 4px;
	border-radius: 4px;
}
.btn:hover {
	text-decoration:none;
}
.btn-lg{
	padding: 10px 16px;
	font-size: 1.125em;
	line-height: 1.33;
	border-radius: 6px;
}
.btn-sm {
	padding: 3px 4px;
	font-size: 0.8em;
	line-height: 1;
	border-radius: 2px;
}
.btn-primary {
	color: #fff;
	background-color: #428bca;
	border-color: #357ebd;
}
.btn-wht {
	color: #999;
	background-color: #DDD;
	border-color: #888;
}
.btn-primary:hover {
	color: #DDD;
	background-color: #327bba;
}
.btn-success {
	color: #fff;
	background-color: #5cb85c;
	border-color: #4cae4c;
}
.btn-success:hover {
	color: #DDD;
	background-color:#449d44;
	border-color:#398439
}

.btn-submit {
	color: #fff;
	background-color: #F15F43;
	padding: 12px 30px;
	text-transform: uppercase;
	border: none;
}
.btn-submit:hover {
	background-color: #5F43F1;
}

.confrm, .confrm-red, .confrm-green {
	font-size: 16px;
	background: #64D800;
	text-decoration: none;
	border: 2px solid black;
	border-radius: 4px;
	padding: 0 2px;
	color: white;

	-moz-box-shadow:    3px 3px 4px 0 #ccc;
	-webkit-box-shadow: 3px 3px 4px 0 #ccc;
	box-shadow:         3px 3px 4px 0 #ccc;
	margin-right: 5px;
	margin-top: 2px;
}
.confrm:hover {
	background: #418C00;
	text-decoration: none;
}
.confrm-red{
	background: #D80000;
}
.confrm-red:hover {
	background: #A80000;
	text-decoration: none;
}
.confrm-green{
	background: #00D800;
}
.confrm-green:hover {
	background: #00A800;
	text-decoration: none;
}


.input-url, .input-text, .input-textarea, .input-email, .input-password {
	border: 1px solid #ccc;
	border-radius: 4px;
	padding: 6px 12px;
	font-size: 0.75em;
	color: #101010;
	width: 100%;
	-webkit-transition: border-color ease-in-out .3s, -webkit-box-shadow ease-in-out .3s;
	transition: border-color ease-in-out .3s, box-shadow ease-in-out .3s;
}
.textbox {
	width: 100%;
	height: 90px;
}
.halfshade{
	background: #E8E8E8;
}
.tip {
	z-index: 999;
	display: none;
	position: absolute;
	border-radius: 3px;
	padding-top: 5px;
	padding-bottom: 5px;
	padding-left: 8px;
	color: #BBBBBB;
	background: #505050;
	font-size: 0.9em;
	font-weight: 500;
}
label span {
	float: right;
	padding: 3px 8px;
	margin-right: 5px;
	margin-top: 2px;
	font-weight: 900;
	color: #BBBBBB;
	background: #505050;
}
.mt-form {
	padding: 10px 0;
}

.share-facebook, .share-twitter, .share-googleplus {
	font-size: 1.5em;
	padding: 1px 5px;
}
.share-facebook {
	color: #3b5998;
}
.share-facebook:hover {
	color: #6d84b4;
}
.share-twitter {
	color: #00aced;
}
.share-twitter:hover {
	color: #1dcaff;
}
.share-googleplus {
	color: #d34836;
}
.share-googleplus:hover {
	color: #a31806;
}

.page-header{
	background: #70DC70;
	min-height: 50px;
	width: 100%;
	padding-top: 5px;
	padding-bottom: 5px;
	text-align: center;
	vertical-align: middle;
}
.page-header h3 {
	padding-top: 10px;
	margin: 0;
}
.page-header h4 {
	padding-top: 10px;
	margin: 0;
}
.header-wht {
	background: #ffffff;
}

.title {
	text-align: center;
}
.small-text {
	font-size: 0.6em;
	text-align: center;
}

.page-subheader {
	padding: 10px 0;
}

.tagline {
	font-weight: 900;
	font-style: italic;
}

.link-desc {
	font-size: 80%;
	display: block;
	margin-bottom: 10px;
}
.image200 {
	width: 200px;
	height: 200px;
}

/* POPOUT
==============*/
.popout {
	bottom: 50px;
	left: 0;
	position: fixed;
	z-index: 20;
	border-radius: 0 5px 5px 0;
	background: #111;
	color: #eee;
	width: 50px
}
.popout-inner, .popout-inner-jq {
	padding: 10px;
}
.popout-inner-jq {
	display: none;
}
.popout a:link {
	color: #99F;
}
.popout a:visited {
	color: #E9B;
}
.popout a:hover {
	font-size: 120%;
}

/* FORMS
================================ */
#formErrSummary, .error {
	color: red;
	font-weight: 700;
}
.form-inp {
	margin-top: 20px;
}
.form-submit {
	margin-bottom: 20px;
}
#insert_pun_title, #insert_pun_tags {
	margin-bottom: 20px;
}
#insert_pun_title, .photo-upload-box {
	margin-top: 10px;
}
.input-text {
	margin: 5px 0;
}

.add-butt {
	padding: 2px 5px;
	border-radius: 4px;
	margin-left: 5px;
	text-decoration:none;
	color: white;
}
.add-butt:hover {
	border: 1px solid black;
}
.add-butt {
	border: 1px solid #007000;
	background: #007000;
}
.custom-combobox {
	position: relative;
	display: inline-block;
}
.custom-combobox-toggle {
	position: absolute;
	top: 0;
	bottom: 0;
	margin-left: -1px;
	padding: 0;
}
.custom-combobox-input {
	margin: 0;
	padding: 5px 10px;
}
.input-desc {
	font-size: 80%;
	color: #303090;
	margin-bottom: 5px;
}




.modal-close {
	position: absolute;
	top: 5px;
	right: 5px;
	padding: 1px 3px;
	background: red;
	color: white;
	border: 2px solid black;
	border-radius: 50%;
	font-size: 16px;
}

.modal-close-sq {
	position: absolute;
	top: 0px;
	right: 0px;
	padding: 1px 3px;
	color: white;
	background: #A00;
	font-size: 16px;
}
.modal-close-sq:hover {
	background: #F00;
}


#div_brand, #div_ret, #div_cat, #div_p_det, #div_linker, #div_new_product {
	display: none;
	position: absolute; /* makes the div go into a position that’s absolute to the browser viewing area */
	left: 46%; /* positions the div half way horizontally */
	top: 46%; /* positions the div half way vertically */
	padding: 25px;
	border: 2px solid black;
	background-color: #ffffff;
	width: 250px;
	height: 250px;
	z-index: 501;
	font-size: 75%;
}
#div_cat {
	left: 46%;
	top: 20%;
	width: 300px;
	height: 450px;
}
#div_linker {
	left: 26.5%;
	top: 20%;
	width: 800px;
	height: 600px;
}
#div_new_product {
	z-index: 601;
	left: 40%;
	top: 25%;
	width: 500px;
	height: 400px;
}
#div_new_product input {
	width: 75%;
	margin: 3px 0 3px 6px;
}
.new-prod-img-prvw-cont {
	margin-top: 5px;
}
#ajax_gif {
	display: none;
	position: absolute; /* makes the div go into a position that’s absolute to the browser viewing area */
	left: 46%; /* positions the div half way horizontally */
	top: 46%; /* positions the div half way vertically */
	padding: 25px;
	border: 2px solid black;
	background-color: #ffffff;
	width: 150px;
	height: 150px;
	z-index: 501;
}
#fade {
	display: none;
	position: absolute;  /* makes the div go into a position that’s absolute to the browser viewing area */

	/* makes the div span all the way across the viewing area */
	left: 0;
	top: 0;
	right: 0;
	bottom: 0;

	background-color: black;
	-moz-opacity: 0.7; /* makes the div transparent, so you have a cool overlay effect */
	opacity: .70;
	filter: alpha(opacity=70);
	width: 100%;
	height: 150%;
	z-index: 500;
}
#img_pvw {
	display: none;
    position: absolute;
    background: #EEEFEB;
	-moz-opacity: 0.7; /* makes the div transparent, so you have a cool overlay effect */
	opacity: .70;
	filter: alpha(opacity=70);
	width: 200px;
	height: 200px;
	padding: 0;
	margin: 0;
	z-index: 666;
	-webkit-box-shadow: 0px 0px 5px 0px rgba(164, 164, 164, 1);
	box-shadow: 0px 0px 5px 0px rgba(164, 164, 164, 1);
}

/* Croppic
================================ */
#uplFileName{
	display: none;
}
#imageCroptastic {
	width: 200px;
	height: 200px;
	position:relative; /* or fixed or absolute */
}


/* Layout Element Colors
================================ */

.main-header {
	background-color: #384047;
	z-index: 1000;
	background-image: -ms-linear-gradient(0deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0.05) 65%, rgba(255,255,255,0.15) 90%);
	background-image: -o-linear-gradient(0deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0.05) 65%, rgba(255,255,255,0.15) 90%);
	background-image: linear-gradient(0deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0.05) 65%, rgba(255,255,255,0.15) 90%);
}
.main-nav a             { background-color: #00356A; }

.main-nav li .action-nav { background-color: #005500; }

.main-nav li .upload-nav { background-color: #bf0000; }

.main-logo a            { background-color: #35006A; }

.primary-content        { background-color: #caebf6; }

.main-footer            { background-color: #b7c0c7; }

.main-nav a, .main-logo a {
	background-image: -ms-linear-gradient(0deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0.3) 75%, rgba(255,255,255,0.4) 75%);
	background-image: -o-linear-gradient(0deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0.3) 75%, rgba(255,255,255,0.4) 75%);
	background-image: linear-gradient(0deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0.3) 75%, rgba(255,255,255,0.4) 75%);
	-webkit-box-shadow: 5px 5px 5px 0px rgba(0,0,0,0.4);
	-moz-box-shadow: 5px 5px 5px 0px rgba(0,0,0,0.4);
	box-shadow: 5px 5px 5px 0px rgba(0,0,0,0.4);
}



/* Main Layout
================================ */

.main-header {
	padding: 10px;
}
.main-logo a, .main-nav a {
	display: block;
	color: white;
	text-decoration: none;
	text-align: center;
	border-radius: 4px;
	position: relative;
	overflow: hidden;
}
.main-logo a {
	padding: 1px;
}
.main-nav a {
	padding: 4px 6px;
}
.main-nav a::before {
	font-family: 'icomoon';
  	content: attr(data-icon);
	color: #fff;
	position: absolute;
	top: 3px;
	left: -35%;
	transition: .4s;
	font-weight: 400;
	font-size: 135%;
}
.main-nav a:hover::before {
	left: 10%;
}
.main-footer {
	text-align: center;
	padding-top: 2px;
	padding-bottom: 2px;
}
.mobile-nav {
	display: none;
}
.mobile-button {
	display:block;
	position:absolute;
	right: 20px;
	top: 11px; /*this will need moving when the log is applied*/
	width:35px;
	background-color: #2f9f50;
	padding: 2px 7px 2px 6px;
	border:1px solid #1f8f40;
	border-radius:3px;
	z-index: 300;
}
.mobile-button:hover {
	cursor:pointer;
}
.mobile-button span {
	display:block;
	margin:4px 0px 4px 0px;
	height:2px;
	background:white;
	width:20px;
}
.linker-sku-cont {
	width: 100%;
}
.linker-sku-ret-tn-cont, .linker-sku-title-cont {
	float: left;
}
.linker-sku-img-cont{
	float: right;
}
.linker-sku-img {
	width: 100px;
}
.linker-sku-title-cont {
	padding: 5px 0 0 3px;
}
.linker-sku-title {
	font-size: 130%;
	font-weight: 700;
}
.linker-search-cont{
	width:100%;
}
.ui-autocomplete { 
	position: absolute;
	cursor: default;
	z-index:99999 !important;
}
.linker-table {
	height: 80%;
	overflow: auto;
}

.linker-add-product {
	float:right;
	position: absolute;
	top: 5px;
	right: 35px;
	padding: 1px 7px;
	background: #393;
	color: white;
	border: 2px solid black;
	border-radius: 50%;
	font-size: 16px;
}
.linker-add-product:hover {
	background: #5A5;
}

/* WELDRICKS
================================ */
.menubar-img {
	width: 100px;
}
.date {
	font-size: 0.8em;
}
.price {
	font-weight: 700;
}
.table-title {
	font-weight: 700;
	color: white;
}




/* Media Queries
================================ */

@media (min-width: 1px) and (max-width: 767px) {
	.main-header {
		width: 100%;
	}
	.main-nav li {
		margin-top: 5px;
	}
	.main-nav li:first-child {
		margin-top: 0;
	}
	.grid-container > [class^="grid-"] {
		padding-top: 5px;
		padding-bottom: 5px;
	}
	.hide-mobile {
		display: none;
	}
	.mobile-nav {
		display:block;
	}
	.main-banner {
		display: none;
	}
	.main-item {
		display: none;
	}
}

@media (min-width: 768px) {

	body {
		padding-top: 60px;
	}

	/* Header and Banner Layout
	================================ */

	.main-header {
		position: fixed;
		top: 0;
		width: 100%;
		height: 60px;
	}
	.main-nav {
		display: -webkit-flex;
		display: flex;
		height: 100%;
		margin: 0;
	}
	.main-nav li {
		margin: 0 4px;
		-webkit-align-self: center;
		align-self: center;
		-webkit-flex-grow: 1;
		flex-grow: 1;
		transition: .5s;
	}
	.main-nav li:hover:not(.main-logo) {
		-webkit-flex-grow: 2;
		flex-grow: 2;
	}
	.main-logo:first-child {
  		margin-right: 30px;
	}
	.main-banner {
		background: #dfe2e4;
		text-align: center;
		padding: 30px 6px;
		display: block;
		width: 100%;
	}
	.main-logo a, .main-nav a {
		font-size: 0.8em;
	}

	/* Column Layout
	================================ */

	.grid-container > [class^="grid-"] {
		float: left;
		min-height: 1px;
		padding-left: 10px;
		padding-right: 10px;
		margin-left: 2%
	}
	.grid-container > [class^="grid-"]:first-child {
		margin-left: 0;
	}
	.grid-container > [class^="grid-"]:last-child {
		float: right;
	}

	/* Columns are 65px wide with 20px gutters (1000px)
	========================================== */

	.grid-1 {
		width: 6.5%;
	}
	.grid-2 {
		width: 15%;
	}
	.grid-3 {
		width: 23.5%;
	}
	.grid-4 {
		width: 32%;
	}
	.grid-5 {
		width: 40.5%;
	}
	.grid-6 {
		width: 49%;
	}
	.grid-7 {
		width: 57.5%;
	}
	.grid-8 {
		width: 66%;
	}
	.grid-9 {
		width: 74.5%;
	}
	.grid-10 {
		width: 83%;
	}
	.grid-11 {
		width: 91.5%;
	}
	.grid-12 {
		width: 100%;
	}

	/* Clearfix
	================================ */
	.grid-container:after {
		content: " ";
		display: table;
		clear: both;
	}

	/* Imagery
	================================ */

	.feat-img {
		width: 50%;
		float: left;
		margin-right: 25px;
	}


	/* Styles
	================================ */

}

@media (min-width: 1200px) {
	.grid-container {
		max-width: 1100px;
	}

	/* Header and Banner Layout
	================================ */

	.main-nav li {
		margin-left: 8px;
		margin-right: 8px;
	}
	.main-logo:first-child {
  		margin-right: 50px;
	}
	.main-logo a, .main-nav a {
		font-size: 1em;
	}


}

