/*JP 5-1-2013*/

/*CONTENTS:

This sheet should contain any styles that apply to any BIT templates
_____________________________________________________________
1. Banners
	1.1 Homepage Specific Banner Designs
	1.2 Secondary Home Page Painted Circle Banner Designs
	1.3
	1.4 
	1.5 Interior and Home Page Painted Circle Banner Designs
	1.6 Blog Banners
2. Callouts
	2.1 Call to action designs
	2.2 Text promo designs
	2.3 Inline Callouts
3.
4.
5. Content Decks (multi column color bars)
6. Responsive Lists
7. Comparison Charts
8.
9. Icon Feature Decks
	9.1 home icon features in sidebar / login deck
	9.2 Small Image Based Icons
	9.3 Large Landing Page Image Based Icons
	
10. Page structure and layout bits	
	10.1 Sticky Menu Bar
	10.2 product page content decks
	10.3 specific content deck formatting
	
11. Special bit displays
	11.1 featured employee / loan officer random displays
*/


/* ================ 1. Banners ================ */

.bit-banner {
	clear: both;
	float: none;
}
/*1.1 Homepage Specific Banner Designs*/


/*base banner stuff*/
div.home_banner, div.home_banner div.outer-slide {
	max-width: 1080px;
	min-height: 365px;
	max-height: 365px;
	margin: 2em auto;
	float: none;
}
div.home_banner.cutout, div.home_banner.cutout div.outer-slide.cutout {
	height: auto;
}
div.int_banner, div.int_banner div.outer-slide {
	max-height: 300px;
}
div.outer-slide {
	overflow: hidden;
}
div.banner-image {
	background-size: cover;
	background-repeat: no-repeat;
	background-position: 50%;
}
div.int_banner {
	margin: 2em 0;
}
/*bracketed promo banners...*/

.banner_body .promo-outer {
	background: #fff;
	margin: 40px;
}
.banner_body .promo-outer.onethird.left {
	float: left !important;
	left: 40px;
}
.banner_body .promo-outer.onethird.right {
	float: right !important;
	right: 40px;
}
.banner_body .promo-outer, .banner_body .promotion {
	padding: 20px 0px;
	margin: 0px 40px -50px;
}
.banner_body .promo-outer {
	position: relative;
	top: 60px;
}
.banner_body .promotion h2 {
	line-height: normal;
}
.banner_body .promotion h2.headline-small {
}
.banner_body .promotion h2.headline-med {
	font-size: 33px;
}
.banner_body .promotion h2.headline-large {
	font-size: 44px;
}
/*if the promo area is onethird wide, do this...*/
.banner_body .promo-outer.onethird {
	margin: 40px;
}
.banner_body .promo-outer.onethird, .banner_body .promo-outer.onethird .promotion {
	padding: 12px 0px;
	margin: 0px 30px -40px;
}
.banner_body .promo-outer.onethird {
	position: relative;
	top: 40px;
}

.banner_body .promo-outer.onethird .promotion h2.headline-med {
	font-size: 30px;
}
.banner_body .promo-outer.onethird .promotion h2.headline-large {
	font-size: 36px;
}
/*banner image alignment options (bit selection)*/
div.banner-image.bgtop {
	background-position: bottom;
}
div.banner-image.bgbot {
	background-position: top;
}


@media screen and (max-width: 960px) {
.banner_body .promo-outer.onethird {
	width: 50%;
}
}

@media screen and (max-width: 720px) {
.banner_body .twothirds.banner-image, .banner_body .onethird {
	width: 100%;
	clear: both;
}
.banner_body .twothirds.banner-image {
	min-height: 270px;
	background-position: 50%;
}
.banner_body.cutout .promotion {
	margin: 10px;
}
.banner_body .promo-outer.onethird, .banner_body .promo-outer.onethird .promotion, .banner_body .promo-outer .promotion {
	margin: 0px 10px 0px;
}
div.home_banner, div.home_banner div.outer-slide {
	max-height: 565px;
	margin: 1em auto 2em;
}
.banner_body .promo-outer.onethird.right {
	right: 0;
}

}
/*Cutout style homepage banners*/

.banner_body .twothirds.banner-image {
	max-width: 700px;
	min-height: 350px;
	background-position: top;
}
.banner_body.cutout .promo-outer {
	position: relative;
	top: 10px;
	padding: 20px 0;
	margin: 0px 20px !important;
}
.banner_body.cutout .promotion {
	margin: 10% 10px;
}
.banner_body.cutout .promotion .inner {
	padding: 5px;
}
.home_banner .banner_body.cutout .promo-outer .promotion h2.headline-med {
	font-size: 32px;
}
.home_banner .banner_body.cutout .promo-outer .promotion h2.headline-large {
	font-size: 38px;
}

@media screen and (max-width: 640px) {
.banner_body .promo-outer.onethird {
	width: 100%;
}

.banner_body .promo-outer {
	margin: 280px 0 0 0 !important;
}

.home_banner .banner_body .promo-outer {
	margin: 320px 0 0 0 !important;
}

.home_banner .banner_body .circle, .secondary_banner .banner_body .circle {
	margin: 160px auto 0 auto !important;
	position: inherit !important;
	float: none;
	display: block;
}
div.home_banner, div.home_banner div.outer-slide, div.secondary_banner, div.secondary_banner div.outer-slide {
	min-height: 450px;
	max-height: 5555px;
	margin: 0 auto !important;
}
div.home_banner.painted-circle-banner, div.home_banner.painted-circle-banner div.outer-slide {
	background-color: #007c88;
	padding: 0 0 20px 0;
}
div.banner-image {
	background-position: 100% top !important;
}
.twothirds.banner-image {
	background-position: 50% 80%!important;
}
.home_banner .banner_body .promo-outer {
	float: none !important;
	right: auto !important;
	left: auto !important;
	position: inherit !important;
}
.banner_body .twothirds.banner-image {
	min-height: 260px !important;
	background-position: 50% 40% !important;
}
/*banner image alignment options (bit selection)*/
div.banner-image.bgtop {
	background-position: inherit !important;
}
div.banner-image.bgbot {
	background-position: inherit !important;
}
}

@media screen and (max-width: 420px) {
.banner_body .twothirds.banner-image {
	min-height: 170px;
	background-position: 50%;
}

.home_banner .banner_body.cutout .promo-outer {
	margin: 0 !important;
}
.banner_body .twothirds.banner-image {
	min-height: 210px !important;
	background-position: 50% 50% !important;
}
div.int_banner, div.int_banner div.outer-slide {
	max-height: 210px;
}
div.banner-image {
	background-size: 150% !important;
}

.home_banner .banner_body .promo-outer {
	margin: 270px 0 0 0 !important;
}
}
/*Cutout style homepage banners*/

.banner_body .twothirds.banner-image {
	max-width: 700px;
	min-height: 350px;
	background-position: top;
}
.banner_body.cutout .promo-outer {
	position: relative;
	top: 10px;
	padding: 20px 0;
	margin: 0px 20px !important;
}
.banner_body.cutout .promotion {
	margin: 10% 10px;
}
.banner_body.cutout .promotion .inner {
	padding: 5px;
}
.home_banner .banner_body.cutout .promo-outer .promotion h2.headline-med {
	font-size: 32px;
}
.home_banner .banner_body.cutout .promo-outer .promotion h2.headline-large {
	font-size: 38px;
}
/*1.2 Secondary Home Page Banners */

.homepage .deck.secondary {
	max-width: 1040px;
	margin: auto;
}


.wrapper.homepage .flexslider {
	float: none;
	margin: 0;
	background: transparent;
	border: none;
	-webkit-border-radius: 0;
	-moz-border-radius: 0;
	-o-border-radius: 0;
	border-radius: 0;
	box-shadow: none;
	-webkit-box-shadow: none;
	-moz-box-shadow: none;
	-o-box-shadow: none;
}
div.secondary_banner, div.secondary_banner div.outer-slide {
	max-width: 98%;
	height: 265px;
	margin: 1em auto 2em;
	float: none;
}

.homepage .deck.secondary .flexslider {margin:0;}

.deck.secondary ul.slides p {display:none; /*this kills anything within a paragraph in secondary banners to fix the buoy p tag bug. This is OK because secondary designs will never contain P tags.*/}


/*Secondary Painted Circle and Bracketed Banner Designs*/

div.secondary_banner .banner_body .circle {
	width: 290px;
	height: 290px;
	background-size: 260px;
	display: block;
	top: -10px;
}
div.secondary_banner.cutout, div.secondary_banner.cutout div.outer-slide.cutout {
	height: auto;
}
div.secondary_banner div.banner_body div.circle h1 {
	font-size: 34px;
	font-size: 2.125rem;
	line-height: 36px;
	line-height: 2.25rem;
}
div.secondary_banner div.banner_body div.circle h1 div {
	margin: 0;
	padding: 50px 30px 10px;
}

/*secondary bracketed banners...*/

.secondary_banner .banner_body .promo-outer {
	top: 20px !important;
}

.secondary_banner .banner_body .promo-outer.onethird.left {
	float: left !important;
	left: 0;
}

.secondary_banner .promotion .inner {
padding: 20px 30px;
}




@media screen and (max-width: 640px) {
div.secondary_banner, div.secondary_banner div.outer-slide {
max-width: 100%;
height: auto;
}
div.secondary_banner div.banner_body div.circle h1 {
	font-size: 26px;
	font-size: 1.625rem;
	line-height: 32px;
	line-height: 2rem;
}
div.secondary_banner div.banner_body div.circle h1 div {
	margin: 0;
	padding: 70px 30px 10px;
}
div.secondary_banner div.banner_body div.button a {
	padding: 3px 20px;
	font-size: 16px;
	font-size: 1rem;
}

.secondary_banner .banner_body .promo-outer {
	top: 0 !important;
}
}

@media screen and (max-width: 480px) {
div.secondary_banner div.banner_body div.circle h1 div {
	padding: 50px 30px 10px;
}
}
/*1.5 Interior and Home Page Painted Circle Banner Designs */


/*all painted circle banners*/
div.banner_body div.circle {
	position: relative;
	background-color: #fff;
	border-radius: 200px;
	width: 400px;
	height: 400px;
	background-repeat: no-repeat;
	background-size: 360px;
	background-position: 50%;
	display: table;
}
/*home only*/
div.home_banner div.banner_body div.circle {
	position: relative;
	left: 0px;
	top: -15px;
}
/*interior only*/
div.int_banner div.banner_body div.circle {
	bottom: -100px;
	/*left: 20px;*/
}
div.int_banner div.banner_body div.circle.center {
	/*left: 29%;*/
}
/*home bleed circles*/

div.banner-image.left.bleed {
	background-position: 120px 50%;
}
div.banner-image.left.bleed.bgtop {
	background-position: 120px bottom;
}
div.banner-image.left.bleed.bgbot {
	background-position: 120px top;
}
div.banner-image.right.bleed {
	background-position: -130px 50%;
}
div.banner-image.right.bleed.bgtop {
	background-position: -130px bottom;
}
div.banner-image.right.bleed.bgbot {
	background-position: -130px top;
}
/*home inset circles*/

div.banner_body div.circle.left.inset {
	left: 6%;
}
div.banner_body div.circle.right.inset {
	left: -6%;
}


div.banner_body div.circle.center {margin:auto;}

div.secondary_banner .banner_body .circle.center {
	top: -15px; /*the vertical alignment was off on centered circles so this tweak fixes it*/
}



@media screen and (max-width: 640px) {
div.banner_body div.circle.left.inset {
	left: 16%;
}
div.banner_body div.circle.right.inset {
	left: -16%;
}
}
div.banner_body div.circle h1 {
	text-align: center;
	color: #fff;
	font-weight: 700;
	font-size: 42px;
	font-size: 2.625rem;
	line-height: 42px;
	line-height: 2.625rem;
}
div.banner_body div.circle h1 div {
	margin: 0;
	padding: 30px;
}
.home_banner div.banner_body div.circle h1 {
	font-family: 'Flux-Regular', 'Helvetica Neue', Helvetica, Arial, sans-serif;
	font-weight: normal;
	line-height: normal;
	font-size: 50px;
	font-size: 3.125rem;
}

@media screen and (max-width: 640px) {
.home_banner div.banner_body div.circle h1 {
	font-size: 44px;
	font-size: 2.75rem;
	line-height: 40px;
	line-height: 2.5rem;
	max-width: 250px;
	margin: auto;
}
.secondary_banner div.banner-image {
	background-position: 50% top !important;
}
}
.home_banner div.banner_body div.circle h1 div {
	padding: 60px 0 0;
}
.int_banner div.banner_body div.circle h1 {
	display: table-cell;
	vertical-align: middle;
}
.int_banner div.banner_body div.circle h1 div {
	margin: 0 0 110px 0;
	padding: 25px 50px 40px;
}
div.banner_subtitle {
	text-align: center;
	color: #fff;
	font-weight: 300;
	font-size: 20px;
	font-size: 1.25rem;
	padding: 0 30px 20px;
}
div.banner_body div.button {
	text-align: center;
	margin-top: 2%;
}
div.banner_body div.button a {
	opacity: 1;
	padding: 6px 30px;
	font-size: 20px;
	font-size: 1.25rem;
}
/*other banner styles are applied via the promotion button styles in this sheet*/

/*painted circle colors*/
div.banner_body div.circle.blue {
	background-image: url(/img/banner-circle-blue.jpg);
}
div.banner_body div.circle.green {
	background-image: url(/img/banner-circle-green.jpg);
}
div.banner_body div.circle.teal {
	background-image: url(/img/banner-circle-teal.jpg);
}
div.banner_body div.circle.slate {
	background-image: url(/img/banner-circle-slate.jpg);
}
div.banner_body div.circle.brown {
	background-image: url(/img/banner-circle-brown.jpg);
}
div.banner_body div.circle.orange {
	background-image: url(/img/banner-circle-orange.jpg);
}
div.banner_body div.circle.red {
	background-image: url(/img/banner-circle-red.jpg);
}
/*bottom border colors*/
div.int_banner div.outer-slide {
	border-bottom: solid 8px;
}
div.int_banner div.outer-slide.green {
	border-bottom-color: #77942b;
}
div.int_banner div.outer-slide.blue {
	border-bottom-color: #005880;
}
div.int_banner div.outer-slide.teal {
	border-bottom-color: #007c88;
}
div.int_banner div.outer-slide.orange {
	border-bottom-color: #f48024;
}
div.int_banner div.banner_body div.circle.right {
	right: 20px;
	left: inherit;
}

@media screen and (max-width: 500px) {
div.banner_body div.circle {
	bottom: -100px;
	width: 300px;
	height: 300px;
	background-size: 270px;
	margin: 0 auto;
	left: inherit !important;
	right: inherit !important;
	float: none;
}
div.banner_body div.circle h1 {
	font-size: 25px;
	max-width: 200px;
	margin: auto;
	line-height: 27px;
	vertical-align: bottom;
}
div.banner_body div.circle h1 div {
	margin: 0;
	padding: 30px;
}
.int_banner div.banner_body div.circle h1 div {
	padding: 10px 50px 40px;
}
}
/*1.6 Blog Banners*/
div.blog-banner div.banner_body div.circle h1 {
	font-size: 27px;
	font-size: 1.6875rem;
	line-height: normal;
}
div.blog-banner div.banner_body div.circle h1 a {
	color: #fff;
}
/* ================ 2. Callouts ================ */

/*2.1 Call to action button designs*/
div.cta {
	font-family: "Avenir W01", 'Helvetica Neue', Helvetica, Arial, sans-serif;
	text-align: center;
}
div.cta a {
	padding: 10px 20px;
	font-size: 24px;
	font-size: 1.5rem;
	font-weight: 100;
	margin: 10px auto;
	text-align: center;
	color: #fff;
	display: inline-block;
	text-decoration: none;
	background: #007c88;
	-webkit-transition: background .5s ease;
	-moz-transition: background .5s ease;
	transition: background .5s ease;
}
div.cta.jumbo a {
	padding: 20px 80px;
	font-size: 28px;
	font-size: 1.75rem;
}
div.cta a:hover {
	background-color: #005880;
	text-decoration:none !important;
}
div.cta.avenir {
	font-family: "Avenir W01", Arial, Helvetica, sans-serif;
}
div.cta.flux {
	font-family: 'Flux-Regular', Arial, Helvetica, sans-serif;
}
div.cta.theme2 a {
	background-color: #005880;
}
div.cta.theme2 a:hover {
	background-color: #007c88;
}
div.cta.theme3 a {
	background-color: #77942b;
}
div.cta.theme3 a:hover {
	background-color: #727f8a;
}
div.cta.theme4 a {
	background-color: #c4122f;
}
div.cta.theme4 a:hover {
	background-color: #f48024;
}
div.cta.theme5 a {
	background-color: #f48024;
}
div.cta.theme5 a:hover {
	background-color: #533019;
}
/*if the cta is in the intro area of the page, do this...*/
.intro .cta {
	float: right;
	clear: left;
	margin: 10px 10%;
}
.intro .cta a {
	padding: 10px 20px !important;
	font-size: 24px !important;
	font-size: 1.5rem !important;
}

@media screen and (max-width: 500px) {
.intro .cta {
	float: none;
	clear: none;
	margin: auto;
}
}
/*2.2 Text promo designs*/

.promotion {
	padding: 0;
	margin: 10% 0;
	background: transparent;
	border-radius: 0;
	display: block;
	background-image: url(/img/promo-bg-t1-top.png);
	background-repeat: no-repeat;
	background-position: top left;
	background-size: 30px 30px;
}
.promotion .inner {
	background-image: url(/img/promo-bg-t1-bot.png);
	background-repeat: no-repeat;
	background-position: bottom right;
	background-size: 30px 30px;
	padding: 30px;
}
.promotion.home-feature .inner {
	background-image: none;
	padding: 15px;
}
.promotion p {
	color: #727f8a;
	font-size: 15px;
	font-size: 0.9375rem;
	line-height: 20px;
	line-height: 1.25rem;
	text-align: center;
	margin: 0;
}
.promotion h2 {
	font-family: 'Avenir W01', 'Helvetica Neue', Helvetica, Arial, sans-serif;
	font-weight: 700;
	font-size: 22px;
	font-size: 1.375rem;
	line-height: 27px;
	line-height: 1.6875rem;
	color: #005880;
	margin: 0 0 0.3em 0;
	text-align: center;
}
div.content .promotion {
	margin: 2% 0;
}
div.content .promotion .inner {
	padding: 5%;
}
.promotion .button {
	text-align: center;
}
.sidebar-deck .promotion .button {
	margin-bottom: -15px;
}
.promotion .button a, .banner_body .button a {
	opacity: 1;
	font-family: "Avenir W01", "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-weight: 100;
	font-size: 95%;
	padding-left: 25px;
	padding-right: 25px;
	background-color: #005880;
}
.promotion .button a:hover {
	color: #e2e4e6;
}
/*these button colors apply to other bit types like homepage banners too...*/
.button.blue-button a:link, .button.blue-button a {
	background-color: #005880;
	border-color: #005880;
}
.button.blue-button a:hover {
	background-color: #095e84;
	border-color: #094b69;
	color: #fff;
}
.button.green-button a:link, .button.green-button a {
	background-color: #77942b;
	border-color: #77942b;
}
.button.green-button a:hover {
	background-color: #7c9833;
	border-color: #6c852b;
	color: #fff;
}
.button.teal-button a:link, .button.teal-button a {
	background-color: #007c88;
	border-color: #007c88;
}
.button.teal-button a:hover {
	background-color: #09808c;
	border-color: #04717b;
	color: #fff;
}
/*if promos are designated as onethird or twothirds wide, and are anywhere on the site, make them 100% wide...*/
.sidebar .promo-outer.onethird, .sidebar .promo-outer.twothirds {
	width: 100% !important;
}
/*except if they are in a sidebar deck, then make them the designated width...*/
.sidebar-deck .promo-outer.onethird {
	width: 33.333% !important;
}
.sidebar-deck .promo-outer.twothirds {
	width: 66.666% !important;
}
.promo-outer {
	margin: 1em 0 0;
	float: none !important;
}
.promo-outer.home-feature-outer {
	margin: 0;
}

/*bracketed themes*/


/*or if the screen is smaller, then always let them be 100% again...*/
@media screen and (max-width:640px) {
.sidebar .promo-outer.onethird, .sidebar .promo-outer.twothirds {
	width: 100% !important;
	clear: both !important;
	float: left !important;
	margin-bottom: 10%;
}
.promotion {
	margin: 1% 0;
}
}
/*Theme 1*/

.theme1.promotion h2 {
	color: #f48024;
}
/*Theme 2*/

.promotion.theme2 {
	background-image: url(/img/promo-bg-t2-top.png);
}
.promotion.theme2 .inner {
	background-image: url(/img/promo-bg-t2-bot.png);
}
/*Theme 3*/

.promotion.theme3 {
	background-image: url(/img/promo-bg-t3-top.png);
}
.promotion.theme3 .inner {
	background-image: url(/img/promo-bg-t3-bot.png);
}
/*Theme 4*/

.promotion.theme4 {
	background-image: url(/img/promo-bg-t4-top.png);
}
.promotion.theme4 .inner {
	background-image: url(/img/promo-bg-t4-bot.png);
}
/*Theme 5*/

.promotion.theme5 {
	background-image: url(/img/promo-bg-t5-top.png);
}
.promotion.theme5 .inner {
	background-image: url(/img/promo-bg-t5-bot.png);
}
/*Theme 6*/

.promotion.theme6 {
	background-image: url(/img/promo-bg-t6-top.png);
}
.promotion.theme6 .inner {
	background-image: url(/img/promo-bg-t6-bot.png);
}
/*plain themes*/

.promotion.theme7 h2, .promotion.theme8 h2, .promotion.theme9 h2 {
	font-size: 20px;
	font-size: 1.25rem;
	line-height: 24px;
	line-height: 1.5rem;
}
.promotion.theme7 p, .promotion.theme8 p, .promotion.theme9 p {
}
/*Theme 7 - Plain Blue*/

.promotion.theme7, .promotion.theme7 .inner {
	background-image: none;
}
.promotion.theme7 h2 {
	color: #005880;
}
.promotion.theme7 p {
	color: #727f8a;
}
/*Theme 8 - Plain Green*/

.promotion.theme8, .promotion.theme8 .inner {
	background-image: none;
}
.promotion.theme8 h2 {
	color: #77942b;
}
.promotion.theme8 p {
	color: #007c88;
}
/*Theme 9 - Plain Teal*/

.promotion.theme9, .promotion.theme9 .inner {
	background-image: none;
}
.promotion.theme9 h2 {
	color: #007c88;
}
.promotion.theme9 p {
	color: #727f8a;
}
.promotion.rate-promotion p {
	color: #727f8a;
	text-align: center;
}
.promotion.rate-promotion p.rate {
	color: #005880;
	font-size: 52px;
	line-height: normal;
}
.promotion.rate-promotion p.alllink a {
	color: #005880 !important;
	font-weight: 700;
}
.decks .sidebar.home-features .promotion.rate-promotion {
	margin: 0;
	padding: 0;
}
.decks .sidebar.home-features .promotion.rate-promotion .inner {
	padding: 15px;
}
.decks .sidebar.home-features .promotion.rate-promotion p.rate {
	font-size: 64px;
}
.home-features .promotion.rate-promotion h2, .home-features .promotion.rate-promotion p.alllink a, .gray .promotion.rate-promotion p.rate, .gray .promotion.rate-promotion p, .teal .promotion.rate-promotion p.rate, .teal .promotion.rate-promotion p, .navy .promotion.rate-promotion p.rate, .navy .promotion.rate-promotion p {
	color: #fff !important;
}
/*inline callouts*/


div.inline-callout {
	width: 66%;
	height: 170px;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: 50px;
	float: right;
}
div.inline-callout .headline {
	width: 110px;
	height: 90px;
	margin: -15px 0 0 0;
	background-image: url(/img/cta-circle-t1.png);
	background-repeat: no-repeat;
	background-size: 100%;
	background-position: top;
	border-radius: 100px;
	border: solid 10px #fff;
	float: left;
	padding: 52px 40px;
	background-color: #fff;
}
div.inline-callout .headline h3 {
	color: #fff;
	font-family: 'Flux-Regular', 'Helvetica Neue', Helvetica, Arial, sans-serif;
	font-size: 42px;
	line-height: 42px;
	text-align: center;
	margin: 0;
}
/*inline callout theme 2 styles*/
div.inline-callout.theme2 {
	background-position: -50px;
}
div.inline-callout.theme2 .headline {
	float: right;
	background-image: url(/img/cta-circle-t2.png);
}
div.inline-callout.theme2 .headline h3 {
}

@media screen and (max-width: 860px) {
div.inline-callout {
	width: 75%;
	height: 170px;
	background-position: 50px;
}
}

@media screen and (max-width: 620px) {
div.inline-callout {
	width: 100%;
	height: 170px;
	margin: 10% 0;
	float: none;
	clear: both;
}
}
/*If placed in the sidebar...*/

div.sidebar div.inline-callout {
	width: 100%;
	height: 170px;
	margin: 10% 0;
	float: none;
	clear: both;
}
/*---------5. Content Decks / Icon Decks---------*/

.contentdeck.onehalf, .contentdeck.onethird, .contentdeck.onefourth, .contentdeck.onefifth {
	width: 100% !important;
}
.contentdeck.onehalf .inner, .contentdeck.onethird .inner, .contentdeck.onefourth .inner, .contentdeck.onefifth .inner, .contentdeck.icon-grid .inner {
	max-width: 990px !important;
}
/*if two columns is selected, don't display columns 3, 4 and 5*/
.contentdeck.onehalf .multicol3, .contentdeck.onehalf .multicol4, .contentdeck.onehalf .multicol5 {
	display: none;
}
/*if three columns is selected, don't display columns 4 and 5*/
.contentdeck.onethird .multicol4, .contentdeck.onethird .multicol5 {
	display: none;
}
/*if four columns is selected, don't display column 5*/
.contentdeck.onefourth .multicol5 {
	display: none;
}
/*apply offset column widths*/

.contentdeck.onethird-twothirds .multicol1 {
	width: 33%;
}
.contentdeck.onethird-twothirds .multicol2 {
	width: 66%;
}
.contentdeck.twothirds-onethird .multicol1 {
	width: 66%;
}
.contentdeck.twothirds-onethird .multicol2 {
	width: 33%;
}
.contentdeck.onefourth-threefourths .multicol1 {
	width: 25%;
}
.contentdeck.onefourth-threefourths .multicol2 {
	width: 75%;
}
.contentdeck.threefourths-onefourth .multicol1 {
	width: 75%;
}
.contentdeck.threefourths-onefourth .multicol2 {
	width: 25%;
}
.contentdeck.onethird-twothirds .multicol3, .contentdeck.onethird-twothirds .multicol4, .contentdeck.onethird-twothirds .multicol5 {
	display: none;
}
.contentdeck.onefourth-threefourths .multicol3, .contentdeck.onefourth-threefourths .multicol4, .contentdeck.onefourth-threefourths .multicol5 {
	display: none;
}

@media screen and (max-width:600px) {
.contentdeck.onethird-twothirds .multicol1, .contentdeck.twothirds-onethird .multicol1 {
	width: 100% !important;
	display: block;
	float: none;
}
.contentdeck.onethird-twothirds .multicol2, .contentdeck.twothirds-onethird .multicol2 {
	width: 100% !important;
	display: block;
	float: none;
}
.contentdeck.onefourth-threefourths .multicol1, .contentdeck.threefourths-onefourth .multicol1 {
	width: 100% !important;
	display: block;
	float: none;
}
.contentdeck.onefourth-threefourths .multicol2, .contentdeck.threefourths-onefourth .multicol2 {
	width: 100% !important;
	display: block;
	float: none;
}
}
.multicol-inner {
	padding: 1em !important;
}
.icondeck .icon-intro {
	text-align: center;
}
/* ================ 6. Responsive Lists ================ */


.list {
}
.list-row {
	clear: both;
	border-bottom: 1px solid #d6dedd;
	margin: 0;
}
.seminars-list .list-row {
	margin: 1em 0 0;
}
.list-row:last-child {
	border-bottom: none;
}
.list-row.separator {
	clear: both;
	border-bottom: 4px solid #007c88;
}
.list-head {
	clear: both;
	border-bottom: 1px solid #439fa7;
	background: #439fa7;
}
.list-head.list-head-main {
	display: block;
}
.list-head.list-head-repeated {
	display: none;
}
.list .list-item {
	display: inline-block;
	float: left;
	padding: 1% 0;
}
.list .list-item, .list .list-item li, .list .list-item p {
	font-size: 13px;
	font-size: 0.8125rem;
	text-align: center;
	line-height: normal;
}
.list .list-item h5 {
	font-size: 22px;
	font-size: 1.375rem;
}
.list .list-item ul {
	margin: 0 0 5% 0;
	padding: 0 0 0 5%;
}
/*font awesome asterisk added to content*/
.list .list-item .asterisk {
	display: inline;
	margin: 0 -12px 0 0;
	font-size: .7em;
}
.list .list-item .dot {
	font-size: 36px;
	color: #77942b;
	text-align: center;
	width: 40px;
	margin: auto;
	display: block;
}
.list .head {
	padding: 0;
	background: #439fa7;
	color: #ffffff;
	font-size: 14px;
	font-size: 0.875rem;
	text-align: center;
	line-height: normal;
}
.list .head .inner {
	padding: 10px 6px;
}
.list .title {
	width: 40%;
}
.list .date {
	white-space: nowrap;
	width: 20%;
}
.list .time {
	white-space: nowrap;
	width: 10%;
}
.list .location {
	width: 30%
}
.list .cost {
	width: 10%;
}
div.list div.list-row {
	background: #f5f5f5;
}
div.list div.list-row:nth-child(even) {
	background: #f5f5f5;
}
div.list div.list-row:nth-child(4n+3) {
	background: #eaeaea;
}
div.account-compare p {
	margin: auto;
	font-size: 14px;
	font-size: 0.875rem;
	line-height: 18px;
	line-height: 1.125rem;
	text-align: center;
}
.account-compare h2 {
	text-align: center;
	font-weight: 700;
}
div div.list-row .list-item:last-child .inner {
	border-right: none;
}
div.list-row .list-item h4 {
	margin: 0 0 8px 0;
	color: #007c88;
	font-size: 14px;
	font-size: 0.875rem;
	line-height: normal;
	font-weight: 700;
}
div.list-row .list-item h5 {
	margin: 0;
}
div.list-row .list-item:last-child .inner {
	border: none !important;
}

@media screen and (max-width:769px) {
.list .list-item.onehalf {
	width: 98% !important;
	clear: none;
}
.list .list-item.onethird {
	width: 40% !important;
	clear: none;
}
.list .list-item.onefourth {
	width: 33.33333% !important;
	clear: none;
}
.list .list-item.onefifth {
	width: 24% !important;
	clear: none;
}
.list .list-item.onesixth {
	width: 20% !important;
	text-align: center;
	clear: none;
}
.list-head.list-head-main {
	display: none;
}
.list-head.list-head-repeated {
	display: block;
}
div.list-row .list-item.account, div.list-row .list-item.first {
	width: 100% !important;
	clear: right;
	border-right: none;
}
div.account-compare div.list-row .list-item, div.account-compare div.list-row .list-item .inner {
	min-height: 0;
}
div div.list-row .list-item.account, div div.list-row .list-item.account .inner, div div.list-row .list-item.first .inner {
	min-height: 1em !important;
	margin: 0;
	border-right: none;
}
div div.list-row .list-item .inner {
	min-height: 150px;
}
div .list-item.first-head {
	display: none;
}
div .list-item.second .inner, div .list-item.third .inner, div .list-item.fourth .inner, div .list-item.fifth .inner {
	padding: 1em 4% !important;
}
div .list-item.second .inner {
	padding-left: 1em !important;
}
.list-item.third, .list-item.third-head, .list-item.fourth, .list-item.fourth-head, .list-item.fifth, .list-item.fifth-head {
	text-align: center;
}
}

@media screen and (max-width:640px) {
.list .title {
	font-weight: 700;
	font-size: 16px;
}
.list .title, .list .location, .list .date, .list .time {
	width: 100%;
	clear: both;
}
.list-head {
	display: none;
}
.list .list-item, .list .list-item li, .list .list-item p {
	text-align: left;
}
}

@media screen and (max-width:440px) {
.list .head {
	font-size: 10px;
	font-size: 0.625rem;
	line-height: normal;
}
}
.list.seminars-list .head {
	background: transparent !important; /* color:#007c88; */
}
.list.seminars-list .list-row {
	background: transparent !important;
	color: #005880;
}


/* ================ 7. Comparison Charts ================ */

.comparison li {list-style:none;}

/* ================ 8. --- ================ */


/* responsive video container */
.video-container, .embed-container {
	position: relative;
	padding-bottom: 56.25%;
	padding-top: 30px;
	height: 0;
	overflow: hidden;
}
.video-container iframe, .video-container object, .video-container embed, .embed-container iframe, .embed-container object, .embed-container embed {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
.video-container, .embed-container {
	box-shadow: 5px 0 10px -5px rgba(0,0,0,.5), -5px 0 10px -5px rgba(0,0,0,.5);
	-moz-box-shadow: 5px 0 10px -5px rgba(0,0,0,.5), -5px 0 10px -5px rgba(0,0,0,.5);
	-webkit-box-shadow: 5px 0 10px -5px rgba(0,0,0,.5), -5px 0 10px -5px rgba(0,0,0,.5);
	margin: 16px 0;
}
/* ================ 9. Icon Feature Decks ================ */

/*9.1 home icon features in sidebar / login deck*/

.promotion.home-feature .iconimg {
	min-height: 90px;
	max-width: 270px;
	background-size: cover;
	margin: auto;
	background-position: 50%;
}
.promotion.home-feature h2 {
	color: #fff;
}
/*9.2 Small Image Based Icons - two bit types styled here -- icon decks for laying out extras icons, and extras icons themselves. */

.contentdeck.icondeck .icon-row {
	display: none;
	width: auto;
	margin: auto;
}
.contentdeck.icondeck.numicons1 .icon-row.row1 {
	display: block;
	width: 100%;
}
.contentdeck.icondeck.numicons2 .icon-row.row2 {
	display: block;
	width: 100%;
}
.contentdeck.icondeck.numicons3 .icon-row.row3 {
	display: block;
	width: 100%;
}
.contentdeck.icondeck.numicons4 .icon-row.row4 {
	display: block;
	width: 100%;
}
.contentdeck.icondeck.numicons5 .icon-row.row5 {
	display: block;
	width: 50%;
}
.contentdeck.icondeck.numicons5 .icon-row.row5-2 {
	display: block;
	width: 100%;
}
.contentdeck.icondeck.numicons6 .icon-row.row6 {
	display: block;
	width: 100%;
}
.contentdeck.icondeck.numicons6 .icon-row.row6-2 {
	display: block;
	width: 100%;
}
.contentdeck.icondeck.numicons7 .icon-row.row7 {
	display: block;
	width: 75%;
}
.contentdeck.icondeck.numicons7 .icon-row.row7-2 {
	display: block;
	width: 100%;
}
.contentdeck.icondeck.numicons8 .icon-row.row8 {
	display: block;
	width: 100%;
}
.contentdeck.icondeck.numicons8 .icon-row.row8-2 {
	display: block;
	width: 100%;
}

@media screen and (min-width:767px) {
.deck-feature {
	float: left;
}
.deck-feature.small-feature {
	height: 170px;
	overflow: hidden;
	max-width: 100%;
	min-width: 100%;
}
.deck-feature.circle-feature {
	height: 230px;
	overflow: hidden;
	max-width: 33%;
	min-width: 33%;
}
}
.deck-feature {
	text-align: center;
}
.deck-feature .inner {
}
.deck-feature h4 {
	width: auto;
	font-size: 21px;
	font-size: 1.3125rem;
	font-weight: 700;
	color: #005880;
	margin: 0;
	padding: 0;
	line-height: 24px;
	line-height: 1.5rem;
	min-height: 30px;
	text-align: left;
	display: inline-block;
}
.deck-feature .deck-copy {
	font-size: 15px;
	font-size: 0.9375rem;
	font-weight: 100;
	color: #226e91;
	line-height: 17px;
	line-height: 1.0625rem;
}
/*Icon Catalog*/

.deck-feature h4.deck-icon {
	font-family: 'Avenir W01', 'Helvetica Neue', Helvetica, Arial, sans-serif !important;
}
.deck-feature h4.deck-icon.fa:before {
	margin: 0 10px;
	font-family: FontAwesome;
	font-weight: normal;
}
.deck-feature h4.deck-icon.small-icon {
	padding: 4px 0 0 36px;
	background-position: left top;
	background-repeat: no-repeat;
	background-size: 30px;
	text-align: center;
}
.deck-feature h4.deck-icon.fa {
	padding: 4px 0;
}
.deck-feature h4.small-icon.credit-card {
	background-image: url(/img/deck-icons-sm-credit-card.png);
}
.deck-feature h4.small-icon.computer {
	background-image: url(/img/deck-icons-sm-computer.png);
}
.deck-feature h4.small-icon.mobile-phone {
	background-image: url(/img/deck-icons-sm-mobile-phone.png);
}
.deck-feature h4.small-icon.paper-airplane {
	background-image: url(/img/deck-icons-sm-paper-airplane.png);
}
.deck-feature h4.small-icon.pencil-paper {
	background-image: url(/img/deck-icons-sm-pencil-paper.png);
}
.deck-feature h4.small-icon.phone {
	background-image: url(/img/deck-icons-sm-phone.png);
}
.deck-feature h4.small-icon.safe {
	background-image: url(/img/deck-icons-sm-safe.png);
}
.deck-feature h4.small-icon.globe {
	background-image: url(/img/deck-icons-sm-globe.png);
}
.deck-feature h4.small-icon.clock {
	background-image: url(/img/deck-icons-sm-clock.png);
}
.deck-feature h4.small-icon.texting {
	background-image: url(/img/deck-icons-sm-texting.png);
}
.deck-feature h4.small-icon.currency {
	background-image: url(/img/deck-icons-sm-currency.png);
}
.deck-feature h4.small-icon.transfer {
	background-image: url(/img/deck-icons-sm-transfer.png);
}
.deck-feature h4.small-icon.transfer-now {
	background-image: url(/img/deck-icons-sm-transfernow.png);
}
.deck-feature h4.small-icon.pop-money {
	background-image: url(/img/deck-icons-sm-popmoney.png);
}
.deck-feature h4.small-icon.abacus {
	background-image: url(/img/deck-icons-sm-abacus.png);
}
.deck-feature h4.small-icon.paycalendar {
	background-image: url(/img/deck-icons-sm-paycalendar.png);
}
.deck-feature h4.small-icon.paystopwatch {
	background-image: url(/img/deck-icons-sm-paystopwatch.png);
}
.deck-feature h4.small-icon.snailmail {
	background-image: url(/img/deck-icons-sm-snailmail.png);
}
.deck-feature h4.small-icon.wallet {
	background-image: url(/img/deck-icons-sm-wallet.png);
}

.deck-feature h4.small-icon.shop {
	background-image: url(/img/deck-icons-sm-shop.png);
}
.deck-feature h4.small-icon.touch {
	background-image: url(/img/deck-icons-sm-touch.png);
}
.deck-feature h4.small-icon.singlelogin {
	background-image: url(/img/deck-icons-sm-singlelogin.png);
}
.deck-feature h4.small-icon.secure {
	background-image: url(/img/deck-icons-sm-secure.png);
}
.deck-feature h4.small-icon.rewards {
	background-image: url(/img/deck-icons-sm-rewards.png);
}





.deck-feature h4.deck-icon.circle-icon {
	padding: 70px 0 0 0;
	background-position: center top;
	background-repeat: no-repeat;
	background-size: 60px;
	font-size: 15px;
	font-size: 0.9375rem;
	line-height: 19px;
	line-height: 1.1875rem;
	text-align: center;
}
.deck-feature h4.small-icon.circle-barchart {
	background-image: url(/img/deck-icons-sm-circle-barchart.png);
}
.deck-feature h4.small-icon.circle-calendar-heart {
	background-image: url(/img/deck-icons-sm-circle-calendar-heart.png);
}
.deck-feature h4.small-icon.circle-clock {
	background-image: url(/img/deck-icons-sm-circle-clock.png);
}
.deck-feature h4.small-icon.circle-award {
	background-image: url(/img/deck-icons-sm-circle-award.png);
}
.deck-feature h4.small-icon.circle-health {
	background-image: url(/img/deck-icons-sm-circle-health.png);
}
.deck-feature h4.small-icon.circle-books {
	background-image: url(/img/deck-icons-sm-circle-books.png);
}
/*9.3 Large Landing Page Image Based Icons */

.deck-feature.large-feature h4 {
	text-align: center;
}
.deck-feature.large-feature, .deck-feature a {
	min-height: 220px;
	display: block;
}
.deck-feature a {
	padding: 10px 0 0 0;
	text-decoration:none !important;
}
.deck-feature a:hover, .wrapper.personalhomeequity .deck-feature.home-equity a, .wrapper.personalautoloans .deck-feature.auto-loans a, .wrapper.personalboatrvloan .deck-feature.boat-rv-loan a, .wrapper.personalotherloanslinesofcredit .deck-feature.other-loans a {
	text-decoration: none;
	background-color: #439fa7;
}

@media screen and (max-width:600px) {
.deck-feature a {
	border-bottom: 1px solid #439fa7;
}
}
/*Icon Catalog for Landing Icons...*/

/*personal / loans*/

.deck-feature .landing-icon {
	width: 75px;
	height: 75px;
	background-repeat: no-repeat;
	background-size: 75px;
	margin: 1em auto;
}
.deck-feature .landing-icon.auto-loans {
	background-image: url(/img/landing-icon-auto-loan.png);
}
.deck-feature .landing-icon.home-equity {
	background-image: url(/img/landing-icon-home-equity.png);
}
.deck-feature .landing-icon.other-loans {
	background-image: url(/img/landing-icon-other-loans.png);
}
.deck-feature .landing-icon.boat-rv-loan {
	background-image: url(/img/landing-icon-boat-rv-loan.png);
}
/*personal / account access*/

.deck-feature .landing-icon.online-banking {
	background-image: url(/img/landing-icon-online-banking.png);
}
.deck-feature .landing-icon.mobile-banking {
	background-image: url(/img/landing-icon-mobile-banking.png);
}
.deck-feature .landing-icon.telephone-teller {
	background-image: url(/img/landing-icon-telephone-teller.png);
}
.deck-feature .landing-icon.wire-transfers {
	background-image: url(/img/landing-icon-wire-transfers.png);
}
/* ================ 10. Page structure and layout bits ================ */


/*10.1 sticky menu bar*/
.sticky-menu {
	width: 100%;
	background-color: #005880;
	height: 60px;
	padding: 0;
	margin: 0;
	border-bottom: solid 1px #fff;
}
.sticky-menu ul {
	max-width: 990px;
	height: 60px;
	margin: 0 auto;
	padding: 0;
	display: block;
}
.sticky-menu ul li {
	display: table-cell;
	height: 60px;
	vertical-align: bottom;
	float: left;
	min-width: 20%;
}
.sticky-menu ul li a {
	display: block;
	height: 18px;
	padding: 20px 50px;
	text-align: center;
	margin: 2px 0 0;
	color: #fff;
	text-decoration: none;
	font-size: 18px;
	font-size: 1.125rem;
	font-weight: 500;
	white-space: nowrap;
}
.sticky-menu ul li a:hover, .sticky-menu ul li.active a {
	background-color: #fff;
	color: #005880;
}
.isStuck {
	width: 100%;
	top: 0;
	left: 0;
	position: fixed;
	z-index: 10;
}

@media screen and (max-width:930px) {
.sticky-menu ul li a {
	padding: 20px 30px;
}
}

@media screen and (max-width:600px) {
.sticky-menu ul li a span {
	display: none;
}
.sticky-menu div.sticky-menu-button a {
	display: block;
	font-size: 10px !important;
	text-align: center;
	height: auto;
	margin-top: 0;
}
.sticky-menu div.sticky-menu-button {
	margin-top: 15px;
}
}
/* wrapping, expanding, and shrinking sticky-menu additions */

.sticky-menu {
	height: auto;
	text-align: center;
}
.sticky-menu ul {
	height: auto;
	display: block;
	overflow: hidden;
	text-align: center;
}
.sticky-menu ul li {
	min-width: 13.5%;
	height: auto;
	position: relative;
	display: inline;
	text-align: center;
	float: none;
}
.sticky-menu ul li a {
	font-size: 18px;
	height: auto;
	min-height: 18px;
	display: inline-block;
}

@media screen and (max-width: 767px) {
.sticky-menu ul li a span {
	display: inline-block;
}
.sticky-menu ul li a {
	font-size: 15px;
	padding: 5px 10px;
}
}

@media screen and (max-height:700px) and (max-width:680px), (max-height:1024px) and (max-width:768px) {
.sticky-menu {
	display: none;
}
.contentdeck.hasmenuitem {
	padding-top: 20px !important;
}
}
/*10.2 product page content decks*/

div.contentdeck {
	border-bottom: solid 1px #ccc;
	padding-top: 20px;
}
.contentdeck.hasmenuitem, .microsite_elections .contentdeck {
	padding-top: 77px;
}

@media screen and (max-width: 767px) {
.contentdeck.hasmenuitem {
	padding-top: 50px;
}
div.contentdeck h3 {
	font-size: 32px;
	font-size: 2rem;
}
}
/*div.contentdeck:last-of-type {
	border-bottom: none;
}
*/div.contentdeck.sidebar-deck:last-of-type {
	border-bottom: solid 1px #ccc !important;
}
div.contentdeck div.deckinner {
	padding: 0;
	max-width: 990px;
	margin: auto;
}
div.contentdeck h3 {
	text-align: center;
	margin-bottom: 1%;
	font-weight: 700;
	font-size: 37px;
	font-size: 2.3125rem;
}

/*dont center align the h3 title in content decks that use the offset alignment...*/
div.contentdeck.twothirds-onethird h3, div.contentdeck.onethird-twothirds h3, div.contentdeck.onefourth-threefourths h3, div.contentdeck.threefourths-onefourth h3 {
	text-align:inherit;
}


div.contentdeck.white {
	background-color: #fff;
}
div.contentdeck.white a {
	text-decoration:none;
}
div.contentdeck.white h3 {
	color: #77942b;
}
div.contentdeck.gray {
	background-color: #ccc;
}
div.contentdeck.gray, div.contentdeck.gray h3, div.contentdeck.gray h4, div.contentdeck.gray p, div.contentdeck.gray a {
	color: #727F89 !important;
}
div.contentdeck.teal {
	background-color: #007c88;
	border-bottom-color: #007c88;
}
div.contentdeck.teal, div.contentdeck.teal h3, div.contentdeck.teal h4, div.contentdeck.teal p {
	color: #fff !important;
}
div.contentdeck.navy {
	background-color: #005880;
	border-bottom-color: #005880;
}
div.contentdeck.teal, div.contentdeck.teal h2, div.contentdeck.teal h3, div.contentdeck.teal h4, div.contentdeck.teal p, div.contentdeck.navy, div.contentdeck.navy h2, div.contentdeck.navy h3, div.contentdeck.navy h4, div.contentdeck.navy p, div.contentdeck.gray .deck-feature .deck-copy, div.contentdeck.teal .deck-feature .deck-copy, div.contentdeck.navy .deck-feature .deck-copy
{
	color: #fff !important;
}

/*make all faq items in content decks white*/
div.contentdeck ul.faq-list li
{
	color: #fff !important;
}

div.contentdeck.white ul.faq-list li 
{
	color: #1F596C !important;
}




div.contentdeck.teal p a {
	color: #e7f3f4;
}
div.contentdeck.navy p a {
	color: #e2ecf1;
}
div.contentdeck.teal a.button, div.contentdeck.navy a.button div.contentdeck.teal .button a, div.contentdeck.navy .button a {
	color: #fff;
}
div.contentdeck.gray h3 {
	font-weight: 300;
}
/*multi column support*/
div.contentdeck.onewhole, div.contentdeck.onehalf, div.contentdeck.onethird {
	width: 100% !important;
}
/*if one column layout is selected, don't display col2 or col3*/
div.contentdeck.onewhole div.deckinner div.multicol2, div.contentdeck.onewhole div.deckinner div.multicol3 {
	display: none;
}
/*if two column layout is selected, don't display col3*/
div.contentdeck.onehalf div.deckinner div.multicol3 {
	display: none;
}
div.contentdeck div.page_body {
	padding: 0 !important;
}
div.contentdeck.sidebar-deck {
	padding-top: 10px;
	margin-bottom: 70px;
}
.homepage div.contentdeck.sidebar-deck {
	margin-bottom: 20px;
}
div.contentdeck.landingdeck {
	padding-top: 0;
}
div.contentdeck.landingdeck .inner {
	padding: 0;
}
div.contentdeck.landingdeck .inner p { /*don't display paragraphs in landing decks. No need to and the stray ones are taking up space. All that should display in a landing deck are the icon bits for the deck which don't contain P's.*/
	display: none;
}
div.landingdeck .inner.multicol-inner {
	padding: 0 !important;
}
div.deck-feature.large-feature a .inner {
	padding: 1em !important;
}
/*make tweaks to the promotions when they are placed in a deck oriented sidebar on a product page... */

.decks .sidebar {
	width: 100%;
	display: table;
}
.decks .sidebar .onethird, .decks .sidebar .twothirds {
	display: table-cell;
	vertical-align: bottom;
}
.decks .sidebar .promotion {
	margin: 20px 5% 0px;
}
.decks .sidebar .promotion.home-feature /*homepage feature icons in login deck*/ {
	margin: 0 5%;
}
.decks .sidebar .inner {
	max-width: 990px;
	margin: auto;
}
/*specific content deck formatting*/



div.contentdeck.navy a.fancy-button:link, div.contentdeck.navy a.fancy-button:visited, div.contentdeck.navy a.fancybutton:link, div.contentdeck.navy a.fancybutton:visited, div.contentdeck.navy div.fancybutton a:link, div.contentdeck.navy div.fancybutton a:visited, div.contentdeck.navy div.fancy-button a:link, div.contentdeck.navy div.fancy-button a:visited, div.contentdeck.navy input.fancy-button {
	background-color: #f48024;
	border: solid 1px #f48024;
	opacity: 1;
}
div.contentdeck.navy a.fancy-button:hover, div.contentdeck.navy a.fancybutton:hover, div.contentdeck.navy input.fancy-button:hover {
	background-color: #439fa7 !important;
	border: solid 1px #439fa7 !important;
}

@media screen and (max-width: 640px) {
div.contentdeck h3 {
	font-size: 32px;
	font-size: 2rem;
}

.homepage div.contentdeck.sidebar-deck {
margin-bottom: 0;
}
}






/* ================ 11. Special bit displays ================ */



/*11.1  -- featured employee / loan officer random displays*/


.officer-image {
	max-width: 220px;
	border-radius: 4px;
	border: solid 1px #666;
}
div.biolist {
	margin-bottom: 45px;
}
div.biolist p {
	font-size: 16px;
	line-height: 22px;
}
div.biolist h4 {
	color: #005880;
	margin-bottom: 5px;
}
div.biolist div.biopic img {
	margin: 0 10px 0 0;
	padding: 5px;
	box-shadow: 5px 0 10px -5px rgba(0,0,0,.3), -5px 0 10px -5px rgba(0,0,0,.3);
	-moz-box-shadow: 5px 0 10px -5px rgba(0,0,0,.3), -5px 0 10px -5px rgba(0,0,0,.3);
	-webkit-box-shadow: 5px 0 10px -5px rgba(0,0,0,.3), -5px 0 10px -5px rgba(0,0,0,.3);
	border: 0;
	-webkit-border-radius: 0;
	-moz-border-radius: 0;
	-o-border-radius: 0;
	border-radius: 0;
}
div.biopic {
	display: inline;
	width: 230px;
}
div.bio-area {
	width: 68%;
	float: left;
	display: inline;
	color: #727F8A;
	line-height: 27px;
}
div.bio-name {
	font-size: 18px;
	font-weight: 700;
	color: #007c88;
}
div.bio-title {
	font-size: 15px;
	font-weight: 700;
	color: #007c88;
	margin-bottom: 10px;
}

@media screen and (max-width: 767px) {
div.biolist {
	margin-bottom: 25px;
}
div.biopic {
	display: block;
	width: 100%;
	text-align: center;
	padding-top: 20px;
	margin-top: 20px;
}
div.bio-area {
	display: block;
	width: 100%;
}
}
/* Readmore plugin styles */
div.readmoreplugin {
	display: block;
	margin-top: 20px;
	border-bottom: 1px dotted #dedede;
	padding-bottom: 5px;
}
div.readmoreplugin p {
	color: #727F8A;
}
a.readmore-js.toggle {
	clear: both;
	margin-top: 10px;
}
