/* =============================================================================
  RESETS
============================================================================= */
html,
body,
div,
h1,
a,
video {
	margin: 0;
	padding: 0;
}

/* =============================================================================
	HTML, BODY
============================================================================= */
body,h1,h2,h3,h4,h5,h6 {font-family: 'Encode Sans Condensed', sans-serif;}
.w3-bar,.w3-bar-item,h1,button {font-family: 'Encode Sans Condensed', sans-serif;}
.w3-bar,.w3-bar-item{height:43px;display:inline-block;}

/* =============================================================================
	INDEX
============================================================================= */
.slideshow {
	margin-top: 175px;
}

@media(min-width: 768px) {
	.slideshow img {
		width: 38% !important;
	}
}

.tandemred {
	color: #9a0000;
}
.tandemblue {
	color: #042475;
}
.tandemredbtn, .tandembluebtn {
	color: #fff;
	font-weight: bold;
	width: 16%;
	padding: 15px;
}
.tandemredbtn {
	background-color: #9a0000;
}
.tandembluebtn {
	background-color: #042475;
}
hr.shadow {
	height: 30px;
	border-style: solid;
	border-color: #8c8b8b;
	border-width: 1px 0 0 0;
	width: 70%;
	margin-left: auto;
	margin-right: auto;
}
.banners img {
	padding-left: 10px;
	padding-right: 10px;
}

/* =============================================================================
	PAGES
============================================================================= */
header {
	margin-top: 175px;
	background-image: url('images/piggy-bank.jpg');
	color: #fff;
	height: 250px;
	background-attachment: fixed;
	background-position: bottom;
	background-repeat: no-repeat;
	background-size: cover;
}

header h1 {
	padding-top: 50px;
	font-size: 5em;
	letter-spacing: 3px;
	text-shadow: 1px 1px #000;
}
.footer {
	background-color: #042475;
	color: #fff;
}
.footer a {
	color: #fff !important;
}
.footerbtn {
	color: #042475 !important;
	font-weight: bold;
	background-color: #fff !important;
}
h2, h3, h4 {
	color: #9a0000;
	font-weight: bold;
}
h5 {
	color: #042475;
	font-weight: bold;
}
hr {
	border: 1px dotted #9a0000;
}
a {
	text-decoration: none;
	color: #9a0000;
}
img {
    max-width: 100%;
    height: auto;
}
.active {
	color: #fff !important;
}
.tableheading {
	background-color: #042475;
	color: #fff;
	font-weight: bold;
	text-align: center;
	font-variant: small-caps;
	font-size: 1.2em;
}
#holidays, #privacy, #rates td:first-child {
    font-weight: bold;
}
#rates td {
	width: 25%;
}
:target:before {
  content:"";
  display:block;
  height:200px; /* fixed header height*/
  margin:-200px 0 0; /* negative fixed header height */
}

.news ul {
	list-style: none;
	padding: 0;
}
.news li {
	list-style: none;
	padding-left: 1.5em;
	line-height: 2;
}
.news li:before {
	content: "\f1ea"; /* FontAwesome Unicode */
	font-family: FontAwesome;
	display: inline-block;
	margin-left: -1.6em; /* same as padding-left set on li */
	width: 1.6em; /* same as padding-left set on li */
}
.successmessage {
	font-size: 1.3em;
	font-weight: bold;
}
label {
	font-weight: bold;
	font-size: 1.1em;
	letter-spacing: 2px;
}
.city {
	font-size: 1.4em;
	line-height: 2.0;
	font-weight: bold;
}

/* =============================================================================
	NAV
============================================================================= */
.navlinks {
	text-transform: uppercase;
}
.navlinks a:hover {
	color: #9a0000 !important;
	background-color: #fff !important;
}
.loginbttn {
	background-color: #9a0000 !important;
	color: #fff !important;
	text-transform: uppercase;
}
.loginbttn:hover {
	background-color: #9a0000 !important;
}
.topbar {
	padding: 10px 0 10px 0;
	min-width: 100%;
}
.activenav {
	color: #9a0000 !important;
	font-weight: bold;
}
.lostorstolen {
	height: 75px;
	width: 210px;
	margin-top: -65px;
	margin-left: 10px;
}
/* =============================================================================
	BRANCH LOCATOR
============================================================================= */
#boxcontainer {
	width: 100%;
	border: 2px dashed #9a0000;
	border-radius: 9px;
	padding: 30px;
}

#coopsearchbox {
	padding: 3px;
}

#cooplogos {
	width: 100%;
	text-align: center;
}
#cooplogo1, #cooplogo2 {
	height: 150px;
}

#coopsearch {
	clear: both;
	width: 100%;
	color: #9a0000;
	font-size: 1.1em;
	font-weight: bold;
	text-align: center;

}

#searchheader{
	margin:0px; padding:0px 0px 5px 0px;
	font-size: 1.5em;
	text-align: center;
}

#zipsearch {
	border-radius: 5px;
	width: 150px;
}

#findlocations {
	color: white;
	background-color: #042475;
	line-height: 10px;
}



.logo-header {
	float: left;
}

.links-header {
	display: flex;
	margin-top: 26px;
    margin-left: 30px;
    float: left;
}
.links-header a {
	padding: 10px 20px;
	color: #fff;
	margin-right: 10px;
}
.links-header a:nth-child(1) {
	background: #9a0000;
}
.links-header a:nth-child(2) {
	background: #042475;
}
.links-mobile {
	display: none;
}
/* =============================================================================
	MEDIA QUERIES
============================================================================= */
@media only screen and (max-width: 850px) {
	header, footer {
		margin-left: 0%;
	}
	header {
		margin-top: 125px;
	}
	header h1 {
		font-size: 2.5em;
	}
	.header {
		margin-top: 40px;
	}
	.wrapper {
		margin-left: 0px;
	}
	.topbar {
		display: none;
	}
	.navbar {
		height: 125px;
	}
	.mobilebttn {
		width: 100%;
	}
}
@media only screen and (max-width: 768px){
	.google-map {
		width: 725px;
	}
	.links-mobile {
		margin-top: -24px;
		margin-bottom: 20px;
		display: flex;
	}
}
@media only screen and (max-width: 425px){
	.google-map {
		width: 375px;
	}
}
@media only screen and (max-width: 375px){
	.google-map {
		width: 335px;
	}
}
@media only screen and (max-width: 320px){
	.google-map {
		width: 275px;
	}
}