* {box-sizing: border-box;}
.productsContainer {
	padding-top:40px;
	text-align: center;
}
.productItem {
	border: 5px solid #005079;
	position:relative;
	display: inline-block;
	width:300px;
	height:400px;
	margin:20px 20px 60px;
}
/*.productItem:nth-of-type(n+2) {
	margin-left:20px;
}*/
.productItem .img {
	width:100px;
	padding:10px;
	background:white;
	box-sizing: border-box;
	position: absolute;
	left: 95px;
	top:-55px;
	text-align:center;
	user-select: none;
}
.productItem .img img {
	max-width: 100%;
	max-height:75px;
}
.productItem h2 {
	margin-top:50px;
	color: #005079;
	text-align: center;
	font-size:24px;
}
.productItem .itemDesc {
	position:absolute;
	width:100%;
}
.productItem .itemDesc p {
	margin:10px 10px 0 10px;
	padding:0;
	text-align: left;
}
.productItem .itemDesc .priceContainer {
	margin:10px 10px 0 10px;
	line-height:1.4em;
	text-align: left;
}
.productItem .itemDesc .priceContainer span {
	font-weight: bold;
}

body{min-height:100%;}
form * div { background: #FFF;}
label {font-weight: normal;cursor:pointer;}
.wb-sub-head {
	position: relative;
	padding: 5px 0px 5px 0px;
	margin: 0px;
	color: #fff;
	text-align: left;
}
.wb-sub-head .container {
	max-width: 1000px;
	margin: auto;
}
.wb-sub-head-bg {
	background: #005079;
}
header {display:block}
.clear {
	clear: both;
	margin: 5px 0;
}
.disabled {color: #999;}
.hidden {
	visibility: hidden;
}
.none {
	display: none !important;
}
#accountContainer {clear: both;}

.accountMsgContainer {
	margin-top:8px;
	min-height: 2.4em;
	padding: 0 5px;
}
.quickpayContainer {
	display: flex;
	justify-content: center;
	margin-top:8px;
	min-height: 2.4em;
	padding: 0 5px;
}
.qpHeader, .qpInstruction {
	max-width:600px;
	margin:10px auto;
	padding:0;
}
.qpHeader {
	font-size: 20px;
	font-weight: 600;
}
.qpInstruction {
	font-size: 14px;
}
.inputContainer {
	margin: 10px 3% 0 0;
	padding: 0 5px;
	width: 30%;
	display: inline-block;
	min-width:200px;
}
@media only screen and (max-width: 931px) {
	.inputContainer {
		width: 46% !important;
	}
	#accountContainer div {
		display: block;
		margin: 10px auto;
	}
	#accountContainer input {
		display: inline-block;
	}
	#accountContainer {text-align: center;}
	#accountContainer input[type=button] {

	}
}
@media only screen and (max-width: 475px) {
	.inputContainer {
		width: 94% !important;
	}
	#accountContainer input {
		display: block;
		margin: 10px auto;
	}
}
.inputContainer input , .inputContainer select {
	width:100%;
	font-size:16px;
}
.inputContainer input , .inputContainer select, #circUpdateContainer div input, #circUpdateContainer div select {
	height: 2.2em;
	padding:0 10px;
}
@-moz-document url-prefix() {
	.inputContainer select, #circUpdateContainer div select {
		padding:0 5px;
	}
}

.jobFuncContainer {
	padding-left:10px;
	margin: 10px 0;
}

.streetContainer {
	clear: both;
}

.jobFuncCol {
	width: 210px;
	margin-right:5%;
	float:left;
}
.jobFuncCol input[name=function_oth_text] {
	max-width: 140px;
	padding: 3px;
	margin-top: -3px;
}
.fade-enter-active, .fade-leave-active {
	transition: opacity .5s;
}
.fade-enter, .fade-leave-to /* .fade-leave-active below version 2.1.8 */ {
	opacity: 0;
}
.fade-height {
	overflow: hidden;
}
.fadeHeight-enter-active,
.fadeHeight-leave-active {
	transition: all .5s;
	max-height: 230px;
}
.fadeHeight-enter,
.fadeHeight-leave-to
{
	opacity: 0;
	max-height: 0;
}

.emailContainer {
	position:relative;
}

.amtContainer {
	position: relative;
}
.amtContainer input{
	padding-left:15px;
}
.amtContainer:before {
	content: '$';
	position: absolute;
	left:10px;
	top:5px;
	font-weight: bold;
}
.pwdToggle {
	position:absolute;
	height:20px;
	width:20px;
	right:12px;
	top:8px;
}
.pwdToggleHide {
	background: url('/img/visibleEye.png');
}
.pwdToggleShow {
	background: url('/img/hiddenEye.png');
}
.jobFuncCol label {
	display: inline-block;
	width: 100%;
	font-size: 0.9em;
	line-height: 1em;
	cursor: pointer;
}
/*body {background: silver;}*/
#app {
	margin:0px auto;
	/*padding: 15px;*/
	background: white;
	color: black;
	font-size: 16px;
}
#manageApp {
	max-width:800px;
	margin:auto;
	box-sizing: border-box;
	padding: 15px;
}
:disabled {background: #ccc;opacity: .5;}

#billingContainer {
	max-width: 400px;
	margin: 20px auto;
}
#addARContainer {
	max-width: 400px;
	margin: 20px auto;
}
#card-element {
	border: 1px solid #CCC;
	font: 14px Helvetica;
}
.promoText {
	font-size:.9em;
}
.promoHead {
	font-weight:bold;
}
.promoSubHead {
	font-size:.9em;
	margin:10px 0;
}
.promoSubToday {
	margin:10px 0;
	font-size:.9em;
	color: darkred;
	font-weight:bold;
}
#billingContainer .packDesc,#addARContainer .packDesc, .promoIntro * .packDesc {
	display: block;
    text-align: right;
}
#billingContainer .price, #addARContainer .price  {
    display: inline-block;
}
#billingContainer .price span:after, #addARContainer .price span:after, .promoIntro * .packDesc span:after  {
	content: "$";
}
.arAgreement {
	margin:12px auto;
	max-width:600px;
	font-size:.9em;
}
#app * input, #app * select {
	border:1px solid;
	border-radius: 3px;
}
#app * input.error, #app * select.error {
	border-color: darkred;
}
#app * input[type='text']:focus, #app * select:focus {
	border-color: cornflowerblue;
	box-shadow: 0 0 5px cornflowerblue;
}
a {cursor: pointer}
.btnContainer {
	position:absolute;
	bottom:10px;
	text-align:center;
	width:100%;
	padding:0 10px;
	user-select: none;
}
.btnContainer div {
	margin-top:10px;
}
#app * .btnContainer input, .btnContainer button, .btnContainer a.button, input.button {
	font-size: 11pt;
	margin:0 20px;
	border-radius: 0px !important;
	padding:5px 10px 2px;
	cursor: pointer;
	display: inline-block;
	background-color: #005079;
	border: 1px solid #005079;
	color: #EEE;
	min-width:135px;
}
#app * .btnContainer input[type=button],
#app * .btnContainer a.checkbox {
	background-size: 14px 14px;
	background-repeat: no-repeat;
	background-position: 8px 10px;
	padding-left: 30px;
	background-image: url(/images/icons/uncheckedCheckbox.svg);
}
transition {background:white;}
#app * .btnContainer input[type=button].selected,
#app * .btnContainer a.checkbox.selected {
	background-image: url(/images/icons/checkedCheckbox.svg);
}
#app * .btnContainer *:nth-child(2) {
	margin-top:10px;
}
.btnContainer * {
	display:block;
}
.btnContainer *.std {
	display: inline-block;
}
#app * input[type=Submit], #app * input.login, #app * input[type=button] {
	background: #005079;
	color: #FFF;
	letter-spacing: .1em;
	padding:8px 10px;
	border: none;
	cursor: pointer;
	margin: 5px auto;
	font-size:11pt;
}
#app * input[type=Submit] {
	display: block;
	margin:15px auto;
}



div.inputContainer select, #manageApp #circUpdateContainer div select {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	background: #FFF url('https://winebusinessanalytics.com/wbsubs/img/downArrow.svg') 98% center no-repeat ;
	background-size: contain;
	/*background-position: right;
	background-repeat: no-repeat;*/
}
.inputContainer select:disabled {
	background-color: #CCC;
	color: #666;
	border-color:#222;
}
.companyNameContainer {
	position:relative;
}
.companyNameLookup {
	position:absolute;
	z-index: 100;
	border:1px solid;
	border-radius: 3px;
}
.error, #card-errors {color: red;}
.companyNameLookup label {
	padding:5px 5px 3px;
	border-top:1px solid;
	width:100%;
	display: inline-block;
	font-weight:normal;
	cursor: pointer;
}
.companyNameLookup label.highlight,.companyNameLookup label:hover  {
	color:#FFF;
	background-color: #0096ce;
}
#existingSubs {font-size:14px}

#existingSubs div {
	margin:0;
	text-align: left;
}
.subsSubHead {

	font-size:.9em;
}

a:hover {text-decoration: none;}
input[disabled] {pointer-events:none}
.showLoading {
	position:fixed;
	top:50%;
	left:50%;
	margin-top:-75px;
	margin-left:-75px;
	height:150px;
	width:150px;
	text-align: center;
	z-index: 900;
}
#manageApp #billingContainer input[type=submit], #manageApp #addARContainer input[type=submit]{
	display:inline-block;
}
.productsViewTotal {
    margin-top:-50px !important;
    text-align:right;
    padding:0 30px;
}
.OrderTotal {
    font-weight:bold
}
@media only screen and (max-width: 1095px) {
    .productsViewTotal {
        text-align:center;
    }
}
.acctInfoTotal {
    text-align:right;
    display: block;
    margin-right:30px;
}
.acctInfoTotal div span {
    display: inline-block;
    width: 37px;
}
#manageApp #billingContainer, #manageApp #addARContainer, #manageApp #optOutContainer, #manageApp #renewContainer, #manageApp #circUpdateContainer, #manageApp #passwordContainer, #alertContainer {
	position:fixed;
	top:50%;
	left:50%;
	margin-top: -150px;
	margin-left: -160px;
	height: auto;
	width: 320px;
	background: white;
	border: 1px solid #999;
	border-radius: 5px;
	z-index: 800;
	padding: 15px;
}
#alertContainer {
	margin-top: -50px;
	min-height: 100px;
	height:auto;
}
#manageApp #circUpdateContainer {
	height: 450px;
	margin-top:-225px;
}
#manageApp #circUpdateContainer div input,#manageApp #circUpdateContainer div select {
}
#manageApp #passwordContainer div.inputContainer {
	width:100%;
}
#manageApp #passwordContainer div input,#manageApp #passwordContainer div select {
	width: 100%;
}
#manageApp #circUpdateContainer div select, #manageApp #circUpdateContainer div input {
	margin:5px;
	width:45%;
}
#manageApp #circUpdateContainer .full select {
	width:90%;
}
.requiredInput {
	border-color: firebrick;
}
.requiredInput::placeholder {
	color: firebrick;
}
.requiredInput:-ms-input-placeholder {
	color: firebrick;
}
.requiredInput::-ms-input-placeholder {
	color: firebrick;
}
@media only screen and (min-width: 420px) {
	#manageApp #billingContainer, #manageApp #optOutContainer, #manageApp #renewContainer, #manageApp #circUpdateContainer, #manageApp #addARContainer, #manageApp #passwordContainer {
		margin-top: -140px;
		margin-left: -200px;
		height: auto;
		width: 400px;
	}
	#manageApp #renewContainer {
		height: 240px;
		margin-top:-120px;
	}
	#manageApp #circUpdateContainer {
		height: 360px;
		margin-top:-160px;
	}
}
.subInfo + .subInfo {
	margin-top:15px !important;
}
.showLoading img {width:100%;z-index:1000;}
.overlayEverything {position: fixed;z-index: 800;background: #000;opacity: .5;height: 100%;width: 100%;top: 0;left:0;}
.modalBG {z-index: 700; }