/**
 * Table of Contents
 *
 * 1.0 - google
 * 2.0 - global
 * 3.0 - login
 * 4.0 - header
 * 5.0 - bucket
 * 6.0 - main
 * 7.0 - footer
 * 8.0 - 
 * 0.0 - media queries
 */

/**
 * 1.0 - google
 * ---------------------------------------------------------- */

/**
 * 2.0 - global 
 * ---------------------------------------------------------- */
 body {
	 background-color: #f2f2f2;
	 margin:0px;
 }
 h1 {
	 font-size: 2em;
 }
.align-left		{text-align: left !important;}
.align-center	{text-align: center !important;}
.align-right	{text-align: right !important;}

.shadow {
	box-shadow: 0 5px 10px 0 rgba(0, 0, 0, 0.2), 0 7px 22px 0 rgba(0, 0, 0, 0.19);
}
.white-bg {
	background-color: #FFFFFF;
}
.box-left, .box-right {
	float:left;
	width: 50%;
}
hr.dashboardline {
	border-top: 1px solid #333333;;
	width: 90%;
	margin: 0px auto;
	line-height: 14px;

}
.pad-top-5 {
	padding-top: 3%;
}
.pad-right-3 {
	padding-right: 3%;
}
label {
	font-size: 12px;
}
.pad-bottom-5 {
	padding-bottom: 5%;
}
.no-border {
	border:0px;
}
.select-border {
	border: 1px #E5E5E5 solid;
	border-radius: 3px;
}
.select-options {
	padding-left: 10% !important;
	line-height:18px !important;
	color: #333333;
}
.order_headers, .order_detail_headers {	
	border: 1px #F2F2F2 solid;
	border-radius: 3px;
	background-color: #6699cc;
	font-size: 1.125em;
	color: #FFFFFF;
	letter-spacing: 1px;
}
.order_headers {
	padding: 2%;
	
}
.order_detail_headers {
	padding: 1%;
}
.add-btn {
	border: 1px #EBEBEB solid;
	border-radius: 3px;
	font-size: .75em !important;
	float: right;
	margin-left: 10px;
	color: #EBEBEB;
}
.add-btn:hover {
	border: 1px #FFFFFF solid;
	color: #FFFFFF;	
}
#order_ship_to {
	text-align:right; 
	margin-bottom: 5px;
}
#order_details2 {
	height: 40px !important;
	padding-top: 10px;
	padding-left: 1.5%;
	margin-top: 3%;
	margin-bottom: 1%;
}
.product_thumb {
	width:100px;
	height: auto;
}
.product_thumb2 {
	width:100px;
	height: auto;
}
#psearch {
	width:300px;
	height: 36px;
	border: 1px #808080 solid;
	border-radius: 3px;
}

.btn-psearch {
	height: 36px;
	padding-top: .5%;
	padding-bottom: .5%;
	border-radius: 3px;
	border: 1px #EBEBEB solid;
	padding-left: 3%;
	padding-right: 3%;

}
#this_order {
	min-height: 600px;
	border: 1px #808080 solid;
	border-radius: 3px;
	background-color: #E3E3E3;
	padding: 3%;
}
.qty {
	width: 50px;
	height: 34px;
	margin-top: 2px;
}
.btn-add {
	border: 1px #808080 solid;
	border-radius: 3px;
	background-color: transparent;
	color: #333333;
	font-size: 14px;
	margin-bottom: 4px;
}
.remove_link {
	color: red;
	text-decoration: underline;
	cursor: pointer;
}
.showhide {
	width:100px;
	height:24px;
	font-size: 12px;
	border: 1px #bfbfbf solid;
	border-radius: 5px;
	float: right;
}
#final-order td {
	padding: 1.5%;
}
.desc {
	/* width:40%; */
}
.qupp {
	width:90px;
}
.names {
	font-weight:700;
}
/**
 * 3.0 - login
 * ---------------------------------------------------------- */
 #login-left {
	 height: 100vh;
	 background-color: #3366cc;
 }
#login-logo {
	padding-top:30%;
}

#loginForm {
	width: 33%;
	margin-left: 33%;
	margin-top: 25%;
}

.acct_login {
	color:#3366cc;
	font-weight: 700;
	text-transform: uppercase;
	font-size: 28px;
	padding-bottom: 15px;
}

.login_links {
	padding-top: 20px;
	font-size: 12px;	
}


/* home page */

.show-account {
	width: 100px;
	height: 36px;
	border-radius: 5px;
	border: 1px solid #808080;
}
.search-for {
	width: 100px;
	height: 36px;
	border-radius: 5px;
	border: 1px solid #808080;	
}
.search-sku {
		width: 180px;
	height: 36px;
	border-radius: 5px;
	border: 1px solid #808080;
}
.search-btn {
	height: 40px;
	background-color: rgba(3, 3, 3, 0.1); /* #0080ff; */
	border: 1px #808080 solid;
	border-radius: 5px;
	color: #333333;
}
.search-btn:hover {
	background-color: #0040ff;
	color: #FFFFFF;
	box-shadow: 0 5px 10px 0 rgba(0, 0, 0, 0.2), 0 7px 22px 0 rgba(0, 0, 0, 0.19);
}





/**
 * 5.0 - main
 * ---------------------------------------------------------- */
#main {
		background-color: #f2f2f2;
		width:90%;
		min-height: 100vh;
		margin: 0px auto;
}
/** 
 * 6.0 - header
 * ---------------------------------------------------------- */
#header {
	height: 100px;
	background-color:#FFFFFF;
	margin: 1% .25% 1% .25%;
	box-shadow: 0 5px 10px 0 rgba(0, 0, 0, 0.2), 0 7px 22px 0 rgba(0, 0, 0, 0.19);
	border-radius: 12px;
}
.header-logo {
	width: 280px;
	height: auto;
	padding-top: 3%;
}
.navbar {
	padding-top: 20px;
	padding-left: 40px;
	width: 100% !important;
	margin:0px auto;	
}
.navbar-nav {
	width: 100% !important;
	margin:0px auto;
}
.nav-item {
	margin-left: 16px;
	text-transform: uppercase;
}
.nav-link {
	text-align: center;
}

.nav-item .mdi {
	font-size: 18px;
}
/* - search form  */
#searchform{
	padding-top:24px;
	padding-left: 14px;
}
#search-field {
	height: 40px;
	border-radius: 5px;
	border: 1px #808080 solid;
	padding-left: 7px;
	width: 79%;
}

#search-submit {
	margin-left:0px;
	height: 40px;
	background-color: rgba(3, 3, 3, 0.1); /* #0080ff; */
	border: 1px #808080 solid;
	border-radius: 5px;
	color: #333333;
	width: 20%;
}
#search-submit:hover {
	background-color: #0040ff;
	color: #FFFFFF;
	box-shadow: 0 5px 10px 0 rgba(0, 0, 0, 0.2), 0 7px 22px 0 rgba(0, 0, 0, 0.19);
}

/* - user account */
.user-account {
	padding-top: 15px;
	text-align: right;
}
#user-info {
	float:left;
}

#user-image {
	float:left;
}

#profile-image {
	border-radius: 50%;
	border: 1px #b3b3b3 solid;
	height: 60px;
	width: auto;
}
#current-user-name {
	font-size: 14px;
}
.top-icons {
	font-size: 1.5em;
}
/** 
 * 7.0 - dashboard
 * ---------------------------------------------------------- */
 
/* - dashboard buttons */


.dashboard-box {
	box-shadow: 0 5px 10px 0 rgba(0, 0, 0, 0.2), 0 7px 22px 0 rgba(0, 0, 0, 0.19);
	background-color: #FFFFFF;
	padding: 1%;
	min-height: 200px;
	border-radius: 12px;
}
.chart-boxes:hover {
	background-color: #efeff5;
	cursor: pointer;
	transition: 0.25s ease-in 20ms;		
}
.bottom-content {
	line-height: 46px;
}
.dashboard-box-1 {
	margin: 4.25%;
}
.dashboard-box-2 {
	margin: 0%;
}
.dashboard-box-3 {
	margin: 4%;
}

.dashboard-row-1 {
	margin-top: 30px;
}
.dashboard-row-2 {
	margin-top: 30px;
}
.dashboard-row-3 {
	margin-top: 30px;
}

#neworder {
	margin-bottom: 30px;
}
.add-icon {
	font-size: 16px;
}
.box-left, .box-right {
	float: left;
}
	
.box-right {
	text-align: left;
	padding-top: 5%;
	padding-right: 3%;
	font-size: .9em;
	padding-bottom: 3%;
}	
	
.charts-graphs {
	width: 110px;
	height: auto;
	padding: 5%;
}



/** 
 * 8.0 - stage
 * ---------------------------------------------------------- */
#stage {
	padding-top: 1%;
	;
}
.order-entry {
	padding-top: 1%;
	padding-left: 2%;
	padding-right: 2%;
	padding-bottom: 1%;
	min-height: 80vh
}



/** 
 * 9.0 - footer
 * ---------------------------------------------------------- */
#footer {
	margin-bottom: 5%;
	margin-top: 3%;
}

#footer_nav a {
	color: #333333;
	font-size: .74em;
	text-decoration: none;
}
#footer_nav a:hover {
	text-decoration: underline;
}


/** 
 * 0.0 - media queries
 * ---------------------------------------------------------- */
 
 // Small devices (landscape phones, 576px and up)
@media (min-width: 576px) {
	
}

// Medium devices (tablets, 768px and up)
@media (min-width: 768px) {
	
}

// Large devices (desktops, 992px and up)
@media (min-width: 992px) {
	
}

// X-Large devices (large desktops, 1200px and up)
@media (min-width: 1200px) {
	
}

// XX-Large devices (larger desktops, 1400px and up)
@media (min-width: 1400px) {
	
}





/* end */
