/* OVERALL STYLES */
body,
.x-body {
	background-color: #FFFFFF;
	width: 1080px;
	font-family: Arial, sans-serif;
	font-size: 12px;
	margin: auto;
}

body.auto-width {
	display: table;
	width: 100%;
}

.col {
	float: left;
	box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	padding: 0 15px;
}

.col-nopad {
	float: left;
	box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
}

.group:after {
	content: '';
	display: table;
	clear: both;
}

.lg-1 {
	width: 8.33%;
}

.lg-2 {
	width: 16.67%;
}

.lg-3 {
	width: 25%;
}

.lg-4 {
	width: 33.33%;
}

.lg-5 {
	width: 41.67%;
}

.lg-6 {
	width: 50%;
}

.lg-7 {
	width: 58.33%;
}

.lg-8 {
	width: 66.67%;
}

.lg-9 {
	width: 75%;
}

.lg-10 {
	width: 83.33%;
}

.lg-11 {
	width: 91.67%;
}

.lg-12 {
	width: 100%;
	padding-left: 15px;
	padding-right: 15px;
	box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	clear: both;
}

.lg-hide {
	display: none;
}

.inner-row {
	margin-left: -15px;
	margin-right: -15px;
}

.left,
.pull-left {
	float: left;
}

.right,
.pull-right {
	float: right;
}

.clear {
	clear: both;
	overflow-x: hidden;
	overflow-y: hidden;
	height: 0;
	margin: 0;
	padding: 0;
}

.align-left {
	text-align: left;
}

.align-right {
	text-align: right;
}

.align-center {
	text-align: center;
}

.section-content {
	margin: 30px 0;
}

.margin {
	margin: 0 auto;
}

.pad {
	padding-top: 5px;
	padding-bottom: 5px;
}

.b-pad {
	padding-bottom: 15px;
}

#highlight-table {
	padding: 0 10px;
}

/* INPUT STYLES */
input,
select,
textarea {
	cursor: pointer;
}

input:hover,
input:selected {
	border: 1px solid #dd1d21;
}

#form-fields {
	background-color: #FBCE07;
	margin-bottom: 6px;
}

#form-fieldsgray {
	background-color: #D9D9D9;
	margin-bottom: 6px;
}

#form-fields .padding {
	padding: 20px 10px;
}

#form-fields p {
	line-height: 14px;
	margin-bottom: 3px;
	font-size: 12px;
}

#form-fields input[type="text"],
input[type="password"],
#form-fields select {
	border: 1px solid #D9D9D9;
	line-height: 16px;
	font-size: 12px;
}

#form-fields input[type="text"],
input[type="password"] {
	margin-bottom: 6px;
	width: 198px;
	padding: 0 3px;
	font-size: 12px;
}

#form-fields select {
	margin-bottom: 16px;
}

input[type="checkbox"] {
	width: 20px;
	padding: 10px;
	margin: 5px;
	cursor: pointer;
	color: #ffffff;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
}

.button-image{
	background: none;
	border: none;
}

.button-cls {
	background-color: #dd1d21;
	padding: 15px 25px;
	color: #fff;
	-webkit-transition-duration: .2s;
	font-size: 14px;
	font-weight: bold;
	border: none;
}

.button-cls:hover {
	background-color: #ffffff;
	color: #dd1d21;
	border: 1px solid #dd1d21;
	font-size: 14px;
	font-weight: bold;
	text-decoration: none;
}

.button-cls span {
	color: #fff;
}

.button-utility {
	background-color: #dddddd;
	padding: 1em;
	border: 1px solid #D9D9D9;
}

.button-utility:hover {
	color: black;
}

.clsButton {
	background-color: #dd1d21;
	padding: 3px 5px;
	color: #ffffff !important;
	-webkit-transition-duration: .2s;
	font-size: 12px;
	border: 1px solid #D9D9D9;
}

.clsButton:hover {
	background-color: #D9D9D9;
	border: 1px solid #ffffff;
}

/* TEXT AND BG STYLES */
h1 {
	font-size: 30px;
	line-height: 46px;
	
}

h2 {
	font-size: 20px;
	color: #dd1d21;
	margin: 1em 0;
}

h3 {
	font-size: 16px;
	color: #dd1d21;
}

h3.yellow-bg {
	background: #FBCE07;
	text-align: center;
	padding: 0.75em 10px;
	margin: 15px auto;
	text-transform: uppercase;
}

h4{
	font-size: 15px;
}

h4.gray-bg {
	background: #A6A6A6;
	color: #000000;
	text-align: center;
	font-size: 13px;
	padding: 0.75em 10px;
	margin: 15px auto;
}

h5{
	font-size: 14px;
}

.text2 {
	font-size: 13px;
	font-weight: bold;
}

.text3 {
	font-size: 18px;
	font-weight: bold;
}

.text4 {
	font-size: 13px;
	font-weight: 100;
}

.text5 {
	font-size: 13px;
	color: #003C88;
	font-weight: bold;
}

.text6 {
	font-size: 30px;
	font-weight: bold;
	color: #ffffff;
}

.text7 {
	font-size: 22px;
	font-weight: bold;
	color: #000000;
}

.text8 {
	font-size: 13px;
	font-weight: 500;
	color: #FFFFFF;
}

.text9 {
	font-size: 18px;
	font-weight: bold;
	color: #000000;
}

.textrest {
	font-size: 14px;
	color: #003C88;
	font-weight: bold;
}

.textblue {
	font-size: 13px;
	font-weight: bold;
	color: #0033C88;
}

.textsmall {
	font-size: 12px;
	font-weight: bold;
}

.textsmall1 {
	font-size: 8px;
	font-weight: bold;
}

a {
	cursor: pointer;
	text-decoration: none;
	color: #404040;
	font-size: 14px;
	font-weight: bold;
	
}

a:hover {
	font-size: 14px;
	font-weight: bold;
	text-decoration: underline;
	color: #DD1D21;
}

a img {
	border: none;
}

.valid {
	color: green;
}

.error {
	color: #dd1d21;
}

.secondary-accent-color {
	color: #7F7F7F;
}

.small {
	font-size: 0.85em;
}

.yellow-bg{
	background: #FBCE07;
}

.alternate-row,
.rowt {
	background-color: #D9D9D9;
}

/* MENU STYLES */
.nav {
	float: left;
	width: 214px;
	margin: 0;
	padding: 1em;
}

#menu {
	
	float: right;
	margin: 3px 0 0 3px;
	position: relative;
}

#menu a {
	text-align: right;
	margin: 0 0 0 3px;
}
/* HEADER STYLE */

#header {
	width: 100%;
	background-color: #FFFFFF;
	margin-bottom: 10px;
}

#header2 {
	width: 35%;
	background-color: #FBCE07;
	text-align: center
}

#header3 {
	width: 50%;
	background-color: #FBCE07;
	text-align: center
}

#header h1 {
	color: #404040;
	padding: 0 10px;
	float: left;
	padding-top: 30px;
	text-align: left;
	font-weight: normal
}

#header-links {
	float: right;
	padding-top: 12px;
}

#header-links a {
	color: #404040;
	font-size: 14px;
	font-weight: bold;
	margin-left: 15px;
	text-align: right;
	border: none
}

#header-links a:hover {
	text-decoration: underline;
	color: #DD1D21;
}

#header-links2 {
	float: right;
	padding-top: 25px;

}

#header-links2 a {
	color: #404040;
	font-size: 14px;
	font-weight: bold;
	line-height: 12px;
	margin-left: 15px;
	text-align: right;
	border: none
}

#header-links2 a:hover {
	text-decoration: underline;
	color: #FBCE07;

}

#homepage #header {
	background-color: #ffffff;
	margin: 0;
	padding: 5px 5px;
}

#homepage #header h1 {
	padding-top: 10px;
	color: #404040;
}

/* TABLE STYLES */
table{
	font-size: 13px;
}

.table-wrapper {
	overflow-x: auto;
}

.table.full-width {
	overflow-x: auto;
}

.table tr:first-child td {
	border: none;
}

.table th {
	padding-left: 10px;
	padding-right: 10px;
	font-weight: bold;
}

.table td {
	border-top: 1px dotted #595959;
	padding-left: 10px;
	padding-right: 10px;
}

.table td.item {
	padding-top: 10px;
	padding-bottom: 10px;
}

.table.report thead {
	background: #F7CC17;
}

/* PAGINATION STYLES */
.pagination {
	text-align: left;
}

.pagination ul {
	padding: 0;
	list-style: none;
	display: inline-block;
	-webkit-border-radius: 2px;
	border-radius: 2px;
	overflow: hidden;
	font-size: 0.9em;
}

.pagination li {
	display: inline;
}

.pagination li:first-child .page-button {
	border-left: 1px dotted #595959;
}

.page-button {
	padding: 8px 15px;
	border: 1px dotted #595959;
	border-left: none;
	float: left;
}

a.page-button {
	color: #000000;
}

a.page-button:hover {
	text-decoration: none;
	background: #eeeeee;
}

.page-button.current {
	background: #FBCE07;
	color: #dd1d21;
}

/* PAGE STYLES */
#main {
	border: 1px solid #F7F7F7;
	border-top: none;
}

.product-search {
	background: #FBCE07;
}

.product-container {
	margin-left: 214px;
	padding: 15px;
	overflow: hidden;
}

.product-container input {
	height: 28px;
}

.results-box {
	width: 825px;
	float: right;
}

.input-image {
	width: 179px;
	height: 30px;
	font-size: 18px;
	border: 1px solid grey;
	float: left;
}
.button-red {
	background-color: #DD1D21;
	padding: 10px 18px;
	color: #ffffff;
	-webkit-transition-duration: .2s;
	font-size: 14px;
	font-weight: bold;
	border: none;
}

.button-red:hover {
	background-color: #ffffff;
	color: #DD1D21;
	border: 1px solid #DD1D21;
	font-size: 14px;
	font-weight: bold;
	text-decoration: none;
}

.button-red span {
	color: #fff;
}
.button-yellow {
	background-color: #FBCE07;
	padding: 10px 18px;
	color: #404040 ;
	-webkit-transition-duration: .2s;
	font-size: 14px;
	font-weight: bold;
	border: none;
}

.button-yellow:hover {
	background-color: #404040;
	color: #FBCE07;
	font-size: 14px;
	font-weight: bold;
	text-decoration: none;
}

.button-yellow span {
	color: #fff;
}
.button-darkgrey {
	background-color: #404040;
	padding: 10px 18px;
	color: #FBCE07;
	-webkit-transition-duration: .2s;
	font-size: 14px;
	font-weight: bold;
	border: none;
}

.button-darkgrey:hover {
	background-color: #FBCE07;
	color: #404040;
	font-size: 14px;
	font-weight: bold;
	border: 1px solid #404040;
	text-decoration: none;
}

.button-darkgrey span {
	color: #fff;
}
.add-cart {
	margin-left: 15px;
}

.thumbnail {
	max-height: 100px;
	overflow: hidden;
	display: inline-block;
}

.remove-filter {
	margin-right: 10px;
	margin-left: 5px;
	display: inline-block;
}

.cart th {
	background: #595959;
	padding: 5px 10px;
	color: #FFFFFF;
}

.cart td {
	padding: 5px 10px;
}

.metrics {
	border-collapse: collapse;
	width: 100%;
	text-align: center;
	margin-bottom: 15px;
}

.metrics th {
	background: #FBCE07;
	border: 1px solid #EB8705;
	font-weight: bold;
	padding: 5px;
	color: #dd1d21;
}

.metrics td {
	border: 1px solid #EB8705;
	background: #FEF5CD;
	padding: 5px;
}

.metrics tfoot td {
	font-weight: bold;
}
.bluebox {
	background-color: #003C88;
        color: #ffffff;
	padding: 10px 0 14px 0;
	text-align: left;
}
.bluebox a{
        color: #ffffff;
	text-align: left;
}
.bluebox a:hover{
        color: #ffffff;
	padding: 10px 0 14px 0;
	text-align: left;
        text-decoration: underline;
}
.greybox-border {
	background: transparent;
	padding: 10px 0;
	border-top: 1px solid #A6A6A6;
	border-bottom: 1px solid #A6A6A6;
}

.greybox {
	background-color: #D9D9D9;
	padding: 10px 0 14px 0;
	text-align: left;
}

.greybox1 {
	background-color: #D9D9D9;
	padding: 8px 0 10px 0;
	text-align: center;
}

.greybox2 {
	background-color: #D9D9D9;
	text-align: left;
}

.greybox3 {
	background-color: #D9D9D9;
	padding: 10px 0 14px 0;
	text-align: center;
	overflow: hidden;
}

.greybox-text {
	text-align: left;
	font-size: 12px;
	color: #58595b;
	margin-bottom: 15px;
}

.greybox-text .padding {
	padding: 0 15px;
}

.greybox-text h2 {
	text-transform: uppercase;
	margin-bottom: 4px;
}

.greybox-text h3 {
	text-transform: uppercase;
}

.graytext {
	color: #666666;
}

.grey-border {
	background: transparent;
	padding: 10px 0;
	border-top: 1px solid #D9D9D9;
}

.yellowbox-text {
	text-align: Center;
	font-size: 12px;
	color: #58595b;
	margin-bottom: 25px;
	background-color: #FBCE07;
	padding: 10px 0 14px 0;
}

.top-paragraph {
	color: #58595b;
	font-size: 18px;
	text-align: left;
	line-height: 24px;
	margin-bottom: 35px;
}

.dotted-line {
	border-top: 1px dotted #595959;
	width: 500px;
	margin-bottom: -2px;
}

.add-cart a {
	background: url(../images/add-cart-button.jpg) no-repeat;
	width: 100px;
	height: 31px;
	padding: 10px 8px;
	display: block;

}

.add-cart a:hover {
	background-position: -100px;

}

.add-cart-yellow {
	background-color: #FBCE07;
	padding: 10px 18px;
	color: #404040 !important;
	-webkit-transition-duration: .2s;
	font-size: 14px;
	font-weight: bold;
	border: none;
}

.add-cart-yellow:hover {
	background-color: #FBCE07;
	text-decoration: none;
}

.add-cart-yellow span {
	color: #fff;
}

#shopping-cart {
	background-color: #dd1d21;
	padding: 10px 8px;
	color: #fff;
	-webkit-transition-duration: .2s;
}

#shopping-cart:hover {
	background-color: #DD1D21;
	text-decoration: none;
}

#shopping-cart span {
	color: #fff;
}

#merch-cart .greybox-border {
	margin-bottom: 10px;
}

#merch-cart .product-name {
	font-size: 12px;
	font-weight: bold;
	text-transform: uppercase;
	margin-bottom: 12px;
}

#merch-cart #merch-select {
	float: left;
}

#merch-cart #merch-select td {
	padding: 20px 40px 0 0;
}

#merch-cart #merch-select span {
	color: #dd1d21;
}

#merch-cart #merch-select input {
	border: 1px solid #D9D9D9;
	height: 24px;
	padding-left: 3px;
	margin-right: 18px;
	width: 86px;
	font-weight: bold;
}

#merch-cart #merch-select input:hover {
	border: 1px solid #dd1d21;
}

#merch-cart #merch-select .dotted-line {
	margin-bottom: 0px;
}

#merch-search {
	text-align: left;
}

#merch-search h2 {
	background-color: #FDE26A;
	padding-left: 10px;
	line-height: 40px;
	line-height: 40px;
	color: red;
}

#merch-search-product {
	text-align: left;
	background-color: #FBCE07;
}

#merch-search-product h2 {
	background-color: #FDE26A;
	padding-left: 10px;
	line-height: 40px;
	font-weight: 600;
	line-height: 40px;
	color: red;
	font-size: 1.6em;
}

#search-fields {
	background-color: #FBCE07;
	margin-bottom: 6px;
}

#search-fields .padding {
	padding: 20px 10px;
}

#search-fields p {
	line-height: 14px;
	margin-bottom: 3px;
	font-size: 12px;
}

#search-fields input,
#search-fields select {

	line-height: 22px;
	font-size: 12px;
}

#search-fields input {
	margin-bottom: 6px;
	width: 198px;
	padding: 0 3px;
}

#search-fields select {
	width: 206px;
	margin-bottom: 16px;
}

#search-fields .search {
	background: url(../images/search.jpg) no-repeat;
	width: 69px;
	height: 24px;
	display: block;
	float: right;
}

#search-fields .search:hover {
	background-position: -69px;
}

#merch-search #sub-nav h3 {
	background: #FEF5CD;
	font-size: 12px;
	padding-left: 10px;
	padding-right: 10px;
	font-weight: normal;
	line-height: 26px;
	margin-bottom: 3px;
	text-align: left;
	cursor: pointer;
}

#merch-search #sub-nav h3:hover {
	background: #D9D9D9;
}

#merch-search #sub-nav h3 a,
#merch-search #sub-nav h3 a:hover {
	color: #000;
	text-decoration: none;
}

#merch-search #sub-nav div p {
	padding: 5px 0 10px 0;
}

#merch-search #sub-nav div p a {
	padding-left: 6px;
	color: #7F7F7F;
	text-align: left;
	text-decoration: underline;
}

#merch-search #sub-nav div p a:hover {
	text-decoration: none;
}

#merchandise-categories table td {
	padding: 0px;
}

#landing-page td {
	padding: 20px 10px;
}

#merch-cart #menu {
	margin-bottom: 18px;
}

#merch-page #header {
	margin-bottom: 70px;
}

#merch-page .greybox {
	padding: 0;
}

#merch-page .greybox-border {
	padding: 10px 0 25px 0;
}

#merch-page .greybox2 {
	padding: 0;
}

.shopping-cart-bubble-wrapper:hover .shopping-cart-bubble {
	display: block;
}

.shopping-cart-bubble {
	width: 350px;
	position: absolute;
	right: 0;
	background: #FFFFFF;
	border: 1px solid #A6A6A6;
	display: none;
	margin-top: 16px;
}

.shopping-cart-bubble:before {
	content: '';
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 0 15px 16px 15px;
	border-color: transparent transparent #A6A6A6 transparent;
	position: absolute;
	top: -16px;
	right: 40px;
}

.shopping-cart-bubble:after {
	content: '';
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 0 14px 14px 14px;
	border-color: transparent transparent #ffffff transparent;
	position: absolute;
	top: -16px;
	right: 40px;
}

.shopping-cart-bubble .thumbnail {
	max-height: 75px;
	overflow: hidden;
}

.shopping-cart-items {
	margin: 10px 10px 5px;
}

.shopping-cart-bubble td {
	border-bottom: 1px solid #A6A6A6;
	padding-top: 3px;
}

.shopping-cart-bubble p {
	font-size: 14px;
}

.shopping-cart-bubble a {
	font-size: 14px;
	padding: 6px 25px;
	margin-left: 15px !important;
}

.shopping-cart-bubble .subtotal {
	padding: 0 10px 10px;
	text-align: right;
	overflow: hidden;
}

.shopping-cart-bubble .totalprice {
	line-height: 27px;
}
.whatsnew-bubble {
	width: 1000px;
	background-color: #FFFFFF;
	height: 250px;
	padding: 20px 10px;
}
.shop-menu-wrapper:hover .shop-menu {
	display: block;
}
.shop-menu {
	width: 350px;
	position: absolute;
	right: 0;
	background: #FFFFFF;
	border: 1px solid #A6A6A6;
	display: none;
	margin-top: 16px;
}

.shop-menu:before {
	content: '';
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 0 15px 16px 15px;
	border-color: transparent transparent #A6A6A6 transparent;
	position: absolute;
	top: -16px;
	right: 40px;
}

.shop-menu:after {
	content: '';
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 0 14px 14px 14px;
	border-color: transparent transparent #ffffff transparent;
	position: absolute;
	top: -16px;
	right: 40px;
}
.shop-menu a {
	font-size: 14px;
	text-align: left;
	padding: 6px 25px;
}

.chatButton {
	background: url('../images/live_chat_button.png');
	width: 50px;
	height: 168px;
	position: fixed;
	right: 0;
	top: 25%;
}

#Username:hover {
	background-color: #FBCE07;
	color: #0097BB;
}

#Password:hover {
	background-color: #FBCE07;
	color: #0097BB;
}

.msg_err {
	border: 1px solid;
	margin: 8px 0px;
	padding: 12px 10px 12px 32px;
	background-repeat: no-repeat;
	background-position: 10px center;
	background-image: url(../images/sym_error.png);
	color: #DD1D21;
	font-size: 12px;
	background-color: #F8D2D3;
	float: right;
}

.msg_err_reg {
	border: 1px solid;
	margin: 8px 10px;
	padding: 12px 10px 12px 32px;
	background-repeat: no-repeat;
	background-position: 10px center;
	background-image: url(../images/sym_error.png);
	color: #DD1D21;
	font-size: 12px;
	background-color: #F8D2D3;
	float: center;
}

.msg_ok_reg {
	border: 1px solid;
	margin: 8px 10px;
	padding: 12px 10px 12px 32px;
	background-repeat: no-repeat;
	background-position: 10px center;
	background-image: url(../images/sym_ok.png);
	color: #008443;
	font-size: 12px;
	background-color: #CCE6D9;
	float: center;
}

.msg_acbfunds {
	border: 1px solid;
	margin: 4px 4px;
	padding: 8px 6px 8px 24px;
	background-repeat: no-repeat;
	background-position: 6px center;
	background-image: url(../images/sym_ok.png);
	color: #ffffff;
	font-size: 12px;
	background-color: #DD1D21;
	float: center;
}

.sysmsg-cls {
	background-color: #DD1D21;
	padding: 3px 5px;
	color: #fff;
	-webkit-transition-duration: .2s;
	font-size: 10px;
}



/* FOOTER STYLES */
#shell-logo {
	background: url(../images/shell-pendant.jpg) no-repeat;
	position: fixed;
	right: 0;
	z-index: 2;
	top: 680px;
	float: right;
	height: 80px;
	width: 160px;
}

.footer_main {
	background: url(../images/footer_main.png) right repeat-y;
	height: 124px;
}

#footer-links {
	float: center;
	padding-top: 15px;
}

#footer-links a {
	color: #404040;
	font-size: 12px;
	line-height: 12px;
	margin-left: 15px;
	text-align: right;
	border: none
}

#footer-links a:hover {
	text-decoration: underline;
	color: #404040;
}
/* COUNTDOWN STYLES */
.CDbackground {
	border-style: none;
	width: 48px;
	height: 45px;
}

.CDnumbers {
	border-style: none;
	background-color: #292929;
	padding: 0px;
	margin: 0px;
	width: 48px;
	height: 34px;
	text-align: center;
	font-family: "Roboto", Arial, sans-serif;
	font-size: 28px;
	font-weight: normal;
	/* options are normal, bold, bolder, lighter */
	color: #FFFFFF;
	/* change color using the hexadecimal color codes for HTML */
}

.CDtitle {
	/* the styles below will affect the title under the numbers, i.e., �Days�, �Hours�, etc. */
	border: none;
	padding: 0px;
	margin: 0px 3px;
	width: 48px;
	text-align: center;
	font-family: "Roboto", Arial, sans-serif;
	font-size: 10px;
	font-weight: normal;
	/* options are normal, bold, bolder, lighter */
	color: #FF3300;
	/* #999999 change color using the hexadecimal color codes for HTML */
	background-color: #FFCC00;
	/* #000000 */
}

#CDform {
	/* the styles below will affect the outer border of the countdown timer */
	width: 209px;
	height: 74px;
	background-color: #FFCC00;
	/* #000000 */
	padding: 4px;
}

.CDline {
	border-style: none;
	width: 48px;
	height: 2px;
	z-index: 11;
}