/* This CSS sets the template styles and layout for ALL elemnets */
/* updates for common image bully lists, image punch, min height -kj06022011 */
/* --------------------------------------------------------- =BROWSER =NORMALIZATION */

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend/*, table, caption, tbody, tfoot, thead, tr, th, td */ {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
}

ol, ul {
	list-style: none;
}

blockquote, q {
	quotes: none;
}

blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}

/*    
div {border:1px solid #090;}
*/
/* --------------------------------------------------------- =BASE =STYLES */

body {
	background:#fff url(../images/body_tile.gif);
	color: #414141;
	margin: 0;
	padding: 0;
	font-size: 10pt;
	text-align:center;
}

body, table, td, div, input {
	font-family: Tahoma, Arial, Trebuchet, Helvetica, sans-serif;
}

a:link, a:visited {	
	color:#014b93;
	text-decoration: underline;
	}
	
a:hover, a:active {
	color:#014b93;
	text-decoration: none;
	}

h1 {
	margin: 0;
	padding: 0;
	color: #014b93;
	font:normal 1.9em Tahoma, Geneva, sans-serif;
	position:absolute;
	top:45px;
	left:38px;
	}
	
h1.styleguide {
	margin: 0;
	padding: 0;
	color: #014b93;
	font:normal 1.9em Tahoma, Geneva, sans-serif;
	position:relative;
	top:0;
	left:0;
	}
	
.heading {margin:4px 0 0 6px; position:relative;}

.breadCrumbs {margin:0 0 0 20px;}
.breadCrumbs a:link, .breadCrumbs a:visited {
	color:#666;
	text-decoration:none;
}
.breadCrumbs a:hover, .breadCrumbs a:active {
	text-decoration:underline;
}
.breadCrumbs a.selected:link, .breadCrumbs a.selected:visited
	{color:#014b93; text-decoration:underline;}
	
h2 {
	color:#839404;
	font:18pt Georgia, "Times New Roman", Times, serif;
	margin:0;
	padding:0 0 6px 0;
}

h3 {
	color: #ca6400;
	margin: 0 0 6px 0;
	font:normal 1.4em Tahoma, Geneva, sans-serif;
}

h4 {
	color: #104b88;
	margin: 0 0 4px 0;
	font-size: 1em;
}

p {
	padding: 0 0 12px 0;
}

hr {
	background: #000;
  	border: 0;
  	color: #000;
  	height: 1px;
	margin: 10px 0;
	}
	
ol li {
	list-style-type: decimal;
	}
	
table {
	border-collapse: collapse;
	border-spacing: 0;
} /* tables still need 'cellspacing="0"' in the markup */

table {	font-size: 100%; } /* IE inheritance fix */

ins {
	text-decoration: none;
	border-bottom: 1px dotted;
} /* remember to highlight inserts somehow! */

del {
	text-decoration: line-through;
}

/* --------------------------------------------------------- =CLEAR =FLOATS/=FIXS */

.clearfloat {
	clear: both;
	height: 1px;
	}
	
.clear0 {
	height: 0;
	clear: both;
	}

.clearfix:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}

.clearfix {display: inline-block;} /* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;} /* End hide from IE-mac */


/* --------------------------------------------------------- =PAGE WRAPS/=COLUMNS */

.pageWrap {
	background:url(../images/body_bg.gif) repeat-x;
	}

.page {
	width: 960px;
	margin: 0 auto;
	text-align: left;
	background-color:#fff;
	}

.contentL {
	float: left;
	width: 231px;
	display:inline;
	margin-right:9px;
	}
.contentR {
	float: left;
	width: 706px;
	}

.contentWrap {
	margin:9px 0 0 9px;
	background:url(../images/content_bg.gif) repeat-y;
	padding:0 0 65px 0;
}



/* --------------------------------------------------------- =MASTHEAD */
	
.mast {
	background:url(../images/mast_bg.gif) repeat-x;
	}
	
.mastL {
	float: left;
	width: 298px;
	}
	
.mastR {
	float: right;
	width: 500px;
	text-align: right;
	}
	
/* --------------------------------------------------------- =UTILITY */
	
.uti {
	color:#014b93;
	margin:16px 18px 0 0;
	}
	
.uti ul {
	margin: 0;
	padding: 0;
}

.uti li {
	margin: 0;
	padding: 0;
	display: inline;
}

.uti a:link, .uti a:visited {	
	color:#014b93;
	text-decoration: none;
	font-size:9pt;
	}
	
.uti a:hover, .uti a:active {
	color:#014b93;
	text-decoration: underline;
	}

/* --------------------------------------------------------- =SEARCH =AREA */

.searchArea {
	margin:14px 18px 0 0;
}

.searchArea form {
	margin: 0;
	padding: 0;
}

.searchArea input, .searchArea img { vertical-align: middle; }

.searchArea input.appfield1 {
	width: 155px;
	padding:4px;
	border: 1px solid #ccc;
	background:url(../images/search_input_bg.gif) repeat-x;
	color: #999;
	}
* html .searchArea input.appfield1 {height:20px;}

.searchBtn {
	margin-top:3px;
}



/* --------------------------------------------------------- =LOGIN =AREA */

.loginAreaWrapMain {
	width:220px;
	float:left;
	height:224px;
	background:url(../images/olb_bg.gif) bottom no-repeat;
	position:relative;
}
#back .loginAreaWrapMain {
	width:231px;
	height:92px;
	float:none;
	background:url(../images/olb_bg_back.gif) bottom no-repeat;
	border-bottom:1px solid #fff;
}
#back .loginBtn {padding-top:10px;}

.loginAlert {
	position:absolute;
	top:7px;
	right:10px;
}

.loginAreaWrapOB {padding:0;}
.loginOB form {padding:3px 0 0 0;}
.loginOB {position:relative;}
#back .loginOB {
	background:url(../images/olb_ttl_back.gif) repeat-x;
}

.loginCol label {
	display:block;
	font-size:9pt;
	font-weight:normal;
	color:#666;
}

.loginCol * {font-size:8pt; color:#604b20;}
.loginCol {margin:0 0 0 14px;}
.loginCol input.appfield1 {
	font-size:10pt;
	width:176px;
	border:1px solid #999;
	padding:2px 0 2px 2px;
}
* html .loginCol input.appfield1 {height:25px;}

.loginCol a:link, .loginCol a:visited {
	text-decoration:none;
	font-size:8pt;
}
.loginCol a:hover, .loginCol a:active {
	text-decoration:underline;
}

.loginForgot {
	padding:4px 12px 4px 0;
	text-align:right;
}
.loginForgot a:link, .loginForgot a:hover, .loginForgot a:active, .loginForgot a:visited {
	font-size:7pt;
	color:#666;
	text-decoration:underline;
}

.loginCol label.input {
  margin: 5px 0;
  background:#fff url(../images/search_input_bg.gif) repeat-x;
  float: left;
  clear: both;
  border:1px solid #999;
}
.loginCol label.input span {
  position: absolute;
  padding: 7px;
  margin-left: 3px;
  color: #999;
}
.loginCol label.input input, .loginCol label.input textarea, .loginCol label.input select {
  position: relative;
  margin: 0;
  border:1px solid #fff;
  padding: 6px;
  background: transparent;
  font: inherit;
}



/* --------------------------------------------------------- =PRRIMARY =NAV */

.pNav {
	background-color:#fff;
	width:100%;
}
.pNav a:link, .pNav a:visited {	
	text-decoration: none;
	display:block;
	padding:8px 15px;
	font-family:Tahoma, Geneva, sans-serif;
	color:#00338e;
	background:url(../images/nav_bg.gif) no-repeat;
	}
.pNav a:hover, .pNav a:active, a.pNavSelected:link, a.pNavSelected:visited {
	text-decoration: none;
	background:url(../images/nav_on.gif) no-repeat;
	}
.pNav ul {
	margin:0;
	padding:0;
}
.pNav li {
	list-style-image:none;
	list-style-type:none;
	margin:0;
	padding:0;
}


/* --------------------------------------------------------- =HOME =CONTENT */

.home {
	
	}
	
.homeL {
	float: left;
	width: 413px;
	margin:27px 0 0 25px;
	display:inline;
	}
	
.homeR {
	float: left;
	width: 180px;
	margin:27px 0 0 35px;
	display:inline;
	}
	
/* --------------------------------------------------------- =PROMOS */

.promoLrg {
	width:474px;
	height:224px;
	position:relative;
	margin:0 9px 0 0;
	float:left;
}
.prev {
	position:absolute;
	top:0;
	left:0;
	z-index: 100;
}
.next {
	position:absolute;
	top:0;
	right:0;
	z-index: 100;
}

.promoTxt {
	position:absolute;
	top:172px;
	left:60px;
}
.promoTxt h2 {
	font:normal 15pt Arial, Helvetica, sans-serif;
	color:#fff;
	margin:0; padding:0;
}
.promoTxt p {margin:0; padding:0;}
.promoTxt a:link, .promoTxt a:visited {
	color:#ccc;
	text-decoration:none;
}
.promoTxt a:hover, .promoTxt a:active {
	color:#fff;
	text-decoration:underline;
}

.promoSm {
	margin:20px 0 0 15px;
}


/* --------------------------------------------------------- =NEWS/=ALERTS */

.newsArea h2, .quicklinks h2 {
	color:#839404;
	font:15pt Georgia, "Times New Roman", Times, serif;
}
.newsItem h3 {
	color:#014b93;
	font:bold 10pt Tahoma, Arial, Helvetica, sans-serif;
}
.newsItem {
	font-size:9pt;
	color:#484848;
	padding:0 0 18px 0;
	margin:18px 0 0 0;
	background:url(../images/news_div.gif) bottom repeat-x;
	line-height:1.4em;
}
.newsItem:last-child {background:none;}
.newsItem a:link, .newsItem a:visited {color:#36f;}


.quicklinks {
	border-left:1px solid #c2c2c2;
	padding:0 0 0 25px;
	min-height:200px;
}
.quicklinks a:link, .quicklinks a:visited {
	color:#00338e;
	text-decoration:underline;
	font-size:8pt;
	padding:0 0 0 12px;
}
.quicklinks a:hover, .quicklinks a:active {
	text-decoration:none;
}
.quicklinks li {
	margin:0 0 8px 0;
	background:url(../images/bullet.gif) 0 5px no-repeat;
}


/* --------------------------------------------------------- = SITE =CONTENT */

.content {
	padding: 20px 30px 30px 26px;
	min-height:450px;
	line-height:1.5em;
	}
	/*min height is for short pages */
.content ul, .content ol, .homeL ul, .homeL ol
{
	margin: 0 0 0 0;
	padding: 0 0 6px 0;
	}
	
.content ul li, .homeL ul li 
{ 
	padding: 0 0 6px 15px;
	margin:0 0 0 15px;
	}
	
.content ol li, .homeL ol li {
	margin: 0 0 6px 30px;
	}
	/*mixed lists */
.content ul ul, .content ol ol, .homeL ul ul, .homeL ol ol {
	margin-bottom: -6px;
	padding: 6px 0 0 0;
	}
	
.content ul li, .content ol li ul li, .content ol li ul li ol li ul li,
.homeL ul li, .homeL ol li ul li, .homeL ol li ul li ol li ul li 
 {
	background: url(https://www.citynationalcm.com/home/fiFiles/static/images/content_bullet.gif) no-repeat 0 .5em;
	list-style:none;
}


.content ol li, .content ol li ol li {
	background:none;
}
.content ol li ol li {
	background:none;
	list-style:lower-alpha; 
}

ul.logoList, ol.logoList {
	margin: 0 0 0 0;
	padding: 0 0 6px 0;
	}
	
ul.logoList li { 
	padding: 0 0 6px 15px;
	margin:0 0 0 15px;
	}
	
ol.logoList li {
	margin: 0 0 6px 30px;
	}
	/*mixed lists */
ul.logoList ul, ol ol {
	margin-bottom: -6px;
	padding: 6px 0 0 0;
	}
	
ul.logoList li, ol.logoList li ul li, ol.logoList li ul li ol li ul li {
	background: url(https://www.citynationalcm.com/home/fiFiles/static/images/bullet_logo.png) no-repeat 0 .2em;
	list-style:none;
}	

ol.logoList li, ol.logoList li ol li {
	background:none;
}
ol.logoList li ol li {
	background:none;
	list-style:lower-alpha; 
}







.contentImg { /* ensure that there is a width and height attribute on the image in case the WYSIWYG editor assigns a snippet's image a width or height of 0 */
	width:200px;
	height: 200px;
	}
.content img {max-width:500px;}	 /*image punch*/
/* --------------------------------------------------------- =FOOTER */
	
.foot {
	width:960px;
	margin:0 auto;
	border-top:9px solid #fff;
	}
	
.footL {
	float: left;
	width: 400px;
	text-align:left;
	margin:18px 0 0 12px;
	display:inline;
	color:#fff;
	}
.footL a:link, .footL a:visited {
	color:#fff;
	text-decoration:none;
}
.footL a:hover, .footL a:active {
	color:#fff;
	text-decoration:underline;
}

.footR {
	text-align: right;
	float: right;
	width: 400px;
	margin:15px 15px 0 0;
	}
.footR img {
	vertical-align:middle;
	margin:0 0 0 14px;
}
	
	
/* --------------------------------------------------------- =FORMS */

label {
	display: block;
	margin: 2px 0 0 0;
}

	
.appfield1 {
	border: 1px solid #104b88;
	background: #fff;
}

/* --- 	This is your FOCUS style, when you click into an input field --- */
.appfield2 {
	border: 1px solid #9cc323;
	background:#fff;
}

.submitBtn {
	margin-top: 7px;
}

/* --------------------------------------------------------- =TABLES */

table { width: 100%; }

.tableheader {
	background: #104b88;
	color: #fff;
	font-weight: bold;
	}
	
th {
	border-bottom: 1px solid #fff;
	background-color:#e0effd;
	color:#104b88;
	text-align: left;
}
	
.tablecontent1 {
	border-bottom: 1px solid #fff;
	background-color: #efefef;
}
	
.tablecontent2 {
	border-bottom: 1px solid #fff;
	background-color:#fff;
}

/* --------------------------------------------------------- =OTHER */

.faqQ, .faqA { 
	font-weight: bold;
	}

.faqQ { color:#005498; }
.faqA { color:#668172; }
	
.xsmall {
    font-size:.8em; 
	}
.small {
    font-size:.9em;
	}
.medium {
    font-size:1em;
	}
.large {
    font-size:1.1em;
	}
.xlarge{
    font-size:1.2em;
	}

.special3 {
	}
.special2 {
	}
.special1 {
	}

.disclaimer {
	font-style:italic;
	font-weight: bold;
	color: #7e7e7e;
	font-size: 80%;
	line-height: 1.4em;
}
	
.required {
	color: #dd2525;
}

.float_left {
	float:left;
	margin: 0 10px 10px 0;
}
.float_right {
	float:right;
	margin: 0 0 10px 10px;
}
.center {
	text-align:center;
}

#ex_dis{
	 display:none;
	 width:40%;
	 padding:10px;
	 background-color:#FFFFFF;
	 position:absolute;
	 z-index:10000;
	 border:1px solid #3A302F;
	 top: 50px;
	 left: 30%;
	 overflow: hidden;
}

#ex_dis p { 
	text-align:left
}

#alertBox { 
	position: absolute; 
	z-index: 9997;
	top: 22px; 
	left: -300px; 
	background-color: #E0EFFD; 
	color:#00338E;
	border: 1px solid #123974; 
	padding: 2px 8px; 
	width: 350px; 
	display: none;
}


#additionalLoginLinks { 
	display:none;
	position: absolute; 
	z-index: 9996;
	top: 205px; 
	left: 15px; 
	width: 191px;
	background-color: #E0EFFD;  
	border: 1px solid #CFCFCF;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;	
}

*:first-child+html #additionalLoginLinks {
	top:215px;
}

#additionalLoginLinks ul li{ 
	padding: 5px 0px 5px 10px;
	width: 100%;
}
#additionalLoginLinks ul li:hover{ 
	background-color:#BFE0FC;
	border-top: 1px solid #CFCFCF;
	border-bottom: 1px solid #CFCFCF;
	border-right: 1px solid #CFCFCF;
	-webkit-border-top-right-radius: 5px;
	-webkit-border-bottom-right-radius: 5px;
	-moz-border-radius-topright: 5px;
	-moz-border-radius-bottomright: 5px;
	border-top-right-radius: 5px;
	border-bottom-right-radius: 5px;	
}

#additionalLoginLinks a:link, #additionalLoginLinks a:visited { 
	text-decoration: none;
}
#additionalLoginLinks a:hover, #additionalLoginLinks a:active { 
	/* text-decoration: underline; */
}

#additionalLoginLinks ul li.firstAdditionalLogin:hover { 
	border-top-left-radius: 5px;
}
#additionalLoginLinks ul li.lastAdditionalLogin:hover { 
	border-bottom-left-radius: 5px;
}

.tabbed {
	padding-left:15px;
}

#motdLayer {
	position:absolute;
	top: 3px;
	right: 5px !important; 
	z-index:900;
 	width: 400px;
 	overflow:auto;
	filter:alpha(opacity=92); 
	opacity:1;
    border: 3px solid #000;
	background-color: #FFF; 
	padding: 20px;
	color: #00338E;
	font: 10pt arial,sans-serif;
	display: none;
}



#motdLayer a:link, #motdLayer a:visited {
	color: #000;
	text-decoration: underline;
}
#motdLayer a:hover, #motdLayer a:active {
	color: # 000;
	text-decoration: underline;
}

#CMmotdDiv{ /* inherited from old site. Not sure what this does */
	background-color: #ffffff;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10pt;
	font-weight: normal;
	color: #000000;
	text-align: left;
	border: 1px solid #5153CC;
	padding: 10px;
	display:none;
	z-index: 1000;
	width:220px;
	position:absolute;
	top: 10px;
	left: 0px;
}

#motdDiv h2, #CMmotdDiv h2 {
	font-size:12pt;
	}

/* suggested order for properties [ based on mozilla.org ] */
/* 
display
list-style
position
float
clear
width
height
min-width
min-height
margin
padding
border
background [ color, image, repeat, attachment, position, inherit ]
color
font
text-decoration
text-align
vertical-align
white-space
other text
 */