/* TODO: remove !important and use specificity and order to set these rules; !important doesn't necessarily override other rules anyway */
body {
	font-family: "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif !important;
	font-weight:400 !important;
	font-size: 12pt !important;
}

.hj-logo {
	width: 180px;
}

.cpc-welcome {
	font-size: 14px;
	margin-bottom: 10px;
}

h1, h2, h3, h4, h5, h6 {
	font-family: Oswald, "Helvetica Neue", Helvetica, Arial, sans-serif !important;
	font-weight:600 !important;
	/* these two settings provided by marketing to go with the change to Open Sans and Oswald */
	letter-spacing: 2px;
	text-transform: uppercase;
}
h1 {
	font-size:18pt;
}
/* also apply letter-spacing to org categories */
.org-category-title {
	letter-spacing: 2px;
}

.font10 {font-size:10pt;}
.required {color: rgb(255,0,0);}

/* set color for virtually all links */
#content-body a, .store-catalog-body a,
#content-body a:hover, .store-catalog-body a:hover,
#copyright a, #privacy a, #homeShopLink, #FAQAnswer a, #terms a,
.item_list a, .item_list a:link, #listTitle {
	color: #be2e25;
}

/* override old-school underlining for most links */
#content-body a, .store-catalog-body a,
#copyright a, #privacy a, #homeShopLink, #FAQAnswer a, #terms a,
.item_list a {
	text-decoration: none;
}

/* but keep it in place on hover for certain links */
#content-body a:hover, .store-catalog-body a:hover {
	text-decoration:underline;
}

@media print {
	#nav-wrapper {display:none;}
	#social {display:none;}
	#copyright span:nth-child(1) {display:none;}
	#copyright span:nth-child(2) {display:none;}
	a[href]:after {content: none !important;}
}

.clear {clear:both;display:none;}
.nowrap {white-space: nowrap;}
.col-01 {position:relative;margin:0 auto;width:100%;max-width:720px;}
.upper {text-transform: uppercase;}
.font-strong {font-weight: 900;}
.color-green {
	color: rgb(124,192,75);
}

.screenmd {max-width:1280px;}
.screensm {max-width:1024px;}
.screenxs {max-width:720px;}

.bgclr-ltgrey {background-color:#f2f2f2;}
.bgclr-white {background-color:#fff;}

.hjButton {
	display: inline-block;
	font-family: Oswald, "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size: 16px;
	font-weight:700;
	color: #ffffff;
	text-align:center;
	background-color: black;
	width:100%;
	padding: 10px 5px;
	position: relative;
	line-height:1.333;
	text-transform:uppercase;
}

.hjButton:hover {
	background-color: #939391;
	cursor: pointer;
}
.hjButton.selected {
	cursor: pointer;
}

.m-top-5 {
	margin-top: 5px;
}

.m-top-10 {
	margin-top: 10px;
}

.m-top-20 {
    margin-top: 20px;
}

.m-top-40 {
	margin-top: 40px;
}

.m-bottom-10 {
	margin-bottom: 10px;
}

.m-bottom-20 {
	margin-bottom: 20px;
}

.m-bottom-30 {
	margin-bottom: 30px;
}

.m-right-20 {
	margin-right: 20px;
}

div.new-section {
	margin-top: 20px;
}

hr.form-header-break {
	border-top: solid 2px #333;	
}

hr.section-break {
	border-top: solid 1px #333;
}

.form-control.date {
	width: 165px;
}

.logout-warning {
	font-size: 8pt;
	font-style: italic;
}

.login-form {
	margin: 20px;
}

.login-error-message {
	color: red;
}

textarea.form-control.org-textarea {
	height: 150px;
}

.org-info-label {
	font-weight: bold;
}

.preset-login-form-container {
	padding: 20px 0;
}

.preset-login-form {
	display: block;
	margin: 60px 20px;
}

div#myNavbar {
	font-size: 14px;
}

div.noMembersFoundMessage {
	text-align:center;
	font-weight:bold;
	color: red;
	font-size:12px;
	margin-top:10px;
}

div.filterheader {
	padding: 15px;
}

div.filterheader * {
	font-size:9pt;
}

div.filterheader > div {
	background-color:#ededed;
	border:solid 1px #333;
	padding-top:5px;
	padding-bottom:5px;
}

#memberListContainer {
	width: 95%;
}

#memberListContainer .btn, #memberListContainer input, #memberListContainer select,
#memberListContainer span, #membersTable th, #membersTable td {
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}

#membersTable th, #membersTable td {
	font-size: 14px;
}

/* for notifications when saving a chapter */
#showNotification li {list-style-type: none;}
#showNotification li:before {
	 /*Using a Bootstrap glyphicon as the bullet point*/
	 content:"\e086";
	 font-family: 'Glyphicons Halflings';
	 font-size: 150%;
	 float: left;
	 margin-top: 0em;
	 margin-left: -1.5em;
 }


#site {
	max-width:1280px;
	min-width:500px;
	width:100%;
	min-height:800px;
	margin: 0 auto;
	position:relative;
	line-height:175%;
}


#header {
	width:100%;
	height:90px;
	position:relative;
}
#logo {
	width:180px;
	position:relative;
	float:left;
}
#nav-wrapper{
	float:right;
}
#nav {
	position:relative;
	float:left;
}
#nav a {
	font-family: Oswald, "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size: 16px;
	font-weight: 500;
	color: rgb(178, 183, 187);
	text-transform: uppercase;
	height: 90px;
	line-height: 90px;
	position: relative;
	margin-left: 10px;
	text-decoration: none;
}
#nav a:link {}
#nav a:visited {}
#nav a:hover {text-decoration:underline;}
#nav a:active {}
#nav .selected {color: rgb(51, 51, 51);}
.breadcrumbs {overflow: hidden;margin-bottom: 20px;}
#breadcrumbs {
	/*width: 500px;
	padding: 0;
	margin: 10px 0 20px 30px;*/
}
#bread {
	color: black;
	padding: 3px;
	text-decoration: none;
	font-size: 9pt;
	margin: 0;
}
#bread a {
	color: black;
	text-decoration: underline;
}
#bread a:hover {
	text-decoration: none;
}
#bread ul {
	/*border: solid black 1px;*/
	text-align: left;
} 
#bread li {
	padding-left: 2px;
	list-style: none;
	text-align: left;
	display: inline;
	margin: 0;
}

#cart {
	position:relative;
	float:left;
	height:90px;
}
#cart .hjButton {
	width:120px;
	height:40px;
	float:left;
	margin-left:20px;
	top:50%;
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
}
#banner {
	position:relative;
	width:100%;
}
#banner img {width:100%;max-width:1280px;min-height:205px;border:0;}
#banner .bannerImage {
	position:relative;
	min-height: 205px;
	max-height: 522px;
	overflow: hidden;
	width:100%;
}
#banner .bannerImage img.shortBanner {
    margin-top: -75px;
}
#banner.shortBanner {
	max-height:300px;
	overflow:hidden;
}

#search-wrapper {
	position: absolute;
	top: 25%;
	left: 25%;
	z-index: 20;
	right: 25%;
	bottom: 25%;
	margin: auto;
	max-width: 640px;
	max-height: 175px;
}
#search-wrapper h1 {
	color: rgb(255,255,255);
	text-align: center;
}

#search-box .btn-default {
	background-color: rgba(0,0,0,0.4);
	height: 50px;
	color: rgb(255,255,255);
	background-image: none;
	border: none;
}

#search-box .form-control {
	background-color: rgba(0,0,0,0.4);
	height: 50px;
	font-size: 145%;
	color: rgb(255,255,255);

	/* stop the glowing blue shadow */
	box-shadow:none;
	-webkit-box-shadow:none;
	border: none;

}

#search-box input[type=text]::-ms-clear {  display: none; width : 0; height: 0; }
#search-box input[type=text]::-ms-reveal {  display: none; width : 0; height: 0; }
#search-box input[type="search"]::-webkit-search-decoration,
#search-box input[type="search"]::-webkit-search-cancel-button,
#search-box input[type="search"]::-webkit-search-results-button,
#search-box input[type="search"]::-webkit-search-results-decoration { display: none; }

#search-clear {
	position: absolute;
	right: 8px;
	top: -5px;
	bottom: 0;
	height: 20px;
	margin: auto;
	cursor: pointer;
	color: rgb(255,255,255);
	z-index: 100;
	display:none;
}

#srch-term:not(:valid) ~ #search-clear {
	display: none;
}
#srch-term:not(:invalid) ~ #search-clear {
	display: block;
}

/* autocomplete styling */
.autocomplete-suggestions { border: 1px solid #999; background: #FFF; overflow: auto; }
.autocomplete-suggestion { padding: 2px 5px; white-space: nowrap; overflow: hidden; }
.autocomplete-selected { background: #F0F0F0; }
.autocomplete-suggestions strong { font-weight: normal; color: rgb(64, 149, 56); }
.autocomplete-group { padding: 2px 5px; }
.autocomplete-group strong { display: block; border-bottom: 1px solid #000; }

/*custom colors for bootstrap pagination */
#page-selection .pagination>.active>a, .pagination>.active>a:focus, .pagination>.active>a:hover, .pagination>.active>span, .pagination>.active>span:focus, .pagination>.active>span:hover {
	background-color: #eee;
	border-color: rgb(124, 192, 75);
}

#search-box .glyphicon {
	font-size: 25px;
}

#content-main {
	padding-bottom:20px;
	margin-bottom:20px;
}
#content-header {
}
#content-body {
	min-height:200px;
	padding-top:20px;
	padding-bottom:20px;
}
#content-footer {
}
#footer {
	width:100%;
	min-height:40px;
	margin-top:40px;
	position:relative;
}
#copyright {
	width:100%;
	min-height:40px;
	position:relative;
	text-align:center;
	font-family: Oswald, "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size: 14px;
	color: #000;
	min-height:40px;
	line-height:40px;
}
#copyright a:link {}
#copyright a:visited {}
#copyright a:hover, #privacy a:hover, #homeShopLink:hover, #FAQAnswer a:hover, #terms a:hover  {text-decoration:underline;}
#copyright a:active {}

#FAQ{
	padding-top: 10px;
}
#FAQ h4{
	padding-top: 20px;
	padding-bottom: 20px;
}

#social {
	min-height:20px;
	position:absolute;
	top: 0;
	right:20px;
	text-align:right;
}

#social a:hover img {opacity:0.7}

#steps .on {
	color: #900;
}
ul#steps {display: block;background-color: rgb(226, 226, 226);border:solid rgb(51, 51, 51) 1px;padding:5px 15px;}
#steps li {
	display: inline;
	padding-right: 10px;
	line-height: 200%;
	font-weight:bold;
	font-size: 14px;
	color: #666;
	height: 16px;
}
#steps {
	list-style: none;
}

/* Search Text Box with Icon*/
.add-on .input-group-btn > .btn {
	border-left-width:0;left:-2px;
	-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
	box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
}
/* stop the glowing blue shadow */
.add-on .form-control:focus {
	box-shadow:none;
	-webkit-box-shadow:none;
	border-color:#cccccc;
}


/* Store Catalog Page*/
.store-catalog-header {font-family: Oswald, "Helvetica Neue", Helvetica, Arial, sans-serif;}
.store-catalog-header a {color:rgb(51, 51, 51) !important;}
.store-catalog-header a:link {}
.store-catalog-header a:visited {}
.store-catalog-header a:hover {}
.store-catalog-header a:active {}
#catalog-nav {font-size: 9pt !important;line-height: 150%;}
#catalog-nav a {text-decoration:underline !important;color: rgb(51, 51, 51) !important;}
#catalog-nav a:link {text-decoration:underline !important;}
#catalog-nav a:visited {text-decoration:underline !important;}
#catalog-nav a:hover {text-decoration:none !important;}
#catalog-nav a:active {text-decoration:underline !important;}

.catalog-list {margin-top:10px;margin-bottom:10px;}
.catalog-list a {
	color: rgb(178, 183, 187) !important;
	font-size: 14px;
	text-decoration: none !important;
	text-transform: uppercase;
	margin-right: 10px;
}
.catalog-list a:link {text-decoration:none !important;}
.catalog-list a:visited {text-decoration:none !important;}
.catalog-list a:hover {text-decoration:underline !important;color:rgb(64, 149, 56)}
.catalog-list a:active {text-decoration:underline !important;}
.catalog-list-active {color:rgb(51, 51, 51) !important;}

/* Store Catalog/Category Page*/
.store-catalog-body {background-color:#eee;padding-top:20px;padding-bottom:20px;}
.store-catalog-body p, .store-catalog-body div {font-family: Oswald, "Helvetica Neue", Helvetica, Arial, sans-serif;}
.store-catalog-item-container, .disclaimer-image-container {
    width: 275px;
    min-height: 350px;
    margin: 0 auto;
}
.store-catalog-item-product {background-color:#fff;width: 100%;height:275px;overflow:hidden;position:relative;}
.store-catalog-item-featured {position:absolute;width:100%;height:25px;background-color:#a13;text-align:center;color:#fff;font-size:12pt;line-height:20pt;text-transform:uppercase;z-index: 100;}
.store-catalog-item-image-container {position:relative;width:275px;height:275px;text-align:center;vertical-align:middle;display:table-cell;}
.store-catalog-item-image {max-height:275px;max-width:275px;min-width:200px;}
.store-catalog-item-text {
	position: relative;
	width: 275px;
	height: 75px;
	text-align: center;
	vertical-align: middle;
	display: table-cell;
	font-size: 14px;
}
.store-catalog-item-description {position: absolute;top: 25px;padding: 20px;background:rgba(0,0,0,0.8);color: #fff;opacity: 0.75;font-size: 8pt;line-height: 175%;height: 100%;width:100%;z-index:100;display:none;overflow: hidden;}

.store-catalog-item-container:hover {
	cursor: pointer;
}

/* Store Product Page*/
.store-product-image-list {position:relative;float:left;width:50px;height:50px;border:solid #ccc 1px;margin:2px;overflow:hidden;}
.store-product-image-list img {width:100%;}
.store-product-image-list a:hover img {opacity:0.7;}

#privacy h1, #privacy h4{
	margin-top:40px;
	text-transform: uppercase;
}

.item_list {
	list-style: none;
	margin: 0;
	padding: 0;
}
.item_list ul { 
	margin: 0; 
	list-style: none; 
	font-size: 1em; 
	line-height: 1.3em;
	padding: 0;
}
.item_list li {
	padding: 0 0 0 20px;
	list-style: none;
	margin: 0 0 10px;
}
/*.item_list a:visited {color: rgb(124, 192, 75);}*/
.item_list a:hover {
	text-decoration: underline;
	list-style: inherit;
	color: rgb(64, 149, 56);
}

#sectionTitles li{
	margin: 0 0 0 0;
}

#listTitle {
	margin-top:20px;
	margin-bottom:20px;
	font-family: Oswald, "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size: 16pt;
	font-weight: 700;
	line-height: 30pt;
	border-bottom:solid 6px #be2e25;
	text-transform:uppercase;
}

/* set background to light gray to stand out from the rest of the page */
.checkout-section-header {
	background-color: #cccccc;
}

/* then set its child sections back to white for contrast */
.order-summary, .cart-form-container {
	background-color: white;
}

.order-summary-amount {
	text-align: right;
}

.order-summary-image-container {
	border: solid #666666 1px;
	width: 100px;
	height: 100px;
	overflow: hidden;
}

.order-summary-image {
	max-width: 100px;
	max-height: 100px;
}

.order-summary-spacer-row {
	padding-bottom: 10px;
}

.table > tbody > tr > td.discount-text {
	border-top: none;
	color: red;
	text-align: right;
}

.order-info-required-note {
	padding-left: 20px;
	font-size: 12px;
}

.order-info-collegian-required-note {
    padding-bottom: 10px;
    font-size: 13px;
}

.order-info-spacer {
	background-color: #f2f2f2;
	height: 10px;
	margin-top: 0;
}

.review-spacer {
	background-color: #f2f2f2;
	height: 20px;
}

.checkout-padded-row {
	padding-top: 20px;
	padding-bottom: 20px;
}

.confirmation-layout {
	background-color: #eeeeee;
	margin-top: 20px;
}

.confirmation-container {
	background-color: white;
	font-family: Oswald, "Helvetica Neue", Helvetica, Arial, sans-serif;
	padding-top: 20px;
	padding-bottom: 20px;
	min-height: 400px;
}

.disclaimer-text {
    font-size: 10pt;
    color: #ff0000;
}

.discount-text {
	color: red;
}
.free-gift-text {
	color: red;
}

.error-text {
	color: red;
}

.cart-item-form {
    margin: 0;
    padding: 0;
}

input.cart-item-quantity {
	display: inline;
	margin: 0 5px;
	max-width: 75px;
	text-align: center;
}

.cart-item-details div {
    float: left;
    margin-bottom: 20px;
    margin-right: 20px;
}

.cart-item-details::after {
    clear: both;
}

.product-image-container {
	border: solid #666666 1px;
	float: left;
	height: 50px;
	margin-right: 10px;
	overflow: hidden;
	width: 50px;
}

.product-description-container {
	float: left;
	margin-right: 10px;
}

.xs-product-image-container {
	border: solid #666666 1px;
	height: 130px;
	overflow: hidden;
	width: 130px;
}

.small-product-image {
    max-height: 50px;
    max-width: 50px;
}

.large-product-image {
    max-height: 130px;
    max-width: 130px;
}

/* this is the quantity box on the product detail page; the cart-item-quantity class is for the box(es) on the cart page */
.product-quantity {
	max-width: 75px;
	text-align: center;
}

.add-to-cart-button {
	max-width: 200px;
	margin-top: 20px;
}

/* form-horizontal adds padding-top: 7px to labels but we want them centered, so clear that */
#cartFormContainer .form-horizontal .control-label,
#orgInfoFrm.form-horizontal .control-label,
#loginForm.form-horizontal .control-label {
	padding-top: 0;
}

/* default size for panel title is smaller than we'd like and the link shows as our normal link color instead of the title color we want */
#cartFormContainer h3.panel-title {
    font-size: 24px;
}

#cartFormContainer .panel-title a {
    color: black;
}

/* input-group when combined with class=col-* resets the padding for some reason, which causes text boxes to expand beyond their columns */
#loginForm .input-group[class*=col-] {
    padding-left: 15px;
    padding-right: 15px;
}

#cartFormContainer .form-horizontal #shippingMethodText {
	font-weight: normal;
}

.location-button {
	max-width: 185px;
}

#showTaxHelpLink {
	margin-left: 10px;
}

#taxHelp p {
	font-size: 10pt;
}

#closeTaxHelp {
	position: absolute;
	top: 5px;
	right: 20px;
}

#closeTaxHelp:hover {
	cursor: pointer;
}

.modal-title-herff {
	float: left;
}

.modal-header.modal-header-herff, .btn-herff.btn-success {
	background-color: rgb(124,192,75);
}

.modal-header-herff > button.close {
	font-size: 14px;
	min-width: 44px;
	min-height: 44px;
	margin: -10px -15px -12px 0;
	opacity: 1;
}

.modal-header .close > .inner {
	line-height: 14px;
	display: inline-block;
	width: 16px;
	height: 16px;
	background-color: #65bb28;
	border-radius: 8px;
}

/* square corners, please */
.modal-content.modal-content-herff {
	-webkit-border-radius: 0;
	-moz-border-radius: 0;
	border-radius: 0;
	border: none;
}

.modal-content-title {
	font-size: 16px;
	font-weight: bold;
	padding-bottom: 5px;
}

.modal-table-container {
	height: 350px;
	overflow-y: scroll;
}

.modal-footer {
	padding: 15px;
	border-top: 0 solid #e5e5e5;
}

/* For the video on the About page from our Wistia account, use a wrapper and let it shrink proportionally */
.wistia_video_wrapper {
	position: relative;
	padding-bottom: 56.25%;
	padding-top: 25px;
	height: 0;
}
.wistia_video_wrapper iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

/* but do not allow it to expand beyond the width of the video */
@media screen and (min-width: 850px) {
	/* fix the top and bottom padding since we know the width of the iframe */
	.wistia_video_wrapper {
		padding-top: 0;
		padding-bottom: 475px;
	}
	/* change position to be relative since we want it centered and fix width and height to match video */
	.wistia_video_wrapper iframe {
		position: relative;
		width: 850px;
		height: 478px;
	}
}

@media screen and (max-width: 700px) {
	#search-wrapper-title {
		display: none;
	}
	#search-wrapper {
		position: relative;
		z-index: 20;
		margin: 0 15px;
		max-width: inherit;
		padding-top: 5px;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
	}

	#search-box .btn-default {
		background-color: transparent;
		background-image: -webkit-linear-gradient(top,#fff 0,#e0e0e0 100%);
		background-image: -o-linear-gradient(top,#fff 0,#e0e0e0 100%);
		background-image: -webkit-gradient(linear,left top,left bottom,from(#fff),to(#e0e0e0));
		background-image: linear-gradient(to bottom,#fff 0,#e0e0e0 100%);
		filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff', endColorstr='#ffe0e0e0', GradientType=0);
		filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
		background-repeat: repeat-x;
	}
	#search-box .form-control {
		background-color: transparent;
		color: rgb(0,0,0);
	}

}

@media screen and (max-width: 800px) {
	#nav {
		float:none;
		position:absolute;
		bottom: 0;
		right:15px;
	}
	#nav a {
		height:auto !important;
		line-height:40px !important;
	}
	#cart {float:none;height: 50px !important;}
	#header {padding-right:15px;}

}
@media screen and (max-width: 1024px) {
	#copyright {
		line-height:20px;
		margin-top:20px;
	}
	#social {
		position:relative;
		top:auto;
		right:auto;
		text-align:center;
		margin-top:10px;
	}
}