/**********************************************************************************************

	CSS on Sails
	Title: VTCU
	Author: XHTMLized (http://www.xhtmlized.com/)
	Date: October 2009

***********************************************************************************************

	1. BASE
			1.1 Reset
			1.2 Accessibility Navigation & Hide
			1.3 Clearfix
			1.4 Default Styles
			1.5 Image replacement generic

	2. LAYOUT
			2.1 Structure
			2.2 Header
			2.3 Navigation
			2.4 Content
			2.5 Sidebar
			2.6 Footer

***********************************************************************************************/


/* 1. BASE
-----------------------------------------------------------------------------------------------
===============================================================================================*/


/* 1.1 Reset
-----------------------------------------------------------------------------------------------*/

html, body, div, span, object, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, samp, small, strong, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; font-size: 100%; vertical-align: baseline; background: transparent; }
q { quotes: none; }
q:before, q:after { content: ""; content: none; }
a, ins, del { text-decoration: none; }
table { border-collapse: collapse; border-spacing: 0; }
th, td { vertical-align: top; }
th { text-align: left; }

/* 1.2 Accessibility Navigation & Hide
-----------------------------------------------------------------------------------------------*/

ol.accessibility-nav, .hide { position: absolute; top: -999em; left: -999em; height: 1px; width: 1px; }


/* 1.3 Clearfix
-----------------------------------------------------------------------------------------------*/

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


/* 1.4 Default Styles
-----------------------------------------------------------------------------------------------*/
html { height: 100%; font-size: 1em; }
body { background: #b2c9d9 url(/Images/bg_body.png) repeat-x; color: #343434; font: 75%/1.33 "Arial", "Helvetica", sans-serif; text-align: center; height:100%;}
hr { display: none; }
strong { font-weight: bold; }
em { font-style: italic; }
del { text-decoration: line-through; }
th { font-weight: normal; }
address, cite, dfn { font-style: normal; }
li { list-style: none; }
abbr, acronym { border-bottom: 1px dotted #999; cursor: help; }
input, textarea, select { font-family: "Arial", "Helvetica", sans-serif; }
a, a:visited, a:hover, a:active { color: #ec1460; text-decoration: none; }
a:hover, a:active { text-decoration: underline; }

/* 1.5 Image replacement generic
-----------------------------------------------------------------------------------------------*/
.ir { font-size: 1em; margin: 0; overflow: hidden; position: relative; }
.ir span { background: url(/Images/txt_all.png) no-repeat; display: block; height: 100%; left: 0; position: absolute; top: 0; width: 100%; z-index: 1; }
.ir a { cursor: pointer; display: block; height: 100%; width: 100%; }
.ir a span { cursor: pointer; }


/* 2. LAYOUT
-----------------------------------------------------------------------------------------------
===============================================================================================*/


/* 2.1 Structure
-----------------------------------------------------------------------------------------------*/
.swirl { height: 100%; background: url(/Images/bg_swirl.png) top center no-repeat; margin:0; padding:0;}
.container { min-height:100%; width: 955px; padding:0 12px 10px 12px; background: url(/Images/bg_container.png) repeat-y; position: relative; margin: 0 auto; text-align: left; }
.inner-container { background:#fff; padding:14px 0 0 0; height:100%;}
#aspnetForm { height:100%; } /* .Net Fix */
.content-wrapper { padding: 13px 16px 24px 13px; margin-top: 3em; background: url(/Images/bg_content_wrapper.png) no-repeat; }
.content { width: 706px; float: left; }
.home .content-wrapper { padding: 11px 16px 25px 14px; margin-top: 0; background: none; }
.home .content { width: 702px; }
.sidebar { width: 209px; float: right; }

/* 2.2 Header
-----------------------------------------------------------------------------------------------*/
.header { position: relative; height: 90px; background: url(/Images/bg_header.png) 191px 15px no-repeat; }
.header .site-name,
.header .site-name span { display: block; overflow: hidden; width: 142px; height: 68px; }
.header .site-name { position: absolute; top: 5px; left: 24px; }
.header .site-name span { background: url('../images/logo2.png') no-repeat; position: absolute; top: 0; left: 0; z-index: 10; }
.header a.site-name span { cursor: pointer; }
.header .txt-slogan { position: absolute; top: -7px; right: 15px; color: #083f88; width: 67px; height: 89px; text-indent: -9999px; }
.header .txt-slogan span { background: url(../images/icn_emblem-members2.png) no-repeat 0 0; }

/* 2.3 Navigation
-----------------------------------------------------------------------------------------------*/
.navigation { height: 40px; padding-right: 15px; background: #024089 url(/Images/bg_navigation.png) repeat-x; }

/* Main navigation */
.main-nav { height: 40px; width: 680px; float: left; }
.main-nav li { float: left; }
.main-nav a { color: #fff; display: block; height: 40px; line-height: 40px; overflow: hidden; position: relative; text-align: center; text-decoration: none; }
.main-nav a span { background: url(/Images/txt_main_nav.png) no-repeat; display: block; height: 100%; left: 0; position: absolute; top: 0; width: 100%; z-index: 1; cursor: pointer; }
.main-nav a:hover { background-color: #024089; color: #fff; }
.main-nav .nav01 { width: 67px; }
.main-nav .nav02 { width: 84px; }
.main-nav .nav03 { width: 103px; }
.main-nav .nav04 { width: 122px; }
.main-nav .nav05 { width: 116px; }
.main-nav .nav06 { width: 81px; }
.main-nav .nav07 { width: 107px; }
.main-nav .nav01:hover span { background-position: 0 -40px; }
.main-nav .current .nav01 span { background-position: 0 100%; }
.main-nav .nav02 span { background-position: -67px 0; }
.main-nav .nav02:hover span { background-position: -67px -40px; }
.main-nav .current .nav02 span { background-position: -67px 100%; }
.main-nav .nav03 span { background-position: -151px 0; }
.main-nav .nav03:hover span { background-position: -151px -40px; }
.main-nav .current .nav03 span { background-position: -151px 100%; }
.main-nav .nav04 span { background-position: -254px 0; }
.main-nav .nav04:hover span { background-position: -254px -40px; }
.main-nav .current .nav04 span { background-position: -254px 100%; }
.main-nav .nav05 span { background-position: -376px 0; }
.main-nav .nav05:hover span { background-position: -376px -40px; }
.main-nav .current .nav05 span { background-position: -376px 100%; }
.main-nav .nav06 span { background-position: -492px 0; }
.main-nav .nav06:hover span { background-position: -492px -40px; }
.main-nav .current .nav06 span { background-position: -492px 100%; }
.main-nav .nav07 span { background-position: -573px 0; }
.main-nav .nav07:hover span { background-position: -573px -40px; }
.main-nav .current .nav07 span { background-position: -573px 100%; }

/* Main navigation second level */
.main-nav ul { position: absolute; left: 12px; background: #fff; width: 955px; }
.main-nav ul a { padding: 10px 14px 2px 14px; height: auto; line-height: 1.0; position: static; color: #1b5fa2; font-size: 1.17em; background: url(/Images/ico_all.png) 0 -518px no-repeat; }
.main-nav ul a span { background: none; }
.main-nav ul .first a { background: none; }
.main-nav ul .current a, .main-nav ul a:hover { background-color: transparent; color: #ef3175; }

/* Search & Font size */
.navigation .tools { float: right; width: 210px; margin-top: 9px; }
.navigation .search { float: left; height: 25px; }
.navigation .search .text { display: block; float: left; margin-top: 1px; padding: 2px 5px 0 13px; width: 87px; height: 19px; border: 0; background: #fff url(/Images/bg_search_text.png) no-repeat; color: #3b3b3b; }
.navigation .search .ffmac { padding-top: 4px; height: 17px; }
.navigation .search .submit { display: block; float: left; }
.navigation .font-size { float: right; width: 58px; height: 21px; margin-top: 1px; }
.navigation .font-size li { float: left; }
.navigation .font-size a { display: block; height: 21px; line-height: 21px; overflow: hidden; position: relative; background: #d1e3f0; color: #04438c; text-align: center; text-decoration: none; }
.navigation .font-size a span { background: url(/Images/txt_font_size.png) no-repeat; display: block; height: 100%; left: 0; position: absolute; top: 0; width: 100%; z-index: 1; cursor: pointer; }
.navigation .font-size a:hover { background-color: #b2c9d9; color: #04438c; }
.navigation .font-size a.increase { width: 32px; }
.navigation .font-size a.decrease { width: 26px; }
.navigation .font-size .increase:hover span { background-position: 0 -21px; }
.navigation .font-size .decrease span { background-position: -32px 0; }
.navigation .font-size .decrease:hover span { background-position: -32px -21px; }

/* 2.4 Content
-----------------------------------------------------------------------------------------------*/

/* Promo */
.promo { position: relative; height: 282px; margin-bottom: 12px; overflow:hidden; }
.promo .tab { height: 282px; }
.promo .tab img { display: block; }
.promo .ui-tabs-hide { display: none; }
.promo .nav { position: absolute; right: 24px; bottom: 24px; z-index: 100; display: none; }
.promo .nav li { float: left; margin-left: 5px; }
.promo .nav a { display: block; width: 24px; height: 24px; line-height: 24px; color: #fff; background: url(/Images/bg_promo_nav.png) no-repeat; text-align: center; font-weight: bold; }
.promo .nav a:hover, .promo .nav .ui-tabs-selected a { text-decoration: none; background-position: left bottom; }

/* Home Columns */
.home-cols { margin-bottom: 3px; }
.home-col { float: left; width: 223px; line-height: 1.27; }
.home-col-middle { width: 226px; margin: 0 14px; }
.content .home-col h2 { color: #ef1360; font-weight: normal; font-size: 1.33em; padding: 0 15px 8px 15px; margin-bottom: 8px; border-bottom: 1px solid #e8e8e8; }
.home-col ul { margin: 5px 5px 5px 15px; }
.home-col li { font-size: 0.92em; margin-bottom: 4px; padding-left: 22px; background: url(/Images/ico_all.png) 0 4px no-repeat; }
.home-col .big li { background-position: 4px -96px; margin-bottom: 12px; }
.home-col li a { color: #343434; }

/* Boxes */
.box { float: left; width: 224px; line-height: 1.27; padding-top: 6px; background: #eaf1f6 url(/Images/bg_home_box-top.png) no-repeat; position: relative; }
.box .inner { padding: 3px 19px 10px 19px; background: url(/Images/bg_home_box-bottom.png) left bottom no-repeat }
.box .inner .image { margin: -3px -19px 0 -19px; }
.box-middle { background-position: top right; width: 224px; margin: 0 14px; }
.box-middle .inner { background-position: bottom left; }
.box h3 { color: #1c4588; font-weight: normal; font-size: 1.58em; margin-bottom: 16px; }
.box p { font-size: 0.92em; }
.box .button { margin: 12px 0 0 -4px; }
	.box .button a{ display:block; position:relative; height:23px; text-indent: -9999px; }
	.box .button a span { display:block; position:absolute; top:0; left:0; height:23px; }
	.box .button a:hover span { background-position:0 -23px; cursor:pointer; }
	/* specific buttons */
	.download-here .button a{
		width:107px;
		}
		.download-here .button span{
			background:url('/images/btn_download2.png') 0 0 no-repeat;
			width:107px;
			}
	.read-more .button a{
		width:87px;
		}
		.read-more .button span{
			background:url('/images/btn_read_more2.png') 0 0 no-repeat;
			width:87px;
			}

/* Main title */
.main-title { position: relative; width: 706px; height: 91px; background: #578fc0 url(/Images/bg_main_title.jpg) no-repeat; margin: 0 0 16px -3px; }
.main-title .inner { position: absolute; left: 9px; bottom: 9px; width: 680px; }
.main-title h1 { color: #fff; font-size: 3.17em; font-weight: normal; line-height: 1.0; }
.main-title p { font-size: 1.33em; color: #fff; line-height: 1.0; }

/* Intro */
.intro { padding-bottom: 10px; min-height: 50px; margin: -6px 0 9px 0; border-bottom: 1px solid #e8e8e8; color: #535353; font-size: 1.25em; }

/* Boxes 2 */
.box2-row { padding-bottom: 28px; border-bottom: 1px solid #e8e8e8; margin-bottom: 14px; }
.box2-row .box2 { float: left; width: 223px; } 
.box2-row .box2-middle { margin: 0 15px 0 17px; }
.box2-row .box2 img { display: block; margin-bottom: 14px; }
.box2-row .box2 h2 { font-size: 1.25em; font-weight: normal; margin-bottom: 0.25em; }
.box2-row .box2 h2 a { color: #023d7d; }
.box2-row .box2 p { font-size: 0.92em; }
.box2-row .box2 p.more { font-size: 1.09em; margin-top: 0.75em; }
.box2-row .box2 p.more a { color: #4c89be; padding-left: 10px; background: url(/Images/ico_all.png) 0 -566px no-repeat; }

/* Secondary navigation */
.sec-nav { float: left; width: 165px; border-top: 1px solid #e1e1e1; }
.sec-nav li { border-bottom: 1px solid #e1e1e1; }
.sec-nav a { display: block; padding: 5px 5px 6px 29px; width: 131px; color: #343434; font-size: 0.92em; background: url(/Images/ico_all.png) 7px 7px no-repeat; }
.sec-nav .current a, .sec-nav a:hover { text-decoration: none; background: #e5edf2 url(/Images/ico_all.png) 8px -193px no-repeat; }

/* Content right column */
.content-col { float: right; width: 492px; padding: 0 18px 55px 0; }
.content-wrapper-fullwidth .content-col { width:695px; padding:0 0 55px 8px; }

/* Content tabs */
.tabs .ui-tabs-hide { display: none; }
.tabs .nav { border-bottom: 1px solid #bfcedd; margin:0; } 
.tabs .nav li { float: left; padding:0; background:none; }
.tabs .nav a { display: block; float: left; padding: 7px 11px 6px 11px; color: #545454; font-size: 1em; font-weight: bold; border: 1px solid #d9d9d9; border-bottom: 0; background: #f4f4f4 url(/Images/bg_tabs_nav.png) bottom repeat-x; margin-right: 3px; }
.tabs .nav a:hover { color: #185da8; text-decoration: none; }
.tabs .nav .ui-tabs-selected a { color: #185da8; position: relative; margin-bottom: -1px; padding-bottom: 7px; border-color: #aabed2; background: #fff url(/Images/bg_tabs_nav_current.png) top repeat-x; }
.tabs .tab { padding-top: 15px; background: #fff; }
.tabs .tab .top { border-bottom: 1px solid #d9d9d9; margin-bottom: 15px; padding-bottom: 12px; }
.tabs .tab .top p { margin: 0; }
.tabs .tab h2 { color: #ec1460; font-size: 1.33em; font-weight: normal; margin-bottom: 10px; }
.tabs .tab h3 { margin-bottom: 3px; }
.tabs .tab p { margin-bottom: 1.15em; }
.tabs .tab img.right { float: right; display: block; margin: 5px 0 26px 26px; }

	/* tabs wysiwyg styles */
	.tabs ul{ margin:0 0 18px;	}
		.tabs ul li{
			background:url('/images/modules/generic/module-list-bullet.gif') 19px 7px no-repeat;
			padding:0 0 0 30px;
			}
	.tabs ol{margin:0 0 18px 35px;}
		.tabs ol li{
			list-style:decimal;
			list-style-position:outside;
			}
	
	.tabs table{
		margin:0 0 29px;
		width:100%; /* Free to tweak this if table behaving odd. */
		}
		.tabs table caption{
			font-style:italic;
			margin:0;
			padding:0 0 0.57em;
			}
		.tabs th{
			font-weight:bold;
			padding:5px 4px;
			border-bottom:1px solid #767676;
			vertical-align:bottom;
			}
		.tabs td{
			padding:5px 4px;
			border-bottom:1px solid #bfbfbf;
			}
		.tabs .tab table p{margin:0;}

/* Terms */
.content .terms { font-size: 0.92em; border-top: 1px solid #d9d9d9; padding-top: 12px; }
.content .terms h4 { font-weight: normal; }
.content .terms ol { font-style: italic; margin: 2px 0 0 20px; }
.content .terms ol li { list-style: decimal; }
.content .terms a,
.content .terms a:link,
.content .terms a:visited {
	color: #343434;
	text-decoration: underline;
}
.content .terms a:hover {
	color: #ec1460;
}

/* Apply */
.apply-links { padding-bottom: 2px; border-bottom: 1px solid #d9d9d9; margin-bottom: 12px; }
.apply-links li { margin-bottom: 20px; }
.apply-links .icon { display: block; float: left; margin: 6px 0 0 2PX; }
.apply-links a { color: #343434; }
.apply-links h3 { margin: 0 0 2px 55px; }
.apply-links p { margin: 0 0 0 55px; }

/* More links */
.more-links { margin-bottom: 20px; }
.more-links li { padding-left: 55px; background: url(/Images/ico_all.png) 11px -95px no-repeat; margin-bottom: 8px; }
.more-links a { color: #343434; }

/* 2.5 Sidebar
-----------------------------------------------------------------------------------------------*/
.sidebar .txt-bsb { width: 209px; height: 42px; margin-bottom: 12px; }
.sidebar .txt-bsb span { background-position: 0 -13px; }
.sidebar .txt-ib { width: 131px; height: 19px; }
.sidebar .txt-ib span { background-position: 0 -121px; }
.sidebar .txt-toolkit, .sidebar .txt-quicklinks { width: 209px; height: 33px; }
.sidebar .txt-toolkit span { background-position: 0 -55px; }
.sidebar .txt-quicklinks span { background-position: 0 -88px; }
.sidebar .toolkit { margin-bottom: 12px; }
.sidebar .toolkit .dropdowns { padding: 15px 16px 10px 14px; background: #fafbfc url(/Images/bg_sidebar.png) left bottom no-repeat; }
.sidebar .toolkit .dropdowns li { margin-bottom: 10px; padding: 5px 0 5px 38px; background: url(/Images/ico_all.png) 0 -336px no-repeat; height: 1.5em; }
.sidebar .toolkit .dropdowns select { font-size: 0.92em; color: #313131; width: 140px; }
.sidebar .toolkit .dropdowns li.downloads { background-position: 0 -374px; }
.sidebar .toolkit .dropdowns li.rates { background-position: 0 -414px; }
.sidebar .toolkit .dropdowns li.calculators { background-position: 0 -451px; }
.sidebar .toolkit .dropdowns li.connection,
.sidebar .toolkit .dropdowns li.joinOnline { height: 43px; margin-bottom: 5px; padding: 5px 0 0 0; background-image: none; /* background-position: 0 -488px; */ }
.sidebar .toolkit .dropdowns li.connection a { display: block; width: 163px; height: 43px; font-size: 1.09em; color: #343434; padding-left: 16px; text-indent: -9999px; background: url(/Images/btn_footyConnection.gif) 0 0 no-repeat; }
.sidebar .toolkit .dropdowns li.joinOnline a { display: block; width: 163px; height: 43px; font-size: 1.09em; color: #343434; padding-left: 16px; text-indent: -9999px; background: url(/Images/btn_joinOnline.gif) 0 0 no-repeat; }
.sidebar .internet-banking { padding: 15px 18px 12px 14px; background: url(/Images/bg_internet_banking.png) bottom repeat-x; }
.sidebar .internet-banking .buttons { float: right; }
.sidebar .internet-banking .buttons li { float: left; margin-left: 3px; }
.sidebar .internet-banking .buttons li img { display: block; }

/* Quicklinks */
.sidebar .quicklinks { padding: 12px 15px 12px 15px; background: url(/Images/bg_sidebar.png) right bottom no-repeat; }
.sidebar .quicklinks li { padding-left: 21px; background: url(/Images/ico_all.png) 0 -196px no-repeat; margin-bottom: 6px; }
.sidebar .quicklinks li a { color: #343434; font-size: 1.09em; }
.sidebar .award { padding-top :20px;}

/* 2.6 Footer
-----------------------------------------------------------------------------------------------*/
.footer { clear: both; color: #909090; font-size: 0.92em; padding: 8px 0 24px 0; border-top: 1px solid #d9d9d9; margin: 0 14px 0 17px; }
.footer a { color: #909090; }
.footer .delimiter { margin: 0 4px; }
.footer .copy { float: left; clear:both; width:450px; }
.footer ul { float: right; padding-right: 5px; }
.footer li { display: inline; margin-left: 4px; }
.footer li a { font-weight: bold; padding-left: 8px; background: url(/Images/ico_all.png) 0 -256px no-repeat; color: #909090; }
.footer .greentick { position: relative; float: right; margin-left: 5px; }

body.popup {
	background-color: #fff;
	text-align: left;
}

/* 2.7 Popup Window 
-----------------------------------------------------------------------------------------------*/
.popup .content {
	width: 100%;
}

	.popup .content-wrapper {
		margin-top: 0;
	}

	.popup .inner-container {
		height: auto; 
	}
	.popup .main-title {
		width: auto;
		background-image: none;
	}
	.popup h1 {
		color: #176db1;
		font-size: 2em;
	}

	.popup .content-col {
		float: none;
		width: auto;
	}
	
/* 2.8 Membership Applications
-----------------------------------------------------------------------------------------------*/
.membership-application {
	margin-top: 0;
}
	.membership-application .content {
		width: 100%;
	}
	.membership-application .main-title {
		width: 100%;
		background-image: url(/images/bg_main_title-wide.jpg);
	}
	.membership-application .content-col {
		float: none;
		width: 100%;
	}
	.membership-application h2 {
		padding-top: 10px;
		color: #023d7d;
		border-top: solid 1px #e8e8e8;
		font-weight: normal;
		font-size: 1.3em;
	}