﻿/* Website color attributes

Please Note:
To maintain color schemes - If one color attribute is modified, make sure to modify other attributes that also use the same color.  

/* Set background color of entire site*/
body, #mainBodyOverlay, #mainBodyCornerL, #mainBodyCornerR {
	background-color: #CCCCCC;
}
/* Set main highlight color - default blue */
#obloginxy, #footergraphic, #mainimgColor, #mainNav a:hover, body.navGroup1 #nav1_btn1 a, body.navGroup2 #nav1_btn2 a, #logos, .styledtable caption {
	background-color: #003263;
}
/* Set secondary highlight color - default orange */
#mainNav li div ul li a:hover, #content1 h1, .color, #features a:hover, #mainimgContent a:hover {
	color: #b12a1c !important;
}
/* Set main navigation font color - default is blue to match main highlight color */
#topnav, #topnav li a, #search, #onlinebanking, #obloginLinks, #obloginLinks a, #mainNav li a, #mainNav li div ul li a, #content1 h2, #content1 a, #features h1, #mainimgContent, #mainimgContent a {
	color: #003263;
}
/* Set topnav hover and footer font color  - default white */
#topnav li a:hover, #mainNav li a:hover, body.navGroup1 #nav1_btn1 a, body.navGroup2 #nav1_btn2 a {
	color: #ffffff;
}
#footerContent, #footerContent a {
	color: #333;
}

/* Set as the same as main navigation font color - this is needed due to cascading */
#mainNav li div ul li a {
	color: #003263 !important;
}
/* Set main body font color - default grey */
#content1 p, #content1 h3, #content1 ul,#content1 ol, #features a, .styledtable {
	color: #666666;
}

/* End of color attributes */


body {
	margin: 0px;
	padding: 0px;
	height: 100%;
	width: 100%;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
}
#page {
	width: 967px;
	margin-left: auto;
	margin-right: auto;
	position: relative;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 5px;
	padding-left: 0px;
}
#header {
	height: 100px;
}
/*#logoLinkOverlay {
	position: absolute;
	height: 100px;
	width: 270px;
	z-index: 130;
	left: 0px;
	top: 0px;
}*/
#logo { /* Set #logo div dimensions to financial institution's logo height and width.*/
	background-image: url(images/Sentrylogo.png);
	background-repeat: no-repeat;
	height: 68px;
	width: 220px;
	margin-top: 20px;
	margin-left: 10px;
	float: left;
}
#search {
	position: absolute;
	z-index: 250;
	top: 20px;
	right: 10px;
	text-align: right;
	font-weight: bold;
}
#topnav {
	height: 25px;
	font-size: 12px;
	text-align: right;
	float: right;
	position: absolute;
	z-index: 200;
	top: 50px;
	right: 10px;
	margin-top: 5px;
}
#topnav ul {
	display: inline;
	width: auto;
	float: right;
	margin: 0px;
	padding: 0px;
}
#topnav li {
	display: inline;
	float: left;
	margin: 0px;
	padding-top: 5px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
}
#topnav li a {
	text-decoration: none;
	margin-right: 10px;
	margin-left: 10px;
}
#mainBodyContainer {
	background-color: #FFFFFF;
	margin: 0px;
	padding: 0px;
	position: relative;
}
#mainBodyCornerL {
	height: 21px;
	width: 10px;
	z-index: 5;
	left: 0px;
	top: -1px;
	position: absolute;
	background-image: url(images/corners_overlayL.png);
}
#mainBodyCornerR {
	height: 21px;
	width: 10px;
	z-index: 5;
	left: 957px;
	top: -1px;
	position: absolute;
	background-image: url(images/corners_overlayR.png);
}
#mainBodyOverlay {
	background-image: url(images/divider_overlay.png);
	height: 434px;
	width: 28px;
	background-repeat: no-repeat;
	background-position: top;
	position: absolute;
	left: 260px;
	top: -1px;
	z-index: 10;
}
#contentContainer {
	min-height:425px;
}
#col_left {
	float: left;
	width: 270px;
	padding-bottom: 25px;
}
#obloginxy {
	display: none;
	width: 250px;
	height: 189px;
	margin-left: auto;
	margin-right: auto;
	margin-top: 9px;
	position: absolute;
	z-index: 275;
	left: 10px;
	top: 0px;
}
body.onlinebanking #obloginxy {
	display: block;
}
#obloginHeader {
	background-image: url(images/login_header_overlay.png);
	background-repeat: no-repeat;
	height: 43px;
	padding-top: 10px;
}
#obloginHeader h1 {
	font-size: 15px;
	color: #FFFFFF;
	text-align: center;
	margin: 0px;
	padding: 0px;
}
#obloginBody {
}
#obloginFooter {
	background-image: url(images/login_footer_overlay.png);
	background-repeat: no-repeat;
	height: 30px;
}
#onlinebanking {
	height: 110px;
	width: 230px;
	position: absolute;
	z-index: 300;
	left: 0px;
	top: 50px;
	padding-right: 10px;
	padding-left: 10px;
}
#obloginLinks {
	width: 230px;
	text-align: center;
	margin-top: 0px;
}
*:first-child+html #obloginLinks{
	margin-top: -20px;

}
#obloginLinks a {
	text-decoration: none;
}
#obloginLinks a:hover {
	text-decoration: underline;	
}
#mainNav {
	width: 250px;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 35px;
	padding-top: 10px;
}
body.home #mainNav, body.onlinebanking #mainNav {
	padding-top: 200px;
}
#mainNav a {
	cursor: pointer;
	font-size: 13px;
	line-height: 15px;
	font-weight: bold;
	background-color: #e1e1e1;
	background-image: url(images/nav_bg.png);
	background-repeat: no-repeat;
	width: 235px;
	padding-top: 11px;
	padding-bottom: 11px;
	padding-left: 15px;
	text-decoration: none;
	display: block;
}
body.navGroup1 #nav1_btn1 a {
	
}
#mainNav ul {
	list-style-type: none;
	margin-top: 0px;
	padding-top: 0px;
}
#mainNav li {
	padding-top: 0px;
	margin-left: -40px;
	margin-top: 3px;
	margin-bottom: 4px;
}

/* Secondary navigation dropdown styles */

#mainNav li ul lu {
	background-image:none;
}

#nav1_btn1 div, #nav1_btn2 div, #nav1_btn3 div, #nav1_btn4 div, #nav1_btn5 div, #nav1_btn6 div, #nav1_btn7 div {
	display: none;
}
body.navGroup1 #nav1_btn1 div, body.navGroup2 #nav1_btn2 div, body.navGroup3 #nav1_btn3 div, body.navGroup4 #nav1_btn4 div, body.navGroup5 #nav1_btn5 div,body.navGroup6 #nav1_btn6 div, body.navGroup7 #nav1_btn7 div {
	display: block;
}  
#nav1_btn1 div a, #nav1_btn2 div a, #nav1_btn3 div a, #nav1_btn4 div a, #nav1_btn5 div a, #nav1_btn6 div a, #nav1_btn7 div a {
	width: 250px;
	background: none !important;
	text-decoration: none;
	font-size: 11px;
	line-height: 13px;
	font-weight: bold;
	padding-top: 5px;
	padding-bottom: 5px;
	padding-left: 15px;
	text-decoration: none;
	display: block;	
}
#nav1_btn1 div a:hover, #nav1_btn2 div a:hover, #nav1_btn3 div a:hover, #nav1_btn4 div a:hover, #nav1_btn5 div a:hover, #nav1_btn6 div a:hover, #nav1_btn7 div a:hover {
	background: #CCC;
	padding-left: 20px;
}
#nav1_btn1 div ul, #nav1_btn2 div ul, #nav1_btn3 div ul, #nav1_btn4 div ul, #nav1_btn5 div ul, #nav1_btn6 div ul, #nav1_btn7 div ul {
	list-style-type: none;
	margin-top: 0px;
	padding-top: 0px;
}
#nav1_btn1 div ul li, #nav1_btn2 div ul li, #nav1_btn3 div ul li, #nav1_btn4 div ul li, #nav1_btn5 div ul li, #nav1_btn6 div ul li, #nav1_btn7 div ul li {
	padding-top: 0px;
	margin-left: -20px;
	margin-top: 3px;
	margin-bottom: 4px;
}

/* 3er level mainnav dropdowns*/


#mainNav li div ul li a:hover {
	background-color:white;
}


#mainNav li li ul {
  width: 220px;
  height: auto;
  margin: 0px;
  padding: 0px;
	
}

#mainNav li li:hover ul {
}


#mainNav li li li {
	margin:0 0 0 10px;
	padding:0;
	line-height:15px;	
}

#mainNav li li li a:link,#mainNav li li li a:active,#mainNav li li li a:visited  {
	color:#fff;
	font-weight:normal;
} 

#mainNav li li li a:hover  {
	font-weight:normal;
} 


/* End of Secondary navigation styles */

#col_right {
	float: left;
	position: relative;
}
#mainimgContainer {
	display: none;
	height: 253px;
	width: 670px;
	text-align: right;
	position: absolute;
	z-index: 500;
	left: 19px;
	top: 9px;
	overflow: hidden;
}
#mainimgContainer p { /* Created due to the CMS tool wrapping an image in an article with a paragraph tag */
	margin: 0px;
	padding: 0px;	
}
body.home #mainimgContainer, body.home #mainimgColor, body.home #mainimgOverlay, body.home #mainimgContent  {
	display: block;
}
body.banner #mainimgContainer, body.banner #mainimgColor, body.banner #mainimgOverlay, body.banner #mainimgContent  {
	display: block;
}
#mainimgColor {
	display: none;
	height: 253px;
	width: 245px;
	position: absolute;
	z-index: 550;
	left: 19px;
	top: 9px;
}
#mainimgOverlay {
	display: none;
	background-image: url(images/mainimg_overlay.png);
	background-repeat: no-repeat;
	position: absolute;
	z-index: 575;
	left: 19px;
	top: 9px;
	height: 253px;
	width: 670px;
}
#mainimgContent {
	display: none;
	height: 196px;
	width: 175px;
	position: absolute;
	z-index: 600;
	top: 10px;
	left: 19px;
	bottom: 0px;
	vertical-align: middle;
	padding-right: 20px;
	padding-left: 20px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 13px;
	line-height: 15px;
	padding-top: 50px;
}
#mainimgContent a {
	font-style: italic;
	font-weight: bold;
	text-decoration: none;
}
#mainimgContent a:hover {
}
#content1 {
	width: 650px;
	padding-top: 20px;
	margin-left: 30px;
}
body.home #content1, body.banner #content1  {
	width: 640px;
	padding-top: 270px;
	padding-right: 10px;
	margin-left: 30px;
}

/******************/


#content1 h1 {
	font-size: 15px;
	margin-top: 3px;
	margin-bottom: 3px;
	padding-top: 2px;
	padding-bottom: 2px;
}
#content1 h2 {
	font-size: 13px;
	margin-top: 5px;
	margin-bottom: 5px;
	padding-top: 5px;
	padding-bottom: 2px;
	border-bottom-width: 1px;
	border-bottom-style: solid;
}
#content1 h3 {
	font-size: 12px;
	margin-top: 5px;
	margin-bottom: 5px;
	padding-top: 5px;
	padding-bottom: 2px;
	font-weight: bold;
}
#content1 p {
	font-size: 11px;
	margin-top: 5px;
	margin-bottom: 7px;
	padding-top: 2px;
	padding-bottom: 2px;
	line-height: 13px;
}
#content1 ul {
	list-style-type: square;
	margin-top: 3px;
	margin-bottom: 3px;
	padding-top: 3px;
	padding-bottom: 3px;
}
#content1 ul li, #content1 ol li {
	font-size: 11px;
	margin-top: 2px;
	margin-bottom: 2px;
	padding-top: 2px;
	padding-bottom: 2px;
}
#content1 ul li ul li {
	list-style-type: circle;
}

#content1 a {
	text-decoration: none;
}
#content1 a:hover {
	text-decoration: underline;	
}
#features {
	display: none;
	width: 635px;
	margin-left: 30px;
	margin-top: 15px;
	padding-right: 15px;
}
body.features #features {
	display: block;
	height:200px;
}
#features a {
	font-size: 13px;
	text-decoration: none;
}
#features a:hover {
	text-decoration: underline;	
}
#features h1 {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 13px;
	margin-top: 2px;
	margin-bottom: 5px;
	padding-top: 2px;
	padding-bottom: 2px;
	text-align: left;
}
#features ul {
	list-style-type: none;
	margin-top: 3px;
	padding-top: 3px;
	margin-bottom: 3px;
	padding-bottom: 3px;
}
#features li {
	padding-top: 0px;
	margin-left: -30px;
	margin-top: 3px;
	margin-bottom: 4px;
}
.homeFeatures th {
	border-bottom-width: 1px;
	border-bottom-style: dotted;
	border-bottom-color: #999999;
}
#footer {
	height: 45px;
	width: 967px;
	position: relative;
}
#logos {
	display: none;
	height: 50px;
	width: 120px;
	background-image: url(images/ncua_logos.png);
	background-repeat: no-repeat;
	margin-left: 21px;
	margin-bottom: 14px;
	position: absolute;
	z-index: 50;
	left: 5px;
	bottom: 35px;
}
body.logos #logos {
	display: block;
}
#footergraphic {
	width: 948px;
	height: 50px;
	background-image: url(images/footer_overlay.png);
	background-repeat: no-repeat;
	position: absolute;
	z-index: 45px;
	top: 0px;
	left: 10px;
}
#footerbg {
	height: 65px;
	width: 967px;
	background-image: url(images/footerbg.png);
	background-repeat: no-repeat;
	z-index: 35;
}
#footerContent {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	margin-top: 5px;
	padding-bottom: 5px;
	text-align: center;
}
#footerContent a {
	text-decoration: none;	
}
#footerContent a:hover {
	text-decoration: underline;
}

/* Misc styles */

.styledtable {
	font-size: 11px;
}
.odd {
	background-color: #CCC;
}
.even {
	background-color: #ffffff;
}

.styledtable th {
	padding: 5px;
	background-color: #CCC;
	text-align: center;
}

.styledtable th a {
	}
.styledtable th a:hover {
	color:#FFFFFF;
}

.styledtable td {
	padding: 5px;
	text-align: center;
}
.styledtable tr:hover {
	padding: 5px;
	color:#fff;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	background-color: #CCC;
}

.styledtable caption {
	padding: 5px;
	font-size: 11px;
	color: #FFFFFF;
	text-align: left;
	font-weight: bold;
	margin-top: 15px;
}
.clearfloat {
	clear: both;
	height: 0px;
}
:focus {
	outline:none;
}

table.styledtable.bordered {
	border-left: 1px solid #CCC;	
	border-top: 1px solid #CCC;	

}
table.styledtable.bordered td {
	border-right: 1px solid #CCC;	
	border-bottom: 1px solid #CCC;	

}
table.styledtable.bordered th {
	border: 1px solid #CCC;	
}
a.rollover {
	float: left;
	display: block;
	height: 122px;
	width: 200px;
	background-position: 0px 0px;
}
a.rollover:hover {
	background-position: 0px -94px;
}
#protecting {
	background-image: url('images/protect.jpg');
}
#engaging {
	background-image: url('images/engaging.jpg');
}
#convenience {
	background-image: url('images/convenience.jpg');
}
.clearfloat {
	clear: both;
	height: 0px;
	margin: 0px;
	padding: 0px;
}
